.quizzes-container{max-width:1400px;margin:0 auto;padding:30px 20px;font-family:Montserrat,Verdana,sans-serif}@media (max-width:768px){.quizzes-container{padding:20px 15px}}.quizzes-header{text-align:center;margin-bottom:50px}@media (max-width:768px){.quizzes-header{margin-bottom:40px}}.quizzes-title{color:#171717;margin-bottom:20px;font-size:3rem;font-weight:900}.quizzes-title span{color:#f36e2b}@media (max-width:768px){.quizzes-title{font-size:2.2rem}}.quizzes-subtitle{color:#8f8f8f;max-width:800px;margin:0 auto;font-size:1.4rem;line-height:1.6}@media (max-width:768px){.quizzes-subtitle{font-size:1.1rem}}.stats-section{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px;margin-bottom:50px;display:grid}@media (max-width:768px){.stats-section{grid-template-columns:1fr;gap:20px;margin-bottom:40px}}.stat-card{background:#fff;border:1px solid #f0f0f0;border-radius:15px;align-items:center;padding:30px;transition:all .3s;display:flex;box-shadow:0 4px 15px #00000014}.stat-card:hover{border-color:#f36e2b;transform:translateY(-8px);box-shadow:0 12px 30px #0000001f}@media (max-width:768px){.stat-card{padding:25px}}.stat-card .stat-icon-container{border-radius:15px;flex-shrink:0;justify-content:center;align-items:center;width:60px;height:60px;margin-right:20px;display:flex}.stat-card .stat-icon-container.orange{color:#f36e2b;background:#fff8f2}.stat-card .stat-icon-container.green{color:#28a745;background:#f0fff4}.stat-card .stat-icon-container.purple{color:#6f42c1;background:#f5f0ff}.stat-card .stat-icon-container svg{width:30px;height:30px}.stat-card .stat-info .stat-value{color:#333;margin-bottom:5px;font-size:2.2rem;font-weight:800}@media (max-width:768px){.stat-card .stat-info .stat-value{font-size:1.8rem}}.stat-card .stat-info .stat-label{color:#666;font-size:1.1rem;font-weight:500}.create-quiz-section{text-align:center;margin-bottom:50px}@media (max-width:768px){.create-quiz-section{margin-bottom:40px}}.create-quiz-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#f36e2b 0%,#e55a1a 100%);border:none;border-radius:50px;align-items:center;gap:12px;padding:18px 45px;font-size:1.3rem;font-weight:600;transition:all .3s;display:inline-flex;box-shadow:0 6px 20px #f36e2b4d}.create-quiz-btn:hover{background:linear-gradient(135deg,#e55a1a 0%,#d44a0a 100%);transform:translateY(-3px)scale(1.05);box-shadow:0 8px 25px #f36e2b66}.create-quiz-btn svg{width:24px;height:24px}@media (max-width:768px){.create-quiz-btn{padding:15px 35px;font-size:1.1rem}}.quizzes-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:35px;padding:10px;display:grid}@media (max-width:768px){.quizzes-grid{grid-template-columns:1fr;gap:30px}}@media (min-width:1200px){.quizzes-grid{grid-template-columns:repeat(3,1fr)}}.quiz-card{z-index:1;background:#fff;border:1px solid #f0f0f0;border-radius:18px;padding:20px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);position:relative;overflow:hidden;box-shadow:0 6px 20px #00000014}.quiz-card:before{content:"";z-index:-1;opacity:0;background:linear-gradient(135deg,#f36e2b08 0%,#28a74508 100%);transition:opacity .4s;position:absolute;inset:0}.quiz-card:hover{border-color:#f36e2b;transform:translateY(-12px)scale(1.02);box-shadow:0 20px 40px #00000026}.quiz-card:hover:before{opacity:1}.quiz-card-header{background:linear-gradient(135deg,#f36e2b05 0%,#fff0 100%);padding:0 10px 10px}@media (max-width:768px){.quiz-card-header{padding:0 10px 10px}}.quiz-card-title{color:#2c3e50;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:15px;font-size:22px;font-weight:800;line-height:1.3;transition:color .3s;display:-webkit-box;overflow:hidden}.quiz-card:hover .quiz-card-title{color:#f36e2b}.quiz-card-description{color:#7f8c8d;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:20px;font-size:.95rem;line-height:1.6;display:-webkit-box;overflow:hidden}.quiz-card-info{color:#888;background:#f8f9fa;border-left:3px solid #f36e2b;border-radius:8px;align-items:center;gap:15px;margin-bottom:25px;padding:12px 15px;font-size:.9rem;display:flex}.quiz-card-info svg{color:#f36e2b;width:16px;height:16px;margin-right:6px}.quiz-card-footer{background:linear-gradient(#fff0 0%,#f36e2b05 100%);padding:0 10px 10px}@media (max-width:768px){.quiz-card-footer{padding:0 10px 10px}}.start-quiz-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#f26c2a 0%,#ff6f27d2 100%);border:none;border-radius:6px;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px 25px;font-size:1rem;font-weight:600;transition:all .3s;display:flex}.start-quiz-btn:hover:not(:disabled){background:linear-gradient(135deg,#ff6f27e0 100%,#f26c2a 0%);transform:translateY(-2px)}.start-quiz-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.spinner-border{vertical-align:text-bottom;border:.2em solid;border-right-color:#0000;border-radius:50%;width:1rem;height:1rem;animation:.75s linear infinite spinner-border;display:inline-block}.spinner-border-sm{border-width:.2em;width:1rem;height:1rem}@keyframes spinner-border{to{transform:rotate(360deg)}}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.footer-note{text-align:center;border-top:1px solid #eee;margin-top:60px;padding-top:40px}@media (max-width:768px){.footer-note{margin-top:50px;padding-top:30px}}.footer-note p{color:#777;font-size:1.1rem;line-height:1.6}.footer-note p a{color:#f36e2b;font-weight:600;transition:all .3s}.footer-note p a:hover{color:#e55a1a;text-decoration:none}.skeleton-stat .skeleton-icon{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);border-radius:50%;width:40px;height:40px;margin-right:20px;animation:1.5s infinite loading}.skeleton-stat .skeleton-text{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);border-radius:4px;width:80%;height:20px;margin-top:10px;animation:1.5s infinite loading}.skeleton-card .skeleton-header .skeleton-title{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);border-radius:4px;width:80%;height:24px;margin-bottom:10px;animation:1.5s infinite loading}.skeleton-card .skeleton-header .skeleton-description{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);border-radius:4px;width:60%;height:16px;margin-bottom:15px;animation:1.5s infinite loading}.skeleton-card .skeleton-info{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);border-radius:4px;width:40%;height:16px;margin-bottom:20px;animation:1.5s infinite loading}.skeleton-card .skeleton-button{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);border-radius:6px;width:120px;height:40px;animation:1.5s infinite loading}.skeleton-button-large{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);border-radius:50px;width:200px;height:50px;margin:0 auto;animation:1.5s infinite loading}@keyframes loading{0%{background-position:-200px 0}to{background-position:200px 0}}.error-container{text-align:center;max-width:500px;margin:0 auto;padding:60px 20px}.error-container .error-icon{color:#dc3545;background:#fee;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 20px;display:flex}.error-container .error-icon svg{width:40px;height:40px}.error-container h2{color:#333;margin-bottom:15px;font-size:1.8rem}.error-container p{color:#666;margin-bottom:30px;font-size:1.1rem;line-height:1.6}.error-container .retry-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#f36e2b 0%,#e55a1a 100%);border:none;border-radius:6px;padding:12px 30px;font-size:1.1rem;font-weight:600;transition:all .3s}.error-container .retry-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #f36e2b4d}.empty-state{text-align:center;max-width:500px;margin:0 auto;padding:80px 20px}.empty-state .empty-icon{color:#6c757d;background:#f8f9fa;border-radius:50%;justify-content:center;align-items:center;width:100px;height:100px;margin:0 auto 25px;display:flex}.empty-state .empty-icon svg{width:50px;height:50px}.empty-state h2{color:#333;margin-bottom:15px;font-size:1.8rem}.empty-state p{color:#666;margin-bottom:30px;font-size:1.1rem;line-height:1.6}.empty-state .create-first-btn{color:#fff;background:linear-gradient(135deg,#28a745 0%,#218838 100%);border-radius:50px;padding:15px 35px;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block;box-shadow:0 4px 12px #28a7454d}.empty-state .create-first-btn:hover{transform:translateY(-3px);box-shadow:0 6px 16px #28a74566}.created-by{color:#6c757d;margin-left:15px;font-size:.9rem;font-style:italic}@media (max-width:768px){.created-by{margin:5px 0 0;display:block}}.quiz-card-title-container{justify-content:space-between;align-items:flex-start;margin-bottom:15px;display:flex}.quiz-card-actions{gap:10px;margin-left:15px;display:flex}.action-icon{cursor:pointer;background:#f8f9fa;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:all .3s;display:flex}.action-icon:hover:not(:disabled){transform:scale(1.1)}.action-icon:disabled{opacity:.6;cursor:not-allowed}.action-icon.edit-icon{color:#007bff}.action-icon.edit-icon:hover:not(:disabled){color:#0056b3;background:#e3f2fd}.action-icon.delete-icon{color:#dc3545}.action-icon.delete-icon:hover:not(:disabled){color:#c82333;background:#f8d7da}.modal-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}@media (max-width:768px){.modal-overlay{align-items:flex-start;padding:10px;overflow-y:auto}}.edit-quiz-modal{background:#fff;border-radius:15px;width:100%;max-width:1000px;max-height:90vh;overflow:hidden;box-shadow:0 20px 40px #0003}@media (max-width:768px){.edit-quiz-modal{height:fit-content;margin:100px 0}}.modal-header{color:#fff;background:linear-gradient(135deg,#f36e2b 0%,#e55a1a 100%);justify-content:space-between;align-items:center;padding:25px 30px;display:flex}.modal-header h2{margin:0;font-size:1.8rem;font-weight:700}.modal-header .close-btn{cursor:pointer;color:#fff;background:#fff3;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:all .3s;display:flex}.modal-header .close-btn:hover{background:#ffffff4d;transform:rotate(90deg)}.modal-content{max-height:70vh;padding:30px;overflow-y:auto}@media (max-width:768px){.modal-content{max-height:60vh;padding:20px}}.mode-toggle{background:#f8f9fa;border-radius:8px;width:fit-content;margin-bottom:25px;padding:5px;display:flex}.toggle-btn{cursor:pointer;color:#6c757d;background:0 0;border:none;border-radius:6px;padding:10px 20px;font-weight:600;transition:all .3s}.toggle-btn.active{color:#f36e2b;background:#fff;box-shadow:0 2px 8px #0000001a}.toggle-btn:hover:not(.active){color:#495057}.preview-section .quiz-preview h3{color:#333;margin-bottom:15px;font-size:1.5rem}.preview-section .quiz-preview .preview-description{color:#666;margin-bottom:25px;font-size:1.1rem;line-height:1.6}.preview-questions{flex-direction:column;gap:20px;display:flex}.preview-question-card{background:#f8f9fa;border-left:4px solid #f36e2b;border-radius:10px;padding:20px}.preview-question-text{color:#333;margin-bottom:15px;font-size:1.1rem;font-weight:600}.preview-options{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;display:grid}.preview-option{background:#fff;border:2px solid #e9ecef;border-radius:8px;align-items:center;gap:10px;padding:12px 15px;display:flex}.preview-option.correct{background:#d4edda;border-color:#28a745}.preview-option .option-letter{color:#495057;background:#e9ecef;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:.9rem;font-weight:600;display:flex}.preview-option .option-text{color:#333;flex:1}.preview-option .correct-badge{color:#fff;background:#28a745;border-radius:12px;padding:3px 8px;font-size:.8rem;font-weight:600}.edit-form .form-group{margin-bottom:20px}.edit-form .form-group label{color:#333;margin-bottom:8px;font-weight:600;display:block}.edit-form .form-group .form-input,.edit-form .form-group .form-textarea,.edit-form .form-group .form-select{border:2px solid #e9ecef;border-radius:8px;width:100%;padding:12px 15px;font-size:1rem;transition:all .3s}.edit-form .form-group .form-input:focus,.edit-form .form-group .form-textarea:focus,.edit-form .form-group .form-select:focus{border-color:#f36e2b;outline:none;box-shadow:0 0 0 3px #f36e2b1a}.edit-form .form-group .form-textarea{resize:vertical;min-height:80px}.questions-section{margin:30px 0}.questions-section .section-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.questions-section .section-header h3{color:#333;margin:0}.questions-section .section-header .add-question-btn{color:#fff;cursor:pointer;background:#28a745;border:none;border-radius:6px;align-items:center;gap:8px;padding:8px 15px;font-weight:600;transition:all .3s;display:flex}.questions-section .section-header .add-question-btn:hover{background:#218838;transform:translateY(-2px)}.question-form{background:#f8f9fa;border:1px solid #e9ecef;border-radius:10px;margin-bottom:20px;padding:20px}.question-form .question-header{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.question-form .question-header h4{color:#333;margin:0}.question-form .question-header .remove-question-btn{color:#fff;cursor:pointer;background:#dc3545;border:none;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;transition:all .3s;display:flex}.question-form .question-header .remove-question-btn:hover{background:#c82333;transform:scale(1.1)}.options-grid{grid-template-columns:repeat(2,1fr);gap:15px;margin:15px 0;display:grid}@media (max-width:768px){.options-grid{grid-template-columns:1fr}}.option-group .form-input{margin-top:5px}.modal-footer{border-top:1px solid #e9ecef;justify-content:flex-end;gap:15px;margin-top:30px;padding-top:20px;display:flex}.modal-footer .cancel-btn,.modal-footer .update-btn{cursor:pointer;border:none;border-radius:6px;padding:12px 25px;font-weight:600;transition:all .3s}.modal-footer .cancel-btn:disabled,.modal-footer .update-btn:disabled{opacity:.6;cursor:not-allowed}.modal-footer .cancel-btn{color:#fff;background:#6c757d}.modal-footer .cancel-btn:hover:not(:disabled){background:#5a6268}.modal-footer .update-btn{color:#fff;background:#f36e2b;align-items:center;gap:8px;display:flex}.modal-footer .update-btn:hover:not(:disabled){background:#e55a1a;transform:translateY(-2px)}
