@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#1e3449;--muted:#718397;--blue:#3978e8;--blue-dark:#245ac1;--pale:#edf5ff;--line:#e5ebf2;--bg:#f6f9fd;--white:#fff;--green:#16856b;--shadow:0 8px 30px rgba(32,67,111,.055)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}a{color:var(--blue);text-decoration:none}a:hover{color:var(--blue-dark)}.sidebar{position:fixed;inset:0 auto 0 0;width:252px;background:#fff;border-right:1px solid var(--line);padding:24px 15px 14px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:11px;padding:0 10px 30px;color:var(--ink)}.brand b{font:800 15px Manrope,sans-serif;display:block}.brand small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.brand-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#4389fa,#315fd4);color:white;display:inline-flex;align-items:center;justify-content:center;font:800 14px Manrope;box-shadow:0 6px 15px #3978e833;flex-shrink:0}.nav-label,.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.3px;color:#8a9aab}.nav-label{padding:0 12px 11px}.nav-link{display:flex;gap:12px;align-items:center;padding:11px 12px;margin:2px 0;color:#6a7d90;border-radius:10px;font-size:12.5px;font-weight:600}.nav-link span{font-size:16px;width:19px;text-align:center}.nav-link:hover,.nav-link.active{background:#edf5ff;color:#2865d7}.nav-link.active{box-shadow:inset 3px 0 #3978e8}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:17px 5px 0;display:flex;align-items:center;gap:9px}.avatar{width:36px;height:36px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#e0edff;color:#2f68ce;font-weight:800;flex-shrink:0}.avatar.small{width:32px;height:32px}.user-meta{min-width:0;flex:1}.user-meta b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta small{color:var(--muted);font-size:11px}.logout{font-size:20px;color:#8796a8}.main{margin-left:252px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:91px;padding:19px 34px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.topbar h2{font:800 22px Manrope;margin:6px 0 0;text-transform:capitalize}.top-actions{display:flex;align-items:center;gap:14px}.date-chip{font-size:11px;color:#288b72;background:#eaf8f2;padding:9px 12px;border-radius:20px}.content{padding:27px 34px 36px;flex:1;max-width:1800px;width:100%;margin:0 auto}.welcome{background:linear-gradient(110deg,#2866d8,#448af4);border-radius:18px;padding:27px 32px;color:#fff;display:flex;justify-content:space-between;align-items:center;overflow:hidden;position:relative;min-height:170px}.welcome h1{font:800 25px Manrope;margin:9px 0}.welcome p{color:#e1edff;margin:0;max-width:570px}.eyebrow.light{color:#d3e4ff}.welcome-art{width:190px;align-self:stretch;position:relative;display:flex;align-items:center;justify-content:center;font-size:60px;color:#ffffff55}.welcome-art span{position:absolute;font-size:28px;right:30px;top:4px}.welcome-art b{position:absolute;right:0;bottom:0;font:800 12px Manrope;line-height:1.8;letter-spacing:2px;color:#fff;text-align:right}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:20px 0}.stat-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:17px 19px;box-shadow:var(--shadow);min-width:0}.stat-top{display:flex;justify-content:space-between;align-items:center;color:#73869a;font-size:12px}.stat-top i{font-style:normal;width:31px;height:31px;border-radius:10px;background:#eef5ff;color:#3474e2;display:flex;align-items:center;justify-content:center;font-size:16px}.stat-card strong{font:800 25px Manrope;display:block;margin:10px 0 5px;overflow-wrap:anywhere}.stat-card small{font-size:11px;color:#8a9aab}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr);gap:16px;margin-bottom:17px}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:17px;box-shadow:var(--shadow);min-width:0}.dashboard-grid .panel{margin-bottom:0}.panel h3{font:800 15px Manrope;margin:0 0 7px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.panel-head h3{margin:0 0 5px}.panel-head p,.muted{margin:0;color:var(--muted);font-size:12px}.panel-head>a{font-size:11px;font-weight:700;white-space:nowrap}.table-wrap{overflow-x:auto;width:100%}table{border-collapse:collapse;width:100%;font-size:12px;white-space:normal}th{text-align:left;color:#8797a8;font-size:10px;letter-spacing:.5px;text-transform:uppercase;background:#f8fafd;font-weight:700}th,td{padding:12px 10px;border-bottom:1px solid #edf1f6;vertical-align:middle}td{color:#4f657a}td b{color:#263e55}tbody tr:last-child td{border-bottom:0}.subline{display:block;font-size:10px;color:#94a2b1;margin-top:4px}.empty{color:#94a2b1;text-align:center;padding:25px!important}.padded{padding:20px}.pill{display:inline-block;padding:5px 8px;border-radius:20px;background:#eff3f7;color:#68798c;font-size:10px;font-weight:700;text-transform:capitalize;white-space:nowrap}.pill.active,.pill.paid,.pill.present,.pill.resolved,.pill.enrolled{background:#e8f7f0;color:#188467}.pill.new,.pill.unpaid,.pill.absent,.pill.withdrawn,.pill.complaint{background:#fff0ef;color:#cf625b}.pill.partial,.pill.pending,.pill.contacted,.pill.in_progress,.pill.late{background:#fff6e7;color:#b98026}.pill.scheduled,.pill.trial_booked,.pill.excused{background:#edf4ff;color:#3b73ce}.quick-actions{display:flex;flex-direction:column}.quick{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid #edf1f6;color:var(--ink)}.quick:last-child{border-bottom:0}.quick i{font-style:normal;width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:#eef5ff;color:#3676e2;font-size:16px}.quick span{flex:1}.quick b,.quick small{display:block}.quick b{font-size:12px}.quick small{font-size:10px;color:#8a9aab;margin-top:4px}.quick em{font-style:normal;color:#8fa0b1}.two-col{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(0,1.4fr);gap:17px;align-items:start}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.form-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid label,.filterbar label,.mini-form label{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:700;color:#60758a;min-width:0}.form-grid input,.form-grid select,.form-grid textarea,.filterbar input,.filterbar select,.mini-form input,.mini-form select,.mini-form textarea,select{font:12px 'DM Sans',sans-serif;color:#344d65;background:#fff;border:1px solid #dfe7ef;border-radius:8px;padding:10px 11px;min-width:0;width:100%;outline:none}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:#78a8f7;box-shadow:0 0 0 3px #3978e814}.wide{grid-column:1/-1}.form-actions{display:flex;gap:9px;align-items:center}.btn{border:1px solid #dfe7ef;background:#fff;color:#51677d;border-radius:8px;padding:10px 14px;font:700 11px 'DM Sans';display:inline-flex;justify-content:center;align-items:center;cursor:pointer}.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn.primary:hover{background:var(--blue-dark)}.btn.full{width:100%;margin-top:18px}.searchbox{border:1px solid #e0e7ef;padding:10px;border-radius:8px;width:100%;margin:0 0 13px;font:12px 'DM Sans'}.progress{height:5px;background:#edf1f7;border-radius:10px;margin-top:7px;overflow:hidden}.progress span{display:block;height:100%;background:#4a87ef;border-radius:10px}.progress.tall{height:10px}.filterbar{display:flex;gap:12px;align-items:end;margin:15px 0}.filterbar label{min-width:180px}.mini-form{display:grid;gap:9px;min-width:220px;padding:12px 0}.mini-form label{font-weight:500}details summary{cursor:pointer;color:var(--blue);font-weight:700}.notice{padding:12px;background:#fff8e9;border:1px solid #f7e8c7;border-radius:9px;color:#8e6b2c;font-size:11px;margin-top:15px}.big-number{font:800 28px Manrope;margin:18px 0 7px}.small-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.small-stats .stat-card>span{font-size:11px;color:var(--muted)}footer{padding:16px 34px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#94a2b1;font-size:10px}footer span{color:#9daab8}.alert{padding:12px 14px;border-radius:9px;margin-bottom:16px;font-size:12px}.alert.success{background:#eaf8f2;color:#188467}.alert.error{background:#fff0ef;color:#c6524b}.auth-bg{min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at top left,#e1efff,transparent 48%),#f6f9fd;padding:20px}.auth-card{width:min(430px,100%);padding:32px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 20px 70px #244e8014;text-align:center}.auth-card .brand-mark{margin:0 auto 15px}.auth-card h1{font:800 21px Manrope;margin:0 0 7px}.auth-card>p{margin:0 0 24px}.auth-card form{text-align:left}.auth-card label{display:block;font-size:11px;font-weight:700;color:#60758a;margin:14px 0 6px}.auth-card input,.auth-card textarea{width:100%;padding:12px;border:1px solid #dfe7ef;border-radius:9px;font:13px 'DM Sans'}.demo-box{margin:18px 0;padding:13px;background:#f5f8fc;border-radius:10px;font-size:11px;line-height:1.9;color:#687d91;text-align:left}.auth-card>a{font-size:11px;font-weight:700}@media(max-width:1200px){.sidebar{width:220px}.main{margin-left:220px}.content{padding:22px}.topbar{padding:18px 22px}.stat-grid{gap:10px}.stat-card{padding:14px}.dashboard-grid{grid-template-columns:minmax(0,1.3fr) minmax(260px,1fr)}}@media(max-width:900px){.sidebar{width:68px;padding:17px 8px}.brand{padding:0 4px 25px}.brand>span:last-child,.nav-label,.nav-link:not(.active){font-size:0}.brand .brand-mark{width:44px}.nav-link{justify-content:center;padding:12px 5px;font-size:0}.nav-link span{font-size:18px}.nav-link.active{font-size:0}.sidebar-bottom{flex-wrap:wrap;justify-content:center}.user-meta,.logout{display:none}.main{margin-left:68px}.dashboard-grid,.two-col{grid-template-columns:1fr}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.content{padding:14px}.topbar{height:78px;padding:13px 15px}.topbar h2{font-size:18px}.date-chip{display:none}.welcome{padding:20px;min-height:140px}.welcome h1{font-size:19px}.welcome-art{display:none}.stat-grid{gap:8px}.stat-card{padding:12px}.stat-card strong{font-size:21px}.panel{padding:14px}.form-grid,.form-grid.compact{grid-template-columns:1fr}.wide{grid-column:auto}.filterbar{align-items:stretch;flex-direction:column}.filterbar label{min-width:0}footer{padding:13px;display:block;line-height:1.8}footer span{display:block}}
@media print{.sidebar,.topbar,.btn,.form-actions,footer{display:none!important}.main{margin:0}.content{padding:0}.panel,.stat-card{box-shadow:none;break-inside:avoid}}

/* Version 3 listing filters and performance charts */
.filterbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:16px 0}.filterbar label{min-width:150px;flex:1}.filterbar input,.filterbar select{width:100%;padding:10px;border:1px solid #dbe4ef;border-radius:9px;background:#fff}.chart-list{display:grid;gap:12px;padding:8px 0 18px}.chart-row{display:grid;grid-template-columns:minmax(110px,1fr) minmax(140px,3fr) 54px 80px;align-items:center;gap:12px}.chart-row .progress{margin:0}.chart-row small{color:#718096}@media(max-width:700px){.chart-row{grid-template-columns:1fr 2fr 45px}.chart-row small{display:none}}


.nav-group-label{padding-top:14px;padding-bottom:6px;font-size:9px;color:#8aa0a7;letter-spacing:1.2px}
.quick-section{margin:22px 0 24px}.quick-section>h3{font:700 14px Manrope;margin:0 0 12px}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.quick-card{background:#fff;border:1px solid #dcefe8;border-radius:14px;padding:17px;display:flex;flex-direction:column;gap:7px;color:var(--ink);box-shadow:0 3px 10px rgba(14,116,90,.035);min-height:112px;transition:transform .15s,box-shadow .15s}.quick-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(14,116,90,.09);color:var(--ink)}.quick-card>span{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:#e8faf3;color:#008b68;font-size:19px}.quick-card b{font-size:13px}.quick-card small{font-size:11px;color:var(--muted)}
.role-permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}.role-permission-card{border:1px solid var(--line);border-radius:14px;padding:18px;background:#fbfdff}.role-permission-card h3{margin:0 0 6px}.role-permission-card .muted{color:var(--muted);font-size:12px}.permission-check{display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid #edf1f5;font-size:13px}.permission-check:last-child{border-bottom:0}.permission-check input{width:16px;height:16px;accent-color:#07896d}.student-result-heading{display:flex;align-items:center;justify-content:space-between;margin-top:22px}.student-result-heading h3{margin:0}
@media(max-width:1100px){.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.role-permission-grid{grid-template-columns:1fr}.quick-grid{grid-template-columns:1fr 1fr}}

/* V7.3 account management and layout refinement */
.sidebar{overflow-y:auto;overflow-x:hidden;padding-top:18px;padding-bottom:12px}.brand{padding-bottom:20px}.nav-label{padding-bottom:7px}.nav-link{padding:9px 11px;margin:1px 0;line-height:1.25}.nav-group-label{margin-top:7px}.dashboard-grid{grid-template-columns:minmax(0,1fr)!important}.dashboard-grid>.panel{width:100%;min-width:0}.dashboard-grid .table-wrap{overflow-x:auto}.dashboard-grid table{min-width:650px}.content{padding-top:24px;padding-bottom:40px}.form-actions form{display:inline-flex}.permission-check{display:flex;align-items:center;gap:8px}
@media(max-width:900px){.sidebar{overflow-y:auto}.nav-link{padding:11px 5px}}

/* V7.3 payment summary: keep payment entry concise; subject details belong on receipt. */
.payment-total-summary{padding:14px 16px;border:1px solid var(--line,#dce5ef);border-radius:12px;background:var(--soft,#f7fafc);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-weight:600}
.pill.partial{background:#fff4d8;color:#8a5a00}.pill.unpaid{background:#ffe8e8;color:#a51f2b}.pill.paid{background:#e3f7ed;color:#087443}.pill.no_fee{background:#edf0f4;color:#536273}


/* Academic student-result search layout */
.academic-result-filterbar{display:grid;grid-template-columns:minmax(160px,.8fr) minmax(220px,1.2fr) minmax(260px,1.4fr) auto;align-items:end;gap:12px;width:100%;}
.academic-result-filterbar label{display:flex;flex-direction:column;gap:6px;min-width:0;flex:initial;}
.academic-result-filterbar input,.academic-result-filterbar select{width:100%;min-width:0;box-sizing:border-box;height:40px;padding:10px 11px;border:1px solid #dfe7ef;border-radius:8px;background:#fff;font:12px 'DM Sans',sans-serif;color:#344d65;}
.academic-result-filterbar .btn{height:40px;white-space:nowrap;}
@media(max-width:1050px){.academic-result-filterbar{grid-template-columns:repeat(2,minmax(0,1fr));}.academic-result-filterbar .btn{align-self:end;}}
@media(max-width:560px){.academic-result-filterbar{grid-template-columns:1fr;}.academic-result-filterbar .btn{width:100%;}}

/* Monthly payment matrix */
.payment-matrix{min-width:1120px;font-size:11px}.payment-matrix th,.payment-matrix td{padding:9px 7px}.payment-matrix th{white-space:nowrap}.payment-matrix td.matrix-cell{text-align:center;min-width:86px}.matrix-cell b,.matrix-cell small{display:block;white-space:nowrap}.matrix-cell b{font-size:10px}.matrix-cell small{font-size:10px;margin-top:4px;font-weight:700}.matrix-paid{background:#dff4e6;color:#146c43}.matrix-partial{background:#fff0c9;color:#875c00}.matrix-unpaid{background:#ffe0df;color:#a12626}.matrix-no_fee{background:#eef1f4;color:#66717d}.payment-matrix-wrap{border:1px solid var(--line);border-radius:9px}.matrix-note{font-size:11px;margin-top:12px;line-height:1.6}
/* Attendance history matrix */
.attendance-matrix-wrap{max-height:68vh;overflow:auto;border:1px solid var(--line);border-radius:10px}
.attendance-matrix{width:max-content;min-width:100%;font-size:11px}
.attendance-matrix th,.attendance-matrix td{min-width:125px;text-align:center;padding:10px 9px}
.attendance-matrix th:first-child,.attendance-matrix td:first-child{position:sticky;left:0;min-width:190px;max-width:230px;text-align:left;z-index:2}
.attendance-matrix th:first-child{background:#f8fafd;z-index:4}
.attendance-matrix td:first-child{background:#fff}
.attendance-matrix-session{vertical-align:top;white-space:normal;min-width:160px!important}
.attendance-matrix-session span{display:block;color:#5e7185;font-weight:800;text-transform:none;letter-spacing:0;font-size:11px}
.attendance-matrix-session small{display:block;color:#647a8e;font-size:10px;font-weight:600;text-transform:none;letter-spacing:0;line-height:1.35;margin-top:4px;min-width:140px;max-width:175px}
.attendance-matrix td:not(:first-child){white-space:nowrap}
.matrix-empty{color:#a4afbb}
.attendance-matrix-legend{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 0}


/* Attendance matrix jump target */
.attendance-matrix-panel{scroll-margin-top:24px}
html{scroll-behavior:smooth}
@media(max-width:560px){.panel-head:has(> a.btn){align-items:flex-start;flex-direction:column}.panel-head:has(> a.btn)>.btn{align-self:flex-start}}

/* Monthly attendance summary */
.attendance-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.attendance-summary-stats{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:18px}.summary-explainer{margin:12px 0 20px;padding:12px 14px;border:1px solid #dce9fb;background:#f3f8ff;border-radius:9px;color:#55708c;font-size:11px;line-height:1.6}.summary-table-head{margin-top:18px}.attendance-rate-value{font-size:12px;color:#55708c}.attendance-rate-low{color:#c34d49}.attendance-rate-high{color:#178469}@media(max-width:1000px){.attendance-summary-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.attendance-actions{justify-content:flex-start}.attendance-summary-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media print{.attendance-actions,form.filterbar,.summary-explainer{display:none!important}.attendance-summary-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.panel{border:0}}

/* Academic performance and progress */
.academic-performance-filters{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(160px,.9fr) minmax(230px,1.3fr) auto auto;gap:10px;align-items:end}
.academic-performance-filters label{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:11px;font-weight:700;color:#60758a}
.academic-performance-filters input,.academic-performance-filters select{width:100%;min-width:0;box-sizing:border-box;height:40px;padding:10px 11px;border:1px solid #dfe7ef;border-radius:8px;background:#fff;font:12px 'DM Sans',sans-serif;color:#344d65}
.performance-stats{grid-template-columns:repeat(4,minmax(0,1fr));margin:18px 0 24px}
.performance-subhead{margin-top:22px;margin-bottom:10px}
.performance-average,.performance-percent{display:flex;align-items:center;gap:10px;min-width:130px}
.performance-average .progress{flex:1;min-width:60px}
.performance-average b,.performance-percent b{font-variant-numeric:tabular-nums;white-space:nowrap;color:#29445f}
.performance-percent{gap:8px;min-width:100px}
.performance-percent .progress{flex:1;min-width:38px;margin:0}
.progress-table-head{margin-top:28px}
@media(max-width:1050px){.academic-performance-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.performance-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.academic-performance-filters,.performance-stats{grid-template-columns:1fr}.academic-performance-filters .btn{width:100%}}


/* Tutor subject selector: accessible dropdown + removable selected-subject chips. */
.tutor-form-panel .tutor-profile-form .tutor-subject-field {
    grid-column: 1 / -1;
    display: block;
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f8fbff;
}
.tutor-subject-field > label {
    display: block;
    margin-bottom: 7px;
    color: var(--ink);
    font-size: 12px;
    font-weight: 700;
}
.subject-picker-help {
    margin: 0 0 12px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}
.tutor-subject-controls {
    display: flex;
    align-items: stretch;
    gap: 10px;
}
.tutor-subject-controls select {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 42px;
    background: #fff;
}
.tutor-subject-controls .btn {
    width: auto;
    min-width: 145px;
    align-self: stretch;
    white-space: nowrap;
}
.tutor-selected-subjects {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 18px;
    margin-top: 13px;
}
.tutor-subject-chip {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 6px 8px 6px 12px;
    border: 1px solid #cddfff;
    border-radius: 999px;
    background: #eaf2ff;
    color: #245ac1;
    font-size: 12px;
    font-weight: 700;
}
.tutor-subject-chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    height: 21px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #d6e5ff;
    color: #245ac1;
    font: 700 16px/1 'DM Sans', sans-serif;
    cursor: pointer;
}
.tutor-subject-chip-remove:hover,
.tutor-subject-chip-remove:focus-visible {
    background: #245ac1;
    color: #fff;
}
.subject-picker-count {
    display: block;
    margin-top: 10px;
    color: var(--muted);
    font-size: 11px;
}
@media (max-width: 620px) {
    .tutor-subject-controls {
        flex-direction: column;
    }
    .tutor-subject-controls .btn {
        width: 100%;
        min-width: 0;
    }
}


/* Tutor subject selector — refined dropdown, chips and responsive controls */
/* Tutor subject selector: clear control row and selected-subject chips */
.subject-picker.wide {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
    margin: 2px 0 0;
    padding: 18px;
    border: 1px solid #dce7f5;
    border-radius: 14px;
    background: linear-gradient(135deg, #f8fbff 0%, #ffffff 82%);
    box-shadow: inset 3px 0 0 rgba(57, 120, 232, 0.72);
}

.subject-picker-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.subject-picker-heading {
    min-width: 0;
}

.form-grid .subject-picker-label {
    display: block;
    margin: 0 0 6px;
    color: #263f59;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.35;
}

.subject-picker-hint {
    margin: 0;
    max-width: 720px;
    color: #718397;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.55;
}

.subject-picker-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-height: 28px;
    padding: 6px 10px;
    border: 1px solid #d9e7fb;
    border-radius: 999px;
    background: #eef5ff;
    color: #3269c4;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.subject-select-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 10px;
    width: 100%;
}

.form-grid .subject-select-row select.subject-select-dropdown {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 11px 13px;
    border: 1px solid #d8e3f0;
    border-radius: 10px;
    background-color: #fff;
    color: #344d65;
    font: 500 13px 'DM Sans', sans-serif;
    box-shadow: 0 1px 2px rgba(20, 44, 75, 0.025);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.form-grid .subject-select-row select.subject-select-dropdown:focus {
    border-color: #78a8f7;
    box-shadow: 0 0 0 4px rgba(57, 120, 232, 0.11);
}

.form-grid .subject-select-row .subject-add-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 17px;
    border: 1px solid #3978e8;
    border-radius: 10px;
    background: #3978e8;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 4px 10px rgba(57, 120, 232, .15);
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.form-grid .subject-select-row .subject-add-button > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .2);
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
}

.form-grid .subject-select-row .subject-add-button:hover {
    background: #245ac1;
    border-color: #245ac1;
    box-shadow: 0 5px 13px rgba(57, 120, 232, .22);
    transform: translateY(-1px);
}

.form-grid .subject-select-row .subject-add-button:active {
    transform: translateY(0);
}

.selected-subjects-panel {
    min-width: 0;
    padding: 13px 14px;
    border: 1px solid #e5edf7;
    border-radius: 11px;
    background: rgba(255, 255, 255, .82);
}

.selected-subjects-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px 12px;
    color: #536b83;
    font-size: 11px;
    font-weight: 800;
}

.selected-subjects-help {
    color: #8a9aab;
    font-size: 10px;
    font-weight: 400;
}

.selected-subject-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-height: 0;
    margin-top: 10px;
}

.subject-chip {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    max-width: 100%;
    padding: 6px 7px 6px 12px;
    border: 1px solid #cfe0fa;
    border-radius: 999px;
    background: #eef5ff;
    color: #2f5fae;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    box-shadow: 0 1px 2px rgba(32, 67, 111, .04);
}

.subject-chip-name {
    overflow-wrap: anywhere;
}

.form-grid .subject-chip-remove {
    display: inline-flex;
    flex: 0 0 23px;
    align-items: center;
    justify-content: center;
    width: 23px;
    height: 23px;
    margin: 0;
    padding: 0 0 1px;
    border: 1px solid #d2e2fa;
    border-radius: 50%;
    background: #fff;
    color: #5477a9;
    font: 500 16px/1 'DM Sans', sans-serif;
    cursor: pointer;
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}

.form-grid .subject-chip-remove:hover {
    border-color: #efc1c1;
    background: #fff0f0;
    color: #c44e4e;
}

.subject-empty {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 10px 0 0;
    padding: 10px 11px;
    border: 1px dashed #dbe5f1;
    border-radius: 8px;
    background: #fbfdff;
    color: #8192a5;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
}

.subject-empty[hidden] {
    display: none !important;
}

.subject-empty-icon {
    display: inline-flex;
    flex: 0 0 22px;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #eef5ff;
    color: #3978e8;
    font-size: 16px;
}

.subject-picker input[type="hidden"] {
    display: none !important;
}

@media (max-width: 720px) {
    .subject-picker.wide {
        padding: 14px;
    }

    .subject-picker-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .subject-select-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .form-grid .subject-select-row .subject-add-button {
        width: 100%;
    }
}



/* Dashboard overview: focused KPIs, alerts and visual summaries */
.dashboard-welcome { align-items: stretch; }
.dashboard-welcome-copy { max-width: 760px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.dashboard-date-label { display: inline-flex; flex-wrap: wrap; gap: 8px; margin-top: 17px; color: #dce9ff; font-size: 11px; font-weight: 600; }
.dashboard-stats { align-items: stretch; }
.dashboard-stat-card { position: relative; overflow: hidden; min-height: 126px; }
.dashboard-stat-card::after { content: ""; position: absolute; inset: auto 0 0; height: 3px; background: #3978e8; opacity: .85; }
.dashboard-stat-card.tone-green::after { background: #20a879; }
.dashboard-stat-card.tone-orange::after { background: #e6a23a; }
.dashboard-stat-card.tone-violet::after { background: #8b6ee8; }
.dashboard-stat-card.tone-cyan::after { background: #1da6b8; }
.dashboard-stat-card.tone-red::after { background: #de6464; }
.dashboard-stat-card.tone-green .stat-top i { background: #e8f8f1; color: #188467; }
.dashboard-stat-card.tone-orange .stat-top i { background: #fff5e6; color: #b87a21; }
.dashboard-stat-card.tone-violet .stat-top i { background: #f1edff; color: #7354c8; }
.dashboard-stat-card.tone-cyan .stat-top i { background: #e7f8fb; color: #16889a; }
.dashboard-stat-card.tone-red .stat-top i { background: #fff0ef; color: #c6524b; }
.dashboard-quick-section { margin: 22px 0 25px; }
.dashboard-section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 12px; }
.dashboard-section-heading h3 { font: 800 15px Manrope, sans-serif; margin: 0 0 5px; }
.dashboard-section-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.dashboard-quick-grid .quick-card { border-color: #dfe8f3; }
.dashboard-main-grid, .dashboard-secondary-grid, .dashboard-lower-grid { align-items: stretch; margin-bottom: 17px; }
.dashboard-panel { min-width: 0; height: 100%; }
.dashboard-panel .panel-head { align-items: flex-start; }
.dashboard-panel .panel-head > a { margin-top: 2px; }
.dashboard-panel-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 10px; background: #fff4e5; color: #b77c23; font-weight: 800; }
.dashboard-alert-list { display: flex; flex-direction: column; gap: 9px; }
.dashboard-alert-item { display: flex; gap: 10px; align-items: center; padding: 11px; border: 1px solid #edf1f6; border-radius: 11px; color: var(--ink); transition: transform .15s ease, border-color .15s ease, background .15s ease; }
.dashboard-alert-item:hover { transform: translateY(-1px); border-color: #d7e4f4; background: #fbfdff; color: var(--ink); }
.dashboard-alert-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 10px; background: #eef5ff; color: #3474e2; font-size: 15px; font-weight: 800; }
.dashboard-alert-item.tone-orange .dashboard-alert-icon { background: #fff5e6; color: #b87a21; }
.dashboard-alert-item.tone-red .dashboard-alert-icon { background: #fff0ef; color: #c6524b; }
.dashboard-alert-item.tone-violet .dashboard-alert-icon { background: #f1edff; color: #7354c8; }
.dashboard-alert-copy { flex: 1; min-width: 0; }
.dashboard-alert-copy b, .dashboard-alert-copy small { display: block; }
.dashboard-alert-copy b { font-size: 12px; }
.dashboard-alert-copy small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.dashboard-alert-item > strong { font: 800 18px Manrope, sans-serif; color: var(--ink); white-space: nowrap; }
.dashboard-clear-state { display: flex; align-items: center; gap: 11px; padding: 18px 13px; border: 1px solid #d9f0e5; border-radius: 12px; background: #f4fcf8; }
.dashboard-clear-state > span { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: #e1f7ec; color: #188467; font-weight: 800; }
.dashboard-clear-state b, .dashboard-clear-state small { display: block; }
.dashboard-clear-state b { font-size: 12px; }
.dashboard-clear-state small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.dashboard-footnote { margin-top: 13px; color: #8797a8; font-size: 10px; line-height: 1.5; }
.dashboard-attendance-rate { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 0 16px; border-bottom: 1px solid #edf1f6; }
.dashboard-attendance-rate > div:first-child strong { display: block; font: 800 30px Manrope, sans-serif; color: var(--green); }
.dashboard-attendance-rate > div:first-child small { color: var(--muted); font-size: 11px; }
.dashboard-attendance-counts { display: grid; grid-template-columns: auto auto; gap: 9px 8px; align-items: center; color: var(--muted); font-size: 11px; }
.dashboard-attendance-counts b { justify-self: end; color: var(--ink); }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.present-dot { background: #1ba77a; }
.late-dot { background: #e7a33b; }
.absent-dot { background: #dc6464; }
.excused-dot { background: #528be8; }
.dashboard-status-list { display: grid; gap: 14px; margin-top: 10px; }
.dashboard-status-label { display: flex; align-items: center; gap: 8px; color: #52697f; font-size: 11px; }
.dashboard-status-label b { margin-left: auto; color: var(--ink); font-variant-numeric: tabular-nums; }
.dashboard-status-track, .dashboard-subject-track { overflow: hidden; height: 7px; margin-top: 7px; border-radius: 20px; background: #edf1f6; }
.dashboard-status-track > span, .dashboard-subject-track > span { display: block; height: 100%; border-radius: inherit; transition: width .25s ease; }
.present-fill { background: #1ba77a; }
.late-fill { background: #e7a33b; }
.absent-fill { background: #dc6464; }
.excused-fill { background: #528be8; }
.dashboard-status-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 17px; padding-top: 12px; border-top: 1px solid #edf1f6; color: var(--muted); font-size: 10px; }
.dashboard-status-footer strong { color: var(--ink); }
.dashboard-subject-list { display: grid; gap: 13px; }
.dashboard-subject-label { display: flex; justify-content: space-between; gap: 12px; color: #52697f; font-size: 11px; }
.dashboard-subject-label span { overflow-wrap: anywhere; }
.dashboard-subject-label strong { color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
.dashboard-subject-track > span { background: linear-gradient(90deg, #3978e8, #73a6ff); }
.dashboard-subject-row > small { display: block; margin-top: 5px; color: #91a0af; font-size: 10px; }
.dashboard-empty-state { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 7px; padding: 25px 15px; border: 1px dashed #dfe7f0; border-radius: 12px; background: #fbfdff; }
.dashboard-empty-state > span { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 11px; background: #eef5ff; color: #3978e8; font-size: 19px; }
.dashboard-empty-state b { font-size: 12px; color: var(--ink); }
.dashboard-empty-state small { max-width: 270px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.dashboard-empty-state.compact { padding: 18px 12px; }
.dashboard-rate-badge { display: inline-block; padding: 5px 8px; border-radius: 999px; background: #eaf8f2; color: #188467; font-size: 10px; font-weight: 800; white-space: nowrap; }
.dashboard-rate-badge.low { background: #fff0ef; color: #c6524b; }
.dashboard-enquiries-panel { margin-bottom: 0; }
.dashboard-table { min-width: 630px; }
.dashboard-grid .dashboard-panel { margin-bottom: 0; }
@media (max-width: 1200px) {
    .dashboard-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .dashboard-main-grid, .dashboard-secondary-grid, .dashboard-lower-grid { grid-template-columns: minmax(0, 1fr) minmax(260px, 1fr); }
}
@media (max-width: 900px) {
    .dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dashboard-main-grid, .dashboard-secondary-grid, .dashboard-lower-grid { grid-template-columns: minmax(0, 1fr); }
    .dashboard-attendance-rate { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 560px) {
    .dashboard-stats { grid-template-columns: minmax(0, 1fr); }
    .dashboard-welcome { padding: 20px; }
    .dashboard-date-label { font-size: 10px; }
    .dashboard-attendance-counts { width: 100%; }
    .dashboard-panel .panel-head { flex-direction: column; }
}


/* Dark navigation refresh: single Overview group label */
.sidebar {
    background: #142238;
    border-right: 1px solid #24364e;
    color: #edf4ff;
    box-shadow: 8px 0 28px rgba(13, 27, 47, 0.08);
}
.sidebar .brand {
    color: #f4f7fc;
}
.sidebar .brand b {
    color: #f4f7fc;
}
.sidebar .brand small {
    color: #a4b4c9;
}
.sidebar .nav-label,
.sidebar .nav-group-label {
    color: #8fa4bf;
}
.sidebar .nav-link {
    color: #c0cde0;
    background: transparent;
    transition: background-color .16s ease, color .16s ease;
}
.sidebar .nav-link span {
    color: #a8bad1;
}
.sidebar .nav-link:hover {
    background: #20344f;
    color: #ffffff;
}
.sidebar .nav-link:hover span {
    color: #ffffff;
}
.sidebar .nav-link.active {
    background: #294463;
    color: #ffffff;
    box-shadow: inset 3px 0 #72a5ff;
}
.sidebar .nav-link.active span {
    color: #a8c8ff;
}
.sidebar .sidebar-bottom {
    border-top-color: #2a3d56;
}
.sidebar .avatar {
    background: #294b72;
    color: #dceaff;
}
.sidebar .user-meta b {
    color: #f0f5fc;
}
.sidebar .user-meta small {
    color: #a4b4c9;
}
.sidebar .logout {
    color: #a9bbd2;
}
.sidebar .logout:hover {
    color: #ffffff;
}


/* Parent portal: family-scoped child summary cards */
.parent-children-panel { margin-bottom: 24px; }
.parent-child-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; }
.parent-child-card { min-width: 0; padding: 18px; border: 1px solid var(--border, #e3eaf2); border-radius: 16px; background: var(--surface, #fff); }
.parent-child-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.parent-child-avatar { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 42px; border-radius: 13px; background: #e8f0ff; color: #244f9a; font-weight: 800; }
.parent-child-name { min-width: 0; }
.parent-child-name h4 { margin: 0 0 4px; font-size: 15px; }
.parent-child-name p { margin: 0; color: var(--muted, #718096); font-size: 12px; overflow-wrap: anywhere; }
.parent-child-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.parent-child-metrics > div { padding: 11px; border-radius: 10px; background: var(--surface-soft, #f6f8fb); }
.parent-child-metrics span { display: block; font-size: 11px; color: var(--muted, #718096); margin-bottom: 5px; }
.parent-child-metrics b { font-size: 15px; line-height: 1.35; overflow-wrap: anywhere; }
.parent-child-actions { display: flex; flex-wrap: wrap; gap: 14px; padding-top: 15px; margin-top: 14px; border-top: 1px solid var(--border, #e3eaf2); font-size: 12px; font-weight: 700; }
.parent-link-required { border-left: 4px solid #c88b18; }
@media (max-width: 560px) { .parent-child-card { padding: 14px; } .parent-child-metrics { gap: 8px; } }


/* Recurring class period controls */
.class-period-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    min-width: 0;
}
.class-period-controls[hidden] {
    display: none !important;
}
#class-weekday-hint {
    display: block;
    margin-top: 5px;
    color: var(--muted, #738297);
    line-height: 1.45;
}
@media (max-width: 760px) {
    .class-period-controls {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* Student QR attendance check-in */
.attendance-qr-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:18px 0;padding:18px 20px;border:1px solid #d7e5f4;border-radius:14px;background:linear-gradient(115deg,#f7fbff,#eef5fc)}
.attendance-qr-tools-copy{max-width:760px}.attendance-qr-eyebrow{display:inline-block;color:#3978c7;font-size:10px;letter-spacing:.11em;font-weight:800;margin-bottom:6px}.attendance-qr-tools h4,.attendance-qr-card h4{margin:0 0 7px;color:#18324f;font-size:16px}.attendance-qr-tools p,.attendance-qr-card p{margin:0;color:#60738b;font-size:12px;line-height:1.65}.attendance-qr-generate-form{flex:0 0 auto}
.attendance-qr-card{margin:16px 0 22px;padding:22px;border:1px solid #cfdeef;border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(28,54,82,.06)}.attendance-qr-content{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:26px;align-items:center}.attendance-qr-content>div:first-child{min-width:0}.attendance-qr-note{margin-top:12px!important;max-width:620px}.attendance-qr-image-wrap{display:flex;flex-direction:column;align-items:center;gap:12px;padding:18px 14px;border:1px solid #e1eaf4;border-radius:14px;background:#f8fbff}.attendance-qr-image-wrap #attendance-qr-image{display:flex;align-items:center;justify-content:center;width:260px;min-height:260px;background:#fff;border-radius:10px}.attendance-qr-image-wrap #attendance-qr-image img,.attendance-qr-image-wrap #attendance-qr-image canvas{display:block;max-width:100%;height:auto!important}.attendance-qr-image-wrap .btn{width:100%;justify-content:center}.attendance-qr-error{max-width:240px;color:#973b36;font-size:12px;text-align:center;line-height:1.5}.attendance-qr-link{margin-top:15px;padding:11px 13px;border-radius:9px;background:#f7f9fc;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px}.attendance-qr-link span{color:#728197}.attendance-qr-link a{overflow-wrap:anywhere;font-weight:700}.attendance-qr-host-warning{margin-top:14px!important;font-size:12px}.attendance-qr-host-warning code{font-size:11px}
@media(max-width:760px){.attendance-qr-tools{align-items:stretch;flex-direction:column}.attendance-qr-generate-form .btn{width:100%;justify-content:center}.attendance-qr-content{grid-template-columns:1fr}.attendance-qr-image-wrap{max-width:100%}}
@media print{body:has(#attendance-qr-card) .sidebar,body:has(#attendance-qr-card) .topbar,body:has(#attendance-qr-card) footer,body:has(#attendance-qr-card) .attendance-qr-tools,body:has(#attendance-qr-card) .filterbar,body:has(#attendance-qr-card) #attendance-qr-card .attendance-qr-link,body:has(#attendance-qr-card) #attendance-qr-card .btn{display:none!important}body:has(#attendance-qr-card) .main{margin:0!important;width:100%!important}body:has(#attendance-qr-card) .content{padding:0!important}body:has(#attendance-qr-card) #attendance-qr-card{border:0;box-shadow:none;max-width:760px;margin:0 auto}.attendance-qr-content{grid-template-columns:1fr}.attendance-qr-image-wrap{border:0;background:#fff}}

/* Retain the requested darker navigation theme across the latest TMS pages. */
.sidebar{background:#102338;border-right-color:#263d55;color:#eef4fb}
.sidebar .brand{color:#f0f5fc}
.sidebar .brand small{color:#9eb1c6}
.sidebar .nav-group-label,.sidebar .nav-label{color:#8ea4bb}
.sidebar .nav-link{color:#bdcada}
.sidebar .nav-link:hover{background:#19344f;color:#fff}
.sidebar .nav-link.active{background:#1d3b5a;color:#fff;box-shadow:inset 3px 0 #68a4ff}
.sidebar .sidebar-bottom{border-top-color:#2a435d}
.sidebar .user-meta b{color:#eff5fb}
.sidebar .user-meta small{color:#9db0c5}
.sidebar .logout{color:#b0c1d4}
.sidebar .avatar{background:#294865;color:#f2f7fd}


/* QR attendance action: keep generation obvious in the attendance header. */
.attendance-qr-header-form{display:inline-flex;align-items:center;margin:0}
.attendance-qr-header-form .btn{white-space:nowrap;min-height:36px}
.attendance-qr-header-form .btn:disabled{opacity:.55;cursor:not-allowed;filter:saturate(.45)}
.attendance-qr-tools{align-items:flex-start}
.attendance-qr-tools.is-ready{border-color:#bcd8f4;background:linear-gradient(115deg,#f5faff,#edf6ff)}
.attendance-qr-tools.is-unavailable{border-color:#f1d8a4;background:linear-gradient(115deg,#fffaf0,#fff5e4)}
.attendance-qr-reason{margin-top:9px!important;color:#986018!important}
.attendance-qr-ready-note{margin-top:9px!important;color:#176b50!important;font-weight:700}
@media(max-width:980px){.attendance-qr-header-form{width:100%}.attendance-qr-header-form .btn{width:100%;justify-content:center}}


/* Payment Matrix: per-student / per-month payment editing */
.payment-matrix .matrix-cell-content{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:70px}
.payment-matrix-edit-btn{font-size:10px;padding:4px 8px;min-height:24px;line-height:1.1;margin-top:3px;color:#285fc2;border-color:#cbdcf7;background:#fff}
.payment-matrix-edit-btn:hover{background:#eff5ff;border-color:#98baf3}
.payment-month-edit-header{align-items:flex-start}
.payment-month-edit-actions{display:flex;gap:8px;flex-wrap:wrap}
.payment-month-stat-grid{margin:16px 0 0}
.payment-month-stat-grid .stat-card strong{font-size:22px}
.payment-month-hint{margin-top:0}
.payment-record-edit-panel .panel-head p{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.payment-month-edit-form{margin-top:10px}
@media(max-width:760px){.payment-month-edit-header{flex-direction:column}.payment-month-edit-actions{width:100%}.payment-month-edit-actions .btn{flex:1}}


/* Parent online payment workflow */
.online-payment-panel { max-width: 1180px; }
.online-payment-filter { flex-wrap: wrap; align-items: end; margin: 18px 0 22px; }
.online-payment-filter label { min-width: 220px; flex: 1; }
.online-payment-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 18px 0 22px; }
.online-payment-summary > div { min-width: 0; padding: 16px; background: #f7faff; border: 1px solid #e5edf7; border-radius: 12px; display: flex; flex-direction: column; gap: 7px; }
.online-payment-summary strong { font: 800 20px Manrope, sans-serif; color: var(--ink); overflow-wrap: anywhere; }
.online-payment-summary small { color: var(--muted); font-size: 11px; line-height: 1.4; }
.online-payment-summary .online-amount-due { background: #fff8eb; border-color: #f1dfbd; }
.online-method-choice { display: flex; align-items: center; gap: 14px; padding: 17px; border: 1px solid #9dc1ff; background: #f1f7ff; border-radius: 12px; margin: 18px 0; }
.online-method-icon { width: 42px; height: 42px; border-radius: 12px; background: #dceaff; color: #245ac1; display: flex; align-items: center; justify-content: center; font-size: 23px; font-weight: 800; flex-shrink: 0; }
.online-method-text { display: flex; flex-direction: column; gap: 5px; flex: 1; min-width: 0; }
.online-method-text strong { color: var(--ink); font-size: 13px; }
.online-method-text span { color: var(--muted); font-size: 11px; line-height: 1.6; }
.online-method-selected { color: #245ac1; background: #dceaff; border-radius: 20px; padding: 6px 10px; white-space: nowrap; font-size: 10px; font-weight: 800; }
.online-pay-action { margin-top: 18px; }
.online-pay-button { padding: 13px 18px; font-size: 12px; }
.online-payment-footnote { max-width: 700px; line-height: 1.65; margin-top: 13px; }
.online-setup-notice { line-height: 1.7; }
.online-result-icon { width: 54px; height: 54px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 800; margin: 18px 0; }
.online-result-icon.success { background: #e2f7eb; color: #13845f; }
.online-result-icon.warning { background: #fff2d6; color: #a86b00; }
.online-result-icon.pending { background: #e8f1ff; color: #2c69cb; }
.online-result-amount { font: 800 28px Manrope, sans-serif; margin: 18px 0; color: var(--ink); }
@media(max-width:850px) { .online-payment-summary { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media(max-width:560px) { .online-payment-summary { grid-template-columns: 1fr; } .online-method-choice { align-items: flex-start; flex-wrap: wrap; } .online-method-selected { margin-left: 56px; } }

.online-reconciliation-panel { border-color: #f1dfbd; }
.online-reconciliation-panel .panel-head { margin-bottom: 12px; }


/* Optional LMS login controls embedded in TMS profile forms. */
.profile-login-panel{grid-column:1/-1;min-width:0;margin:4px 0;padding:16px 18px;border:1px solid #d8e5f7;border-radius:12px;background:#f5f9ff;}
.profile-login-panel legend{padding:0 7px;color:#245ac1;font-size:12px;font-weight:800;letter-spacing:.02em;}
.profile-login-toggle-label{display:flex;align-items:center;gap:9px;font-weight:700;color:#1e3449;margin:2px 0 12px;}
.profile-login-toggle-label input{width:auto;min-height:auto;accent-color:#3978e8;}
.profile-login-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0;}
.profile-login-fields[hidden]{display:none!important;}
.profile-login-fields label{display:flex;flex-direction:column;gap:6px;min-width:0;color:#60758a;font-size:11px;font-weight:700;}
.profile-login-panel>small{display:block;color:#718397;font-size:11px;line-height:1.55;margin-top:8px;}
.profile-login-existing{border-left:3px solid #3978e8;}
@media(max-width:700px){.profile-login-fields{grid-template-columns:1fr;}}


/* TTI official logo integration */
.tti-logo{display:block;object-fit:contain;background:#fff;flex:0 0 auto;}
.brand .tti-logo-sidebar{width:48px;height:48px;padding:2px;border-radius:9px;margin-right:10px;}
.brand{align-items:center;}
.auth-card .tti-logo-login{width:96px;height:96px;object-fit:contain;padding:3px;border-radius:12px;margin:0 auto 14px;}
.auth-card{text-align:center;}
.auth-card form,.auth-card .alert,.auth-card .muted{text-align:left;}
@media(max-width:700px){.brand .tti-logo-sidebar{width:42px;height:42px;margin-right:8px}.auth-card .tti-logo-login{width:82px;height:82px}}

/* TTI TMS identity: operational management uses navy and gold; intentionally distinct from teal/violet LMS. */
:root{--ink:#1e3449;--muted:#8b98a8;--blue:#b8892f;--blue-dark:#946a1b;--pale:#fbf5e8;--line:#e9e1d2;--bg:#f7f8fa;--white:#fff;--green:#16856b;--shadow:0 8px 30px rgba(40,49,62,.06)}
body{background:#f7f8fa}
.sidebar{background:#17283c;border-right-color:#2b3c50;color:#f5f0e5}
.sidebar .brand{color:#fff9eb}
.sidebar .brand small{color:#c4b48c}
.sidebar .nav-label,.sidebar .nav-group-label{color:#bca978}
.sidebar .nav-link{color:#c6d0dc}
.sidebar .nav-link:hover{background:#ffffff0d;color:#fff}
.sidebar .nav-link.active{background:linear-gradient(100deg,#b88b36,#95702b);color:#fff;box-shadow:inset 3px 0 #f1dba3}
.sidebar .nav-link.active span{color:#fff}
.sidebar .sidebar-bottom{border-top-color:#344458}
.sidebar .avatar{background:#f4e7c5;color:#74551d}
.topbar{border-bottom-color:#e9e1d2;background:#fff}
.topbar .eyebrow{color:#9b762d}
.date-chip{color:#7e6025;background:#f8efd9}
.btn.primary{background:#a77b2b;border-color:#a77b2b;color:#fff}
.btn.primary:hover{background:#89621f}
.btn:focus-visible,.nav-link:focus-visible{outline:3px solid #dfc17b;outline-offset:2px}
a{color:#9b762d}
a:hover{color:#79571d}
.stat-top i,.quick i{background:#f8efd9;color:#9b762d}
.progress span{background:linear-gradient(90deg,#b8892f,#e2c477)}
.pill.scheduled,.pill.trial_booked,.pill.excused{background:#f8efd9;color:#8a6827}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:#c6a45d;box-shadow:0 0 0 3px #b8892f18}
.details summary{color:#9b762d}
.profile-login-panel{border-color:#e7d8b7;background:#fcf8ef;box-shadow:inset 3px 0 #b8892f}
.profile-login-panel legend{color:#8b6828}
.profile-login-toggle-label input{accent-color:#a77b2b}
.profile-login-existing{border-left-color:#b8892f}
@media(max-width:900px){.sidebar{background:#17283c}}

/* Payment record month is independent from the monthly-status filter. */
.payment-record-month-control{padding:14px 16px;border:1px solid var(--line,#e5d9c8);border-radius:12px;background:var(--soft,#fbf8f2)}
.payment-record-month-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.payment-record-month-row input[type="month"]{max-width:220px;min-width:180px}
.payment-record-month-row strong{color:var(--ink,#172b45);font-size:13px}
.payment-record-month-control small{display:block;margin-top:7px;color:var(--muted,#718096);font-size:12px}
#payment-charge-type{max-width:100%}

/* Parent attendance: linked-student drawer cards and individual reports */
.parent-attendance-page .panel-head { margin-bottom: 20px; }
.parent-attendance-drawers { display: grid; gap: 12px; }
.parent-attendance-drawer { border: 1px solid var(--border, #dfe5ed); border-radius: 14px; background: var(--surface, #fff); overflow: hidden; }
.parent-attendance-drawer[open] { box-shadow: 0 8px 24px rgba(20, 35, 60, .07); }
.parent-attendance-drawer-trigger { display: flex; align-items: center; gap: 14px; padding: 16px 18px; cursor: pointer; list-style: none; min-height: 76px; }
.parent-attendance-drawer-trigger::-webkit-details-marker { display: none; }
.parent-attendance-avatar { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%; display: grid; place-items: center; font-weight: 750; background: #e8efff; color: #2748a5; }
.parent-attendance-student-info { display: grid; gap: 4px; min-width: 0; flex: 1; }
.parent-attendance-student-info strong { font-size: 1rem; }
.parent-attendance-student-info small { color: var(--muted, #697586); font-size: .84rem; }
.parent-attendance-open-label { color: var(--primary, #3158c8); font-size: .88rem; font-weight: 650; white-space: nowrap; }
.parent-attendance-chevron { color: var(--muted, #697586); font-size: 1.25rem; transition: transform .18s ease; }
.parent-attendance-drawer[open] .parent-attendance-chevron { transform: rotate(180deg); }
.parent-attendance-drawer-content { padding: 4px 18px 20px; border-top: 1px solid var(--border, #e6eaf0); }
.parent-attendance-report-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0; }
.parent-attendance-report-heading h4 { margin: 0 0 5px; }
.parent-attendance-report-heading p { margin: 0; color: var(--muted, #697586); font-size: .88rem; }
.parent-attendance-rate { text-align: right; flex: 0 0 auto; }
.parent-attendance-rate strong { display: block; font-size: 1.5rem; }
.parent-attendance-rate span { color: var(--muted, #697586); font-size: .78rem; }
.parent-attendance-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 4px 0 18px; }
.parent-attendance-stats > div { padding: 12px 14px; border-radius: 10px; background: var(--surface-soft, #f6f8fb); display: grid; gap: 5px; }
.parent-attendance-stats span { color: var(--muted, #697586); font-size: .82rem; }
.parent-attendance-stats strong { font-size: 1.25rem; }
.parent-attendance-history { margin-top: 4px; }
@media (max-width: 620px) {
  .parent-attendance-drawer-trigger { gap: 10px; padding: 13px; }
  .parent-attendance-open-label { display: none; }
  .parent-attendance-drawer-content { padding: 4px 12px 14px; }
  .parent-attendance-report-heading { align-items: flex-start; }
  .parent-attendance-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Titian Impian premium shell and dashboard refresh (2026-11-04). */
:root{--ink:#172b46;--muted:#6e7d8f;--blue:#315f9e;--blue-dark:#244a80;--pale:#eef3f7;--line:#e4e7e9;--bg:#f5f4f0;--white:#fff;--green:#28715d;--gold:#b58a43;--shadow:0 4px 16px rgba(25,43,62,.045)}
html{scrollbar-color:#a9b0b4 #f1f0eb;scrollbar-width:thin}body{background:var(--bg);color:var(--ink)}a{color:#315f9e}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid rgba(181,138,67,.55);outline-offset:2px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#f1f0eb}::-webkit-scrollbar-thumb{background:#b9c0c2;border:2px solid #f1f0eb;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#909da1}
.sidebar{width:264px;padding:18px 14px 14px;background:#132843;border-right:1px solid #243c58;color:#e9edf0}.brand{gap:10px;padding:0 8px 20px;color:#f7f4ed}.brand .tti-logo-sidebar{width:46px;height:46px;margin:0;padding:2px;border:1px solid #ffffff38;border-radius:8px}.brand b{color:#fff;font-size:14px}.brand small{color:#afbdca;font-size:10px}.sidebar-navigation{min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-color:#546578 #132843;scrollbar-width:thin}.sidebar-navigation::-webkit-scrollbar-track{background:#132843}.sidebar-navigation::-webkit-scrollbar-thumb{background:#546578;border-color:#132843}.nav-group-label{margin-top:10px;padding:12px 12px 6px;color:#b4a278;font-size:9px;letter-spacing:1.35px}.nav-link{min-height:38px;gap:11px;margin:2px 0;padding:8px 11px;border-radius:6px;color:#c1ccd5;font-size:12px;font-weight:500;transition:color .16s,background .16s}.nav-link span{width:19px;color:#d0b77d;font-size:15px}.nav-link:hover{background:#ffffff12;color:#fff}.nav-link.active{background:#213b58;box-shadow:inset 3px 0 var(--gold);color:#fff;font-weight:700}.nav-link.active span{color:#e2bf73}.sidebar-bottom{gap:9px;margin-top:10px;padding:13px 5px 2px;border-color:#34495f}.sidebar .avatar{background:#d8c08c;color:#1e3652}.sidebar .user-meta b{color:#fff}.sidebar .user-meta small,.sidebar .logout{color:#bac5cf}.sidebar .logout:hover{color:#f0ce84}.main{margin-left:264px}
.topbar{min-height:82px;height:auto;padding:16px 34px;background:#fffffff0;border-color:#e6e5e0}.topbar .eyebrow{color:#8c7650;font-size:9px;letter-spacing:1.55px}.topbar h2{margin-top:5px;color:#1b304a;font-size:21px;letter-spacing:-.035em}.date-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid #d9e9e1;border-radius:5px;background:#f3f8f5;color:#417560;padding:8px 11px;font-size:10px;font-weight:700}.date-chip span{font-size:8px}.content{max-width:1680px;padding:28px 34px 42px}
.welcome.dashboard-welcome{min-height:186px;padding:28px 32px;border:1px solid #1a3554;border-radius:9px;background:#183453;box-shadow:0 10px 28px #1228421c}.dashboard-welcome::after{position:absolute;right:125px;bottom:-140px;width:310px;height:310px;border:1px solid #dec2852b;border-radius:50%;content:""}.dashboard-welcome-copy{position:relative;z-index:1}.eyebrow.light{color:#d7c18e;font-size:9px;letter-spacing:1.7px}.welcome h1{margin:10px 0 8px;font-size:clamp(23px,2vw,30px);letter-spacing:-.04em}.welcome p{max-width:620px;color:#d4dce3;font-size:13px;line-height:1.65}.dashboard-date-label{display:inline-block;margin-top:16px;color:#bac8d4;font-size:10px}.welcome-art{z-index:1;width:210px;color:#dec18594;font-size:80px}.welcome-art span{top:12px;right:45px;color:#dec185cc;font-size:27px}.welcome-art b{right:0;bottom:8px;color:#e0c68f;font-size:9px;letter-spacing:2.2px}
.dashboard-stats{gap:12px;margin:16px 0 25px}.dashboard-stat-card.stat-card{position:relative;overflow:hidden;padding:15px 16px 14px;border:1px solid #e6e5e0;border-radius:8px;background:#fff;box-shadow:0 2px 10px #192b3e08}.dashboard-stat-card::after{top:0;right:auto;bottom:auto;left:0;width:100%;height:2px;background:#56789d}.dashboard-stat-card.tone-green::after{background:#4a8b73}.dashboard-stat-card.tone-orange::after{background:#b58a43}.dashboard-stat-card.tone-violet::after{background:#78789a}.dashboard-stat-card.tone-cyan::after{background:#5a8790}.dashboard-stat-card.tone-red::after{background:#b66d65}.dashboard-stat-card .stat-top{color:#73808c;font-size:10px;line-height:1.35}.dashboard-stat-card .stat-top i{width:28px;height:28px;border:1px solid #ebe9e2;border-radius:7px;background:#f7f6f1;color:#6b7782;font-size:14px}.dashboard-stat-card.tone-green .stat-top i,.dashboard-stat-card.tone-orange .stat-top i,.dashboard-stat-card.tone-violet .stat-top i,.dashboard-stat-card.tone-cyan .stat-top i,.dashboard-stat-card.tone-red .stat-top i{border-color:#ebe9e2;background:#f7f6f1;color:#6b7782}.dashboard-stat-card strong{margin:12px 0 5px;color:#1c334e;font-size:clamp(19px,1.7vw,24px);letter-spacing:-.045em;font-variant-numeric:tabular-nums}.dashboard-stat-card small{color:#89939b;font-size:9px;line-height:1.45}
.dashboard-section-heading{margin-bottom:11px}.dashboard-section-heading h3{color:#1c334e;font-size:14px;letter-spacing:-.02em}.dashboard-section-heading p{color:#788590;font-size:11px}.dashboard-quick-section{margin:23px 0 25px}.dashboard-quick-grid{gap:10px}.dashboard-quick-grid .quick-card{min-height:110px;gap:6px;padding:14px;border:1px solid #e6e5e0;border-radius:8px;background:#fff;box-shadow:none;transition:border-color .16s,transform .16s,background .16s}.dashboard-quick-grid .quick-card:hover{transform:translateY(-2px);border-color:#cfc2a4;background:#fffefa;box-shadow:0 5px 14px #192b3e0d}.dashboard-quick-grid .quick-card>span{width:30px;height:30px;border-radius:7px;background:#f2f0e9;color:#8c7040;font-size:16px}.dashboard-quick-grid .quick-card b{color:#263d56;font-size:11px}.dashboard-quick-grid .quick-card small{color:#7e8992;font-size:9px;line-height:1.4}
.dashboard-grid{gap:14px}.dashboard-main-grid{grid-template-columns:minmax(0,1.45fr) minmax(290px,.85fr)!important}.dashboard-secondary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.dashboard-lower-grid{grid-template-columns:minmax(0,1.25fr) minmax(280px,.9fr)!important}.panel,.dashboard-panel{border:1px solid #e6e5e0;border-radius:8px;background:#fff;box-shadow:0 2px 10px #192b3e08}.panel{padding:18px}.panel h3,.panel-head h3{color:#1c334e;font-size:13px;letter-spacing:-.015em}.panel-head{margin-bottom:14px}.panel-head p,.muted{color:#788590;font-size:10px;line-height:1.5}.panel-head>a{color:#8c7040;font-size:10px}.panel-head>a:hover{color:#5e4825}th{background:#f7f6f2;color:#7a858e;font-size:9px;letter-spacing:.65px}th,td{padding:10px 9px;border-bottom-color:#efeee9}td{color:#5e6d7b;font-size:11px}td b{color:#233a54}.subline{color:#8b969e;font-size:9px}.dashboard-alert-item{border-color:#ebe9e3;border-radius:7px;background:#fff}.dashboard-alert-item:hover{border-color:#d7c9aa;background:#fffefa}.dashboard-alert-icon{border-radius:7px;background:#f1f2ef;color:#536e7c}.dashboard-alert-item.tone-orange .dashboard-alert-icon,.dashboard-alert-item.tone-red .dashboard-alert-icon,.dashboard-alert-item.tone-violet .dashboard-alert-icon{background:#f6f2e9;color:#876b3d}.dashboard-alert-copy b{color:#263d56;font-size:10px}.dashboard-alert-copy small,.dashboard-footnote{color:#84909a;font-size:9px}.dashboard-alert-item>strong{color:#263d56;font-size:16px}.dashboard-clear-state{border-color:#dce9e1;border-radius:7px;background:#f6faf7}.dashboard-clear-state>span{background:#e4f0e8;color:#39715a}.dashboard-clear-state b{color:#263d56;font-size:11px}.dashboard-clear-state small{color:#788590;font-size:9px}.dashboard-attendance-rate>div:first-child strong{color:#39715a;font-size:28px}.dashboard-attendance-counts{font-size:10px}.dashboard-status-list{gap:12px}.dashboard-status-track,.dashboard-subject-track{height:6px;background:#eeefeb}.dashboard-status-footer{color:#84909a;font-size:9px}.dashboard-subject-label{color:#596b7c;font-size:10px}.dashboard-subject-label strong{color:#263d56}.dashboard-subject-track>span{background:#738da6}.dashboard-subject-row>small{color:#89939b;font-size:9px}.dashboard-empty-state{border-color:#e5e6e1;border-radius:7px;background:#fbfbf9}.dashboard-empty-state>span{border-radius:7px;background:#f1f0e9;color:#8c7040}.dashboard-empty-state b{color:#263d56}.dashboard-empty-state small{color:#788590}.dashboard-rate-badge.low{background:#f7efeb;color:#9e554c}.parent-child-card{border-color:#e6e5e0;border-radius:8px;background:#fff}.parent-child-avatar{border-radius:8px;background:#f0eee7;color:#765f37}.parent-child-name h4{color:#233a54}.parent-child-metrics>div{border:1px solid #eeede7;border-radius:6px;background:#faf9f6}.parent-child-actions{border-color:#eceae4}.parent-child-actions a{color:#315f9e}.dashboard-welcome+.dashboard-stats{margin-top:15px}footer{border-color:#e6e5e0;color:#87919a;font-size:9px}footer span{color:#969fa6}.btn{border-color:#dfe2e2;border-radius:6px;color:#465a6d}.btn.primary{background:#264d79;border-color:#264d79}.btn.primary:hover{background:#193a60}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #b58a438c;outline-offset:2px}
@media(max-width:1200px){.sidebar{width:240px}.main{margin-left:240px}.topbar{padding-right:24px;padding-left:24px}.content{padding-right:24px;padding-left:24px}.dashboard-stats{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.sidebar{width:220px;padding-right:10px;padding-left:10px}.main{margin-left:220px}.sidebar-bottom{gap:7px}.user-meta b{font-size:10px}.dashboard-main-grid,.dashboard-secondary-grid,.dashboard-lower-grid{grid-template-columns:minmax(0,1fr)!important}}
@media(max-width:700px){.sidebar{position:sticky;inset:0 0 auto;z-index:20;display:block;width:100%;max-height:148px;overflow:hidden;padding:8px 12px 7px;border-right:0;border-bottom:1px solid #263e58}.brand{height:45px;padding:0 2px 7px;gap:8px}.brand .tti-logo-sidebar{width:34px;height:34px}.brand b{font-size:12px}.brand small{margin-top:1px;font-size:9px}.sidebar-navigation{display:flex;gap:4px;overflow-x:auto;overflow-y:hidden;padding:2px 0 5px}.nav-group-label{display:none}.nav-link{flex:0 0 auto;min-height:36px;gap:7px;margin:0;padding:6px 9px;border:1px solid transparent;border-radius:5px;font-size:10px;white-space:nowrap}.nav-link span{width:auto;font-size:13px}.nav-link.active{border-color:#40546a;box-shadow:inset 0 -2px #d0ad68;background:#203955}.sidebar-bottom{display:none}.main{min-height:calc(100vh - 90px);margin-left:0}.topbar{min-height:70px;padding:12px 16px}.topbar h2{font-size:18px}.topbar .eyebrow{font-size:8px}.content{padding:16px 14px 26px}.welcome.dashboard-welcome{min-height:165px;padding:20px}.welcome-art{width:110px;font-size:55px}.welcome-art span{right:22px}.dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dashboard-stat-card.stat-card{padding:12px}.dashboard-stat-card strong{font-size:19px}.dashboard-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}footer{padding:12px 14px}}
@media(max-width:420px){.top-actions{gap:8px}.top-actions .avatar{display:none}.welcome-art{display:none}.dashboard-stat-card .stat-top{align-items:flex-start;gap:5px}.dashboard-stat-card .stat-top i{width:24px;height:24px;flex:0 0 24px}.dashboard-stat-card small{font-size:8px}.dashboard-quick-grid{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(forced-colors:active){.nav-link.active,.btn.primary,.dashboard-stat-card,.panel{forced-color-adjust:auto}}

/* Attendance reports: absences are marked in red */
.att-report .pill.absent{background:#d92d20;color:#fff;font-weight:700;border-color:#d92d20}
.att-report .pill.att-zero{background:#f1f3f6;color:#8a97a8}
.att-report td.att-absent-cell,.att-report tr.att-absent-row td{background:#fdeceb}
.att-report tr.att-absent-row td{color:#b42318}
.att-absent-text{color:#d92d20!important}
.att-absent-stat{border-color:#f5b5b0}
@media print{.att-report .pill.absent,.att-report td.att-absent-cell,.att-report tr.att-absent-row td{-webkit-print-color-adjust:exact;print-color-adjust:exact}}