*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:#f4f6fa;color:#17263d}.container{max-width:1160px;margin:auto;padding-left:24px;padding-right:24px}.topbar{background:#102d4b;color:white;box-shadow:0 2px 10px #15283c1c}.brand{min-height:76px;display:flex;align-items:center;gap:12px}.brand-mark{background:#1fa7a0;color:#fff;border-radius:12px;padding:10px 15px;font-weight:800;font-size:22px}.brand strong{display:block;font-size:20px}.brand small{display:block;color:#c4d4e3;font-size:12px}.environment{margin-left:auto;font-size:11px;letter-spacing:1px;border:1px solid #65809a;padding:7px 10px;border-radius:20px}.layout{display:grid;grid-template-columns:220px 1fr;gap:28px;padding-top:32px;padding-bottom:50px}.sidebar{background:white;border:1px solid #e4eaf0;border-radius:12px;padding:20px;height:max-content}.side-title,.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.4px;color:#7890a6}.sidebar a{display:block;margin-top:14px;background:#eaf5f5;color:#126d70;text-decoration:none;border-radius:8px;padding:12px;font-weight:700}.side-note{font-size:12px;color:#7a8a9d;line-height:1.6;margin-top:24px}.content{min-width:0}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.heading h1{font-size:30px;margin:5px 0}.muted{color:#6e8094;line-height:1.6}.pill{background:#d9f4ec;color:#16765b;padding:7px 12px;border-radius:30px;font-weight:700}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card,.panel{background:white;border:1px solid #e3e9f0;border-radius:12px;padding:22px;margin-bottom:18px}.label{color:#72859b;font-size:13px}.value{font-size:23px;font-weight:750;margin-top:12px}.ok{color:#16805c}.bad{color:#b63c3c}.panel h2{font-size:18px;margin:0 0 18px}.detail{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid #e9edf2}.detail span{color:#748397}.detail strong{text-align:right;overflow-wrap:anywhere}.footer{color:#8292a4;font-size:12px;padding:20px 0;border-top:1px solid #e1e7ed}@media(max-width:740px){.layout{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.environment{display:none}}

.sidebar a{background:transparent;color:#25445d}.sidebar a:hover{background:#eaf5f5}.btn{display:inline-block;background:#0b766f;color:white;border:0;border-radius:8px;padding:11px 16px;font:inherit;font-weight:650;text-decoration:none;cursor:pointer}.btn.secondary{background:#e9f1f5;color:#17415c;margin-top:15px}.login-panel{max-width:470px;margin:20px auto}.form-panel{max-width:650px}label{display:block;font-weight:650;margin:16px 0}input:not([type=checkbox]),select{display:block;width:100%;margin-top:7px;padding:11px;border:1px solid #cad6e1;border-radius:8px;font:inherit}.check{display:flex;align-items:center;gap:8px}.error{padding:12px;background:#fff0ef;color:#9d2f29;border-radius:8px}.notice{padding:12px;background:#e6f7ef;color:#136044;border-radius:8px;margin-bottom:16px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%}th,td{padding:12px;border-bottom:1px solid #e3e9f0;text-align:left}th{color:#526b83;font-size:13px}

.btn:not(.secondary){background:var(--school-accent,#0b766f)}.brand-mark{background:var(--school-accent,#0b766f)}.settings-form h2{margin-top:24px;border-bottom:1px solid #e3e9f0;padding-bottom:10px}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}.settings-form textarea{display:block;width:100%;margin-top:7px;padding:11px;border:1px solid #cad6e1;border-radius:8px;font:inherit}.settings-form input[type=color]{max-width:100px;height:46px;padding:4px}.school-logo-preview{max-height:110px;max-width:240px;object-fit:contain}.settings-form .check{font-weight:400}@media(max-width:740px){.settings-grid{grid-template-columns:1fr}}

/* SFMS v0.5 */
.search-form{display:flex;gap:12px;align-items:center;margin-bottom:18px}.search-form input{margin:0;flex:1}.cards>.panel{min-width:0}.panel form .btn.secondary{margin-top:0}@media(max-width:900px){.cards{grid-template-columns:1fr}}

/* SFMS v0.7: coherent interactive styling */
.btn,.sidebar a{transition:background-color .16s ease,transform .16s ease,box-shadow .16s ease,filter .16s ease}
.btn:hover{filter:brightness(.88);transform:translateY(-1px);box-shadow:0 4px 12px #12263a22}
.btn:focus-visible,.sidebar a:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #6c9fe8;outline-offset:2px}
tbody tr:hover{background:#edf6ff}
a.table-link{color:#1752a0;font-weight:700;text-decoration:underline;text-underline-offset:3px}
a.table-link:hover{color:var(--school-accent,#0b766f)}
@media(prefers-reduced-motion:reduce){.btn,.sidebar a{transition:none}}

/* SFMS v0.8 family details and consistent action feedback */
.family-detail-link{color:#174d9b;font-weight:700;text-decoration:underline;text-decoration-color:#9fb8dc;text-underline-offset:3px;transition:color .15s ease,background-color .15s ease}
.family-detail-link:hover{color:var(--accent,#006fd0);background-color:#e8f2ff;text-decoration-color:currentColor}
.family-detail-link:focus-visible{outline:3px solid #6d9cf3;outline-offset:3px;border-radius:2px}
.family-detail-summary{display:flex;gap:2rem;flex-wrap:wrap;align-items:center;justify-content:space-between}
.family-detail-summary h2{margin:.35rem 0 0}
.table-wrap tbody tr:hover{background-color:#eff5ff}
.btn{transition:filter .15s ease,box-shadow .15s ease,transform .15s ease}
.btn:hover{filter:brightness(.91);box-shadow:0 4px 14px #163a5b22;transform:translateY(-1px)}
.btn:focus-visible{outline:3px solid #6d9cf3;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.btn,.family-detail-link{transition:none}}

/* v0.9 accessible action states */
.btn{transition:filter .18s ease,transform .18s ease,box-shadow .18s ease}.btn:hover{filter:brightness(.85);transform:translateY(-1px);box-shadow:0 3px 12px #0b204022}.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffbd45;outline-offset:2px}tbody tr:hover{background:#edf4ff}.payment-form{display:grid;gap:8px;min-width:180px}.payment-form label{display:grid;gap:4px;font-size:.82rem;font-weight:600}.payment-form input,.payment-form select{width:100%;min-width:0}.payment-form .btn{white-space:nowrap}.btn-sm{padding:7px 12px;font-size:.85rem}@media print{.topbar,.sidebar,.heading button,.heading .btn,.content>p>.btn{display:none!important}.layout{display:block}.content{width:100%;max-width:100%}.panel{box-shadow:none;border:0}.receipt{font-size:12pt}}

/* SFMS 1.0: consistent interactive elements */
.btn,button.btn{transition:filter .16s ease,box-shadow .16s ease,transform .16s ease}
.btn:hover,button.btn:hover{filter:brightness(.9);box-shadow:0 4px 12px rgba(18,40,70,.16);transform:translateY(-1px)}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #4d89e8;outline-offset:2px}
.table-wrap tbody tr:hover{background:#eef4ff}
.family-detail-link{color:#124f9e;text-decoration:underline;text-underline-offset:3px;font-weight:650}
.family-detail-link:hover{color:var(--school-accent,#075d73)}
@media(prefers-reduced-motion:reduce){.btn,button.btn{transition:none}}

/* v1.1 Fee Monitoring */
.monitor-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:end}
.monitor-filters label{display:flex;flex-direction:column;gap:7px;font-weight:700}
.monitor-filters select{width:100%}.monitor-submit,.report-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.monitor-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 22px}
.monitor-stats>div{border:1px solid #dce5ee;border-radius:12px;padding:15px;background:#f8fbff}
.monitor-stats span{display:block;color:#5b7190;font-size:13px}.monitor-stats strong{display:block;font-size:20px;margin-top:8px;color:#102d4c}
.numeric{text-align:right;white-space:nowrap}.fee-status{display:inline-block;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
.status-paid{background:#d9f6e7;color:#11643d}.status-partial{background:#fff0c7;color:#7b5200}.status-unpaid{background:#ffe2e2;color:#a52a2a}.status-no-charges{background:#e9eef3;color:#53687c}
@media(max-width:900px){.monitor-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.monitor-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.monitor-filters{grid-template-columns:1fr}.monitor-stats{grid-template-columns:1fr 1fr}.monitor-stats strong{font-size:16px}}
@media print{.sidebar,.topbar,.no-print,.report-actions,.btn{display:none!important}.container.layout{display:block!important}.content{width:100%!important;max-width:none!important}.panel{box-shadow:none;border:0;padding:0}.monitor-stats{grid-template-columns:repeat(4,1fr)}body{background:white}table{font-size:10px}tr{break-inside:avoid}}

/* SFMS v1.2 Quick Collection */
.quick-filters{display:flex;align-items:end;gap:14px;flex-wrap:wrap}.quick-filters label{flex:1;min-width:210px}.quick-header{display:flex;justify-content:space-between;gap:16px;align-items:end;flex-wrap:wrap}.quick-header label{min-width:230px}#quick-table tbody tr:hover{background:#edf5ff}#quick-table tbody tr[hidden]{display:none!important}@media(max-width:700px){.quick-filters,.quick-header{display:block}.quick-filters label,.quick-filters button{margin-bottom:12px}}

/* v1.3 unified compact clickable tables and monthly payment checklist */
.quick-filters{align-items:center}.quick-filters .quick-show{align-self:center;margin-top:18px;white-space:nowrap}
.clickable-row{cursor:pointer;transition:background-color .15s ease}.clickable-row:hover,.clickable-row:focus-visible{background:#e8f1ff!important;outline:2px solid var(--school-accent,#2358d0);outline-offset:-2px}
#quick-table td:first-child{font-weight:400}#quick-table td{vertical-align:middle}
.monthly-schedule{min-width:270px;max-width:460px}.month-list{display:grid;gap:8px;margin:12px 0}.month-line{padding:9px;border:1px solid #dce5ed;border-radius:8px}.month-line label{display:flex;align-items:center;gap:8px;margin:0 0 5px;font-weight:500}.month-line input[type=checkbox]{width:18px;height:18px}.month-line small{display:block;color:#52667d}.month-line input:not([type=checkbox]){width:100%;margin:3px 0}.student-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}.student-actions [hidden]{display:none!important}
@media(max-width:750px){.quick-filters .quick-show{margin-top:0}.month-list{min-width:230px}}
/* SFMS v1.4 Unified Collection Workspace */
.workspace-nav{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 18px}.workspace-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 18px}.workspace-stats>div{border:1px solid #dce5ee;border-radius:12px;background:white;padding:18px}.workspace-stats span{display:block;color:#637b93;font-size:13px}.workspace-stats strong{display:block;margin-top:6px;font-size:23px;color:#102d4c}.collection-card{margin-bottom:18px}.collection-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.collection-title h2{margin-bottom:5px}.collection-mini{display:flex;gap:16px;flex-wrap:wrap;padding:12px 0;margin-bottom:14px;border-bottom:1px solid #e1e8f0}.collection-mini span{font-size:14px;color:#5a6d82}.collection-mini b{color:#142b44}.month-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:10px}.month-tile{padding:12px;border:1px solid #dce5ee;border-radius:10px;background:#fff}.month-tile.month-paid{background:#eef9f2;border-color:#b5e4c7}.month-tile label{display:flex;align-items:center;gap:8px;font-weight:600;margin:0 0 7px}.month-tile input[type=checkbox]{width:18px;height:18px;flex-shrink:0}.month-tile small{display:block;color:#52677e;margin-bottom:5px}.month-tile input[type=text]{width:100%;margin-top:5px}.month-tile a{font-size:13px}.collection-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:18px 0}.collection-inputs label,.workspace-form>label{display:grid;gap:6px;font-weight:600}.collection-footer{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}.collection-footer button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}@media(max-width:700px){.workspace-stats{grid-template-columns:1fr 1fr}.workspace-stats strong{font-size:18px}}@media print{.workspace-form,.workspace-nav{display:none!important}}

.academic-existing{margin-top:1.25rem;min-width:0}
.academic-existing h3{margin:0 0 .5rem}
.academic-scroll{max-height:13rem;overflow:auto;border:1px solid #e1e7ed;border-radius:.5rem}
.academic-scroll ul{margin:.5rem 0;padding-inline-start:1.8rem}


footer.footer{background:#fff;color:#475569}
footer.footer .sfms-footer-content{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.65rem 1.15rem;text-align:center}
footer.footer .sfms-footer-content p{margin:0;font-size:.875rem}
.sfms-footer-content p a{color:#173b61;font-weight:700;text-decoration:underline;text-underline-offset:.18em}
.sfms-back-to-top{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .8rem;border:1px solid #cbd5e1;border-radius:999px;background:#f8fafc;color:#173b61;font-size:.8rem;font-weight:700;text-decoration:none}
.sfms-back-to-top:hover{background:#eaf0f7;border-color:#93a8bf}
.class-list-caption{margin:.2rem 0 .6rem;font-size:.8rem}
.class-list-head,.class-list li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);align-items:center;gap:.6rem;padding:0 .65rem}
.class-list-head{min-height:2rem;border-radius:.4rem .4rem 0 0;background:#eef3f9;color:#334155;font-size:.8rem;font-weight:700}
.class-list-scroll{max-height:12.5rem;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable}
.class-list{margin:0;padding:0;list-style:none}
.class-list li{box-sizing:border-box;height:2.5rem;border-bottom:1px solid #e2e8f0;font-size:.875rem}
.class-list li>*{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media print{.sfms-back-to-top{display:none}}

.academic-settings{scroll-margin-top:1rem}
.academic-stack{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem;margin-bottom:1rem}
.academic-stack .academic-section{margin:0;min-width:0}
.academic-section>h3{margin:0 0 .5rem}
.academic-section>p{margin:.25rem 0 .75rem}
.academic-section .academic-existing h4{margin:0 0 .5rem}
.academic-inline-form{display:flex;align-items:end;flex-wrap:wrap;gap:.75rem 1rem;margin:.75rem 0 1rem}
.academic-inline-form>label{flex:1 1 10rem;min-width:0;margin:0}
.academic-inline-form>button{margin:0}
@media(max-width:580px){
 .academic-inline-form>label{flex-basis:100%}
}

.academic-level-list{display:flex;flex-wrap:wrap;gap:.45rem;margin:0;padding:0;list-style:none}
.academic-level-list li{padding:.35rem .75rem;border:1px solid #dbe4ee;border-radius:.5rem;background:#f5f8fc;font-size:.875rem;color:#243b53;overflow-wrap:anywhere}
.academic-class-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));align-items:start;gap:.75rem}
.academic-class-group{min-width:0;border:1px solid #dbe4ee;border-radius:.65rem}
.academic-class-group h5{margin:0;padding:.55rem .75rem;border-radius:.6rem .6rem 0 0;background:#eef3f9;color:#243b53;font-size:.875rem;overflow-wrap:anywhere}
.academic-class-names{max-height:11.25rem;overflow-y:auto;margin:0;padding:0;list-style:none}
.academic-class-names li{height:2.25rem;box-sizing:border-box;padding:0 .75rem;border-bottom:1px solid #edf1f5;line-height:2.2rem;font-size:.875rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.academic-class-names li:last-child{border-bottom:0}
footer.footer .sfms-footer-content{flex-direction:column;gap:.45rem}
footer.footer .sfms-back-to-top{padding:.2rem .55rem;font-size:.72rem}

.school-brand-logo{display:block;flex:none;width:3rem;height:3rem;padding:.2rem;box-sizing:border-box;object-fit:contain;background:#fff;border:1px solid #dbe4ee;border-radius:.65rem}

.student-search-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(9rem,15rem) auto;align-items:center;gap:.65rem}
.student-search-form select{width:100%;min-width:0}
.student-results{max-height:55vh;overflow:auto;scrollbar-gutter:stable}
.student-results th{position:sticky;top:0;z-index:1;background:#fff}
@media(max-width:620px){.student-search-form{grid-template-columns:minmax(0,1fr)}}

.sfms-sidebar{background:linear-gradient(160deg,#fff 55%,#f2fbfa);padding:1rem}
.sfms-nav-group{margin-top:.85rem}
.sfms-nav-group h2{margin:0 0 .3rem .45rem;color:#475569;font-size:.68rem;text-transform:uppercase;letter-spacing:.09em}
.sfms-sidebar a.sfms-nav-link{display:flex;align-items:center;gap:.5rem;margin:.2rem 0;padding:.45rem .5rem;font-size:.86rem;line-height:1.3}
.sfms-nav-link span{display:grid;place-items:center;flex:none;width:1.65rem;height:1.65rem;border-radius:.45rem;background:#dff4ee;color:#09695d;font-size:1rem}
.sfms-nav-group:nth-of-type(2) .sfms-nav-link span{background:#ede9ff;color:#50379c}
.sfms-nav-group:nth-of-type(3) .sfms-nav-link span{background:#fff0d8;color:#854713}
.sfms-sidebar a[aria-current=page]{background:#d9f2ed;color:#124f49}
.receipt-history-search{display:flex;gap:.65rem;align-items:end;flex-wrap:wrap;margin-bottom:1rem}
.receipt-history-search label{margin:0}
.receipt-history-search label:first-child{flex:1 1 13rem}
.receipt-history-table td small{display:block}
.receipt-history-status{display:inline-block;padding:.2rem .5rem;border-radius:1rem;background:#e0f4e7;color:#155c36}
.receipt-history-status.is-cancelled{background:#fce8e8;color:#8d2525}

.sfms-sidebar .dashboard-fee-year{display:grid;gap:.45rem;margin:.5rem 0 .9rem;padding:.65rem;border:1px solid #dbe7ed;border-radius:.65rem;background:#f7fafc}
.sfms-sidebar .dashboard-fee-year label{display:grid;gap:.35rem;margin:0;font-size:.78rem}
.sfms-sidebar .dashboard-fee-year select{min-width:0;width:100%;padding:.4rem;font-size:.83rem}
.sfms-sidebar .dashboard-fee-year button{justify-self:start;padding:.4rem .6rem;font-size:.78rem}
