@charset "UTF-8";html,body,#root{height:100%;width:100%;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}*{box-sizing:border-box}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#94a3b84d;border-radius:10px;transition:all .3s ease}::-webkit-scrollbar-thumb:hover{background:#94a3b880}::-webkit-scrollbar-thumb:active{background:#94a3b8b3}*{scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.3) transparent}.sidebar::-webkit-scrollbar-thumb,.dark-scrollbar::-webkit-scrollbar-thumb{background:#ffffff26}.sidebar::-webkit-scrollbar-thumb:hover,.dark-scrollbar::-webkit-scrollbar-thumb:hover{background:#ffffff40}.sidebar::-webkit-scrollbar-thumb:active,.dark-scrollbar::-webkit-scrollbar-thumb:active{background:#ffffff59}@media(max-width:768px){body{font-size:14px}button,a,input,select,textarea{min-height:44px}html{-webkit-text-size-adjust:100%}*{-webkit-overflow-scrolling:touch}}.app-layout{display:flex;flex-direction:column;height:100vh;overflow:hidden}.main-container{display:flex;flex:1;overflow:hidden}.content{flex:1;overflow-y:auto;padding:24px;background:#f9fafb}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.page-header h2{margin:0;font-size:24px;color:#111827}.btn-primary{background:#4f46e5;color:#fff;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;font-weight:500;transition:all .2s}.btn-primary:hover{background:#4338ca}.data-table{width:100%;background:#fff;border-radius:8px;overflow:hidden;border:1px solid #e5e7eb;border-collapse:collapse}.data-table thead{background:#f9fafb}.data-table th{padding:12px 16px;text-align:left;font-weight:600;color:#374151;font-size:14px;border-bottom:1px solid #e5e7eb}.data-table td{padding:12px 16px;color:#111827;font-size:14px;border-bottom:1px solid #f3f4f6}.data-table tbody tr:last-child td{border-bottom:none}.data-table tbody tr:hover{background:#f9fafb}@media(max-width:768px){.content{padding:16px}.page-header{flex-direction:column;align-items:flex-start;gap:12px}.page-header h2{font-size:20px}.data-table-wrapper,.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -16px;padding:0 16px}.data-table{font-size:13px;min-width:600px}.data-table th,.data-table td{padding:10px 12px;font-size:12px;white-space:nowrap}.data-table th:first-child,.data-table td:first-child{position:sticky;left:0;background:#fff;z-index:2}.data-table thead th:first-child{background:#f9fafb;z-index:3}.btn-group{display:flex;flex-direction:column;gap:8px}.btn-group button{width:100%}}:root{--primary-gradient: linear-gradient(135deg, #4b5563 0%, #2f3237 100%);--primary-gradient-hover: linear-gradient(135deg, #6b7280 0%, #374151 100%);--primary-color: #4b5563;--primary-color-light: #6b7280;--primary-color-lighter: #9ca3af;--primary-color-dark: #374151;--primary-color-darker: #1f2937;--bg-primary: #ffffff;--bg-secondary: #f9fafb;--bg-tertiary: #f8fafc;--bg-quaternary: #f1f5f9;--bg-light: #fafafa;--bg-gradient: linear-gradient(135deg, #f9fafb 0%, #e5e7eb 100%);--bg-gradient-light: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);--bg-dark: linear-gradient(180deg, #232930 0%, #25272c 100%);--bg-card: #ffffff;--bg-hover: #f3f4f6;--bg-hover-light: #f8fafc;--text-primary: #1a1a2e;--text-secondary: #475569;--text-tertiary: #64748b;--text-quaternary: #94a3b8;--text-light: #9ca3af;--text-white: #ffffff;--border-primary: #e2e8f0;--border-secondary: #e5e7eb;--border-tertiary: #f1f5f9;--border-light: #cbd5e1;--border-lighter: #d1d5db;--border-dark: rgba(255, 255, 255, .1);--border-focus: #4b5563;--success-gradient: linear-gradient(135deg, #10b981 0%, #059669 100%);--success-gradient-light: linear-gradient(135deg, #86efac 0%, #10b981 100%);--success-color: #10b981;--success-color-dark: #059669;--success-color-darker: #065f46;--success-bg: #d1fae5;--success-bg-light: #f0fdf4;--success-border: #86efac;--warning-gradient: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);--warning-color: #f59e0b;--warning-color-dark: #d97706;--warning-color-darker: #92400e;--warning-bg: #fef3c7;--warning-bg-light: #fffbeb;--warning-border: #f59e0b;--danger-gradient: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);--danger-color: #ef4444;--danger-color-dark: #dc2626;--danger-color-darker: #991b1b;--danger-bg: #fee2e2;--danger-bg-light: #fef2f2;--danger-border: #ef4444;--info-gradient: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);--info-color: #3b82f6;--info-color-dark: #2563eb;--info-color-darker: #1e40af;--info-bg: #eff6ff;--info-bg-light: #dbeafe;--info-border: #3b82f6;--accent-gradient: linear-gradient(135deg, #374151 0%, #1f2937 100%);--accent-color: #374151;--accent-light: rgba(75, 85, 99, .15);--accent-lighter: rgba(75, 85, 99, .1);--header-bg: linear-gradient(135deg, #232930 0%, #25272c 100%);--sidebar-bg: linear-gradient(180deg, #232930 0%, #25272c 100%);--button-primary: linear-gradient(135deg, #4b5563 0%, #2f3237 100%);--button-primary-hover: linear-gradient(135deg, #6b7280 0%, #374151 100%);--button-secondary-bg: #f1f5f9;--button-secondary-color: #475569;--button-secondary-border: #e2e8f0;--button-danger: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);--button-success: linear-gradient(135deg, #10b981 0%, #059669 100%);--button-warning: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);--button-info: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);--table-header-bg: linear-gradient(135deg, #4b5563 0%, #2f3237 100%);--table-header-color: #ffffff;--table-row-hover: #f8fafc;--table-border: #e2e8f0;--table-border-light: #f1f5f9;--input-bg: #ffffff;--input-border: #e2e8f0;--input-border-focus: #4b5563;--input-placeholder: #94a3b8;--input-disabled-bg: #f1f5f9;--card-bg: #ffffff;--card-border: #e2e8f0;--card-shadow: 0 4px 6px rgba(0, 0, 0, .1);--card-shadow-hover: 0 10px 15px rgba(0, 0, 0, .1);--modal-bg: #ffffff;--modal-header-bg: linear-gradient(135deg, #4b5563 0%, #2f3237 100%);--modal-header-color: #ffffff;--modal-overlay: rgba(0, 0, 0, .5);--badge-new-bg: #d1fae5;--badge-new-color: #065f46;--badge-existing-bg: #f3f4f6;--badge-existing-color: #374151;--badge-extra-bg: #fef3c7;--badge-extra-color: #92400e;--badge-remove-bg: #fee2e2;--badge-remove-color: #991b1b;--badge-info-bg: #e5e7eb;--badge-info-color: #1e40af;--progress-bg: #e2e8f0;--progress-fill: linear-gradient(90deg, #10b981 0%, #059669 100%);--wizard-active-bg: linear-gradient(135deg, #4b5563 0%, #2f3237 100%);--wizard-connector: linear-gradient(90deg, #4b5563 0%, #1f2937 100%);--attendance-present-bg: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);--attendance-present-color: #065f46;--attendance-absent-bg: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);--attendance-absent-color: #991b1b;--attendance-late-bg: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);--attendance-late-color: #92400e;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .05);--shadow-sm: 0 2px 4px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .15);--shadow-2xl: 0 25px 50px rgba(0, 0, 0, .25);--shadow-primary: 0 4px 14px rgba(75, 85, 99, .4);--shadow-primary-hover: 0 6px 20px rgba(75, 85, 99, .5);--overlay-light: rgba(255, 255, 255, .06);--overlay-medium: rgba(255, 255, 255, .12);--overlay-dark: rgba(0, 0, 0, .5);--overlay-darker: rgba(0, 0, 0, .75)}.logo:after{background:linear-gradient(90deg,rgba(255,255,255,.5),transparent)!important}.current-entity{background:var(--accent-light)!important;border-color:#4b55634d!important;color:#d1d5db!important}.current-entity:hover{background:#4b556340!important;border-color:#4b556380!important}.dropdown-header{background:var(--button-primary)!important}.dropdown-item:hover{color:var(--primary-color)!important}.dropdown-item.active{background:linear-gradient(135deg,#4b55631a,#1f29371a)!important;color:var(--primary-color)!important}.dropdown-item svg{color:var(--primary-color)!important}.mobile-menu-btn{background:var(--accent-light)!important;border-color:#4b55634d!important}.mobile-menu-btn:hover{background:#4b556340!important}.section-switcher:before{background:var(--button-primary)!important;box-shadow:0 2px 8px #4b556366!important}.nav-menu li a:before{background:linear-gradient(180deg,#6b7280,#374151)!important}.nav-menu li a:hover{background:#4b55631f!important}.nav-menu li a.active{background:linear-gradient(135deg,#4b556333,#1f293726)!important;box-shadow:0 2px 8px #4b556333!important}.nav-divider{color:var(--text-light)!important}.mobile-section-btn.active{background:linear-gradient(135deg,#4b5563,#1f2937)!important;box-shadow:0 2px 8px #4b556366!important}.btn-primary,button.btn-primary,.timetable-page .btn-primary{background:var(--button-primary)!important;box-shadow:var(--shadow-primary)!important}.btn-primary:hover,button.btn-primary:hover,.timetable-page .btn-primary:hover,.header-actions .btn-primary:hover{background:var(--button-primary-hover)!important;box-shadow:var(--shadow-primary-hover)!important}.schedule-table thead th,.timetable-page .schedule-table thead th{background:var(--table-header-bg)!important}.wizard-progress .step.active{background:var(--wizard-active-bg)!important;box-shadow:0 4px 12px #4b556366!important}.wizard-progress .step-connector.active{background:var(--wizard-connector)!important}.day-btn:hover{border-color:var(--primary-color)!important}.day-btn.selected{background:var(--button-primary)!important}input:focus,select:focus,textarea:focus,.form-group input[type=number]:focus,.timing-row input[type=time]:focus,.search-box input:focus,.selector-group select:focus,.remarks-section textarea:focus{border-color:var(--input-border-focus)!important;box-shadow:0 0 0 3px #4b55631a!important}.timing-row:hover{border-color:var(--primary-color)!important;box-shadow:0 2px 8px #4b55631a!important}.student-item.active,.student-avatar{background:linear-gradient(135deg,#4b5563,#1f2937)!important}.summary-card,.student-profile-page .summary-card,.timetable-page .classes-panel{background:var(--button-primary)!important}.class-item-draggable{color:var(--primary-color)}.class-item-draggable:active{color:#fff!important}.unassigned-user-page{background:var(--bg-gradient)!important}.unassigned-icon,.unassigned-title{background:var(--button-primary)!important}.unassigned-info-card{border-left-color:var(--primary-color)!important}.parent-header{background:linear-gradient(135deg,#1a1a2e,#16213e)!important}.parent-avatar{background:linear-gradient(135deg,#4b5563,#1f2937)!important}.access-denied .btn-secondary{background:var(--button-primary)!important}.curriculum-assignment{background:linear-gradient(135deg,#f3f4f6,#e5e7eb)!important}.empty-slot.droppable{background:var(--bg-gradient-light)!important}.empty-slot.droppable:hover{background:linear-gradient(135deg,#e5e7eb,#d1d5db)!important;border-color:var(--primary-color)!important}.class-chip{background:var(--button-primary)!important}.period-cell{background:var(--bg-gradient-light)!important}.notification{position:fixed;top:20px;right:20px;z-index:2000;min-width:320px;max-width:500px;transform:translate(100%);transition:all .4s cubic-bezier(.16,1,.3,1);opacity:0}.notification.show{transform:translate(0);opacity:1}.notification-content{background:#fff;border-radius:16px;padding:20px 24px;box-shadow:0 10px 40px #00000026;border:1px solid #e5e7eb;display:flex;align-items:center;gap:16px;position:relative;overflow:hidden}.notification-content:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:#3b82f6}.notification-success .notification-content:before{background:linear-gradient(135deg,#10b981,#059669)}.notification-error .notification-content:before{background:linear-gradient(135deg,#ef4444,#dc2626)}.notification-warning .notification-content:before{background:linear-gradient(135deg,#f59e0b,#d97706)}.notification-info .notification-content:before{background:linear-gradient(135deg,#3b82f6,#2563eb)}.notification-icon{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;color:#fff;flex-shrink:0;background:#3b82f6}.notification-success .notification-icon{background:linear-gradient(135deg,#10b981,#059669)}.notification-error .notification-icon{background:linear-gradient(135deg,#ef4444,#dc2626)}.notification-warning .notification-icon{background:linear-gradient(135deg,#f59e0b,#d97706)}.notification-info .notification-icon{background:linear-gradient(135deg,#3b82f6,#2563eb)}.notification-message{flex:1;font-size:15px;font-weight:500;color:#111827;line-height:1.5}.notification-close{background:none;border:none;font-size:20px;color:#6b7280;cursor:pointer;padding:4px;width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.notification-close:hover{background:#f3f4f6;color:#374151}.notification:nth-child(2){top:90px}.notification:nth-child(3){top:160px}.notification:nth-child(4){top:230px}@media(max-width:640px){.notification{left:10px;right:10px;min-width:auto;max-width:none;transform:translateY(-100%);top:10px}.notification.show{transform:translateY(0)}.notification-content{padding:16px 20px}.notification-icon{width:36px;height:36px;font-size:18px}.notification-message{font-size:14px}.notification:nth-child(2){top:80px}.notification:nth-child(3){top:150px}.notification:nth-child(4){top:220px}}.unassigned-user-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:2rem;background:linear-gradient(135deg,#4b5563,#2f3237)}.unassigned-user-card{background:#fff;border-radius:24px;padding:3rem;max-width:600px;width:100%;box-shadow:0 20px 60px #0000004d;text-align:center;animation:slideUp .5s cubic-bezier(.16,1,.3,1);position:relative}.unassigned-logout-btn{position:absolute;top:1.5rem;right:1.5rem;background:linear-gradient(135deg,#ef4444,#dc2626);border:none;color:#fff;width:44px;height:44px;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 12px #ef44444d}.unassigned-logout-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ef444480}.unassigned-logout-btn:active{transform:translateY(0)}.unassigned-icon{display:inline-flex;align-items:center;justify-content:center;width:120px;height:120px;margin:0 auto 2rem;background:linear-gradient(135deg,#4b5563,#2f3237);border-radius:50%;color:#fff}.unassigned-icon.deactivated-icon{background:linear-gradient(135deg,#ef4444,#dc2626)}.unassigned-user-card.deactivated{border:2px solid rgba(239,68,68,.3)}.unassigned-user-card.deactivated .unassigned-title{background:linear-gradient(135deg,#ef4444,#dc2626);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.deactivated-status{color:#ef4444;font-weight:600}.unassigned-title{font-size:2rem;font-weight:700;color:#1a1a2e;margin:0 0 1rem;background:linear-gradient(135deg,#4b5563,#2f3237);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.unassigned-message{font-size:1.125rem;color:#475569;margin:0 0 1rem;line-height:1.6}.unassigned-instruction{font-size:1rem;color:#64748b;margin:0 0 2rem;line-height:1.6;padding:1rem;background:#f8fafc;border-radius:12px;border-left:4px solid #4b5563}.unassigned-info-box{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-radius:16px;padding:1.5rem;margin:2rem 0;border:1px solid rgba(102,126,234,.2)}.info-row{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0}.info-row:not(:last-child){border-bottom:1px solid rgba(102,126,234,.1)}.info-label{font-weight:600;color:#475569;font-size:.95rem}.info-value{font-weight:500;color:#1a1a2e;font-size:.95rem;text-transform:capitalize}.info-email{text-transform:none}.unassigned-footer{margin-top:2rem;padding-top:2rem;border-top:1px solid #e2e8f0}.unassigned-footer p{margin:0;color:#94a3b8;font-size:.875rem}@media(max-width:640px){.unassigned-user-card{padding:2rem 1.5rem}.unassigned-logout-btn{top:1rem;right:1rem;width:40px;height:40px}.unassigned-logout-btn svg{width:18px;height:18px}.unassigned-icon{width:100px;height:100px}.unassigned-icon svg{width:60px;height:60px}.unassigned-title{font-size:1.5rem}.unassigned-message{font-size:1rem}.info-row{flex-direction:column;align-items:flex-start;gap:.25rem}}:root{--chat-primary: #4b5563;--chat-primary-hover: #6b7280;--chat-primary-gradient: linear-gradient(135deg, #4b5563 0%, #2f3237 100%);--chat-primary-gradient-hover: linear-gradient(135deg, #6b7280 0%, #374151 100%);--chat-orange: #ff6b35;--chat-orange-hover: #ff8555;--chat-orange-light: #fff5f2;--chat-grey-dark: #1e293b;--chat-grey-medium: #636e72;--chat-grey-light: #b2bec3;--chat-grey-bg: #f8f9fa;--chat-grey-border: #e5e7eb;--chat-white: #ffffff;--chat-header-bg: linear-gradient(135deg, #232930 0%, #25272c 100%)}.floating-chat-btn{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:var(--chat-primary-gradient);color:var(--chat-white);border:none;cursor:pointer;box-shadow:0 4px 12px #4b55634d;display:flex;align-items:center;justify-content:center;transition:all .3s;z-index:999}.floating-chat-btn:hover{background:var(--chat-primary-gradient-hover);transform:scale(1.05);box-shadow:0 6px 16px #4b556366}.chat-unread-badge{position:absolute;top:-4px;right:-4px;background:#e74c3c;color:var(--chat-white);border-radius:12px;padding:2px 6px;font-size:11px;font-weight:700;min-width:20px;text-align:center;border:2px solid var(--chat-white)}.floating-chat-popup{position:fixed;bottom:90px;right:24px;width:380px;max-width:calc(100vw - 48px);height:600px;max-height:calc(100vh - 120px);background:var(--chat-white);border-radius:16px;box-shadow:0 8px 32px #00000026;z-index:998;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--chat-grey-border);animation:slideUpFadeIn .3s cubic-bezier(.4,0,.2,1) forwards}.floating-chat-popup.closing{animation:slideDownFadeOut .3s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideUpFadeIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideDownFadeOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(20px) scale(.95)}}.floating-chat-container{display:flex;flex-direction:column;height:100%;position:relative;overflow:hidden}.chat-view-container{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--chat-white);transition:transform .3s cubic-bezier(.4,0,.2,1)}.chat-view-container.list-view{transform:translate(0)}.chat-view-container.chat-view{transform:translate(-100%)}.chat-list-panel,.chat-message-panel{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--chat-white);transition:transform .3s cubic-bezier(.4,0,.2,1)}.chat-list-panel{transform:translate(0)}.chat-list-panel.hidden{transform:translate(-100%)}.chat-message-panel{transform:translate(100%)}.chat-message-panel.active{transform:translate(0)}.floating-chat-header{padding:20px 24px;border-bottom:none;display:flex;justify-content:space-between;align-items:center;background:var(--chat-header-bg);position:relative;overflow:hidden}.floating-chat-header:before{content:"";position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:#ffffff0d;border-radius:50%}.floating-chat-header h3{margin:0;font-size:18px;font-weight:700;color:var(--chat-white);position:relative;z-index:1}.close-chat-btn{background:#ffffff1a;border:none;cursor:pointer;color:var(--chat-white);padding:8px;border-radius:8px;transition:all .2s;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}.close-chat-btn:hover{background:#fff3;transform:rotate(90deg)}.new-chat-btn-floating{flex:1;padding:10px 14px;background:var(--chat-primary-gradient);color:var(--chat-white);border:none;border-radius:8px;cursor:pointer;font-weight:600;font-size:13px;transition:all .2s;box-shadow:0 2px 8px #4b55634d;white-space:nowrap}.new-chat-btn-floating:hover{background:var(--chat-primary-gradient-hover);transform:translateY(-1px);box-shadow:0 4px 12px #4b556366}.new-chat-buttons-container{display:flex;gap:8px;margin:12px 16px}.role-filter-container{padding:0 16px 12px;border-bottom:1px solid var(--chat-grey-border)}.role-filter-scroll{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding:4px 0;scrollbar-width:none;-ms-overflow-style:none}.role-filter-scroll::-webkit-scrollbar{display:none}.role-filter-btn{flex-shrink:0;padding:6px 14px;background:var(--chat-grey-bg);color:var(--chat-grey-dark);border:1px solid var(--chat-grey-border);border-radius:20px;cursor:pointer;font-size:12px;font-weight:500;transition:all .2s;display:flex;align-items:center;gap:6px;text-transform:capitalize;white-space:nowrap}.role-filter-btn:hover{background:#f3f4f6;border-color:var(--chat-primary);color:var(--chat-primary)}.role-filter-btn.active{background:var(--chat-primary-gradient);color:var(--chat-white);border-color:var(--chat-primary);box-shadow:0 2px 8px #4b55634d}.role-count{background:#ffffff4d;padding:2px 6px;border-radius:10px;font-size:11px;font-weight:600;min-width:18px;text-align:center}.role-filter-btn.active .role-count{background:#ffffff40}.no-conversations-message{padding:40px 20px;text-align:center;color:var(--chat-grey-medium);font-size:14px}.user-list-modal-floating{position:absolute;top:120px;left:16px;right:16px;background:var(--chat-white);border-radius:12px;box-shadow:0 8px 24px #00000026;z-index:100;max-height:400px;display:flex;flex-direction:column;border:1px solid var(--chat-grey-border);overflow:hidden;animation:slideDownFadeInFloating .3s cubic-bezier(.4,0,.2,1) forwards;transform-origin:top center}.user-list-modal-floating.closing{animation:slideUpFadeOutFloating .25s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideDownFadeInFloating{0%{opacity:0;transform:translateY(-10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideUpFadeOutFloating{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.95)}}.modal-header-floating{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--chat-grey-border);border-radius:12px 12px 0 0;background:var(--chat-white)}.modal-header-floating h4{margin:0;font-size:14px;font-weight:600;color:var(--chat-grey-dark)}.modal-header-floating button{background:none;border:none;font-size:18px;cursor:pointer;color:var(--chat-grey-medium);width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .2s}.modal-header-floating button:hover{background:var(--chat-grey-bg);color:var(--chat-orange)}.search-input-floating{margin:12px 16px;padding:10px 14px;border:1px solid var(--chat-grey-border);border-radius:8px;font-size:13px;transition:all .2s}.search-input-floating:focus{outline:none;border-color:var(--chat-orange)}.user-list-floating{overflow-y:auto;max-height:300px}.user-item-floating{display:flex;gap:10px;padding:10px 16px;cursor:pointer;align-items:center;transition:all .2s;animation:fadeInSlideRightFloating .3s ease forwards;opacity:0}.user-item-floating:nth-child(1){animation-delay:.05s}.user-item-floating:nth-child(2){animation-delay:.1s}.user-item-floating:nth-child(3){animation-delay:.15s}.user-item-floating:nth-child(4){animation-delay:.2s}.user-item-floating:nth-child(5){animation-delay:.25s}.user-item-floating:nth-child(n+6){animation-delay:.3s}@keyframes fadeInSlideRightFloating{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.user-item-floating:hover{background:#f3f4f6;transform:translate(2px)}.user-avatar-floating{width:36px;height:36px;border-radius:50%;background:var(--chat-primary-gradient);display:flex;align-items:center;justify-content:center;color:var(--chat-white);font-weight:600;font-size:14px;text-transform:uppercase;flex-shrink:0;border:2px solid rgba(255,255,255,.2)}.group-icon{width:15px;height:15px;object-fit:contain}.user-details-floating{flex:1;min-width:0}.user-name-floating{font-weight:600;font-size:13px;color:var(--chat-grey-dark)}.user-role-floating{font-size:11px;color:var(--chat-grey-medium);text-transform:capitalize}.conversations-list-floating{flex:1;overflow-y:auto}.conversation-item-floating{display:flex;gap:10px;padding:10px 16px;cursor:pointer;border-bottom:1px solid var(--chat-grey-border);align-items:center;transition:all .2s}.conversation-item-floating:hover{background:var(--chat-grey-bg)}.conversation-info-floating{flex:1;min-width:0}.conversation-header-floating{display:flex;justify-content:space-between;margin-bottom:3px;align-items:center}.conversation-name-floating{font-weight:600;font-size:13px;color:var(--chat-grey-dark)}.conversation-time-floating{font-size:10px;color:var(--chat-grey-medium);flex-shrink:0;margin-left:6px}.conversation-preview-floating{display:flex;justify-content:space-between;align-items:center;gap:6px}.last-message-floating{font-size:12px;color:var(--chat-grey-medium);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.message-indicator-floating{font-size:11px;color:var(--chat-primary);margin-right:2px}.unread-badge-floating{background:var(--chat-primary-gradient);color:var(--chat-white);border-radius:10px;padding:2px 6px;font-size:10px;font-weight:700;min-width:16px;text-align:center;flex-shrink:0}.back-btn-floating{background:#ffffff1a;border:none;cursor:pointer;color:var(--chat-white);padding:8px;border-radius:8px;transition:all .2s;margin-right:10px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}.back-btn-floating:hover{background:#fff3;transform:translate(-2px)}.members-btn-floating{background:#ffffff1a;border:none;cursor:pointer;color:var(--chat-white);padding:8px;border-radius:8px;transition:all .2s;display:flex;align-items:center;justify-content:center;position:relative;z-index:1;margin-left:auto;margin-right:8px}.members-btn-floating:hover{background:#fff3;transform:scale(1.05)}.chat-user-info-floating{display:flex;gap:10px;align-items:center;flex:1;position:relative;z-index:1}.chat-user-name-floating{font-weight:700;font-size:15px;color:var(--chat-white)}.chat-user-role-floating{font-size:11px;color:#ffffffb3;text-transform:capitalize}.messages-container-floating{flex:1;overflow-y:auto;padding:16px;background:var(--chat-grey-bg);display:flex;flex-direction:column}.message-floating{display:flex;flex-direction:column;margin-bottom:10px;max-width:75%;animation:messageSlideIn .3s cubic-bezier(.4,0,.2,1)}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-floating.sent{align-self:flex-end;align-items:flex-end}.message-floating.received{align-self:flex-start;align-items:flex-start}.message-sender-name-floating{font-size:11px;font-weight:600;color:var(--chat-primary);margin-bottom:3px;padding:0 4px}.message-content-floating{padding:9px 13px;border-radius:12px;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;line-height:1.4;font-size:13px;white-space:pre-wrap;max-width:100%}.message-floating.sent .message-content-floating{background:var(--chat-primary-gradient);color:var(--chat-white);border-bottom-right-radius:4px}.message-floating.received .message-content-floating{background:var(--chat-white);color:var(--chat-grey-dark);border:1px solid var(--chat-grey-border);border-bottom-left-radius:4px}.message-footer-floating{display:flex;align-items:center;gap:4px;margin-top:3px;padding:0 4px}.message-time-floating{font-size:10px;color:var(--chat-grey-medium)}.message-status-floating{font-size:10px;display:flex;align-items:center}.message-status-floating.sent{color:var(--chat-grey-medium)}.message-status-floating.seen{color:var(--chat-orange)}.message-input-container-floating{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--chat-grey-border);background:var(--chat-white)}.message-input-floating{flex:1;padding:10px 14px;border:2px solid var(--chat-grey-border);border-radius:20px;font-size:13px;transition:all .2s;resize:none;min-height:40px;max-height:90px;overflow-y:hidden;font-family:inherit;line-height:1.5;scrollbar-width:none;-ms-overflow-style:none}.message-input-floating::-webkit-scrollbar{display:none}.message-input-floating.at-max-height{overflow-y:auto;scrollbar-width:thin;-ms-overflow-style:auto}.message-input-floating.at-max-height::-webkit-scrollbar{display:block;width:4px}.message-input-floating.at-max-height::-webkit-scrollbar-track{background:transparent}.message-input-floating.at-max-height::-webkit-scrollbar-thumb{background:var(--chat-grey-light);border-radius:2px}.message-input-floating.at-max-height::-webkit-scrollbar-thumb:hover{background:var(--chat-grey-medium)}.message-input-floating:focus{outline:none;border-color:var(--chat-primary);box-shadow:0 0 0 3px #4b556314}.send-btn-floating{width:40px;height:40px;background:var(--chat-primary-gradient);color:var(--chat-white);border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;box-shadow:0 2px 8px #4b55634d}.send-btn-floating:hover{background:var(--chat-primary-gradient-hover);transform:scale(1.05);box-shadow:0 4px 12px #4b556366}.send-btn-floating:hover svg{transform:rotate(45deg)}.send-btn-floating svg{transition:transform .3s ease}.new-messages-indicator{position:absolute;bottom:80px;left:20px;background:var(--chat-primary-gradient);color:var(--chat-white);border:none;border-radius:50%;width:44px;height:44px;font-size:12px;font-weight:700;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:0 4px 12px #4b556366;transition:all .3s;z-index:10;animation:slideUpBounce .3s ease}.new-messages-indicator:hover{background:var(--chat-primary-gradient-hover);transform:translateY(-2px);box-shadow:0 6px 16px #4b556380}.new-messages-indicator svg{width:16px;height:16px;animation:bounce 1s infinite}@keyframes slideUpBounce{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(3px)}}@media(max-width:768px){.floating-chat-popup{bottom:0;right:0;left:0;width:100%;max-width:100%;height:100vh;max-height:100vh;border-radius:0;animation:slideUpMobile .3s cubic-bezier(.4,0,.2,1) forwards}.floating-chat-popup.closing{animation:slideDownMobile .3s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideUpMobile{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slideDownMobile{0%{transform:translateY(0)}to{transform:translateY(100%)}}.floating-chat-wrapper.open .floating-chat-btn{display:none}.floating-chat-btn{bottom:16px;right:16px;width:52px;height:52px}.chat-list-panel,.chat-message-panel{transition:transform .35s cubic-bezier(.25,.8,.25,1)}.chat-list-panel.hidden{transform:translate(-100%)}.chat-message-panel{transform:translate(100%)}.chat-message-panel.active{transform:translate(0)}.new-chat-buttons-container{gap:6px}.new-chat-btn-floating{font-size:11px;padding:9px 8px}}@media(max-width:480px){.floating-chat-btn{width:48px;height:48px}.floating-chat-btn svg{width:20px;height:20px}}@media(max-width:1024px)and (min-width:769px){.floating-chat-popup{width:360px;height:550px;max-height:calc(100vh - 100px)}}@media(max-height:700px)and (min-width:769px){.floating-chat-popup{height:calc(100vh - 120px);bottom:80px}}.group-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease forwards}.group-modal-overlay.closing{animation:fadeOut .2s ease forwards;pointer-events:none}.group-modal{background:#fff;border-radius:12px;width:90%;max-width:450px;min-height:350px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 10px 40px #0003;animation:slideUp .25s cubic-bezier(.4,0,.2,1) forwards;opacity:1;transform:translateY(0) scale(1)}.group-modal.closing{animation:slideDownFade .2s cubic-bezier(.4,0,.2,1) forwards}.group-modal.closing *{pointer-events:none}.group-modal-header{padding:20px 24px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center}.group-modal-header h3{margin:0;font-size:18px;font-weight:600;color:#1e293b}.close-modal-btn{background:none;border:none;font-size:24px;cursor:pointer;color:#636e72;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .2s}.close-modal-btn:hover{background:#f8f9fa;color:#4b5563}.group-modal-content{padding:24px;flex:1;overflow-y:auto;display:flex;flex-direction:column;min-height:250px}.group-name-section{margin-bottom:24px}.group-name-section label{display:block;margin-bottom:8px;font-weight:600;color:#1e293b;font-size:14px}.group-name-input{width:100%;padding:12px 16px;border:2px solid #e5e7eb;border-radius:8px;font-size:15px;transition:all .2s}.group-name-input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #4b55631a}.char-count{text-align:right;font-size:12px;color:#636e72;margin-top:4px}.member-search-input{width:100%;padding:10px 14px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;margin-bottom:16px;transition:all .2s}.member-search-input:focus{outline:none;border-color:#4b5563}.selected-count{font-size:13px;color:#636e72;margin-bottom:12px;font-weight:500}.members-list{flex:1;overflow-y:auto;margin-bottom:20px;max-height:300px}.member-item{display:flex;align-items:center;gap:12px;padding:12px;cursor:pointer;border-radius:8px;transition:all .2s;margin-bottom:4px}.member-item.selected{background:#f0f4f8;border:1px solid #4b5563}.member-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#4b5563,#2f3237);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:14px;text-transform:uppercase;flex-shrink:0}.member-name{font-weight:600;font-size:14px;color:#1e293b}.member-role{font-size:12px;color:#636e72;text-transform:capitalize}.group-modal-actions{display:flex;gap:12px;justify-content:flex-end;padding-top:16px;border-top:1px solid #e5e7eb}.group-modal-actions button{padding:10px 20px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s;border:none}.cancel-btn,.back-btn{background:#f8f9fa;color:#636e72}.cancel-btn:hover,.back-btn:hover{background:#e5e7eb;color:#4b5563}.next-btn,.create-btn{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.next-btn:hover,.create-btn:hover{background:linear-gradient(135deg,#6b7280,#374151);transform:translateY(-1px);box-shadow:0 4px 12px #4b55634d}.next-btn:disabled,.create-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.next-btn:disabled:hover,.create-btn:disabled:hover{transform:none;box-shadow:none}@media(max-width:480px){.group-modal{width:95%;max-height:90vh;min-height:300px}.group-modal-header{padding:16px 20px}.group-modal-content{padding:20px;min-height:200px}.members-list{max-height:250px}}.group-members-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1001;animation:fadeIn .2s ease forwards}.group-members-overlay.closing{animation:fadeOut .2s ease forwards;pointer-events:none}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.group-members-modal{background:#fff;border-radius:12px;width:90%;max-width:450px;height:600px;max-height:80vh;min-height:400px;display:flex;flex-direction:column;box-shadow:0 10px 40px #0003;animation:slideUp .25s cubic-bezier(.4,0,.2,1) forwards;opacity:1;transform:translateY(0) scale(1)}.group-members-modal.closing{animation:slideDownFade .2s cubic-bezier(.4,0,.2,1) forwards}.group-members-modal.closing *{pointer-events:none}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideDownFade{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(10px) scale(.98)}}.group-members-header{padding:20px 24px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center}.group-members-header h3{margin:0 0 4px;font-size:18px;font-weight:600;color:#1e293b}.member-count-text{margin:0;font-size:13px;color:#636e72}.group-members-content{padding:20px 24px;flex:1;overflow-y:auto;display:flex;flex-direction:column}.loading-members{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 20px;color:#636e72;flex:1;min-height:300px}.add-members-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.add-members-header h4{margin:0;font-size:16px;font-weight:600;color:#1e293b}.back-text-btn{background:none;border:none;color:#4b5563;font-size:14px;font-weight:500;cursor:pointer;padding:6px 12px;border-radius:6px;transition:all .2s}.back-text-btn:hover{background:#f8f9fa}.add-members-btn{width:100%;padding:10px 16px;background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s;margin-bottom:16px}.add-members-btn:hover{background:linear-gradient(135deg,#6b7280,#374151);transform:translateY(-1px);box-shadow:0 4px 12px #4b55634d}.available-users-list{flex:1;overflow-y:auto;margin-bottom:16px;max-height:300px}.no-users-message{text-align:center;padding:40px 20px;color:#636e72;font-size:14px}.members-list{flex:1;overflow-y:auto;margin-bottom:16px}.member-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:8px;transition:all .2s;margin-bottom:4px;cursor:pointer}.member-item:hover{background:#f8f9fa}.member-item.selected{background:#f0f4f8;border:1px solid #4b5563;cursor:pointer}.member-checkbox{width:20px;height:20px;border:2px solid #d1d5db;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff;transition:all .2s;flex-shrink:0}.member-item.selected .member-checkbox{background:#4b5563;border-color:#4b5563}.member-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#4b5563,#2f3237);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:16px;text-transform:uppercase;flex-shrink:0}.member-details{flex:1;min-width:0}.member-name{font-weight:600;font-size:14px;color:#1e293b;display:flex;align-items:center;gap:8px}.you-badge{background:#4b5563;color:#fff;font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px}.admin-badge{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px;display:inline-flex;align-items:center;gap:4px}.admin-badge:before{content:"★";font-size:10px}.member-role{font-size:12px;color:#636e72;text-transform:capitalize;margin-top:2px}.remove-member-btn{width:28px;height:28px;border-radius:50%;background:#fee;color:#e74c3c;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .2s;flex-shrink:0}.remove-member-btn:hover{background:#e74c3c;color:#fff;transform:scale(1.1)}.group-members-actions{display:flex;gap:12px;justify-content:flex-end;padding-top:16px;border-top:1px solid #e5e7eb}.group-members-actions button{padding:10px 20px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s;border:none}.cancel-btn{background:#f8f9fa;color:#636e72}.cancel-btn:hover{background:#e5e7eb;color:#4b5563}.add-btn{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.add-btn:hover{background:linear-gradient(135deg,#6b7280,#374151);transform:translateY(-1px);box-shadow:0 4px 12px #4b55634d}.add-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.add-btn:disabled:hover{transform:none;box-shadow:none}.leave-group-btn{background:#fee;color:#e74c3c;width:100%}.leave-group-btn:hover{background:#e74c3c;color:#fff}@media(max-width:480px){.group-members-overlay{align-items:flex-end}.group-members-modal{width:100%;height:auto;max-height:85vh;min-height:400px;border-radius:16px 16px 0 0;animation:slideUpMobile .3s cubic-bezier(.4,0,.2,1) forwards}.group-members-modal.closing{animation:slideDownMobile .25s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideUpMobile{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideDownMobile{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}.group-members-header,.group-members-content{padding:16px 20px}.members-list,.available-users-list{max-height:250px}.loading-members{min-height:200px}}.header{background:linear-gradient(135deg,#232930,#25272c);color:#fff;padding:0 1.5rem;height:64px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 2px 12px #00000026;position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(255,255,255,.1)}.header-left{display:flex;align-items:center;gap:2rem}.logo{font-size:1.5rem;font-weight:800;color:#fff;margin:0;letter-spacing:-.5px;position:relative}.logo:after{content:"";position:absolute;bottom:-4px;left:0;width:40%;height:3px;background:linear-gradient(90deg,rgba(255,255,255,.5),transparent);border-radius:2px}.logo-container{position:relative;display:flex;align-items:center}.pending-issues-indicator{position:absolute;top:-4px;right:-12px;width:10px;height:10px;background:linear-gradient(135deg,#ef4444,#dc2626);border-radius:50%;border:2px solid #0f172a;animation:pulse-red 2s cubic-bezier(.4,0,.6,1) infinite;box-shadow:0 0 #ef4444b3}@keyframes pulse-red{0%,to{box-shadow:0 0 #ef4444b3}50%{box-shadow:0 0 0 6px #ef444400}}.header-right{display:flex;align-items:center;gap:1.25rem}.entity-selector{position:relative}.current-entity{background:#667eea26;padding:.5rem 1rem;border-radius:8px;font-size:.875rem;font-weight:600;border:1px solid rgba(102,126,234,.3);color:#d1d5db;letter-spacing:.3px;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex;align-items:center;gap:8px}.current-entity:hover{background:#667eea40;border-color:#667eea80;transform:translateY(-1px)}.current-entity svg{transition:transform .2s}.entity-selector:has(.entity-dropdown) .current-entity svg{transform:rotate(180deg)}.dropdown-overlay{position:fixed;inset:0;z-index:999}.entity-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:#fff;border-radius:12px;box-shadow:0 10px 40px #0003;min-width:280px;z-index:1000;overflow:hidden;animation:dropdownSlide .2s cubic-bezier(.16,1,.3,1)}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.dropdown-header{padding:16px 20px;background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.5px}.dropdown-list{max-height:320px;overflow-y:auto;padding:8px}.dropdown-item{width:100%;padding:12px 16px;border:none;background:none;text-align:left;font-size:14px;font-weight:500;color:#374151;border-radius:8px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:space-between;gap:8px}.dropdown-item:hover{background:#f3f4f6;color:#4b5563}.dropdown-item.active{background:linear-gradient(135deg,#667eea1a,#764ba21a);color:#4b5563;font-weight:600}.dropdown-item svg{color:#4b5563;flex-shrink:0}.user-info{font-size:.8125rem;opacity:.9;font-weight:500;color:#cbd5e1}.logout-btn{background:linear-gradient(135deg,#ef4444,#dc2626);border:none;color:#fff;padding:.5rem 1.25rem;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 2px 8px #ef44444d;font-size:.8125rem}.logout-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ef444480}.logout-btn:active{transform:translateY(0)}.mobile-menu-btn{display:none;background:#667eea26;border:1px solid rgba(102,126,234,.3);cursor:pointer;padding:10px;border-radius:10px;margin-right:-8px;transition:all .3s cubic-bezier(.16,1,.3,1)}.mobile-menu-btn:hover{background:#667eea40;transform:scale(1.05)}.mobile-menu-btn:active{transform:scale(.95)}.hamburger-icon{display:flex;flex-direction:column;gap:5px;width:22px;height:18px;justify-content:center}.hamburger-icon span{display:block;height:2.5px;background:#fff;border-radius:3px;transition:all .3s cubic-bezier(.16,1,.3,1)}.hamburger-icon span:first-child{width:100%}.hamburger-icon span:nth-child(2){width:75%}.hamburger-icon span:last-child{width:100%}.mobile-menu-btn:hover .hamburger-icon span:nth-child(2){width:100%}.mobile-menu-btn.open .hamburger-icon span:first-child{transform:translateY(7.5px) rotate(45deg)}.mobile-menu-btn.open .hamburger-icon span:nth-child(2){opacity:0;transform:translate(-10px)}.mobile-menu-btn.open .hamburger-icon span:last-child{transform:translateY(-7.5px) rotate(-45deg)}.section-switcher{display:flex;background:#ffffff0f;border-radius:8px;padding:3px;border:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden}.section-switcher:before{content:"";position:absolute;width:50%;height:calc(100% - 6px);background:linear-gradient(135deg,#4b5563,#2f3237);border-radius:6px;top:3px;left:3px;transition:transform .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 8px #667eea66;z-index:0}.section-switcher:has(.section-btn:last-child.active):before{transform:translate(calc(100% - 6px))}.section-btn{background:transparent;border:none;color:#ffffff80;padding:.375rem 1rem;border-radius:6px;cursor:pointer;transition:all .3s cubic-bezier(.16,1,.3,1);font-weight:600;font-size:.75rem;position:relative;z-index:1;flex:1;white-space:nowrap}.section-btn:hover{color:#fffc}.section-btn.active{color:#fff}.sidebar{width:260px;background:linear-gradient(180deg,#232930,#25272c);padding:1.5rem 0;overflow-y:auto;flex-shrink:0;height:calc(100vh - 64px);position:sticky;top:64px;border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column}.mobile-sidebar-header{display:none}.nav-menu{list-style:none;padding:0 .75rem;margin:0;flex:1}.nav-menu li a{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;color:#94a3b8;text-decoration:none;transition:all .3s cubic-bezier(.16,1,.3,1);font-weight:600;border-radius:10px;margin-bottom:.375rem;font-size:.875rem;position:relative;overflow:hidden}.issue-count-badge{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;font-size:.6875rem;font-weight:700;padding:.25rem .5rem;border-radius:12px;min-width:20px;text-align:center;box-shadow:0 2px 8px #ef444466;animation:badge-pulse 2s ease-in-out infinite}@keyframes badge-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.nav-menu li a:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#4b5563,#1f2937);transform:scaleY(0);transition:transform .3s cubic-bezier(.16,1,.3,1);border-radius:0 3px 3px 0}.nav-menu li a:hover{background:#667eea1f;color:#fff;transform:translate(4px)}.nav-menu li a:hover:before{transform:scaleY(1)}.nav-menu li a.active{background:linear-gradient(135deg,#667eea33,#764ba226);color:#fff;box-shadow:0 2px 8px #667eea33}.nav-menu li a.active:before{transform:scaleY(1)}.nav-divider{padding:1.5rem 1rem .75rem;color:#4b5563;font-size:.6875rem;text-transform:uppercase;letter-spacing:1.5px;font-weight:700;opacity:.8}.sidebar-footer{padding:1rem .75rem;padding-bottom:calc(1rem + env(safe-area-inset-bottom));margin-top:auto;border-top:1px solid rgba(255,255,255,.1)}.sidebar-footer .logout-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:.875rem 1rem;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;border-radius:12px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 2px 8px #ef44444d}.sidebar-footer .logout-btn:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:translateY(-2px);box-shadow:0 4px 12px #ef444480}.sidebar-footer .logout-btn:active{transform:translateY(0)}.sidebar-footer .logout-btn svg{width:20px;height:20px}.mobile-overlay{display:none}@media(max-width:768px){.sidebar{width:240px}.header{padding:0 1.25rem;height:64px}.header-left{gap:1.5rem}.logo{font-size:1.5rem}.current-entity{font-size:.8125rem;padding:.5rem 1rem}.user-info{font-size:.8125rem}.logout-btn{padding:.5rem 1.125rem;font-size:.8125rem}}@media(max-width:768px){.mobile-menu-btn{display:block}.header{padding:0 1rem;padding-top:env(safe-area-inset-top);height:calc(64px + env(safe-area-inset-top))}.header-left{gap:1rem}.section-switcher,.user-info{display:none}.logout-btn{padding:.4rem .8rem;font-size:.75rem}.current-entity{padding:.4rem .75rem;font-size:.75rem;gap:6px}.entity-dropdown{min-width:240px;right:-10px}.edit-mode-toggle,.header-right .edit-mode-toggle{display:none!important}.mobile-overlay{display:block;position:fixed;inset:0;background:#00000080;z-index:150}.sidebar{position:fixed;top:0;left:-300px;width:300px;height:100vh;height:100dvh;z-index:200;transition:left .3s cubic-bezier(.16,1,.3,1);padding:0;box-shadow:4px 0 20px #0000004d;overflow-y:auto}.sidebar.mobile-open{left:0}.mobile-sidebar-header{display:block;padding:1.75rem 1.5rem;padding-top:calc(1.75rem + env(safe-area-inset-top));border-bottom:1px solid rgba(255,255,255,.1);background:#0000004d}.mobile-user-info{margin-bottom:1.25rem}.mobile-user-name{font-size:1.25rem;font-weight:700;color:#fff;margin-bottom:.375rem}.mobile-user-role{font-size:.875rem;color:#94a3b8;font-weight:500}.mobile-edit-mode-toggle{display:flex;align-items:center;gap:.75rem;background:#ffffff0f;padding:.625rem 1rem;border-radius:10px;border:1px solid rgba(255,255,255,.08);margin-bottom:1rem}.mobile-edit-mode-toggle .toggle-label{font-size:.875rem;font-weight:600;color:#94a3b8}.mobile-edit-mode-toggle .toggle-label.active{color:#fbbf24}.mobile-section-switcher{display:flex;gap:.625rem}.mobile-section-btn{flex:1;background:#ffffff14;border:1px solid rgba(255,255,255,.1);color:#ffffffb3;padding:.625rem 1rem;border-radius:10px;cursor:pointer;transition:all .3s;font-weight:600;font-size:.875rem}.mobile-section-btn.active{background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;border-color:transparent;box-shadow:0 2px 8px #667eea66}.nav-menu{padding:1.25rem 1rem}.main-container{flex-direction:column}.content{padding:1rem}}.edit-mode-toggle{display:flex;align-items:center;gap:.625rem;background:#ffffff0f;padding:.5rem .875rem;border-radius:8px;border:1px solid rgba(255,255,255,.08)}.toggle-switch{position:relative;display:inline-block;width:44px;height:24px;cursor:pointer}.toggle-slider{position:absolute;cursor:pointer;inset:0;background:#ffffff26;transition:all .4s cubic-bezier(.16,1,.3,1);border-radius:24px;border:1px solid rgba(255,255,255,.1)}.toggle-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:2px;background:#fff;transition:all .4s cubic-bezier(.34,1.56,.64,1);border-radius:50%;box-shadow:0 2px 4px #0003}.toggle-switch input:checked+.toggle-slider{background:linear-gradient(135deg,#f59e0b,#d97706);border-color:transparent;box-shadow:0 0 12px #f59e0b66}.toggle-switch input:checked+.toggle-slider:before{transform:translate(20px);box-shadow:0 2px 8px #0000004d}.toggle-label{font-size:.8125rem;font-weight:600;color:#94a3b8;transition:all .3s cubic-bezier(.16,1,.3,1);white-space:nowrap}.toggle-label.active{color:#fbbf24;text-shadow:0 0 8px rgba(251,191,36,.3)}@media(max-width:768px){.edit-mode-toggle{display:flex;flex-direction:column;gap:2px;align-items:center}.edit-mode-toggle .toggle-label{font-size:9px;white-space:nowrap}.edit-mode-toggle .toggle-switch{transform:scale(.8)}}.interactive-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;overflow:hidden;background:linear-gradient(135deg,#4b5563,#2f3237)}.background-canvas{position:absolute;top:0;left:0;width:100%;height:100%}.background-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,transparent 0%,rgba(0,0,0,.3) 100%);pointer-events:none}.login-page{position:relative;z-index:1}.modal-backdrop{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .3s ease}.modal-content{background:#fff;border-radius:24px!important;box-shadow:0 25px 80px #0006;max-width:650px;width:70%;max-height:90vh;overflow-y:auto;animation:slideUp .4s cubic-bezier(.16,1,.3,1);position:relative}.modal-header{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff!important;border-radius:24px 24px 0 0!important;padding:28px 32px;position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center}.modal-header:before{content:"";position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:#ffffff1a;border-radius:50%}.modal-header h3{color:#fff!important;font-size:26px;font-weight:700;margin:0;position:relative;z-index:1}.modal-close{color:#fff!important;background:#fff3;width:40px;height:40px;min-width:40px;min-height:40px;border-radius:12px;transition:all .2s;position:relative;z-index:10;border:none;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.modal-close:hover{background:#ffffff4d;color:#fff!important;transform:rotate(90deg)}.modal-body{padding:32px}.modal-body .form-card{background:none;border:none;box-shadow:none;padding:0;margin:0}.modal-body .form-row{display:flex;gap:20px;margin-bottom:24px}.modal-body .form-row>*{flex:1}.modal-body label{display:block;margin-bottom:10px;color:#1e293b;font-weight:600;font-size:14px;letter-spacing:.3px;text-transform:uppercase}.modal-body .required{color:#ef4444;margin-left:2px}.modal-body input,.modal-body select,.modal-body textarea{width:100%;padding:14px 16px;border:2px solid #e2e8f0;border-radius:12px;font-size:15px;transition:all .3s cubic-bezier(.16,1,.3,1);font-family:inherit;background:#fff}.modal-body input[type=date]{position:relative;padding-right:40px;cursor:pointer}.modal-body input[type=date]::-webkit-calendar-picker-indicator{position:absolute;right:12px;cursor:pointer;opacity:.6;transition:opacity .2s;width:20px;height:20px}.modal-body input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}.modal-body input[type=date]::-webkit-datetime-edit{padding:0}.modal-body input[type=date]::-webkit-datetime-edit-fields-wrapper{padding:0}.modal-body input[type=date]::-webkit-datetime-edit-text{color:#64748b;padding:0 2px}.modal-body input[type=date]::-webkit-datetime-edit-month-field,.modal-body input[type=date]::-webkit-datetime-edit-day-field,.modal-body input[type=date]::-webkit-datetime-edit-year-field{color:#1e293b;padding:0 2px}.modal-body input[type=date]::-webkit-datetime-edit-month-field:focus,.modal-body input[type=date]::-webkit-datetime-edit-day-field:focus,.modal-body input[type=date]::-webkit-datetime-edit-year-field:focus{background:#667eea1a;color:#4b5563;outline:none;border-radius:4px}.modal-body input:focus,.modal-body select:focus,.modal-body textarea:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 4px #667eea1a;background:#fafbff}.modal-body textarea{resize:vertical;min-height:120px}.modal-body .btn-primary{width:100%;padding:16px 32px;background:linear-gradient(135deg,#4b5563,#2f3237);background-size:100% 100%;background-position:center;color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.16,1,.3,1);margin-top:0;position:relative;overflow:hidden;box-shadow:0 4px 15px #667eea66;display:flex;align-items:center;justify-content:center;text-align:center}.modal-body .btn-primary:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#fff3;transform:translate(-50%,-50%);transition:width .6s,height .6s;pointer-events:none;z-index:0}.modal-body .btn-primary span,.modal-body .btn-primary{position:relative;z-index:1}.modal-body .btn-primary:hover:before{width:1000px;height:1000px}.modal-body .btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 25px #667eea80}.modal-body .btn-primary:active{transform:translateY(-1px)}.modal-body .btn-primary:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}.modal-body .btn-primary:disabled:before{display:none}.info-box{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border-left:5px solid #3b82f6;border-radius:16px;padding:24px;margin-bottom:28px;box-shadow:0 2px 8px #3b82f61a}.info-box p{margin:10px 0;font-size:15px;color:#1e293b;line-height:1.6}.info-box p:first-child{margin-top:0}.info-box strong{color:#0f172a;font-weight:700}@media(max-width:768px){.modal-backdrop{padding:10px}.modal-content{max-height:95vh;width:100%;max-width:100%;margin:0;border-radius:20px}.modal-header{padding:24px 20px;border-radius:20px 20px 0 0}.modal-header h3{font-size:22px}.modal-close{width:36px;height:36px;font-size:20px}.modal-body{padding:24px 20px}.modal-body .form-row{flex-direction:column;gap:12px}.modal-body input,.modal-body select,.modal-body textarea{padding:12px 14px;font-size:14px}.modal-body .btn-primary{padding:12px 24px;font-size:14px;display:flex;align-items:center;justify-content:center;text-align:center}.info-box{padding:18px;margin-bottom:20px}.info-box p{font-size:14px}}.forgot-password-modal{padding:1rem 0}.modal-description{text-align:center;color:#64748b;margin-bottom:1.5rem;font-size:.95rem}.otp-info{text-align:center;margin-bottom:2rem}.otp-info p{margin:.5rem 0;color:#64748b}.otp-email{font-weight:600;background:linear-gradient(135deg,#4b5563,#2f3237);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:1.1rem;margin:1rem 0!important}.otp-inputs{display:flex;justify-content:center;gap:.75rem;margin:2rem 0}.otp-input{width:3rem;height:3.5rem;text-align:center;font-size:1.5rem;font-weight:600;border:2px solid #e2e8f0;border-radius:8px;transition:all .2s;background:#fff}.otp-input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #4b53631a}.otp-input:disabled{background:#f1f5f9;cursor:not-allowed}.otp-timer{text-align:center;margin:1.5rem 0;color:#64748b;font-size:.9rem}.otp-timer strong{color:#4b5563;font-weight:600}.otp-timer .expired{color:#ef4444;font-weight:600}.otp-resend{text-align:center;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #e2e8f0}.otp-resend .btn-text{color:#4b5563;font-weight:600;padding:.5rem 1rem;background:none;border:none;cursor:pointer}.otp-resend .btn-text:hover{background:#4b53631a;border-radius:6px}.otp-resend .btn-text:disabled{opacity:.5;cursor:not-allowed}.otp-resend .resend-disabled{color:#94a3b8;font-size:.9rem}.error-message{background:#fee;color:#c33;padding:.75rem;border-radius:6px;text-align:center;margin-bottom:1rem;font-size:.9rem;border:1px solid #fcc}.form-group label{display:block;margin-bottom:.5rem;color:#334155;font-weight:500;font-size:.95rem}.form-group input{width:100%;padding:.75rem;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:all .2s}.form-group input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #4b53631a}.form-group input:disabled{background:#f1f5f9;cursor:not-allowed}.btn-full{width:100%;padding:.875rem;font-size:1rem;margin-top:1rem}.btn-full:disabled{opacity:.5;cursor:not-allowed}@media(max-width:480px){.otp-inputs{gap:.5rem}.otp-input{width:2.5rem;height:3rem;font-size:1.25rem}}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;z-index:1;padding:20px}.login-card{background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:2rem;border-radius:24px;box-shadow:0 25px 80px #0000004d,0 0 1px #ffffff80 inset;width:100%;max-width:420px;border:1px solid rgba(255,255,255,.2);animation:slideUp .6s cubic-bezier(.16,1,.3,1);transition:all .5s cubic-bezier(.16,1,.3,1)}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.login-card h1{text-align:center;margin-bottom:1.25rem;background:linear-gradient(135deg,#4b5563,#2f3237);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:2.5rem;font-weight:800;letter-spacing:-1px}.login-toggle{display:flex;background:#f1f5f9cc;border-radius:12px;padding:4px;margin-bottom:1.25rem;border:1px solid rgba(226,232,240,.8);position:relative}.login-toggle:before{content:"";position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:calc(100% - 8px);background:linear-gradient(135deg,#4b5563,#2f3237);border-radius:10px;transition:transform .3s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 12px #667eea66;z-index:0}.login-toggle.parent-mode:before{transform:translate(calc(100% + 4px))}.toggle-btn{flex:1;padding:.75rem 1rem;border:none;background:transparent;border-radius:10px;font-weight:600;color:#64748b;cursor:pointer;transition:color .3s cubic-bezier(.16,1,.3,1);position:relative;z-index:1}.toggle-btn.active{color:#fff}.toggle-btn:hover:not(.active){color:#475569}.parent-info{text-align:center;color:#64748b;font-size:.9rem;margin-bottom:1.25rem;line-height:1.5}.login-card form{overflow:hidden;transition:all .5s cubic-bezier(.16,1,.3,1)}.login-card form input,.login-card form select{width:100%;padding:.75rem 1rem;border:2px solid rgba(226,232,240,.8);border-radius:12px;font-size:.95rem;transition:all .3s cubic-bezier(.16,1,.3,1);background:#fffc;margin-bottom:.875rem}.login-card form input:focus,.login-card form select:focus{outline:none;border-color:#4b5563;background:#fff;box-shadow:0 0 0 4px #667eea1a;transform:translateY(-1px)}.login-card form input::placeholder{color:#94a3b8}.forgot-password-link{text-align:right;margin-top:-.5rem;margin-bottom:1rem}.link-button{background:none;border:none;color:#4b5563;font-size:.875rem;font-weight:500;cursor:pointer;padding:.25rem 0;transition:all .2s;position:relative}.link-button:after{content:"";position:absolute;bottom:0;left:0;width:0;height:1px;background:linear-gradient(135deg,#4b5563,#2f3237);transition:width .3s ease}.link-button:hover{color:#2f3237}.link-button:hover:after{width:100%}.login-card .error-message{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#991b1b;padding:.75rem 1rem;border-radius:12px;margin-bottom:.875rem;font-size:.9rem;font-weight:500;border:1px solid #fca5a5;animation:shake .4s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.login-card button[type=submit]{margin-top:.25rem;position:relative;overflow:hidden}.login-card button[type=submit]:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s}.login-card button[type=submit]:hover:before{width:1000px;height:1000px}.btn-full{width:100%;text-align:center;justify-content:center}.login-card button[type=submit]{text-align:center;justify-content:center;display:flex;align-items:center}.login-hint{text-align:center;margin-top:1.25rem;color:#64748b;font-size:.875rem;padding:.625rem;background:#f8fafccc;border-radius:8px}@media(max-width:768px){.login-page{padding:15px}.login-card{padding:1.75rem 1.5rem;max-width:100%}.login-card h1{font-size:2rem;margin-bottom:1rem}.toggle-btn{padding:.625rem .75rem;font-size:14px}.parent-info{font-size:.85rem;margin-bottom:1rem}.login-hint{font-size:.8rem;padding:.5rem;margin-top:1rem}.login-card form input,.login-card form select{padding:.625rem .875rem;margin-bottom:.75rem}}.parent-progress-page{min-height:100vh;background:linear-gradient(135deg,#f8fafc,#e2e8f0)}.loading-container,.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;text-align:center;padding:2rem}.loading-spinner{width:50px;height:50px;border:4px solid #e2e8f0;border-top-color:#4b5563;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.error-icon{font-size:4rem;margin-bottom:1rem}.error-container h2{color:#1a1a2e;margin-bottom:.5rem}.error-container p{color:#64748b;margin-bottom:1.5rem}.parent-header{background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;padding:1.5rem 2rem;display:flex;align-items:center;gap:1.5rem}.back-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.5rem 1rem;border-radius:8px;cursor:pointer;transition:all .2s}.back-btn:hover{background:#fff3}.parent-header h1{margin:0;font-size:1.5rem;font-weight:600}.parent-content{max-width:900px;margin:0 auto;padding:2rem}.student-info-card{background:#fff;border-radius:16px;padding:2rem;display:flex;align-items:center;gap:1.5rem;box-shadow:0 4px 12px #00000014;margin-bottom:1.5rem}.student-avatar-large{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.75rem;font-weight:600}.student-details h2{margin:0 0 .5rem;color:#1a1a2e;font-size:1.5rem}.student-meta{display:flex;gap:1rem;color:#64748b;font-size:.9rem;margin-bottom:.5rem}.curriculum-badge{display:inline-block;background:#f0fdf4;color:#16a34a;padding:.35rem .75rem;border-radius:20px;font-size:.85rem;font-weight:500}.attendance-card{background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 4px 12px #00000014;margin-bottom:1.5rem}.attendance-card h3{margin:0;color:#1a1a2e;font-size:1.1rem}.attendance-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.month-selector{display:flex;align-items:center;gap:.75rem}.month-nav-btn{background:#f1f5f9;border:none;width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:.85rem;color:#475569;transition:all .2s}.month-nav-btn:hover{background:#e2e8f0;color:#1a1a2e}.current-month{font-weight:600;color:#1a1a2e;min-width:140px;text-align:center}.attendance-overall{margin-top:1rem;padding-top:1rem;border-top:1px solid #e2e8f0;text-align:center;color:#475569;font-size:.9rem}.attendance-calendar{margin-bottom:1rem}.calendar-header{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:4px}.calendar-day-name{text-align:center;font-size:.75rem;font-weight:600;color:#64748b;padding:.5rem 0}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.calendar-cell{aspect-ratio:1;border-radius:8px;background:#f8fafc;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.85rem;position:relative;min-height:45px}.calendar-cell.empty{background:transparent}.calendar-cell .cell-day{font-weight:500;color:#475569}.calendar-cell .cell-status{font-size:.7rem;font-weight:700;margin-top:2px}.calendar-cell.att-present{background:#dcfce7}.calendar-cell.att-present .cell-day,.calendar-cell.att-present .cell-status{color:#16a34a}.calendar-cell.att-absent{background:#fef2f2}.calendar-cell.att-absent .cell-day,.calendar-cell.att-absent .cell-status{color:#dc2626}.calendar-cell.att-late{background:#fef3c7}.calendar-cell.att-late .cell-day,.calendar-cell.att-late .cell-status{color:#d97706}.attendance-legend{display:flex;flex-wrap:wrap;gap:1rem;padding-top:1rem;border-top:1px solid #e2e8f0}.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:#475569}.legend-dot{width:12px;height:12px;border-radius:3px}.legend-dot.present{background:#16a34a}.legend-dot.absent{background:#dc2626}.legend-dot.late{background:#d97706}.attendance-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.stat-item{text-align:center;padding:1rem;background:#f8fafc;border-radius:12px}.stat-item.present{background:#f0fdf4}.stat-item.absent{background:#fef2f2}.stat-item.percentage{background:#eff6ff}.stat-value{display:block;font-size:1.75rem;font-weight:700;color:#1a1a2e}.stat-item.present .stat-value{color:#16a34a}.stat-item.absent .stat-value{color:#dc2626}.stat-item.percentage .stat-value{color:#2563eb}.stat-label{display:block;font-size:.8rem;color:#64748b;margin-top:.25rem}.no-curriculum-card,.no-progress-card{background:#fff;border-radius:16px;padding:3rem 2rem;text-align:center;box-shadow:0 4px 12px #00000014}.no-curriculum-card .icon,.no-progress-card .icon{font-size:3rem;margin-bottom:1rem}.no-curriculum-card h3,.no-progress-card h3{color:#1a1a2e;margin-bottom:.5rem}.no-curriculum-card p,.no-progress-card p{color:#64748b;max-width:400px;margin:0 auto}.curriculum-progress-section{background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 4px 12px #00000014}.curriculum-progress-section h3{margin:0 0 1.5rem;color:#1a1a2e;font-size:1.1rem}.subject-card{border:1px solid #e2e8f0;border-radius:12px;margin-bottom:1rem;overflow:hidden}.subject-header{display:flex;align-items:flex-start;padding:1rem 1.25rem;background:#f8fafc;cursor:pointer;transition:background .2s}.subject-header:hover{background:#f1f5f9}.subject-title-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.subject-info h4{margin:0;color:#1a1a2e;font-size:1rem}.topic-count{font-size:.8rem;color:#64748b;display:block;margin-left:20px}.subject-progress{display:flex;align-items:center;gap:.75rem;flex-shrink:0;margin-left:1rem;margin-top:.25rem}.subject-progress .progress-bar{width:100px;height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden;flex-shrink:0;margin-bottom:0!important}.progress-fill{height:100%;background:linear-gradient(90deg,#4b5563,#1f2937);border-radius:4px;transition:width .3s}.progress-text{font-size:.85rem;font-weight:600;color:#4b5563;min-width:40px;flex-shrink:0;white-space:nowrap;line-height:1}.expand-icon{color:#94a3b8;font-size:.85rem;flex-shrink:0;width:20px;text-align:left;line-height:1}.topics-list{padding:.5rem;background:#fff}.topic-item{padding:1rem;border-radius:8px;margin-bottom:.5rem;background:#f8fafc;display:flex;flex-direction:column}.topic-item.completed{background:#f0fdf4;border-left:3px solid #16a34a}.topic-item.in_progress{background:#fffbeb;border-left:3px solid #f59e0b}.topic-item.not_started{background:#f8fafc;border-left:3px solid #cbd5e1}.topic-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding:.5rem;border-radius:6px;transition:background .2s;width:100%}.topic-header:hover{background:#00000005}.topic-name{font-weight:500;color:#1a1a2e}.status-badge{padding:.25rem .75rem;border-radius:20px;font-size:.75rem;font-weight:500}.status-badge.completed{background:#dcfce7;color:#16a34a}.status-badge.in-progress{background:#fef3c7;color:#d97706}.status-badge.not-started{background:#f1f5f9;color:#64748b}.topic-skills{margin-top:1rem;padding-top:1rem;border-top:1px solid #e2e8f0}.topic-skills h5{margin:0 0 .75rem;font-size:.85rem;color:#64748b}.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem}.skill-icon{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700}.skill-label{color:#475569}.topic-remarks{margin-top:.75rem;padding:.75rem;background:#fff;border-radius:6px;font-size:.85rem;color:#475569}@media(max-width:768px){.parent-content{padding:1rem}.student-info-card{flex-direction:column;text-align:center}.attendance-stats{grid-template-columns:repeat(2,1fr)}.skills-grid{grid-template-columns:1fr}.subject-progress{display:none}.parent-progress-page{padding:12px}.student-info{padding:16px}.info-grid{grid-template-columns:1fr}.attendance-summary{padding:16px}.summary-stats{grid-template-columns:repeat(2,1fr)}.calendar-section{padding:16px}.calendar-header{flex-direction:column;gap:12px}.month-selector{width:100%;justify-content:center}.calendar-grid{gap:4px}.day-cell{font-size:11px;padding:6px 4px}.progress-section,.subject-card{padding:16px}.subject-header{flex-direction:column;align-items:flex-start;gap:8px}.topic-scores{flex-direction:column;gap:6px}.score-item{font-size:11px}.student-avatar{width:60px;height:60px}.student-name{font-size:18px}.student-details{font-size:12px}}.fees-alert-banner{background:linear-gradient(135deg,#fee2e2,#fecaca);border-left:6px solid #dc2626;border-radius:12px;padding:24px;margin-bottom:24px;box-shadow:0 4px 12px #dc262626;animation:slideIn .3s ease-out}.fees-alert-banner.warning{background:linear-gradient(135deg,#fef3c7,#fde68a);border-left-color:#f59e0b;box-shadow:0 4px 12px #f59e0b26}.fees-alert-content{width:100%}.fees-alert-content h3{color:#991b1b;font-size:20px;font-weight:800;margin:0 0 12px;letter-spacing:.5px;text-transform:uppercase}.fees-alert-banner.warning .fees-alert-content h3{color:#92400e}.fees-alert-content p{color:#7f1d1d;font-size:15px;margin:0 0 16px;line-height:1.6}.fees-alert-banner.warning .fees-alert-content p{color:#78350f}.fees-alert-details{display:flex;gap:16px;flex-wrap:wrap}.fees-alert-details span{background:#fffc;padding:8px 16px;border-radius:8px;font-size:14px;font-weight:700;color:#991b1b;border:1px solid rgba(220,38,38,.2)}.fees-alert-banner.warning .fees-alert-details span{color:#92400e;border-color:#f59e0b33}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.fees-alert-banner{padding:20px}.fees-alert-content h3{font-size:18px}.fees-alert-content p{font-size:14px}.fees-alert-details{flex-direction:column;gap:12px}.fees-alert-details span{text-align:center}}.react-datepicker__navigation-icon:before,.react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow{border-color:#ccc;border-style:solid;border-width:3px 3px 0 0;content:"";display:block;height:9px;position:absolute;top:6px;width:9px}.react-datepicker__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.react-datepicker-wrapper{display:inline-block;padding:0;border:0}.react-datepicker{font-family:Helvetica Neue,helvetica,arial,sans-serif;font-size:.8rem;background-color:#fff;color:#000;border:1px solid #aeaeae;border-radius:.3rem;display:inline-block;position:relative;line-height:initial}.react-datepicker--time-only .react-datepicker__time-container{border-left:0}.react-datepicker--time-only .react-datepicker__time,.react-datepicker--time-only .react-datepicker__time-box{border-bottom-left-radius:.375em;border-bottom-right-radius:.375em}.react-datepicker-popper{z-index:1;line-height:0}.react-datepicker-popper .react-datepicker__triangle{stroke:#aeaeae}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{fill:#f0f0f0;color:#f0f0f0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper--header-middle[data-placement^=bottom] .react-datepicker__triangle,.react-datepicker-popper--header-bottom[data-placement^=bottom] .react-datepicker__triangle{fill:#fff;color:#fff}.react-datepicker-popper--header-bottom[data-placement^=top] .react-datepicker__triangle{fill:#f0f0f0;color:#f0f0f0}.react-datepicker__header{text-align:center;background-color:#f0f0f0;border-bottom:1px solid #aeaeae;border-top-left-radius:.3rem;padding:8px 0;position:relative}.react-datepicker__header--time{padding-bottom:8px;padding-left:5px;padding-right:5px}.react-datepicker__header--time:not(.react-datepicker__header--time--only){border-top-left-radius:0}.react-datepicker__header:not(.react-datepicker__header--has-time-select,.react-datepicker__header--middle,.react-datepicker__header--bottom){border-top-right-radius:.3rem}.react-datepicker__header--middle{border-top:1px solid #aeaeae;border-radius:0;margin-top:4px}.react-datepicker__header--bottom{border-bottom:none;border-top:1px solid #aeaeae;border-radius:0 0 .3rem .3rem}.react-datepicker__header-wrapper{position:relative}.react-datepicker__header-wrapper .react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:2px}.react-datepicker__year-dropdown-container--select,.react-datepicker__month-dropdown-container--select,.react-datepicker__month-year-dropdown-container--select,.react-datepicker__year-dropdown-container--scroll,.react-datepicker__month-dropdown-container--scroll,.react-datepicker__month-year-dropdown-container--scroll{display:inline-block;margin:0 15px}.react-datepicker__month-select,.react-datepicker__year-select,.react-datepicker__month-year-select{background-color:transparent;border:1px solid #aeaeae;border-radius:.3rem;color:inherit;cursor:pointer;font-family:inherit;font-size:inherit;margin-top:5px;padding:2px 5px}.react-datepicker__month-select:focus-visible,.react-datepicker__year-select:focus-visible,.react-datepicker__month-year-select:focus-visible{outline:auto 1px}.react-datepicker__current-month,.react-datepicker-time__header,.react-datepicker-year-header{margin-top:0;color:#000;font-weight:700;font-size:.944rem}h2.react-datepicker__current-month{padding:0;margin:0}.react-datepicker-time__header{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.react-datepicker__navigation{align-items:center;background:none;display:flex;justify-content:center;text-align:center;cursor:pointer;position:absolute;top:2px;padding:0;border:none;z-index:1;height:32px;width:32px;text-indent:-999em;overflow:hidden}.react-datepicker__navigation--previous{left:2px}.react-datepicker__navigation--next{right:2px}.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:85px}.react-datepicker__navigation--years{position:relative;top:0;display:block;margin-left:auto;margin-right:auto}.react-datepicker__navigation--years-previous{top:4px}.react-datepicker__navigation--years-upcoming{top:-4px}.react-datepicker__navigation:hover *:before{border-color:#a6a6a6}.react-datepicker__navigation-icon{position:relative;top:-1px;font-size:20px;width:0}.react-datepicker__navigation-icon--next{left:-2px}.react-datepicker__navigation-icon--next:before{transform:rotate(45deg);left:-7px}.react-datepicker__navigation-icon--previous{right:-2px}.react-datepicker__navigation-icon--previous:before{transform:rotate(225deg);right:-7px}.react-datepicker__month-container{float:left}.react-datepicker__year{margin:.5em;text-align:center}.react-datepicker__year-wrapper{display:flex;flex-wrap:wrap;max-width:180px}.react-datepicker__year .react-datepicker__year-text{display:inline-block;width:5em;margin:2px}.react-datepicker__month{margin:.5em;text-align:center}.react-datepicker__month .react-datepicker__month-text,.react-datepicker__month .react-datepicker__quarter-text{display:inline-block;width:5em;margin:2px}.react-datepicker__input-time-container{clear:both;width:100%;float:left;margin:5px 0 10px 15px;text-align:left}.react-datepicker__input-time-container .react-datepicker-time__caption,.react-datepicker__input-time-container .react-datepicker-time__input-container{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input{display:inline-block;margin-left:10px}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input{width:auto}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]{-moz-appearance:textfield}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter{margin-left:5px;display:inline-block}.react-datepicker__time-container{float:right;border-left:1px solid #aeaeae;width:85px}.react-datepicker__time-container--with-today-button{display:inline;border:1px solid #aeaeae;border-radius:.375em;position:absolute;right:-87px;top:0}.react-datepicker__time-container .react-datepicker__time{position:relative;background:#fff;border-bottom-right-radius:.375em}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box{width:85px;overflow-x:hidden;margin:0 auto;text-align:center;border-bottom-right-radius:.375em}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list{list-style:none;margin:0;height:calc(195px + 1.0625em);overflow-y:scroll;padding-right:0;padding-left:0;width:100%;box-sizing:content-box}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item{height:30px;padding:5px 10px;white-space:nowrap}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover{cursor:pointer;background-color:#f0f0f0}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected{background-color:#216ba5;color:#fff;font-weight:700}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover{background-color:#216ba5}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled{color:#ccc}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover{cursor:default;background-color:transparent}.react-datepicker__week-number{color:#ccc;display:inline-block;width:2.125em;line-height:2.125em;text-align:center;margin:.208em}.react-datepicker__week-number.react-datepicker__week-number--clickable{cursor:pointer}.react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected):hover{border-radius:.3rem;background-color:#f0f0f0}.react-datepicker__week-number--selected{border-radius:.3rem;background-color:#216ba5;color:#fff}.react-datepicker__week-number--selected:hover{background-color:#1d5d90}.react-datepicker__day-names{text-align:center;white-space:nowrap;margin-bottom:-8px}.react-datepicker__week{white-space:nowrap}.react-datepicker__day-name,.react-datepicker__day,.react-datepicker__time-name{color:#000;display:inline-block;width:2.125em;line-height:2.125em;text-align:center;margin:.208em}.react-datepicker__day-name--disabled,.react-datepicker__day--disabled,.react-datepicker__time-name--disabled{cursor:default;color:#ccc}.react-datepicker__day,.react-datepicker__month-text,.react-datepicker__quarter-text,.react-datepicker__year-text{cursor:pointer}.react-datepicker__day:not([aria-disabled=true]):hover,.react-datepicker__month-text:not([aria-disabled=true]):hover,.react-datepicker__quarter-text:not([aria-disabled=true]):hover,.react-datepicker__year-text:not([aria-disabled=true]):hover{border-radius:.3rem;background-color:#f0f0f0}.react-datepicker__day--today,.react-datepicker__month-text--today,.react-datepicker__quarter-text--today,.react-datepicker__year-text--today{font-weight:700}.react-datepicker__day--highlighted,.react-datepicker__month-text--highlighted,.react-datepicker__quarter-text--highlighted,.react-datepicker__year-text--highlighted{border-radius:.3rem;background-color:#3dcc4a;color:#fff}.react-datepicker__day--highlighted:not([aria-disabled=true]):hover,.react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover,.react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover{background-color:#32be3f}.react-datepicker__day--highlighted-custom-1,.react-datepicker__month-text--highlighted-custom-1,.react-datepicker__quarter-text--highlighted-custom-1,.react-datepicker__year-text--highlighted-custom-1{color:#f0f}.react-datepicker__day--highlighted-custom-2,.react-datepicker__month-text--highlighted-custom-2,.react-datepicker__quarter-text--highlighted-custom-2,.react-datepicker__year-text--highlighted-custom-2{color:green}.react-datepicker__day--holidays,.react-datepicker__month-text--holidays,.react-datepicker__quarter-text--holidays,.react-datepicker__year-text--holidays{position:relative;border-radius:.3rem;background-color:#ff6803;color:#fff}.react-datepicker__day--holidays .overlay,.react-datepicker__month-text--holidays .overlay,.react-datepicker__quarter-text--holidays .overlay,.react-datepicker__year-text--holidays .overlay{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background-color:#333;color:#fff;padding:4px;border-radius:4px;white-space:nowrap;visibility:hidden;opacity:0;transition:visibility 0s,opacity .3s ease-in-out}.react-datepicker__day--holidays:not([aria-disabled=true]):hover,.react-datepicker__month-text--holidays:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover,.react-datepicker__year-text--holidays:not([aria-disabled=true]):hover{background-color:#cf5300}.react-datepicker__day--holidays:hover .overlay,.react-datepicker__month-text--holidays:hover .overlay,.react-datepicker__quarter-text--holidays:hover .overlay,.react-datepicker__year-text--holidays:hover .overlay{visibility:visible;opacity:1}.react-datepicker__day--selected,.react-datepicker__day--in-selecting-range,.react-datepicker__day--in-range,.react-datepicker__month-text--selected,.react-datepicker__month-text--in-selecting-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--selected,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--selected,.react-datepicker__year-text--in-selecting-range,.react-datepicker__year-text--in-range{border-radius:.3rem;background-color:#216ba5;color:#fff}.react-datepicker__day--selected:not([aria-disabled=true]):hover,.react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__day--in-range:not([aria-disabled=true]):hover,.react-datepicker__month-text--selected:not([aria-disabled=true]):hover,.react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__month-text--in-range:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover,.react-datepicker__year-text--selected:not([aria-disabled=true]):hover,.react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__year-text--in-range:not([aria-disabled=true]):hover{background-color:#1d5d90}.react-datepicker__day--keyboard-selected,.react-datepicker__month-text--keyboard-selected,.react-datepicker__quarter-text--keyboard-selected,.react-datepicker__year-text--keyboard-selected{border-radius:.3rem;background-color:#bad9f1;color:#000}.react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover,.react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover,.react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover{background-color:#1d5d90;color:#fff}.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range){background-color:#216ba580}.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range){background-color:#f0f0f0;color:#000}.react-datepicker__day--disabled,.react-datepicker__month-text--disabled,.react-datepicker__quarter-text--disabled,.react-datepicker__year-text--disabled{cursor:default;color:#ccc}.react-datepicker__day--disabled .overlay,.react-datepicker__month-text--disabled .overlay,.react-datepicker__quarter-text--disabled .overlay,.react-datepicker__year-text--disabled .overlay{position:absolute;bottom:70%;left:50%;transform:translate(-50%);background-color:#333;color:#fff;padding:4px;border-radius:4px;white-space:nowrap;visibility:hidden;opacity:0;transition:visibility 0s,opacity .3s ease-in-out}.react-datepicker__input-container{position:relative;display:inline-block;width:100%}.react-datepicker__input-container .react-datepicker__calendar-icon{position:absolute;padding:.625em;box-sizing:content-box}.react-datepicker__view-calendar-icon input{padding:6px 10px 5px 25px}.react-datepicker__year-read-view,.react-datepicker__month-read-view,.react-datepicker__month-year-read-view{border:1px solid transparent;border-radius:.3rem;position:relative}.react-datepicker__year-read-view:hover,.react-datepicker__month-read-view:hover,.react-datepicker__month-year-read-view:hover{cursor:pointer}.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow{border-top-color:#b3b3b3}.react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow{transform:rotate(135deg);right:-16px;top:0}.react-datepicker__year-dropdown,.react-datepicker__month-dropdown,.react-datepicker__month-year-dropdown{background-color:#f0f0f0;position:absolute;width:50%;left:25%;top:30px;z-index:1;text-align:center;border-radius:.3rem;border:1px solid #aeaeae}.react-datepicker__year-dropdown:hover,.react-datepicker__month-dropdown:hover,.react-datepicker__month-year-dropdown:hover{cursor:pointer}.react-datepicker__year-dropdown--scrollable,.react-datepicker__month-dropdown--scrollable,.react-datepicker__month-year-dropdown--scrollable{height:150px;overflow-y:scroll}.react-datepicker__year-option,.react-datepicker__month-option,.react-datepicker__month-year-option{line-height:20px;width:100%;display:block;margin-left:auto;margin-right:auto}.react-datepicker__year-option:first-of-type,.react-datepicker__month-option:first-of-type,.react-datepicker__month-year-option:first-of-type{border-top-left-radius:.3rem;border-top-right-radius:.3rem}.react-datepicker__year-option:last-of-type,.react-datepicker__month-option:last-of-type,.react-datepicker__month-year-option:last-of-type{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem}.react-datepicker__year-option:hover,.react-datepicker__month-option:hover,.react-datepicker__month-year-option:hover{background-color:#ccc}.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming{border-bottom-color:#b3b3b3}.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous{border-top-color:#b3b3b3}.react-datepicker__year-option--selected,.react-datepicker__month-option--selected,.react-datepicker__month-year-option--selected{position:absolute;left:15px}.react-datepicker__close-icon{cursor:pointer;background-color:transparent;border:0;outline:0;padding:0 6px 0 0;position:absolute;top:0;right:0;height:100%;display:table-cell;vertical-align:middle}.react-datepicker__close-icon:after{cursor:pointer;background-color:#216ba5;color:#fff;border-radius:50%;height:16px;width:16px;padding:2px;font-size:12px;line-height:1;text-align:center;display:table-cell;vertical-align:middle;content:"×"}.react-datepicker__close-icon--disabled{cursor:default}.react-datepicker__close-icon--disabled:after{cursor:default;background-color:#ccc}.react-datepicker__today-button{background:#f0f0f0;border-top:1px solid #aeaeae;cursor:pointer;text-align:center;font-weight:700;padding:5px 0;clear:left}.react-datepicker__portal{position:fixed;width:100vw;height:100vh;background-color:#000c;left:0;top:0;justify-content:center;align-items:center;display:flex;z-index:2147483647}.react-datepicker__children-container{width:17.25em;margin:.5em;padding-right:.25em;padding-left:.25em;height:auto}.react-datepicker__aria-live{position:absolute;clip-path:circle(0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;width:1px;white-space:nowrap}.react-datepicker__calendar-icon{width:1em;height:1em;vertical-align:-.125em}.react-datepicker-popper-offset{margin-top:-.7em}.custom-datepicker-input{width:100%;padding:0 16px;height:40px;border:2px solid #e2e8f0;border-radius:12px;font-size:15px;transition:all .3s cubic-bezier(.16,1,.3,1);font-family:inherit;background:#fff;cursor:pointer;box-sizing:border-box}.custom-datepicker-input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 4px #667eea1a;background:#fafbff}.custom-datepicker-input::placeholder{color:#94a3b8}.react-datepicker-popper{z-index:9999!important}.react-datepicker-popper[data-placement^=bottom]{margin-top:8px}.react-datepicker-popper[data-placement^=top]{margin-bottom:8px}.react-datepicker__portal{position:fixed!important;inset:0!important;background:#000000b3!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex!important;align-items:center!important;justify-content:center!important;z-index:9999!important;padding:20px;animation:fadeIn .2s ease}.react-datepicker__portal .react-datepicker{animation:slideUp .3s cubic-bezier(.16,1,.3,1)}@keyframes slideUp{0%{transform:translateY(20px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.custom-datepicker-calendar{font-family:inherit;border:none;border-radius:16px;box-shadow:0 10px 40px #00000026;overflow:hidden}.react-datepicker__header{background:linear-gradient(135deg,#4b5563,#2f3237);border-bottom:none;padding:20px 10px 10px;border-radius:16px 16px 0 0;position:relative}.react-datepicker__header *:not(.react-datepicker__day-name){color:#fff!important}.react-datepicker__current-month{color:#fff!important;font-weight:700;font-size:16px;margin-bottom:10px;text-align:center}.react-datepicker__current-month,.react-datepicker__year-read-view--selected-year{color:#fff!important}.react-datepicker-year-header,.react-datepicker-time__header{color:#fff!important;flex:1;text-align:center}.react-datepicker__day-name{color:#6b7280;font-weight:600;font-size:13px;width:36px;line-height:36px;margin:4px}.react-datepicker__navigation{position:absolute;top:25px;width:25px;height:50px;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;z-index:10;border:none}.react-datepicker__navigation:hover{transform:scale(1.2)}.react-datepicker__navigation--previous{left:15px}.react-datepicker__navigation--next{right:15px}.react-datepicker.react-datepicker--month-year-picker .react-datepicker__navigation,.custom-monthpicker-calendar .react-datepicker__navigation{top:6px!important}.react-datepicker.react-datepicker--month-year-picker .react-datepicker__navigation:hover,.custom-monthpicker-calendar .react-datepicker__navigation:hover{transform:scale(1.2)!important}.react-datepicker.react-datepicker--month-year-picker .react-datepicker__navigation--previous,.custom-monthpicker-calendar .react-datepicker__navigation--previous{left:15px!important}.react-datepicker.react-datepicker--month-year-picker .react-datepicker__navigation--next,.custom-monthpicker-calendar .react-datepicker__navigation--next{right:15px!important}.react-datepicker.react-datepicker--month-year-picker .react-datepicker__navigation-icon:before,.custom-monthpicker-calendar .react-datepicker__navigation-icon:before{border-color:#fff!important;border-width:3px 3px 0 0!important;width:10px!important;height:10px!important}.react-datepicker__navigation-icon:before{border-color:#fff!important;border-width:3px 3px 0 0!important;width:10px;height:10px}.react-datepicker__navigation:hover *:before{border-color:#fff!important}.react-datepicker__month{margin:10px;padding:5px}.react-datepicker__day{width:36px;line-height:36px;margin:4px;border-radius:8px;color:#374151;font-weight:500;transition:all .2s}.react-datepicker__day:hover{background:#667eea1a;color:#4b5563;border-radius:8px}.react-datepicker__day--selected,.react-datepicker__day--keyboard-selected{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;font-weight:700;border-radius:8px}.react-datepicker__day--selected:hover,.react-datepicker__day--keyboard-selected:hover{background:linear-gradient(135deg,#5568d3,#653a8b)}.react-datepicker__day--today{font-weight:700;color:#4b5563;background:#667eea1a;border-radius:8px}.react-datepicker__day--disabled{color:#cbd5e1;cursor:not-allowed}.react-datepicker__day--disabled:hover{background:transparent;color:#cbd5e1}.react-datepicker__day--outside-month{color:#cbd5e1}.react-datepicker__month-dropdown-container,.react-datepicker__year-dropdown-container{margin:0 5px}.react-datepicker__month-select,.react-datepicker__year-select{background:#fff3!important;color:#fff!important;border:1px solid rgba(255,255,255,.3)!important;border-radius:8px;padding:4px 8px;font-weight:600;cursor:pointer;transition:all .2s;-webkit-appearance:auto;appearance:auto}.react-datepicker__month-select:hover,.react-datepicker__year-select:hover{background:#ffffff4d!important}.react-datepicker__month-select option,.react-datepicker__year-select option{background:#fff!important;color:#374151!important;padding:8px;font-weight:500}.react-datepicker__triangle{display:none}@media(max-width:768px){.custom-datepicker-calendar{font-size:14px}.react-datepicker__day,.react-datepicker__day-name{width:32px;line-height:32px;margin:2px}.react-datepicker__current-month{font-size:14px}}.react-datepicker--month-year-picker .react-datepicker__month-container,.custom-monthpicker-calendar .react-datepicker__month-container{width:100%}.react-datepicker__month-wrapper{display:flex;justify-content:space-around;margin:10px 0}.react-datepicker__month .react-datepicker__month-text,.react-datepicker__month .react-datepicker__quarter-text{display:inline-block;width:80px;margin:8px;padding:12px;border-radius:10px;color:#374151;font-weight:600;font-size:14px;transition:all .2s;cursor:pointer}.react-datepicker__month .react-datepicker__month-text:hover,.react-datepicker__month .react-datepicker__quarter-text:hover{background:#667eea1a;color:#4b5563}.react-datepicker__month .react-datepicker__month-text--selected,.react-datepicker__month .react-datepicker__month-text--keyboard-selected,.react-datepicker__month .react-datepicker__quarter-text--selected,.react-datepicker__month .react-datepicker__quarter-text--keyboard-selected{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;font-weight:700}.react-datepicker__month .react-datepicker__month-text--selected:hover,.react-datepicker__month .react-datepicker__quarter-text--selected:hover{background:linear-gradient(135deg,#5568d3,#653a8b)}.react-datepicker__month .react-datepicker__month-text--today,.react-datepicker__month .react-datepicker__quarter-text--today{font-weight:700;color:#4b5563;background:#667eea1a}.react-datepicker__month .react-datepicker__month-text--disabled,.react-datepicker__month .react-datepicker__quarter-text--disabled{color:#cbd5e1;cursor:not-allowed}.react-datepicker__month .react-datepicker__month-text--disabled:hover,.react-datepicker__month .react-datepicker__quarter-text--disabled:hover{background:transparent;color:#cbd5e1}.react-datepicker__year-wrapper{display:flex;flex-wrap:wrap;max-width:320px;justify-content:center}.react-datepicker__year .react-datepicker__year-text{display:inline-block;width:70px;margin:6px;padding:10px;border-radius:10px;color:#374151;font-weight:600;font-size:14px;transition:all .2s;cursor:pointer}.react-datepicker__year .react-datepicker__year-text:hover{background:#667eea1a;color:#4b5563}.react-datepicker__year .react-datepicker__year-text--selected,.react-datepicker__year .react-datepicker__year-text--keyboard-selected{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;font-weight:700}.react-datepicker__year .react-datepicker__year-text--today{font-weight:700;color:#4b5563;background:#667eea1a}.react-datepicker--month-year-picker .react-datepicker__header{padding:20px 70px 15px}.react-datepicker--month-year-picker .react-datepicker__current-month{margin-bottom:15px;color:#fff!important}.react-datepicker--month-year-picker .react-datepicker__month-container{padding:10px}.custom-monthpicker-calendar .react-datepicker__current-month{color:#fff!important}.custom-monthpicker-calendar .react-datepicker__header{background:linear-gradient(135deg,#4b5563,#2f3237)}.custom-monthpicker-calendar .react-datepicker__year-read-view,.custom-monthpicker-calendar .react-datepicker__month-read-view,.custom-monthpicker-calendar .react-datepicker__year-read-view--selected-year,.custom-monthpicker-calendar .react-datepicker__month-read-view--selected-month{color:#fff!important}.custom-monthpicker-calendar .react-datepicker__year-read-view--down-arrow,.custom-monthpicker-calendar .react-datepicker__month-read-view--down-arrow{border-color:#fff!important;border-width:2px 2px 0 0!important}.react-datepicker-popper{z-index:10000!important}.classes-page{max-width:100%;height:calc(100vh - 120px);display:flex;flex-direction:column}.class-form-container{max-width:100%}.classes-layout{display:grid;grid-template-columns:220px 1fr;gap:1rem;height:100%;overflow:hidden}.classes-layout.full-width{grid-template-columns:1fr}.create-class-panel{background:#fff;border-radius:12px;padding:.75rem;box-shadow:0 4px 6px -1px #0000001a;display:flex;flex-direction:column;height:100%;overflow:hidden}.create-class-panel h3{color:#1a1a2e;margin:0 0 .6rem;font-size:1rem;font-weight:600}.curriculum-list{flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:.5rem;align-content:start}.curriculum-list::-webkit-scrollbar{width:4px}.curriculum-list::-webkit-scrollbar-track{background:#f1f5f9;border-radius:10px}.curriculum-list::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}.curriculum-list::-webkit-scrollbar-thumb:hover{background:#94a3b8}.curriculum-item{background:linear-gradient(135deg,#f8fafc,#f3f4f6);border-radius:8px;padding:.5rem .6rem;cursor:pointer;transition:all .2s;border:2px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;gap:.4rem;min-height:44px}.curriculum-item:hover{transform:translate(4px);box-shadow:0 4px 12px #667eea40;border-color:#4b5563}.curriculum-item.selected{background:linear-gradient(135deg,#4b5563,#2f3237);border-color:#4b5563;box-shadow:0 4px 12px #667eea66}.curriculum-item.selected .curriculum-name{color:#fff}.curriculum-item.selected .btn-add{background:#fff;color:#4b5563}.curriculum-item.selected:hover{background:linear-gradient(135deg,#6b7280,#374151);box-shadow:0 6px 16px #4b556380}.curriculum-item.selected:hover .curriculum-name{color:#fff}.curriculum-item.selected:hover .btn-add{background:#fff;color:#4b5563;transform:scale(1.1)}.curriculum-name{color:#1a1a2e;font-size:.85rem;font-weight:600;flex:1}.btn-add{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;border:none;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.btn-add:hover{transform:scale(1.15);box-shadow:0 4px 8px #667eea66}.existing-classes-panel{background:#fff;border-radius:12px;padding:1rem;box-shadow:0 4px 6px -1px #0000001a;display:flex;flex-direction:column;height:100%;overflow:hidden}.existing-classes-panel h3{color:#1a1a2e;margin:0 0 1rem;font-size:1.2rem}.existing-classes-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.existing-classes-header h3{margin:0}.btn-clear-filter{padding:.4rem .8rem;background:#f1f5f9;color:#64748b;border:1px solid #e2e8f0;border-radius:6px;font-size:.85rem;cursor:pointer;transition:all .2s}.btn-clear-filter:hover{background:#e2e8f0;color:#1a1a2e}.classes-grid{flex:1;overflow-y:auto;overflow-x:hidden;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;align-content:start;padding:.25rem .5rem .5rem .25rem}.classes-grid::-webkit-scrollbar{width:6px}.classes-grid::-webkit-scrollbar-track{background:#f1f5f9;border-radius:10px}.classes-grid::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}.classes-grid::-webkit-scrollbar-thumb:hover{background:#94a3b8}.modal-subtitle{color:#4b5563;font-size:.95rem;margin-bottom:1.5rem;padding:.75rem;background:#f0f4ff;border-radius:8px;text-align:center}@media(max-width:1200px){.classes-layout{grid-template-columns:200px 1fr}.classes-grid{grid-template-columns:1fr}}@media(max-width:900px){.classes-layout{grid-template-columns:1fr;grid-template-rows:auto 1fr}.create-class-panel{max-height:none;height:auto;padding:.75rem 0}.create-class-panel h3{padding:0 .75rem;margin-bottom:.75rem}.curriculum-list{display:flex;flex-direction:row;overflow-x:auto;overflow-y:hidden;gap:.75rem;padding:0 .75rem .5rem 0;scroll-snap-type:x mandatory}.curriculum-list:before{content:"";flex-shrink:0;width:1rem}.curriculum-list::-webkit-scrollbar{height:4px}.curriculum-item{flex:0 0 auto;width:140px;min-height:60px;scroll-snap-align:start;flex-direction:row;justify-content:space-between;align-items:center;padding:.6rem .7rem}.curriculum-name{text-align:left;font-size:.9rem;flex:1;min-width:0}.curriculum-item .btn-add{flex-shrink:0;width:22px;height:22px;min-width:22px;min-height:22px;max-width:22px;max-height:22px;padding:0;line-height:1}.curriculum-item:hover{transform:translateY(-2px)}.existing-classes-panel{height:auto;min-height:400px}.classes-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.classes-page{height:auto}.classes-layout{display:flex;flex-direction:column;height:auto;overflow:visible}.create-class-panel{padding:.75rem 0}.curriculum-list{padding:0 .75rem .5rem 0}.curriculum-list:before{content:"";flex-shrink:0;width:1rem}.curriculum-item{width:130px}.existing-classes-panel{min-height:300px}.classes-grid{grid-template-columns:1fr}}.form-section{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:2px solid #e2e8f0}.form-section:last-of-type{border-bottom:none}.form-section h4{color:#1a1a2e;margin-bottom:.5rem;font-size:1.1rem}.form-section .hint{color:#64748b;font-size:.875rem;margin-bottom:1rem}.add-student-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;align-items:end;padding:1.25rem;background:#f8fafc;border-radius:12px;border:2px dashed #e2e8f0}.add-student-row input,.add-student-row select{padding:.7rem .85rem;border:2px solid #e2e8f0;border-radius:8px;font-size:.9rem;width:100%;min-width:0}.add-student-row input:focus,.add-student-row select:focus{outline:none;border-color:#4b5563}.add-student-row .btn-success{white-space:nowrap;padding:.75rem 1.25rem;width:100%}.students-list{margin-top:1rem;max-height:400px;overflow-y:auto}.badge{display:inline-block;padding:.25rem .6rem;border-radius:12px;font-size:.7rem;font-weight:600;text-transform:uppercase}.badge.new{background:#d1fae5;color:#065f46}.badge.existing{background:#f3f4f6;color:#3730a3}.badge.extra{background:#fef3c7;color:#92400e}.badge.not-approved,.badge.remove{background:#fee2e2;color:#991b1b}.data-table tr.to-remove{opacity:.5;background:#fee2e2}.data-table tr.disapproved-student{background:#fef2f2}.data-table tr.disapproved-student td{color:#dc2626}.form-actions{display:flex;justify-content:flex-end;gap:1rem;margin-top:2rem;padding-top:1.5rem;border-top:2px solid #e2e8f0}.classes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.class-card{background:#fff;border-radius:12px;padding:1rem;box-shadow:0 4px 6px -1px #0000001a;transition:all .2s;border:2px solid transparent}.class-card:hover{transform:translateY(-2px);box-shadow:0 10px 25px -5px #0000001a;border-color:#4b5563}.class-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:2px solid #f1f5f9}.class-header h3{margin:0;color:#1a1a2e;font-size:1.1rem}.grade-badge{background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;padding:.35rem .85rem;border-radius:20px;font-size:.8rem;font-weight:600}.class-details{margin-bottom:.75rem}.class-details p{margin:.4rem 0;color:#64748b;font-size:.85rem}.class-details strong{color:#1a1a2e}.class-actions{display:flex;gap:.5rem;flex-wrap:wrap}.form-hint{color:#64748b;font-size:.875rem;margin-top:.5rem;font-style:italic}@media(max-width:900px){.add-student-row{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.add-student-row{grid-template-columns:1fr}.classes-page{padding:12px}.page-header{flex-direction:column;align-items:stretch;gap:12px}.page-header button{width:100%}.class-form{padding:16px}.form-row{grid-template-columns:1fr}.form-actions{flex-direction:column}.form-actions button{width:100%}}@media(max-width:480px){.classes-grid{grid-template-columns:1fr}.class-card{padding:16px}.class-header h3{font-size:16px}.class-actions{flex-direction:column;width:100%}.class-actions button{width:100%}.students-table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -16px;padding:0 16px}.students-table{min-width:500px}.students-table th,.students-table td{font-size:12px;padding:8px 6px}}.modal-large{max-width:95vw!important;width:1600px!important;max-height:95vh!important;overflow-y:auto;padding:2rem}.modal-large .form-section{margin-bottom:1.5rem}.modal-large .form-section h4{font-size:1.15rem;margin-bottom:1rem}.modal-large .form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.modal-large .form-group{display:flex;flex-direction:column;gap:.5rem}.modal-large .form-group label{font-weight:600;font-size:.9rem;color:#1a1a2e}.modal-large .add-student-row{grid-template-columns:1.5fr 1.5fr 1.2fr .8fr 1.2fr 1.2fr auto;gap:.5rem;padding:1rem}.modal-large .students-list{max-height:400px;overflow-y:auto;margin-top:1rem}.modal-large .data-table{font-size:.9rem;width:100%}.modal-large .data-table th,.modal-large .data-table td{padding:.75rem .5rem}@media(max-width:1600px){.modal-large{max-width:95vw!important;width:95vw!important}}@media(max-width:1200px){.modal-large .add-student-row{grid-template-columns:repeat(3,1fr)}.modal-large .add-student-row button{grid-column:span 3}}@media(max-width:900px){.modal-large{max-width:100vw!important;max-height:100vh!important;border-radius:0;padding:1.5rem}.modal-large .add-student-row{grid-template-columns:repeat(2,1fr)}.modal-large .add-student-row button{grid-column:span 2}}@media(max-width:600px){.modal-large .add-student-row{grid-template-columns:1fr}.modal-large .add-student-row button{grid-column:span 1}}.manage-class-students{padding:1.5rem;max-width:1600px;margin:0 auto;background:#f8fafc;min-height:100vh}.page-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.mcs-header-left{display:flex;flex-direction:column;gap:1rem}.btn-back{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;background:#fff;border:2px solid #e5e7eb;border-radius:8px;color:#475569;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .2s ease;width:fit-content}.btn-back:hover{background:#f8fafc;border-color:#4b5563;color:#4b5563;transform:translate(-2px)}.back-icon{font-size:1.125rem}.header-info h2{margin:0 0 .75rem;font-size:2rem;font-weight:700;color:#1e293b;letter-spacing:-.025em}.class-info-badges{display:flex;gap:.75rem;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;padding:.5rem 1rem;border-radius:8px;font-size:.875rem;font-weight:600;white-space:nowrap}.badge-primary{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.badge-secondary{background:#f1f5f9;color:#475569;border:2px solid #e5e7eb}.badge-count{background:#d1fae5;color:#059669;border:2px solid #a7f3d0}.header-actions{display:flex;gap:1rem;align-items:center}.btn-primary,.btn-secondary,.btn-outline{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:10px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none;white-space:nowrap}.btn-primary{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;box-shadow:0 4px 12px #667eea4d}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.btn-secondary{background:#fff;color:#475569;border:2px solid #e5e7eb}.btn-secondary:hover:not(:disabled){background:#f8fafc;border-color:#cbd5e1}.btn-outline{background:#fff;color:#4b5563;border:2px solid #4b5563;padding:.625rem 1.125rem;font-size:.875rem}.btn-outline:hover:not(:disabled){background:#f0f4ff;border-color:#1f2937;color:#1f2937}.btn-icon{font-size:1.125rem}.btn-primary:disabled,.btn-secondary:disabled,.btn-outline:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.manage-class-students .modal-overlay{position:fixed!important;inset:0!important;background:#0f172a99!important;-webkit-backdrop-filter:blur(4px)!important;backdrop-filter:blur(4px)!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:1000!important;padding:0!important;animation:fadeIn .2s ease!important}.manage-class-students .modal-content{background:#fff!important;border-radius:24px!important;width:100%!important;max-width:550px!important;max-height:85vh!important;display:flex!important;flex-direction:column!important;box-shadow:0 20px 60px #0000004d!important;animation:slideUp .3s ease!important;overflow:hidden!important}.manage-class-students .modal-large{max-width:650px!important;padding:0!important}.manage-class-students .modal-large .modal-body{padding:1rem!important}.manage-class-students .modal-instructions{max-width:750px!important;max-height:90vh!important}.instructions-content{padding:.5rem 0}.instructions-content h4{margin:0 0 1.25rem;font-size:1.125rem;font-weight:700;color:#1e293b;text-align:center;padding-bottom:.75rem;border-bottom:2px solid #e5e7eb}.instruction-step{display:flex;gap:.875rem;margin-bottom:1.25rem;align-items:flex-start;padding:.75rem;background:#f8fafc;border-radius:8px;border-left:3px solid #4b5563}.step-number{flex-shrink:0;width:28px;height:28px;background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8125rem;box-shadow:0 2px 4px #667eea4d}.step-content{flex:1;min-width:0}.step-content h5{margin:0 0 .375rem;font-size:.9375rem;font-weight:700;color:#1e293b}.step-content p{margin:0 0 .375rem;color:#475569;font-size:.8125rem;line-height:1.5}.step-content ul{margin:.375rem 0 0;padding-left:1.125rem;color:#475569;font-size:.8125rem;line-height:1.6}.step-content ul li{margin-bottom:.25rem}.step-content ul li strong{color:#1e293b;font-weight:600}.code-block{display:block;margin-top:.375rem;padding:.625rem .75rem;background:#fff;border-radius:6px;font-family:Courier New,monospace;font-size:.75rem;color:#4b5563;border:2px solid #e5e7eb;overflow-x:auto;word-break:break-all}.instruction-note{margin:1.25rem 0;padding:.875rem 1rem;border-radius:8px;border-left:4px solid}.instruction-note.warning{background:#fef3c7;border-color:#f59e0b;color:#92400e}.instruction-note strong{display:block;margin-bottom:.5rem;font-weight:700;color:#78350f;font-size:.875rem}.instruction-note ul{margin:.375rem 0 0;padding-left:1.125rem;font-size:.8125rem;line-height:1.6}.instruction-note ul li{margin-bottom:.25rem}.instruction-example{margin-top:1.25rem;padding:.875rem;background:#f8fafc;border-radius:8px;border:2px solid #e5e7eb}.instruction-example h5{margin:0 0 .625rem;font-size:.875rem;font-weight:700;color:#1e293b}.example-table{width:100%;border-collapse:collapse;font-size:.75rem;background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 1px 3px #0000001a}.example-table thead{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.example-table th,.example-table td{padding:.5rem .625rem;text-align:left;border:1px solid #e5e7eb}.example-table th{font-weight:600;font-size:.6875rem;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.example-table tbody tr:hover{background:#f8fafc}.example-table td{color:#475569;font-family:Courier New,monospace}@media(max-width:768px){.manage-class-students .modal-instructions{max-width:100%!important;max-height:95vh!important}.instructions-content h4{font-size:1rem;margin-bottom:1rem}.instruction-step{gap:.625rem;padding:.625rem;margin-bottom:1rem}.step-number{width:24px;height:24px;font-size:.75rem}.step-content h5{font-size:.875rem}.step-content p,.step-content ul{font-size:.75rem}.code-block{font-size:.6875rem;padding:.5rem}.instruction-note{padding:.75rem;margin:1rem 0}.instruction-note strong{font-size:.8125rem}.instruction-note ul{font-size:.75rem}.instruction-example{padding:.75rem;overflow-x:auto}.example-table{font-size:.6875rem;min-width:600px}.example-table th,.example-table td{padding:.375rem .5rem}.example-table th{font-size:.625rem}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.manage-class-students .modal-header{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:20px 24px!important;border-bottom:1px solid #e5e7eb!important;background:linear-gradient(135deg,#4b5563,#2f3237)!important;border-radius:24px 24px 0 0!important}.manage-class-students .modal-header h3{margin:0!important;font-size:1.25rem!important;font-weight:700!important;color:#fff!important;letter-spacing:-.025em!important}.manage-class-students .btn-close{background:#fff3!important;border:none!important;font-size:1.5rem!important;color:#fff!important;cursor:pointer!important;padding:0!important;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:6px!important;transition:all .3s ease!important;line-height:1!important;font-weight:300!important;flex-shrink:0!important;pointer-events:auto!important;z-index:10!important;position:relative!important}.manage-class-students .btn-close:hover{background:#ffffff4d!important;transform:rotate(90deg)!important}.manage-class-students .modal-body{padding:1rem!important;overflow-y:auto!important;flex:1!important;background:#fafbfc!important}.manage-class-students .modal-footer{display:flex!important;gap:.75rem!important;justify-content:flex-end!important;padding:.875rem 1rem!important;border-top:1px solid #e5e7eb!important;background:#fff!important;border-radius:0 0 24px 24px!important}.manage-class-students .modal-footer .btn-primary,.manage-class-students .modal-footer .btn-secondary{padding:.5rem 1rem!important;font-size:.8125rem!important}.manage-class-students .form-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:.875rem!important}.manage-class-students .form-group{display:flex!important;flex-direction:column!important;gap:.375rem!important}.manage-class-students .form-group label{font-weight:600!important;color:#1e293b!important;font-size:.75rem!important;text-transform:uppercase!important;letter-spacing:.025em!important}.manage-class-students .required{color:#ef4444!important;margin-left:.25rem!important;font-size:.75rem!important}.manage-class-students .form-group input,.manage-class-students .form-group select{padding:.5rem .75rem!important;border:2px solid #e5e7eb!important;border-radius:8px!important;font-size:.8125rem!important;transition:all .2s ease!important;background:#fff!important;font-family:inherit!important}.manage-class-students .form-group input::placeholder{color:#94a3b8!important;font-style:italic!important}.manage-class-students .form-group select{cursor:pointer!important;appearance:none!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23475569' d='M6 9L1 4h10z'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right .75rem center!important;padding-right:2rem!important}.manage-class-students .form-group input:focus,.manage-class-students .form-group select:focus{outline:none!important;border-color:#4b5563!important;box-shadow:0 0 0 3px #667eea1a!important;background:#fff!important}.manage-class-students .mcs-phone-input-container{width:100%!important;display:flex!important;gap:.5rem!important}.manage-class-students .mcs-phone-select{width:80px!important;padding:.5rem .25rem!important;border:2px solid #e5e7eb!important;border-radius:8px!important;font-size:.8125rem!important;background:#fff!important;min-width:70px!important;max-width:80px!important;flex-shrink:0!important}.manage-class-students .mcs-phone-select:focus{outline:none!important;border-color:#4b5563!important;box-shadow:0 0 0 3px #667eea1a!important}.manage-class-students .mcs-phone-number-input{width:100%!important;padding:.5rem .75rem!important;border:2px solid #e5e7eb!important;border-radius:8px!important;font-size:.8125rem!important;transition:all .2s ease!important;background:#fff!important;flex:1!important;min-width:0!important}.manage-class-students .mcs-phone-number-input:focus{outline:none!important;border-color:#4b5563!important;box-shadow:0 0 0 3px #667eea1a!important}.manage-class-students .mcs-datepicker-input{width:100%!important;padding:.5rem .75rem!important;border:2px solid #e5e7eb!important;border-radius:8px!important;font-size:.8125rem!important;transition:all .2s ease!important;background:#fff!important}.manage-class-students .mcs-datepicker-input:focus{outline:none!important;border-color:#4b5563!important;box-shadow:0 0 0 3px #667eea1a!important}.manage-class-students .upload-instructions{margin:0 0 .75rem!important;color:#475569!important;line-height:1.5!important;font-size:.8125rem!important}.manage-class-students .upload-instructions code{display:block!important;margin-top:.5rem!important;padding:.5rem .75rem!important;background:#f1f5f9!important;border-radius:6px!important;font-family:Courier New,monospace!important;font-size:.75rem!important;color:#4b5563!important;border:2px solid #e5e7eb!important}.manage-class-students .upload-note{margin:0 0 1rem!important;padding:.75rem 1rem!important;background:#fef3c7!important;border-left:4px solid #f59e0b!important;border-radius:6px!important;color:#92400e!important;font-size:.75rem!important;line-height:1.5!important}.manage-class-students .upload-note strong{font-weight:700!important;color:#78350f!important}.upload-actions{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.upload-actions .btn-link{flex-shrink:0;white-space:nowrap}.btn-link{background:#fff;border:2px solid #4b5563;color:#4b5563;font-size:.875rem;font-weight:600;cursor:pointer;text-decoration:none;padding:.625rem 1.25rem;border-radius:8px;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center}.btn-link:hover{color:#fff;background:#4b5563;border-color:#4b5563}.file-input-wrapper{display:flex;align-items:center;gap:.75rem;flex:1}.file-input-wrapper input[type=file]{display:none}.file-input-wrapper label{cursor:pointer;margin:0}.file-name{font-size:.875rem;color:#475569;font-weight:500;padding:.5rem 1rem;background:#f1f5f9;border-radius:6px}.preview-section{background:#fff;border-radius:12px;padding:1rem;margin-bottom:1.25rem;box-shadow:0 2px 8px #0000000f;border:1px solid #e5e7eb;overflow:visible}.preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:.75rem}.preview-header h3{margin:0;font-size:1.125rem;font-weight:700;color:#1e293b}.preview-stats{display:flex;gap:.75rem;font-size:.8125rem;font-weight:600}.stat-valid{color:#059669;padding:.5rem 1rem;background:#d1fae5;border-radius:6px;border:1px solid #a7f3d0}.stat-invalid{color:#dc2626;padding:.5rem 1rem;background:#fee2e2;border-radius:6px;border:1px solid #fecaca}.preview-table-wrapper{overflow-x:auto;overflow-y:visible;margin-bottom:1rem;border-radius:8px;border:1px solid #e5e7eb}.preview-table{width:100%;border-collapse:collapse;font-size:.8125rem;overflow:visible}.preview-table thead{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.preview-table th{padding:.625rem .5rem;text-align:left;font-weight:600;font-size:.75rem;white-space:nowrap;text-transform:uppercase;letter-spacing:.05em}.preview-table td{padding:.625rem .5rem;border-bottom:1px solid #f1f5f9}.preview-table .valid-row{background:#f0fdf4}.preview-table .invalid-row{background:#fef2f2}.preview-table .valid-row:hover,.preview-table .invalid-row:hover{opacity:.95}.error-cell{background:#fee2e2!important;border:2px solid #fecaca!important;position:relative}.empty-value{color:#dc2626;font-style:italic;font-size:.8125rem;font-weight:500}.status-badge{display:inline-block;padding:.25rem .625rem;border-radius:4px;font-size:.6875rem;font-weight:700;white-space:nowrap;text-transform:uppercase;letter-spacing:.05em}.status-badge.valid{background:#d1fae5;color:#059669;border:1px solid #a7f3d0}.status-badge.invalid{background:#fee2e2;color:#dc2626;border:1px solid #fecaca;cursor:help}.status-badge.pending{background:#fef3c7;color:#d97706;border:1px solid #fde68a}.status-badge.rejected{background:#fee2e2;color:#dc2626;border:1px solid #fecaca}.status-badge.approved{background:#d1fae5;color:#059669;border:1px solid #a7f3d0}.error-tooltip{position:relative;display:inline-block;z-index:10001}.tooltip-content{display:none;position:fixed;background:#1e293b;color:#fff;padding:.5rem .75rem;border-radius:6px;font-size:.7rem;z-index:99999;box-shadow:0 4px 12px #0000004d;pointer-events:none;max-width:220px;white-space:normal;line-height:1.4;word-wrap:break-word;min-width:180px}.tooltip-content:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:#1e293b}.error-tooltip:hover .tooltip-content{display:block}.preview-table{position:relative;z-index:1}.preview-table thead{position:relative;z-index:2}.preview-table tbody{position:relative;z-index:3}.preview-table tr{position:relative}.preview-table td{position:relative;overflow:visible}.preview-table td:has(.error-tooltip:hover){z-index:10003}.edit-input{width:100%;padding:.375rem .5rem;border:2px solid #4b5563;border-radius:4px;font-size:.75rem}.edit-input:focus{outline:none;border-color:#1f2937;box-shadow:0 0 0 3px #667eea1a}.preview-table td .custom-datepicker-input{width:100%;padding:.375rem .5rem;border:2px solid #4b5563;border-radius:4px;font-size:.75rem}.preview-table td .phone-input-container{display:flex;width:100%;min-width:180px}.preview-table td .phone-input-container input{padding:.375rem .5rem!important;border:2px solid #4b5563!important;border-radius:4px!important;font-size:.75rem!important;width:100%!important;min-width:120px!important;flex:1!important}.preview-table td .phone-input-container select{padding:.375rem!important;border:2px solid #4b5563!important;border-radius:4px!important;font-size:.75rem!important;margin-right:.375rem!important;min-width:50px!important}.preview-table td .mcs-phone-input-container{gap:.25rem!important}.preview-table td .mcs-phone-select{width:60px!important;min-width:60px!important;max-width:60px!important;padding:.375rem .25rem!important;font-size:.7rem!important;border-radius:4px!important}.preview-table td .mcs-phone-number-input{padding:.375rem .5rem!important;font-size:.75rem!important;border-radius:4px!important}.preview-table td .mcs-phone-number-input+span{font-size:.65rem!important;margin-bottom:-1px!important}.edit-actions{display:flex;gap:.375rem}.btn-sm{padding:.375rem .75rem;font-size:.75rem;border-radius:4px;border:none;cursor:pointer;font-weight:600;transition:all .2s ease;white-space:nowrap}.btn-sm.btn-primary{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.btn-sm.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.btn-sm.btn-secondary{background:#f1f5f9;color:#475569;border:2px solid #e5e7eb}.btn-sm.btn-secondary:hover{background:#e2e8f0}.preview-actions{display:flex;gap:.75rem;justify-content:flex-end;padding-top:1rem;border-top:1px solid #e5e7eb}.students-section{background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 4px 20px #00000014;border:2px solid #f1f5f9}.students-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;flex-wrap:wrap;gap:1rem}.students-section h3{margin:0;font-size:1.375rem;font-weight:700;color:#1e293b}.btn-export{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;background:#fff;border:2px solid #10b981;border-radius:8px;color:#10b981;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.btn-export:hover{background:#10b981;color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.students-table-wrapper{overflow-x:auto;border-radius:12px;border:2px solid #f1f5f9}.students-table{width:100%;border-collapse:collapse}.students-table thead{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.students-table th{padding:.875rem;text-align:left;font-weight:600;font-size:.875rem;white-space:nowrap;text-transform:uppercase;letter-spacing:.05em}.students-table td{padding:.875rem;border-bottom:1px solid #f1f5f9;font-size:.9375rem;color:#475569}.students-table tbody tr{transition:all .2s ease}.students-table tbody tr:hover{background:#f8fafc}.btn-danger{background:#fee2e2;color:#dc2626;border:2px solid #fecaca;padding:.5rem 1rem;border-radius:6px;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-danger:hover{background:#fecaca;border-color:#fca5a5}.btn-approve{background:#d1fae5;color:#059669;border:2px solid #a7f3d0;padding:.5rem 1rem;border-radius:6px;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-approve:hover{background:#a7f3d0;border-color:#6ee7b7}.btn-reject{background:#fef3c7;color:#d97706;border:2px solid #fde68a;padding:.5rem 1rem;border-radius:6px;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-reject:hover{background:#fde68a;border-color:#fcd34d}.action-buttons{display:flex;gap:.5rem;flex-wrap:wrap}.empty-state{text-align:center;padding:4rem 2rem;color:#94a3b8}.empty-state p{margin:0;font-size:1.125rem;font-weight:500}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;gap:1rem}.loading-spinner{width:48px;height:48px;border:4px solid #f1f5f9;border-top-color:#4b5563;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-container p{color:#64748b;font-size:1rem;font-weight:500}@media(max-width:768px){.manage-class-students{padding:.75rem}.page-header{flex-direction:column;align-items:flex-start;gap:.75rem}.mcs-header-left{width:100%}.btn-back{padding:.5rem 1rem;font-size:.875rem}.header-info h2{font-size:1.375rem;margin-bottom:.5rem}.class-info-badges{flex-direction:row;flex-wrap:wrap;gap:.5rem}.badge{padding:.375rem .75rem;font-size:.75rem}.header-actions{width:100%;flex-direction:row;gap:.5rem}.header-actions button{flex:1;justify-content:center;padding:.625rem 1rem;font-size:.875rem}.manage-class-students .modal-overlay{padding:.5rem!important}.manage-class-students .modal-content{width:100%!important;max-width:100%!important;max-height:95vh!important;border-radius:16px!important}.manage-class-students .modal-header{padding:1rem!important;border-radius:16px 16px 0 0!important}.manage-class-students .modal-header h3{font-size:1.125rem!important}.manage-class-students .modal-body{padding:.875rem!important}.manage-class-students .modal-footer{padding:.875rem!important;flex-direction:column-reverse;border-radius:0 0 16px 16px!important}.manage-class-students .modal-footer .btn-primary,.manage-class-students .modal-footer .btn-secondary{width:100%!important;justify-content:center}.manage-class-students .form-grid{grid-template-columns:1fr!important;gap:.75rem!important}.manage-class-students .form-group label{font-size:.7rem!important}.manage-class-students .form-group input,.manage-class-students .form-group select{padding:.625rem .75rem!important;font-size:.875rem!important}.manage-class-students .upload-instructions{font-size:.75rem!important}.manage-class-students .upload-instructions code{font-size:.7rem!important;padding:.5rem!important;overflow-x:auto}.upload-actions{flex-direction:column;gap:.75rem;width:100%}.upload-actions .btn-link{width:100%;order:2}.file-input-wrapper{flex-direction:column;width:100%;order:1}.file-input-wrapper label,.file-name{width:100%;text-align:center}.preview-section{padding:.875rem;margin-bottom:1rem}.preview-header{flex-direction:column;align-items:flex-start;gap:.5rem}.preview-header h3{font-size:1rem}.preview-stats{flex-wrap:wrap;gap:.5rem;font-size:.75rem}.stat-valid,.stat-invalid{padding:.375rem .75rem}.preview-table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -.875rem;padding:0 .875rem}.preview-table{font-size:.75rem;min-width:800px}.preview-table th,.preview-table td{padding:.5rem .375rem;font-size:.7rem}.preview-table th{font-size:.65rem}.edit-input{font-size:.7rem;padding:.25rem .375rem}.btn-sm{padding:.25rem .5rem;font-size:.7rem}.status-badge{font-size:.625rem;padding:.1875rem .5rem}.preview-actions{flex-direction:column-reverse;gap:.5rem}.preview-actions button{width:100%;justify-content:center}.students-section{padding:1rem}.students-section-header{flex-direction:column;align-items:flex-start;gap:.75rem}.students-section h3{font-size:1.125rem}.btn-export{width:100%;justify-content:center}.students-table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -1rem;padding:0 1rem}.students-table{min-width:600px;font-size:.8125rem}.students-table th,.students-table td{padding:.625rem .5rem;font-size:.8125rem}.students-table th{font-size:.75rem}.btn-danger,.btn-approve,.btn-reject{padding:.375rem .75rem;font-size:.75rem}.action-buttons{flex-direction:column;gap:.375rem}.action-buttons button{width:100%}.manage-class-students .mcs-phone-select{width:70px!important;min-width:65px!important;max-width:70px!important;font-size:.75rem!important}.manage-class-students .mcs-phone-number-input{font-size:.875rem!important}.preview-table td .mcs-phone-select{width:55px!important;min-width:55px!important;max-width:55px!important;font-size:.65rem!important;padding:.25rem .125rem!important}.preview-table td .mcs-phone-number-input{font-size:.7rem!important;padding:.25rem .375rem!important}.loading-container{padding:3rem 1rem}.loading-spinner{width:40px;height:40px}.loading-container p{font-size:.875rem}.empty-state{padding:3rem 1rem}.empty-state p{font-size:1rem}}@media(max-width:480px){.manage-class-students{padding:.5rem}.header-info h2{font-size:1.25rem}.class-info-badges{gap:.375rem}.badge{padding:.3125rem .625rem;font-size:.6875rem}.header-actions{flex-direction:column}.header-actions button{width:100%}.manage-class-students .modal-content{border-radius:12px!important}.manage-class-students .modal-header{border-radius:12px 12px 0 0!important}.manage-class-students .modal-footer{border-radius:0 0 12px 12px!important}.preview-table,.students-table{min-width:700px}.btn-back{width:100%;justify-content:center}}.curriculum-page{padding:1rem;max-width:1400px;margin:0 auto;background:linear-gradient(135deg,#f8fafc,#f3f4f6);min-height:100vh}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;flex-wrap:wrap;gap:1rem;background:#fff;padding:1rem 1.5rem;border-radius:12px;box-shadow:0 2px 12px #0000000f}.page-header h2{margin:0;color:#1a1a2e;font-size:1.5rem;display:flex;align-items:center;gap:.5rem}.subtitle{color:#64748b;font-size:.9rem;margin:.25rem 0 0}.form-card{background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:1.5rem}.form-card h3{margin:0 0 1rem;color:#1a1a2e}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.form-card input,.form-card textarea,.inline-form input,.inline-form textarea,.project-form input,.project-form textarea{width:100%;padding:.75rem;border:1px solid #e2e8f0;border-radius:8px;font-size:.95rem}.form-card textarea,.inline-form textarea,.project-form textarea{resize:vertical;font-family:inherit}.form-actions{display:flex;gap:.75rem;margin-top:1rem}.curriculum-layout{display:grid;grid-template-columns:300px 1fr;gap:1.25rem}.curriculum-list{background:#fff;border-radius:12px;padding:1rem;box-shadow:0 2px 12px #0000000f;max-height:calc(100vh - 200px);overflow-y:auto}@media(min-width:769px){.curriculum-list{height:auto!important;overflow-y:auto!important;max-height:calc(100vh - 200px)!important}}.curriculum-list h3{margin:0 0 1rem;font-size:1.1rem;color:#1a1a2e;display:flex;align-items:center;gap:.5rem;padding-bottom:.75rem;border-bottom:2px solid #f1f5f9}.empty-text{text-align:center;color:#94a3b8;padding:2rem 1rem;font-style:italic}.curriculum-item{padding:.85rem;border-radius:10px;margin-bottom:.5rem;transition:all .2s;border:2px solid #f1f5f9;cursor:pointer;background:#fafafa;display:flex;align-items:center;justify-content:space-between;gap:.75rem;overflow:hidden;min-height:80px;flex-shrink:0}.curriculum-item:hover{background:#f8fafc;border-color:#e2e8f0;transform:translate(4px);box-shadow:0 2px 8px #0000000d}.curriculum-item.active{background:linear-gradient(135deg,#eff6ff,#e5e7eb);border-color:#3b82f6;box-shadow:0 4px 12px #3b82f633}.curriculum-info{display:flex;flex-direction:column;gap:.5rem;flex:1;min-width:0;overflow:hidden}.curriculum-name{font-weight:600;color:#1a1a2e;font-size:1rem;line-height:1.3;word-wrap:break-word;overflow-wrap:break-word}.curriculum-fees{color:#059669;font-weight:700;font-size:1rem}.curriculum-actions{display:flex;gap:.5rem;margin-top:.5rem;flex-shrink:0}.curriculum-meta{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;overflow:hidden}.fees-badge{background:#d1fae5;color:#059669;padding:.25rem .6rem;border-radius:6px;font-size:.85rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.grade-badge{background:#e5e7eb;color:#1e40af;padding:.25rem .6rem;border-radius:6px;font-size:.8rem;font-weight:600;white-space:nowrap}.subject-count{color:#64748b;font-size:.85rem;font-weight:500;white-space:nowrap}.curriculum-details{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 2px 12px #0000000f;max-height:calc(100vh - 200px);overflow-y:auto}.no-selection{display:flex;align-items:center;justify-content:center;height:400px;color:#94a3b8;font-size:1.1rem;flex-direction:column;gap:1rem}.loading{display:flex;align-items:center;justify-content:center;height:400px;color:#64748b}.details-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #f1f5f9;gap:1rem}.header-content{flex:1}.details-header h3{margin:0 0 .5rem;color:#1a1a2e;font-size:1.35rem;display:flex;align-items:center;gap:.5rem}.details-header p{color:#64748b;font-size:.9rem;margin:.5rem 0;line-height:1.5}.curriculum-fees-display{display:flex;align-items:center;gap:.75rem;margin-top:.75rem;padding:.75rem 1rem;background:linear-gradient(135deg,#ecfdf5,#d1fae5);border-radius:8px;border:2px solid #86efac}.fees-label{color:#065f46;font-weight:600;font-size:.9rem}.fees-amount{color:#059669;font-weight:700;font-size:1.25rem}.grade-label{color:#64748b;font-size:.9rem;margin:.25rem 0}.description{color:#64748b;font-size:.9rem;margin:.5rem 0 0}.details-actions{display:flex;gap:.75rem;flex-shrink:0;flex-wrap:wrap}.header-actions{display:flex;gap:.75rem;flex-shrink:0}.header-actions-vertical{display:flex;flex-direction:column;gap:.75rem;flex-shrink:0;min-width:180px}.header-actions-vertical button{width:100%;justify-content:center}.inline-form{background:#f8fafc;padding:1.25rem;border-radius:8px;margin-bottom:1.5rem;border:2px dashed #cbd5e1}.inline-form h4{margin:0 0 1rem;color:#1a1a2e;font-size:1rem}.subjects-list{display:flex;flex-direction:column;gap:1rem}.subject-card{border:2px solid #e2e8f0;border-radius:10px;overflow:hidden;transition:all .2s;background:#fff;box-shadow:0 2px 8px #0000000d}.subject-card:hover{box-shadow:0 4px 12px #00000014;border-color:#cbd5e1}.subject-card[draggable=true]{cursor:move;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:none}.subject-card[draggable=true]:hover{box-shadow:0 4px 12px #00000026}.subject-card.drag-over{border-top:3px solid #3b82f6;background:#eff6ff}.subject-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:linear-gradient(135deg,#f8fafc,#f1f5f9);cursor:pointer;transition:background .2s;gap:1rem}.subject-header:hover{background:linear-gradient(135deg,#f1f5f9,#e2e8f0)}.drag-handle{font-size:1.2rem;color:#94a3b8;cursor:move;margin-right:.5rem;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:none}.subject-info h4{margin:0;color:#1a1a2e;font-size:1.05rem;display:flex;align-items:center;gap:.75rem}.subject-desc{margin:.5rem 0 0;padding:0 1.25rem;color:#64748b;font-size:.9rem;line-height:1.5}.expand-icon{font-size:.7rem;color:#94a3b8;transition:transform .2s}.school-subject-desc{margin:.5rem 0 0 1.5rem;color:#64748b;font-size:.9rem;line-height:1.5}.subject-actions{display:flex;gap:.5rem;flex-shrink:0}.topics-list{padding:1rem 1.25rem;background:#fff;display:grid;gap:.5rem}.empty-topics{text-align:center;color:#94a3b8;padding:1.5rem;font-style:italic;font-size:.9rem}.curriculum-topic-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:linear-gradient(135deg,#fafafa,#f5f5f5);border-radius:8px;border:1px solid #e2e8f0;transition:all .2s;gap:1rem;flex-wrap:nowrap}.curriculum-topic-item:hover{background:linear-gradient(135deg,#f5f5f5,#efefef);border-color:#cbd5e1;transform:translate(4px)}.curriculum-topic-item span{flex:1;color:#1a1a2e;font-weight:500;font-size:.95rem;min-width:0;word-break:break-word}.curriculum-topic-item button{flex-shrink:0;white-space:nowrap}.project-form{padding:1.25rem;background:#fffbeb;border-top:2px solid #fef3c7}.project-form h5{margin:0 0 1rem;color:#92400e;font-size:.95rem}.projects-list{padding:1rem;background:#fff}.no-projects{text-align:center;color:#94a3b8;padding:2rem;font-style:italic}.project-item{display:flex;gap:1rem;padding:.75rem;border-radius:6px;margin-bottom:.5rem;background:#f8fafc;transition:all .2s}.project-item[draggable=true]{cursor:move;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:none}.project-item[draggable=true]:hover{background:#f1f5f9;box-shadow:0 2px 8px #0000001a}.project-item.drag-over{border-top:2px solid #3b82f6;background:#eff6ff}.project-number{width:32px;height:32px;border-radius:4px!important;background:#e5e7eb!important;color:#111827!important;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem;flex-shrink:0}.project-content{flex:1;min-width:0}.project-desc{color:#64748b;font-size:.85rem;line-height:1.4}.btn-primary,.btn-secondary,.btn-small,.btn-sm{padding:.6rem 1.1rem;border:none;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.5rem}.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);background-size:100% 100%;color:#fff;box-shadow:0 2px 8px #3b82f64d}.btn-primary:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);background-size:100% 100%;box-shadow:0 4px 12px #3b82f666;transform:translateY(-1px)}.btn-secondary:hover{background:#e2e8f0;border-color:#cbd5e1}.btn-secondary.active{background:#e5e7eb;color:#1e40af;border-color:#3b82f6}.btn-sm{padding:.5rem .9rem;font-size:.85rem}.btn-small{padding:.4rem .75rem;font-size:.85rem;background:#f1f5f9;color:#475569}.btn-small:hover{background:#e2e8f0}.btn-small.active{background:#dcfce7;color:#166534}.btn-danger{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5;font-weight:700;font-size:1rem;padding:.5rem 1rem;border-radius:8px;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;justify-content:center}.btn-danger:hover{background:#fecaca;border-color:#f87171;transform:scale(1.02)}.delete-btn{background:#fee2e2;border:1px solid #fca5a5;color:#dc2626;font-size:1.1rem;font-weight:700;cursor:pointer;padding:.35rem .6rem;border-radius:4px;transition:all .2s;line-height:1}.delete-btn:hover{background:#fecaca;border-color:#f87171;transform:scale(1.05)}.delete-btn-small{background:#fee2e2;border:1px solid #fca5a5;color:#dc2626;border-radius:4px;font-size:1rem;font-weight:700;cursor:pointer;padding:.35rem .6rem;transition:all .2s;flex-shrink:0;line-height:1}.delete-btn-small:hover{background:#fecaca;border-color:#f87171;transform:scale(1.05)}@media(max-width:768px){.curriculum-page{padding:1rem}.page-header{flex-direction:column;align-items:stretch}.page-header h2{font-size:1.25rem}.curriculum-layout{grid-template-columns:1fr;gap:1rem}.curriculum-list{max-height:300px}.center-curriculum-page .curriculum-item{padding:.75rem;gap:.6rem;flex-wrap:wrap;align-items:flex-start}.center-curriculum-page .curriculum-info{flex:1;min-width:0;max-width:calc(100% - 120px)}.center-curriculum-page .curriculum-name{font-size:.9rem;word-break:break-word;line-height:1.4;margin-bottom:.4rem}.center-curriculum-page .curriculum-meta{width:100%;gap:.5rem;margin-top:0;display:flex;align-items:center}.center-curriculum-page .fees-badge{font-size:.8rem;padding:.3rem .6rem;max-width:none}.center-curriculum-page .grade-badge{font-size:.75rem;padding:.25rem .5rem}.center-curriculum-page .curriculum-actions{display:flex;gap:.4rem;flex-shrink:0;margin-top:0}.center-curriculum-page .curriculum-item .btn-sm,.center-curriculum-page .curriculum-item .curriculum-actions .btn-sm{padding:.3rem .5rem;font-size:.7rem;min-width:50px;width:50px;display:flex;align-items:center;justify-content:center}.center-curriculum-page .curriculum-item .delete-btn,.center-curriculum-page .curriculum-item .curriculum-actions .delete-btn{padding:.3rem .5rem;font-size:.9rem;min-width:50px;width:50px;display:flex;align-items:center;justify-content:center}.school-curriculum-page .curriculum-list .curriculum-item{flex-direction:row;align-items:center;gap:.5rem;padding:.75rem}.school-curriculum-page .curriculum-list .curriculum-item>div:first-child{flex:1;min-width:0}.school-curriculum-page .curriculum-list .curriculum-item .delete-btn{flex-shrink:0;margin-left:auto}.school-curriculum-page .curriculum-list .curriculum-name{margin-bottom:.25rem;font-size:.9rem}.school-curriculum-page .curriculum-list .curriculum-meta{margin-top:.25rem}.curriculum-details{max-height:none}.form-row{grid-template-columns:1fr}.details-header{flex-direction:column;align-items:stretch}.header-actions{flex-direction:column}.subject-header{flex-direction:column;align-items:flex-start}.subject-actions{width:100%;justify-content:flex-start}.project-item{flex-direction:column;gap:.5rem}.drag-handle{display:none}}.curriculum-form-modal{max-width:600px!important;width:90%!important;max-height:90vh!important;overflow-y:auto!important;overflow-x:hidden!important}.curriculum-form-modal .modal-body{padding:1.5rem;overflow-x:hidden}.curriculum-form-modal .form-group{margin-bottom:1rem}.curriculum-form-modal input,.curriculum-form-modal textarea{width:100%;padding:.75rem;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;transition:border-color .2s;box-sizing:border-box}.curriculum-form-modal input:focus,.curriculum-form-modal textarea:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #6366f11a}.curriculum-form-modal label{display:block;margin-bottom:.5rem;font-size:.9rem;color:#64748b;font-weight:500}.curriculum-form-modal .installment-fields-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1rem}.curriculum-form-modal .modal-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1.5rem}@media(max-width:768px){.curriculum-page{padding:.5rem}.page-header{padding:1rem;flex-direction:column;align-items:stretch}.page-header h2{font-size:1.25rem}.curriculum-layout{flex-direction:column}.curriculum-list{width:100%;margin-bottom:1rem}.curriculum-details{width:100%}.details-header{flex-direction:column;align-items:stretch;gap:1rem}.header-actions-vertical{width:100%;min-width:auto}.header-actions-vertical button{width:100%}.curriculum-item{padding:1rem;min-height:60px}.curriculum-name{font-size:1rem}.curriculum-meta{font-size:.8rem}.subject-card{padding:1rem}.subject-header{flex-direction:column;align-items:stretch;gap:.75rem}.subject-actions{flex-direction:column;width:100%}.subject-actions button{width:100%}.topic-item{padding:.75rem}.topic-actions{flex-direction:column;gap:.5rem}.topic-actions button{width:100%;padding:.5rem}.curriculum-form-modal{width:95%!important;max-height:95vh!important}.curriculum-form-modal .modal-body{padding:1rem}.curriculum-form-modal input,.curriculum-form-modal textarea{font-size:16px}.curriculum-form-modal .installment-fields-grid{grid-template-columns:1fr;gap:1rem}.curriculum-form-modal .modal-actions{flex-direction:column;gap:.75rem}.curriculum-form-modal .modal-actions button{width:100%}.inline-form{padding:1rem}.form-actions{flex-direction:column;gap:.75rem}.form-actions button{width:100%}}@media(max-width:480px){.curriculum-page .page-header h2{font-size:1.1rem}.curriculum-form-modal{width:100%!important;max-height:100vh!important;border-radius:0!important}.curriculum-form-modal .modal-header h3{font-size:1.05rem}.center-curriculum-page .curriculum-item{padding:.7rem .6rem}.center-curriculum-page .curriculum-name{font-size:.85rem;line-height:1.35;margin-bottom:.4rem}.center-curriculum-page .fees-badge{font-size:.75rem;padding:.25rem .5rem}.center-curriculum-page .curriculum-actions{gap:.35rem}.center-curriculum-page .curriculum-item .btn-sm,.center-curriculum-page .curriculum-item .curriculum-actions .btn-sm{padding:.25rem .4rem;font-size:.65rem;min-width:45px;width:45px}.center-curriculum-page .curriculum-item .delete-btn,.center-curriculum-page .curriculum-item .curriculum-actions .delete-btn{padding:.25rem .4rem;font-size:.85rem;min-width:45px;width:45px}.school-curriculum-page .curriculum-list .curriculum-item{padding:.65rem .55rem}.school-curriculum-page .curriculum-list .curriculum-name{font-size:.85rem}.school-curriculum-page .curriculum-list .curriculum-item .delete-btn{width:30px;height:30px;min-width:30px;padding:0;font-size:.9rem}.curriculum-page .subject-card{padding:.75rem}.curriculum-page .topic-item{padding:.6rem}}@media(max-width:768px){.school-curriculum-page .curriculum-list .curriculum-item{flex-direction:row!important;align-items:center!important;gap:0!important;padding:.75rem!important}.school-curriculum-page .curriculum-list .curriculum-item>div:first-child{flex:1!important;min-width:0!important;max-width:none!important}.school-curriculum-page .curriculum-list .curriculum-item .delete-btn{flex-shrink:0!important;width:32px!important;height:32px!important;min-width:32px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:1rem!important;border-radius:6px!important;margin-left:.5rem!important}.school-curriculum-page .curriculum-list .curriculum-name{margin-bottom:.25rem!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}.school-curriculum-page .curriculum-list .curriculum-meta{margin-top:.25rem!important;white-space:normal!important}}@media(min-width:769px){.school-curriculum-page .curriculum-layout{grid-template-columns:240px 1fr}.school-curriculum-page .curriculum-list{max-width:240px}}.school-curriculum-page .curriculum-list .curriculum-item{padding:.75rem 1rem;display:flex;flex-direction:row;align-items:center;gap:1rem;justify-content:flex-start;min-height:56px}.school-curriculum-page .curriculum-list .curriculum-item>div:first-child{flex:0 0 auto;min-width:0;max-width:140px}.school-curriculum-page .curriculum-list .curriculum-item .delete-btn{width:36px;height:36px;min-width:36px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:6px;flex-shrink:0;margin-left:.5rem}.school-curriculum-page .curriculum-list .curriculum-name{margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.school-curriculum-page .curriculum-list .curriculum-meta{margin-top:0;white-space:nowrap}.class-progress-page{padding:1.5rem;max-width:1400px;margin:0 auto}.page-header{margin-bottom:1.5rem}.page-header h2{margin:0;color:#1a1a2e}.progress-layout{display:grid;grid-template-columns:280px 1fr;gap:1.5rem}.classes-sidebar{background:#fff;border-radius:12px;padding:1rem;box-shadow:0 2px 8px #0000001a;height:fit-content;max-height:calc(100vh - 200px);overflow-y:auto}.classes-sidebar h3{margin:0 0 1rem;font-size:1.1rem;color:#1a1a2e}.class-item{padding:1rem;border-radius:8px;margin-bottom:.5rem;cursor:pointer;transition:all .2s;border:2px solid transparent}.class-item:hover{background:#f8fafc}.class-item.active{background:#eff6ff;border-color:#3b82f6}.class-name{font-weight:600;color:#1a1a2e;margin-bottom:.25rem}.class-meta{font-size:.85rem;color:#64748b}.progress-content{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 2px 8px #0000001a;min-height:400px;max-height:calc(100vh - 200px);overflow-y:auto}.no-selection,.loading{display:flex;align-items:center;justify-content:center;height:400px;color:#94a3b8;font-size:1.1rem}.no-curriculum{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center}.no-curriculum .icon{font-size:4rem;margin-bottom:1rem}.no-curriculum h3{color:#1a1a2e;margin-bottom:.5rem}.no-curriculum p{color:#64748b;margin-bottom:1.5rem}.assign-form{width:100%;max-width:400px;margin-top:1.5rem}.assign-form select{width:100%;padding:.75rem;border:1px solid #e2e8f0;border-radius:8px;margin-bottom:1rem}.form-actions{display:flex;gap:.75rem}.curriculum-header{padding-bottom:1rem;margin-bottom:1.5rem;border-bottom:2px solid #f1f5f9}.curriculum-header h3{margin:0 0 .5rem;color:#1a1a2e}.grade-label{color:#64748b;font-size:.9rem;margin:0}.subjects-progress{display:flex;flex-direction:column;gap:1rem;overflow-y:auto}.subject-progress-card{border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.subject-progress-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:#f8fafc;cursor:pointer;transition:background .2s;gap:1rem;flex-wrap:wrap}.subject-progress-header:hover{background:#f1f5f9}.subject-info{flex:1;min-width:0}.subject-info h4{margin:0;color:#1a1a2e;font-size:1rem;display:flex;align-items:center;gap:.5rem}.expand-icon{font-size:.7rem;color:#94a3b8}.subject-desc{margin:.5rem 0 0;color:#64748b;font-size:.85rem}.progress-indicator{display:flex;align-items:center;gap:.75rem;flex-shrink:0}.progress-bar{width:120px;height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#10b981,#059669);border-radius:4px;transition:width .3s}.progress-text{font-size:.9rem;font-weight:600;color:#10b981;min-width:45px}.projects-progress{padding:1rem;background:#fff}.project-progress-item{display:flex;gap:1rem;padding:1rem;border-radius:8px;margin-bottom:.75rem;border-left:4px solid #cbd5e1;background:#f8fafc;transition:all .2s;flex-wrap:wrap;align-items:center}.project-progress-item.status-completed{border-left-color:#10b981;background:#f0fdf4}.project-progress-item.status-in-progress{border-left-color:#f59e0b;background:#fffbeb}.project-progress-item.status-not-started{border-left-color:#cbd5e1;background:#f8fafc}.project-number{width:32px;height:32px;border-radius:50%;background:#3b82f6;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem;flex-shrink:0}.project-info{flex:1;min-width:0}.project-name{font-weight:500;color:#1a1a2e;margin-bottom:.25rem}.project-desc{color:#64748b;font-size:.85rem;line-height:1.4;margin-bottom:.25rem}.completion-date{font-size:.8rem;color:#10b981;font-weight:500}.status-buttons{display:flex;gap:.5rem;flex-shrink:0}.status-btn{width:36px;height:36px;border-radius:50%;border:2px solid #e2e8f0;background:#fff;font-size:1.2rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.status-btn:hover{transform:scale(1.1);border-color:#cbd5e1}.status-btn.active{border-width:3px}.status-btn:nth-child(1).active{border-color:#cbd5e1;color:#64748b}.status-btn:nth-child(2).active{border-color:#f59e0b;color:#f59e0b}.status-btn:nth-child(3).active{border-color:#10b981;color:#10b981}.btn-primary,.btn-secondary{padding:.5rem 1rem;border:none;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:#3b82f6;color:#fff}.btn-primary:hover{background:#2563eb}.btn-secondary{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}.btn-secondary:hover{background:#e2e8f0}@media(max-width:768px){.class-progress-page{padding:1rem}.progress-layout{grid-template-columns:1fr}.classes-sidebar{max-height:250px}.subject-progress-header{flex-direction:column;align-items:flex-start}.progress-indicator{width:100%}.progress-bar{flex:1}.project-progress-item{flex-wrap:wrap}.status-buttons{width:100%;justify-content:center}}.timetable-page{max-width:1600px;padding:16px;margin:0 auto;background:#f8f9fa;min-height:100vh}.page-header{margin-bottom:16px;background:#fff;padding:16px;border-radius:8px;box-shadow:0 2px 8px #00000014}.page-header h2{margin:0 0 4px;color:#1a1a2e;font-size:24px;font-weight:700}.subtitle{color:#64748b;font-size:14px;margin:0}.loading{text-align:center;padding:40px;color:#64748b;font-size:16px;background:#fff;border-radius:8px;box-shadow:0 2px 8px #00000014}.no-data{text-align:center;padding:40px;background:#fff;border-radius:8px;box-shadow:0 2px 8px #00000014}.no-data p{color:#64748b;font-size:16px}.no-timetable{background:#fff;padding:50px 30px;border-radius:12px;text-align:center;box-shadow:0 2px 8px #00000014}.no-timetable p{color:#64748b;margin-bottom:20px;font-size:16px;font-weight:500}.timetable-page .classes-panel{background:linear-gradient(135deg,#4b5563,#2f3237);padding:12px 16px;border-radius:8px;box-shadow:0 4px 12px #667eea4d;position:fixed;bottom:0;z-index:100;max-height:100px;overflow:hidden}.timetable-page .classes-panel h4{margin:0 0 10px;color:#fff;font-size:14px;font-weight:700}.timetable-page .classes-list-drag{display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px;overflow-x:auto;overflow-y:hidden;padding-bottom:6px;-webkit-overflow-scrolling:touch}.timetable-page .classes-list-drag::-webkit-scrollbar{height:5px}.timetable-page .classes-list-drag::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}.timetable-page .classes-list-drag::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}.timetable-page .classes-list-drag::-webkit-scrollbar-thumb:hover{background:#ffffff80}.timetable-page .class-item-draggable{flex-shrink:0;min-width:auto;width:auto;padding:8px 14px;font-size:13px}.timetable-page .timetable-view{margin-bottom:120px}@media(min-width:769px){.timetable-page .timetable-edit-container{display:block}.timetable-page .timetable-main{width:100%}.timetable-page .classes-panel{left:260px!important;right:0!important;border-radius:12px 12px 0 0!important;max-height:100px!important;padding:12px 20px 18px!important}.timetable-page .classes-panel h4{font-size:13px;margin-bottom:10px}.timetable-page .classes-list-drag{padding-bottom:8px!important}.timetable-page .class-item-draggable{padding:8px 12px;font-size:12px}.timetable-page .timetable-view{margin-bottom:120px!important}}@media(max-width:768px){.timetable-page .classes-panel{left:0!important;right:0!important;bottom:0!important;border-radius:16px 16px 0 0;max-height:120px;padding:12px 16px 16px;margin:0}.timetable-page .classes-panel h4{font-size:14px;margin-bottom:10px}.timetable-page .classes-list-drag{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:8px!important;overflow-x:auto!important;overflow-y:hidden!important;width:100%;padding-bottom:0!important}.timetable-page .classes-list-drag::-webkit-scrollbar{height:4px}.timetable-page .class-item-draggable{flex-shrink:0!important;padding:8px 14px;font-size:12px;min-width:auto!important;width:auto!important}.timetable-page .timetable-view{margin-bottom:140px}}.classes-panel h4{margin:0 0 12px;color:#fff;font-size:16px;font-weight:700}.class-item-draggable{background:#fff;color:#4b5563;padding:10px 16px;border-radius:8px;cursor:grab;font-size:13px;font-weight:600;transition:all .3s;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;box-shadow:0 2px 8px #0000001a;border:2px solid transparent;white-space:nowrap;-webkit-tap-highlight-color:transparent}.class-item-draggable:hover{transform:translateY(-3px);box-shadow:0 6px 16px #00000026;border-color:#ffffff80}.class-item-draggable:active{cursor:grabbing;transform:scale(.98);background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff!important;border-color:#ffffff80}.class-item-draggable::selection{background:#4b55634d;color:#fff}.class-item-draggable::-moz-selection{background:#4b55634d;color:#fff}.class-item-draggable.dragging{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff!important;opacity:.9}.timetable-view{background:#fff;padding:16px;border-radius:12px;box-shadow:0 2px 8px #00000014}.timetable-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid #f1f5f9}.timetable-header h3{margin:0;color:#1a1a2e;font-size:20px;font-weight:700}.header-actions{display:flex;gap:12px}.header-actions .btn-primary,.header-actions .btn-secondary,.header-actions .btn-danger{padding:10px 20px;font-size:14px;font-weight:700;border-radius:8px}.header-actions .btn-primary:hover{background:linear-gradient(135deg,#4b5563,#2f3237);transform:translateY(-2px);box-shadow:0 6px 16px #667eea66}.header-actions .btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626)}.header-actions .btn-danger:hover{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 6px 16px #ef444466}.header-actions .btn-secondary{background:#fff;color:#475569;border:2px solid #e2e8f0}.header-actions .btn-secondary:hover{background:#fff;border-color:#e2e8f0;box-shadow:0 4px 12px #00000014}.timetable-grid{overflow-x:auto;margin-top:16px;border-radius:8px;box-shadow:0 2px 8px #0000000f}.schedule-table{width:100%;border-collapse:separate;border-spacing:0;min-width:900px;background:#fff;border-radius:8px;overflow:hidden}.schedule-table thead th{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;padding:12px 10px;text-align:center;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.5px;border:none;position:sticky;top:0;z-index:10}.schedule-table thead th:first-child{border-top-left-radius:8px}.schedule-table thead th:last-child{border-top-right-radius:8px}.schedule-table tbody td{border:1px solid #e2e8f0;padding:12px 10px;text-align:center;min-height:80px;vertical-align:middle;transition:all .2s}.schedule-table tbody tr:hover td{background:#f8fafc}.period-cell{background:linear-gradient(135deg,#f8fafc,#f1f5f9);font-weight:700;min-width:120px;border-right:2px solid #cbd5e1}.period-cell div:first-child{font-size:14px;color:#1a1a2e;margin-bottom:4px;font-weight:800}.period-time{font-size:12px;color:#64748b;font-weight:600;background:#fff;padding:3px 6px;border-radius:4px;display:inline-block}.empty-slot{background:#fafafa;min-height:80px}.empty-slot.droppable{background:linear-gradient(135deg,#f3f4f6,#e5e7eb);cursor:pointer;transition:all .3s;border:2px dashed #93c5fd}.empty-slot.droppable:hover{background:linear-gradient(135deg,#e5e7eb,#d1d5db);border-color:#4b5563;transform:scale(1.02)}.has-classes{background:#fff}.classes-list{display:flex;flex-direction:column;gap:6px;align-items:center;padding:4px}.class-chip{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:8px 12px;border-radius:6px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:10px;width:100%;max-width:100%;justify-content:space-between;box-shadow:0 2px 8px #10b9814d;transition:all .2s;word-break:break-word;overflow-wrap:break-word}.class-chip>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.class-chip:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b98166}.remove-class{background:#ffffff40;border:none;color:#fff;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.remove-class:hover{background:#fff6;transform:scale(1.1)}.no-class{color:#cbd5e1;font-size:24px;font-weight:300}.modal-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .2s ease}.modal-content{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;max-width:90%;max-height:90vh;overflow-y:auto;animation:slideUp .3s ease}.wizard-modal{max-width:700px;padding:24px}.wizard-progress{display:flex;justify-content:center;align-items:center;gap:12px;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #f1f5f9}.wizard-progress .step{display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:20px;background:#f8fafc;color:#94a3b8;font-weight:700;font-size:13px;transition:all .3s}.wizard-progress .step-number{width:28px;height:28px;border-radius:50%;background:#cbd5e1;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;transition:all .3s}.wizard-progress .step.active{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;box-shadow:0 4px 12px #667eea66;transform:scale(1.05)}.wizard-progress .step.active .step-number{background:#ffffff4d;box-shadow:0 0 0 3px #fff3}.wizard-progress .step-connector{width:50px;height:3px;background:#e2e8f0;border-radius:2px;transition:all .3s}.wizard-progress .step-connector.active{background:linear-gradient(90deg,#4b5563,#1f2937)}.wizard-step{animation:fadeInUp .3s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.wizard-step h3{font-size:20px;color:#1a1a2e;margin:0 0 8px;font-weight:800}.wizard-step>p{color:#64748b;margin-bottom:20px;font-size:14px;line-height:1.6}.form-group{margin-bottom:20px}.form-group label{display:block;font-size:13px;color:#475569;margin-bottom:8px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.form-group input[type=number]{width:150px;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:18px;font-weight:700;color:#1a1a2e;transition:all .2s}.form-group input[type=number]:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 4px #667eea1a}.period-timings{display:flex;flex-direction:column;gap:10px;padding:12px;background:#f8fafc;border-radius:8px;margin-bottom:20px;border:2px solid #e2e8f0}.timing-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border-radius:8px;border:2px solid #e2e8f0;transition:all .2s}.timing-row:hover{border-color:#4b5563;box-shadow:0 2px 8px #667eea1a}.timing-row span:first-child{min-width:90px;font-weight:800;color:#1a1a2e;font-size:14px}.timing-row span{color:#94a3b8;font-size:13px;font-weight:600}.timing-row input[type=time]{padding:8px 12px;border:2px solid #e2e8f0;border-radius:6px;font-size:13px;font-weight:600;transition:all .2s}.timing-row input[type=time]:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #667eea1a}.days-selector{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}.day-btn{padding:10px 20px;border:2px solid #e2e8f0;border-radius:8px;background:#fff;cursor:pointer;font-weight:700;font-size:14px;transition:all .2s;min-width:110px;text-align:center;color:#475569}.day-btn:hover{border-color:#4b5563;background:#f8fafc;transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.day-btn.selected{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;border-color:transparent;box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.wizard-actions{display:flex;justify-content:space-between;margin-top:24px;padding-top:16px;border-top:2px solid #f1f5f9}.timetable-page .btn-primary{background:linear-gradient(135deg,#4b5563,#2f3237);background-size:100% 100%;color:#fff;border:none;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 12px #667eea4d}.timetable-page .btn-primary:hover{background:linear-gradient(135deg,#4b5563,#2f3237);background-size:100% 100%;transform:translateY(-2px);box-shadow:0 6px 16px #667eea66}.timetable-page .btn-primary:active{transform:translateY(0)}.timetable-page .btn-primary:disabled{background:#cbd5e1;cursor:not-allowed;box-shadow:none;transform:none}.timetable-page .btn-primary.btn-large{padding:12px 28px;font-size:15px}.timetable-page .btn-secondary{background:#fff;color:#475569;border:2px solid #e2e8f0;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s}.timetable-page .btn-secondary:hover{background:#fff;border-color:#e2e8f0;transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.timetable-page .btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 12px #ef44444d}.timetable-page .btn-danger:hover{background:linear-gradient(135deg,#ef4444,#dc2626);transform:translateY(-2px);box-shadow:0 6px 16px #ef444466}@media(max-width:768px){.timetable-page{padding:16px}.page-header{padding:20px}.page-header h2{font-size:22px}.timetable-header{flex-direction:column;align-items:stretch;gap:12px}.timetable-header h3{font-size:20px}.header-actions{flex-direction:column;gap:12px}.header-actions button{width:100%;justify-content:center}.wizard-modal{padding:24px}.wizard-progress{flex-wrap:wrap;gap:8px}.wizard-progress .step-connector{display:none}.wizard-actions{flex-direction:column;gap:12px}.wizard-actions button{width:100%}.classes-list-drag{flex-direction:column}.class-item-draggable{width:100%}.day-btn{flex:1;min-width:100px}}.attendance-page{max-width:100%}.attendance-controls{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1.5rem;margin-bottom:1.5rem;background:#fff;padding:1.5rem 2rem;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a}.date-time-picker{display:flex;gap:1rem;align-items:center}.date-time-picker .form-group{margin-bottom:0}.date-time-picker label{display:block;font-size:.75rem;color:#64748b;margin-bottom:.35rem;text-transform:uppercase;font-weight:600;letter-spacing:.5px}.date-time-picker input,.date-time-picker select{padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:10px;font-size:1rem;font-weight:500;min-width:160px;transition:all .2s}.date-time-picker input:focus,.date-time-picker select:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #4b55631a}.attendance-stats{display:flex;gap:1rem}.attendance-stats .stat{padding:.5rem 1rem;border-radius:8px;font-weight:600;font-size:.9rem}.attendance-stats .stat.present{background:#d1fae5;color:#065f46}.attendance-stats .stat.absent{background:#fee2e2;color:#991b1b}.attendance-stats .stat.late{background:#fef3c7;color:#92400e}.monthly-attendance-container{background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 4px 6px -1px #0000001a}.monthly-grid-wrapper{overflow-x:auto;max-width:100%;position:relative}.monthly-attendance-table{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%}.monthly-attendance-table th,.monthly-attendance-table td{border:1px solid #e2e8f0;text-align:center;vertical-align:middle}.monthly-attendance-table .sticky-col{position:sticky;left:0;z-index:10;background:#fff;box-shadow:2px 0 5px #0000001a}.monthly-attendance-table .student-header{background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;font-weight:700;padding:1rem 1.5rem;min-width:200px;text-align:left;z-index:20}.monthly-attendance-table .student-name-cell{padding:.75rem 1rem;text-align:left;min-width:200px;background:#fff}.student-name-cell .student-name{font-weight:600;color:#1a1a2e;font-size:.95rem}.student-name-cell .student-school{font-size:.8rem;color:#64748b;margin-top:.15rem}.monthly-attendance-table .date-header{background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;padding:.75rem .5rem;min-width:50px;cursor:pointer;transition:all .2s}.monthly-attendance-table .date-header:hover{background:linear-gradient(135deg,#6b7280,#374151)}.date-header .date-num{font-size:1.1rem;font-weight:700}.date-header .date-day{font-size:.7rem;text-transform:uppercase;opacity:.9}.date-header.weekend{background:linear-gradient(135deg,#94a3b8,#64748b)}.monthly-attendance-table .attendance-cell{padding:.5rem;min-width:50px;height:50px;cursor:pointer;font-weight:700;font-size:1rem;transition:all .15s;background:#fff}.attendance-cell:hover{background:#f1f5f9;transform:scale(1.05)}.attendance-cell.weekend{background:#f8fafc}.attendance-cell.cell-present{background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#065f46}.attendance-cell.cell-absent{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#991b1b}.attendance-cell.cell-late{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}.monthly-attendance-table tbody tr:nth-child(2n) .student-name-cell{background:#f8fafc}.monthly-attendance-table tbody tr:nth-child(2n) .attendance-cell:not(.cell-present):not(.cell-absent):not(.cell-late){background:#fafafa}.attendance-legend{display:flex;gap:2rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid #e2e8f0;flex-wrap:wrap}.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:#64748b}.legend-box{width:24px;height:24px;border-radius:4px;border:1px solid #e2e8f0}.legend-box.present{background:linear-gradient(135deg,#d1fae5,#a7f3d0)}.legend-box.absent{background:linear-gradient(135deg,#fee2e2,#fecaca)}.legend-box.late{background:linear-gradient(135deg,#fef3c7,#fde68a)}.legend-box.weekend-box{background:#f8fafc}@media(max-width:768px){.attendance-controls{flex-direction:column;align-items:stretch}.date-time-picker{flex-direction:column}.attendance-page{padding:12px}.page-header{flex-direction:column;align-items:stretch;gap:12px}.attendance-controls button{width:100%}.attendance-grid{overflow-x:auto;-webkit-overflow-scrolling:touch;display:block;margin:0 -12px;padding:0 12px}.attendance-table{min-width:600px;display:table}.attendance-table th,.attendance-table td{font-size:12px;padding:8px 6px}.status-btn{padding:4px 8px;font-size:11px}.legend{flex-wrap:wrap;gap:8px}.legend-item{font-size:11px}.calendar-grid{overflow-x:auto;-webkit-overflow-scrolling:touch}.calendar-table{min-width:100%}.calendar-day{min-width:40px;height:40px;font-size:11px}}.attendance-stats{justify-content:center}.monthly-attendance-table .student-header,.monthly-attendance-table .student-name-cell{min-width:150px}.extra-student-row{background:linear-gradient(90deg,#fef3c7,transparent)!important}.extra-student{background:linear-gradient(135deg,#fef3c7,#fde68a)!important}.extra-badge{display:inline-block;background:#f59e0b;color:#fff;font-size:.65rem;padding:.15rem .4rem;border-radius:4px;margin-left:.5rem;font-weight:700;vertical-align:middle}.disapproved-student-row{background:linear-gradient(90deg,#fee2e2,transparent)!important}.disapproved-student{background:linear-gradient(135deg,#fee2e2,#fecaca)!important}.disapproved-student .student-name{color:#dc2626!important}.not-approved-badge{display:inline-block;background:#dc2626;color:#fff;font-size:.65rem;padding:.15rem .4rem;border-radius:4px;margin-left:.5rem;font-weight:700;vertical-align:middle}.legend-box.extra-box{background:linear-gradient(135deg,#fef3c7,#fde68a);border-color:#f59e0b}.legend-box.disapproved-box{background:linear-gradient(135deg,#fee2e2,#fecaca);border-color:#dc2626}.action-buttons{display:flex;gap:.75rem}.modal-hint{color:#64748b;font-size:.9rem;margin-bottom:1rem;padding:.75rem;background:#fef3c7;border-radius:8px;border-left:3px solid #f59e0b}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:.75rem}.form-row .form-group{margin-bottom:0}.modal .mcs-phone-input-container{width:100%!important;display:flex!important;gap:.5rem!important}.modal .mcs-phone-select{width:80px!important;min-width:70px!important;max-width:80px!important;padding:.625rem .375rem!important;border:2px solid #e2e8f0!important;border-radius:10px!important;font-size:.875rem!important;background:#fff!important;flex-shrink:0!important}.modal .mcs-phone-select:focus{outline:none!important;border-color:#4b5563!important;box-shadow:0 0 0 3px #4b55631a!important}.modal .mcs-phone-number-input{width:100%!important;padding:.625rem .875rem!important;border:2px solid #e2e8f0!important;border-radius:10px!important;font-size:.875rem!important;transition:all .2s ease!important;background:#fff!important;flex:1!important;min-width:0!important}.modal .mcs-phone-number-input:focus{outline:none!important;border-color:#4b5563!important;box-shadow:0 0 0 3px #4b55631a!important}.modal .mcs-phone-number-input+span{font-size:.7rem!important;margin-bottom:0!important;bottom:auto!important;top:100%!important;margin-top:2px!important}@media(max-width:500px){.form-row{grid-template-columns:1fr}.modal .mcs-phone-select{width:70px!important;min-width:65px!important;max-width:70px!important;font-size:.8125rem!important}.modal .mcs-phone-number-input{font-size:.8125rem!important}}.gallery-page{padding:20px;max-width:1200px;margin:0 auto}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-top:20px}.gallery-item{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #0000001a;border:1px solid #e2e8f0;transition:all .3s ease;cursor:pointer}.gallery-item:hover{transform:translateY(-4px);box-shadow:0 8px 25px #00000026}.image-thumbnail{position:relative;width:100%;height:200px;overflow:hidden}.image-thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.image-loading{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f8fafc;color:#64748b;font-size:14px}.gallery-item:hover .image-thumbnail img{transform:scale(1.05)}.image-overlay{position:absolute;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}.gallery-item:hover .image-overlay{opacity:1}.view-text{color:#fff;font-weight:600;font-size:16px}.image-details{padding:16px}.image-description{font-weight:600;color:#1e293b;margin:0 0 8px;font-size:14px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.image-meta{color:#64748b;font-size:12px;margin:0}.upload-modal{max-width:500px!important;width:90%!important}.upload-modal .modal-body{padding:24px!important}.upload-form{max-width:500px}.form-field label{display:block;margin-bottom:8px;font-weight:600;color:#374151}.form-field input[type=file]{width:100%;padding:12px;border:2px dashed #d1d5db;border-radius:8px;background:#f9fafb;cursor:pointer;transition:all .2s ease}.form-field input[type=file]:hover{border-color:#3b82f6;background:#eff6ff}.form-field textarea{width:100%;padding:12px;border:1px solid #d1d5db;border-radius:8px;font-family:inherit;resize:vertical;min-height:80px}.file-info{margin-top:8px;padding:8px 12px;background:#f0f9ff;border:1px solid #bae6fd;border-radius:6px;font-size:14px;color:#0369a1}.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:0!important;padding:0!important;border-top:0px solid #e2e8f0!important}.form-actions button{flex:1!important;width:100%!important;text-align:center!important;display:flex!important;align-items:center!important;justify-content:center!important}.info-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px;margin-bottom:20px}.info-box p{margin:0 0 8px;color:#475569;font-size:14px}.info-box p:last-child{margin-bottom:0}.image-viewer-modal .modal-content{max-width:90vw;max-height:90vh;width:auto}.image-viewer{display:flex;flex-direction:column;gap:20px}.image-container{position:relative;display:flex;justify-content:center;align-items:center;background:#000;border-radius:8px;overflow:hidden}.viewer-image{max-width:100%;max-height:60vh;object-fit:contain}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);background:#000000b3;color:#fff;border:none;width:50px;height:50px;border-radius:50%;font-size:20px;cursor:pointer;transition:all .2s ease;z-index:10}.nav-btn:hover{background:#000000e6;transform:translateY(-50%) scale(1.1)}.prev-btn{left:20px}.next-btn{right:20px}.image-info{display:grid;grid-template-columns:1fr 2fr 1fr;gap:20px;align-items:start}.image-meta{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0}.image-meta p{margin:0 0 8px;font-size:14px;color:#475569}.image-meta p:last-child{margin-bottom:0}.description-section{background:#f8fafc;padding:16px;border-radius:8px;border:1px solid #e2e8f0}.description-display p{margin:0 0 12px;color:#374151;font-size:14px}.description-display p:last-child{margin-bottom:0}.edit-description textarea{width:100%;padding:8px;border:1px solid #d1d5db;border-radius:6px;font-family:inherit;resize:vertical;margin-bottom:12px}.edit-actions{display:flex;gap:8px}.image-actions{display:flex;flex-direction:column;gap:8px}.no-data p{margin:0 0 12px;font-size:16px}.no-data p:last-child{margin-bottom:0;font-size:14px}.btn-secondary{background:#f8fafc;color:#475569;border:1px solid #e2e8f0;padding:10px 20px;border-radius:8px;font-weight:600!important;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background:#e2e8f0;color:#334155}.btn-sm{padding:6px 12px;font-size:14px;border-radius:6px}.btn-danger{background:#ef4444;color:#fff;border:none;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-danger:hover{background:#dc2626;transform:translateY(-1px)}@media(max-width:768px){.gallery-page{padding:15px}.page-header{flex-direction:column;gap:15px;align-items:stretch}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:15px}.image-viewer{gap:15px}.image-info{grid-template-columns:1fr;gap:15px}.viewer-image{max-height:50vh}.nav-btn{width:40px;height:40px;font-size:16px}.prev-btn{left:10px}.next-btn{right:10px}.form-actions{flex-direction:column}.form-actions button{width:100%}.form-actions .btn-primary{margin-top:0!important}.upload-modal{max-width:100%!important;width:95%!important}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;overflow-y:auto}.form-section{margin-bottom:0!important}.modal-form{max-width:800px;width:100%;max-height:90vh;overflow-y:auto;margin:auto;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.student-registration-form{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:0;margin-bottom:24px;box-shadow:0 1px 3px #0000001a}.student-registration-form .form-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e5e7eb;background:#f9fafb;border-radius:12px 12px 0 0}.student-registration-form .form-header h3{margin:0;font-size:18px;color:#111827;font-weight:600}.student-registration-form .close-btn{background:none;border:none;font-size:28px;color:#6b7280;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s}.student-registration-form .close-btn:hover{background:#e5e7eb;color:#111827}.student-registration-form .form-section{padding:0 20px!important;border-bottom:1px solid #f3f4f6}.student-registration-form .form-section:last-of-type{border-bottom:none}.student-registration-form .form-section h4{margin:0 0 16px;font-size:15px;color:#374151;font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-size:13px}.student-registration-form .form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.student-registration-form .form-field{display:flex;flex-direction:column;gap:6px}.student-registration-form .form-field.full-width{grid-column:1 / -1}.student-registration-form .form-field label{font-size:14px;color:#374151;font-weight:500}.student-registration-form .form-field label .required{color:#ef4444;margin-left:2px}.student-registration-form .form-field input,.student-registration-form .form-field select,.student-registration-form .form-field textarea{padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;transition:all .2s;font-family:inherit}.student-registration-form .form-field input:focus,.student-registration-form .form-field select:focus,.student-registration-form .form-field textarea:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.student-registration-form .form-field textarea{resize:vertical;min-height:60px}.student-registration-form .checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;padding-top:8px}.student-registration-form .checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.student-registration-form .checkbox-label span{font-size:14px;color:#374151}.student-registration-form .form-actions{display:flex;justify-content:flex-end;gap:12px;padding:20px 24px!important;background:#f9fafb;border-radius:0 0 12px 12px}.student-registration-form .form-actions .btn-secondary{background:#fff;color:#374151;border:1px solid #d1d5db;padding:10px 20px;border-radius:6px;cursor:pointer;font-weight:500;transition:all .2s}.student-registration-form .form-actions .btn-secondary:hover{background:#f3f4f6}.student-registration-form .form-actions .btn-primary{background:#4f46e5;color:#fff;border:none;padding:10px 24px;border-radius:6px;cursor:pointer;font-weight:500;transition:all .2s}.student-registration-form .form-actions .btn-primary:hover{background:#4338ca}.search-box{position:relative;flex:1;max-width:400px;margin-bottom:0!important;border-bottom:0px solid #00000000!important}.search-input{width:100%;padding:10px 36px 10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;transition:all .2s}.search-input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.clear-search{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:#e5e7eb;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:18px;color:#6b7280;display:flex;align-items:center;justify-content:center;transition:all .2s}.clear-search:hover{background:#d1d5db;color:#374151}.clickable-row:hover{background-color:#d1fae5!important;transform:scale(1.01)}.btn-sm{padding:6px 12px;font-size:13px;border-radius:4px;cursor:pointer;font-weight:500;transition:all .2s;border:none}.btn-sm.btn-secondary{background:#f3f4f6;color:#374151;border:1px solid #d1d5db}.btn-sm.btn-secondary:hover{background:#e5e7eb}.btn-sm.btn-danger{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}.btn-sm.btn-danger:hover{background:#fecaca;color:#7f1d1d}@media(max-width:768px){.modal-overlay{padding:10px;align-items:flex-start}.modal-form{max-height:95vh;margin:10px auto}.student-registration-form .form-grid{grid-template-columns:1fr}.student-registration-form .form-section{padding:0 10px!important}.student-registration-form .form-header{padding:16px}.student-registration-form .form-header h3{font-size:16px}.student-registration-form .form-actions{padding:16px;flex-direction:column}.student-registration-form .form-actions button{width:100%}.page-header{flex-direction:column;gap:12px;align-items:stretch}.header-actions{flex-direction:column;width:100%}.search-box{max-width:100%}.header-actions .btn-primary{width:100%}.students-page{overflow-x:visible!important}.students-page .table-wrapper{display:block!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;margin:0!important;padding:0!important;width:100%!important}.students-page .data-table{display:table!important;min-width:700px!important;white-space:nowrap!important;width:auto!important}.students-page .data-table th,.students-page .data-table td{font-size:13px!important;padding:12px 10px!important;white-space:nowrap!important}.students-page .data-table th:first-child,.students-page .data-table td:first-child{position:sticky!important;left:0!important;background:#fff!important;z-index:1!important;box-shadow:2px 0 4px #0000000d!important}.students-page .data-table thead th:first-child{background:#f9fafb!important;z-index:2!important}.btn-sm{padding:6px 10px;font-size:12px;white-space:nowrap}.clickable-row:hover{transform:none}}.readonly-field{background-color:#f8fafc!important;color:#64748b!important;cursor:not-allowed!important;border-color:#e2e8f0!important}.readonly-field:focus{outline:none!important;box-shadow:none!important;border-color:#e2e8f0!important}.student-groups-page{padding:20px;max-width:1200px;margin:0 auto}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:15px;border-bottom:2px solid #e2e8f0}.header-left{display:flex;align-items:center;gap:16px}.btn-back{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;color:#475569;text-decoration:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-back:hover{background:#e2e8f0;color:#334155;transform:translate(-2px)}@media(max-width:768px){.student-groups-header-left{flex-direction:column;align-items:flex-start;gap:12px}}.page-header h2{margin:0;color:#1e293b;font-size:28px;font-weight:700}.header-actions{display:flex;gap:12px;align-items:center}.groups-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:20px}.group-card{background:#fff;border-radius:12px;padding:12px;box-shadow:0 2px 8px #0000001a;border:1px solid #e2e8f0;transition:all .3s ease}.group-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.group-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}.group-header h3{margin:0;color:#1e293b;font-size:16px;font-weight:600;flex:1;line-height:1.3}.group-actions{display:flex;gap:6px}.group-info{margin-bottom:12px}.group-description{color:#64748b;font-size:13px;margin-bottom:8px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.group-meta p{margin:4px 0;font-size:13px;color:#475569}.group-meta strong{color:#1e293b}.group-footer{padding-top:8px}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-form{background:#fff;border-radius:12px;padding:0;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.group-details-modal{max-width:700px}.form-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e2e8f0;background:#f8fafc;border-radius:12px 12px 0 0}.form-header h3{margin:0;color:#1e293b;font-size:20px;font-weight:600}.close-btn{background:none;border:none;font-size:24px;cursor:pointer;color:#64748b;padding:4px;border-radius:4px;transition:all .2s ease}.close-btn:hover{background:#e2e8f0;color:#1e293b}.form-section{padding:24px}.form-field{margin-bottom:20px}.form-field label{display:block;margin-bottom:6px;font-weight:600;color:#374151;font-size:14px}.required{color:#ef4444}.form-field input,.form-field select,.form-field textarea{width:100%;padding:10px 12px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;transition:all .2s ease;box-sizing:border-box}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-field textarea{resize:vertical;min-height:80px}.students-selection{max-height:200px;overflow-y:auto;border:1px solid #d1d5db;border-radius:8px;padding:12px;background:#f9fafb}.checkbox-label{display:flex;align-items:center;gap:8px;padding:6px 0;cursor:pointer;font-size:14px}.checkbox-label input[type=checkbox]{width:auto;margin:0}.checkbox-label:hover{background:#f3f4f6;border-radius:4px;padding:6px 8px;margin:0 -8px}.group-info{padding:0 24px;border-bottom:1px solid #e2e8f0}.group-info p{margin:8px 0;color:#475569}.add-students-section{padding:20px 24px;border-bottom:1px solid #e2e8f0}.add-students-section h4{margin:0 0 15px;color:#1e293b;font-size:16px}.available-students{max-height:150px;overflow-y:auto}.group-students{padding:20px 24px}.group-students h4{margin:0 0 15px;color:#1e293b;font-size:16px}.students-list{max-height:300px;overflow-y:auto}.student-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid #e2e8f0;border-radius:8px;margin-bottom:8px;background:#f9fafb;transition:all .2s ease}.student-item:hover{background:#f3f4f6;border-color:#d1d5db}.student-info{display:flex;flex-direction:column;gap:4px}.student-name{font-weight:600;color:#1e293b;font-size:14px}.student-contact{font-size:12px;color:#64748b}.form-actions{display:flex;justify-content:flex-end;gap:12px;padding:20px 24px;border-top:1px solid #e2e8f0;background:#f8fafc;border-radius:0 0 12px 12px}.btn-primary{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s ease;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.btn-primary:hover{background:linear-gradient(135deg,#2563eb,#1e40af);transform:translateY(-1px);box-shadow:0 4px 12px #3b82f666}.btn-secondary{background:#f1f5f9;color:#475569;border:1px solid #cbd5e1;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s ease}.btn-secondary:hover{background:#e2e8f0;border-color:#94a3b8}.btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s ease}.btn-danger:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:translateY(-1px);box-shadow:0 4px 12px #ef444466}.btn-sm{padding:6px 12px;font-size:12px;border-radius:6px}.loading-state{text-align:center;padding:60px 20px;color:#64748b;font-size:16px}.no-data{text-align:center;padding:60px 20px;color:#64748b}.no-data p{margin:8px 0;font-size:16px}@media(max-width:768px){.student-groups-page{padding:15px}.page-header{flex-direction:column;gap:15px;align-items:stretch}.groups-grid{grid-template-columns:1fr;gap:15px}.group-actions{justify-content:flex-end}.modal-form{margin:10px;max-height:calc(100vh - 20px)}.form-actions{flex-direction:column}.student-item{flex-direction:column;gap:10px;align-items:stretch}.student-info{text-align:center}}.student-groups-page .modal-body .form-actions{display:flex;gap:16px;margin-top:32px;padding:0;border:none;background:none;border-radius:0}.student-groups-page .modal-body .form-actions .btn-secondary{flex:1;padding:14px 24px;background:#f1f5f9;color:#475569;border:2px solid #e2e8f0;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;min-height:48px;display:flex;align-items:center;justify-content:center;width:auto!important}.student-groups-page .modal-body .form-actions .btn-secondary:hover{background:#e2e8f0;border-color:#cbd5e1}.student-groups-page .modal-body .form-actions .btn-primary{flex:1;min-height:48px;font-size:15px;padding:14px 24px;width:auto!important;margin-top:0!important}.student-groups-page .modal-body .students-selection{max-height:200px;overflow-y:auto;border:2px solid #e2e8f0;border-radius:12px;padding:16px;background:#f8fafc}.student-groups-page .modal-body .checkbox-label{display:flex;align-items:center;gap:8px;padding:8px 0;cursor:pointer;transition:background .2s}.student-groups-page .modal-body .checkbox-label:hover{background:#3b82f60d;border-radius:8px;padding-left:8px;padding-right:8px}.student-groups-page .modal-body .checkbox-label input[type=checkbox]{width:auto;margin:0}.student-groups-page .students-list{display:flex;flex-direction:column;gap:12px}.student-groups-page .student-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:#f8fafc;border:2px solid #e2e8f0;border-radius:12px;transition:all .2s;margin-bottom:0}.student-groups-page .student-item:hover{border-color:#cbd5e1;background:#f1f5f9}.student-groups-page .student-info{display:flex;flex-direction:column;gap:4px}.student-groups-page .student-name{font-weight:600;color:#1e293b;font-size:15px}.student-groups-page .student-contact{font-size:13px;color:#64748b}.student-groups-page .btn-sm{padding:8px 16px;font-size:13px;border-radius:8px;border:none;cursor:pointer;font-weight:500;transition:all .2s}.student-groups-page .btn-primary.btn-sm{background:#3b82f6;color:#fff}.student-groups-page .btn-primary.btn-sm:hover{background:#2563eb;transform:translateY(-1px)}.student-groups-page .btn-danger.btn-sm{background:#ef4444;color:#fff}.student-groups-page .btn-danger.btn-sm:hover{background:#dc2626;transform:translateY(-1px)}.student-groups-page .available-students{max-height:400px;overflow-y:auto;margin-top:16px}.student-groups-page .no-data{text-align:center;color:#64748b;font-style:italic;padding:24px;background:#f8fafc;border:2px dashed #e2e8f0;border-radius:12px;margin:16px 0}.student-groups-page .modal-body .form-field{margin-bottom:24px}.student-groups-page .modal-body .form-field:last-of-type{margin-bottom:0}.student-groups-page .modal-backdrop .modal-content,.modal-backdrop .student-groups-page .modal-content{max-width:500px!important;width:500px!important;min-width:500px!important}.student-groups-page .modal-body .students-header{display:flex!important;justify-content:space-between!important;align-items:center!important;margin-bottom:16px!important;gap:12px!important}.student-groups-page .modal-body .students-header h4{margin:0!important;color:#1e293b!important;font-size:18px!important;font-weight:600!important;flex:1!important;min-width:0!important}.student-groups-page .modal-body .students-header .btn-sm{flex-shrink:0!important;white-space:nowrap!important;padding:8px 16px!important;font-size:13px!important;width:auto!important;margin:0!important}@media(max-width:768px){.student-groups-page .modal-backdrop .modal-content,.modal-backdrop .student-groups-page .modal-content{max-width:95%!important;width:95%!important;min-width:300px!important}.student-groups-page .modal-body .students-header{flex-direction:row!important;align-items:center!important;gap:8px!important}.student-groups-page .modal-body .students-header .btn-sm{align-self:center!important}.student-groups-page .modal-body .available-students .student-item{padding:10px!important;flex-direction:row!important;align-items:center!important;gap:8px!important;min-height:auto!important;height:auto!important}.student-groups-page .modal-body .available-students .student-info{flex:1!important;min-width:0!important}.student-groups-page .modal-body .available-students .student-name{font-size:13px!important}.student-groups-page .modal-body .available-students .student-contact{font-size:11px!important}.student-groups-page .modal-body .available-students .add-student-btn{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;max-width:28px!important;max-height:28px!important;font-size:16px!important;flex-shrink:0!important;align-self:center!important}}.student-groups-page .modal-body{padding:10px!important}.student-groups-page .modal-body .available-students .student-item{padding:12px!important;margin-bottom:8px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;background:#f8fafc!important;border:none!important;border-radius:12px!important;flex-direction:row!important;gap:12px!important}.student-groups-page .modal-body .available-students .student-info{flex:1!important;min-width:0!important;display:flex!important;flex-direction:column!important;gap:4px!important;align-items:flex-start!important}.student-groups-page .modal-body .available-students .student-name{font-weight:600!important;color:#1e293b!important;font-size:14px!important;line-height:1.3!important;margin:0!important;padding:0!important;display:block!important;width:100%!important;text-align:left!important}.student-groups-page .modal-body .available-students .student-contact{font-size:12px!important;color:#64748b!important;line-height:1.2!important;margin:0!important;padding:0!important;display:block!important;width:100%!important;text-align:left!important}.student-groups-page .modal-body .available-students .add-student-btn{width:32px!important;height:32px!important;border-radius:50%!important;padding:0!important;font-size:18px!important;font-weight:700!important;display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important;margin:0!important;background:linear-gradient(135deg,#4b5563,#2f3237)!important;color:#fff!important;border:none!important;cursor:pointer!important;transition:all .2s!important;flex-shrink:0!important}.student-groups-page .modal-body .available-students .add-student-btn:hover{background:linear-gradient(135deg,#374151,#1f2937)!important;transform:translateY(-1px)!important}.student-groups-page .available-students .student-info{flex:1!important;min-width:0!important;display:flex!important;flex-direction:column!important;gap:4px!important;align-items:flex-start!important}.student-groups-page .available-students .student-name{font-weight:600!important;color:#1e293b!important;font-size:14px!important;line-height:1.3!important;margin:0!important;padding:0!important;display:block!important;width:100%!important;text-align:left!important}.student-groups-page .available-students .student-contact{font-size:12px!important;color:#64748b!important;line-height:1.2!important;margin:0!important;padding:0!important;display:block!important;width:100%!important;text-align:left!important}.student-groups-page .available-students .add-student-btn{width:32px!important;height:32px!important;border-radius:50%!important;padding:0!important;font-size:18px!important;font-weight:700!important;display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important;margin:0 0 0 12px!important;background:linear-gradient(135deg,#4b5563,#2f3237)!important;color:#fff!important;border:none!important;cursor:pointer!important;transition:all .2s!important;flex-shrink:0!important}.student-groups-page .available-students .add-student-btn:hover{background:linear-gradient(135deg,#374151,#1f2937)!important;transform:translateY(-1px)!important}.student-groups-page .modal-body .available-students .student-info span{display:block!important;width:100%!important;margin:0!important;padding:0!important}.student-groups-page .modal-body .available-students .student-info span.student-name{font-weight:600!important;color:#1e293b!important;font-size:14px!important;line-height:1.3!important}.student-groups-page .modal-body .available-students .student-info span.student-contact{font-size:12px!important;color:#64748b!important;line-height:1.2!important}.student-groups-page .modal-backdrop{align-items:center!important;justify-content:center!important}.student-groups-page .modal-backdrop .modal-content{position:relative!important;transform:none!important;margin:auto!important}.student-groups-page .modal-body .students-list .student-item{padding:12px!important;margin-bottom:8px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;background:#f8fafc!important;border:none!important;border-radius:12px!important;flex-direction:row!important;gap:12px!important}.student-groups-page .modal-body .students-list .student-info{flex:1!important;min-width:0!important;display:flex!important;flex-direction:column!important;gap:4px!important;align-items:flex-start!important}.student-groups-page .modal-body .students-list .student-name{font-weight:600!important;color:#1e293b!important;font-size:14px!important;line-height:1.3!important;margin:0!important;padding:0!important;display:block!important;width:100%!important;text-align:left!important}.student-groups-page .modal-body .students-list .student-contact{font-size:12px!important;color:#64748b!important;line-height:1.2!important;margin:0!important;padding:0!important;display:block!important;width:100%!important;text-align:left!important}.student-groups-page .modal-body .students-list .btn-danger{padding:6px 12px!important;font-size:12px!important;border-radius:6px!important;flex-shrink:0!important;height:auto!important;min-height:auto!important}.student-groups-page .modal-body .students-list .delete-btn{width:36px!important;height:36px!important;min-width:36px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:6px!important;flex-shrink:0!important;margin-left:.5rem!important;font-size:18px!important;font-weight:400!important;line-height:1!important;background:#fef2f2!important;border:1px solid #ef4444!important;color:#ef4444!important;cursor:pointer!important;transition:all .2s!important}.student-groups-page .modal-body .students-list .delete-btn:hover{background:#fee2e2!important;border-color:#dc2626!important;color:#dc2626!important}@media(max-width:768px){.student-groups-page .modal-body .students-list .student-item{padding:10px!important;gap:8px!important}.student-groups-page .modal-body .students-list .student-name{font-size:13px!important}.student-groups-page .modal-body .students-list .student-contact{font-size:11px!important}.student-groups-page .modal-body .students-list .btn-danger{padding:4px 8px!important;font-size:11px!important}.student-groups-page .modal-body .students-list .delete-btn{width:32px!important;height:32px!important;min-width:32px!important;font-size:16px!important;margin-left:.25rem!important}}.student-profile{padding:20px;max-width:1200px;margin:0 auto}.profile-header{display:flex;align-items:center;gap:16px;margin-bottom:24px}.back-btn{background:#f3f4f6;border:1px solid #d1d5db;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;color:#374151;transition:all .2s}.back-btn:hover{background:#e5e7eb}.profile-title h2{margin:0;font-size:24px;color:#111827}.student-meta{margin:4px 0 0;color:#6b7280;font-size:14px}.profile-tabs{display:flex;gap:8px;border-bottom:2px solid #e5e7eb;margin-bottom:24px}.profile-tabs .tab{background:none;border:none;padding:12px 20px;cursor:pointer;font-size:14px;font-weight:500;color:#6b7280;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s}.profile-tabs .tab:hover{color:#374151}.profile-tabs .tab.active{color:#4f46e5;border-bottom-color:#4f46e5}.profile-content{background:#fff;border-radius:8px;padding:24px;border:1px solid #e5e7eb}.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-bottom:24px}.info-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:20px}.info-card h3{margin:0 0 16px;font-size:16px;color:#111827;font-weight:600;border-bottom:2px solid #e5e7eb;padding-bottom:8px}.info-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e5e7eb}.info-row:last-child{border-bottom:none}.info-row .label{font-weight:500;color:#6b7280;font-size:14px}.info-row .value{color:#111827;font-size:14px;text-align:right;max-width:60%;word-break:break-word}.summary-card{background:linear-gradient(135deg,#4b5563,#2f3237);border-radius:12px;padding:24px;color:#fff}.summary-card h3{margin:0 0 20px;font-size:18px;font-weight:600}.summary-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.stat{background:#ffffff26;border-radius:8px;padding:16px;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.stat-value{font-size:28px;font-weight:700;margin-bottom:4px}.stat-label{font-size:13px;opacity:.9}.stat.success{background:#10b98133}.stat.danger{background:#ef444433}.stat.warning{background:#f59e0b33}.stat.info{background:#3b82f633}.attendance-tab h3{margin:0 0 16px;font-size:18px;color:#111827}.attendance-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.month-selector{display:flex;align-items:center;gap:12px}.month-nav{background:#f3f4f6;border:1px solid #d1d5db;width:32px;height:32px;border-radius:6px;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .2s}.month-nav:hover{background:#e5e7eb}.month-display{font-weight:600;color:#111827;min-width:150px;text-align:center}.attendance-calendar{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:16px;margin-bottom:20px}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.day-header{text-align:center;font-weight:600;color:#6b7280;font-size:12px;padding:8px;text-transform:uppercase}.day-cell{aspect-ratio:1;border:2px solid #e5e7eb;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px;background:#f9fafb;transition:all .2s}.day-cell.present{background:#d1fae5;border-color:#10b981}.day-cell.absent{background:#fee2e2;border-color:#ef4444}.day-cell.late{background:#fef3c7;border-color:#f59e0b}.day-cell.excused{background:#e5e7eb;border-color:#3b82f6}.day-number{font-weight:600;color:#111827}.day-status{font-size:10px;font-weight:600;margin-top:2px;color:#374151}.attendance-legend{display:flex;gap:20px;justify-content:center;padding:16px;background:#f9fafb;border-radius:8px;margin-bottom:20px}.legend-item{display:flex;align-items:center;gap:8px;font-size:13px;color:#374151}.legend-color{width:20px;height:20px;border-radius:4px;border:2px solid}.legend-color.present{background:#d1fae5;border-color:#10b981}.legend-color.absent{background:#fee2e2;border-color:#ef4444}.legend-color.late{background:#fef3c7;border-color:#f59e0b}.legend-color.excused{background:#e5e7eb;border-color:#3b82f6}.monthly-summary{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:20px}.monthly-summary h4{margin:0 0 16px;font-size:16px;color:#111827}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}.summary-item{display:flex;flex-direction:column;gap:4px}.summary-label{font-size:13px;color:#6b7280}.summary-value{font-size:20px;font-weight:700;color:#111827}.summary-value.success{color:#10b981}.summary-value.danger{color:#ef4444}.summary-value.warning{color:#f59e0b}.no-data{text-align:center;padding:40px;color:#6b7280}.progress-tab h3{margin:0 0 20px;font-size:18px;color:#111827}.subjects-list{display:flex;flex-direction:column;gap:20px}.subject-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:20px}.subject-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding:.5rem;border-radius:8px;transition:background .2s}.subject-header:hover{background:#00000005}.subject-info{display:flex;align-items:center;gap:12px;flex:1}.subject-header h4{margin:0;font-size:16px;color:#111827;display:flex;align-items:center;gap:8px}.expand-icon{color:#94a3b8;font-size:.75rem;display:inline-block}.subject-progress{display:flex;align-items:center;gap:12px;min-width:120px}.progress-badge{background:#4f46e5;color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.subject-desc{color:#6b7280;font-size:14px;margin:0 0 12px}.progress-bar{height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden;margin-bottom:16px}.progress-fill{height:100%;background:linear-gradient(90deg,#4f46e5,#7c3aed);transition:width .3s ease}.topics-list{display:flex;flex-direction:column;gap:12px}.topic-item{background:#fff;border:1px solid #e5e7eb;border-radius:6px;padding:12px;border-left:3px solid #cbd5e1;display:flex;flex-direction:column}.topic-item.completed{background:#f0fdf4;border-left-color:#16a34a}.topic-item.in_progress{background:#fffbeb;border-left-color:#f59e0b}.topic-item.not_started{background:#fff;border-left-color:#cbd5e1}.topic-header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding:.5rem;border-radius:6px;transition:background .2s;width:100%}.topic-header-row:hover{background:#00000005}.expand-icon-small{display:inline-block;margin-right:.5rem;color:#94a3b8;font-size:.7rem}.topic-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.topic-name{font-size:14px;color:#374151;font-weight:500}.topic-details{margin-top:1rem;padding-top:1rem;border-top:1px solid #e2e8f0}.skills-title{margin:0 0 .75rem;font-size:.85rem;color:#64748b;font-weight:600}.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem;margin-bottom:.75rem}.skill-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#fff;border-radius:6px;font-size:.85rem}.skill-icon{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;flex-shrink:0}.skill-item.skill-positive .skill-icon{background:#dcfce7;color:#16a34a}.skill-item.skill-negative .skill-icon{background:#fef2f2;color:#dc2626}.skill-item.skill-neutral .skill-icon{background:#f1f5f9;color:#64748b}.skill-label{color:#475569;font-size:.85rem}.topic-remarks{margin-top:.75rem;padding:.75rem;background:#f8fafc;border-radius:6px;font-size:.85rem;color:#475569;line-height:1.5;border-left:3px solid #4f46e5}.topic-remarks strong{color:#1a1a2e;display:block;margin-bottom:.25rem}.topic-not-covered{margin-top:1rem;padding:1.5rem;background:#f8fafc;border-radius:8px;text-align:center;border:2px dashed #cbd5e1}.topic-not-covered p{margin:0;color:#64748b;font-size:.9rem;font-weight:500}.topic-scores{display:flex;gap:12px;flex-wrap:wrap}.score-item{font-size:12px;color:#6b7280;background:#f3f4f6;padding:4px 8px;border-radius:4px}.badge{padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600;display:inline-block}.badge-success{background:#d1fae5;color:#065f46}.badge-danger{background:#fee2e2;color:#991b1b}.badge-warning{background:#fef3c7;color:#92400e}.badge-info{background:#e5e7eb;color:#1e40af}.badge-secondary{background:#f3f4f6;color:#374151}.remarks-text{margin:0;padding:12px;background:#fff;border-radius:6px;color:#374151;font-size:14px;line-height:1.6;white-space:pre-wrap;word-break:break-word}@media(max-width:768px){.student-profile{padding:12px}.profile-header{flex-direction:column;align-items:flex-start;gap:12px}.profile-title h2{font-size:20px}.student-meta{font-size:13px}.info-grid{grid-template-columns:1fr}.summary-stats{grid-template-columns:repeat(2,1fr)}.calendar-grid{gap:4px}.day-cell{font-size:12px}.day-status{font-size:9px}.attendance-legend{flex-wrap:wrap;gap:12px}.summary-grid{grid-template-columns:1fr}.profile-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}.profile-tabs .tab{white-space:nowrap;padding:10px 16px;font-size:13px}.info-row{flex-direction:column;gap:4px}.info-row .value{text-align:left;max-width:100%}.info-card{padding:16px}.info-card h3{font-size:15px}.profile-content{padding:16px}.attendance-header{flex-direction:column;gap:12px;align-items:flex-start}.month-selector{width:100%;justify-content:center}.subject-card{padding:16px}.subject-header{flex-direction:column;align-items:flex-start;gap:8px}.subject-info{width:100%;flex-direction:column;align-items:flex-start}.subject-progress{width:100%}.topic-scores{flex-direction:column;gap:8px}.skills-grid{grid-template-columns:1fr}.skill-item{font-size:.8rem}}.progress-page{max-width:1400px}.progress-layout{display:grid;grid-template-columns:320px 1fr;gap:1.5rem;margin-top:1.5rem;height:calc(100vh - 200px)}.student-panel{background:#fff;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a;display:flex;flex-direction:column;overflow:hidden;max-height:100%}.search-box{padding:.75rem 1rem;border-bottom:2px solid #e2e8f0;flex-shrink:0;height:80px;min-height:80px;max-height:80px;display:flex;align-items:center}.search-box input{width:100%;padding:.875rem 1rem;border:2px solid #e2e8f0;border-radius:10px;font-size:.95rem;transition:all .2s}.search-box input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #667eea1a}.student-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem;min-height:0;margin:0}.student-item{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:.875rem!important;padding:.875rem!important;border-radius:12px!important;cursor:pointer!important;transition:all .2s!important;margin:.5rem 0 0!important;text-align:left!important}.student-item:first-child{margin-top:.5rem!important}.student-item:hover{background:#f8fafc!important}.student-item.active{background:linear-gradient(135deg,#4b5563,#1f2937)!important;color:#fff!important}.student-item.active .school{color:#fffc!important}.student-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;flex-shrink:0}.student-item.active .student-avatar{background:#fff3!important}.student-avatar.large{width:56px;height:56px;font-size:1.1rem}.student-info{display:flex!important;flex-direction:column!important;text-align:left!important;align-items:flex-start!important;justify-content:flex-start!important;flex:1!important}.student-info .name{font-weight:600!important;font-size:.95rem!important;text-align:left!important}.student-info .school{font-size:.8rem!important;color:#64748b!important;text-align:left!important}.loading-text,.empty-text{text-align:center;color:#94a3b8;padding:1rem;margin:0}.progress-panel{background:#fff;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a;padding:1.5rem;overflow-y:auto}.no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#64748b}.no-selection .icon{font-size:3rem;margin-bottom:1rem}.selected-student-header{display:flex;align-items:center;gap:1rem;padding-bottom:1.25rem;margin-bottom:1.25rem;border-bottom:2px solid #e2e8f0}.selected-student-header h3{margin:0;color:#1a1a2e}.selected-student-header p{margin:0;color:#64748b;font-size:.9rem}.curriculum-assignment{background:linear-gradient(135deg,#ede9fe,#ddd6fe);border-radius:12px;padding:1rem 1.25rem;margin-bottom:1.25rem;border:2px solid #a78bfa}.curriculum-assignment>label{display:block;font-size:.75rem;color:#6d28d9;margin-bottom:.5rem;text-transform:uppercase;font-weight:700;letter-spacing:.5px}.assignment-row{display:flex;align-items:center;gap:.75rem}.assignment-row select{flex:1;padding:.75rem 1rem;border:2px solid #a78bfa;border-radius:10px;font-size:.95rem;background:#fff;font-weight:500}.assignment-row select:focus{outline:none;border-color:#7c3aed;box-shadow:0 0 0 3px #7c3aed33}.saving-indicator{color:#7c3aed;font-size:.85rem;font-weight:500}.curriculum-readonly{padding:.5rem .75rem;background:#f1f5f9;border-radius:6px;color:#475569;font-weight:500}.no-curriculum-hint{background:#fef3c7;border:2px solid #f59e0b;border-radius:12px;padding:1.5rem;text-align:center;margin-top:1rem}.no-curriculum-hint p{color:#92400e;margin:0;font-weight:500}.curriculum-selectors{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:1.25rem;padding:1rem;background:#f8fafc;border-radius:12px}.selector-group label{display:block;font-size:.75rem;color:#64748b;margin-bottom:.35rem;text-transform:uppercase;font-weight:600;letter-spacing:.5px}.selector-group select{width:100%;padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:10px;font-size:.95rem;background:#fff;cursor:pointer}.selector-group select:focus{outline:none;border-color:#4b5563}.selector-group select:disabled{background:#f1f5f9;cursor:not-allowed}.progress-form{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.status-selector{margin-bottom:1.5rem}.status-selector>label{display:block;font-weight:600;color:#1a1a2e;margin-bottom:.75rem}.status-buttons{display:flex;gap:.75rem}.status-btn{flex:1;padding:.875rem 1rem;border:2px solid #e2e8f0;border-radius:10px;background:#fff;cursor:pointer;font-weight:600;font-size:.9rem;transition:all .2s}.status-btn:hover{background:#f8fafc}.status-btn.active.not_started{background:#f1f5f9;border-color:#64748b;color:#475569}.status-btn.active.in_progress{background:linear-gradient(135deg,#fef3c7,#fde68a);border-color:#f59e0b;color:#92400e}.status-btn.active.completed{background:linear-gradient(135deg,#d1fae5,#a7f3d0);border-color:#10b981;color:#065f46}.skills-section{background:#f8fafc;border-radius:12px;padding:1.25rem;margin-bottom:1.5rem}.skills-section h4{margin:0 0 .25rem;color:#1a1a2e}.skills-hint{color:#64748b;font-size:.85rem;margin-bottom:1rem}.skill-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:1rem;padding:.75rem 0;border-bottom:1px solid #e2e8f0}.skill-row:last-child{border-bottom:none}.skill-row label{font-weight:500;color:#374151;font-size:.95rem}.skill-slider{display:flex;gap:.25rem;background:#fff;padding:.25rem;border-radius:8px;border:2px solid #e2e8f0}.skill-btn{width:40px;height:36px;border:none;border-radius:6px;cursor:pointer;font-size:1.25rem;font-weight:700;background:transparent;color:#94a3b8;transition:all .15s}.skill-btn:hover{background:#f1f5f9}.skill-btn.negative.active{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.skill-btn.neutral.active{background:linear-gradient(135deg,#64748b,#475569);color:#fff}.skill-btn.positive.active{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.skill-value{min-width:70px;text-align:center;font-size:.8rem;font-weight:600;padding:.35rem .5rem;border-radius:6px}.skill-value.negative{background:#fee2e2;color:#991b1b}.skill-value.neutral{background:#f1f5f9;color:#475569}.skill-value.positive{background:#d1fae5;color:#065f46}.remarks-section{margin-bottom:1.5rem}.remarks-section label{display:block;font-weight:600;color:#1a1a2e;margin-bottom:.5rem}.remarks-section textarea{width:100%;padding:.875rem 1rem;border:2px solid #e2e8f0;border-radius:10px;font-size:.95rem;resize:vertical;font-family:inherit}.remarks-section textarea:focus{outline:none;border-color:#4b5563}.save-btn{width:100%}.select-topic-hint,.loading-progress{text-align:center;color:#64748b;padding:3rem;background:#f8fafc;border-radius:12px;margin-top:1rem}@media(max-width:900px){.progress-layout{grid-template-columns:1fr;height:auto}.student-panel{max-height:300px}.curriculum-selectors{grid-template-columns:1fr}.progress-page{padding:12px}.page-header{flex-direction:column;align-items:stretch;gap:12px}.student-selector,.curriculum-selector{width:100%}.score-inputs{grid-template-columns:1fr}.form-actions{flex-direction:column}.form-actions button{width:100%}.topic-item{padding:12px}.topic-header{flex-direction:column;align-items:flex-start;gap:8px}.topic-scores{width:100%;justify-content:flex-start;flex-wrap:wrap}.subject-card{padding:16px}.subject-header{flex-direction:column;align-items:flex-start;gap:8px}.progress-content{padding:16px}.skill-row{grid-template-columns:1fr;gap:8px;padding:12px 0}.skill-row label{font-size:14px;margin-bottom:4px}.skill-slider{width:100%;justify-content:space-between;overflow-x:auto;-webkit-overflow-scrolling:touch}.skill-btn{width:36px;height:32px;font-size:1rem;flex-shrink:0}.skill-value{min-width:60px;font-size:.75rem}.status-buttons{flex-direction:column}.status-btn{width:100%}.assignment-row{flex-direction:column;align-items:stretch}.assignment-row select{width:100%}.student-item{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:.875rem!important}.student-info{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;text-align:left!important;flex:1!important}.student-info .name,.student-info .school{text-align:left!important}}.fees-page{padding:24px;max-width:1600px;margin:0 auto;background:#f8fafc;min-height:100vh}.page-header{margin-bottom:24px}.page-header h2{font-size:28px;font-weight:700;color:#111827;margin:0 0 8px}.subtitle{color:#6b7280;font-size:14px}.fees-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.stat-card{background:#fff;border-radius:16px;padding:24px;display:flex;align-items:center;gap:16px;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;transition:transform .2s,box-shadow .2s}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.stat-card.success{border-left:4px solid #10b981}.stat-card.warning{border-left:4px solid #f59e0b}.stat-card.info{border-left:4px solid #e75cf6}.stat-icon{width:56px;height:56px;border-radius:12px;background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;flex-shrink:0}.stat-card.success .stat-icon{background:linear-gradient(135deg,#10b981,#059669)}.stat-card.warning .stat-icon{background:linear-gradient(135deg,#f59e0b,#d97706)}.stat-card.info .stat-icon{background:linear-gradient(135deg,#ea7cf6,#df3df1)}.stat-content{flex:1}.stat-value{font-size:26px;font-weight:700;color:#111827;margin-bottom:4px}.stat-label{font-size:13px;color:#6b7280;font-weight:500}.fees-filters{background:#fff;border-radius:16px;padding:24px;margin-bottom:24px;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb}.search-box{position:relative;margin-bottom:16px}.search-input{width:100%;padding:14px 40px 14px 16px;border:2px solid #e5e7eb;border-radius:12px;font-size:15px;transition:all .2s}.search-input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #4b55631a}.clear-search{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:#e5e7eb;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:18px;color:#6b7280;display:flex;align-items:center;justify-content:center;transition:all .2s}.clear-search:hover{background:#d1d5db}.status-filters{display:flex;gap:12px;flex-wrap:wrap}.filter-btn{padding:8px 16px;border:2px solid #e5e7eb;border-radius:8px;background:#fff;cursor:pointer;font-weight:500;font-size:14px;transition:all .2s;color:#374151}.filter-btn:hover{background:#f9fafb}.filter-btn.active{background:#4b5563;border-color:#4b5563;color:#fff}.filter-btn.status-paid.active{background:#10b981;border-color:#10b981}.filter-btn.status-partial.active{background:#f59e0b;border-color:#f59e0b}.filter-btn.status-unpaid.active{background:#ef4444;border-color:#ef4444}.table-wrapper{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb}.fees-table{width:100%;border-collapse:separate;border-spacing:0}.fees-table thead{background:linear-gradient(to bottom,#f9fafb,#f3f4f6)}.fees-table th{padding:18px 16px;text-align:left;font-weight:600;color:#374151;font-size:13px;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid #e5e7eb;white-space:nowrap}.fees-table td{padding:20px 16px;color:#111827;font-size:14px;border-bottom:1px solid #f3f4f6;vertical-align:middle}.fees-table tbody tr:last-child td{border-bottom:none}.fees-row{transition:all .2s ease;border-left:3px solid transparent}.fees-row:hover{background:#f8fafc;border-left-color:#4b5563}.fees-row td:last-child{cursor:default!important}.fees-row.status-paid{background:#10b98108}.fees-row.status-paid:hover{background:#10b98114;border-left-color:#10b981}.fees-row.status-partial{background:#f59e0b08}.fees-row.status-partial:hover{background:#f59e0b14;border-left-color:#f59e0b}.fees-row.status-unpaid{background:#ef444408}.fees-row.status-unpaid:hover{background:#ef444414;border-left-color:#ef4444}.fees-row.status-installment-complete{background:#10b98108}.fees-row.status-installment-complete:hover{background:#10b98114;border-left-color:#10b981}.student-name-cell{display:flex;align-items:center;gap:12px}.student-name{font-weight:600;color:#111827;font-size:15px}.amount-cell{font-weight:600;font-size:15px;font-family:Courier New,monospace}.amount-cell.success{color:#10b981}.amount-cell.warning{color:#f59e0b}.status-badge{padding:8px 14px;border-radius:24px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;display:inline-block;border:2px solid}.status-badge.status-paid{background:#d1fae5;color:#065f46;border-color:#10b981}.status-badge.status-partial{background:#fef3c7;color:#92400e;border-color:#f59e0b}.status-badge.status-unpaid{background:#fee2e2;color:#991b1b;border-color:#ef4444}.discount-badge{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;display:inline-block}.installment-info{font-size:12px;color:#6b7280;margin-top:6px;font-weight:500;display:flex;align-items:center;gap:8px}.action-buttons{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.btn-sm{padding:10px 18px;font-size:13px;font-weight:600;border-radius:10px;transition:all .2s}.btn-sm.btn-primary{background:linear-gradient(135deg,#4b5563,#1f2937);background-size:100% 100%;color:#fff;border:none}.btn-sm.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4b556366}.btn-sm.btn-info{background:#4b5563;color:#fff;border:none}.btn-sm.btn-info:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4b556366}.discount-cell{font-size:13px}.discount-badge{background:#e5e7eb;color:#374151;padding:4px 10px;border-radius:12px;font-weight:600;font-size:12px;display:inline-block}.discount-notice{background:#fef3c7;border:2px solid #fbbf24;border-radius:8px;padding:16px;margin-bottom:20px}.discount-notice p{margin:8px 0;font-size:14px;color:#92400e}.discount-notice p:first-child{font-weight:600}.discount-section{background:#f9fafb;border:2px solid #d1d5db;border-radius:8px;padding:16px;margin-bottom:20px}.discount-section-header{margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #d1d5db}.discount-section-header h4{margin:0 0 4px;font-size:16px;color:#374151}.discount-section-header small{color:#6b7280;font-size:12px}.discount-preview{background:#f0fdf4;border:2px solid #86efac;border-radius:8px;padding:16px;margin-top:16px}.discount-preview p{margin:8px 0;font-size:14px;color:#374151}.payment-modal,.discount-modal{max-width:600px;width:90%}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e5e7eb}.modal-header h3{margin:0;font-size:20px;color:#111827}.close-btn{background:none;border:none;font-size:28px;color:#6b7280;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s;position:relative;z-index:10}.close-btn:hover{background:#f3f4f6;color:#111827}.modal-body{padding:24px}.student-info-box{background:#f9fafb;border-radius:8px;padding:16px;margin-bottom:24px;border-left:4px solid #4b5563}.student-info-box p{margin:8px 0;font-size:14px;color:#374151}.student-info-box strong{color:#111827;font-weight:600}.form-group{margin-bottom:24px}.form-group label{display:block;margin-bottom:10px;color:#1e293b;font-weight:600;font-size:14px;letter-spacing:.3px}.form-group .required{color:#ef4444;margin-left:2px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:14px 16px;border:2px solid #e2e8f0;border-radius:12px;font-size:15px;transition:all .3s;font-family:inherit;background:#fff}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 4px #4b55631a;background:#fafbff}.form-group textarea{resize:vertical;min-height:100px}.form-group input[type=number]::-webkit-inner-spin-button,.form-group input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.form-group input[type=number]{-moz-appearance:textfield;appearance:textfield}.amount-input-wrapper{display:flex;gap:10px;align-items:stretch}.amount-input-wrapper input{flex:1}.amount-input-wrapper input[type=number]::-webkit-inner-spin-button,.amount-input-wrapper input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.amount-input-wrapper input[type=number]{-moz-appearance:textfield;appearance:textfield}.pay-full-btn{padding:14px 20px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s;white-space:nowrap;flex-shrink:0;box-shadow:0 2px 8px #10b9814d}.pay-full-btn:hover{background:linear-gradient(135deg,#059669,#047857);transform:translateY(-2px);box-shadow:0 4px 15px #10b98166}.pay-full-btn:active{transform:translateY(0)}.modal-actions{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin-top:20px;padding-top:20px;border-top:2px solid #f1f5f9}.modal-actions .btn-secondary{padding:16px 32px;display:flex;align-items:center;justify-content:center}.modal-actions .btn-primary{margin-top:0}.fees-detail-page{padding:32px;max-width:1400px;margin:0 auto;background:#f8fafc;min-height:100vh}.fees-detail-page .page-header{display:flex;align-items:center;gap:20px;margin-bottom:32px;background:#fff;padding:24px 28px;border-radius:16px;box-shadow:0 2px 8px #0000000d}.fees-detail-page .page-header>div{flex:1}.fees-detail-page .page-header h2{font-size:28px;font-weight:700;color:#111827;margin:0 0 6px}.fees-detail-page .subtitle{color:#6b7280;font-size:15px;margin:0;font-weight:500}.back-btn{background:linear-gradient(135deg,#f3f4f6,#e5e7eb);border:2px solid #d1d5db;padding:10px 20px;border-radius:10px;cursor:pointer;font-size:14px;font-weight:600;color:#374151;transition:all .3s;display:flex;align-items:center;gap:8px}.back-btn:hover{background:linear-gradient(135deg,#e5e7eb,#d1d5db);transform:translate(-4px);box-shadow:0 4px 12px #0000001a}.fees-detail-content{display:flex;flex-direction:column;gap:28px}.fees-summary-card{background:#fff;border-radius:20px;padding:32px;box-shadow:0 4px 16px #00000014;border:1px solid #e5e7eb}.summary-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;padding-bottom:20px;border-bottom:2px solid #f1f5f9}.summary-header h3{margin:0;font-size:22px;font-weight:700;color:#111827}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;margin-bottom:28px}.summary-item{padding:24px;background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-radius:16px;border-left:5px solid #4b5563;transition:all .3s}.summary-item:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0000001a}.summary-item.success{border-left-color:#10b981;background:linear-gradient(135deg,#f0fdf4,#dcfce7)}.summary-item.warning{border-left-color:#f59e0b;background:linear-gradient(135deg,#fffbeb,#fef3c7)}.summary-label{font-size:12px;color:#6b7280;text-transform:uppercase;font-weight:700;letter-spacing:.8px;margin-bottom:10px}.summary-value{font-size:28px;font-weight:800;color:#111827;font-family:Courier New,monospace}.progress-bar-container{margin-top:24px;max-width:100%}.progress-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:14px;color:#374151;font-weight:600;flex-wrap:nowrap}.progress-label span:first-child{flex-shrink:0;margin-right:16px}.progress-label span:last-child{flex-shrink:0;margin-left:auto;font-size:16px;font-weight:700;color:#10b981}.progress-bar{height:16px;background:#e5e7eb;border-radius:10px;overflow:hidden;width:100%;box-shadow:inset 0 2px 4px #0000001a}.progress-fill{height:100%;background:linear-gradient(90deg,#10b981,#059669);transition:width .6s cubic-bezier(.16,1,.3,1);box-shadow:0 0 10px #10b98180}.current-curriculum-card{background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff;border-radius:16px;padding:24px 28px;box-shadow:0 8px 24px #4b556366;position:relative;overflow:hidden}.current-curriculum-card:before{content:"";position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:#ffffff1a;border-radius:50%}.current-curriculum-card h4{margin:0 0 8px;font-size:13px;opacity:.9;text-transform:uppercase;letter-spacing:1px;font-weight:600;position:relative;z-index:1}.current-curriculum-card p{margin:0;font-size:20px;font-weight:700;position:relative;z-index:1}.curriculum-breakdown-card{background:#fff;border-radius:20px;padding:32px;box-shadow:0 4px 16px #00000014;border:1px solid #e5e7eb}.curriculum-breakdown-card h3{margin:0 0 24px;font-size:22px;font-weight:700;color:#111827}.curriculum-breakdown-list{display:flex;flex-direction:column;gap:20px}.curriculum-breakdown-item{background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-radius:16px;padding:24px;border-left:5px solid #4b5563;transition:all .3s}.curriculum-breakdown-item:hover{transform:translate(4px);box-shadow:0 6px 20px #0000001a}.breakdown-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}.discount-info{background:linear-gradient(135deg,#e5e7eb,#d1d5db);border-radius:10px;padding:12px 16px;margin-bottom:16px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;border:2px solid #6b7280}.discount-label{font-size:13px;color:#374151;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.discount-value{font-size:15px;color:#374151;font-weight:800;background:#fff;padding:4px 12px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.discount-reason{width:100%;font-size:12px;color:#374151;font-style:italic;margin-top:6px;font-weight:500}.breakdown-curriculum-name{font-size:18px;font-weight:700;color:#111827;display:flex;align-items:center;gap:10px}.current-badge{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:4px 12px;border-radius:16px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 8px #10b9814d}.breakdown-amounts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}.breakdown-amount-item{display:flex;justify-content:space-between;padding:12px 16px;background:#fff;border-radius:10px;border:2px solid #e5e7eb;transition:all .3s}.breakdown-amount-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.breakdown-amount-item.success{background:linear-gradient(135deg,#d1fae5,#a7f3d0);border-color:#10b981}.breakdown-amount-item.warning{background:linear-gradient(135deg,#fef3c7,#fde68a);border-color:#f59e0b}.amount-label{font-size:12px;color:#6b7280;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.amount-value{font-size:16px;font-weight:800;color:#111827;font-family:Courier New,monospace}.transactions-card{background:#fff;border-radius:20px;padding:32px;box-shadow:0 4px 16px #00000014;border:1px solid #e5e7eb}.transactions-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:16px}.transactions-card h3{margin:0;font-size:22px;font-weight:700;color:#111827}.curriculum-filter{padding:10px 16px;border:2px solid #e5e7eb;border-radius:10px;font-size:14px;font-weight:600;background:#fff;cursor:pointer;transition:all .3s;color:#374151}.curriculum-filter:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 4px #4b55631a}.curriculum-filter:hover{border-color:#4b5563;background:#fafbff}.transactions-list{display:flex;flex-direction:column;gap:18px}.transaction-item{background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-radius:16px;padding:24px;border-left:5px solid #10b981;transition:all .3s}.transaction-item:hover{transform:translate(4px);box-shadow:0 6px 20px #0000001a}.transaction-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}.transaction-date{display:flex;align-items:center;gap:10px;font-weight:600;color:#374151;font-size:15px}.date-icon{font-size:18px}.transaction-amount{font-size:24px;font-weight:800;color:#10b981;font-family:Courier New,monospace}.transaction-details{display:flex;flex-direction:column;gap:10px}.detail-row{display:flex;gap:16px;font-size:14px;align-items:center}.detail-label{color:#6b7280;font-weight:600;min-width:140px;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.detail-value{color:#111827;font-weight:600;flex:1}.curriculum-tag{background:linear-gradient(135deg,#e5e7eb,#d1d5db);color:#374151;padding:4px 12px;border-radius:8px;font-size:13px;font-weight:700;border:2px solid #6b7280}.no-transactions{text-align:center;padding:60px 20px;color:#9ca3af}.no-transactions div:first-child{font-size:64px;margin-bottom:20px;opacity:.5}.no-transactions p{font-size:16px;font-weight:600;color:#6b7280}@media(max-width:768px){.fees-page{padding:16px}.fees-detail-page{padding:20px 16px}.fees-detail-page .page-header{flex-direction:column;align-items:flex-start;padding:20px;gap:16px}.fees-detail-page .page-header h2{font-size:24px}.back-btn{padding:8px 16px;font-size:13px}.fees-summary-card,.curriculum-breakdown-card,.transactions-card{padding:20px;border-radius:16px}.summary-header h3,.curriculum-breakdown-card h3,.transactions-card h3{font-size:18px}.summary-grid{grid-template-columns:1fr;gap:16px}.summary-item{padding:18px}.summary-value{font-size:24px}.current-curriculum-card{padding:20px}.current-curriculum-card p{font-size:18px}.breakdown-curriculum-name{font-size:16px}.transactions-header{flex-direction:column;align-items:flex-start;gap:12px}.curriculum-filter{width:100%}.transaction-header{flex-direction:column;align-items:flex-start;gap:10px}.transaction-amount{font-size:20px}.transaction-date{font-size:13px}.detail-label{min-width:auto;font-size:11px}.detail-value{font-size:13px}.no-transactions{padding:40px 20px}.no-transactions div:first-child{font-size:48px}.fees-stats{grid-template-columns:1fr}.stat-card{padding:16px}.stat-value{font-size:20px}.status-filters{flex-direction:column}.filter-btn{width:100%}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -16px;padding:0 16px}.fees-table{min-width:800px}.fees-table th,.fees-table td{padding:12px 8px;font-size:12px}.action-buttons{flex-direction:column}.action-buttons button{width:100%}.payment-modal{width:95%;max-height:90vh;overflow-y:auto}.modal-body{padding:16px}.modal-actions{flex-direction:column}.modal-actions button{width:100%}.summary-grid{grid-template-columns:1fr}.summary-value{font-size:20px}.transaction-header{flex-direction:column;align-items:flex-start;gap:8px}.detail-row{flex-direction:column;gap:4px}.detail-label{min-width:auto}.amount-input-wrapper{flex-direction:column}.pay-full-btn{width:100%}.discount-preview p,.student-info-box p,.form-group label{font-size:13px}.form-group input,.form-group select,.form-group textarea{font-size:14px}.fees-row:hover{transform:none;box-shadow:none}.discount-badge{font-size:11px;padding:3px 8px}.status-badge{font-size:11px;padding:4px 10px}.modal-header h3{font-size:18px}.discount-notice p{font-size:13px}.discount-section-header h4{font-size:15px}.discount-modal{width:95%;max-height:90vh;overflow-y:auto}.stat-icon{width:40px;height:40px;font-size:20px}.stat-label{font-size:13px}.breakdown-amounts{grid-template-columns:1fr}.breakdown-curriculum-name{font-size:15px}.current-badge{font-size:10px}.transaction-amount{font-size:18px}.transaction-date,.detail-row{font-size:13px}.discount-info{flex-direction:column;align-items:flex-start}.discount-label,.discount-value{font-size:12px}}.discount-modal .radio-group,.payment-modal .radio-group{display:flex;flex-direction:column;gap:14px;margin-top:12px}.discount-modal .radio-label,.payment-modal .radio-label{display:flex;align-items:center;gap:14px;padding:16px 20px;border:2px solid #e2e8f0;border-radius:14px;cursor:pointer;transition:all .3s cubic-bezier(.16,1,.3,1);background:#fff;position:relative}.discount-modal .radio-label:before,.payment-modal .radio-label:before{content:"";position:absolute;inset:0;border-radius:14px;padding:2px;background:linear-gradient(135deg,#4b5563,#1f2937);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:0;transition:opacity .3s}.discount-modal .radio-label:hover,.payment-modal .radio-label:hover{border-color:#4b5563;background:#fafbff;transform:translate(4px)}.discount-modal .radio-label input[type=radio],.payment-modal .radio-label input[type=radio]{width:22px;height:22px;cursor:pointer;accent-color:#4b5563;flex-shrink:0;margin:0}.discount-modal .radio-label input[type=radio]:checked,.payment-modal .radio-label input[type=radio]:checked{accent-color:#4b5563}.discount-modal .radio-label:has(input[type=radio]:checked),.payment-modal .radio-label:has(input[type=radio]:checked){border-color:#4b5563;background:linear-gradient(135deg,#fafbff,#f0f4ff);box-shadow:0 4px 15px #4b556326}.discount-modal .radio-label:has(input[type=radio]:checked):before,.payment-modal .radio-label:has(input[type=radio]:checked):before{opacity:1}.discount-modal .radio-label span,.payment-modal .radio-label span{font-size:15px;color:#475569;transition:all .3s;font-weight:500}.discount-modal .radio-label:has(input[type=radio]:checked) span,.payment-modal .radio-label:has(input[type=radio]:checked) span{font-weight:700;color:#4b5563}.installment-badge{display:inline-block;padding:6px 12px;border-radius:16px;font-size:11px;font-weight:700;margin-left:8px;text-transform:uppercase;letter-spacing:.3px;border:2px solid}.installment-badge.due{background:#fee2e2;color:#dc2626;border-color:#ef4444;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.installment-badge.current,.installment-badge.complete{background:#dcfce7;color:#16a34a;border-color:#10b981}.text-right{text-align:right!important}.text-center{text-align:center!important}.student-info-compact{display:flex;flex-direction:column;gap:4px}.student-name-main{font-size:15px;font-weight:600;color:#111827}.student-meta{display:flex;gap:8px;align-items:center}.discount-tag{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:3px 8px;border-radius:12px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}.program-info{display:flex;flex-direction:column;gap:4px}.program-name{font-size:14px;font-weight:500;color:#374151}.program-meta{font-size:12px;color:#9ca3af}.amount-due-cell{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.amount-main{font-size:17px;font-weight:700;color:#ef4444}.amount-sub{font-size:12px;color:#10b981;font-weight:500}.status-cell{display:flex;flex-direction:column;align-items:center;gap:6px}.status-badge-new{padding:6px 16px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;display:inline-block}.status-badge-new.status-paid{background:#d1fae5;color:#065f46}.status-badge-new.status-partial{background:#fef3c7;color:#92400e}.status-badge-new.status-unpaid{background:#fee2e2;color:#991b1b}.status-badge-new.status-installment-complete{background:#d1fae5;color:#065f46}.installment-compact{font-size:11px;margin-top:4px}.due-indicator{color:#dc2626;font-weight:700;display:flex;align-items:center;justify-content:center;gap:4px}.installment-progress{color:#6b7280;font-weight:500}.btn-action{padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;border:none;cursor:pointer;transition:all .2s;white-space:nowrap}.btn-normal{background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff}.btn-normal:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4b556366}.btn-urgent{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;animation:urgentPulse 2s infinite}.btn-urgent:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ef444480}@keyframes urgentPulse{0%,to{box-shadow:0 0 #ef4444b3}50%{box-shadow:0 0 0 8px #ef444400}}@media(max-width:768px){.fees-table th,.fees-table td{padding:14px 10px;font-size:13px}.student-name-main{font-size:14px}.amount-main{font-size:15px}.btn-action{padding:8px 14px;font-size:12px}}.payment-type-badge{margin:12px 0}.badge-installment,.badge-full{display:inline-block;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600}.badge-installment{background:linear-gradient(135deg,#4b5563,#1f2937);color:#fff}.badge-full{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.installment-tracker{background:#f8fafc;border:2px solid #e2e8f0;border-radius:12px;padding:20px;margin:16px 0}.tracker-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.tracker-header h4{margin:0;font-size:16px;color:#1e293b}.installment-count{font-size:13px;font-weight:600;color:#374151;background:#e5e7eb;padding:4px 12px;border-radius:12px}.installment-progress-bar{display:flex;gap:8px;margin:20px 0;flex-wrap:wrap}.installment-block{flex:1;min-width:40px;height:50px;display:flex;align-items:center;justify-content:center;border-radius:8px;font-weight:700;font-size:14px;transition:all .3s;border:2px solid}.installment-block.completed{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-color:#10b981;box-shadow:0 2px 8px #10b9814d}.installment-block.current{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border-color:#f59e0b;box-shadow:0 2px 8px #f59e0b4d;animation:currentPulse 2s infinite}.installment-block.pending{background:#fff;color:#94a3b8;border-color:#e2e8f0}@keyframes currentPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.current-installment-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:16px}.detail-box{background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:12px;text-align:center}.detail-box.success{border-color:#10b981;background:#f0fdf4}.detail-box.warning{border-color:#f59e0b;background:#fffbeb}.detail-box .detail-label{font-size:11px;color:#64748b;text-transform:uppercase;font-weight:600;letter-spacing:.5px;margin-bottom:6px}.detail-box .detail-value{font-size:18px;font-weight:700;color:#1e293b}.installment-status-message{margin-top:16px;padding:12px 16px;border-radius:8px;font-size:14px;font-weight:600;text-align:center}.installment-status-message.success{background:#d1fae5;color:#065f46;border:2px solid #10b981}.modal-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fees-page .modal{background:#fff;border-radius:24px;box-shadow:0 25px 80px #0006;max-height:90vh;overflow-y:auto;animation:slideUp .4s cubic-bezier(.16,1,.3,1);position:relative;padding:0}@keyframes slideUp{0%{transform:translateY(40px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.discount-modal{max-width:650px;width:95%}.discount-modal .modal-header{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;border-radius:24px 24px 0 0;padding:32px 36px;position:relative;overflow:hidden}.discount-modal .modal-header:before{content:"";position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:#ffffff1a;border-radius:50%}.discount-modal .modal-header h3{color:#fff;font-size:24px;font-weight:700;margin:0;position:relative;z-index:1}.discount-modal .close-btn{color:#fff;background:#fff3;width:40px;height:40px;border-radius:12px;transition:all .2s;position:relative;z-index:10}.discount-modal .close-btn:hover{background:#ffffff4d;color:#fff;transform:rotate(90deg)}.discount-modal .modal-body{padding:24px 32px 32px}.discount-modal .student-info-box{background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-left:5px solid #4b5563;border-radius:16px;padding:24px;margin-bottom:28px;box-shadow:0 2px 8px #4b55631a}.discount-modal .student-info-box p{margin:10px 0;font-size:15px;color:#1e293b;line-height:1.6}.discount-modal .student-info-box strong{color:#0f172a;font-weight:700}.discount-notice{background:linear-gradient(135deg,#fffbeb,#fef3c7);border:2px solid #f59e0b;border-radius:16px;padding:24px;margin-bottom:28px;position:relative;box-shadow:0 2px 8px #f59e0b26}.discount-notice p{margin:12px 0;font-size:14px;color:#78350f;line-height:1.7}.discount-notice p:first-child{font-weight:700;font-size:15px;margin-top:0}.discount-preview{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:2px solid #10b981;border-radius:16px;padding:24px;margin-top:24px;box-shadow:0 2px 8px #10b98126;position:relative}.discount-preview p{margin:12px 0;font-size:14px;color:#065f46;line-height:1.6}.discount-preview p:first-child{font-weight:700;font-size:15px;margin-top:0}.discount-preview p strong{color:#064e3b;font-weight:700}.payment-modal{max-width:600px;width:95%}.payment-modal .modal-header{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;border-radius:24px 24px 0 0;padding:32px 36px;position:relative;overflow:hidden}.payment-modal .modal-header:before{content:"";position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:#ffffff1a;border-radius:50%}.payment-modal .modal-header h3{color:#fff;font-size:24px;font-weight:700;margin:0;position:relative;z-index:1}.payment-modal .close-btn{color:#fff;background:#fff3;width:40px;height:40px;border-radius:12px;transition:all .2s;position:relative;z-index:10}.payment-modal .close-btn:hover{background:#ffffff4d;color:#fff;transform:rotate(90deg)}.payment-modal .modal-body{padding:24px 32px 32px}.payment-modal .student-info-box{background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-left:5px solid #4b5563;border-radius:16px;padding:24px;margin-bottom:28px;box-shadow:0 2px 8px #4b55631a}.payment-modal .student-info-box p{margin:10px 0;font-size:15px;color:#1e293b;line-height:1.6}.payment-modal .student-info-box strong{color:#0f172a;font-weight:700}.btn-primary,.btn-secondary{padding:14px 32px;border-radius:12px;font-size:15px;font-weight:600;border:none;cursor:pointer;transition:all .3s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.btn-primary:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#fff3;transform:translate(-50%,-50%);transition:width .6s,height .6s;z-index:0;pointer-events:none}.btn-primary:hover:before{width:1000px;height:1000px}.btn-primary{background:linear-gradient(135deg,#4b5563,#2f3237);background-size:100% 100%;color:#fff;box-shadow:0 4px 15px #4b556366;position:relative;overflow:hidden}.btn-primary>*{position:relative;z-index:1}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 25px #4b556380}.btn-primary:active{transform:translateY(-1px)}.btn-secondary{background:#fff;color:#374151;border:2px solid #e5e7eb;box-shadow:0 2px 8px #0000000d}.btn-secondary:hover{background:#f9fafb;border-color:#d1d5db;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.btn-secondary:active{transform:translateY(0)}@media(max-width:768px){.discount-modal,.payment-modal{width:100%;max-width:100%;margin:0;border-radius:20px;max-height:95vh}.discount-modal .modal-header,.payment-modal .modal-header{padding:24px 20px;border-radius:20px 20px 0 0}.discount-modal .modal-header h3,.payment-modal .modal-header h3{font-size:22px}.discount-modal .modal-body,.payment-modal .modal-body{padding:24px 20px}.discount-modal .student-info-box,.payment-modal .student-info-box{padding:18px;margin-bottom:20px}.discount-modal .student-info-box p,.payment-modal .student-info-box p{font-size:14px}.discount-notice{padding:18px;margin-bottom:20px}.discount-notice p{font-size:13px}.discount-preview{padding:18px;margin-top:20px}.discount-preview p{font-size:13px}.form-group{margin-bottom:20px}.form-group label{font-size:13px;margin-bottom:8px}.form-group input,.form-group select,.form-group textarea{padding:12px 14px;font-size:14px}.discount-modal .radio-label,.payment-modal .radio-label{padding:14px 16px;gap:12px}.discount-modal .radio-label:hover,.payment-modal .radio-label:hover{transform:none}.discount-modal .radio-label span,.payment-modal .radio-label span{font-size:14px}.amount-input-wrapper{flex-direction:column;gap:10px}.pay-full-btn{width:100%;padding:12px 20px}.modal-actions{flex-direction:column-reverse;gap:10px;margin-top:24px;padding-top:20px}.btn-primary,.btn-secondary{width:100%;padding:12px 24px;font-size:14px}.discount-modal .close-btn,.payment-modal .close-btn{width:36px;height:36px;font-size:24px}.installment-tracker{padding:16px}.tracker-header{flex-direction:column;align-items:flex-start;gap:10px}.tracker-header h4{font-size:15px}.installment-count{font-size:12px}.installment-progress-bar{gap:6px;flex-wrap:wrap}.installment-block{min-width:40px;max-width:60px;flex:1 1 calc(25% - 6px);height:50px;font-size:13px}.current-installment-details{grid-template-columns:1fr;gap:10px}.detail-box{padding:12px}.detail-box .detail-label{font-size:11px;margin-bottom:6px}.detail-box .detail-value{font-size:16px}.installment-status-message{font-size:13px;padding:10px 14px}.payment-type-badge{margin:10px 0}.badge-installment,.badge-full{font-size:11px;padding:5px 12px}.breakdown-amounts{grid-template-columns:1fr;gap:10px}.breakdown-amount-item{padding:10px 14px}.amount-label{font-size:11px}.amount-value{font-size:14px}.curriculum-breakdown-item{padding:18px}.breakdown-curriculum-name{font-size:15px}.current-badge{font-size:10px;padding:3px 10px}.discount-info{padding:10px 14px;gap:8px}.discount-label{font-size:12px}.discount-value{font-size:13px;padding:3px 10px}.discount-reason{font-size:11px}}.action-buttons{display:flex;flex-direction:column;gap:8px;align-items:flex-end}.btn-action.btn-secondary{background:linear-gradient(135deg,#6b7280,#4b5563);color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap;min-width:100px}.btn-action.btn-secondary:hover:not(:disabled){background:linear-gradient(135deg,#4b5563,#374151);transform:translateY(-1px);box-shadow:0 2px 8px #6b72804d}.btn-action.btn-secondary:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}.btn-notification{display:none}@media(max-width:768px){.action-buttons{flex-direction:row;gap:4px}.btn-action.btn-secondary{font-size:12px;padding:6px 12px;min-width:90px}}.settings-page{padding:20px;max-width:900px}.settings-page .page-header h2{margin-bottom:8px}.settings-note{color:#666;font-size:14px;margin-bottom:20px}.settings-actions{display:flex;gap:12px;margin-bottom:24px}.settings-actions .btn-primary{background:#4f46e5;color:#fff;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;font-weight:500}.settings-actions .btn-primary:hover{background:#4338ca}.settings-actions .btn-primary:disabled{background:#9ca3af;cursor:not-allowed}.settings-actions .btn-secondary{background:#f3f4f6;color:#374151;border:1px solid #d1d5db;padding:10px 20px;border-radius:6px;cursor:pointer}.settings-actions .btn-secondary:hover{background:#e5e7eb}.message{padding:12px 16px;border-radius:6px;margin-bottom:20px}.message.success{background:#d1fae5;color:#065f46;border:1px solid #6ee7b7}.message.error{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}.settings-groups{display:flex;flex-direction:column;gap:24px}.settings-group{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:20px}.settings-group h3{margin:0 0 4px;font-size:16px;color:#111827}.group-description{color:#6b7280;font-size:13px;margin:0 0 16px}.settings-list{display:flex;flex-direction:column;gap:12px}.setting-item{padding:12px;background:#f9fafb;border-radius:6px}.toggle-label{display:flex;align-items:center;gap:16px;cursor:pointer}.setting-name{flex:1;font-size:14px;color:#374151}.toggle-switch{position:relative;width:48px;height:26px}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#d1d5db;transition:.3s;border-radius:26px}.slider:before{position:absolute;content:"";height:20px;width:20px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}.toggle-switch input:checked+.slider{background-color:#4f46e5}.toggle-switch input:checked+.slider:before{transform:translate(22px)}.status{font-size:12px;font-weight:500;padding:4px 8px;border-radius:4px;min-width:60px;text-align:center}.status.on{background:#d1fae5;color:#065f46}.status.off{background:#fee2e2;color:#991b1b}@media(max-width:768px){.settings-page{padding:16px}.settings-page .page-header h2{font-size:20px}.settings-note{font-size:13px}.settings-actions{flex-direction:column}.settings-actions button{width:100%}.settings-group{padding:16px}.settings-group h3{font-size:15px}.group-description{font-size:12px}.setting-item{padding:10px}.toggle-label{gap:12px}.setting-name{font-size:13px}.toggle-switch{width:44px;height:24px}.slider:before{height:18px;width:18px}.toggle-switch input:checked+.slider:before{transform:translate(20px)}}.access-denied{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center;padding:2rem}.access-denied-icon{font-size:4rem;margin-bottom:1.5rem;opacity:.7}.access-denied h2{font-size:1.75rem;color:#1a1a2e;margin:0 0 1rem;font-weight:700}.access-denied p{font-size:1rem;color:#64748b;margin:0 0 2rem;max-width:400px}.access-denied .btn-secondary{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;border:none;padding:.75rem 2rem;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 12px #667eea4d}.access-denied .btn-secondary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.access-denied .btn-secondary:active{transform:translateY(0)}.help-page{padding:2rem;max-width:1200px;margin:0 auto}.help-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.help-header h1{font-size:2rem;font-weight:700;color:#1e293b;margin:0}.help-actions{display:flex;gap:.75rem;align-items:center}.help-intro{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;padding:2rem;border-radius:16px;margin-bottom:2rem;box-shadow:0 4px 20px #667eea4d}.help-intro h2{margin:0 0 1rem;font-size:1.5rem}.help-intro p{margin:0;line-height:1.6;font-size:1rem;opacity:.95}.help-sections{display:flex;flex-direction:column;gap:2rem}.help-section{background:#fff;border-radius:16px;padding:2rem;box-shadow:0 4px 20px #0000000f;border:1px solid #e5e7eb}.help-section h2{font-size:1.75rem;font-weight:700;color:#1e293b;margin:0 0 1.5rem;padding-bottom:1rem;border-bottom:2px solid #4b5563}.help-content{display:flex;flex-direction:column;gap:1.5rem}.help-item{padding:1.25rem;background:#f8f9ff;border-radius:12px;border-left:4px solid #4b5563}.help-item h3{font-size:1.25rem;font-weight:600;color:#1e293b;margin:0 0 .75rem}.help-item p{margin:0;line-height:1.6;color:#475569}.help-item strong{color:#1e293b;font-weight:600}.help-footer{background:#f1f5f9;padding:2rem;border-radius:16px;text-align:center;margin-top:2rem}.help-footer h3{font-size:1.5rem;font-weight:600;color:#1e293b;margin:0 0 .75rem}.help-footer p{margin:0;color:#475569;font-size:1rem}.report-form{display:flex;flex-direction:column;gap:1rem;padding:0}.report-form .form-group{display:flex;flex-direction:column;gap:.5rem}.report-form label{font-weight:600;color:#1e293b;font-size:.875rem;display:flex;align-items:center;gap:.25rem}.report-form input,.report-form select,.report-form textarea{padding:.625rem .875rem;border:2px solid #e5e7eb;border-radius:8px;font-size:.875rem;transition:all .2s ease;background:#fff;font-family:inherit}.report-form input:hover,.report-form select:hover,.report-form textarea:hover{border-color:#cbd5e1}.report-form input:focus,.report-form select:focus,.report-form textarea:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #667eea1a}.report-form select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23475569' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .875rem center;padding-right:2.5rem}.report-form textarea{resize:vertical;min-height:100px;line-height:1.5}.required{color:#dc2626;font-size:1rem}.subsection-checkboxes{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.5rem;padding:.75rem;background:#f8f9ff;border-radius:10px;border:2px solid #e5e7eb;max-height:280px;overflow-y:auto}.checkbox-label{display:flex!important;flex-direction:row!important;align-items:center!important;gap:.5rem;cursor:pointer;padding:.5rem .75rem;border-radius:6px;transition:all .2s ease;background:#fff;border:1px solid #e5e7eb;position:relative}.checkbox-label:hover{border-color:#4b5563;box-shadow:0 1px 4px #667eea26}.checkbox-container{display:flex;align-items:center;justify-content:center;flex-shrink:0;order:1}.checkbox-container input[type=checkbox]{width:18px;height:18px;min-width:18px;cursor:pointer;margin:0;flex-shrink:0}.checkbox-container input[type=checkbox]:checked{accent-color:#4b5563}.checkbox-text{flex:1;display:flex;align-items:center;order:2}.checkbox-label:has(input[type=checkbox]:checked){border-color:#4b5563;background:#f0f2ff}.checkbox-label:has(input[type=checkbox]:checked) .checkbox-text span{color:#4b5563;font-weight:600}.checkbox-text span{font-size:.875rem;color:#475569;-webkit-user-select:none;user-select:none;transition:all .2s ease;line-height:1.3;word-break:break-word}.report-form .btn-primary{margin-top:.5rem;padding:.75rem 1.25rem;font-size:.9375rem;font-weight:600;border-radius:8px;background:linear-gradient(135deg,#4b5563,#2f3237);border:none;color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #667eea4d}.report-form .btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.report-form .btn-primary:active{transform:translateY(0)}.subsection-tag{display:inline-block;padding:.25rem .75rem;background:#f0f2ff;color:#4b5563;border-radius:12px;font-size:.8125rem;font-weight:600;margin-right:.5rem;margin-bottom:.5rem}.issue-subsections{margin-bottom:.75rem}.issues-page{padding:2rem;max-width:1400px;margin:0 auto}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.issue-toggle{display:flex;gap:.5rem;background:#f1f5f9;padding:.25rem;border-radius:10px}.toggle-btn{padding:.625rem 1.5rem;border:none;background:transparent;border-radius:8px;font-size:.9375rem;font-weight:600;color:#64748b;cursor:pointer;transition:all .2s ease}.toggle-btn:hover{color:#1e293b}.toggle-btn.active{background:#fff;color:#4b5563;box-shadow:0 2px 8px #0000001a}.issue-filters{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:1.5rem}.filter-btn{padding:.625rem 1.25rem;border:2px solid #e5e7eb;background:#fff;border-radius:8px;font-size:.9375rem;font-weight:600;color:#475569;cursor:pointer;transition:all .2s ease}.filter-btn:hover{border-color:#4b5563;color:#4b5563}.filter-btn.active{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff;border-color:transparent}.empty-state{text-align:center;padding:4rem 2rem;background:#fff;border-radius:16px;box-shadow:0 4px 20px #0000000f}.empty-icon{font-size:4rem;margin-bottom:1rem;color:#10b981}.empty-state h3{font-size:1.5rem;font-weight:600;color:#1e293b;margin:0 0 .5rem}.empty-state p{color:#64748b;margin:0}.issues-list{display:flex;flex-direction:column;gap:1.25rem}.issue-card{background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 4px 20px #0000000f;border:1px solid #e5e7eb;transition:all .2s ease}.issue-card:hover{box-shadow:0 8px 30px #0000001a;transform:translateY(-2px)}.issue-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.issue-meta{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.issue-section{padding:.375rem .875rem;border-radius:20px;font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.issue-section.school{background:#e5e7eb;color:#1e40af}.issue-section.center{background:#d1fae5;color:#065f46}.issue-section.admin{background:#fce7f3;color:#9f1239}.issue-section.general{background:#f3f4f6;color:#374151}.issue-date{color:#64748b;font-size:.875rem}.issue-actions{display:flex;gap:.75rem}.btn-success{background:#10b981;color:#fff}.btn-success:hover{background:#059669}.issue-title{font-size:1.25rem;font-weight:600;color:#1e293b;margin:0 0 .75rem}.issue-description{color:#475569;line-height:1.6;margin:0 0 1rem;white-space:pre-wrap}.issue-footer{padding-top:1rem;border-top:1px solid #e5e7eb}.reporter-info{color:#64748b;font-size:.9375rem}.reporter-info strong{color:#1e293b}.issue-card.resolved{opacity:.85;background:#f8fafb;border-color:#d1d5db}.issue-card.resolved:hover{opacity:1}.resolved-badge{padding:.375rem .875rem;background:#d1fae5;color:#065f46;border-radius:20px;font-size:.8125rem;font-weight:600}.resolver-info{color:#64748b;font-size:.9375rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid #e5e7eb}.resolver-info strong{color:#1e293b}.resolution-message{margin-top:.5rem;padding:.75rem;background:#f0f9ff;border-left:3px solid #0ea5e9;border-radius:6px;font-size:.875rem;line-height:1.5}.resolution-message strong{display:block;margin-bottom:.25rem;color:#0369a1}.resolve-form{display:flex;flex-direction:column;gap:1.25rem}.issue-summary{padding:1rem;background:#f8f9ff;border-radius:8px;border-left:4px solid #4b5563}.issue-summary h4{margin:0 0 .5rem;font-size:1rem;font-weight:600;color:#1e293b}.issue-summary p{margin:0;font-size:.875rem;color:#475569;line-height:1.5}.resolve-form .form-group{display:flex;flex-direction:column;gap:.5rem}.resolve-form label{font-weight:600;color:#1e293b;font-size:.875rem}.resolve-form textarea{padding:.75rem;border:2px solid #e5e7eb;border-radius:8px;font-size:.875rem;font-family:inherit;resize:vertical;transition:all .2s ease}.resolve-form textarea:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #667eea1a}.modal-actions{display:flex;gap:.75rem;justify-content:flex-end}.btn-secondary{padding:.625rem 1.25rem;border:2px solid #e5e7eb;background:#fff;color:#475569;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{border-color:#cbd5e1;background:#f8fafc}.pending-badge{padding:.375rem .875rem;background:#fef3c7;color:#92400e;border-radius:20px;font-size:.8125rem;font-weight:600}.btn-back{padding:.625rem 1.25rem;border:2px solid #e5e7eb;background:#fff;color:#475569;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:.5rem;border-radius:8px;width:fit-content;white-space:nowrap}.btn-back:hover{border-color:#4b5563;color:#4b5563;background:#f8f9ff}.my-issues-page{padding:1.5rem;max-width:1200px;margin:0 auto;min-height:100vh;background:#f8fafc}.my-issues-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.my-issues-header-left{display:flex;flex-direction:column;gap:.75rem}.my-issues-header-left h2{margin:0;font-size:1.75rem;font-weight:700;color:#1e293b}.my-issues-list{display:flex;flex-direction:column;gap:1rem}.my-issue-card{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;transition:all .2s ease}.my-issue-card:hover{box-shadow:0 4px 12px #00000014;border-color:#cbd5e1}.my-issue-card.resolved{background:#fafbfc;border-color:#e5e7eb}.my-issue-header{margin-bottom:1rem}.my-issue-meta{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.my-issue-title{font-size:1.25rem;font-weight:600;color:#1e293b;margin:0 0 .75rem;line-height:1.4}.my-issue-description{color:#64748b;line-height:1.6;margin:0;white-space:pre-wrap;font-size:.9375rem}.my-issue-footer{padding-top:1rem;border-top:1px solid #e5e7eb;margin-top:1rem}.my-issue-footer .resolver-info{color:#64748b;font-size:.875rem}.my-issue-footer .resolver-info strong{color:#475569;font-weight:600}@media(max-width:768px){.help-page,.issues-page{padding:.75rem}.help-header{flex-direction:column;align-items:flex-start;margin-bottom:1rem}.help-header h1{font-size:1.5rem}.help-intro{padding:1rem;margin-bottom:1rem}.help-intro h2{font-size:1.125rem;margin-bottom:.5rem}.help-intro p{font-size:.875rem;line-height:1.5}.help-sections{gap:1rem}.help-section{padding:1rem}.help-section h2{font-size:1.25rem;margin-bottom:1rem;padding-bottom:.75rem}.help-content{gap:1rem}.help-item{padding:.875rem}.help-item h3{font-size:1rem;margin-bottom:.5rem}.help-item p{font-size:.875rem;line-height:1.5}.help-footer{padding:1rem;margin-top:1rem}.help-footer h3{font-size:1.125rem;margin-bottom:.5rem}.help-footer p{font-size:.875rem}.issue-filters{width:100%}.filter-btn{flex:1;min-width:100px;padding:.5rem .75rem;font-size:.8125rem}.issue-header{flex-direction:column}.issue-actions{width:100%}.issue-actions button{flex:1}.issue-card{padding:1rem}.issue-title{font-size:1.125rem}.issue-description{font-size:.875rem}.report-form{gap:.875rem}.report-form .form-group{gap:.375rem}.report-form label{font-size:.8125rem}.report-form input,.report-form select,.report-form textarea{padding:.5rem .75rem;font-size:.8125rem;border-radius:6px}.report-form textarea{min-height:80px}.subsection-checkboxes{grid-template-columns:1fr;gap:.375rem;padding:.5rem;max-height:200px}.checkbox-label{padding:.375rem .5rem!important;gap:.5rem}.checkbox-container input[type=checkbox]{width:16px;height:16px;min-width:16px}.checkbox-text span{font-size:.8125rem;line-height:1.2}.report-form .btn-primary{padding:.625rem 1rem;font-size:.875rem;margin-top:.25rem}.my-issues-page{padding:1rem}.my-issues-header{flex-direction:column;align-items:flex-start;margin-bottom:1rem}.my-issues-header-left h2{font-size:1.375rem}.btn-back{padding:.5rem 1rem;font-size:.8125rem}.my-issues-list{gap:.875rem}.my-issue-card{padding:1.125rem}.my-issue-title{font-size:1.0625rem}.my-issue-description{font-size:.875rem}.my-issue-footer{padding-top:.875rem;margin-top:.875rem}.my-issue-footer .resolver-info{font-size:.8125rem}}.tasks-page{padding:1.5rem;max-width:1200px}.tasks-page .page-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.modal-content{max-width:50%}.tasks-page .page-header h2{margin:0;flex:1;font-size:1.5rem;color:var(--text-primary)}.tasks-tabs{display:flex;gap:.5rem;margin-bottom:1.5rem;border-bottom:2px solid var(--border-primary);padding-bottom:0}.tasks-tab{padding:.6rem 1.2rem;border:none;background:none;cursor:pointer;font-size:.9rem;color:var(--text-tertiary);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s;border-radius:4px 4px 0 0}.tasks-tab:hover{color:var(--primary-color);background:var(--bg-hover)}.tasks-tab.active{color:var(--primary-color);border-bottom-color:var(--primary-color);font-weight:600}.tasks-tab .tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;font-size:.75rem;font-weight:600;margin-left:6px;background:var(--bg-quaternary);color:var(--text-secondary)}.tasks-tab.active .tab-count{background:var(--primary-color);color:#fff}.tasks-filters{display:flex;gap:.75rem;margin-bottom:1.25rem;flex-wrap:wrap;align-items:center}.tasks-filters select,.tasks-filters input{padding:.5rem .75rem;border:1px solid var(--border-primary);border-radius:6px;font-size:.875rem;background:var(--bg-primary);color:var(--text-primary);min-width:140px}.tasks-filters select:focus,.tasks-filters input:focus{outline:none;border-color:var(--primary-color)}.tasks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem}.task-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:10px;padding:1.1rem;box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s;border-left:4px solid var(--border-primary)}.task-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.task-card.priority-high{border-left-color:var(--danger-color)}.task-card.priority-medium{border-left-color:var(--warning-color)}.task-card.priority-low{border-left-color:var(--success-color)}.task-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.6rem}.task-title{font-size:.95rem;font-weight:600;color:var(--text-primary);margin:0;flex:1;line-height:1.4}.task-badges{display:flex;gap:.4rem;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.badge{display:inline-block;padding:.2rem .55rem;border-radius:20px;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em}.badge-priority-high{background:var(--danger-bg);color:var(--danger-color-darker)}.badge-priority-medium{background:var(--warning-bg);color:var(--warning-color-darker)}.badge-priority-low{background:var(--success-bg);color:var(--success-color-darker)}.badge-status-pending{background:var(--bg-quaternary);color:var(--text-secondary)}.badge-status-in_progress{background:var(--info-bg);color:var(--info-color-darker)}.badge-status-completed{background:var(--success-bg);color:var(--success-color-darker)}.badge-status-overdue{background:var(--danger-bg);color:var(--danger-color-darker)}.task-description{font-size:.85rem;color:var(--text-tertiary);margin:0 0 .75rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.task-meta{display:flex;flex-direction:column;gap:.3rem;font-size:.8rem;color:var(--text-tertiary);margin-bottom:.85rem}.task-meta-row{display:flex;align-items:center;gap:.4rem}.task-meta-row svg{flex-shrink:0;opacity:.7}.deadline-overdue{color:var(--danger-color);font-weight:600}.deadline-soon{color:var(--warning-color);font-weight:600}.task-card-actions{display:flex;gap:.5rem;flex-wrap:wrap;padding-top:.75rem;border-top:1px solid var(--border-tertiary)}.task-card-actions select{flex:1;min-width:120px;padding:.35rem .6rem;border:1px solid var(--border-primary);border-radius:6px;font-size:.8rem;background:var(--bg-primary);color:var(--text-primary);cursor:pointer}.task-card-actions .btn-text{padding:.35rem .7rem;font-size:.8rem;border:none;background:none;cursor:pointer;border-radius:5px;transition:background .15s}.task-card-actions .btn-edit{color:var(--primary-color)}.task-card-actions .btn-edit:hover{background:var(--bg-hover)}.task-card-actions .btn-delete{color:var(--danger-color)}.task-card-actions .btn-delete:hover{background:var(--danger-bg-light)}.tasks-empty{text-align:center;padding:3rem 1rem;color:var(--text-tertiary);grid-column:1 / -1}.tasks-empty svg{opacity:.3;margin-bottom:1rem}.tasks-empty p{margin:0;font-size:.95rem}.task-form{display:flex;flex-direction:column;gap:0rem}.task-form .form-group{display:flex;flex-direction:column;gap:.3rem}.task-form label{display:block;font-size:.85rem;font-weight:500;color:var(--text-secondary)}.task-form input,.task-form textarea,.task-form .custom-datepicker-input{width:100%;height:40px;padding:0 .75rem;border:1px solid var(--border-primary);border-radius:6px;font-size:.9rem;background:var(--bg-primary);color:var(--text-primary);box-sizing:border-box}.task-form select{width:100%;min-height:40px;padding:.5rem .75rem;border:1px solid var(--border-primary);border-radius:6px;font-size:.9rem;background:var(--bg-primary);color:var(--text-primary);box-sizing:border-box;appearance:auto}.task-form textarea{height:auto;padding:.6rem .75rem}.task-form textarea{resize:vertical;min-height:80px}.task-form input:focus,.task-form select:focus,.task-form textarea:focus,.task-form .custom-datepicker-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #4b55631a}.task-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:0 0 .85rem}.task-form .required{color:var(--danger-color)}.task-form .btn-primary{width:100%;padding:.7rem;margin-top:0}@media(max-width:640px){.tasks-page{padding:1rem .75rem}.tasks-page .page-header{margin-bottom:1rem}.tasks-page .page-header h2{font-size:1.2rem}.modal-content{max-width:90%}.tasks-page .page-header .btn-primary{font-size:.85rem;padding:.5rem .9rem}.tasks-tabs{gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-bottom:1rem}.tasks-tabs::-webkit-scrollbar{display:none}.tasks-tab{padding:.5rem .85rem;font-size:.82rem;white-space:nowrap;flex-shrink:0}.tasks-tab .tab-count{font-size:.7rem;min-width:18px;height:18px;padding:0 4px;margin-left:4px}.tasks-filters{flex-direction:column;gap:.5rem;margin-bottom:1rem}.tasks-filters select,.tasks-filters input{min-width:unset;width:100%;font-size:.875rem}.tasks-grid{grid-template-columns:1fr;gap:.75rem}.task-card{padding:.9rem}.task-title{font-size:.9rem}.task-card-header{flex-wrap:wrap}.task-badges{justify-content:flex-start;margin-top:.25rem}.task-card-actions{flex-wrap:wrap;gap:.4rem}.task-card-actions select{width:100%;flex:unset}.task-form .form-row{grid-template-columns:1fr;gap:0}.time-picker{width:100%;height:40px}.time-picker-input{flex:1;width:auto}.user-picker-portal{inset:auto 0 0!important;width:100%!important;max-height:70vh;border-radius:16px 16px 0 0;box-shadow:0 -4px 24px #0000002e}.user-picker-search{padding:.75rem 1rem}.user-picker-search input{font-size:1rem}.user-picker-item{padding:.65rem 1rem}.user-picker-name{font-size:.9rem}.user-picker-close{padding:.75rem;font-size:.9rem}}.time-picker{display:flex;align-items:center;border:1px solid var(--border-primary);border-radius:6px;overflow:hidden;background:var(--bg-primary);width:fit-content;height:40px}.time-picker:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 3px #4b55631a}.time-picker-input{border:none!important;outline:none!important;box-shadow:none!important;background:transparent;font-size:.9rem;font-weight:600;color:var(--text-primary);text-align:center;width:36px;height:100%;padding:0;align-self:stretch}.time-picker-input:focus{border:none!important;outline:none!important;box-shadow:none!important;background:var(--bg-hover)}.time-picker-input::placeholder{color:var(--text-quaternary);font-weight:400}.time-picker-sep{font-size:1.1rem;font-weight:700;color:var(--text-secondary);padding:0 2px;-webkit-user-select:none;user-select:none;line-height:1;align-self:center}.time-picker-ampm{display:flex;flex-direction:column;align-self:stretch;border-left:1px solid var(--border-primary)}.time-picker-ampm button{flex:1;border:none;background:transparent;font-size:.65rem;font-weight:700;color:var(--text-tertiary);cursor:pointer;padding:0 8px;line-height:1;transition:background .15s,color .15s;letter-spacing:.03em}.time-picker-ampm button:first-child{border-bottom:1px solid var(--border-primary)}.time-picker-ampm button:hover{background:var(--bg-hover);color:var(--text-primary)}.time-picker-ampm button.active{background:linear-gradient(135deg,#4b5563,#2f3237);color:#fff}.user-picker-wrap{position:relative}.user-picker-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;padding:.6rem .75rem;border:1px solid var(--border-primary);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);font-size:.9rem;cursor:pointer;text-align:left;transition:border-color .2s}.user-picker-trigger:hover{border-color:var(--primary-color)}.user-picker-trigger svg{flex-shrink:0;color:var(--text-tertiary)}.user-picker-popup{background:var(--bg-primary);border:1px solid var(--border-primary);border-radius:10px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;max-height:320px;overflow:hidden}.user-picker-portal{position:fixed;z-index:9999}.user-picker-backdrop{position:fixed;inset:0;z-index:9998}.user-picker-search{display:flex;align-items:center;gap:.5rem;padding:.6rem .75rem;border-bottom:1px solid var(--border-primary);flex-shrink:0}.user-picker-search svg{color:var(--text-tertiary);flex-shrink:0}.user-picker-search input{border:none!important;outline:none!important;box-shadow:none!important;background:transparent;font-size:.875rem;color:var(--text-primary);width:100%;padding:0}.user-picker-list{overflow-y:auto;flex:1}.user-picker-role-label{padding:.4rem .75rem .2rem;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-quaternary);background:var(--bg-secondary);position:sticky;top:0}.user-picker-item{width:100%;display:flex;flex-direction:column;align-items:flex-start;padding:.5rem .75rem;border:none;background:transparent;cursor:pointer;transition:background .15s;text-align:left;gap:.1rem}.user-picker-item:hover{background:var(--bg-hover)}.user-picker-item.selected{background:linear-gradient(135deg,#4b55631a,#2f323714)}.user-picker-name{font-size:.875rem;font-weight:600;color:var(--text-primary)}.user-picker-email{font-size:.75rem;color:var(--text-tertiary)}.user-picker-empty{padding:1.5rem;text-align:center;color:var(--text-tertiary);font-size:.875rem}.user-picker-close{border:none;border-top:1px solid var(--border-primary);background:var(--bg-secondary);color:var(--text-tertiary);font-size:.8rem;padding:.5rem;cursor:pointer;width:100%;flex-shrink:0;transition:background .15s}.user-picker-close:hover{background:var(--bg-quaternary);color:var(--text-primary)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#f0f2f5;color:#1a1a2e;line-height:1.5}.app-layout{min-height:100vh;display:flex;flex-direction:column}.main-container{display:flex;flex:1}.content{flex:1;padding:2rem;overflow-y:auto;background:#f0f2f5;height:calc(100vh - 64px)}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #e2e8f0}.page-header h2{color:#1a1a2e;font-size:1.75rem;font-weight:700}.subtitle{color:#64748b;font-size:.9rem;margin-top:.25rem;word-wrap:break-word;overflow-wrap:break-word}.search-bar{position:relative;margin-bottom:1.5rem;width:100%;max-width:600px}.search-input{width:100%;padding:14px 48px 14px 20px;border:2px solid #e2e8f0;border-radius:12px;font-size:15px;transition:all .3s cubic-bezier(.16,1,.3,1);font-family:inherit;background:#fff}.search-input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 4px #667eea1a;background:#fafbff}.search-input::placeholder{color:#94a3b8}.clear-search{position:absolute;right:16px;top:50%;transform:translateY(-50%);background:#f1f5f9;border:none;width:28px;height:28px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#64748b;font-size:16px;font-weight:700;transition:all .2s}.clear-search:hover{background:#e2e8f0;color:#475569;transform:translateY(-50%) scale(1.1)}.clear-search:active{transform:translateY(-50%) scale(.95)}.form-group{margin-bottom:1.25rem}.form-group label{display:block;margin-bottom:.5rem;color:#374151;font-weight:600;font-size:.875rem}.form-group input,.form-group select,.form-group textarea{width:100%;padding:.875rem 1rem;border:2px solid #e2e8f0;border-radius:10px;font-size:1rem;transition:all .2s;background:#fff}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #667eea1a}input[type=date]{position:relative;padding-right:40px!important;cursor:pointer;font-family:inherit}input[type=date]::-webkit-calendar-picker-indicator{position:absolute;right:12px;cursor:pointer;opacity:.6;transition:opacity .2s;width:20px;height:20px;filter:invert(.5)}input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1;filter:invert(.3)}input[type=date]::-webkit-datetime-edit{padding:0}input[type=date]::-webkit-datetime-edit-fields-wrapper{padding:0}input[type=date]::-webkit-datetime-edit-text{color:#64748b;padding:0 2px}input[type=date]::-webkit-datetime-edit-month-field,input[type=date]::-webkit-datetime-edit-day-field,input[type=date]::-webkit-datetime-edit-year-field{color:#1e293b;padding:2px 4px;border-radius:4px}input[type=date]::-webkit-datetime-edit-month-field:focus,input[type=date]::-webkit-datetime-edit-day-field:focus,input[type=date]::-webkit-datetime-edit-year-field:focus{background:#667eea26;color:#4b5563;outline:none}input[type=date]:focus::-webkit-calendar-picker-indicator{filter:invert(.3) sepia(1) saturate(5) hue-rotate(220deg)}.form-card{background:#fff;padding:2rem;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a;margin-bottom:2rem}.form-card h3{margin-bottom:1.25rem;color:#1a1a2e;font-size:1.125rem;font-weight:600}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmin(200px,1fr));gap:1rem;margin-bottom:1rem}.form-row input,.form-row select{padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:10px;font-size:.95rem}.btn-primary{background:linear-gradient(135deg,#4b5563,#2f3237);background-size:100% 100%;color:#fff;border:none;padding:.875rem 2rem;border-radius:10px;cursor:pointer;font-size:1rem;font-weight:600;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 14px #667eea66}.btn-primary:hover{background:linear-gradient(135deg,#4b5563,#2f3237);background-size:100% 100%;transform:translateY(-2px);box-shadow:0 6px 20px #667eea80}.btn-primary:disabled{background:#cbd5e1;cursor:not-allowed;box-shadow:none;transform:none}.btn-secondary{background:#f1f5f9;color:#475569;border:2px solid #e2e8f0;padding:.75rem 1.5rem;border-radius:10px;cursor:pointer;font-weight:500;transition:transform .2s,box-shadow .2s}.btn-secondary:hover{background:#f1f5f9;border-color:#e2e8f0;transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.btn-sm{padding:.5rem 1rem;font-size:.85rem;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:transform .2s,box-shadow .2s}.btn-sm:hover{transform:translateY(-2px)}.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.btn-success:hover{background:linear-gradient(135deg,#10b981,#059669)}.btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.btn-danger:hover{background:linear-gradient(135deg,#ef4444,#dc2626)}.btn-warning{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.btn-warning:hover{background:linear-gradient(135deg,#f59e0b,#d97706)}.btn-large{padding:1rem 2.5rem;font-size:1.1rem}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a;background:#fff;max-width:100%}.data-table{width:100%;background:#fff;border-collapse:collapse;min-width:max-content}.data-table th,.data-table td{padding:1rem 1.25rem;text-align:left;border-bottom:1px solid #f1f5f9;white-space:nowrap}.data-table th{background:linear-gradient(135deg,#f8fafc,#f1f5f9);color:#475569;font-weight:700;font-size:.8rem;text-transform:uppercase}.data-table tr:hover:not(.clickable-row){background:#f8fafc}.data-table.compact th,.data-table.compact td{padding:.6rem .75rem;font-size:.875rem}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:#fff;padding:1.5rem;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a;border-left:4px solid #4b5563}.stat-card h3{font-size:2rem;background:linear-gradient(135deg,#4b5563,#1f2937);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.25rem;font-weight:800}.stat-card p{color:#64748b;font-weight:500;font-size:.9rem}.status-badge{padding:.35rem .85rem;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase}.status-badge.present,.status-badge.completed{background:#d1fae5;color:#065f46}.status-badge.absent{background:#fee2e2;color:#991b1b}.status-badge.late,.status-badge.in_progress{background:#fef3c7;color:#92400e}.status-badge.not_started{background:#f1f5f9;color:#475569}.filters{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap;background:#fff;padding:1.5rem;border-radius:16px;box-shadow:0 2px 4px #0000000d}.filters .form-group{margin-bottom:0;min-width:180px}.error-message{background:#fee2e2;color:#991b1b;padding:1rem;border-radius:10px;margin-bottom:1rem;border-left:4px solid #ef4444}.welcome-message{background:linear-gradient(135deg,#4b5563,#2f3237);padding:2rem;border-radius:16px;color:#fff;margin-bottom:2rem}.welcome-message h3{color:#fff;margin-bottom:.5rem;font-size:1.5rem}.welcome-message p{color:#ffffffe6}.no-data{text-align:center;padding:3rem;color:#64748b;background:#fff;border-radius:16px;box-shadow:0 2px 4px #0000000d}.no-data .hint{font-size:.875rem;margin-top:.5rem;color:#94a3b8}.loading{display:flex;align-items:center;justify-content:center;min-height:300px;color:#64748b}.school-selector,.center-selector{padding:.6rem 1rem;border:2px solid #e2e8f0;border-radius:8px;font-size:.95rem;background:#fff;cursor:pointer}@media(max-width:768px){.content{padding:1rem}.form-row{grid-template-columns:1fr}.page-header{flex-direction:column;align-items:flex-start;gap:12px}.page-header h2{font-size:1.5rem}.filters{flex-direction:column;padding:1rem}.filters .form-group{width:100%;min-width:100%}.stats-grid{grid-template-columns:1fr}.table-wrapper{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;margin:0!important;padding:0!important;border-radius:12px!important}.data-table{min-width:600px;display:table}.data-table th,.data-table td{padding:.75rem .5rem;font-size:.8rem;white-space:nowrap}.data-table th:first-child,.data-table td:first-child{position:sticky;left:0;background:#fff;z-index:1;box-shadow:2px 0 4px #0000000d;padding-left:1rem!important}.data-table thead th:first-child{background:linear-gradient(135deg,#f8fafc,#f1f5f9);z-index:2}.data-table th:last-child,.data-table td:last-child{padding-right:1rem!important}.btn-primary,.btn-secondary{width:100%;padding:.75rem 1rem}.form-actions{flex-direction:column}.form-actions button{width:100%}.modal{width:95%;padding:1.5rem;max-height:85vh}.modal h3{font-size:1.125rem}.form-card{padding:1.5rem}.btn-sm{padding:.4rem .75rem;font-size:.75rem}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease}.modal{background:#fff;border-radius:20px;padding:2rem;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal h3{margin:0 0 1.5rem;color:#1a1a2e;font-size:1.25rem}.form-actions{display:flex;justify-content:flex-end;gap:.75rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid #e2e8f0}.action-buttons{display:flex;gap:8px;align-items:center;justify-content:center}.btn-icon{background:none;border:none;cursor:pointer;font-size:18px;padding:6px 10px;border-radius:8px;transition:all .2s cubic-bezier(.16,1,.3,1);display:inline-flex;align-items:center;justify-content:center}.btn-icon:hover{transform:scale(1.15)}.btn-edit:hover{background:#3b82f61a}.btn-delete:hover{background:#ef44441a}.btn-activate:hover{background:#22c55e1a}.btn-deactivate:hover{background:#fb923c1a}.btn-icon:active{transform:scale(1)}.btn-text{background:none;border:none;cursor:pointer;font-size:14px;font-weight:600;padding:6px 16px;border-radius:8px;transition:all .2s cubic-bezier(.16,1,.3,1);display:inline-flex;align-items:center;justify-content:center}.btn-text:hover{transform:translateY(-1px)}.btn-text.btn-edit{color:#2563eb}.btn-text.btn-edit:hover{background:#2563eb1a}.btn-text.btn-delete{color:#dc2626}.btn-text.btn-delete:hover{background:#dc26261a}.btn-text:active{transform:translateY(0)}.clickable-row{cursor:pointer;transition:all .2s}.clickable-row:hover{background:#10b98114!important}.assignments-container{max-height:70vh;overflow-y:auto}.assignment-section{margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid #e5e7eb}.assignment-section:last-child{border-bottom:none}.assignment-section h3{font-size:18px;font-weight:700;color:#1e293b;margin-bottom:16px}.assigned-list{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.assigned-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-radius:10px;border-left:4px solid #4b5563}.assigned-item span{font-size:14px;color:#374151;font-weight:500}.assign-new{margin-top:16px}.assign-new label{display:block;margin-bottom:8px;font-weight:600;color:#374151;font-size:14px}.assign-new select{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:10px;font-size:14px;cursor:pointer;transition:all .2s}.assign-new select:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 3px #667eea1a}.no-data{color:#94a3b8;font-style:italic;padding:12px 0}.confirm-modal-content{padding:10px 0}.confirm-modal-content p{font-size:15px;color:#475569;line-height:1.6;margin-bottom:24px}.confirm-modal-content strong{color:#1e293b;font-weight:700}.confirm-modal-content .form-group{margin-bottom:24px}.required{color:#ef4444;margin-left:4px}.status-badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600;text-transform:capitalize;transition:all .2s cubic-bezier(.16,1,.3,1)}.status-badge.clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.status-badge.clickable:hover{transform:translateY(-1px);box-shadow:0 2px 8px #00000026}.status-badge.clickable:active{transform:translateY(0)}.status-badge.active{background:#d1fae5;color:#065f46}.status-badge.inactive{background:#fee2e2;color:#991b1b}.role-categories{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;padding:1rem 0;max-width:1400px}.role-category-card{background:linear-gradient(135deg,#fff,#f8f9ff);border-radius:16px;padding:1.75rem 1.5rem;box-shadow:0 4px 20px #0000000f;cursor:pointer;transition:all .4s cubic-bezier(.16,1,.3,1);border:2px solid #e5e7eb;text-align:center;position:relative;overflow:hidden}.role-category-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,#4b5563,#2f3237);transform:scaleX(0);transition:transform .4s cubic-bezier(.16,1,.3,1)}.role-category-card:hover:before{transform:scaleX(1)}.role-category-card:hover{transform:translateY(-8px);box-shadow:0 12px 40px #667eea40;border-color:#4b5563;background:linear-gradient(135deg,#fff,#f0f2ff)}.role-category-card h3{font-size:1.25rem;font-weight:700;color:#1e293b;margin-bottom:.75rem;letter-spacing:-.02em}.role-category-card .role-count{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,#4b5563,#2f3237);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0;line-height:1;letter-spacing:-.03em}.role-category-card .role-count:after{content:attr(data-label);display:block;font-size:.8125rem;font-weight:600;color:#64748b;margin-top:.5rem;letter-spacing:.05em;text-transform:uppercase;background:none;-webkit-text-fill-color:#64748b}@media(max-width:768px){.role-categories{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem;padding:1rem 0}.role-category-card{padding:1.5rem 1rem;border-radius:12px}.role-category-card h3{font-size:1.125rem;margin-bottom:.5rem}.role-category-card .role-count{font-size:2rem}.role-category-card .role-count:after{font-size:.75rem;margin-top:.375rem}}@media(max-width:480px){.role-categories{grid-template-columns:1fr 1fr}.role-category-card{padding:1.25rem .875rem}.role-category-card h3{font-size:1rem}.role-category-card .role-count{font-size:1.75rem}}.users-page .page-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.users-page .page-header h2{flex:1;margin:0;font-size:1.75rem;font-weight:700;color:#1e293b;letter-spacing:-.02em}.users-page .search-bar{position:relative;margin-bottom:1.25rem}.users-page .search-input{width:100%;padding:.75rem 3rem .75rem 1rem;border:2px solid #e5e7eb;border-radius:12px;font-size:1rem;transition:all .3s ease;background:#fff}.users-page .search-input:focus{outline:none;border-color:#4b5563;box-shadow:0 0 0 4px #667eea1a}.users-page .clear-search{position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:#e5e7eb;border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;color:#64748b;font-size:1rem}.users-page .clear-search:hover{background:#4b5563;color:#fff}.users-page .table-wrapper{background:#fff;border-radius:16px;box-shadow:0 4px 20px #0000000f;overflow-x:auto;border:1px solid #e5e7eb;-webkit-overflow-scrolling:touch}.users-page .data-table{width:100%;border-collapse:collapse;min-width:600px}.users-page .data-table thead{background:linear-gradient(135deg,#4b5563,#2f3237)!important}.users-page .data-table thead tr,.users-page .data-table thead tr:hover{background:transparent!important}.users-page .data-table thead th{padding:1rem 1.25rem;text-align:left;font-weight:600;font-size:.875rem;color:#fff!important;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;background:transparent!important}.users-page .data-table thead th:hover{color:#fff!important;background:transparent!important}.users-page .data-table tbody tr{border-bottom:1px solid #f1f5f9;transition:background-color .2s ease}.users-page .data-table tbody tr:hover{background-color:#f8f9ff}.users-page .data-table tbody tr:last-child{border-bottom:none}.users-page .data-table tbody td{padding:1rem 1.25rem;color:#334155;font-size:.9375rem}.users-page .status-badge{display:inline-block;padding:.375rem .875rem;border-radius:20px;font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.users-page .status-badge.active{background:#d1fae5;color:#065f46}.users-page .status-badge.inactive{background:#fee2e2;color:#991b1b}.users-page .status-badge.clickable{cursor:pointer;transition:all .2s ease}.users-page .status-badge.clickable:hover{transform:scale(1.05);box-shadow:0 2px 8px #0000001a}.users-page .action-buttons{display:flex;gap:.75rem;white-space:nowrap}.users-page .btn-text{background:none;border:none;padding:.5rem 1rem;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease}.users-page .btn-edit{color:#4b5563}.users-page .btn-edit:hover{background:#f0f2ff}.users-page .btn-delete{color:#dc2626}.users-page .btn-delete:hover{background:#fee2e2}@media(max-width:768px){.users-page .page-header{margin-bottom:1rem}.users-page .page-header h2{font-size:1.375rem;width:100%}.users-page .page-header .btn-secondary,.users-page .page-header .btn-primary{font-size:.875rem;padding:.625rem 1rem}.users-page .search-bar{margin-bottom:1rem}.users-page .search-input{padding:.625rem 2.5rem .625rem .875rem;font-size:.9375rem}.users-page .table-wrapper{border-radius:12px;margin:0 -1rem;border-left:none;border-right:none}.users-page .data-table thead th{padding:.875rem 1rem;font-size:.8125rem;color:#fff!important;background:transparent!important}.users-page .data-table thead tr:hover{background:transparent!important}.users-page .data-table thead th:hover{color:#fff!important;background:transparent!important}.users-page .data-table tbody td{padding:.875rem 1rem;font-size:.875rem}.users-page .data-table thead th:first-child,.users-page .data-table tbody td:first-child{padding-left:1rem;position:sticky;left:0;z-index:1}.users-page .data-table thead th:first-child{background:linear-gradient(135deg,#4b5563,#2f3237)!important;color:#fff!important}.users-page .data-table tbody td:first-child{background:#fff}.users-page .data-table tbody tr:hover td:first-child{background-color:#f8f9ff}.users-page .action-buttons{gap:.5rem}.users-page .btn-text{padding:.375rem .75rem;font-size:.8125rem}.users-page .status-badge{padding:.3125rem .625rem;font-size:.75rem}}@media(max-width:480px){.users-page .page-header h2{font-size:1.25rem}.users-page .page-header .btn-secondary,.users-page .page-header .btn-primary{font-size:.8125rem;padding:.5rem .875rem}.users-page .data-table{min-width:550px}}