/* SPRC CAD Beta 16 — shared website visual alignment */
:root{--sprc-navy:#020b1d;--sprc-blue:#061b3b;--sprc-blue2:#0a3971;--sprc-ink:#101a2d;--sprc-muted:#667085;--sprc-mist:#f2f5f9;--sprc-line:#dce5f0;--sprc-gold:#d8b65a;--sprc-success:#16845b;--sprc-danger:#b42318;--sprc-warning:#b58900}
html,body,button,input,select,textarea{font-family:Inter,"Segoe UI",Arial,sans-serif!important}
body{background:var(--sprc-mist)!important;color:var(--sprc-ink)}
.top{background:linear-gradient(135deg,#fff 0%,#f5f8fc 70%,#e8eff8 100%)!important;border-bottom:1px solid var(--sprc-line)!important;color:var(--sprc-ink)!important}
.top .crest,.crest{background:var(--sprc-navy)!important;border:3px solid var(--sprc-gold)!important;color:#fff!important;box-shadow:0 0 0 4px rgba(216,182,90,.10)}
.identity h1,.brand{color:#031b3c!important;letter-spacing:-.025em}.identity small,.brand small{color:var(--sprc-blue2)!important;letter-spacing:.12em;text-transform:uppercase}
.nav,.navband{background:var(--sprc-blue)!important;box-shadow:0 7px 20px #12145d2e!important}.nav button{font-weight:800!important;text-transform:uppercase;font-size:.78rem;letter-spacing:.025em}.nav button:hover,.nav button.on{background:#fff1!important;border-bottom-color:#fff!important}
.wrap{width:min(1700px,calc(100% - 30px));max-width:1700px}.card,.metric,.section,.box{border:1px solid var(--sprc-line)!important;border-radius:3px!important;box-shadow:0 8px 24px rgba(2,27,61,.06)!important;background:#fff}.ch,.section h2,.modalhead,.head{background:linear-gradient(110deg,var(--sprc-blue),var(--sprc-blue2))!important;color:#fff!important;border-radius:0!important}
.btn{border-radius:3px!important;font-weight:800!important;transition:.18s ease}.btn:not(.red):not(.green):not(.amber):not(.purple):not(.light){background:var(--sprc-blue2)!important}.btn:hover{filter:brightness(1.08)}.btn.light{background:#fff!important;color:var(--sprc-blue)!important;border:1px solid #b8c8d9!important}.btn.green{background:var(--sprc-success)!important}.btn.red{background:var(--sprc-danger)!important}.btn.amber{background:var(--sprc-warning)!important}
input,select,textarea{border-radius:3px!important;border:1px solid #aebfd0!important}input:focus,select:focus,textarea:focus{outline:2px solid #4b8fd8!important;outline-offset:1px}.incident,.unit,.datum,.log-entry{border-radius:3px!important}.metric strong,.call,.incident-head,.datum b{color:#031b3c!important}.tiny,.metric small,label{color:var(--sprc-muted)!important}
.cad-version-badge,.version{border-radius:3px!important;border:1px solid var(--sprc-gold)!important;background:rgba(216,182,90,.12)!important;color:#6c5514!important;font-weight:900!important}
.modal{background:#020b1dcc!important}.modalbox{border-radius:3px!important;border:1px solid var(--sprc-line)!important}.toast{border-radius:3px!important;background:var(--sprc-blue)!important}
body.dark{background:#07111d!important;color:#f4f7fb!important}body.dark .top{background:linear-gradient(135deg,#07111d,#0b1c31)!important;color:#fff!important}body.dark .identity h1,body.dark .brand{color:#fff!important}body.dark .identity small,body.dark .brand small{color:#bdddff!important}body.dark .card,body.dark .metric,body.dark .section,body.dark .modalbox,body.dark .box{background:#101b28!important;border-color:#40566b!important;color:#f4f7fb!important}body.dark .cb,body.dark .modalbody{color:#f4f7fb!important}body.dark .call,body.dark .incident-head,body.dark .datum b,body.dark .metric strong{color:#fff!important}body.dark .tiny,body.dark .metric small,body.dark label{color:#c5d2de!important}


/* ============================================================
   SPRC CAD BETA 53 — GLOBAL DARK MODE
   One visual system across CAD, quick actions, supervisor,
   resources, metrics, modals, forms, tables and management pages.
   Supports both .dark and .cad-dark-mode for compatibility.
   ============================================================ */
:root{
  --dm-bg:#050b13;
  --dm-bg2:#081421;
  --dm-surface:#0d1826;
  --dm-surface2:#121f2f;
  --dm-surface3:#17273a;
  --dm-border:#334a61;
  --dm-border2:#4b647d;
  --dm-text:#f7f9fc;
  --dm-muted:#c4d0dc;
  --dm-link:#8ec5ff;
  --dm-input:#0a1623;
}
body.dark,body.cad-dark-mode{
  color-scheme:dark;
  background:linear-gradient(135deg,var(--dm-bg),var(--dm-bg2) 58%,#0a1929)!important;
  color:var(--dm-text)!important;
}
body.dark .top,body.cad-dark-mode .top,
body.dark .topbar,body.cad-dark-mode .topbar{
  background:linear-gradient(135deg,#07111d,#0b1c31)!important;
  border-color:var(--dm-border)!important;color:#fff!important;
}
body.dark .identity h1,body.cad-dark-mode .identity h1,
body.dark .brand,body.cad-dark-mode .brand{color:#fff!important}
body.dark .identity small,body.cad-dark-mode .identity small,
body.dark .brand small,body.cad-dark-mode .brand small{color:#a9d3ff!important}
body.dark main,body.cad-dark-mode main,
body.dark aside,body.cad-dark-mode aside,
body.dark section,body.cad-dark-mode section,
body.dark .wrap,body.cad-dark-mode .wrap,
body.dark .workspace,body.cad-dark-mode .workspace,
body.dark .layout,body.cad-dark-mode .layout,
body.dark .grid,body.cad-dark-mode .grid,
body.dark .content,body.cad-dark-mode .content{color:var(--dm-text)!important}
body.dark .card,body.cad-dark-mode .card,
body.dark .metric,body.cad-dark-mode .metric,
body.dark .section,body.cad-dark-mode .section,
body.dark .box,body.cad-dark-mode .box,
body.dark .panel,body.cad-dark-mode .panel,
body.dark .pb,body.cad-dark-mode .pb,
body.dark .modalbox,body.cad-dark-mode .modalbox,
body.dark .modalbody,body.cad-dark-mode .modalbody,
body.dark .table-wrap,body.cad-dark-mode .table-wrap,
body.dark .referral-card,body.cad-dark-mode .referral-card,
body.dark .referral-logon-panel,body.cad-dark-mode .referral-logon-panel,
body.dark .cad-event-row,body.cad-dark-mode .cad-event-row,
body.dark .closed-cad-card,body.cad-dark-mode .closed-cad-card{
  background:var(--dm-surface)!important;
  border-color:var(--dm-border)!important;
  color:var(--dm-text)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.28)!important;
}
body.dark .cb,body.cad-dark-mode .cb,
body.dark .body,body.cad-dark-mode .body{color:var(--dm-text)!important}
body.dark h1,body.cad-dark-mode h1,
body.dark h2,body.cad-dark-mode h2,
body.dark h3,body.cad-dark-mode h3,
body.dark h4,body.cad-dark-mode h4,
body.dark h5,body.cad-dark-mode h5,
body.dark p,body.cad-dark-mode p,
body.dark label,body.cad-dark-mode label,
body.dark small,body.cad-dark-mode small,
body.dark strong,body.cad-dark-mode strong,
body.dark b,body.cad-dark-mode b,
body.dark .metric strong,body.cad-dark-mode .metric strong,
body.dark .call,body.cad-dark-mode .call,
body.dark .incident-head,body.cad-dark-mode .incident-head,
body.dark .datum b,body.cad-dark-mode .datum b{color:var(--dm-text)!important}
body.dark .tiny,body.cad-dark-mode .tiny,
body.dark .metric small,body.cad-dark-mode .metric small,
body.dark .muted,body.cad-dark-mode .muted,
body.dark .help,body.cad-dark-mode .help{color:var(--dm-muted)!important}
body.dark input,body.cad-dark-mode input,
body.dark select,body.cad-dark-mode select,
body.dark textarea,body.cad-dark-mode textarea{
  background:var(--dm-input)!important;color:#fff!important;
  border-color:var(--dm-border2)!important;
}
body.dark input::placeholder,body.cad-dark-mode input::placeholder,
body.dark textarea::placeholder,body.cad-dark-mode textarea::placeholder{
  color:#9fb0c1!important;opacity:1!important;
}
body.dark option,body.cad-dark-mode option{background:#0a1623!important;color:#fff!important}
body.dark table,body.cad-dark-mode table,
body.dark tbody,body.cad-dark-mode tbody,
body.dark tr,body.cad-dark-mode tr,
body.dark td,body.cad-dark-mode td{
  background:var(--dm-surface)!important;color:#fff!important;border-color:var(--dm-border)!important;
}
body.dark thead,body.cad-dark-mode thead,
body.dark th,body.cad-dark-mode th{
  background:#102943!important;color:#fff!important;border-color:var(--dm-border2)!important;
}
body.dark a,body.cad-dark-mode a{color:var(--dm-link)!important}
body.dark .btn.light,body.cad-dark-mode .btn.light,
body.dark button.light,body.cad-dark-mode button.light{
  background:#17283b!important;color:#fff!important;border-color:#66819c!important;
}
body.dark .notice,body.cad-dark-mode .notice,
body.dark .note,body.cad-dark-mode .note{
  background:#102030!important;color:#d9e4ef!important;border-color:#4c6883!important;
}
body.dark .modal,body.cad-dark-mode .modal{background:rgba(0,0,0,.78)!important}
body.dark .cad-version-badge,body.cad-dark-mode .cad-version-badge,
body.dark .version,body.cad-dark-mode .version{
  background:#2a2414!important;border-color:#a88b3e!important;color:#f5d879!important;
}

/* Keep operational state colours meaningful in dark mode. */
body.dark .unit-status-available,body.cad-dark-mode .unit-status-available,
body.dark [data-unit-status="available"],body.cad-dark-mode [data-unit-status="available"]{
  background:#123c2b!important;color:#f3fff8!important;border-color:#2fa773!important;
}
body.dark .unit-status-on-scene,body.cad-dark-mode .unit-status-on-scene,
body.dark [data-unit-status="on scene"],body.cad-dark-mode [data-unit-status="on scene"]{
  background:#573711!important;color:#fff5e6!important;border-color:#df8a25!important;
}
body.dark .unit-status-unavailable,body.cad-dark-mode .unit-status-unavailable,
body.dark [data-unit-status="unavailable"],body.cad-dark-mode [data-unit-status="unavailable"]{
  background:#4b1f1c!important;color:#fff5f4!important;border-color:#c84a42!important;
}
body.dark .unit-status-zero,body.cad-dark-mode .unit-status-zero{
  color:#fff!important;
}
body.dark .unit-status-zero *,body.cad-dark-mode .unit-status-zero *{color:#fff!important}

/* Menus and overlays */
body.dark .dropdown-menu,body.cad-dark-mode .dropdown-menu,
body.dark .menu,body.cad-dark-mode .menu,
body.dark .popover,body.cad-dark-mode .popover{
  background:#0d1826!important;color:#fff!important;border-color:var(--dm-border)!important;
}
body.dark hr,body.cad-dark-mode hr{border-color:var(--dm-border)!important}