/* SDPS School Manager – front-end (login, portal, fee table, contact). */
:root{--sdps-ink:#1d2a2b;--sdps-muted:#5f6b6c;--sdps-brand:#0f3d3e;--sdps-accent:#e8a33d;--sdps-line:#e6e1d8;--sdps-soft:#f7f4ee;--sdps-red:#b3261e;--sdps-green:#1e7a46;--sdps-card:#fff}
.sdps-card{background:var(--sdps-card);border:1px solid var(--sdps-line);border-radius:14px;padding:24px;margin:0 0 20px;color:var(--sdps-ink);box-shadow:0 1px 2px rgba(0,0,0,.03)}
.sdps-muted{color:var(--sdps-muted)}.sdps-small{font-size:13px}
.sdps-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border:0;border-radius:999px;background:var(--sdps-brand);color:#fff!important;font-weight:600;font-size:15px;text-decoration:none;cursor:pointer}
.sdps-btn:hover{filter:brightness(1.1)}.sdps-btn:disabled{opacity:.55;cursor:not-allowed}
.sdps-btn--ghost{background:transparent;color:var(--sdps-brand)!important;border:1.5px solid var(--sdps-brand)}
.sdps-btn--block{width:100%;margin-top:12px}
.sdps-link{background:none;border:0;padding:0;color:var(--sdps-brand);text-decoration:underline;cursor:pointer;font:inherit}
.sdps-alert{padding:12px 14px;border-radius:10px;margin:0 0 16px;font-size:14px}
.sdps-alert--error{background:#fdecea;color:var(--sdps-red)}.sdps-alert--ok{background:#e7f5ec;color:var(--sdps-green)}.sdps-alert--warn{background:#fff4e0;color:#8a5a00}
.sdps-msg{min-height:1.2em;margin-top:8px;font-size:14px}.sdps-msg--error{color:var(--sdps-red)}.sdps-msg--ok{color:var(--sdps-green)}
.sdps-badge{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--sdps-soft);font-size:12px;font-weight:600;color:var(--sdps-brand)}
.sdps-badge--ok{background:#e7f5ec;color:var(--sdps-green)}

/* Login */
.sdps-login{max-width:440px;margin:24px auto}
.sdps-login h2{margin:0 0 4px}
.sdps-login label{display:block;font-weight:600;font-size:14px;margin:14px 0 6px}
.sdps-login input[type=tel],.sdps-login input[type=text],.sdps-login input[type=password],.sdps-contact input,.sdps-contact textarea{width:100%;box-sizing:border-box;min-height:46px;padding:10px 14px;border:1px solid var(--sdps-line);border-radius:10px;font-size:16px;background:#fff;color:var(--sdps-ink)}
.sdps-phone-row{display:flex;align-items:stretch;border:1px solid var(--sdps-line);border-radius:10px;overflow:hidden}
.sdps-phone-row span{display:flex;align-items:center;padding:0 12px;background:var(--sdps-soft);font-weight:600}
.sdps-phone-row input{border:0!important;border-radius:0!important}
#sdps-otp-code{letter-spacing:.4em;font-size:20px;text-align:center}
.sdps-or{display:flex;align-items:center;gap:10px;margin:20px 0 12px;color:var(--sdps-muted);font-size:13px}
.sdps-or:before,.sdps-or:after{content:"";flex:1;height:1px;background:var(--sdps-line)}
.sdps-social{display:grid;gap:10px}
.sdps-social-btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:46px;border:1px solid var(--sdps-line);border-radius:999px;color:var(--sdps-ink)!important;text-decoration:none;font-weight:600;background:#fff}
.sdps-social-btn:hover{background:var(--sdps-soft)}
.sdps-password{margin-top:20px;font-size:14px}.sdps-password summary{cursor:pointer;color:var(--sdps-muted)}
.sdps-password form p{margin:10px 0}.sdps-password .button{min-height:42px;padding:0 18px;border-radius:999px;border:0;background:var(--sdps-brand);color:#fff}

/* Portal */
.sdps-portal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.sdps-portal-head h2{margin:0}
.sdps-student-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.sdps-student-head h3{margin:0}.sdps-student-head p{margin:2px 0 0;font-size:14px}
.sdps-avatar{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none}
.sdps-avatar--blank{display:flex;align-items:center;justify-content:center;background:var(--sdps-soft);color:var(--sdps-brand);font-weight:700;font-size:22px}
.sdps-due{margin-left:auto;text-align:right}.sdps-due span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--sdps-muted)}
.sdps-due strong{font-size:24px}.sdps-due.is-due strong{color:var(--sdps-red)}.sdps-due.is-clear strong{color:var(--sdps-green)}
.sdps-table-wrap{overflow-x:auto}
.sdps-table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 12px}
.sdps-table th,.sdps-table td{padding:9px 8px;border-bottom:1px solid var(--sdps-line);text-align:left;vertical-align:top}
.sdps-table th{background:var(--sdps-soft);font-weight:600}
.sdps-table .num{text-align:right;white-space:nowrap}
.sdps-table tr.is-overdue td{background:#fff8f7}.sdps-overdue{color:var(--sdps-red);font-weight:600}
.sdps-pay-form{margin-bottom:18px}
.sdps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.sdps-panel{background:var(--sdps-soft);border-radius:12px;padding:16px}
.sdps-panel h4{margin:0 0 10px}
.sdps-lines{list-style:none;margin:0 0 10px;padding:0;font-size:14px}
.sdps-lines li{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dashed var(--sdps-line)}
.sdps-lines li.total{font-weight:700;border-bottom:0}
.sdps-autodebit{margin-top:8px;font-size:14px}
.sdps-history{margin-top:16px}.sdps-history summary{cursor:pointer;font-weight:600;margin-bottom:8px}

/* Portal tabs, attendance calendar, marks */
.sdps-tabs{display:flex;gap:6px;overflow-x:auto;border-bottom:1px solid var(--sdps-line);margin:0 0 16px;padding-bottom:8px;-webkit-overflow-scrolling:touch}
.sdps-tab{flex:none;border:1px solid var(--sdps-line);background:#fff;color:var(--sdps-ink);border-radius:999px;padding:8px 14px;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.sdps-tab.is-active{background:var(--sdps-brand);border-color:var(--sdps-brand);color:#fff}
.sdps-tabpanel h4{margin:16px 0 8px}
.sdps-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}
.sdps-stats div{background:var(--sdps-soft);border-radius:12px;padding:12px;text-align:center}
.sdps-stats strong{display:block;font-size:22px}.sdps-stats span{font-size:12px;color:var(--sdps-muted)}
.sdps-cal-head{display:flex;justify-content:space-between;align-items:center;margin:6px 0 10px}
.sdps-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;font-size:13px}
.sdps-cal-dn{font-size:11px;color:var(--sdps-muted);font-weight:600}
.sdps-cal-d{padding:8px 0;border-radius:8px;background:#f4f2ee}
.is-p{background:#e7f5ec!important;color:var(--sdps-green)}.is-a{background:#fdecea!important;color:var(--sdps-red);font-weight:700}
.is-l{background:#fff4e0!important;color:#8a5a00}.is-h{background:#eef3f8!important;color:#2c5282}
.sdps-legend span{display:inline-block;padding:2px 8px;border-radius:6px;margin-right:4px}
.sdps-exam{margin-bottom:14px}.sdps-exam-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;align-items:baseline}
.sdps-exam-head h4{margin:0}
.sdps-status{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;background:#f0f0f1}
.sdps-status--paid{background:#e7f5ec;color:#1e7a46}.sdps-status--unpaid{background:#fdecea;color:#b3261e}.sdps-status--partial{background:#fff4e0;color:#8a5a00}.sdps-status--waived{background:#eef3f8;color:#2c5282}
.sdps-staff-login label{display:block;font-weight:600;font-size:14px;margin:12px 0 6px}
.sdps-staff-login input[type=text],.sdps-staff-login input[type=password]{width:100%;box-sizing:border-box;min-height:46px;padding:10px 14px;border:1px solid var(--sdps-line);border-radius:10px;font-size:16px}
.sdps-staff-login .button{min-height:46px;padding:0 24px;border-radius:999px;border:0;background:var(--sdps-brand);color:#fff;font-weight:600;font-size:15px;cursor:pointer;margin-top:8px}
@media (max-width:600px){.sdps-stats{grid-template-columns:repeat(2,1fr)}}

/* Receipt */
.sdps-receipt{max-width:720px;margin:0 auto;background:#fff;border:1px solid var(--sdps-line);padding:28px;color:#111}
.sdps-receipt-head{display:flex;align-items:center;gap:14px;border-bottom:2px solid var(--sdps-brand);padding-bottom:12px}
.sdps-receipt-head img{height:64px}.sdps-receipt-head h2{margin:0}.sdps-receipt-head p{margin:2px 0 0;font-size:13px}
.sdps-receipt h3{text-align:center;letter-spacing:.1em;text-transform:uppercase;margin:16px 0}
.sdps-receipt-meta{width:100%;font-size:14px;margin-bottom:14px}.sdps-receipt-meta th{text-align:left;color:#555;font-weight:600;padding:4px 6px}.sdps-receipt-meta td{padding:4px 6px}
@media print{.sdps-noprint,header,footer,.site-header,.site-footer{display:none!important}.sdps-receipt{border:0}}

/* Fee structure + contact */
.sdps-fee-structure h3{margin-top:0}
.sdps-contact label{display:block;font-weight:600;font-size:14px;margin:0 0 14px}
.sdps-contact label input,.sdps-contact label textarea{margin-top:6px;font-weight:400}
.sdps-hp{position:absolute;left:-9999px}

@media (max-width:600px){
	.sdps-card{padding:16px;border-radius:12px}
	.sdps-due{margin-left:0;text-align:left;width:100%}
	.sdps-table{font-size:13px}.sdps-table th,.sdps-table td{padding:7px 5px}
}

/* ---------- Staff Portal ---------- */
.sp{max-width:760px;margin:0 auto;color:var(--sdps-ink)}
.sp-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.sp-top strong{display:block;font-size:20px}.sp-top span{font-size:13px;color:var(--sdps-muted)}
.sp-out{font-size:14px}
.sp-nav{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:16px;-webkit-overflow-scrolling:touch}
.sp-nav a{flex:none;padding:10px 16px;border-radius:999px;background:#fff;border:1px solid var(--sdps-line);text-decoration:none;color:var(--sdps-ink);font-weight:600;font-size:15px}
.sp-nav a.is-active{background:var(--sdps-brand);border-color:var(--sdps-brand);color:#fff}
.sp-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.sp-tile{display:block;background:#fff;border:1px solid var(--sdps-line);border-radius:16px;padding:18px;text-decoration:none;color:var(--sdps-ink);min-height:96px}
.sp-tile span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--sdps-muted)}
.sp-tile strong{display:block;font-size:19px;margin-top:6px}
.sp-tile em{display:block;font-style:normal;font-size:14px;margin-top:6px;color:var(--sdps-muted)}
.sp-tile--big{grid-column:1/-1;background:var(--sdps-brand);border-color:var(--sdps-brand);color:#fff}
.sp-tile--big span,.sp-tile--big em{color:#d5e6e6}.sp-tile--big strong{font-size:24px}
.sp-tile--muted{background:var(--sdps-soft)}
.sp-note{grid-column:1/-1;background:#fff4e0;color:#8a5a00;padding:14px;border-radius:12px;margin-bottom:12px}
.sp-help{font-size:14px;color:var(--sdps-muted);margin:8px 0 12px}
.sp-pick{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:12px}
.sp-pick label{display:flex;flex-direction:column;font-size:13px;font-weight:600;gap:4px}
.sp-pick .sp-grow{flex:1 1 220px}
.sp-pick select,.sp-pick input,.sp-form input,.sp-form select,.sp-form textarea{min-height:48px;padding:10px 12px;border:1px solid var(--sdps-line);border-radius:12px;font-size:16px;background:#fff;color:var(--sdps-ink);width:100%;box-sizing:border-box;font-family:inherit}
.sp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border:0;border-radius:999px;background:var(--sdps-brand);color:#fff!important;font-weight:700;font-size:16px;cursor:pointer;text-decoration:none}
.sp-btn--ghost{background:#fff;color:var(--sdps-brand)!important;border:1.5px solid var(--sdps-brand)}
.sp-btn:disabled{opacity:.6}
.sp-att-tools{display:flex;gap:8px;margin-bottom:10px}
.sp-att-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sp-kid{width:100%;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:2px solid transparent;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06);font:inherit;text-align:left;cursor:pointer;color:var(--sdps-ink);-webkit-tap-highlight-color:transparent}
.sp-roll{flex:none;width:36px;height:36px;border-radius:50%;background:var(--sdps-soft);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
.sp-name{flex:1;font-weight:600;font-size:16px;line-height:1.25}.sp-name small{display:block;font-weight:400;font-size:12px;color:var(--sdps-muted)}
.sp-st{flex:none;min-width:78px;text-align:center;padding:7px 10px;border-radius:999px;font-weight:700;font-size:14px}
.sp-kid.is-p .sp-st{background:#e7f5ec;color:#1e7a46}
.sp-kid.is-a{border-color:#f3b2ad;background:#fff6f5}.sp-kid.is-a .sp-st{background:#b3261e;color:#fff}
.sp-kid.is-l{border-color:#f4d49a}.sp-kid.is-l .sp-st{background:#b26200;color:#fff}
.sp-kid.is-h .sp-st{background:#2c5282;color:#fff}
.sp-save{position:sticky;bottom:0;display:flex;justify-content:space-between;align-items:center;gap:10px;background:rgba(251,248,243,.96);backdrop-filter:blur(6px);padding:12px 0;margin-top:12px;border-top:1px solid var(--sdps-line);z-index:5}
.sp-count{font-size:14px}.sp-count b.a{color:var(--sdps-red)}
.sp-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sp-list a{display:flex;align-items:center;gap:12px;background:#fff;border-radius:14px;padding:12px;text-decoration:none;color:var(--sdps-ink);border:1px solid var(--sdps-line)}
.sp-list img,.sp-ava{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none}
.sp-ava{background:var(--sdps-soft);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--sdps-brand)}
.sp-due{flex:none;font-size:12px;font-weight:700;color:var(--sdps-red);background:#fdecea;padding:4px 8px;border-radius:999px}
.sp-form h2{margin:0 0 4px}
.sp-form fieldset{border:0;background:#fff;border-radius:16px;padding:16px;margin:0 0 14px;display:grid;gap:12px}
.sp-form legend{font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--sdps-brand);padding:0;float:left;width:100%}
.sp-form label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:14px}
.sp-form label small{font-weight:400;color:var(--sdps-muted)}
.sp-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.sp-photo{display:flex;align-items:center;gap:12px}.sp-photo img{width:64px;height:64px;border-radius:12px;object-fit:cover}
.sp-file{display:inline-flex!important;flex-direction:row!important;align-items:center;gap:8px;min-height:48px;padding:0 16px;border:1.5px dashed var(--sdps-brand);border-radius:12px;cursor:pointer;color:var(--sdps-brand)}
.sp-file input{position:absolute;width:1px;height:1px;opacity:0}
.sp-more{margin-bottom:14px}.sp-more summary{cursor:pointer;font-weight:700;padding:12px 0;color:var(--sdps-brand)}
.sp-check{flex-direction:row!important;align-items:center;gap:8px}
.sp-check input{width:auto!important;min-height:0!important}
.sp-quick{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.sp-quick .sp-btn{min-height:42px;font-size:14px;padding:0 14px}
@media (max-width:480px){.sp-tiles{grid-template-columns:1fr 1fr}.sp-tile{padding:14px;min-height:84px}.sp-tile strong{font-size:16px}}

.sp-tile--alert{background:#8a2c0d!important;border-color:#8a2c0d!important}
.sp-changes li{background:#fff;border:1px solid var(--sdps-line);border-radius:14px;padding:12px}
.sp-changes label{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.sp-changes input[type=checkbox]{width:22px;height:22px;margin-top:2px;flex:none}
.sp-change{display:block;margin:4px 0;font-size:15px}.sp-change del{color:var(--sdps-red)}.sp-change ins{color:var(--sdps-green);text-decoration:none;font-weight:700}
.sp-save .sp-btn--ghost{margin-left:8px}
