.help-menu{position:fixed;top:0;right:-300px;width:300px;height:100%;background:var(--color-white);box-shadow:-2px 0 5px #0000001a;transition:right .3s ease;z-index:1000;overflow-y:auto}.help-menu.open{right:0}.help-content{padding:20px}.close-button{position:absolute;top:10px;left:10px;background:none;border:none;font-size:18px;cursor:pointer}.help-tab{position:fixed;top:50%;right:0;width:40px;height:40px;background:var(--color-blue);color:var(--color-white);display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px 0 0 5px;z-index:1001;transition:right .3s ease}.help-menu.open+.help-tab{right:300px}.help-menu-toggle{position:absolute;top:1rem;left:-3rem;background-color:var(--color-blue);color:var(--color-white);border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.help-menu-toggle:hover{background-color:var(--color-purple)}.help-menu-content{margin-top:2rem}.dictionary input{width:100%;padding:.5rem;margin-bottom:.5rem;border:1px solid #ccc;border-radius:4px}.dictionary button{background-color:var(--color-blue);color:var(--color-white);border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.dictionary button:hover{background-color:var(--color-purple)}.definition{padding:15px;margin-top:10px;font-size:1.2em;line-height:1.5;color:#333}.definition h3{color:var(--color-red);font-size:1.2em;margin-bottom:10px}.definition p{color:var(--color-black);margin:5px 0;font-size:1em;line-height:1.5}.definition ol{padding-left:20px}.definition ol li{margin-bottom:10px}:root{--color-blue: #4A90E2;--color-peach: #D7E0F4;--color-green: #50E3C2;--color-orange: #F5A623;--color-purple: #7D3C98;--color-yellow: #F1C40F;--color-red: #B8E0F9;--color-white: #ECF0F1;--color-black: #2C3E50}body{margin:0;padding:0;font-family:Arial,sans-serif;background-color:var(--color-white);color:var(--color-black)}h1,h2,h3{color:var(--color-blue);margin:.5em 0}a{text-decoration:none;color:var(--color-pink)}a:hover{color:var(--color-peach)}.navbar{background-color:var(--color-blue);color:var(--color-white);padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center}.navbar-brand a{color:var(--color-yellow);text-decoration:none;font-size:1.8rem;font-weight:700;transition:color .2s}.navbar-brand a:hover{color:var(--color-peach)}.navbar-links{list-style:none;margin:0;padding:0;display:flex;gap:1.5rem}.navbar-links a{color:var(--color-white);text-decoration:none;font-size:1rem;font-weight:500;transition:color .2s}.navbar-links a:hover{color:var(--color-peach);text-decoration:underline}.exercices-details-page{padding:20px;max-width:800px;margin:20px auto;background-color:var(--color-white);border-radius:8px;box-shadow:0 2px 10px #0000001a;font-family:Arial,sans-serif;color:#333}.exercices-details-page h1{color:var(--color-blue);text-align:center;margin-bottom:30px;font-size:2.2em}.exercice-details-card{background-color:var(--color-white);border:1px solid #ddd;border-radius:8px;padding:25px;margin-bottom:30px}.exercice-details-card h2{color:#333;margin-bottom:15px;font-size:1.8em}.exercice-details-card p{margin-bottom:10px;line-height:1.6}.exercice-details-card strong{color:#555}.tags-container{margin-top:15px;display:flex;flex-wrap:wrap;gap:8px}.tag{background-color:var(--color-peach);color:var(--color-blue);padding:5px 10px;border-radius:15px}.interaction-section{background-color:var(--color-white);padding-top:20px;border-top:1px solid var(--color-blue)}.interaction-section h3{color:var(--color-blue);margin-bottom:20px}.qcm-options{margin-bottom:20px}.qcm-options label{display:block;margin-bottom:10px;font-size:1.1em;cursor:pointer;padding:8px 0;border-bottom:1px dashed #eee}.qcm-options label:last-child{border-bottom:none}.qcm-options input[type=radio]{margin-right:10px;transform:scale(1.2)}.submit-button{background-color:var(--color-blue);color:#fff;padding:12px 25px;border:none;border-radius:5px;font-size:1.1em;cursor:pointer;transition:background-color .3s ease}.submit-button:hover{background-color:var(--color-green)}.feedback-message{margin-top:20px;padding:10px 15px;border-radius:5px;font-weight:700;text-align:center}.feedback-message.correct{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.feedback-message.incorrect{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.loading-message,.error-message,.no-exercice-message{text-align:center;padding:20px;font-size:1.2em;color:#555}.error-message{color:#dc3545}.result-popup-overlay{position:fixed;inset:0;background:#00000080;z-index:1000;display:flex;align-items:center;justify-content:center}.result-popup{background:var(--color-white);border-radius:16px;padding:40px 32px 32px;box-shadow:0 8px 32px #0000002e;text-align:center;min-width:320px;position:relative}.result-popup h2{margin-bottom:24px;color:var(--color-green)}.circular-progress{position:relative;width:140px;height:140px;margin:0 auto 20px}.circular-progress svg{transform:rotate(-90deg)}.progress-bg{stroke:var(--color-peach);stroke-width:12}.progress-bar{stroke:var(--color-green);stroke-width:12;stroke-linecap:round;transition:stroke-dasharray .7s cubic-bezier(.4,2,.6,1)}.progress-text{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2.2em;color:var(--color-green);font-weight:700}.result-popup .close-btn{margin-top:24px;background:var(--color-green);color:#fff;border:none;border-radius:8px;padding:10px 28px;font-size:1.1em;cursor:pointer;transition:background .2s}.result-popup .close-btn:hover{background:var(--color-blue)}.exercices-container{max-width:1200px;margin:40px auto;padding:20px;background-color:var(--color-white);border-radius:8px;box-shadow:0 4px 12px #0000000d}.exercices-container h1{text-align:center;color:var(--color-black);margin-bottom:30px;font-size:2.5em;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.exercices-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:25px;padding:10px}.exercice-card{background-color:var(--color-white);cursor:pointer;border:1px solid var(--color-blue);border-radius:10px;padding:25px;box-shadow:0 4px 10px #00000014;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out;display:flex;flex-direction:column;justify-content:space-between}.exercice-card:hover{transform:translateY(-5px);background-color:var(--color-peach);box-shadow:0 6px 15px #0000001f}.exercice-card:hover h2{color:var(--color-blue)}.exercice-card h2{color:var(--color-purple);font-size:1.8em;text-align:center;margin-top:0;margin-bottom:15px;border-bottom:2px solid var(--color-purple);padding-bottom:10px}.exercice-card p{color:var(--color-black);line-height:1.6;margin-bottom:10px}.exercice-card p strong{color:#333}.tags{margin-top:15px}.tag{display:inline-block;background-color:var(--color-peach);color:var(--color-blue);padding:5px 10px;border-radius:5px;font-size:.85em;margin-right:8px;margin-bottom:8px;border:1px solid var(--color-yellow)}.loading-message,.error-message,.no-exercices-message{text-align:center;font-size:1.2em;color:var(--color-black);margin-top:50px}.error-message{color:var(--color-red);font-weight:700}.login-page{display:flex;flex-direction:column;min-height:100vh;background-color:var(--color-white)}.login-container{flex-grow:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.login-container h2{color:#333;margin-bottom:30px;font-size:2.2em}.login-form{background-color:#fff;padding:40px;border-radius:8px;box-shadow:0 4px 15px #0000001a;width:100%;max-width:400px;box-sizing:border-box}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:#555;font-weight:700}.form-group input[type=email],.form-group input[type=password]{width:100%;padding:12px;border:1px solid #ddd;border-radius:5px;font-size:1em;box-sizing:border-box}.form-group input:focus{border-color:var(--color-blue);outline:none;box-shadow:0 0 0 3px var(--color-peach)}.login-button{width:100%;padding:12px;background-color:var(--color-blue);color:#fff;border:none;border-radius:5px;font-size:1.1em;font-weight:700;cursor:pointer;transition:background-color .3s ease}.login-button:hover{background-color:var(--color-green)}.error-message{color:#dc3545;text-align:center;margin-bottom:15px;font-weight:700}.user-list-container{padding:30px;margin:30px auto;max-width:600px;background-color:var(--color-white);border-radius:10px;box-shadow:0 4px 15px #0000001a;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#333}.user-list-container h2{text-align:center;color:var(--color-green);margin-bottom:25px;font-size:2.2em;font-weight:600}.user-list{list-style:none;padding:0;margin:0}.user-list-item{background-color:var(--color-white);border:1px solid #e0e0e0;border-radius:8px;margin-bottom:15px;padding:15px 20px;display:flex;align-items:center;transition:all .3s ease}.user-list-item:hover{background-color:var(--color-peach);border-color:var(--color-green);transform:translateY(-3px);box-shadow:0 6px 12px #00000014}.user-list-item a{text-decoration:none;color:#333;font-size:1.1em;font-weight:500;flex-grow:1;display:block}.user-list-item a:hover{color:var(--color-blue)}.user-list-container.error-message{color:var(--color-red);text-align:center;font-weight:700}.user-profile-simple-container{padding:20px;border:1px solid #ddd;border-radius:8px;max-width:400px;margin:20px auto;box-shadow:0 2px 4px #0000001a;background-color:var(--color-white);font-family:Arial,sans-serif}.user-profile-simple-container h2{color:#333;margin-bottom:15px;text-align:center}.user-profile-simple-container p{margin-bottom:8px;line-height:1.5}.user-profile-simple-container strong{color:#555}
