.class-details-container{background:linear-gradient(135deg,#f5f7fa 0%,#f0f4f8 100%);min-height:100vh;margin-top:80px;padding:60px 20px}.class-details-header{text-align:center;margin-bottom:60px;animation:.6s ease-out fadeInDown}.class-details-header h1{color:#1a1a1a;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 10px;font-size:3rem;font-weight:700}.class-details-header p{color:#666;margin:0;font-size:1.2rem}.subjects-container{grid-template-columns:1fr;gap:20px;max-width:900px;margin:0 auto;animation:.6s ease-out .2s both fadeInUp;display:grid}.subject-card{background:#fff;border-radius:12px;transition:all .3s;overflow:hidden;box-shadow:0 4px 15px #0000001a}.subject-card:hover{transform:translateY(-5px);box-shadow:0 12px 32px #667eea33}.subject-header{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;justify-content:space-between;align-items:center;width:100%;padding:20px;font-size:1.2rem;font-weight:600;transition:all .3s;display:flex}.subject-header:hover{transform:scale(1.02)}.subject-name{text-align:left;flex:1}.subject-toggle{font-size:.8rem;transition:transform .3s;display:inline-block}.subject-toggle.open{transform:rotate(180deg)}.subject-options{background:#f8f9fc;grid-template-columns:1fr;gap:10px;padding:15px;animation:.3s ease-out slideDown;display:grid}.option-link{text-decoration:none;display:block}.option-card{cursor:pointer;text-align:left;color:#333;background:#fff;border:2px solid #e8eef5;border-radius:8px;align-items:center;gap:12px;padding:15px;font-size:1rem;font-weight:500;transition:all .3s;display:flex}.option-card:hover{background:#f5f7ff;border-color:#667eea;transform:translate(5px)}.option-card:active{transform:scale(.98)}.option-icon{object-fit:cover;border-radius:6px;flex-shrink:0;width:40px;height:40px}.option-name{flex:1}.option-arrow{color:#667eea;font-size:1.2rem;font-weight:700}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:500px}}@media (max-width:768px){.class-details-container{padding:40px 15px}.class-details-header h1{font-size:2rem}.class-details-header p{font-size:1rem}.subjects-container{grid-template-columns:1fr;gap:15px}.subject-header{padding:16px;font-size:1.1rem}.option-card{padding:12px;font-size:.95rem}.option-icon{width:35px;height:35px}}@media (max-width:480px){.class-details-container{padding:30px 15px}.class-details-header h1{font-size:1.7rem}.class-details-header p{font-size:.95rem}.subject-header{padding:14px;font-size:1rem}.option-card{gap:8px;padding:10px;font-size:.9rem}.option-icon{width:30px;height:30px}.option-arrow{font-size:1rem}}:root.dark-mode .class-details-container{background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 100%)}:root.dark-mode .class-details-header h1{color:#cbd5f5}:root.dark-mode .class-details-header p{color:#94a3b8}:root.dark-mode .subject-card{background:#1e293b;box-shadow:0 4px 15px #00000080}:root.dark-mode .subject-header{color:#f8fafc;background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%)}:root.dark-mode .subject-options{background:#111827}:root.dark-mode .option-card{color:#e5e7eb;background:#1e293b;border-color:#374151}:root.dark-mode .option-card:hover{background:#374151;border-color:#4f46e5}:root.dark-mode .option-arrow{color:#a5b4fc}