/*
 * VirgilTrack design tokens (B-01). Loaded first, before every other stylesheet.
 *
 * The values come from the manual's docs/manual/src/styles/tokens.css (brand blue #195BBB from the logo), as set out in
 * docs/stable-release/BRIEF.md, Appendix B. Components use only the semantic roles (--vt-surface, --vt-text,
 * --vt-primary, --vt-success-text …), never the raw palette and never hex literals.
 * vt-bootstrap.css maps these onto Bootstrap/Metronic (--bs-*), vt-radzen.css onto Radzen (--rz-*).
 * Contrast ratios in the comments are against the light surface.
 */
:root, [data-bs-theme=light] {
  /* Brand (logo blue #195BBB = brand-600) */
  --vt-brand-50:#EEF4FD; --vt-brand-100:#DCE8FA; --vt-brand-200:#B9D1F4; --vt-brand-300:#8CB5EE;
  --vt-brand-400:#4F8AE0; --vt-brand-500:#2B66C2; --vt-brand-600:#195BBB; --vt-brand-700:#134A9A;
  --vt-brand-800:#0F3A79; --vt-brand-900:#0B2A57; --vt-brand-950:#071B39;
  --vt-accent-amber:#F2A93B;                       /* AI/spark accent only */
  /* Neutrals */
  --vt-ink:#0B1B33; --vt-gray-900:#172338; --vt-gray-700:#3A465A; --vt-gray-600:#4D5A70; --vt-gray-500:#6B778C;
  --vt-gray-300:#C3CAD6; --vt-gray-200:#DDE2EA; --vt-gray-100:#EEF1F5; --vt-paper:#F8F9FB; --vt-white:#FFFFFF;
  /* Semantic roles */
  --vt-bg:var(--vt-paper); --vt-surface:var(--vt-white); --vt-surface-muted:var(--vt-gray-100); --vt-surface-tint:var(--vt-brand-50);
  --vt-border:var(--vt-gray-200); --vt-border-strong:var(--vt-gray-300);
  --vt-text:var(--vt-ink); --vt-text-muted:var(--vt-gray-600) /* 6.97:1 */; --vt-text-subtle:var(--vt-gray-500) /* 4.52:1, ≥12px */;
  --vt-primary:var(--vt-brand-600) /* white text 6.45:1 */; --vt-primary-hover:var(--vt-brand-700);
  --vt-primary-soft:var(--vt-brand-50); --vt-on-primary:#fff; --vt-link:var(--vt-brand-600);
  --vt-focus-ring:0 0 0 3px rgb(25 91 187 / .35);
  /* Status: solid (bars, dots, icons) · text (on soft, ≥4.5:1) · soft background */
  --vt-success:#12A150; --vt-success-text:#0B6B35; --vt-success-soft:#E6F6EE;
  --vt-warning:#E09412; --vt-warning-text:#7A4800; --vt-warning-soft:#FDF3E2;
  --vt-danger:#D81B4A;  --vt-danger-text:#9B0F33;  --vt-danger-soft:#FDEBEF;
  --vt-info:var(--vt-brand-500); --vt-info-text:var(--vt-brand-800); --vt-info-soft:var(--vt-brand-50);
  --vt-neutral:#6B778C; --vt-neutral-text:#3A465A; --vt-neutral-soft:#EEF1F5;
  /* One risk-level scale (heat map cells, score pills) */
  --vt-risk-1:#DCF5E6; --vt-risk-2:#F3F7C9; --vt-risk-3:#FDE9C4; --vt-risk-4:#F9C9B5; --vt-risk-5:#F3A5B5;
  --vt-risk-1-text:#0B6B35; --vt-risk-2-text:#5B6300; --vt-risk-3-text:#7A4800; --vt-risk-4-text:#8A2E0B; --vt-risk-5-text:#9B0F33;
  /* Categorical chart palette (max 6 series, in this order). Checked with the dataviz palette validator (B-06):
     light and dark both pass the lightness band, chroma, colour-blind and normal-vision separation. Slots 2, 3 and 6
     are a step away from the starter so amber and green stay apart for colour-blind readers and no series is the
     exact success or danger colour. Amber and teal are below 3:1 on white, so every chart has a legend and a table. */
  --vt-cat-1:#195BBB; --vt-cat-2:#E5A02E; --vt-cat-3:#1E9E5A; --vt-cat-4:#8B5CF6; --vt-cat-5:#0EA5B7; --vt-cat-6:#C2185B;
  /* Type (self-hosted) and scale */
  --vt-font-display:'Poppins','Segoe UI',system-ui,sans-serif;
  --vt-font-body:'Inter Variable','Inter','Segoe UI',system-ui,sans-serif;
  --vt-text-xs:12px; --vt-text-sm:13px; --vt-text-md:14px; --vt-text-lg:16px; --vt-text-xl:20px; --vt-text-2xl:24px; --vt-text-3xl:32px;
  --vt-leading-tight:1.25; --vt-leading-normal:1.5;
  /* Space (4px grid), shape, depth, motion, layers */
  --vt-space-1:4px; --vt-space-2:8px; --vt-space-3:12px; --vt-space-4:16px; --vt-space-6:24px; --vt-space-8:32px;
  --vt-radius-sm:6px; --vt-radius:10px; --vt-radius-lg:16px; --vt-radius-pill:999px;
  --vt-shadow-sm:0 1px 2px rgb(11 27 51/.06),0 1px 3px rgb(11 27 51/.08);
  --vt-shadow:0 4px 12px rgb(11 27 51/.08),0 2px 4px rgb(11 27 51/.06);
  --vt-shadow-lg:0 24px 48px -12px rgb(11 27 51/.18);
  --vt-motion-fast:120ms; --vt-motion:200ms; --vt-ease:cubic-bezier(.2,.8,.2,1);
  --vt-z-fab:1040; --vt-z-drawer:1050; --vt-z-modal:1060; --vt-z-toast:1080;
}
[data-bs-theme=dark] {
  --vt-bg:#0A1424; --vt-surface:#0E1A2E; --vt-surface-muted:#13223A; --vt-surface-tint:#13264A;
  --vt-border:#24324A; --vt-border-strong:#33445F;
  --vt-text:#E8EDF5; --vt-text-muted:#A9B4C6; --vt-text-subtle:#8A97AC;
  --vt-primary:var(--vt-brand-400); --vt-primary-hover:var(--vt-brand-300); --vt-primary-soft:#13264A;
  --vt-on-primary:#071B39; --vt-link:var(--vt-brand-300);
  --vt-success:#2FBF6F; --vt-success-text:#8FE0B2; --vt-success-soft:#0D2A1C;
  --vt-warning:#F2A93B; --vt-warning-text:#F7C97F; --vt-warning-soft:#2E2109;
  --vt-danger:#F2557A;  --vt-danger-text:#FFB3C4; --vt-danger-soft:#36101B;
  --vt-neutral-soft:#1A2639; --vt-neutral-text:#C3CAD6;
  --vt-risk-1:#123A27; --vt-risk-2:#33380F; --vt-risk-3:#3E2D0C; --vt-risk-4:#47220F; --vt-risk-5:#4A1424;
  --vt-risk-1-text:#8FE0B2; --vt-risk-2-text:#E2E98A; --vt-risk-3-text:#F7C97F; --vt-risk-4-text:#F8B394; --vt-risk-5-text:#FFB3C4;
  --vt-shadow:0 4px 12px rgb(0 0 0/.35); --vt-shadow-lg:0 24px 48px -12px rgb(0 0 0/.55);
}

/*
 * Not in Appendix B. The starter keeps the light info and neutral values in dark mode, which puts dark navy text
 * (#0F3A79) on dark surfaces and a near-white soft background (#EEF4FD) under it. These keep them AA in dark mode:
 * info-text #B9D1F4 on #13264A is 9.61:1, neutral #8A97AC on the dark surface 5.89:1.
 */
[data-bs-theme=dark] {
  --vt-info:var(--vt-brand-400); --vt-info-text:var(--vt-brand-200); --vt-info-soft:#13264A;
  --vt-neutral:#8A97AC;
  --vt-shadow-sm:0 1px 2px rgb(0 0 0/.3),0 1px 3px rgb(0 0 0/.35);
  --vt-focus-ring:0 0 0 3px rgb(79 138 224 / .45);
  color-scheme: dark;
}

/* The chart palette stepped for the dark surface (OKLCH L 0.48–0.67, each at least 3:1 on #0E1A2E), same hues and order. */
[data-bs-theme=dark] {
  --vt-cat-1:#4F8AE0; --vt-cat-2:#BA7A1A; --vt-cat-3:#1A9A6A; --vt-cat-4:#9370F0; --vt-cat-5:#1AA3B5; --vt-cat-6:#E0457B;
}

/* Risk levels in charts (B-09): an ordinal ramp, one hue from light (low) to dark (critical), so the order reads without
   relying on hue; "not assessed" is a neutral grey. Checked with the dataviz validator (--ordinal): monotone lightness,
   adjacent steps at least 0.06 apart, the step nearest the surface above 2:1 (light 2.35:1 on white; dark, where the
   ramp runs dark to light, 2.58:1 on #0E1A2E). Charts always add a legend and a table view. */
:root, [data-bs-theme=light] {
  --vt-level-1:#F28AA4; --vt-level-2:#E0507A; --vt-level-3:#B8244F; --vt-level-4:#7D0F33; --vt-level-none:#9AA5B8;
}
[data-bs-theme=dark] {
  --vt-level-1:#A82A50; --vt-level-2:#D13D69; --vt-level-3:#F06D93; --vt-level-4:#FFB0C4; --vt-level-none:#5D6B82;
}