/* ==========================================================
   Design tokens - "Command" CAD theme (v6).

   Dark navy/graphite console with a single gold accent (#CB9807),
   built on the #181A27 primary. Gold is used sparingly: the active nav
   item, primary actions, key figures and focus rings - never as a big
   fill. Depth comes from a three-step surface ladder plus hairline
   borders, not shadows or gradients.

   Every token NAME from the previous theme is kept (bg-0..4, border*,
   text-0..3, accent*, chrome*, danger/warn/good/info, priority-*,
   radius*, shadow*, font*, dur*) so every CSS file and inline style that
   references var(--x) keeps resolving. components/settings.js's
   applyAccent() still overrides --accent/--chrome at runtime when an
   officer picks a different Appearance swatch; the gold preset is the
   default for every department.
   ========================================================== */
:root {
  /* Surfaces: app floor -> sidebar/header -> panels -> raised/inputs -> hover */
  --bg-0: #0e1018;
  --bg-1: #131521;
  --bg-2: #181a27;          /* primary */
  --bg-3: #1f2232;
  --bg-4: #282c40;

  --border: #2a2e45;
  --border-soft: #222539;
  --border-strong: #3a3f5c;

  --glass-bg: var(--bg-2);
  --glass-bg-strong: var(--bg-1);
  --glass-border: var(--border);
  --glass-blur: 0px;

  /* Text */
  --text-0: #eceef5;
  --text-1: #b4b9cc;
  --text-2: #7c8299;
  --text-3: #535970;

  /* Accent (gold). --on-accent is the text color that sits on a solid
     accent fill; applyAccent() recomputes it for dark/light presets. */
  --accent: #cb9807;
  --accent-2: #cb9807;
  --accent-strong: #e2ad1d;
  --accent-soft: rgba(203, 152, 7, 0.12);
  --accent-border: rgba(203, 152, 7, 0.42);
  --accent-gradient: var(--accent);
  --on-accent: #16171f;

  /* "Chrome" = selection/active-state color. In this theme it follows the
     accent, so selected rows, active tabs and switches read gold. */
  --chrome: #cb9807;
  --chrome-strong: #e2ad1d;
  --chrome-soft: rgba(203, 152, 7, 0.12);
  --chrome-border: rgba(203, 152, 7, 0.42);

  /* Semantic */
  --danger: #e0464b;
  --danger-strong: #f16a6e;
  --danger-soft: rgba(224, 70, 75, 0.14);

  --warn: #e8a317;
  --warn-strong: #f5bb45;
  --warn-soft: rgba(232, 163, 23, 0.14);

  --good: #2eaa68;
  --good-strong: #4cc985;
  --good-soft: rgba(46, 170, 104, 0.14);

  --info: #4a86e8;
  --info-strong: #75a4f0;
  --info-soft: rgba(74, 134, 232, 0.15);

  --neutral-soft: rgba(140, 150, 180, 0.13);

  --priority-1: #e0464b;
  --priority-2: #e8a317;
  --priority-3: #6f7896;

  /* Window size - designed at 1920x1080, scales down to 1280x720 */
  --mdt-w: min(1760px, 97vw);
  --mdt-h: min(992px, 95vh);
  --sidebar-w: 232px;
  --topbar-h: 58px;
  --statusbar-h: 26px;

  /* Radii - sharp but slightly rounded */
  --radius-lg: 8px;
  --radius: 6px;
  --radius-sm: 5px;
  --radius-xs: 4px;

  /* Shadows - minimal */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.32);
  --shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.55);
  --glow-accent: 0 0 0 3px rgba(203, 152, 7, 0.18);

  /* Typography - system fonts only (nothing to download in NUI) */
  --font-ui: 'Segoe UI Variable Text', 'Segoe UI', 'Inter', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
  --font-display: 'Segoe UI Variable Display', 'Segoe UI', 'Inter', 'Roboto', Arial, sans-serif;
  --font-mono: 'Cascadia Mono', 'JetBrains Mono', Consolas, 'Courier New', monospace;

  /* Motion - quick and subtle */
  --dur-fast: 110ms;
  --dur-med: 170ms;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ----------------------------------------------------------------
   Light theme (MDT Settings > Appearance > Theme) - "daylight" console.
   Toggled by components/settings.js's applyTheme() via html.mdt-light. */
html.mdt-light {
  --bg-0: #e9ebf1;
  --bg-1: #f4f5f8;
  --bg-2: #ffffff;
  --bg-3: #f1f2f6;
  --bg-4: #e4e7ee;

  --border: #d3d7e2;
  --border-soft: #e2e5ec;
  --border-strong: #b7bdcd;

  --glass-bg: var(--bg-2);
  --glass-bg-strong: var(--bg-1);
  --glass-border: var(--border);

  --text-0: #171a26;
  --text-1: #3b4157;
  --text-2: #646b84;
  --text-3: #9298ad;

  --accent-soft: rgba(203, 152, 7, 0.14);
  --chrome-soft: rgba(203, 152, 7, 0.14);

  --neutral-soft: rgba(90, 100, 130, 0.1);

  --shadow-sm: 0 1px 2px rgba(20, 24, 40, 0.08);
  --shadow-md: 0 4px 14px rgba(20, 24, 40, 0.1);
  --shadow-lg: 0 18px 48px rgba(20, 24, 40, 0.22);
}