.navbar{display:flex;justify-content:space-between;align-items:center;background-color:#fff;box-shadow:0 2px 5px #0000001a;padding:15px 50px;position:sticky;top:0}.navbar-logo{font-size:24px;font-weight:700;color:#6a0dad}.navbar-links{list-style:none;display:flex;gap:25px;margin:0}.navbar-links a{text-decoration:none;color:#06c;font-weight:500;transition:color .3s}.navbar-links a:hover{color:#6a0dad}.hero{background:linear-gradient(90deg,#5b73f2,#7456c2);color:#fff;text-align:center;padding:120px 20px}.hero-content{max-width:800px;margin:0 auto}.hero h1{font-size:3.5rem;font-weight:800;margin-bottom:20px}.hero p{font-size:1.2rem;line-height:1.6;margin-bottom:40px;color:#f0f0f0}.hero-buttons{display:flex;justify-content:center;gap:20px}.btn-primary{background-color:#fff;color:#4b63e0;border:none;padding:12px 30px;font-size:1rem;font-weight:600;border-radius:5px;cursor:pointer;transition:background .3s,color .3s}.btn-primary:hover{background-color:#f5f5f5}.btn-outline{background:transparent;color:#fff;border:2px solid #ffffff;padding:12px 30px;font-size:1rem;font-weight:600;border-radius:5px;cursor:pointer;transition:background .3s,color .3s}.btn-outline:hover{background-color:#fff;color:#6a0dad}@media (max-width: 768px){.hero h1{font-size:2.2rem}.hero-buttons{flex-direction:column;gap:15px}}.why-container{max-width:1200px;margin:60px auto;padding:20px;text-align:center;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.why-title{font-size:2rem;font-weight:700;color:#111;margin-bottom:10px}.why-subtitle{color:#555;font-size:1.1rem;max-width:700px;margin:0 auto 40px;line-height:1.6}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:25px}.feature-card{background:#fff;border:1px solid #e3e3e3;border-radius:10px;padding:25px;text-align:left;box-shadow:0 4px 12px #0000000d;transition:transform .3s ease,box-shadow .3s ease}.feature-card:hover{transform:translateY(-5px);box-shadow:0 6px 16px #0000001a}.feature-number{width:60px;height:60px;border-radius:50%;color:#fff;font-weight:700;font-size:1.5rem;display:flex;align-items:center;justify-content:center;margin-bottom:15px}.feature-title{font-size:1.2rem;font-weight:700;color:#111;margin-bottom:10px}.feature-description{color:#555;font-size:1rem;line-height:1.6}@media (max-width: 768px){.why-title{font-size:1.6rem}.why-subtitle{font-size:1rem}.feature-card{padding:20px}.feature-number{width:50px;height:50px;font-size:1.2rem}}:root{--primary-pink: #f75d86;--light-pink: #ffc4e1;--dark-pink: #e7336a;--white: #ffffff}.cta-container{background:linear-gradient(to right,var(--light-pink),var(--dark-pink),var(--primary-pink));padding:80px 20px;display:flex;justify-content:center;align-items:center;text-align:center}.cta-content{max-width:800px;width:100%}.cta-headline{font-size:2.5rem;font-weight:700;color:var(--white);margin-bottom:1rem}.cta-text{font-size:1.15rem;color:var(--white);line-height:1.6;margin-bottom:2.5rem;max-width:650px;margin-left:auto;margin-right:auto}.cta-buttons{display:flex;gap:20px;justify-content:center}.cta-button{padding:14px 30px;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.primary-button{background-color:var(--white);color:var(--primary-pink);border:2px solid var(--white)}.primary-button:hover{background-color:transparent;color:var(--white)}.secondary-button{background-color:var(--primary-pink);color:var(--white);border:2px solid var(--primary-pink)}.secondary-button:hover{background-color:var(--dark-pink);border-color:var(--dark-pink)}.stats-section{display:flex;justify-content:space-around;align-items:center;background-color:#f3f5f9;padding:60px 20px;flex-wrap:wrap}.stat-item{text-align:center;margin:20px}.stat-item h2{font-size:2.5rem;color:#7a63c8;font-weight:800;margin-bottom:10px}.stat-item p{color:#333;font-size:1.1rem;font-weight:500}.footer{background-color:#f8f9fc;padding:60px 40px 20px;color:#333;border-top:1px solid #e0e0e0}.footer-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:40px;margin-bottom:40px}.footer-column h3{font-size:1.5rem;color:#7a63c8;margin-bottom:15px}.footer-column h4{font-size:1.1rem;font-weight:700;margin-bottom:15px}.footer-column p{color:#555;line-height:1.6;font-size:.95rem}.footer-column ul{list-style:none;padding:0}.footer-column li{margin-bottom:10px}.footer-column a{text-decoration:none;color:#1e63c6;font-weight:500;transition:color .3s}.footer-column a:hover{color:#6a0dad}.footer-bottom{border-top:1px solid #ddd;text-align:center;padding-top:20px;font-size:.9rem;color:#555}.heart{color:red}@media (max-width: 768px){.stats-section{flex-direction:column;text-align:center}.stat-item{margin-bottom:25px}.footer-container{text-align:center}}.courses-section{padding:40px;text-align:center;background-color:#f9f9f9;font-family:Arial,sans-serif}.courses-section h2{font-size:32px;margin-bottom:20px;color:#333}.courses-section p{font-size:18px;margin-bottom:30px;color:#555}.coming-soon{border:2px dashed #ff6b6b;padding:20px;background-color:#fff3f3;display:inline-block;border-radius:8px}.coming-soon h3{font-size:24px;margin-bottom:10px;color:#ff4b4b}.coming-soon p{font-size:16px;color:#777}.login-wrapper{display:flex;height:100vh;font-family:Segoe UI,sans-serif}.login-slider{flex:2;position:relative;background:#0aa8f2;overflow:hidden}.login-slider img{width:100%;height:100%;object-fit:cover}.slider-dots{position:absolute;bottom:40px;left:50%;transform:translate(-50%);display:flex;gap:8px}.dot{width:10px;height:10px;background:#ffffff80;border-radius:50%}.dot.active{background:#fff}.login-form-section{flex:1;background:#fff;padding:80px 90px;display:flex;flex-direction:column;justify-content:center}.login-form-section h2{font-size:32px;margin-bottom:5px}.subtitle{color:#666;margin-bottom:30px}.login-form{display:flex;flex-direction:column;gap:18px}.login-form input{padding:14px;font-size:15px;border-radius:6px;border:1px solid #ddd}.login-form input:focus{outline:none;border-color:#0aa8f2}.login-form button{padding:14px;background:#0aa8f2;color:#fff;font-size:16px;border:none;border-radius:6px;cursor:pointer}.login-form button:hover{background:#028fd0}.error-msg{color:red;margin-bottom:10px}@media (max-width: 900px){.login-wrapper{flex-direction:column}.login-slider{height:300px}.login-form-section{padding:40px 25px}}.role-toggle{display:flex;background:#eaf6ff;border-radius:30px;padding:5px;margin-bottom:25px;width:fit-content}.role-toggle button{padding:10px 22px;border-radius:25px;border:none;background:transparent;cursor:pointer;font-weight:600;color:#0aa8f2;transition:.25s}.role-toggle button.active{background:#0aa8f2;color:#fff;box-shadow:0 3px 8px #00000026}.school-dashboard-container{display:flex;height:auto;background-color:#f8fcfa;font-family:Poppins,sans-serif}.sidebar{width:250px;min-height:100vh;background:linear-gradient(90deg,#5a6fe0,#6b4298);color:#fff;padding:20px;display:flex;flex-direction:column}.sidebar-title{font-size:32px;font-weight:700;margin-top:-10px;margin-bottom:30px;text-align:center}.sidebar-menu{list-style:none;padding:0}.sidebar-menu li{margin:15px 0;padding:10px;border-radius:8px;cursor:pointer;transition:background .3s ease;display:flex;align-items:center;gap:12px}.sidebar-menu li:hover{background-color:#3b82f6}.sidebar-menu li svg{font-size:18px;min-width:20px}.sidebar .logout-btn{margin-top:auto;background-color:#ef4444!important;color:#fff!important;border:none;padding:12px;border-radius:6px;cursor:pointer;font-weight:600;transition:background .3s ease;display:block;width:100%}.sidebar .logout-btn:hover{background-color:#dc2626}.dashboard-content{flex:1;padding:10px;overflow-y:auto}.dashboard-content h2{color:#1e3a8a;margin-bottom:20px}.dashboard-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}.card{background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 3px 6px #0000001a;cursor:pointer;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-5px);box-shadow:0 5px 10px #00000026}.school-logo{width:80px;height:100px;object-fit:cover;display:block;margin:15px auto}.toggle-btn{background:#fff;border:none;padding:6px 10px;border-radius:6px;cursor:pointer;margin-bottom:15px;font-weight:700}.sidebar.collapsed{width:70px;padding:20px 10px;transition:width .3s ease}.sidebar{transition:width .3s ease}.sidebar.collapsed .sidebar-title,.sidebar.collapsed .logout-btn{display:none}.sidebar.collapsed .sidebar-menu li{text-align:center}.nav-title{margin-top:20px;font-size:13px;font-weight:600;opacity:.8}.nav-badge{margin-left:auto;background:#ef4444;color:#fff;font-size:11px;padding:2px 8px;border-radius:20px}.submenu{list-style:none;padding-left:35px;margin-top:5px}.submenu li{display:flex;align-items:center;gap:10px;padding:8px 10px;cursor:pointer;font-size:14px;color:#eff1f4;transition:.3s ease;border-radius:6px}.submenu li:hover{background:#eef2ff;color:#4f46e5}.submenu-icon{font-size:14px}.tm-page{padding:20px;background:#f5f6fa;min-height:100vh}.tm-header{background:linear-gradient(90deg,#6a6ff5,#8b5fbf);color:#fff;padding:24px;border-radius:18px;display:flex;justify-content:space-between;align-items:center}.tm-add-btn{background:#ffffff40;border:none;padding:12px 18px;border-radius:12px;color:#fff;cursor:pointer;transition:all .2s ease}.tm-header h2{color:#fff;margin:0 0 5px}.tm-add-btn:hover{background:#ffffff59}.tm-filters{background:#fff;margin:20px 0;padding:16px;border-radius:14px;display:grid;grid-template-columns:2fr 2fr 1fr auto;gap:12px}.tm-filters input,.tm-filters select{padding:10px;border-radius:8px;border:1px solid #ddd}.tm-filters .clear{background:#f1f1f1;border:none;border-radius:8px;cursor:pointer;padding:10px 15px}.tm-filters .clear:hover{background:#e5e5e5}.tm-table-container{overflow-x:auto;border-radius:12px;background:#fff;width:100%}.tm-table{width:100%;border-collapse:collapse;table-layout:fixed;min-width:900px}.tm-table th{text-align:left;font-weight:600;background:#f8f9fa}.tm-table th,.tm-table td{padding:14px 12px;border-bottom:1px solid #eee;vertical-align:middle}.tm-table th:nth-child(1){width:80px}.tm-table th:nth-child(2){width:200px}.tm-table th:nth-child(3){width:120px}.tm-table th:nth-child(4){width:140px}.tm-table th:nth-child(5){width:120px}.tm-table th:nth-child(6){width:180px}.tm-photo{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 5px #0000001a;transition:all .3s ease}.tm-photo:hover{transform:scale(1.1);border-color:#6a6ff5}.tm-photo-placeholder{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#6a6ff5,#8b5fbf);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;text-transform:uppercase;border:2px solid #fff;box-shadow:0 2px 5px #0000001a}.tm-table td:first-child{position:relative;width:60px;height:60px;display:flex;align-items:center;justify-content:center}.view{background:#2196f3}.edit{background:#4caf50}.delete{background:#f44336}.view,.edit,.delete{color:#fff;border:none;padding:8px 12px;border-radius:6px;margin-right:6px;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s ease;min-width:60px}.view:hover{background:#1976d2}.edit:hover{background:#388e3c}.delete:hover{background:#d32f2f}.tm-empty-state{text-align:center;padding:40px;color:#999;font-size:16px}.tm-form{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;background:#fff;padding:24px;border-radius:16px}.tm-form input,.tm-form select,.tm-form textarea{width:100%;padding:12px 14px;border-radius:10px;border:1px solid #e0e0e0;font-size:14px;outline:none;transition:all .2s ease;background:#fafafa}.tm-form input:focus,.tm-form textarea:focus,.tm-form select:focus{border-color:#6a6ff5;box-shadow:0 0 0 3px #6a6ff51a;background:#fff}.tm-form textarea{resize:vertical;min-height:100px;grid-column:span 2}.tm-form .full{grid-column:span 2}.tm-form-actions{grid-column:span 2;display:flex;justify-content:flex-end;gap:15px;margin-top:20px;padding-top:20px;border-top:1px solid #eee}.tm-form-actions button{padding:12px 28px;border-radius:10px;border:none;cursor:pointer;font-weight:500;font-size:15px;transition:all .2s ease}.tm-form-actions .save{background:#6a6ff5;color:#fff;box-shadow:0 4px 10px #6a6ff54d}.tm-form-actions .save:hover{background:#5a5fd5;transform:translateY(-2px);box-shadow:0 6px 15px #6a6ff566}.tm-form-actions .cancel{background:#f5f5f5;color:#666}.tm-form-actions .cancel:hover{background:#e8e8e8;transform:translateY(-2px)}.tm-header .tm-add-btn:last-child{background:#fff3;border:1px solid rgba(255,255,255,.3);font-size:14px;padding:12px 24px}.tm-header .tm-add-btn:last-child:hover{background:#ffffff4d}.tm-loading{text-align:center;padding:40px;color:#999}@media (max-width: 1024px){.tm-form{grid-template-columns:1fr}.tm-form textarea,.tm-form .full,.tm-form-actions{grid-column:span 1}}@media (max-width: 768px){.tm-header{flex-direction:column;text-align:center;gap:15px}.tm-filters{grid-template-columns:1fr}.tm-form-actions{flex-direction:column}.tm-form-actions button{width:100%}.tm-header .tm-add-btn:last-child{width:100%}}.tm-page{transition:all .3s ease}.tm-card{transition:transform .2s ease,box-shadow .2s ease}.tm-card:hover{box-shadow:0 8px 20px #0000000d}.student-page{padding:20px;background:#f5f7fb}.student-header{background:linear-gradient(90deg,#6b7cff,#7c5db0);color:#fff;padding:20px 24px;border-radius:16px;display:flex;justify-content:space-between;align-items:center}.back-btn{background:#fff3;border:none;padding:10px;border-radius:10px;color:#fff;cursor:pointer}.add-btn{background:#ffffff40;border:none;padding:10px 18px;border-radius:10px;color:#fff;display:flex;gap:8px;cursor:pointer}.filter-card{background:#fff;margin-top:20px;padding:20px;border-radius:14px}.filter-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr auto;gap:16px;margin-top:16px}.filter-input{display:flex;align-items:center;gap:10px;border:1px solid #ddd;padding:10px 12px;border-radius:10px}.filter-input input,.filter-input select{border:none;outline:none;width:100%}.clear-btn{background:#f1f3f6;border:none;border-radius:10px;padding:10px 16px;cursor:pointer}.table-card{background:#fff;margin-top:20px;padding:20px;border-radius:14px}table{width:100%;border-collapse:collapse;margin-top:12px}th{text-align:left;padding:12px;color:#555;border-bottom:2px solid #eee}td{padding:14px 12px;border-bottom:1px solid #eee}.roll{color:#2563eb;font-weight:600}.class-chip{background:#e7f0ff;color:#2563eb;padding:6px 10px;border-radius:999px;font-size:13px}.view-btn{background:#e7f0ff;border:none;padding:8px 14px;border-radius:8px;color:#2563eb;cursor:pointer}.student-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;border:1px solid #ddd}.no-photo{font-size:12px;color:#999}.fee-container{width:95%;max-width:1200px;margin:auto;padding:20px}.fee-container h2{text-align:center;margin-bottom:20px;font-size:28px;font-weight:700;color:#333}.fee-search-box{display:flex;justify-content:center;margin-bottom:20px;gap:10px}.fee-search-box input{width:350px;padding:10px;border:2px solid #2146c7;border-radius:6px;outline:none;font-size:16px}.fee-search-box button{background:#2146c7;color:#fff;border:none;padding:10px 16px;border-radius:6px;cursor:pointer;font-size:16px;transition:.2s}.fee-search-box button:hover{background:#102a88}.students-table{overflow-x:auto;margin-top:10px}.students-table table{width:100%;border-collapse:collapse;min-width:900px;background:#fff;border-radius:10px;overflow:hidden}.students-table th{background:#2146c7;color:#fff;padding:12px;text-align:center;font-size:15px}.students-table td{padding:12px;text-align:center;font-size:14px;border-bottom:1px solid #ddd}.student-photo{width:45px;height:45px;border-radius:50%;object-fit:cover}.add-fee-btn{background:#0b8c38;color:#fff;padding:8px 14px;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:.2s}.add-fee-btn:hover{background:#066628}.history-btn{background:#b85c00;color:#fff;padding:8px 14px;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:.2s}.history-btn:hover{background:#7a3f00}.fee-modal{position:fixed;inset:0;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:999}.fee-modal-content{background:#fff;width:95%;max-width:650px;padding:25px;border-radius:12px;animation:fadeIn .2s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.fee-modal-content h3{margin-bottom:15px;font-size:22px;font-weight:700;text-align:center;color:#333}.fee-student-info{display:flex;gap:15px;margin-bottom:15px;align-items:center}.student-photo-large{width:90px;height:90px;border-radius:10px;object-fit:cover}.fee-student-info p{margin:3px 0;font-size:15px}.fee-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.fee-form-grid input{padding:10px;font-size:15px;border:2px solid #2146c7;border-radius:6px;outline:none}.history-table{width:100%;border-collapse:collapse;margin-top:10px}.history-table th{background:#2146c7;color:#fff;padding:10px;text-align:center}.history-table td{padding:10px;border-bottom:1px solid #ccc;text-align:center}.fee-modal-buttons{display:flex;justify-content:space-between;margin-top:20px}.save-btn{background:#2146c7;color:#fff;padding:10px 20px;border:none;border-radius:6px;font-size:16px;cursor:pointer}.save-btn:hover{background:#102a88}.close-btn{background:#888;color:#fff;padding:10px 20px;border:none;border-radius:6px;font-size:16px;cursor:pointer}.close-btn:hover{background:#555}@media (max-width: 600px){.fee-form-grid{grid-template-columns:1fr}.fee-student-info{flex-direction:column;text-align:center}.student-photo-large{margin-bottom:10px}}.form-group{margin-bottom:15px;display:flex;flex-direction:column}.form-group label{font-size:14px;font-weight:600;color:#333;margin-bottom:6px}.form-group select{width:100%;padding:10px 12px;font-size:14px;color:#333;border:1px solid #bbb;border-radius:6px;outline:none;background-color:#fff;transition:all .2s ease-in-out;cursor:pointer}.form-group select:focus{border-color:#2196f3;box-shadow:0 0 4px #2196f366}.form-group select:hover{border-color:#888}.form-group select option{padding:10px;font-size:14px}@media screen and (max-width: 480px){.form-group select{font-size:13px;padding:8px 10px}.form-group label{font-size:13px}}.fee-modal{position:fixed;inset:0;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:9999}.fee-modal-content{background:#fff;width:92%;max-width:900px;max-height:90vh;overflow-y:auto;padding:20px 22px;border-radius:8px;position:relative;box-shadow:0 10px 30px #00000040}.student-info-box{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:10px 12px;border:1px solid #333;background:#f9f9f9;font-size:14px}.student-info-box strong{font-weight:600}.fee-summary-box{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:10px 12px;border:1px solid #333;border-top:none;margin-bottom:12px;background:#fff;font-size:14px}.fee-summary-box div{font-weight:500}.fee-modal-content h3{text-align:center;margin:10px 0 12px;font-size:16px;font-weight:600;letter-spacing:.4px}.receipt-table{width:100%;border-collapse:collapse;font-size:14px;margin-bottom:12px}.receipt-table th,.receipt-table td{border:1px solid #333;padding:6px 8px;vertical-align:middle}.receipt-table th{background:#f1f1f1;font-size:13px;text-transform:uppercase}.receipt-table input[type=checkbox]{transform:scale(1.1);cursor:pointer}.receipt-table input[type=text],.receipt-table input[type=number]{width:100%;padding:4px 6px;font-size:13px;border:1px solid #999}.receipt-table input:disabled{background:#eee;cursor:not-allowed}.receipt-table tfoot td{background:#fafafa;font-weight:700;font-size:15px}.form-row{display:flex;align-items:center;gap:10px;margin:12px 0;font-size:14px}.form-row label{min-width:80px;font-weight:600}.form-row input{padding:6px 8px;border:1px solid #999}.fee-modal-buttons{display:flex;justify-content:flex-end;gap:12px;margin-top:15px}.fee-modal-buttons button{padding:8px 20px;border:none;border-radius:4px;font-size:14px;cursor:pointer}.fee-modal-buttons button:first-child{background:#2e7d32;color:#fff}.fee-modal-buttons button:last-child{background:#b71c1c;color:#fff}@media (max-width: 768px){.student-info-box,.fee-summary-box{grid-template-columns:1fr;gap:6px}.fee-modal-content{padding:15px;max-height:95vh}.receipt-table th,.receipt-table td{font-size:12px}}.dues-btn{position:relative;padding:6px 14px;background:#2563eb;color:#fff;border-radius:6px;border:none;cursor:pointer}.badge{position:absolute;top:-8px;right:-8px;background:#dc2626;color:#fff;font-size:12px;font-weight:700;min-width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px #fff}.attendance-page{padding:20px;background:#f5f7fb;min-height:100vh;display:flex;justify-content:center;width:100%;max-width:1200px;margin:0 auto}@media (max-width: 768px){.attendance-page{padding:10px;max-width:100%}}.attendance-card{width:100%;max-width:1200px;background:#fff;padding:20px;border-radius:14px;box-shadow:0 4px 20px #00000012}.attendance-header h2{margin:0;font-size:24px;font-weight:700;color:#333}.controls-row{margin-top:15px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}.type-toggle{display:flex;gap:8px}.toggle-btn{padding:8px 14px;background:#e3e8ef;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:.2s}.toggle-btn.active{background:#4a90e2;color:#fff}.toggle-btn:hover{background:#d3d8df}.search-left input{padding:9px 12px;border:1px solid #d0d5dd;border-radius:10px;width:260px;outline:none;transition:.2s}.search-left input:focus{border-color:#4a90e2;box-shadow:0 0 0 2px #4a90e233}.table-wrap{width:100%;overflow-x:auto;margin-top:20px}.modern-table{width:100%;border-collapse:collapse;min-width:750px}.modern-table thead{background:#f0f3f7}.modern-table th,.modern-table td{padding:12px 15px;border-bottom:1px solid #eee;text-align:left;font-size:14px}.avatar{width:45px;height:45px;border-radius:50%;object-fit:cover}.name-line{font-weight:600;color:#333}.sub-line{font-size:12px;color:#777}.date-input,.status-select{width:100%;padding:8px 6px;border:1px solid #d0d5dd;border-radius:6px;background:#fff}.date-input:focus,.status-select:focus{border-color:#4a90e2;outline:none}.save-btn{padding:8px 12px;background:#4a90e2;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;font-weight:600;transition:.2s}.save-btn:hover{background:#347acb}.save-btn:disabled{background:#a3c4e4;cursor:not-allowed}.saved-note{margin-top:5px;font-size:11px;color:#58a55c}.no-records{text-align:center;padding:20px;color:#777}@media (max-width: 768px){.attendance-card{padding:15px}.controls-row{flex-direction:column;align-items:flex-start}.search-left input{width:100%}}@media (max-width: 600px){.modern-table{min-width:100%}.type-toggle{width:100%;justify-content:space-between}.toggle-btn{flex:1;text-align:center;padding:10px}.modern-table thead{display:none}.modern-table tr{display:block;margin-bottom:15px;background:#fff;padding:12px;border-radius:10px;box-shadow:0 2px 6px #00000014}.modern-table td{display:flex;justify-content:space-between;border:none;padding:8px 0}.modern-table td:before{content:attr(data-label);font-weight:700;color:#333;margin-right:10px}}.sp-page{display:flex;min-height:100vh;transition:all .3s ease}.sp-sidebar{width:250px;min-height:100vh;background:linear-gradient(90deg,#5a6fe0,#6b4298);color:#fff;padding:20px;display:flex;flex-direction:column;position:relative;transition:width .3s ease,padding .3s ease;overflow-y:auto}.sp-sidebar.collapsed{width:80px;padding:20px 10px}.sidebar-toggle{position:absolute;top:10px;right:9px;width:24px;height:24px;background:#6b4298;border:2px solid white;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;z-index:100;transition:all .3s ease}.sidebar-toggle:hover{background:#5a6fe0;transform:scale(1.1)}.sp-sidebar.collapsed .sidebar-toggle{right:25px}.sp-sidebar-top{text-align:center;margin-bottom:30px;transition:all .3s ease}.sp-avatar-wrap{display:flex;justify-content:center;margin-bottom:10px}.sp-avatar{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid white;transition:all .3s ease}.sp-sidebar.collapsed .sp-avatar{margin-top:32px;width:50px;height:50px}.sp-name{margin:5px 0;font-size:1.1rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all .3s ease}.sp-small{font-size:.8rem;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sp-nav{display:flex;flex-direction:column;gap:10px}.sp-nav button{padding:12px 15px;border:none;border-radius:8px;background:#ffffff1a;color:#fff;font-size:1rem;font-weight:500;text-align:left;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;white-space:nowrap;overflow:hidden}.sp-nav button:hover{background:#fff3;transform:translate(5px)}.sp-nav button.active{background:#fff;color:#5a6fe0;font-weight:600}.sp-nav button.sp-logout{margin-top:20px;background:#ffffff26;border:1px solid rgba(255,255,255,.3)}.sp-nav button.sp-logout:hover{background:#ff3b304d}.sp-sidebar.collapsed .sp-nav button{padding:12px;justify-content:center;text-align:center}.sp-sidebar.collapsed .sp-nav button span{display:none}.main-content{flex:1;padding:20px;background-color:#f9f9f9;height:100vh;overflow-y:auto;transition:margin-left .3s ease,width .3s ease}.sp-loading{text-align:center;padding:50px;font-size:1.2rem;color:#666}@media (max-width: 768px){.sp-sidebar{position:fixed;left:0;top:0;z-index:1000;transform:translate(0)}.sp-sidebar.collapsed{transform:translate(-70px)}.main-content{margin-left:80px;width:calc(100% - 80px)}.main-content.expanded{margin-left:250px;width:calc(100% - 250px)}.sidebar-toggle{right:-12px}}.sp-sidebar.collapsed .sp-nav button[title]:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);background:#333;color:#fff;padding:5px 10px;border-radius:4px;font-size:.9rem;white-space:nowrap;margin-left:10px;z-index:1001;pointer-events:none;box-shadow:0 2px 5px #0003}.sp-sidebar.collapsed .sp-nav button{position:relative}.sp-sidebar,.sp-sidebar *,.main-content{transition:all .3s ease}.sp-page{display:flex;min-height:100vh;background-color:#f5f7fa}.sp-main{flex:1;padding:0;background-color:#f5f7fa;overflow-y:auto}.sp-banner{position:relative;background:linear-gradient(135deg,#667eea,#764ba2);padding:40px 30px;color:#fff;margin-bottom:30px;border-radius:0 0 20px 20px;box-shadow:0 4px 20px #0000001a}.sp-banner-overlay{position:absolute;inset:0;background:linear-gradient(135deg,#667eeae6,#764ba2e6);border-radius:0 0 20px 20px}.sp-banner-content{position:relative;z-index:2;display:flex;align-items:center;gap:30px;flex-wrap:wrap}.sp-banner-avatar{width:120px;height:120px;border-radius:50%;object-fit:cover;border:4px solid white;box-shadow:0 4px 15px #0003;transition:transform .3s ease}.sp-banner-avatar:hover{transform:scale(1.05)}.sp-banner-content h1{font-size:2.5rem;margin:0 0 10px;font-weight:600;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.sp-meta{font-size:1.1rem;opacity:.95;margin:0;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.sp-actions{margin-left:auto;display:flex;gap:12px}.sp-section{background:#fff;border-radius:16px;padding:25px 30px;margin:0 30px 30px;box-shadow:0 2px 12px #00000014;transition:box-shadow .3s ease}.sp-section:hover{box-shadow:0 4px 20px #0000001f}.sp-section h2{margin:0 0 25px;font-size:1.5rem;color:#333;font-weight:600;padding-bottom:15px;border-bottom:2px solid #f0f0f0;position:relative}.sp-section h2:after{content:"";position:absolute;bottom:-2px;left:0;width:60px;height:2px;background:linear-gradient(90deg,#667eea,#764ba2)}.sp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:25px}.sp-grid>div{background:#f8f9fa;padding:18px 20px;border-radius:12px;transition:all .3s ease;border:1px solid transparent}.sp-grid>div:hover{background:#fff;border-color:#e0e0e0;transform:translateY(-2px);box-shadow:0 4px 12px #0000000d}.sp-grid strong{display:block;font-size:.85rem;text-transform:uppercase;letter-spacing:.5px;color:#666;margin-bottom:8px;font-weight:600}.sp-grid p{margin:0;font-size:1.1rem;color:#333;font-weight:500;line-height:1.5}.sp-edit-btn,.sp-save-btn,.sp-cancel-btn,.sp-logout-inline{padding:10px 24px;border:none;border-radius:8px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 8px #0000001a}.sp-edit-btn{background:#fff;color:#667eea;border:2px solid white}.sp-edit-btn:hover{background:transparent;color:#fff;transform:translateY(-2px);box-shadow:0 4px 15px #ffffff4d}.sp-save-btn{background:#28a745;color:#fff}.sp-save-btn:hover:not(:disabled){background:#218838;transform:translateY(-2px);box-shadow:0 4px 15px #28a7454d}.sp-save-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.sp-cancel-btn{background:#dc3545;color:#fff}.sp-cancel-btn:hover{background:#c82333;transform:translateY(-2px);box-shadow:0 4px 15px #dc35454d}.sp-logout-inline{background:#fff3;color:#fff;border:2px solid white}.sp-logout-inline:hover{background:#fff;color:#667eea;transform:translateY(-2px);box-shadow:0 4px 15px #ffffff4d}.edit-input{font-size:2.5rem;font-weight:600;padding:8px 15px;border:2px solid rgba(255,255,255,.3);border-radius:10px;background:#ffffff26;color:#fff;width:100%;max-width:500px;transition:all .3s ease}.edit-input:focus{outline:none;border-color:#fff;background:#ffffff40;box-shadow:0 0 15px #ffffff4d}.edit-input::placeholder{color:#ffffffb3}.edit-field{margin-bottom:20px}.edit-field strong{display:block;margin-bottom:8px;color:#555;font-size:.9rem;text-transform:uppercase;letter-spacing:.5px}.edit-field input{width:100%;padding:12px 15px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:all .3s ease;background:#fff}.edit-field input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.edit-field input:hover{border-color:#b0b0b0}.sp-loading{text-align:center;padding:60px;font-size:1.2rem;color:#666;background:#fff;border-radius:16px;margin:30px;box-shadow:0 2px 12px #00000014}.sp-error{text-align:center;padding:40px;background:#fff3f3;color:#dc3545;border-radius:16px;margin:30px;border:1px solid #ffcdd2}.sp-error button{margin-top:20px;padding:12px 30px;background:#dc3545;color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:all .3s ease}.sp-error button:hover{background:#c82333;transform:translateY(-2px);box-shadow:0 4px 12px #dc35454d}@media (max-width: 768px){.sp-banner{padding:30px 20px}.sp-banner-content{flex-direction:column;text-align:center;gap:15px}.sp-banner-content h1{font-size:1.8rem}.sp-actions{margin-left:0;width:100%;justify-content:center;flex-wrap:wrap}.sp-section{margin:0 15px 20px;padding:20px}.sp-grid{grid-template-columns:1fr;gap:15px}.edit-input{font-size:1.8rem;text-align:center}.sp-banner-avatar{width:100px;height:100px}}@media (max-width: 480px){.sp-banner{padding:20px 15px}.sp-banner-content h1{font-size:1.5rem}.sp-meta{font-size:.95rem}.sp-section h2{font-size:1.3rem}.sp-grid strong{font-size:.8rem}.sp-grid p{font-size:1rem}.sp-edit-btn,.sp-save-btn,.sp-cancel-btn,.sp-logout-inline{padding:8px 16px;font-size:.85rem}}@media print{.sp-banner{background:none;color:#000;padding:20px}.sp-actions,.sp-edit-btn,.sp-logout-inline{display:none}.sp-section{break-inside:avoid;box-shadow:none;border:1px solid #ddd}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.sp-section{animation:fadeIn .5s ease-out}.sp-main::-webkit-scrollbar{width:8px}.sp-main::-webkit-scrollbar-track{background:#f1f1f1}.sp-main::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:4px}.sp-main::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#5a6fe0,#6b4298)}.attendance-container{display:flex;flex-direction:column;max-width:1400px;margin:0 auto;padding:30px 20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f8f9fa;min-height:100vh;width:100%}.attendance-header{text-align:center;margin-bottom:40px;padding:30px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;color:#fff;box-shadow:0 10px 30px #667eea4d;width:100%}.attendance-title{font-size:2.5rem;margin:0 0 10px;font-weight:600;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.attendance-subtitle{font-size:1.1rem;opacity:.95;margin:0;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:25px;margin-bottom:40px;width:100%}.stat-card{background:#fff;border-radius:16px;padding:25px;display:flex;align-items:center;gap:20px;box-shadow:0 4px 20px #00000014;transition:all .3s ease;border:1px solid rgba(0,0,0,.05)}.stat-card:hover{transform:translateY(-5px);box-shadow:0 8px 30px #0000001f}.stat-icon{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;flex-shrink:0}.stat-icon.present-icon{background:linear-gradient(135deg,#4caf50,#45a049)}.stat-icon.percentage-icon{background:linear-gradient(135deg,#ff9800,#f57c00)}.stat-icon.streak-icon{background:linear-gradient(135deg,#f44336,#e53935)}.stat-content{flex:1;min-width:0}.student-stat-label{font-size:.9rem;color:#666;margin:0 0 5px;text-transform:uppercase;letter-spacing:.5px}.student-stat-value{font-size:2rem;font-weight:700;color:#333;margin:0;line-height:1.2}.chart-section{background:#fff;border-radius:20px;padding:30px;margin-bottom:40px;box-shadow:0 4px 20px #00000014;width:100%}.chart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:20px}.section-title{font-size:1.5rem;color:#333;margin:0;font-weight:600}.chart-controls{display:flex;gap:15px;flex-wrap:wrap}.chart-select{padding:10px 20px;border:2px solid #e0e0e0;border-radius:10px;font-size:.95rem;color:#333;background:#fff;cursor:pointer;transition:all .3s ease;min-width:150px}.chart-select:hover{border-color:#667eea}.chart-select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.chart-container{height:400px;position:relative;width:100%}.summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:40px;width:100%}.summary-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 15px #00000014;transition:all .3s ease;display:flex}.summary-color{width:10px;height:auto;flex-shrink:0}.summary-content{flex:1;padding:20px;min-width:0}.summary-status{font-size:1.1rem;color:#333;margin:0 0 8px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.summary-count{font-size:1.5rem;font-weight:700;color:#333;margin:0 0 5px}.summary-percentage{font-size:.9rem;color:#666;margin:0}.recent-attendance{background:#fff;border-radius:20px;padding:30px;margin-bottom:40px;box-shadow:0 4px 20px #00000014;width:100%}.table-container{overflow-x:auto;margin-top:20px;width:100%}.attendance-table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:600px}.attendance-table th{background:#f8f9fa;padding:15px;text-align:left;font-weight:600;color:#333;border-bottom:2px solid #e0e0e0}.attendance-table td{padding:15px;border-bottom:1px solid #e0e0e0;color:#555}.attendance-table tbody tr:hover{background:#f8f9fa;transition:background .3s ease}.status-badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:.85rem;font-weight:500;text-align:center;white-space:nowrap}.badge-present{background:#4caf501a;color:#4caf50;border:1px solid rgba(76,175,80,.3)}.badge-absent{background:#f443361a;color:#f44336;border:1px solid rgba(244,67,54,.3)}.badge-leave{background:#ffc1071a;color:#ffc107;border:1px solid rgba(255,193,7,.3)}.badge-halfday{background:#2196f31a;color:#2196f3;border:1px solid rgba(33,150,243,.3)}.badge-holiday{background:#9c27b01a;color:#9c27b0;border:1px solid rgba(156,39,176,.3)}.subject-performance{background:#fff;border-radius:20px;padding:30px;box-shadow:0 4px 20px #00000014;width:100%}.subject-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:20px;width:100%}.subject-card{background:#f8f9fa;border-radius:16px;padding:20px;transition:all .3s ease}.subject-card:hover{transform:translateY(-3px);box-shadow:0 4px 15px #0000001a}.subject-name{font-size:1.1rem;color:#333;margin:0 0 15px;font-weight:600}.subject-progress{height:10px;background:#e0e0e0;border-radius:5px;margin-bottom:15px;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,#4caf50,#8bc34a);border-radius:5px;transition:width .3s ease}.subject-stats{display:flex;justify-content:space-between;align-items:center}.subject-present{font-size:.9rem;color:#666}.subject-percentage{font-size:1.1rem;font-weight:700;color:#4caf50}.attendance-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;background:#fff;border-radius:20px;margin:30px;padding:50px;width:calc(100% - 60px)}.loading-spinner{width:60px;height:60px;border:5px solid #f3f3f3;border-top:5px solid #667eea;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}@media (max-width: 768px){.attendance-container{padding:20px 15px}.attendance-title{font-size:2rem}.stats-grid{grid-template-columns:1fr}.chart-header{flex-direction:column;align-items:stretch}.chart-controls{flex-direction:column}.chart-select{width:100%}.chart-container{height:300px}.summary-cards,.subject-grid{grid-template-columns:1fr}.attendance-table th,.attendance-table td{padding:10px;font-size:.85rem}}@media (max-width: 480px){.attendance-title{font-size:1.5rem}.attendance-subtitle{font-size:.95rem}.stat-card{padding:15px}.stat-icon{width:50px;height:50px;font-size:24px}.student-stat-value{font-size:1.5rem}.section-title{font-size:1.3rem}.summary-status{font-size:1rem}.summary-count{font-size:1.2rem}}@media print{.attendance-container{padding:0;background:#fff;display:block}.chart-controls,.stat-card:hover{display:none}.stat-card{box-shadow:none;border:1px solid #ddd}.attendance-table{border:1px solid #ddd}}.results-container{display:flex;flex-direction:column;max-width:1400px;margin:0 auto;padding:30px 20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f8f9fa;min-height:100vh;width:100%}.results-header{text-align:center;margin-bottom:30px;padding:30px;background:linear-gradient(90deg,#5a6fe0,#6b4298);border-radius:20px;color:#fff;box-shadow:0 10px 30px #1e4b7a4d}.results-title{font-size:2.5rem;margin:0 0 10px;font-weight:600;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.results-subtitle{font-size:1.1rem;opacity:.95;margin:0;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.student-info-card{background:#fff;border-radius:16px;padding:25px;margin-bottom:30px;box-shadow:0 4px 20px #00000014;border:1px solid #e0e0e0}.student-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.info-item{display:flex;flex-direction:column;gap:5px}.info-label{font-size:.85rem;color:#666;text-transform:uppercase;letter-spacing:.5px}.info-value{font-size:1.1rem;color:#333;font-weight:600}.summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.summary-card{background:#fff;border-radius:16px;padding:20px;display:flex;align-items:center;gap:15px;box-shadow:0 4px 15px #00000014;transition:all .3s ease;border:1px solid #e0e0e0}.summary-card:hover{transform:translateY(-3px);box-shadow:0 8px 25px #0000001f}.summary-icon{width:50px;height:50px;border-radius:12px;background:linear-gradient(135deg,#1e4b7a,#2a6b9e);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px}.summary-content{flex:1}.summary-content h3{font-size:.9rem;color:#666;margin:0 0 5px;font-weight:500}.summary-value{font-size:1.5rem;font-weight:700;color:#333;margin:0;line-height:1.2}.filters-section{display:flex;gap:20px;margin-bottom:30px;flex-wrap:wrap;background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 10px #0000000d}.filter-group{flex:1;min-width:200px}.filter-group label{display:block;font-size:.85rem;color:#666;margin-bottom:5px;font-weight:500}.filter-select{width:100%;padding:10px 15px;border:2px solid #e0e0e0;border-radius:8px;font-size:.95rem;color:#333;background:#fff;cursor:pointer;transition:all .3s ease}.filter-select:hover,.filter-select:focus{border-color:#1e4b7a;outline:none;box-shadow:0 0 0 3px #1e4b7a1a}.exam-card{background:#fff;border-radius:16px;padding:25px;margin-bottom:25px;box-shadow:0 4px 20px #00000014;border:1px solid #e0e0e0;transition:all .3s ease}.exam-card:hover{box-shadow:0 8px 30px #0000001f}.exam-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #f0f0f0}.exam-title-section{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.exam-name{font-size:1.3rem;color:#333;margin:0;font-weight:600}.exam-date{font-size:.9rem;color:#666;background:#f5f5f5;padding:4px 10px;border-radius:20px}.result-badge{display:inline-block;padding:8px 20px;border-radius:30px;font-size:1rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}.result-badge.pass{background:#4caf501a;color:#2e7d32;border:2px solid #4CAF50}.result-badge.fail{background:#f443361a;color:#c62828;border:2px solid #F44336}.exam-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;margin-bottom:25px;padding:15px;background:#f8f9fa;border-radius:12px}.stat-label{display:block;font-size:.8rem;color:#666;margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:1.2rem;font-weight:700;color:#1e4b7a}.subjects-table-container{overflow-x:auto;margin-bottom:20px;border-radius:12px;border:1px solid #e0e0e0}.subjects-table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:800px}.subjects-table th{background:#f5f5f5;padding:15px;text-align:left;font-weight:600;color:#333;border-bottom:2px solid #ddd}.subjects-table td{padding:12px 15px;border-bottom:1px solid #e0e0e0;color:#555}.subjects-table tbody tr:hover{background:#f8f9fa}.subject-name{font-weight:500;color:#333}.total-marks{font-weight:600;color:#1e4b7a}.grade-badge{display:inline-block;padding:4px 10px;border-radius:20px;font-size:.85rem;font-weight:600}.grade-a{background:#4caf501a;color:#2e7d32;border:1px solid #4CAF50}.grade-b{background:#2196f31a;color:#1565c0;border:1px solid #2196F3}.grade-c{background:#ff98001a;color:#ef6c00;border:1px solid #FF9800}.grade-d{background:#f443361a;color:#c62828;border:1px solid #F44336}.status-badge{display:inline-block;padding:4px 10px;border-radius:20px;font-size:.8rem;font-weight:600}.status-badge.pass{background:#4caf501a;color:#2e7d32}.status-badge.fail{background:#f443361a;color:#c62828}.exam-footer{display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding-top:20px;border-top:1px solid #e0e0e0;flex-wrap:wrap;gap:15px}.result-summary{display:flex;align-items:center;gap:10px}.result-label{font-size:.9rem;color:#666}.result-date{font-size:.95rem;color:#333;font-weight:500}.download-btn{padding:10px 25px;background:linear-gradient(135deg,#1e4b7a,#2a6b9e);color:#fff;border:none;border-radius:8px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:8px}.download-btn:hover{transform:translateY(-2px);box-shadow:0 4px 15px #1e4b7a4d}.download-btn:active{transform:translateY(0)}.no-results{text-align:center;padding:60px;background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014}.no-results p{font-size:1.1rem;color:#666;margin:0}@media (max-width: 768px){.results-container{padding:20px 15px}.results-title{font-size:2rem}.results-subtitle{font-size:1rem}.student-info-grid{grid-template-columns:1fr;gap:15px}.summary-cards{grid-template-columns:1fr}.filters-section{flex-direction:column}.filter-group{width:100%}.exam-header{flex-direction:column;align-items:flex-start;gap:15px}.exam-title-section{width:100%;justify-content:space-between}.exam-stats{grid-template-columns:1fr;gap:10px}.stat-item{display:flex;justify-content:space-between;align-items:center;text-align:left}.stat-label{margin-bottom:0}.exam-footer{flex-direction:column;align-items:stretch}.result-summary{justify-content:center}.download-btn{width:100%;justify-content:center}}@media (max-width: 480px){.results-title{font-size:1.5rem}.exam-name{font-size:1.1rem}.exam-date{font-size:.8rem}.summary-value{font-size:1.2rem}.subjects-table th,.subjects-table td{padding:10px;font-size:.85rem}}@media print{.results-container{padding:0;background:#fff}.results-header{background:none;color:#000;box-shadow:none;padding:20px 0}.filters-section,.download-btn,.summary-cards{display:none}.exam-card{break-inside:avoid;box-shadow:none;border:1px solid #ddd}.subjects-table{border:1px solid #ddd}}.exam-card{animation:fadeIn .5s ease-out}.tp-page{display:flex;min-height:100vh;transition:all .3s ease}.tp-sidebar{width:250px;min-height:100vh;background:linear-gradient(90deg,#5a6fe0,#6b4298);color:#fff;padding:20px;display:flex;flex-direction:column;position:relative;transition:width .3s ease,padding .3s ease;overflow-y:auto}.tp-sidebar.collapsed{width:80px;padding:20px 10px}.sidebar-toggle{position:absolute;top:10px;right:9px;width:24px;height:24px;background:#3498db;border:2px solid white;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;z-index:100;transition:all .3s ease}.sidebar-toggle:hover{background:#2c3e50;transform:scale(1.1)}.tp-sidebar.collapsed .sidebar-toggle{right:25px}.tp-sidebar-top{text-align:center;margin-bottom:30px;transition:all .3s ease}.tp-avatar-wrap{display:flex;justify-content:center;margin-bottom:10px}.tp-avatar{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid white;transition:all .3s ease}.tp-sidebar.collapsed .tp-avatar{margin-top:32px;width:50px;height:50px}.tp-name{margin:5px 0;font-size:1.1rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all .3s ease}.tp-small{font-size:.8rem;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tp-subject{font-size:.85rem;color:#f1c40f;font-weight:500;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tp-nav{display:flex;flex-direction:column;gap:10px}.tp-nav button{padding:12px 15px;border:none;border-radius:8px;background:#ffffff1a;color:#fff;font-size:1rem;font-weight:500;text-align:left;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;white-space:nowrap;overflow:hidden}.tp-nav button:hover{background:#fff3;transform:translate(5px)}.tp-nav button.active{background:#fff;color:#2c3e50;font-weight:600}.tp-nav button.tp-logout{margin-top:20px;background:#ffffff26;border:1px solid rgba(255,255,255,.3)}.tp-nav button.tp-logout:hover{background:#e74c3c4d}.tp-sidebar.collapsed .tp-nav button{padding:12px;justify-content:center;text-align:center}.tp-sidebar.collapsed .tp-nav button span{display:none}.tp-main-content{flex:1;padding:20px;background-color:#f9f9f9;min-height:100vh;overflow-y:auto;transition:margin-left .3s ease,width .3s ease}.tp-loading{text-align:center;padding:50px;font-size:1.2rem;color:#666}.tp-sidebar.collapsed .tp-nav button[title]:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);background:#333;color:#fff;padding:5px 10px;border-radius:4px;font-size:.9rem;white-space:nowrap;margin-left:10px;z-index:1001;pointer-events:none;box-shadow:0 2px 5px #0003}.tp-sidebar.collapsed .tp-nav button{position:relative}.tp-sidebar,.tp-sidebar *,.tp-main-content{transition:all .3s ease}@media (max-width: 768px){.tp-sidebar{position:fixed;left:0;top:0;z-index:1000;transform:translate(0)}.tp-sidebar.collapsed{transform:translate(-70px)}.tp-main-content{margin-left:80px;width:calc(100% - 80px)}.tp-main-content.expanded{margin-left:250px;width:calc(100% - 250px)}.sidebar-toggle{right:-12px}}@media (max-width: 480px){.tp-sidebar{width:220px}.tp-sidebar.collapsed{width:70px}.tp-main-content{margin-left:70px;width:calc(100% - 70px)}.tp-main-content.expanded{margin-left:220px;width:calc(100% - 220px)}.tp-name{font-size:1rem}.tp-small,.tp-subject{font-size:.75rem}}.tp-profile-container{max-width:1200px;margin:-39px auto;padding:20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.tp-profile-header{display:flex;gap:40px;align-items:center;background:linear-gradient(90deg,#5a6fe0,#6b4298);padding:40px;border-radius:16px;margin-bottom:30px;color:#fff;box-shadow:0 4px 20px #2c3e5033}.tp-profile-avatar{width:150px;height:150px;border-radius:50%;overflow:hidden;border:4px solid white;box-shadow:0 4px 15px #0003}.tp-profile-avatar img{width:100%;height:100%;object-fit:cover}.tp-profile-info{flex:1}.tp-profile-info h1{font-size:2.2rem;margin:0 0 10px;font-weight:600}.tp-teacher-id,.tp-school-code,.tp-teacher-subject{font-size:1rem;margin:5px 0;opacity:.9}.tp-teacher-subject{color:#f1c40f;font-weight:500;margin-top:10px}.tp-edit-btn{margin-top:15px;padding:10px 25px;background:#fff;color:#2c3e50;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:inline-flex;align-items:center;gap:8px}.tp-edit-btn:hover{transform:translateY(-2px);box-shadow:0 4px 15px #ffffff4d}.tp-profile-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(500px,1fr));gap:30px}.tp-section{background:#fff;border-radius:16px;padding:30px;box-shadow:0 4px 20px #00000014;border:1px solid #e0e0e0}.tp-section h2{font-size:1.3rem;color:#2c3e50;margin:0 0 20px;padding-bottom:10px;border-bottom:2px solid #f0f0f0}.tp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.tp-info-item{display:flex;flex-direction:column;gap:5px}.tp-info-item.tp-full-width{grid-column:span 2}.tp-info-item label{font-size:.85rem;color:#666;text-transform:uppercase;letter-spacing:.5px}.tp-info-item p{font-size:1.1rem;color:#333;margin:0;font-weight:500;line-height:1.5}.tp-profile-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px}.loading-spinner{width:50px;height:50px;border:5px solid #f3f3f3;border-top:5px solid #3498db;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}@media (max-width: 768px){.tp-profile-header{flex-direction:column;text-align:center;padding:30px}.tp-profile-info h1{font-size:1.8rem}.tp-profile-content,.tp-grid{grid-template-columns:1fr}.tp-info-item.tp-full-width{grid-column:span 1}}@media (max-width: 480px){.tp-profile-header{padding:20px}.tp-profile-avatar{width:120px;height:120px}.tp-profile-info h1{font-size:1.5rem}.tp-section{padding:20px}.tp-section h2{font-size:1.1rem}.tp-info-item p{font-size:1rem}}.attendance-container{padding:24px;max-width:1200px;margin:0 auto;min-height:100vh;background:#f8fafc}.attendance-card{background:#fff;border-radius:16px;padding:32px;box-shadow:0 1px 3px #0000001a}.header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;padding-bottom:16px;border-bottom:2px solid #f3f4f6}.attendance-title{font-size:24px;color:#1f2937;margin:0;display:flex;align-items:center;gap:12px}.attendance-title i{color:#4c2bb5}.student-attendance-btn{background:linear-gradient(135deg,#4c2bb5,#6b46c1);color:#fff;border:none;padding:10px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:8px}.student-attendance-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #4c2bb54d}.no-data{text-align:center;padding:60px 24px;color:#9ca3af}.no-data i{font-size:64px;color:#e5e7eb;margin-bottom:16px}.no-data p{font-size:16px;color:#6b7280;margin-bottom:8px}.no-data small{font-size:13px;color:#9ca3af}.assigned-class-info{animation:fadeIn .5s ease}.class-badge-large{background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-radius:16px;padding:32px;text-align:center}.class-icon{width:80px;height:80px;background:linear-gradient(135deg,#4c2bb5,#6b46c1);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:#fff;font-size:40px}.class-details h3{font-size:20px;color:#374151;margin-bottom:24px;font-weight:500}.class-section-wrapper{display:flex;justify-content:center;gap:16px;margin-bottom:24px;flex-wrap:wrap}.class-standard{font-size:32px;font-weight:700;color:#4c2bb5;background:#eef2ff;padding:12px 24px;border-radius:12px;display:inline-block}.class-section{font-size:32px;font-weight:700;padding:12px 24px;border-radius:12px;display:inline-block}.teacher-name{font-size:16px;color:#4b5563;margin-bottom:12px;display:flex;align-items:center;justify-content:center;gap:8px}.teacher-name i{color:#4c2bb5}.responsibility{font-size:14px;color:#6b7280;margin-top:16px;display:flex;align-items:center;justify-content:center;gap:8px;background:#f9fafb;padding:12px;border-radius:8px;max-width:500px;margin-left:auto;margin-right:auto}.responsibility i{color:#4c2bb5}@media (max-width: 768px){.attendance-container{padding:16px}.attendance-card{padding:20px}.header-row{flex-direction:column;gap:16px;text-align:center}.attendance-title{font-size:20px}.student-attendance-btn{width:100%;justify-content:center}.class-badge-large{padding:20px}.class-standard,.class-section{font-size:24px;padding:8px 16px}.class-section-wrapper{flex-direction:column;align-items:center}.teacher-name,.responsibility{font-size:13px}}@media (max-width: 480px){.class-standard,.class-section{font-size:20px;padding:6px 12px}.class-icon{width:60px;height:60px;font-size:30px}.class-details h3{font-size:18px}}.quick-actions{display:flex;gap:12px;justify-content:center;margin-top:24px;flex-wrap:wrap}.quick-action-btn{background:#fff;border:1px solid #e5e7eb;padding:8px 20px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:8px;color:#374151}.quick-action-btn:hover{background:#4c2bb5;border-color:#4c2bb5;color:#fff;transform:translateY(-1px)}.quick-action-btn:hover i{color:#fff}.quick-action-btn i{color:#4c2bb5;transition:color .2s ease}.header-info{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.search-left{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:12px;color:#9ca3af;font-size:14px}.search-input{padding:10px 12px 10px 36px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;width:280px;transition:all .2s}.error-state{text-align:center;padding:60px 24px;color:#ef4444}.error-state i{font-size:48px;margin-bottom:16px}.error-state p{font-size:16px;margin-bottom:8px}.error-state small{font-size:13px;color:#9ca3af}.no-records{text-align:center;padding:40px;color:#9ca3af}.no-records i{font-size:32px;margin-bottom:8px;display:block}.saved-note{font-size:11px;color:#10b981;margin-top:4px;display:flex;align-items:center;justify-content:center;gap:4px}.saved-note i{font-size:10px}.student-count{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:#f3f4f6;border-radius:20px;font-size:13px;color:#374151}.status-select{padding:8px 12px;border-radius:6px;border:1px solid #e5e7eb;font-size:14px;cursor:pointer;transition:all .2s}.status-select.present{background-color:#d1fae5;color:#065f46;border-color:#10b981}.status-select.absent{background-color:#fee2e2;color:#991b1b;border-color:#ef4444}.status-select.leave{background-color:#fed7aa;color:#9b2c1d;border-color:#f59e0b}.success-toast{position:fixed;bottom:20px;right:20px;background:#10b981;color:#fff;padding:12px 20px;border-radius:8px;font-size:14px;z-index:1000;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.row-saved{background-color:#f0fdf4;transition:background-color .3s}.save-btn i{margin-right:6px}.saved-note i{font-size:14px;color:#10b981;margin-top:4px;display:inline-block}.teacher-classes-container{padding:24px;max-width:1400px;margin:0 auto;background:#f8fafc;min-height:100vh}.page-header{margin-bottom:32px}.page-header h2{font-size:28px;color:#1f2937;margin-bottom:8px;display:flex;align-items:center;gap:12px}.page-header h2 i{color:#4c2bb5;font-size:28px}.page-header p{color:#6b7280;font-size:14px;margin-left:40px}.message{padding:12px 16px;border-radius:8px;margin-bottom:24px;display:flex;align-items:center;gap:12px;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.message.success{background:#d1fae5;border-left:4px solid #10b981;color:#065f46}.message.error{background:#fee2e2;border-left:4px solid #ef4444;color:#991b1b}.message i{font-size:18px}.message span{flex:1;font-size:14px}.assignment-form-card{background:#fff;border-radius:16px;padding:24px;margin-bottom:32px;box-shadow:0 1px 3px #0000001a;transition:box-shadow .3s ease}.assignment-form-card:hover{box-shadow:0 4px 12px #0000001a}.card-header{display:flex;align-items:center;gap:12px;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #f3f4f6}.card-header i{font-size:24px;color:#4c2bb5}.card-header h3{font-size:20px;color:#1f2937;margin:0;flex:1}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;align-items:end}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:500;color:#374151}.form-group .required{color:#ef4444;margin-left:4px}.form-group select{padding:10px 12px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;color:#1f2937;background:#fff;cursor:pointer;transition:all .2s ease}.form-group select:hover{border-color:#4c2bb5}.form-group select:focus{outline:none;border-color:#4c2bb5;box-shadow:0 0 0 3px #4c2bb51a}.form-group select:disabled{background:#f3f4f6;cursor:not-allowed;color:#9ca3af}.form-actions{display:flex;gap:12px}.btn-primary{background:linear-gradient(135deg,#4c2bb5,#6b46c1);color:#fff;border:none;padding:10px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:8px}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #4c2bb54d}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:#f3f4f6;color:#374151;border:1px solid #e5e7eb;padding:10px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:8px}.btn-secondary:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db}.btn-secondary:disabled{opacity:.6;cursor:not-allowed}.assigned-classes-card{background:#fff;border-radius:16px;padding:24px;margin-bottom:32px;box-shadow:0 1px 3px #0000001a}.count-badge{background:#eef2ff;color:#4c2bb5;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500}.table-responsive{overflow-x:auto;margin-top:20px}.data-table thead{background:#f9fafb;border-bottom:2px solid #e5e7eb}.data-table th{text-align:left;padding:12px 16px;font-size:14px;font-weight:600;color:#374151}.data-table td{padding:16px;border-bottom:1px solid #f3f4f6;font-size:14px;color:#1f2937}.data-table tbody tr{transition:background .2s ease}.data-table tbody tr:hover{background:#f9fafb}.class-badge{display:inline-block;padding:4px 12px;background:#eef2ff;color:#4c2bb5;border-radius:6px;font-size:13px;font-weight:500}.section-badge{display:inline-block;padding:4px 12px;border-radius:6px;font-size:13px;font-weight:500}.section-badge.sec-a{background:#dbeafe;color:#1e40af}.section-badge.sec-b{background:#dcfce7;color:#166534}.section-badge.sec-c{background:#fed7aa;color:#9b2c1d}.section-badge.sec-d{background:#fbcfe8;color:#9d174d}.subject-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:#f3e8ff;color:#6b21a5;border-radius:6px;font-size:13px;font-weight:500}.subject-badge i{font-size:12px}.action-buttons{display:flex;gap:8px}.btn-icon{padding:6px 12px;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:6px;font-size:13px}.btn-icon.edit{background:#eef2ff;color:#4c2bb5}.btn-icon.edit:hover:not(:disabled){background:#4c2bb5;color:#fff;transform:translateY(-1px)}.btn-icon.delete{background:#fee2e2;color:#ef4444}.btn-icon.delete:hover:not(:disabled){background:#ef4444;color:#fff;transform:translateY(-1px)}.btn-icon:disabled{opacity:.5;cursor:not-allowed}.stats-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;padding:24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;color:#fff}.stat-item{display:flex;align-items:center;gap:16px}.stat-item i{font-size:32px;opacity:.9}.stat-item div{display:flex;flex-direction:column}.stat-value{font-size:28px;font-weight:700;line-height:1;margin-bottom:4px;color:#fff!important}.stat-label{font-size:13px;opacity:.9;color:#fff!important}.loading-state{text-align:center;padding:60px 24px;color:#6b7280}.loading-state i{font-size:48px;color:#4c2bb5;margin-bottom:16px;display:inline-block}.loading-state p{font-size:14px;margin-top:8px}.empty-state{text-align:center;padding:60px 24px;color:#9ca3af}.empty-state i{font-size:64px;color:#e5e7eb;margin-bottom:16px}.empty-state p{font-size:16px;color:#6b7280;margin-bottom:8px}.empty-state small{font-size:13px;color:#9ca3af}@media (max-width: 768px){.teacher-classes-container{padding:16px}.page-header h2{font-size:24px}.page-header p{margin-left:0;font-size:13px}.form-grid{grid-template-columns:1fr;gap:16px}.form-actions{justify-content:flex-end}.btn-primary,.btn-secondary{padding:8px 16px;font-size:13px}.card-header{margin-bottom:20px}.card-header h3{font-size:18px}.data-table th,.data-table td{padding:12px}.stats-card{grid-template-columns:1fr;gap:16px}.stat-item{justify-content:center}.action-buttons{flex-direction:column;gap:6px}.btn-icon{justify-content:center}}@media (max-width: 480px){.teacher-classes-container{padding:12px}.assignment-form-card,.assigned-classes-card{padding:16px}.data-table{font-size:12px}.data-table th,.data-table td{padding:8px}.class-badge,.section-badge,.subject-badge{padding:2px 8px;font-size:11px}.btn-icon{padding:4px 8px;font-size:11px}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.teacher-classes-container{animation:fadeIn .3s ease}::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}@media print{.teacher-classes-container{background:#fff;padding:0}.assignment-form-card,.stats-card{break-inside:avoid}.btn-primary,.btn-secondary,.action-buttons{display:none}}.ts-container{padding:24px;max-width:1400px;margin:0 auto;background:#f8fafc;min-height:100vh}.ts-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #e5e7eb}.ts-header-left{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.ts-title{font-size:24px;color:#1f2937;margin:0;display:flex;align-items:center;gap:12px}.ts-title i{color:#4c2bb5;font-size:28px}.class-info-badge{display:flex;gap:12px;align-items:center}.class-standard{background:#eef2ff;color:#4c2bb5;padding:6px 16px;border-radius:20px;font-weight:600;font-size:14px}.class-section{padding:6px 16px;border-radius:20px;font-weight:600;font-size:14px}.class-section.sec-a{background:#dbeafe;color:#1e40af}.class-section.sec-b{background:#dcfce7;color:#166534}.class-section.sec-c{background:#fed7aa;color:#9b2c1d}.class-section.sec-d{background:#fbcfe8;color:#9d174d}.ts-stats{display:flex;gap:12px;flex-wrap:wrap}.stat-badge{display:flex;align-items:center;gap:8px;padding:6px 14px;background:#f3f4f6;border-radius:20px;font-size:13px;font-weight:500;color:#374151}.stat-badge i{font-size:14px}.stat-badge.boys i{color:#3b82f6}.stat-badge.girls i{color:#ec489a}.ts-search{position:relative;margin-bottom:24px}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#9ca3af;font-size:14px}.search-input{width:100%;padding:12px 40px;border:1px solid #e5e7eb;border-radius:12px;font-size:14px;transition:all .2s}.search-input:focus{outline:none;border-color:#4c2bb5;box-shadow:0 0 0 3px #4c2bb51a}.clear-search{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;color:#9ca3af;cursor:pointer;font-size:14px;padding:4px}.clear-search:hover{color:#ef4444}.ts-loading{text-align:center;padding:60px 24px;color:#6b7280}.ts-loading i{font-size:48px;color:#4c2bb5;margin-bottom:16px;display:inline-block}.error-state,.empty-state{text-align:center;padding:60px 24px}.error-state i,.empty-state i{font-size:64px;margin-bottom:16px}.error-state i{color:#ef4444}.empty-state i{color:#e5e7eb}.error-state p,.empty-state p{font-size:16px;color:#6b7280;margin-bottom:8px}.error-state small,.empty-state small{font-size:13px;color:#9ca3af}.ts-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px;margin-top:20px}.ts-card{background:#fff;border-radius:16px;padding:20px;display:flex;gap:16px;transition:all .3s ease;box-shadow:0 1px 3px #0000001a;border:1px solid #f3f4f6}.ts-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;border-color:#e5e7eb}.ts-card-photo{flex-shrink:0}.student-photo{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid #eef2ff}.ts-card-details{flex:1}.ts-card-details h4{font-size:18px;font-weight:600;color:#1f2937;margin-bottom:12px}.student-info-grid{display:flex;flex-direction:column;gap:8px}.info-item{display:flex;align-items:center;gap:8px;font-size:13px;color:#4b5563}.info-item i{width:20px;color:#4c2bb5;font-size:12px}.info-item strong{font-weight:600;color:#374151;margin-right:4px}@media (max-width: 768px){.ts-container{padding:16px}.ts-header{flex-direction:column;align-items:stretch}.ts-header-left{flex-direction:column;align-items:flex-start}.ts-title{font-size:20px}.ts-stats{justify-content:flex-start}.ts-list{grid-template-columns:1fr}.ts-card{flex-direction:column;align-items:center;text-align:center}.student-info-grid{align-items:center}.info-item{justify-content:center}}@media (max-width: 480px){.class-info-badge{flex-direction:column;align-items:flex-start}.stat-badge{font-size:12px;padding:4px 10px}}.fee-container{max-width:900px;margin:auto;padding:20px;font-family:Arial,sans-serif}h2{text-align:center;margin-bottom:20px}.fee-form{display:flex;gap:15px;justify-content:center;margin-bottom:25px}.fee-form input{padding:12px;border-radius:8px;border:1px solid #ccc;width:220px}.fee-form button{padding:12px 25px;background:#0059d6;color:#fff;border:none;border-radius:8px;cursor:pointer}.table-container{margin-top:20px}.payment-table{width:100%;border-collapse:collapse}.payment-table th,.payment-table td{padding:12px;border-bottom:1px solid #ccc;text-align:center}.payment-table th{background:#004aad;color:#fff}.view-btn{padding:6px 10px;background-color:#2196f3;border:none;border-radius:4px;color:#fff;margin-right:5px;cursor:pointer}.download-btn{padding:6px 10px;background-color:#4caf50;border:none;border-radius:4px;color:#fff;cursor:pointer}.view-btn:hover{background-color:#0b7dda}.download-btn:hover{background-color:#3e8e41}:root{--accent-purple: #4c2bb5;--accent-blue: #2563eb;--success: #10b981;--warning: #f59e0b;--danger: #ef4444;--text-h: #1e293b;--text-b: #334155;--text-muted: #64748b;--border: #e2e8f0;--surface-2: #f8fafc;--surface-3: #f1f5f9;--shadow-card: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-glow: 0 0 0 3px rgba(76, 43, 181, .1);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 18px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Outfit,-apple-system,BlinkMacSystemFont,sans-serif;background:#f9fafc;color:var(--text-b)}.content{padding:32px 36px;flex:1;max-width:1400px;margin:0 auto}.page-header{margin-bottom:28px}.page-header-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:8px}.ph-left{display:flex;align-items:center;gap:16px}.ph-icon{width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,#4c2bb5,#7c4fe0);display:flex;align-items:center;justify-content:center;font-size:1.35rem;color:#fff;box-shadow:0 6px 20px #6366f159}.ph-text h1{font-size:1.65rem;font-weight:800;color:var(--text-h);letter-spacing:-.4px;margin:0}.ph-text p{font-size:.9rem;color:var(--text-muted);margin-top:2px}.ph-stats{display:flex;gap:12px;flex-wrap:wrap}.ph-stat{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-card)}.ph-stat-dot{width:8px;height:8px;border-radius:50%}.ph-stat-val{font-weight:700;font-size:.95rem;color:var(--text-h)}.ph-stat-lbl{font-size:.8rem;color:var(--text-muted)}.assign-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-xl);padding:28px 32px;margin-bottom:24px;box-shadow:var(--shadow-card);position:relative;overflow:hidden}.assign-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#4c2bb5,#7c4fe0,#2563eb)}.assign-card-title{font-size:1rem;font-weight:700;color:var(--text-h);margin-bottom:20px;display:flex;align-items:center;gap:9px}.assign-card-title i{color:var(--accent-purple);font-size:1.1rem}.assign-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:16px;align-items:end}.form-group{display:flex;flex-direction:column;gap:6px}.form-label{font-size:.8rem;font-weight:700;color:var(--text-h);text-transform:uppercase;letter-spacing:.8px}.form-select,.form-input{padding:12px 38px 12px 16px;font-family:Outfit,sans-serif;font-size:.95rem;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text-h);cursor:pointer;transition:all .2s;outline:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238b91c4' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}.form-input{background-image:none;padding-right:16px;cursor:text}.form-select:focus,.form-input:focus{border-color:var(--accent-purple);box-shadow:var(--shadow-glow);background:#fff}.form-select:disabled{background-color:#e9ecef;cursor:not-allowed;opacity:.7}.btn-assign{padding:12px 24px;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border:none;border-radius:var(--radius-md);font-family:Outfit,sans-serif;font-size:.95rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s;white-space:nowrap;box-shadow:0 4px 14px #2563eb59}.btn-assign:hover{transform:translateY(-2px);box-shadow:0 8px 24px #2563eb73}.btn-assign:active{transform:translateY(0)}.btn-cancel{padding:12px 24px;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text-b);font-family:Outfit,sans-serif;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}.btn-cancel:hover{border-color:var(--accent-purple);color:var(--accent-purple);background:#fff}.table-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-card)}.table-toolbar{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);gap:16px;flex-wrap:wrap}.table-toolbar-left{display:flex;align-items:center;gap:12px}.toolbar-title{font-size:1.05rem;font-weight:700;color:var(--text-h)}.count-pill{padding:3px 10px;border-radius:20px;background:linear-gradient(135deg,#4c2bb51f,#7c4fe01f);color:var(--accent-purple);font-size:.78rem;font-weight:700}.table-toolbar-right{display:flex;align-items:center;gap:10px}.search-wrap{position:relative}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:.9rem}.search-box{padding:9px 14px 9px 36px;font-family:Outfit,sans-serif;font-size:.875rem;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text-h);outline:none;width:220px;transition:all .2s}.search-box:focus{border-color:var(--accent-purple);box-shadow:var(--shadow-glow);background:#fff;width:260px}.search-box::placeholder{color:var(--text-muted);opacity:.7}.filter-select-sm{padding:9px 32px 9px 12px;font-family:Outfit,sans-serif;font-size:.875rem;background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text-h);outline:none;appearance:none;-webkit-appearance:none;cursor:pointer;transition:all .2s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%238b91c4' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.filter-select-sm:focus{border-color:var(--accent-purple);box-shadow:var(--shadow-glow);background:#fff}.data-table{width:100%;border-collapse:collapse}.data-table thead{background:var(--surface-3)}.data-table th{padding:12px 20px;text-align:left;font-size:.75rem;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid var(--border)}.data-table th:first-child{padding-left:24px}.data-table th:last-child{padding-right:24px}.data-table td{padding:0;border-bottom:1px solid var(--border);font-size:.925rem}.data-table tbody tr{transition:background .15s}.data-table tbody tr:hover{background:#6366f106}.td-inner{display:flex;align-items:center;padding:16px 20px;gap:10px}.td-inner:first-child{padding-left:24px}.std-badge{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;font-weight:800;font-size:.9rem;background:linear-gradient(135deg,#4c2bb51f,#7c4fe01f);color:var(--accent-purple);border:1.5px solid rgba(124,79,224,.2);font-family:JetBrains Mono,monospace}.sec-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 13px;border-radius:20px;font-weight:700;font-size:.85rem}.sec-a{background:#10b9811a;color:#059669;border:1px solid rgba(16,185,129,.25)}.sec-b{background:#2563eb1a;color:#1d4ed8;border:1px solid rgba(37,99,235,.2)}.sec-c{background:#f59e0b1a;color:#b45309;border:1px solid rgba(245,158,11,.25)}.sec-d{background:#ef44441a;color:#dc2626;border:1px solid rgba(239,68,68,.2)}.teacher-cell{display:flex;align-items:center;gap:10px}.teacher-avatar{width:34px;height:34px;border-radius:9px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.75rem;color:#fff;object-fit:cover}.teacher-name{font-weight:600;color:var(--text-h)}.teacher-sub{font-size:.78rem;color:var(--text-muted);font-family:JetBrains Mono,monospace}.id-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;background:var(--surface-3);border-radius:6px;border:1px solid var(--border);font-family:JetBrains Mono,monospace;font-size:.8rem;color:var(--text-muted);font-weight:600}.id-chip i{font-size:.65rem;color:var(--accent-purple)}.action-wrap{display:flex;gap:8px}.btn-edit,.btn-delete{padding:7px 16px;border:none;border-radius:var(--radius-sm);font-family:Outfit,sans-serif;font-size:.82rem;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:5px}.btn-edit{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;box-shadow:0 3px 8px #f59e0b4d}.btn-edit:hover{transform:translateY(-1px);box-shadow:0 5px 14px #f59e0b66}.btn-delete{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 3px 8px #ef44444d}.btn-delete:hover{transform:translateY(-1px);box-shadow:0 5px 14px #ef444466}.empty-state{padding:52px 24px;text-align:center}.empty-icon{font-size:3rem;color:var(--border);margin-bottom:12px}.empty-text{color:var(--text-muted);font-size:.95rem}.modal-overlay{position:fixed;inset:0;background:#140e3c8c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s}.modal-overlay.open{opacity:1;pointer-events:all}.modal{background:#fff;border-radius:var(--radius-xl);padding:32px;width:480px;max-width:95vw;box-shadow:0 24px 60px #4c2bb540;transform:translateY(20px);transition:transform .25s;position:relative}.modal-overlay.open .modal{transform:translateY(0)}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.modal-title{font-size:1.15rem;font-weight:800;color:var(--text-h);display:flex;align-items:center;gap:10px}.modal-title i{color:var(--accent-purple)}.modal-close{width:32px;height:32px;border-radius:8px;background:var(--surface-2);border:1px solid var(--border);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:.9rem;transition:all .2s}.modal-close:hover{background:#ef44441a;border-color:var(--danger);color:var(--danger)}.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}.modal-full{grid-column:1 / -1}.modal-footer{display:flex;gap:10px;justify-content:flex-end}.btn-save{padding:10px 28px;background:linear-gradient(135deg,#4c2bb5,#7c4fe0);border:none;border-radius:var(--radius-md);color:#fff;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .2s;box-shadow:0 4px 14px #6366f159;display:flex;align-items:center;gap:8px}.btn-save:hover{transform:translateY(-1px);box-shadow:0 7px 20px #6366f173}.del-confirm{text-align:center;padding:8px 0}.del-icon{width:64px;height:64px;border-radius:50%;background:#ef44441a;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:1.6rem;color:var(--danger)}.del-confirm h3{font-size:1.1rem;font-weight:800;color:var(--text-h);margin-bottom:8px}.del-confirm p{color:var(--text-muted);font-size:.9rem;margin-bottom:8px}.del-confirm-name{font-weight:700;color:var(--text-h)}.toast{position:fixed;bottom:28px;right:28px;z-index:300;display:flex;align-items:center;gap:12px;padding:14px 20px;background:#fff;border-radius:var(--radius-lg);box-shadow:0 8px 32px #4c2bb52e,0 1px 4px #00000014;border:1px solid var(--border);transform:translateY(80px);opacity:0;transition:all .35s cubic-bezier(.34,1.56,.64,1);max-width:340px}.toast.show{transform:translateY(0);opacity:1}.toast-icon{width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.toast-icon.success{background:#10b9811f;color:var(--success)}.toast-icon.error{background:#ef44441f;color:var(--danger)}.toast-icon.info{background:#6366f11f;color:var(--accent-purple)}.toast-body{flex:1}.toast-title{font-weight:700;font-size:.9rem;color:var(--text-h)}.toast-msg{font-size:.8rem;color:var(--text-muted)}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.table-row-enter{animation:fadeSlideIn .3s ease forwards}@media (max-width: 1100px){.assign-form{grid-template-columns:1fr 1fr}.assign-form .btn-assign{grid-column:span 2}}@media (max-width: 768px){.content{padding:20px 16px}.ph-left{flex-direction:column;align-items:flex-start;gap:8px}.ph-text h1{font-size:1.4rem}.assign-form{grid-template-columns:1fr}.assign-form .btn-assign{grid-column:span 1}.table-toolbar{flex-direction:column;align-items:flex-start}.table-toolbar-right{width:100%;flex-direction:column}.search-wrap,.search-box{width:100%}.search-box:focus{width:100%}.filter-select-sm{width:100%}.data-table{overflow-x:auto;display:block}.toast{left:16px;right:16px;max-width:none}}.content.loading{opacity:.7;pointer-events:none;position:relative}.content.loading:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent-purple);border-radius:50%;animation:spin .8s linear infinite}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent-purple);outline-offset:2px}::-webkit-scrollbar-track{background:var(--surface-2);border-radius:8px}::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:8px}::-webkit-scrollbar-thumb:hover{background:var(--accent-purple)}.dashboard-container{min-height:100vh;background:#f5f7fb;padding:0;font-family:Arial,sans-serif}.dashboard-header{background:linear-gradient(90deg,#667eea,#764ba2);padding:32px;border-radius:24px;display:flex;justify-content:space-between;align-items:center;color:#fff}.header-left{display:flex;align-items:center;gap:16px}.icon-circle{width:56px;height:56px;border-radius:50%;background:#ffffff40;display:flex;align-items:center;justify-content:center}.dashboard-header h1{margin:0;font-size:28px}.dashboard-header p{margin-top:4px;opacity:.85}.logout-btn{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;padding:10px 18px;border-radius:14px;display:flex;align-items:center;gap:8px;cursor:pointer}.logout-btn:hover{background:#fff3}.section-title{margin:40px 0 20px;font-size:24px;font-weight:600}.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-bottom:40px}.stat-card{position:relative;background:#fff;border:1px solid #d6deee;border-radius:16px;padding:24px;cursor:pointer;transition:.2s ease}.stat-card:hover{box-shadow:0 8px 20px #0000000f;transform:translateY(-3px)}.stat-growth{position:absolute;top:16px;right:16px;padding:4px 10px;border-radius:999px;font-size:14px;font-weight:700}.stat-icon{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}.stat-title{font-size:16px;color:#666;margin-bottom:8px}.admin-stat-value{font-size:28px;font-weight:700}.stat-blue .stat-icon,.stat-blue .stat-growth{background:#e8f2ff;color:#0b3c7a}.stat-green .stat-icon,.stat-green .stat-growth{background:#e8fce8;color:#0f6b1f}.stat-orange .stat-icon,.stat-orange .stat-growth{background:#fff3e3;color:#8a4b00}.stat-red .stat-icon,.stat-red .stat-growth{background:#fdeaea;color:#8a1f1f}.stat-gray .stat-icon,.stat-gray .stat-growth{background:#f1f3f5;color:#444}.management-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}.manage-card{position:relative;background:#fff;border:1px solid #d6deee;border-radius:16px;padding:24px}.manage-icon{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}.manage-card h3{margin:10px 0 6px;font-size:20px}.manage-card p{color:#555;margin-bottom:20px}.manage-count{position:absolute;top:16px;right:16px;padding:4px 10px;border-radius:999px;font-size:14px;font-weight:700}.manage-btn{border:none;padding:10px 18px;border-radius:10px;font-weight:600;cursor:pointer}.bg-green{background:#e8fce8;color:#0f6b1f}.bg-blue{background:#e8f2ff;color:#0b3c7a}.bg-orange{background:#fff3e3;color:#8a4b00}.bg-red{background:#fdeaea;color:#8a1f1f}.bg-gray{background:#f1f3f5;color:#444}.count-green,.btn-green{background:#e8fce8;color:#0f6b1f}.count-blue,.btn-blue{background:#e8f2ff;color:#0b3c7a}.count-orange,.btn-orange{background:#fff3e3;color:#8a4b00}.count-red,.btn-red{background:#fdeaea;color:#8a1f1f}.count-gray,.btn-gray{background:#f1f3f5;color:#444}.manage-card{cursor:pointer}.card-link{text-decoration:none;color:inherit}.dues-container{max-width:1100px;margin:auto;padding:24px;font-family:Segoe UI,system-ui,sans-serif;background:linear-gradient(90deg,#667eea,#764ba2)}.dues-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 6px 18px #00000014}.dues-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.dues-header h2{margin:0;color:#1f2937}.student-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:20px}.info-box{background:#f1f5f9;padding:12px 16px;border-radius:8px;font-size:14px}.summary-box{display:flex;gap:16px;margin-bottom:20px}.summary-card{flex:1;padding:16px;border-radius:10px;color:#fff}.summary-card.amount{background:linear-gradient(135deg,#ef4444,#dc2626)}.summary-card.date{background:linear-gradient(135deg,#2563eb,#1d4ed8)}.summary-card h3{margin:0;font-size:22px}.summary-card p{margin:4px 0 0;font-size:14px;opacity:.9}.dues-table{width:100%;border-collapse:collapse;overflow:hidden;border-radius:10px}.dues-table thead{color:#fff}.dues-table th,.dues-table td{padding:12px 14px;font-size:14px;text-align:left}.dues-table tbody tr:nth-child(2n){background:#f8fafc}.dues-table tbody tr:hover{background:#e2e8f0}.overdue{background:#fee2e2!important;color:#991b1b;font-weight:600}.no-dues{text-align:center;padding:40px;font-size:18px;color:#16a34a;font-weight:600}@media (max-width: 768px){.summary-box{flex-direction:column}.student-info{grid-template-columns:1fr}}.pay-now-btn{background:linear-gradient(135deg,#16a34a,#15803d);color:#fff;border:none;padding:10px 18px;border-radius:8px;font-weight:600;cursor:pointer}.pay-now-btn:disabled{background:#9ca3af;cursor:not-allowed}.status-badge{padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600;text-transform:uppercase}.status-badge.pending{background-color:#fee2e2;color:#b91c1c}.status-badge.paid{background-color:#dcfce7;color:#166534}.timetable-container{min-height:100vh;padding:30px;background:#f5f7fb;color:#1f2937;font-family:Arial,sans-serif}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}.breadcrumb{font-size:13px;color:#6b7280}.title{font-size:28px;font-weight:700;margin-top:8px;color:#111827}.header-buttons{display:flex;gap:15px}.btn-primary,.btn-secondary{display:flex;align-items:center;gap:8px;padding:10px 18px;border-radius:8px;border:none;cursor:pointer;font-size:14px;transition:.3s ease}.btn-primary{background:linear-gradient(to right,#8b5cf6,#6366f1);color:#fff}.btn-primary:hover{opacity:.9}.btn-secondary{background:#e5e7eb;color:#111827}.btn-secondary:hover{background:#d1d5db}.section-title{margin-bottom:20px;font-size:20px;font-weight:600;color:#111827}.stats-grid,.actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:25px;margin-bottom:40px}.stat-card,.action-card{background:#fff;padding:25px;border-radius:12px;transition:.3s ease;box-shadow:0 4px 12px #0000000d}.stat-card:hover,.action-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px #00000014}.icon{margin-bottom:15px;color:#6366f1}.stat-card h4{font-size:14px;color:#6b7280}.admin-stat-value{font-size:24px;font-weight:700;margin-top:6px;color:#111827}.stat-sub{font-size:12px;color:#9ca3af}.action-card h4{font-size:18px;margin-bottom:8px;color:#111827}.action-card p{font-size:14px;color:#6b7280;margin-bottom:12px}.action-card button{background:none;border:none;color:#6366f1;cursor:pointer;font-size:14px}.action-card button:hover{color:#4338ca}.activity-box{background:#fff;padding:25px;border-radius:12px;margin-bottom:40px;box-shadow:0 4px 12px #0000000d}.activity-item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #e5e7eb}.activity-item:last-child{border-bottom:none}.activity-left{display:flex;align-items:center;gap:12px}.activity-item span{font-size:12px;color:#6b7280}.table-wrapper{background:#fff;padding:25px;border-radius:12px;overflow-x:auto;box-shadow:0 4px 12px #0000000d}table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:12px;text-align:left}thead{border-bottom:2px solid #e5e7eb;color:#6b7280;background:#f9fafb}tbody tr{border-bottom:1px solid #e5e7eb}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f3f4f6}.teacher-container{padding:20px;background:#f5f6fa;min-height:100vh;font-family:Segoe UI,sans-serif}.teacher-header{background:linear-gradient(90deg,#5f72ff,#9b59b6);color:#fff;padding:25px;border-radius:20px;display:flex;justify-content:space-between;align-items:center}.teacher-header h1{margin:0;font-size:28px}.header-stats{display:flex;align-items:center;gap:20px}.total-count{font-size:16px;opacity:.9}.add-btn{background:#fff3;border:none;padding:10px 18px;border-radius:12px;color:#fff;cursor:pointer;transition:.3s}.add-btn:hover{background:#ffffff59}.filters-section{margin-top:20px;background:#fff;padding:15px;border-radius:15px;box-shadow:0 2px 10px #0000000d}.filters-grid{display:grid;grid-template-columns:1fr 1fr 200px 150px;gap:15px}.filter-input,.filter-select{padding:10px;border-radius:10px;border:1px solid #ddd;outline:none;font-size:14px}.filter-input:focus,.filter-select:focus{border-color:#6c63ff}.clear-filters-btn{background:#eee;border:none;border-radius:10px;cursor:pointer;transition:.3s}.clear-filters-btn:hover{background:#ddd}.table-wrapper{margin-top:20px;background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 2px 10px #0000000d}.teachers-table{width:100%;border-collapse:collapse}.teachers-table thead{background:#f0f0f0}.teachers-table th{padding:15px;text-align:left;font-weight:600;color:#444}.teachers-table td{padding:15px;border-top:1px solid #eee}.teacher-photo{width:40px;height:40px;border-radius:50%}.photo-placeholder{width:40px;height:40px;border-radius:50%;background:#6c63ff;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}.action-buttons{display:flex;gap:10px}.view-btn{background:#3498db;color:#fff;border:none;padding:6px 12px;border-radius:8px;cursor:pointer}.edit-btn{background:#2ecc71;color:#fff;border:none;padding:6px 12px;border-radius:8px;cursor:pointer}.delete-btn{background:#e74c3c;color:#fff;border:none;padding:6px 12px;border-radius:8px;cursor:pointer}.loading-state,.empty-state{text-align:center;padding:20px;color:#777}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center}.modal-content{background:#fff;padding:25px;border-radius:15px;width:600px;max-height:90vh;overflow-y:auto}.modal-content h2{margin-bottom:15px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-group{display:flex;flex-direction:column}.form-group.full-width{grid-column:span 2}.form-group label{margin-bottom:5px;font-size:14px}.form-group input,.form-group select,.form-group textarea{padding:10px;border-radius:10px;border:1px solid #ddd}.modal-actions{margin-top:20px;display:flex;justify-content:flex-end;gap:10px}.cancel-btn{background:#ccc;border:none;padding:8px 15px;border-radius:8px;cursor:pointer}.submit-btn{background:#6c63ff;color:#fff;border:none;padding:8px 15px;border-radius:8px;cursor:pointer}.view-modal{width:500px}.teacher-details{display:flex;flex-direction:column;gap:10px}.detail-row{display:flex;justify-content:space-between;border-bottom:1px solid #eee;padding-bottom:5px}.manage-container{padding:30px;background:#f5f7fb;min-height:100vh}.manage-container h2{margin-bottom:20px}.manage-container table{width:100%;background:#fff;border-collapse:collapse;border-radius:10px;overflow:hidden;box-shadow:0 4px 12px #0000000d}.manage-container th,.manage-container td{padding:12px;border-bottom:1px solid #e5e7eb;text-align:left}.manage-container th{background:#f9fafb}.manage-container button{padding:6px 10px;margin-right:5px;border:none;border-radius:5px;cursor:pointer;background:#6366f1;color:#fff}.delete-btn{background:#ef4444}.manage-container button:hover{opacity:.85}.view-container{padding:30px;background:#f5f7fb;min-height:100vh}.view-container h2{margin-bottom:20px}.view-container table{width:100%;background:#fff;border-collapse:collapse;border-radius:10px;overflow:hidden;box-shadow:0 4px 12px #0000000d}.view-container th,.view-container td{padding:12px;border-bottom:1px solid #e5e7eb;text-align:left}.view-container th{background:#f9fafb}.view-container tbody tr:hover{background:#f3f4f6}.student-view-page{padding:25px;background:#f4f6f9;min-height:100vh}.student-view-header{background:linear-gradient(90deg,#667eea,#764ba2);color:#fff;padding:25px 30px;border-radius:20px;display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.header-left{display:flex;align-items:center;gap:15px}.back-btn{background:#fff3;border:none;padding:8px;border-radius:8px;cursor:pointer;color:#fff}.avatar-circle{width:55px;height:55px;border-radius:50%;background:#ffffff40;display:flex;align-items:center;justify-content:center}.student-view-header h2{margin:0}.student-view-header p{margin:4px 0 0;font-size:14px;opacity:.9}.status-badge{background:#d4edda;color:#155724;padding:8px 14px;border-radius:20px;font-size:14px;font-weight:600}.student-view-page{padding:24px;background:#f4f6f9;min-height:100vh;font-family:Inter,sans-serif}.student-view-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:20px;margin-top:20px}.card{background:#fff;border-radius:12px;padding:22px;border:1px solid #e2e6ea;box-shadow:0 2px 6px #0000000a;transition:.2s ease}.card:hover{box-shadow:0 4px 12px #00000012}.card h3{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600;color:#2c3e50;margin-bottom:18px;border-bottom:1px solid #edf0f3;padding-bottom:10px}.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 28px}.info-grid span{font-size:13px;color:#6c757d;display:block;margin-bottom:4px}.info-grid p{font-size:15px;font-weight:500;color:#2d3436;margin:0}.address-text{font-size:15px;line-height:1.6;color:#2d3436}.status-badge{background:#e6f4ea;color:#2e7d32;padding:6px 14px;border-radius:20px;font-size:13px;font-weight:500}@media (max-width: 768px){.student-view-grid,.info-grid{grid-template-columns:1fr}}.student-view-header h2{color:#fff;margin:0}.performance-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-bottom:20px;padding:15px;background:#f8f9fa;border-radius:10px}.stat-item{text-align:center}.stat-label{display:block;font-size:12px;color:#6c757d;margin-bottom:5px}.stat-value{font-size:20px;font-weight:600;color:#2c3e50}.exam-list{margin-top:15px}.exam-item{margin-bottom:15px;padding:10px;background:#f8f9fa;border-radius:8px}.exam-info{display:flex;justify-content:space-between;margin-bottom:5px}.exam-name{font-weight:500;color:#2c3e50}.exam-date{font-size:12px;color:#6c757d}.exam-score{margin-bottom:8px}.score-value{font-weight:600;color:#2c3e50}.score-percentage{font-size:12px;color:#6c757d;margin-left:5px}.attendance-overall{display:flex;justify-content:space-between;align-items:center;padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px;margin-bottom:20px;color:#fff}.overall-label{font-size:14px;opacity:.9}.overall-value{font-size:24px;font-weight:600}.subject-list{margin-top:15px}.subject-item{margin-bottom:15px}.subject-info{display:flex;justify-content:space-between;margin-bottom:5px}.subject-name{font-weight:500;color:#2c3e50}.subject-attendance{font-size:13px;color:#6c757d}.progress-bar-container{width:100%;height:8px;background:#e9ecef;border-radius:4px;overflow:hidden}.progress-bar-fill{height:100%;border-radius:4px;transition:width .3s ease}.fee-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}.fee-item{text-align:center;padding:10px;border-radius:8px}.fee-item.total{background:#e3f2fd}.fee-item.paid{background:#e8f5e8}.fee-item.pending{background:#fff3e0}.fee-label{display:block;font-size:12px;color:#6c757d;margin-bottom:5px}.fee-amount{font-size:16px;font-weight:600}.pending-amount{color:#f44336}.fee-progress{margin-bottom:20px}.progress-info{display:flex;justify-content:space-between;margin-bottom:8px;font-size:13px;color:#6c757d}.fee-dates{display:flex;gap:20px;padding:15px;background:#f8f9fa;border-radius:8px;margin-bottom:20px}.date-item{display:flex;align-items:center;gap:8px;font-size:13px;color:#2c3e50}.fee-structure{margin-top:15px}.fee-structure-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #edf0f3}.fee-structure-item:last-child{border-bottom:none}.fee-head{font-weight:500;color:#2c3e50;flex:1}.fee-amounts{display:flex;gap:20px;font-size:13px}.fee-total{color:#2c3e50;width:80px;text-align:right}.fee-paid{color:#4caf50;width:80px;text-align:right}.fee-pending{width:80px;text-align:right}.fee-pending.has-pending{color:#f44336;font-weight:600}.card.performance-card:hover,.card.attendance-card:hover,.card.fee-card:hover{transform:translateY(-2px);transition:transform .2s ease}@media (max-width: 768px){.fee-summary{grid-template-columns:1fr}.fee-amounts{flex-direction:column;gap:5px;align-items:flex-end}.fee-total,.fee-paid,.fee-pending{width:auto}.fee-dates{flex-direction:column;gap:10px}}.student-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:25px;background:#fff;padding:15px;border-radius:16px;box-shadow:0 2px 8px #0000000a;border:1px solid #e2e6ea}.tab-btn{padding:10px 18px;border:none;border-radius:10px;background:#f8f9fa;color:#6c757d;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;white-space:nowrap}.tab-btn:hover{background:#e9ecef;color:#495057}.tab-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 10px #667eea4d}.card.full-width{grid-column:1 / -1}.stats-card .stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.stat-box{display:flex;align-items:center;gap:15px;padding:15px;background:#f8f9fa;border-radius:12px;transition:all .3s ease}.stat-box:hover{transform:translateY(-3px);box-shadow:0 6px 12px #0000000d}.stat-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center}.stat-icon.blue{background:#e3f2fd;color:#1976d2}.stat-icon.green{background:#e8f5e9;color:#388e3c}.stat-icon.orange{background:#fff3e0;color:#f57c00}.stat-icon.purple{background:#f3e5f5;color:#7b1fa2}.stat-box h4{margin:0 0 5px;font-size:20px;font-weight:600;color:#2c3e50}.stat-box p{margin:0;font-size:13px;color:#6c757d}.achievements-list{display:flex;flex-direction:column;gap:15px}.achievement-item{display:flex;gap:15px;padding:12px;background:#f8f9fa;border-radius:10px;transition:all .3s ease}.achievement-item:hover{transform:translate(5px);background:#f0f2f5}.achievement-icon{width:40px;height:40px;border-radius:10px;background:#fff3e0;color:#f57c00;display:flex;align-items:center;justify-content:center}.achievement-details h4{margin:0 0 5px;font-size:15px;font-weight:600;color:#2c3e50}.achievement-details p{margin:0 0 5px;font-size:13px;color:#6c757d}.achievement-date{font-size:11px;color:#999}.subject-performance{margin:20px 0;background:#f8f9fa;border-radius:12px;padding:15px}.subject-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #e9ecef}.subject-row:last-child{border-bottom:none}.subject-name{font-weight:500;color:#2c3e50;flex:1}.subject-score{font-weight:600;color:#2c3e50;width:60px;text-align:right}.subject-grade{width:50px;text-align:right;font-weight:600;color:#667eea}.timetable-card .day-selector{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.day-btn{padding:8px 16px;border:1px solid #dee2e6;background:#fff;border-radius:20px;font-size:13px;cursor:pointer;transition:all .3s ease}.day-btn.active{background:#667eea;color:#fff;border-color:#667eea}.day-btn:hover:not(.active){background:#f8f9fa}.timetable-table{width:100%;border-collapse:collapse}.timetable-table th{text-align:left;padding:12px;background:#f8f9fa;font-weight:600;font-size:13px;color:#495057;border-bottom:2px solid #dee2e6}.timetable-table td{padding:12px;border-bottom:1px solid #e9ecef;color:#2c3e50;font-size:14px}.break-row{background:#f8f9fa;opacity:.8}.subject-tag{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500}.subject-tag.math{background:#e3f2fd;color:#1976d2}.subject-tag.science{background:#e8f5e9;color:#388e3c}.subject-tag.english{background:#fff3e0;color:#f57c00}.subject-tag.other{background:#f3e5f5;color:#7b1fa2}.monthly-attendance{display:grid;grid-template-columns:repeat(6,1fr);gap:15px;margin-top:20px}.month-item{text-align:center}.month-name{font-size:13px;color:#6c757d;margin-bottom:10px}.month-bars{display:flex;justify-content:center;gap:4px;height:80px;align-items:flex-end;margin-bottom:8px}.month-bar{width:12px;border-radius:4px 4px 0 0;transition:height .3s ease}.month-bar.present{background:#28a745}.month-bar.absent{background:#dc3545}.month-bar.late{background:#ffc107}.month-total{font-size:12px;color:#2c3e50;font-weight:500}.fee-table{width:100%;border-collapse:collapse;margin:15px 0}.fee-table th{text-align:left;padding:12px;background:#f8f9fa;font-weight:600;font-size:13px;color:#495057;border-bottom:2px solid #dee2e6}.fee-table td{padding:12px;border-bottom:1px solid #e9ecef;color:#2c3e50;font-size:14px}.paid-text{color:#4caf50;font-weight:500}.pending-text{font-weight:500}.pending-text.has-pending{color:#f44336}.fee-actions{display:flex;gap:15px;margin-top:20px}.pay-now-btn,.download-receipt-btn{padding:12px 24px;border:none;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.pay-now-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea4d}.pay-now-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.download-receipt-btn{background:#f8f9fa;color:#6c757d;border:1px solid #dee2e6}.download-receipt-btn:hover{background:#e9ecef;transform:translateY(-2px)}.teachers-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.teacher-item{display:flex;gap:15px;padding:15px;background:#f8f9fa;border-radius:12px;transition:all .3s ease}.teacher-item:hover{transform:translateY(-3px);box-shadow:0 6px 12px #0000000d}.teacher-avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:600;flex-shrink:0}.teacher-info h4{margin:0 0 5px;font-size:16px;font-weight:600;color:#2c3e50}.teacher-subject{margin:0 0 5px;font-size:13px;color:#667eea;font-weight:500}.teacher-qualification{margin:0 0 8px;font-size:12px;color:#6c757d}.teacher-contact{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#6c757d}.teacher-contact span{display:flex;align-items:center;gap:6px}.homework-list{display:grid;gap:15px}.homework-item{padding:15px;background:#f8f9fa;border-radius:12px;transition:all .3s ease}.homework-item:hover{transform:translate(5px);box-shadow:0 4px 12px #0000000d}.homework-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.homework-subject{font-weight:600;color:#667eea;font-size:14px}.homework-status{padding:4px 10px;border-radius:20px;color:#fff;font-size:11px;font-weight:500;text-transform:uppercase}.homework-item h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#2c3e50}.homework-item p{margin:0 0 12px;font-size:13px;color:#6c757d;line-height:1.5}.homework-footer{display:flex;justify-content:space-between;align-items:center;font-size:12px}.due-date{display:flex;align-items:center;gap:5px;color:#f57c00}.homework-grade{padding:4px 10px;background:#e8f5e9;color:#388e3c;border-radius:20px;font-weight:500}.achievements-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.achievement-card{padding:20px;background:#f8f9fa;border-radius:12px;transition:all .3s ease}.achievement-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #0000000d}.achievement-header{display:flex;align-items:center;gap:10px;margin-bottom:15px}.achievement-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center}.achievement-icon.attendance{background:#e3f2fd;color:#1976d2}.achievement-icon.academic{background:#e8f5e9;color:#388e3c}.achievement-icon.co-curricular{background:#fff3e0;color:#f57c00}.achievement-icon.sports{background:#f3e5f5;color:#7b1fa2}.achievement-type{font-size:12px;color:#6c757d;text-transform:capitalize}.achievement-card h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#2c3e50}.achievement-card p{margin:0 0 15px;font-size:13px;color:#6c757d;line-height:1.5}.achievement-footer{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding-top:10px;border-top:1px solid #e9ecef}.achievement-position,.achievement-award{padding:3px 8px;border-radius:12px;font-weight:500}.achievement-position{background:#fff3e0;color:#f57c00}.achievement-award{background:#ffebee;color:#c62828}.library-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:25px}.library-stat{text-align:center;padding:15px;background:#f8f9fa;border-radius:10px}.library-stat .stat-value{font-size:28px;font-weight:600;color:#2c3e50;display:block;margin-top:5px}.library-stat .stat-value.overdue{color:#f44336}.books-table{width:100%;border-collapse:collapse}.books-table th{text-align:left;padding:12px;background:#f8f9fa;font-weight:600;font-size:13px;color:#495057;border-bottom:2px solid #dee2e6}.books-table td{padding:12px;border-bottom:1px solid #e9ecef;color:#2c3e50;font-size:14px}.book-status{padding:4px 10px;border-radius:20px;font-size:11px;font-weight:500;text-transform:uppercase}.book-status.issued{background:#e3f2fd;color:#1976d2}.book-status.overdue{background:#ffebee;color:#c62828}.book-status.returned{background:#e8f5e9;color:#388e3c}.transport-info{padding:10px 0}.transport-header{margin-bottom:20px}.transport-route{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}.transport-route h4{margin:0;font-size:18px;font-weight:600;color:#2c3e50}.bus-number{padding:6px 12px;background:#667eea;color:#fff;border-radius:20px;font-size:12px;font-weight:500}.transport-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:25px;padding:20px;background:#f8f9fa;border-radius:12px}.transport-detail{display:flex;flex-direction:column;gap:5px}.detail-label{font-size:12px;color:#6c757d}.detail-value{font-size:15px;font-weight:500;color:#2c3e50}.route-stops{margin-top:15px}.stop-item{display:flex;align-items:center;gap:15px;padding:12px;border-bottom:1px solid #e9ecef}.stop-item:last-child{border-bottom:none}.stop-marker{width:24px;height:24px;border-radius:50%;background:#667eea;color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}.stop-detail{font-size:14px;color:#2c3e50}.documents-list{display:grid;gap:12px}.document-item{display:flex;align-items:center;gap:15px;padding:15px;background:#f8f9fa;border-radius:10px;transition:all .3s ease}.document-item:hover{transform:translate(5px);background:#f0f2f5}.document-icon{width:40px;height:40px;border-radius:8px;background:#e3f2fd;color:#1976d2;display:flex;align-items:center;justify-content:center}.document-info{flex:1}.document-info h4{margin:0 0 4px;font-size:15px;font-weight:600;color:#2c3e50}.document-info p{margin:0;font-size:12px;color:#6c757d}.document-actions{display:flex;gap:8px}.view-doc,.download-doc{width:36px;height:36px;border:none;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease}.view-doc{background:#e3f2fd;color:#1976d2}.download-doc{background:#e8f5e9;color:#388e3c}.view-doc:hover,.download-doc:hover{transform:scale(1.1)}@media (max-width: 768px){.student-tabs{overflow-x:auto;flex-wrap:nowrap;padding:12px}.tab-btn{white-space:nowrap}.stats-card .stats-grid{grid-template-columns:1fr}.monthly-attendance{grid-template-columns:repeat(3,1fr)}.teachers-list,.achievements-grid,.library-stats,.transport-details{grid-template-columns:1fr}.fee-actions{flex-direction:column}.pay-now-btn,.download-receipt-btn{width:100%}.document-item{flex-wrap:wrap}.document-actions{width:100%;justify-content:flex-end}}.card{animation:fadeIn .3s ease-out}.loading-spinner{display:inline-block;width:30px;height:30px;border:3px solid #f3f3f3;border-top:3px solid #667eea;border-radius:50%;animation:spin 1s linear infinite}.page-container{min-height:100vh;background:linear-gradient(135deg,#eef2ff,#f8fafc);padding:40px 20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.page-inner{max-width:1200px;margin:auto;background:#fff;padding:35px;border-radius:16px;box-shadow:0 15px 40px #00000014;animation:fadeIn .3s ease-in-out}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:35px}.page-header h2{font-size:24px;font-weight:600;color:#1e293b}.page-header button{background:#f1f5f9;border:none;padding:8px 16px;border-radius:8px;cursor:pointer;transition:.3s}.page-header button:hover{background:#e2e8f0}.stepper{display:flex;justify-content:space-between;margin-bottom:40px;position:relative}.step{text-align:center;flex:1;position:relative;opacity:.5;transition:.3s}.step.active{opacity:1}.step span{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:#e2e8f0;font-weight:600;margin-bottom:8px;transition:.3s}.step.active span{background:#6366f1;color:#fff;box-shadow:0 5px 15px #6366f166}.step p{font-size:13px;font-weight:500;color:#334155}.form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;margin-bottom:25px}input,select,textarea{width:100%;padding:10px 12px;border-radius:8px;border:1px solid #d1d5db;font-size:14px;transition:.3s;background:#f9fafb}input:focus,select:focus,textarea:focus{outline:none;border-color:#6366f1;background:#fff;box-shadow:0 0 0 3px #6366f126}textarea{min-height:80px;resize:none}h4{margin-top:20px;margin-bottom:10px;color:#1e293b}.checkbox-grid{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px}.checkbox-grid label{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer}.checkbox-grid input{accent-color:#6366f1;width:16px;height:16px}.review-section{background:#f8fafc;padding:20px;border-radius:12px;line-height:1.8;font-size:14px}.review-section p{margin-bottom:8px}.review-section label{display:flex;align-items:center;gap:8px;margin-top:15px}.modal-footer{display:flex;justify-content:flex-end;gap:12px;margin-top:30px}.modal-footer button{padding:10px 18px;border-radius:8px;border:none;cursor:pointer;font-size:14px;transition:.3s}.modal-footer button:first-child:not(.primary){background:#e2e8f0}.modal-footer button:first-child:not(.primary):hover{background:#cbd5e1}.primary{background:#6366f1;color:#fff}.primary:hover{background:#4f46e5;box-shadow:0 8px 20px #4f46e54d}.primary:disabled{background:#cbd5e1;cursor:not-allowed;box-shadow:none}.error{color:#ef4444;font-size:12px;margin-top:4px}.form-grid div{display:flex;flex-direction:column}@media (max-width: 768px){.page-inner{padding:20px}.stepper{flex-direction:column;gap:15px}.step{text-align:left}}.image-upload-section{margin-bottom:24px;display:flex;justify-content:center}.profile-image-container{display:flex;flex-direction:column;align-items:center;gap:12px}.profile-preview{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid #3b82f6}.profile-placeholder{width:120px;height:120px;border-radius:50%;background:#f1f5f9;display:flex;align-items:center;justify-content:center;border:2px dashed #94a3b8}.profile-placeholder i{font-size:40px;color:#64748b}.upload-btn{padding:8px 16px;background:#3b82f6;color:#fff;border:none;border-radius:20px;cursor:pointer;font-size:14px;transition:all .2s}.upload-btn:hover{background:#2563eb;transform:translateY(-1px)}.review-section{background:#fff;border-radius:12px;padding:24px;margin-bottom:20px}.review-profile-image{display:flex;justify-content:center;margin-bottom:24px}.review-profile-img{width:150px;height:150px;border-radius:50%;object-fit:cover;border:4px solid #3b82f6;box-shadow:0 4px 10px #0000001a}.review-profile-placeholder{width:150px;height:150px;border-radius:50%;background:#f1f5f9;display:flex;align-items:center;justify-content:center;border:3px dashed #94a3b8}.review-profile-placeholder i{font-size:60px;color:#64748b}.review-details{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-bottom:24px}.review-details h3{grid-column:1 / -1;color:#1e293b;margin:16px 0 8px;padding-bottom:8px;border-bottom:2px solid #e2e8f0}.review-details h3:first-of-type{margin-top:0}.review-details p{margin:4px 0;color:#334155;font-size:14px}.review-details p b{color:#0f172a;min-width:140px;display:inline-block}.confirmation-checkbox{display:flex;align-items:flex-start;gap:12px;padding:20px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;margin-top:20px}.confirmation-checkbox input[type=checkbox]{width:18px;height:18px;margin-top:2px;cursor:pointer}.confirmation-checkbox{font-size:14px;color:#334155;line-height:1.5}.cropper-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:999}.cropper-container{background:#fff;padding:20px;width:350px;border-radius:8px;text-align:center}.slider-box{margin:15px 0}.crop-buttons{margin-top:15px;display:flex;justify-content:space-around}.save-btn{background:green;color:#fff;padding:7px 15px;border:none;cursor:pointer;border-radius:5px}.cancel-btn{background:red;color:#fff;padding:7px 15px;border:none;cursor:pointer;border-radius:5px}.student-form-page{padding:30px;background:#f4f6f9;min-height:100vh}.student-form-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.student-form-header h2{font-size:24px;font-weight:600;color:#222}.cancel-btn{padding:8px 18px;border-radius:6px;border:none;background:#e74c3c;color:#fff;cursor:pointer;transition:.3s}.cancel-btn:hover{background:#c0392b}.dashboard-container{padding:20px;background:#fff;min-height:100vh;font-family:Segoe UI,sans-serif;color:#333}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.dashboard-header h2{margin:0;color:#fff}.dashboard-header p{margin:4px 0 0;font-size:14px;color:#fff}.header-right{display:flex;gap:10px}.search-box{padding:8px 12px;border-radius:6px;border:1px solid #ddd;outline:none}.date-btn{padding:8px 14px;background:#f5f5f5;border:1px solid #ddd;border-radius:6px;cursor:pointer}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:30px}.summary-card{background:#fff;padding:20px;border-radius:14px;box-shadow:0 2px 10px #0000000d}.summary-card h3{margin-bottom:15px;color:#8b5cf6}.summary-numbers{display:flex;justify-content:space-between;margin-bottom:15px;text-align:center}.summary-numbers h2{font-size:22px;font-weight:600}.summary-numbers p{font-size:12px;color:#6b7280}.progress{background:#e5e7eb;height:8px;border-radius:6px;overflow:hidden;margin:8px 0}.progress div{height:100%;background:#3b82f6;transition:width .4s ease}.progress.small{height:6px}.attention-section{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px}.panel{background:#fff;padding:20px;border-radius:14px;box-shadow:0 2px 10px #0000000d}.alert{padding:12px 14px;border-radius:8px;margin-bottom:12px;font-size:14px}.alert-danger{background:#fee2e2;color:#b91c1c}.alert-warning{background:#fef3c7;color:#92400e}.alert-info{background:#dbeafe;color:#1e40af}.live-feed{list-style:none;padding:0;margin:15px 0 0}.live-feed li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #e5e7eb}.live-feed strong{font-size:14px;color:#111827}.live-feed p{font-size:12px;color:#6b7280}.badge{background:#22c55e;color:#fff;font-size:11px;padding:4px 10px;border-radius:20px}.class-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:15px;margin-top:20px}.class-card{background:#f9fafb;padding:15px;border-radius:10px;text-align:center}.class-card h4{margin-bottom:8px;font-size:14px}.red{color:#ef4444}.yellow{color:#f59e0b}@media (max-width: 992px){.attention-section{grid-template-columns:1fr}.dashboard-header{flex-direction:column;align-items:flex-start;gap:15px}.header-right,.search-box{width:100%}}.dashboard-container{padding:24px;background-color:#f8fafc;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif}.back-btn{background:#fff;border:1px solid #e2e8f0;color:#475569;padding:10px 20px;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:8px;margin-bottom:24px;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.back-btn:hover{background-color:#f8fafc;border-color:#cbd5e1;transform:translate(-2px);box-shadow:0 4px 6px -1px #0000001a}.header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;background:#fff;padding:20px 24px;border-radius:16px;box-shadow:0 1px 3px #0000001a}.header-row h2{font-size:24px;font-weight:600;color:#0f172a;margin:0;background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.date-display{background:#f1f5f9;padding:10px 20px;border-radius:40px;font-size:14px;color:#334155;font-weight:500;border:1px solid #e2e8f0;box-shadow:inset 0 1px 2px #0000000d}.date-display strong{color:#64748b;font-weight:600;margin-right:6px}.filters-row{display:flex;gap:16px;margin-bottom:28px;flex-wrap:nowrap;background:#fff;padding:20px;border-radius:16px;box-shadow:0 1px 3px #0000001a}.filter-select{padding:12px 40px 12px 18px;border:1.5px solid #e2e8f0;border-radius:12px;font-size:14px;color:#1e293b;background-color:#fff;cursor:pointer;min-width:160px;transition:all .2s ease;font-weight:500;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20' stroke='%23475569'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:20px}.filter-select:hover{border-color:#94a3b8;background-color:#f8fafc}.filter-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.refresh-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;padding:12px 24px;border-radius:12px;cursor:pointer;font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px;transition:all .2s ease;margin-left:auto;box-shadow:0 4px 6px -1px #2563eb33}.refresh-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 10px -1px #2563eb4d}.refresh-btn:disabled{opacity:.6;cursor:not-allowed;background:#94a3b8;box-shadow:none}.summary-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;margin-bottom:28px}.stat-card{background:#fff;padding:20px;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a;display:flex;flex-direction:column;align-items:center;text-align:center;transition:all .2s ease;border:1px solid #e2e8f0}.stat-card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a}.stat-card.present{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border-color:#86efac}.stat-card.absent{background:linear-gradient(135deg,#fef2f2,#fee2e2);border-color:#fca5a5}.stat-card.late{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:#fcd34d}.stat-card.leave{background:linear-gradient(135deg,#faf5ff,#f3e8ff);border-color:#c4b5fd}.stat-label{font-size:14px;color:#64748b;margin-bottom:8px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:32px;font-weight:700;color:#0f172a;line-height:1.2}.stat-card.present .stat-value{color:#166534}.stat-card.absent .stat-value{color:#991b1b}.stat-card.late .stat-value{color:#92400e}.stat-card.leave .stat-value{color:#5b21b6}.table-container{background:#fff;border-radius:20px;box-shadow:0 4px 6px -1px #0000001a;overflow:auto;border:1px solid #e2e8f0}.record-table{width:100%;border-collapse:collapse;font-size:14px;min-width:1000px}.record-table thead tr{background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-bottom:2px solid #e2e8f0}.record-table th{text-align:left;padding:18px 16px;font-weight:600;color:#475569;text-transform:uppercase;font-size:12px;letter-spacing:.5px;white-space:nowrap}.record-table td{padding:16px;border-bottom:1px solid #e2e8f0;color:#1e293b;vertical-align:middle}.record-table tbody tr{transition:all .2s ease}.record-table tbody tr:hover{background-color:#f8fafc;transform:scale(1.01);box-shadow:0 2px 8px #0000000d}.name-cell{display:flex;align-items:center;gap:14px;font-weight:500}.avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;text-transform:uppercase;box-shadow:0 2px 4px #0000001a;border:2px solid white;overflow:hidden}.avatar-img{width:100%;height:100%;object-fit:cover}.status{padding:8px 14px;border-radius:40px;font-size:12px;font-weight:600;text-transform:capitalize;display:inline-block;min-width:80px;text-align:center;letter-spacing:.3px;box-shadow:0 1px 2px #0000000d}.status.present{background:linear-gradient(135deg,#86efac,#4ade80);color:#14532d;border:1px solid #22c55e}.status.absent{background:linear-gradient(135deg,#fca5a5,#f87171);color:#7f1d1d;border:1px solid #ef4444}.status.late{background:linear-gradient(135deg,#fcd34d,#fbbf24);color:#78350f;border:1px solid #f59e0b}.status.leave{background:linear-gradient(135deg,#c4b5fd,#a78bfa);color:#4c1d95;border:1px solid #8b5cf6}.status.half-day{background:linear-gradient(135deg,#a5f3fc,#67e8f9);color:#155e75;border:1px solid #06b6d4}.status.holiday{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#3730a3;border:1px solid #6366f1}.method{padding:6px 12px;border-radius:40px;font-size:11px;font-weight:600;text-transform:uppercase;display:inline-block;min-width:70px;text-align:center;letter-spacing:.5px}.method.rfid{background:#dbeafe;color:#1e3a8a;border:1px solid #93c5fd}.method.manual{background:#f3e8ff;color:#581c87;border:1px solid #c4b5fd}.method.face{background:#dcfce7;color:#14532d;border:1px solid #86efac}.method.fingerprint{background:#fff1f2;color:#881337;border:1px solid #fda4af}.percentage-cell{display:flex;align-items:center;gap:12px;min-width:140px}.progress-container{flex:1;height:8px;background:#e2e8f0;border-radius:20px;overflow:hidden;box-shadow:inset 0 1px 2px #0000001a}.progress-bar{height:100%;border-radius:20px;transition:width .3s ease;position:relative;overflow:hidden}.progress-bar:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#ffffff1a 25%,#ffffff4d,#ffffff1a 75%);animation:shimmer 2s infinite;transform:translate(-100%)}@keyframes shimmer{to{transform:translate(100%)}}.progress-bar.progress-green{background:linear-gradient(90deg,#4ade80,#22c55e)}.progress-bar.progress-yellow{background:linear-gradient(90deg,#fbbf24,#f59e0b)}.progress-bar.progress-red{background:linear-gradient(90deg,#f87171,#ef4444)}.percentage-value{font-size:13px;font-weight:600;min-width:65px;color:#0f172a;display:flex;flex-direction:column;align-items:flex-start}.percentage-value small{font-size:10px;color:#64748b;font-weight:400;margin-top:2px}.loading-state{text-align:center;padding:80px 20px;background:#fff;border-radius:20px;box-shadow:0 4px 6px -1px #0000001a}.spinner{border:4px solid #f1f5f9;border-top:4px solid #3b82f6;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin:0 auto 20px}.loading-state p{color:#64748b;font-size:16px;font-weight:500;margin:0}.error-state{text-align:center;padding:60px 20px;background:#fff;border-radius:20px}.error-message{color:#dc2626;margin-bottom:20px;font-size:15px;font-weight:500;background:#fee2e2;padding:12px 24px;border-radius:40px;display:inline-block;border:1px solid #fecaca}.retry-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;padding:12px 32px;border-radius:40px;cursor:pointer;font-size:14px;font-weight:600;transition:all .2s ease;box-shadow:0 4px 6px -1px #2563eb33}.retry-btn:hover{transform:translateY(-2px);box-shadow:0 6px 10px -1px #2563eb4d}.empty-state{text-align:center;padding:80px 20px;background:#fff;border-radius:20px;color:#64748b}.empty-state p{font-size:16px;margin:0 0 8px;font-weight:500}.empty-hint{font-size:14px;color:#94a3b8;margin-top:8px}.login-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;padding:14px 36px;border-radius:40px;cursor:pointer;font-size:15px;font-weight:600;margin-top:20px;transition:all .2s ease;box-shadow:0 4px 6px -1px #2563eb33}.login-btn:hover{transform:translateY(-2px);box-shadow:0 6px 10px -1px #2563eb4d}.pagination{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:28px;padding:20px 0;background:#fff;border-radius:16px;box-shadow:0 1px 3px #0000001a}.page-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;padding:10px 24px;border-radius:40px;cursor:pointer;font-size:14px;font-weight:600;transition:all .2s ease;box-shadow:0 2px 4px #0000001a}.page-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 6px -1px #2563eb4d}.page-btn:disabled{background:#94a3b8;cursor:not-allowed;opacity:.6;box-shadow:none}.page-info{font-size:15px;color:#334155;font-weight:500;background:#f1f5f9;padding:8px 20px;border-radius:40px;border:1px solid #e2e8f0}@media (max-width: 768px){.dashboard-container{padding:16px}.header-row{flex-direction:column;gap:16px;text-align:center;padding:16px}.filters-row{flex-direction:column}.filter-select{width:100%}.refresh-btn{margin-left:0;width:100%;justify-content:center}.summary-stats{grid-template-columns:repeat(2,1fr)}.stat-card{padding:16px}.stat-value{font-size:24px}.table-container{border-radius:12px}.record-table{font-size:13px}.record-table th,.record-table td{padding:12px}.name-cell{gap:10px}.avatar{width:36px;height:36px;font-size:14px}.status{padding:6px 10px;min-width:70px;font-size:11px}.percentage-cell{min-width:120px}.percentage-value{font-size:12px}.pagination{flex-direction:column;gap:12px}.page-btn{width:100%}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f5f9;border-radius:10px}::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#64748b}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.record-table tbody tr{animation:fadeIn .3s ease-out}[data-tooltip]{position:relative;cursor:help}[data-tooltip]:before{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%);padding:6px 12px;background:#1e293b;color:#fff;font-size:12px;border-radius:6px;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s ease;pointer-events:none;z-index:10}[data-tooltip]:hover:before{opacity:1;visibility:visible;bottom:calc(100% + 5px)}.action-buttons{display:flex;gap:8px;flex-wrap:wrap}.action-btn{padding:8px 16px;border:none;border-radius:var(--radius-md);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:90px}.action-btn i{font-size:.9rem}.action-btn span{font-size:.85rem}.action-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.action-btn.present-btn{background:#10b9811a;color:#059669;border:1px solid rgba(16,185,129,.2)}.action-btn.present-btn:hover:not(:disabled){background:#10b981;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.action-btn.present-btn.active{background:#10b981;color:#fff;border-color:#10b981}.action-btn.absent-btn{background:#ef44441a;color:#dc2626;border:1px solid rgba(239,68,68,.2)}.action-btn.absent-btn:hover:not(:disabled){background:#ef4444;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #ef44444d}.action-btn.absent-btn.active{background:#ef4444;color:#fff;border-color:#ef4444}.status-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:.85rem;font-weight:600;text-transform:capitalize}.status-badge i{font-size:.8rem}.status-badge.present{background:#10b9811a;color:#059669;border:1px solid rgba(16,185,129,.2)}.status-badge.absent{background:#ef44441a;color:#dc2626;border:1px solid rgba(239,68,68,.2)}.summary-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}.stat-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow-card);transition:transform .2s}.stat-card:hover{transform:translateY(-2px)}.stat-card.present{border-left:4px solid #10b981}.stat-card.absent{border-left:4px solid #ef4444}.stat-label{font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;display:block;margin-bottom:8px}.stat-value{font-size:2rem;font-weight:700;color:var(--text-h)}@media (max-width: 768px){.action-buttons{flex-direction:column}.action-btn{width:100%;min-width:auto}.summary-stats{grid-template-columns:repeat(2,1fr)}}.pending-row{background-color:#ffc1070d!important}.pending-row:hover{background-color:#ffc1071a!important}.pending-indicator{margin-left:4px;color:#f59e0b;font-weight:700}.stat-card.pending{border-left:4px solid #f59e0b}.stat-card.pending .stat-value{color:#f59e0b}.submit-section{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;background:var(--surface-2);border-top:2px solid var(--border);border-radius:0 0 var(--radius-xl) var(--radius-xl);flex-wrap:wrap;gap:16px}.pending-info{display:flex;align-items:center;gap:12px}.pending-count{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);font-size:.95rem;color:var(--text-h)}.pending-count i{color:#f59e0b}.submit-actions{display:flex;gap:12px}.submit-btn{padding:12px 32px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:var(--radius-md);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:10px;box-shadow:0 4px 12px #10b9814d}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #10b98166}.submit-btn:disabled{opacity:.5;cursor:not-allowed}.reset-btn{padding:12px 24px;background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text-muted);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:8px}.reset-btn:hover:not(:disabled){border-color:#f59e0b;color:#f59e0b;background:#f59e0b0d}.reset-btn:disabled{opacity:.5;cursor:not-allowed}.action-btn{padding:6px 12px;min-width:45px}.action-btn span{font-size:.85rem;font-weight:700}.action-btn i{font-size:.85rem}@media (max-width: 768px){.submit-section{flex-direction:column;align-items:stretch}.pending-info{justify-content:center}.submit-actions{flex-direction:column}.submit-btn,.reset-btn{width:100%;justify-content:center}}.marked-by-info{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.current-user-badge{font-size:.7rem;color:#10b981;font-weight:600;background:#10b9811a;padding:2px 6px;border-radius:4px}.user-id-badge.warning{background:#ef44441a;color:#dc2626;border:1px solid rgba(239,68,68,.2)}.user-id-badge.warning i{color:#dc2626}.date-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;background:var(--surface-2);border-radius:var(--radius-sm);font-size:.85rem;color:var(--text-b);font-family:JetBrains Mono,monospace;white-space:nowrap}.date-badge i{color:var(--accent-purple);font-size:.75rem}.record-table th{white-space:nowrap;padding:12px 10px}.record-table td{padding:12px 10px}@media (max-width: 1400px){.record-table{min-width:1800px}}@media (max-width: 768px){.date-badge{font-size:.75rem;padding:2px 6px}.date-badge i{display:none}}.dashboard{padding:40px;background:#f4f7fb;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif}h2{color:#1e293b;margin-bottom:30px;font-size:28px;font-weight:600}.card-container{display:flex;gap:20px;margin-bottom:30px}.card{flex:1;padding:24px 20px;border-radius:16px;background:#fff;cursor:pointer;font-weight:600;font-size:18px;text-align:center;box-shadow:0 5px 15px #0000000d;transition:all .3s ease;border:1px solid #e2e8f0;color:#334155}.card:hover{transform:translateY(-3px);box-shadow:0 10px 25px #4f46e51a;border-color:#4f46e5}.card.active{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;border-color:transparent;box-shadow:0 10px 25px #4f46e54d}.form-container{display:flex;gap:15px;margin-bottom:30px;background:#fff;padding:25px;border-radius:16px;box-shadow:0 5px 15px #0000000d;border:1px solid #e2e8f0;flex-wrap:wrap}.form-container input{padding:12px 16px;border-radius:10px;border:1.5px solid #e2e8f0;flex:1;font-size:14px;transition:all .2s;outline:none;background:#f8fafc}.form-container input:focus{border-color:#4f46e5;background:#fff;box-shadow:0 0 0 3px #4f46e51a}.form-container input::placeholder{color:#94a3b8}.form-container button{padding:12px 28px;border:none;border-radius:10px;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s;box-shadow:0 4px 10px #4f46e533;min-width:140px}.form-container button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #4f46e54d}.form-container button:disabled{opacity:.6;cursor:not-allowed;background:#94a3b8;box-shadow:none}.data-table{width:100%;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 5px 15px #0000000d;border:1px solid #e2e8f0;border-collapse:separate;border-spacing:0}.data-table thead{background:linear-gradient(135deg,#f8fafc,#f1f5f9)}.data-table th{padding:16px 12px;text-align:left;font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:#475569;border-bottom:2px solid #e2e8f0}.data-table td{padding:16px 12px;border-bottom:1px solid #e2e8f0;color:#334155;font-size:14px}.data-table tbody tr{transition:background .2s}.data-table tbody tr:hover{background:#f8fafc}.data-table tbody tr:last-child td{border-bottom:none}.data-table td:last-child{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.data-table button:first-child{padding:8px 16px;border:none;border-radius:8px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;cursor:pointer;font-weight:600;font-size:13px;transition:all .2s;display:inline-flex;align-items:center;gap:6px;box-shadow:0 2px 8px #f59e0b33}.data-table button:first-child:hover{transform:translateY(-2px);box-shadow:0 4px 12px #f59e0b4d;background:linear-gradient(135deg,#f59e0b,#e67e22)}.data-table button:first-child:active{transform:translateY(0)}.data-table button:last-child{padding:8px 16px;border:none;border-radius:8px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;cursor:pointer;font-weight:600;font-size:13px;transition:all .2s;display:inline-flex;align-items:center;gap:6px;box-shadow:0 2px 8px #ef444433}.data-table button:last-child:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ef44444d;background:linear-gradient(135deg,#ef4444,#f87171)}.data-table button:last-child:active{transform:translateY(0)}@media (max-width: 768px){.dashboard{padding:20px}.card-container{flex-direction:column}.card{width:100%}.form-container{flex-direction:column}.form-container input,.form-container button{width:100%}.data-table{overflow-x:auto;display:block}.data-table td:last-child{flex-direction:column;gap:5px}.data-table button{width:100%;justify-content:center}}.data-table tbody tr td[colspan]{text-align:center;padding:40px;color:#64748b;font-style:italic}.form-container button.loading{position:relative;color:transparent}.form-container button.loading:after{content:"";position:absolute;width:20px;height:20px;top:50%;left:50%;transform:translate(-50%,-50%);border:2px solid white;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}button:focus-visible,input:focus-visible{outline:2px solid #4f46e5;outline-offset:2px}[data-tooltip]{position:relative}[data-tooltip]:before{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%);padding:4px 8px;background:#1e293b;color:#fff;font-size:12px;border-radius:4px;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s;pointer-events:none;margin-bottom:5px}[data-tooltip]:hover:before{opacity:1;visibility:visible}.tv-container{padding:24px;background:#f4f6f9;min-height:100vh;font-family:Inter,sans-serif}.tv-header{display:flex;align-items:center;gap:16px;margin-bottom:24px}.tv-back-btn{width:40px;height:40px;border-radius:50%;border:none;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a;transition:all .3s ease}.tv-back-btn:hover{transform:translate(-3px);box-shadow:0 4px 12px #00000026}.tv-header h1{font-size:24px;color:#2c3e50;margin:0}.tv-content{max-width:1200px;margin:0 auto}.tv-profile-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;padding:30px;margin-bottom:24px;color:#fff;display:flex;align-items:center;gap:24px;position:relative;box-shadow:0 10px 30px #667eea4d}.tv-profile-image-container{width:100px;height:100px;border-radius:50%;overflow:hidden;border:4px solid rgba(255,255,255,.3);background:#fff;flex-shrink:0}.tv-profile-image{width:100%;height:100%;object-fit:cover}.tv-profile-placeholder{width:100%;height:100%;background:#fff;color:#667eea;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:600}.tv-profile-info{flex:1}.tv-profile-info h2{margin:0 0 8px;font-size:28px}.tv-subject-badge{display:inline-block;background:#fff3;padding:6px 16px;border-radius:20px;font-size:14px;margin:0 0 8px}.tv-employee-id{margin:0;font-size:14px;opacity:.9}.tv-status-badge{position:absolute;top:20px;right:20px;background:#fff3;padding:6px 16px;border-radius:20px;font-size:14px;font-weight:500;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.tv-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:24px}.tv-stat-card{background:#fff;border-radius:16px;padding:20px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 12px #0000000a;transition:all .3s ease}.tv-stat-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px #00000014}.tv-stat-icon{width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center}.tv-stat-icon.blue{background:#e3f2fd;color:#1976d2}.tv-stat-icon.green{background:#e8f5e9;color:#388e3c}.tv-stat-icon.orange{background:#fff3e0;color:#f57c00}.tv-stat-icon.purple{background:#f3e5f5;color:#7b1fa2}.tv-stat-info h3{margin:0;font-size:24px;font-weight:600;color:#2c3e50}.tv-stat-info p{margin:4px 0 0;font-size:13px;color:#6c757d}.tv-details-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:24px}.tv-detail-card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 2px 12px #0000000a;transition:all .3s ease}.tv-detail-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px #00000014}.tv-detail-card h3{display:flex;align-items:center;gap:8px;color:#2c3e50;font-size:16px;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid #edf0f3}.tv-detail-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed #edf0f3}.tv-detail-row:last-child{border-bottom:none}.tv-label{color:#6c757d;font-size:13px;font-weight:500}.tv-value{color:#2c3e50;font-size:14px;font-weight:500;text-align:right;max-width:60%;word-break:break-word}.tv-status{padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600}.tv-status.active{background:#d4edda;color:#155724}.tv-status.inactive{background:#f8d7da;color:#721c24}.tv-section-card{background:#fff;border-radius:16px;padding:24px;margin-bottom:24px;box-shadow:0 2px 12px #0000000a}.tv-section-card h3{display:flex;align-items:center;gap:8px;color:#2c3e50;font-size:18px;margin:0 0 20px;padding-bottom:12px;border-bottom:2px solid #f0f2f5}.tv-section-card h4{color:#2c3e50;font-size:16px;margin:20px 0 15px}.tv-attendance-summary{padding:10px 0}.tv-attendance-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:25px}.tv-attendance-stat{text-align:center;padding:15px;background:#f8f9fa;border-radius:12px}.tv-attendance-label{display:block;font-size:13px;color:#6c757d;margin-bottom:8px}.tv-attendance-value{font-size:24px;font-weight:600}.tv-attendance-value.present{color:#28a745}.tv-attendance-value.absent{color:#dc3545}.tv-attendance-value.late{color:#ffc107}.tv-attendance-value.total{color:#17a2b8}.tv-progress-bar-container{margin:20px 0}.tv-progress-label{display:flex;justify-content:space-between;margin-bottom:8px;font-size:14px;color:#6c757d}.tv-progress-bar{height:10px;background:#e9ecef;border-radius:5px;overflow:hidden}.tv-progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:5px;transition:width .3s ease}.tv-monthly-attendance{margin-top:30px}.tv-monthly-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:15px;margin-top:15px}.tv-month-item{text-align:center}.tv-month-name{font-size:13px;color:#6c757d;margin-bottom:10px}.tv-month-bars{display:flex;justify-content:center;gap:4px;height:80px;align-items:flex-end;margin-bottom:8px}.tv-month-bar{width:12px;border-radius:4px 4px 0 0;transition:height .3s ease}.tv-month-bar.present{background:#28a745}.tv-month-bar.absent{background:#dc3545}.tv-month-bar.late{background:#ffc107}.tv-month-total{font-size:12px;color:#2c3e50;font-weight:500}.tv-class-list{overflow-x:auto}.tv-class-table{width:100%;border-collapse:collapse}.tv-class-table th{text-align:left;padding:12px;background:#f8f9fa;font-weight:600;font-size:13px;color:#495057;border-bottom:2px solid #dee2e6}.tv-class-table td{padding:12px;border-bottom:1px solid #e9ecef;color:#2c3e50;font-size:14px}.tv-class-btn{padding:6px 12px;background:#e3f2fd;color:#1976d2;border:none;border-radius:6px;font-size:12px;cursor:pointer;transition:all .3s ease}.tv-class-btn:hover{background:#bbdefb}.tv-day-selector{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.tv-day-btn{padding:8px 16px;border:1px solid #dee2e6;background:#fff;border-radius:20px;font-size:13px;cursor:pointer;transition:all .3s ease}.tv-day-btn.active{background:#667eea;color:#fff;border-color:#667eea}.tv-day-btn:hover{background:#f8f9fa}.tv-timetable{overflow-x:auto}.tv-timetable-table{width:100%;border-collapse:collapse}.tv-timetable-table th{text-align:left;padding:12px;background:#f8f9fa;font-weight:600;font-size:13px;color:#495057;border-bottom:2px solid #dee2e6}.tv-timetable-table td{padding:12px;border-bottom:1px solid #e9ecef;color:#2c3e50;font-size:14px}.tv-break-row{background:#f8f9fa}.tv-subject-tag{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500}.tv-subject-tag.math{background:#e3f2fd;color:#1976d2}.tv-subject-tag.science{background:#e8f5e9;color:#388e3c}.tv-subject-tag.physics{background:#fff3e0;color:#f57c00}.tv-subject-tag.other{background:#f3e5f5;color:#7b1fa2}.tv-actions{display:flex;gap:16px;justify-content:center;margin-top:20px}.tv-edit-btn,.tv-back-bottom-btn{padding:12px 30px;border:none;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.tv-edit-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea4d}.tv-edit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.tv-back-bottom-btn{background:#fff;color:#6c757d;border:1px solid #dee2e6}.tv-back-bottom-btn:hover{background:#f8f9fa;transform:translateY(-2px)}.tv-loading-container,.tv-error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center;padding:24px}.tv-loader{width:50px;height:50px;border:3px solid #f3f3f3;border-top:3px solid #667eea;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tv-error{color:#dc3545;margin-bottom:16px}.tv-error-container button,.tv-loading-container button{padding:10px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s ease}@media (max-width: 768px){.tv-profile-card{flex-direction:column;text-align:center;padding:40px 20px}.tv-status-badge{position:static;margin-top:16px}.tv-stats-grid{grid-template-columns:repeat(2,1fr)}.tv-details-grid{grid-template-columns:1fr}.tv-attendance-stats{grid-template-columns:repeat(2,1fr)}.tv-monthly-grid{grid-template-columns:repeat(3,1fr)}.tv-actions{flex-direction:column}.tv-edit-btn,.tv-back-bottom-btn{width:100%}}.tv-profile-info h2{color:#fff;margin:0 0 5px}