:root{
  --app-bg:#f5f7fb;--surface:#ffffff;--surface-2:#fbfdff;--sidebar-bg:#ffffff;
  --sidebar-border:#e7ebf0;--text:#253247;--muted:#667085;--heading:#1f2937;
  --primary:#2563eb;--primary-soft:#eff6ff;--primary-border:#dbeafe;--hover:#f7f9fc;
  --danger:#dc2626;--divider:#edf0f4;--shadow:0 8px 26px rgba(15,23,42,.06);
  --topbar:#20252b;--input-bg:#fff;--input-border:#d0d5dd;--table-border:#e5e7eb;
}
html[data-bs-theme="dark"]{
  --app-bg:#0e1116;--surface:#171b22;--surface-2:#1d222a;--sidebar-bg:#10141a;
  --sidebar-border:#323039;--text:#e4e2dc;--muted:#aaa69c;--heading:#fffaf0;
  --primary:#d4af37;--primary-soft:#2b2516;--primary-border:#5b4a1c;--hover:#202128;
  --danger:#ff7782;--divider:#302f35;--shadow:0 12px 32px rgba(0,0,0,.24);
  --topbar:#0b0e12;--input-bg:#11161c;--input-border:#3a3a3f;--table-border:#35353a;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{background:var(--app-bg);color:var(--text);transition:background-color .18s ease,color .18s ease}
.app-topbar{min-height:64px;background:var(--topbar)!important;border-bottom:1px solid rgba(255,255,255,.06);box-shadow:0 1px 0 rgba(255,255,255,.03)}
.navbar-brand{font-weight:600;letter-spacing:-.01em}.brand-mark{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--primary);color:#fff;font-size:15px;font-weight:800}
.topbar-actions{min-width:0}.theme-toggle{width:36px;height:36px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06);border-radius:10px;display:inline-grid;place-items:center;color:#dbe7f5;cursor:pointer;transition:.15s ease}.theme-toggle:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22)}.theme-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.theme-icon-moon{fill:currentColor;stroke:none}.theme-icon-sun{display:none}html[data-bs-theme="light"] .theme-icon-moon{display:none}html[data-bs-theme="light"] .theme-icon-sun{display:block}
.sidebar{min-height:calc(100vh - 64px);background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);position:sticky;top:64px;height:calc(100vh - 64px);overflow-y:auto;transition:background-color .18s ease,border-color .18s ease}.sidebar-nav{display:flex;flex-direction:column;gap:7px}.sidebar-home,.sidebar-group-toggle,.sidebar-sub-link{font-family:inherit;text-decoration:none}.sidebar-home{display:flex;align-items:center;gap:11px;width:100%;padding:10px 11px;border-radius:10px;color:var(--text);font-weight:600;transition:.15s ease}.sidebar-home:hover{background:var(--hover);color:var(--heading)}.sidebar-home.active{background:var(--primary-soft);color:var(--primary)}.sidebar-section{border:1px solid transparent;border-radius:11px;transition:.15s ease}.sidebar-section.active-group{background:var(--surface-2);border-color:var(--primary-border)}.sidebar-group-toggle{appearance:none;-webkit-appearance:none;width:100%;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;color:var(--text);padding:10px 11px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;font-weight:600;text-align:left;cursor:pointer;transition:.15s ease}.sidebar-group-toggle:hover{background:var(--hover)!important;color:var(--heading)}.sidebar-section.active-group>.sidebar-group-toggle{color:var(--primary)}.group-label{display:flex;align-items:center;gap:11px;min-width:0}.nav-icon{display:inline-grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:rgba(127,145,166,.11);color:var(--muted);transition:.15s ease}.nav-icon-svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.active .nav-icon,.active-group>.sidebar-group-toggle .nav-icon{background:var(--primary-soft);color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary-border)}.sidebar-home:hover .nav-icon,.sidebar-group-toggle:hover .nav-icon{color:var(--heading);background:var(--hover)}.sidebar-home.active:hover .nav-icon,.sidebar-section.active-group>.sidebar-group-toggle:hover .nav-icon{color:var(--primary);background:var(--primary-soft)}.sidebar-chevron{width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .18s ease;margin-right:4px;margin-top:-4px}.sidebar-group-toggle:not(.collapsed) .sidebar-chevron{transform:rotate(225deg);margin-top:4px}.sidebar-group{padding:1px 7px 7px 47px}.sidebar-sub-link{position:relative;display:block;width:100%;border:0;background:transparent;text-align:left;padding:7px 9px;border-radius:8px;color:var(--muted);font-size:.91rem;line-height:1.25;transition:.15s ease}.sidebar-sub-link:hover{background:var(--hover);color:var(--heading)}.sidebar-sub-link.active{background:var(--primary-soft);color:var(--primary);font-weight:600}.sidebar-sub-link.active:before{content:"";position:absolute;left:-12px;top:50%;width:4px;height:18px;border-radius:6px;background:var(--primary);transform:translateY(-50%)}.sidebar-divider{height:1px;background:var(--divider);margin:8px 4px}.sidebar-logout{color:var(--danger)}.sidebar-logout:hover{background:rgba(220,38,38,.10);color:var(--danger)}
.app-main{min-height:calc(100vh - 64px);background:var(--app-bg)}
.app-main h1,.app-main h2,.app-main h3,.app-main h4,.app-main h5,.app-main h6{color:var(--heading)}.text-muted{color:var(--muted)!important}
.card{border-radius:.8rem;background:var(--surface);border-color:var(--sidebar-border);box-shadow:var(--shadow)}
.table{--bs-table-bg:var(--surface);--bs-table-color:var(--text);--bs-table-border-color:var(--table-border);--bs-table-hover-bg:var(--hover);--bs-table-hover-color:var(--heading)}.table>thead{--bs-table-bg:var(--surface-2);--bs-table-color:var(--heading)}
.form-control,.form-select{background-color:var(--input-bg);border-color:var(--input-border);color:var(--text)}.form-control:focus,.form-select:focus{background-color:var(--input-bg);color:var(--text);border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(91,140,255,.15)}.form-control::placeholder{color:var(--muted)}
.modal-content,.dropdown-menu,.accordion-item{background:var(--surface);color:var(--text);border-color:var(--sidebar-border)}
.alert{border-color:transparent}.btn-outline-secondary{--bs-btn-color:var(--text);--bs-btn-border-color:var(--input-border);--bs-btn-hover-bg:var(--hover);--bs-btn-hover-color:var(--heading);--bs-btn-hover-border-color:var(--input-border)}
.login-bg{background:linear-gradient(135deg,var(--app-bg),var(--surface-2))}
html[data-bs-theme="dark"] .bg-light{background-color:var(--surface-2)!important}html[data-bs-theme="dark"] .border{border-color:var(--sidebar-border)!important}html[data-bs-theme="dark"] .text-dark{color:#111827!important}
@media(max-width:1199px){.sidebar-group{padding-left:38px}.user-label{max-width:40vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
@media(max-width:991px){.sidebar{position:static;height:auto;min-height:auto;border-right:0;border-bottom:1px solid var(--sidebar-border);overflow:visible}.sidebar-nav{padding-bottom:4px}.app-main{min-height:auto}.topbar-actions{gap:.5rem!important}.user-label{max-width:48vw}}

/* v1.0.0 — Stable Release · Dark Gold Theme */
html[data-bs-theme="dark"]{--gold:#d4af37;--gold-light:#e6c65c;--gold-dark:#a8841f}
html[data-bs-theme="dark"] .brand-mark{background:linear-gradient(135deg,#e1c255,#b68b1f);color:#17130a;box-shadow:0 0 0 1px rgba(255,224,120,.18),0 8px 20px rgba(212,175,55,.16)}
html[data-bs-theme="dark"] .navbar-brand{color:#fffaf0!important}
html[data-bs-theme="dark"] .theme-toggle{color:#e6c65c;border-color:rgba(212,175,55,.26);background:rgba(212,175,55,.06)}
html[data-bs-theme="dark"] .theme-toggle:hover{background:rgba(212,175,55,.12);border-color:rgba(230,198,92,.42)}
html[data-bs-theme="dark"] .sidebar-home.active,html[data-bs-theme="dark"] .sidebar-sub-link.active{background:linear-gradient(90deg,rgba(212,175,55,.16),rgba(212,175,55,.07));color:#e6c65c}
html[data-bs-theme="dark"] .sidebar-section.active-group{background:linear-gradient(180deg,rgba(212,175,55,.055),rgba(212,175,55,.025));border-color:#5b4a1c}
html[data-bs-theme="dark"] .active .nav-icon,html[data-bs-theme="dark"] .active-group>.sidebar-group-toggle .nav-icon{background:rgba(212,175,55,.12);color:#e6c65c;box-shadow:inset 0 0 0 1px rgba(212,175,55,.32)}
html[data-bs-theme="dark"] .sidebar-sub-link.active:before{background:linear-gradient(#e6c65c,#b68b1f);box-shadow:0 0 10px rgba(212,175,55,.24)}
html[data-bs-theme="dark"] .sidebar-chevron{border-color:#8f8b82}
html[data-bs-theme="dark"] .btn-primary{--bs-btn-bg:#c49b2f;--bs-btn-border-color:#c49b2f;--bs-btn-color:#16130c;--bs-btn-hover-bg:#d8b342;--bs-btn-hover-border-color:#d8b342;--bs-btn-hover-color:#120f08;--bs-btn-active-bg:#ae8726;--bs-btn-active-border-color:#ae8726}
html[data-bs-theme="dark"] .btn-outline-primary{--bs-btn-color:#e1bd4e;--bs-btn-border-color:#9f7c25;--bs-btn-hover-bg:#d4af37;--bs-btn-hover-border-color:#d4af37;--bs-btn-hover-color:#16130c;--bs-btn-active-bg:#c49b2f;--bs-btn-active-border-color:#c49b2f;--bs-btn-active-color:#16130c}
html[data-bs-theme="dark"] .form-control:focus,html[data-bs-theme="dark"] .form-select:focus{border-color:#c7a338;box-shadow:0 0 0 .2rem rgba(212,175,55,.14)}
html[data-bs-theme="dark"] a:not(.btn):not(.sidebar-home):not(.sidebar-sub-link){color:#d9b84a}
html[data-bs-theme="dark"] a:not(.btn):not(.sidebar-home):not(.sidebar-sub-link):hover{color:#ecd06b}
html[data-bs-theme="dark"] .card{box-shadow:0 10px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.018)}
html[data-bs-theme="dark"] .table>thead{--bs-table-bg:#1d211f;--bs-table-color:#eadfae}
html[data-bs-theme="dark"] .badge.text-bg-primary,html[data-bs-theme="dark"] .bg-primary{background-color:#c49b2f!important;color:#16130c!important}

/* v2.0.0-M1 tenant context */
.tenant-label{font-size:.78rem;color:var(--gold-soft,#c9a227);max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* v2.0.0-M2-R1 — topbar school switcher */
.topbar-school-switcher{min-width:220px;max-width:320px;border-color:rgba(212,175,55,.35);background-color:var(--surface-2);color:var(--text-main)}
.topbar-school-switcher:focus{border-color:var(--accent);box-shadow:0 0 0 .15rem rgba(212,175,55,.16)}


/* v3.0.0-HF1 — Dark Login & Developer Credit */
.login-dark-page{
  min-height:100vh;
  margin:0;
  color:#f5f2e8;
  background:
    radial-gradient(circle at 50% 12%,rgba(212,175,55,.08),transparent 34%),
    radial-gradient(circle at 20% 85%,rgba(47,88,112,.16),transparent 38%),
    linear-gradient(145deg,#070b0f 0%,#0b1117 52%,#080c10 100%);
  overflow-x:hidden;
}
.login-dark-page:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.12;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:32px 32px;
}
.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px 16px;position:relative;z-index:1}
.login-card-wrap{width:min(100%,430px);position:relative;text-align:center}
.login-brand-mark{width:64px;height:64px;border-radius:18px;margin:0 auto -24px;position:relative;z-index:3;display:grid;place-items:center;font-size:1.6rem;font-weight:800;color:#17130a;background:linear-gradient(135deg,#efd366,#b88a1e);border:1px solid rgba(255,226,118,.55);box-shadow:0 12px 34px rgba(0,0,0,.42),0 0 26px rgba(212,175,55,.13)}
.login-card{background:linear-gradient(180deg,rgba(18,24,30,.98),rgba(12,17,22,.98));border:1px solid rgba(212,175,55,.20)!important;border-radius:24px;box-shadow:0 24px 70px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.035);overflow:hidden}
.login-card:before{content:"";display:block;height:2px;background:linear-gradient(90deg,transparent,#d4af37,#75c7de,transparent)}
.login-card .card-body{padding-top:3.2rem!important}
.login-title{font-weight:800;letter-spacing:-.03em;color:#fffaf0}
.login-subtitle{color:#aeb8c4;font-size:.98rem}
.login-version{display:inline-block;padding:.26rem .65rem;border-radius:999px;color:#d9bd5c;background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.19);font-size:.78rem;font-weight:700;letter-spacing:.03em}
.login-card .form-label{display:block;text-align:left;font-weight:600;color:#e9e5d8}
.login-card .form-control{background:#0b1015;border-color:#323b44;color:#f7f3e8;border-radius:12px;min-height:50px}
.login-card .form-control:focus{background:#0b1015;color:#fff;border-color:#caa63a;box-shadow:0 0 0 .2rem rgba(212,175,55,.13)}
.login-card .form-control:-webkit-autofill,.login-card .form-control:-webkit-autofill:hover,.login-card .form-control:-webkit-autofill:focus{-webkit-text-fill-color:#f7f3e8;-webkit-box-shadow:0 0 0 1000px #0b1015 inset;transition:background-color 9999s ease-out 0s}
.login-button{border-radius:12px;font-weight:800;background:linear-gradient(135deg,#d7b441,#b88b24);border-color:#c49b2f;color:#17130a;box-shadow:0 10px 24px rgba(212,175,55,.12)}
.login-button:hover,.login-button:focus{background:linear-gradient(135deg,#e6c75a,#c79a2c);border-color:#d4af37;color:#17130a;transform:translateY(-1px)}
.developer-credit{margin-top:18px;border:0;background:transparent;color:#8e9aa6;font-size:.86rem;cursor:pointer;padding:8px 12px;transition:.2s ease}
.developer-credit strong{color:#d6b64c;font-weight:700}
.developer-credit:hover,.developer-credit:focus{color:#c8d0d8;outline:none}.developer-credit:hover strong{color:#efd36a;text-decoration:underline}
.developer-modal-dialog{max-width:570px}
.developer-modal{position:relative;border-radius:28px;border:1px solid rgba(78,166,210,.32)!important;background:linear-gradient(160deg,#0d2238 0%,#081526 58%,#08111c 100%)!important;color:#f4f7fb;box-shadow:0 32px 90px rgba(0,0,0,.65),0 0 54px rgba(45,151,204,.11);overflow:hidden}
.developer-modal:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,#2f9fd3,#d4af37,transparent)}
.developer-close{position:absolute;right:18px;top:18px;z-index:3;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px;background-color:rgba(255,255,255,.035);opacity:.75}
.developer-close:hover{opacity:1}
.developer-icon{width:56px;height:56px;border-radius:16px;margin-inline:auto;display:grid;place-items:center;font-size:1.35rem;font-weight:800;color:#17130a;background:linear-gradient(135deg,#efd366,#b88a1e);box-shadow:0 10px 28px rgba(0,0,0,.28)}
.developer-copy{color:#9fb0c2;line-height:1.65}
.developer-wa-number{display:inline-block;padding:.72rem 1.05rem;border-radius:14px;color:#e8eef4;background:rgba(28,113,92,.16);border:1px solid rgba(53,172,137,.24);font-weight:800;letter-spacing:.01em}
.developer-wa-btn{border-radius:14px;font-weight:800;background:#20bd5a;border-color:#20bd5a}.developer-wa-btn:hover{background:#25c965;border-color:#25c965}
@media(max-width:575.98px){.login-shell{padding:18px 12px}.login-card{border-radius:20px}.login-card .card-body{padding:2.9rem 1.35rem 1.6rem!important}.developer-modal{border-radius:22px}.developer-modal .modal-body{padding:3.4rem 1.35rem 1.5rem!important}}


/* v3.0.0-HF2 — Custom App Logo Integration */
.brand-logo-crop,
.developer-logo-crop{
  position:relative;
  overflow:hidden;
  padding:0;
  background:transparent!important;
  box-shadow:none!important;
}
.brand-logo-crop img,
.developer-logo-crop img{
  position:absolute;
  display:block;
  max-width:none;
  height:auto;
}
/* Source logo is a tall transparent PNG: icon is in the upper portion.
   The crop is done by CSS so one original asset can serve all placements. */
.brand-logo-crop{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:50%;
  border:1px solid rgba(117,199,222,.28);
  box-shadow:0 5px 16px rgba(0,0,0,.28)!important;
}
.brand-logo-crop img{
  width:58px;
  left:50%;
  top:-2px;
  transform:translateX(-50%);
}
.login-brand-logo{
  width:142px;
  height:142px;
  margin:0 auto -42px;
  position:relative;
  z-index:3;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  filter:drop-shadow(0 15px 28px rgba(0,0,0,.46));
}
.login-brand-logo img{
  display:block;
  width:142px;
  height:auto;
}
.login-card .card-body{padding-top:4.35rem!important}
.developer-logo-crop{
  width:62px;
  height:62px;
  border-radius:50%;
  border:1px solid rgba(117,199,222,.28);
  background:#071422!important;
}
.developer-logo-crop img{
  width:94px;
  left:50%;
  top:-3px;
  transform:translateX(-50%);
}
@media(max-width:575.98px){
  .login-brand-logo{width:118px;height:118px;margin-bottom:-34px}
  .login-brand-logo img{width:118px}
  .login-card .card-body{padding-top:3.75rem!important}
  .brand-logo-crop{width:34px;height:34px;flex-basis:34px}
  .brand-logo-crop img{width:52px}
}


/* v3.0.0-HF2-HF1 — Compact Login Layout
   Keeps the login form inside common laptop/mobile viewport heights without page scroll. */
.login-dark-page{min-height:100dvh;overflow-y:auto}
.login-shell{min-height:100dvh;padding:10px 14px;align-items:center}
.login-card-wrap{width:min(100%,400px)}
.login-brand-logo{
  width:96px;
  height:96px;
  margin:0 auto -26px;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.42));
}
.login-brand-logo img{width:96px}
.login-card{border-radius:20px}
.login-card .card-body{padding:2.55rem 2rem 1.55rem!important}
.login-card .text-center.mb-4{margin-bottom:1.15rem!important}
.login-title{font-size:1.82rem;line-height:1.1}
.login-subtitle{font-size:.92rem}
.login-version{margin-top:.45rem!important;padding:.22rem .58rem}
.login-card form .mb-3{margin-bottom:.8rem!important}
.login-card form .mb-4{margin-bottom:1rem!important}
.login-card .form-label{margin-bottom:.35rem}
.login-card .form-control{min-height:46px;font-size:1rem}
.login-card .btn-lg{padding:.58rem 1rem;font-size:1.05rem}
.developer-credit{margin-top:8px;padding:4px 10px;font-size:.82rem}

@media(max-height:720px){
  .login-shell{padding-top:6px;padding-bottom:6px}
  .login-brand-logo{width:82px;height:82px;margin-bottom:-22px}
  .login-brand-logo img{width:82px}
  .login-card .card-body{padding:2.15rem 1.8rem 1.25rem!important}
  .login-title{font-size:1.62rem}
  .login-subtitle{font-size:.86rem}
  .login-card .form-control{min-height:42px}
  .developer-credit{margin-top:5px}
}

@media(max-width:575.98px){
  .login-shell{padding:8px 10px}
  .login-card-wrap{width:min(100%,380px)}
  .login-brand-logo{width:84px;height:84px;margin-bottom:-22px}
  .login-brand-logo img{width:84px}
  .login-card{border-radius:18px}
  .login-card .card-body{padding:2.25rem 1.25rem 1.3rem!important}
  .login-title{font-size:1.58rem}
  .developer-credit{margin-top:6px}
}