/* Safeguard shared visual system — single source of truth for all role portals */
:root{
  color-scheme:light;
  --sg-primary:#0F9D8A;
  --sg-primary-hover:#0B8879;
  --sg-primary-dark:#0B4F5C;
  --sg-sidebar-start:#0B4F5C;
  --sg-sidebar-end:#083B47;
  --sg-sidebar-active:#13A89A;
  --sg-yellow:#F9B233;
  --sg-blue:#3B82F6;
  --sg-blue-alt:#4A90E2;
  --sg-coral:#EF5B6B;
  --sg-purple:#9B6CF0;
  --sg-success:#22A559;
  --sg-warning:#F59E0B;
  --sg-page:#F3F8FB;
  --sg-card:#FFFFFF;
  --sg-text:#1F2937;
  --sg-muted:#6B7280;
  --sg-border:#E5EEF2;
  --sg-shadow:0 2px 8px rgba(15,79,92,.08);
  --sg-radius:14px;
  --sg-focus:rgba(15,157,138,.32);
  --navy:var(--sg-primary-dark);
  --navy2:var(--sg-sidebar-end);
  --blue:var(--sg-blue);
  --cyan:var(--sg-yellow);
  --ink:var(--sg-text);
  --muted:var(--sg-muted);
  --line:var(--sg-border);
  --paper:var(--sg-page);
  --white:var(--sg-card);
  --green:var(--sg-success);
  --sg-primary-action:var(--sg-primary);
  --sg-action:var(--sg-primary);
  --sg-accent:var(--sg-yellow);
  --sg-accent-strong:var(--sg-coral);
  --sg-surface:var(--sg-card);
  --sg-ink:var(--sg-text);
  --sg-blue-soft:#EAF3FF;
  --sg-amber-soft:#FFF7E6;
  --sg-focus:rgba(15,157,138,.32);
  --sg-shadow:0 2px 8px rgba(15,79,92,.08);
  font-family:Inter,Poppins,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html,body{background:var(--sg-page);color:var(--sg-text)}
body{font-family:Inter,Poppins,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.heading h1,.section-title{font-family:Inter,Poppins,ui-sans-serif,system-ui,sans-serif;color:var(--sg-text);letter-spacing:-.025em}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease,transform .18s ease}
:focus-visible{outline:3px solid var(--sg-focus)!important;outline-offset:3px}
::selection{background:#CDEFEA;color:var(--sg-primary-dark)}
a{color:var(--sg-primary);text-underline-offset:3px}
a:hover{color:var(--sg-primary-dark)}
[hidden],.hidden{display:none!important}
.card,.panel,.surface,.modal,.feature,.role,.metric-card{background:var(--sg-card);border:1px solid var(--sg-border);border-radius:var(--sg-radius);box-shadow:var(--sg-shadow)}
.section-title{font-size:15px;font-weight:700}
.muted,.label,.note{color:var(--sg-muted)}
.pill,.badge,.tag,.status-badge{border-radius:999px;font-weight:700}
.btn,.btn-primary,.primary-action,.btn.primary,button.primary,[type=submit]{border-radius:9px;min-height:40px;font-weight:700}
.btn-primary,.primary-action,.btn.primary,button.primary,[type=submit]{background:var(--sg-primary);border-color:var(--sg-primary);color:#fff}
.btn-primary:hover,.primary-action:hover,.btn.primary:hover,button.primary:hover,[type=submit]:hover{background:var(--sg-primary-hover);border-color:var(--sg-primary-hover);color:#fff}
.btn-outline,button.secondary,.btn.secondary{background:#fff;color:var(--sg-primary-dark);border:1px solid var(--sg-primary)}
input,select,textarea,.field-input{background:#fff;color:var(--sg-text);border:1px solid var(--sg-border);border-radius:9px}
input:focus,select:focus,textarea:focus,.field-input:focus{border-color:var(--sg-primary);box-shadow:0 0 0 3px var(--sg-focus);outline:0}
.error,.status.error{background:#FFF0F1;color:#9F2635;border:1px solid #F8C8CE}
.status.success{background:#EAF8EF;color:#176B3A;border:1px solid #BDE7CB}
table{width:100%;border-collapse:collapse}
th{background:#F7FAFC;color:var(--sg-muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}
th,td{border-bottom:1px solid var(--sg-border);padding:11px 13px;text-align:left}
.map{background:#EEF4F7;border:1px solid var(--sg-border);border-radius:12px;overflow:hidden}

/* Main role workspace: white utility bar, teal navigation rail, pale canvas */
.top{height:72px;background:#fff;color:var(--sg-text);border-bottom:1px solid var(--sg-border);box-shadow:0 1px 4px rgba(15,79,92,.05);padding-inline:24px;position:sticky;top:0;z-index:20}
.top .user{color:var(--sg-muted)}
.top .brand span{color:var(--sg-coral)}
.wrap{width:auto;max-width:none;margin:0 0 0 216px;padding:24px 22px;min-height:calc(100vh - 72px)}
.heading{margin:4px 0 20px;align-items:center}
.heading h1{font-size:clamp(20px,2vw,22px);font-weight:700;letter-spacing:-.025em}
.eyebrow{color:var(--sg-primary-dark);letter-spacing:.1em}
.tabs{position:fixed;z-index:19;left:0;top:72px;bottom:0;width:200px;max-width:200px;margin:0;padding:16px 10px 18px;border:0;border-radius:0;background:linear-gradient(180deg,var(--sg-sidebar-start),var(--sg-sidebar-end));box-shadow:3px 0 12px rgba(8,59,71,.12);display:flex;flex-direction:column;align-items:stretch;gap:5px;overflow-y:auto;overscroll-behavior:contain}
.tabs button{width:100%;flex:0 0 auto;min-height:40px;text-align:left;white-space:normal;border:0;border-radius:9px;background:transparent;color:#E8F4F5;padding:10px 12px;font-size:12px;font-weight:650}
.tabs button:hover{background:rgba(255,255,255,.10);color:#fff}
.tabs button[aria-selected=true]{background:var(--sg-sidebar-active);color:#fff;box-shadow:0 3px 9px rgba(0,0,0,.12)}
.tabs button[hidden]{display:none!important}
.grid{gap:16px}
.card{padding:18px}
.metric{font-size:30px;font-weight:800;letter-spacing:-.035em;color:var(--sg-primary)}
.label{font-size:12px;font-weight:600}
.row{border:1px solid var(--sg-border);border-radius:10px;background:#fff}
.pill{background:#E7F7F3;color:#087A6C;border:1px solid #C7EDE5;padding:4px 9px}
.btn{border:1px solid var(--sg-border);background:#fff;color:var(--sg-primary-dark)}
.btn:hover{border-color:var(--sg-primary);background:#F2FBF9}
#message:not(:empty){margin:10px 0}
#overview>.grid>.card{position:relative;overflow:hidden;border:0;color:#fff;box-shadow:var(--sg-shadow);background:var(--sg-primary)}
#overview>.grid>.card:nth-child(2){background:var(--sg-blue)}
#overview>.grid>.card:nth-child(3){background:var(--sg-coral)}
#overview>.grid>.card:nth-child(4){background:var(--sg-yellow);color:#513600}
#overview>.grid>.card .label,#overview>.grid>.card .metric{color:#fff}
#overview>.grid>.card:nth-child(4) .label,#overview>.grid>.card:nth-child(4) .metric{color:#513600}
#teacher-portal .card,#parent-tools .card,#driver-center .card,#school-management .card{box-shadow:var(--sg-shadow)}
#teacher-portal .section-title,#parent-tools .section-title,#driver-center .section-title{color:var(--sg-primary-dark)}
#map{background:#EEF4F7}
button:disabled,.btn:disabled{opacity:.58;cursor:not-allowed}
@media(max-width:900px){
 .wrap{margin-left:200px;padding:20px 16px}
 .tabs{width:184px;max-width:184px}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
 .top{height:64px;padding:0 14px}
 .top .brand img{width:148px}
 .wrap{margin:0;padding:18px 14px;min-height:calc(100vh - 64px)}
 .tabs{position:sticky;top:64px;bottom:auto;width:100%;max-width:none;height:auto;min-height:52px;flex-direction:row;align-items:center;padding:7px 10px;gap:6px;overflow-x:auto;overflow-y:hidden}
 .tabs button{width:auto;min-width:max-content;min-height:38px;text-align:center;padding:8px 12px}
 .grid{grid-template-columns:1fr;gap:12px}
 .layout{grid-template-columns:1fr;gap:12px}
 .heading{align-items:flex-start;flex-direction:column}
 .heading h1{font-size:21px}
 .card{padding:15px}
 .map{height:270px;min-height:240px}
 .tabs button[hidden]{display:none!important}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Public site and restricted admin login consume the same palette */
.topbar{background:#fff;color:var(--sg-text);border-color:var(--sg-border)}
.nav{color:var(--sg-muted)}
.nav a:hover{color:var(--sg-primary-dark)}
.nav-cta{border-color:var(--sg-primary);color:var(--sg-primary-dark)!important}
.hero{background:linear-gradient(125deg,#F3F8FB 0%,#EAF5F4 65%,#E4F2F0 100%);color:var(--sg-text)}
.hero:after,.glow{border-color:rgba(11,79,92,.08)}
.hero-copy{color:#52636D}
h1 span{color:var(--sg-primary)}
.eyebrow{background:#E7F7F3;border-color:#C7EDE5;color:var(--sg-primary-dark)}
.dot{background:var(--sg-yellow);box-shadow:none}
.btn-primary{background:var(--sg-primary);color:#fff}
.btn-primary:hover{background:var(--sg-primary-hover)}
.btn-outline{border-color:#B8D4D0;color:var(--sg-primary-dark);background:#fff}
.features{background:var(--sg-page)}
.feature,.role{background:#fff;border-color:var(--sg-border);border-radius:14px}
.feature-icon{background:#E7F7F3;color:var(--sg-primary-dark)}
.kicker,.text-link{color:var(--sg-primary)}
.cta{background:var(--sg-primary-dark);color:#fff}
footer{background:var(--sg-sidebar-end);color:#E6F0F1}
.role-pick{border-color:var(--sg-border);color:var(--sg-text)}
.role-pick[aria-pressed=true]{border-color:var(--sg-primary);background:#E7F7F3}
.modal{border-color:var(--sg-border)}
.field-input:focus{border-color:var(--sg-primary)}
.consent button{background:var(--sg-primary-dark);color:#fff}
main{border-color:var(--sg-border)}
.brand-mark{background:var(--sg-primary-dark);color:#fff}
.brand-name{color:var(--sg-primary-dark)}
.kicker{color:var(--sg-primary)}



/* Production landing-page layout repair — isolate public site from dashboard shell rules */
body:has(> .topbar){display:block;min-height:100vh;overflow-x:hidden}
body:has(> .topbar) .wrap{width:min(1200px,calc(100% - 48px));max-width:1200px;margin-left:auto;margin-right:auto;padding:0;min-height:0}
body:has(> .topbar)>.topbar{position:relative;inset:auto;width:100%;height:auto;min-height:78px;padding:0;display:block}
body:has(> .topbar)>.topbar .topbar-inner{width:min(1200px,calc(100% - 48px));max-width:1200px;margin:0 auto;min-height:78px;padding:12px 0;display:flex;align-items:center;justify-content:space-between;gap:20px}
body:has(> .topbar)>main{display:block;width:100%;max-width:none;min-height:0;margin:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
body:has(> .topbar)>main .wrap{width:min(1200px,calc(100% - 48px));max-width:1200px;margin:0 auto;padding:0;min-height:0}
body:has(> .topbar)>.topbar .brand-group{display:flex;align-items:center;gap:12px;min-width:0}
body:has(> .topbar)>.topbar .nav{display:flex;align-items:center;gap:22px;margin-left:auto}
body:has(> .topbar)>.topbar .nav-actions{display:flex;align-items:center;gap:10px}
body:has(> .topbar)>.topbar .header-pills{display:none}
body:has(> .topbar) .hero{padding:76px 0 64px;min-height:0}
body:has(> .topbar) .hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);align-items:center;gap:clamp(28px,5vw,64px);min-height:430px}
body:has(> .topbar) .visual{min-height:360px}
body:has(> .topbar) .metrics{margin:0}
body:has(> .topbar) footer .wrap{width:min(1200px,calc(100% - 48px));margin:0 auto;min-height:0}
@media(max-width:900px){body:has(> .topbar) .hero-grid{grid-template-columns:1fr}body:has(> .topbar) .visual{min-height:320px}}
@media(max-width:640px){body:has(> .topbar) .topbar-inner{width:calc(100% - 28px);min-height:64px;flex-wrap:wrap}body:has(> .topbar)>.topbar .nav{width:100%;justify-content:space-between;gap:10px;padding:4px 0 10px}body:has(> .topbar) .hero{padding:44px 0 36px}body:has(> .topbar) .hero-grid{min-height:0}body:has(> .topbar) .wrap{width:calc(100% - 28px)}}