/* PDI theme: one token sheet shared by the PDI apps
   (PDIS, Facilitator Registry, Pulse, Pulse Dashboard, LeadScout, Intent-to-Resolution).
   Derived from PDIS public/styles.css, October 2026. Light is the PDIS palette; dark keeps the
   same hues on a navy ground. Theme choice lives on <html data-theme="light|dark">; the default is
   light, "system" is an explicit choice. pdi-theme.js sets it, remembers it (localStorage "pdi-theme") and draws the
   light / system / dark control into any element carrying data-theme-toggle. */

:root{
  --font-ui:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --font-brand:'Fraunces',Georgia,serif;
  --font-mono:ui-monospace,'Cascadia Mono','Consolas',monospace;

  --ink:#0F1B2D; --ink-2:#1F2937;
  --band:#13294B; --band-text:#E3E9F2; --band-faint:#B9C5D6; --band-rule:rgba(255,255,255,0.28); --band-hover:rgba(255,255,255,0.08);
  --panel:#F4F6FA; --panel-2:#EEF1F6; --panel-3:#E4E9F0;
  --surface:#FFFFFF; --surface-tint:#FAFCFF; --surface-ok:#FAFCFA;
  --rule:#E1E6EE; --rule-strong:#C9D2DE;
  --text:#1A2433; --text-soft:#566173; --text-faint:#677285; --on-accent:#FFFFFF;

  --gate:#1A66D9; --gate-deep:#134FA8; --gate-bright:#8DB4EE; --gate-bg:#EAF2FD; --gate-line:#D3E2F8; --gate-tint:#D9E7FA;
  --alert:#D93A2B; --alert-deep:#B3261E; --alert-bg:#FBE3E0; --alert-ink:#8C1D18;
  --current:#1E8A50; --current-bg:#E3F4EA; --current-ink:#1E5A40; --current-line:#C6E7D3; --current-tint:#CBEBD8;
  --watch:#D98A1C; --watch-bg:#FCF0DC; --watch-ink:#6B4D18; --watch-line:#E5D5B3; --watch-deep:#B86F0E;
  --overdue:#C9652A; --overdue-bg:#FBE7DA; --overdue-ink:#7A3A12;
  --critical:#C9352B; --critical-bg:#FBE4E1; --critical-ink:#8C2020; --critical-deep:#7A1D1D;
  --violet:#6D4ED6; --violet-bg:#EEEAFB;
  --pap:#2F5D8A; --pdi:#7A4FA0; --emv:#2F8A7B; --neutral:#5B6470; --neutral-bg:#EDEFF2;
  --avatar-bg:#D5DEEA;

  --scrim:rgba(17,24,39,0.5);
  --shadow-sm:0 1px 2px rgba(15,27,45,0.05);
  --shadow:0 1px 2px rgba(15,27,45,0.05),0 10px 30px -14px rgba(15,27,45,0.18);
  --shadow-drawer:-12px 0 40px rgba(0,0,0,0.22);
  --radius-sm:6px; --radius:8px; --radius-lg:10px;
  color-scheme:light;
}

/* Dark: same hues, lifted for a navy ground. Applied only when chosen (or when "system" is chosen on a dark OS). */
:root[data-theme="dark"]{
  --ink:#EDF1F7; --ink-2:#D9E0EA;
  --band:#0B1626; --band-text:#DCE4F0; --band-faint:#8E9DB5; --band-rule:rgba(255,255,255,0.18); --band-hover:rgba(255,255,255,0.07);
  --panel:#0F1622; --panel-2:#151E2C; --panel-3:#1C2736;
  --surface:#172030; --surface-tint:#1A2536; --surface-ok:#182431;
  --rule:#263244; --rule-strong:#3A4A60;
  --text:#D9E0EA; --text-soft:#A6B2C3; --text-faint:#8A98AD; --on-accent:#0B1626;

  --gate:#5B95F0; --gate-deep:#86B3F6; --gate-bright:#2E5FAE; --gate-bg:#172A4A; --gate-line:#264672; --gate-tint:#1F3A66;
  --alert:#F26B5D; --alert-deep:#F7928A; --alert-bg:#3E1F1C; --alert-ink:#FBCFC9;
  --current:#4CC37F; --current-bg:#11301F; --current-ink:#BFEBD0; --current-line:#1E4A30; --current-tint:#1A4A2E;
  --watch:#E9A54A; --watch-bg:#372A12; --watch-ink:#F5DDB0; --watch-line:#5A4620; --watch-deep:#F0B968;
  --overdue:#E88E59; --overdue-bg:#3B2416; --overdue-ink:#F7D2BC;
  --critical:#F0685E; --critical-bg:#3F1F1C; --critical-ink:#F9C9C4; --critical-deep:#F98B82;
  --violet:#A796F2; --violet-bg:#2A2449;
  --pap:#74A5DA; --pdi:#B393DB; --emv:#5FC5B2; --neutral:#8A96A6; --neutral-bg:#24303F;
  --avatar-bg:#2E4262;

  --scrim:rgba(3,8,16,0.66);
  --shadow-sm:0 1px 2px rgba(0,0,0,0.35);
  --shadow:0 1px 2px rgba(0,0,0,0.35),0 12px 34px -14px rgba(0,0,0,0.6);
  --shadow-drawer:-12px 0 40px rgba(0,0,0,0.55);
  color-scheme:dark;
}
/* Browser surfaces carry the palette too. */
::selection{background:var(--gate);color:var(--on-accent);}
:focus-visible{outline:2px solid var(--gate);outline-offset:1px;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:var(--panel);}
::-webkit-scrollbar-thumb{background:var(--rule-strong);border-radius:5px;border:2px solid var(--panel);}
html{scrollbar-color:var(--rule-strong) var(--panel);}
body{accent-color:var(--gate);caret-color:var(--gate);-webkit-font-smoothing:antialiased;}

/* Light / system / dark control. Drawn by pdi-theme.js into [data-theme-toggle]. */
.theme-toggle{
  display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:999px;
  border:1px solid var(--rule-strong);background:var(--surface);color:var(--text-soft);
  box-shadow:var(--shadow-sm);vertical-align:middle;
}
.theme-toggle button{
  appearance:none;border:0;background:transparent;color:inherit;cursor:pointer;
  width:28px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  padding:0;transition:background .12s,color .12s;
}
.theme-toggle button svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.theme-toggle button:hover{color:var(--ink);background:var(--panel-2);}
.theme-toggle button[aria-pressed="true"]{background:var(--gate-bg);color:var(--gate-deep);}
.theme-toggle button:focus-visible{outline-offset:-2px;}
.theme-toggle-float{position:fixed;right:16px;bottom:16px;z-index:90;}
/* On a navy band the control goes translucent. */
.theme-toggle.on-band{background:transparent;border-color:var(--band-rule);color:var(--band-text);box-shadow:none;}
.theme-toggle.on-band button:hover{background:var(--band-hover);color:#fff;}
.theme-toggle.on-band button[aria-pressed="true"]{background:#fff;color:var(--band);}
