/* Rhodos Console — design tokens.
 * Every colour in the console comes from here; components never hard-code one.
 * Light is the default; dark is a token swap (View > Theme). See docs/console/CONSOLE_PLAN.md §4. */

:root {
  color-scheme: light;

  --bg: #f3f4f6;
  --surface: #ffffff;
  --surface-2: #f8f9fa;
  --surface-3: #eef0f3;
  --hover: #eef1f5;
  --line: #dde1e6;
  --line-strong: #c5ccd4;

  --ink: #1b2733;
  --ink-2: #56616d;
  --ink-3: #8a939d;
  --ink-inverse: #ffffff;

  --accent: #22405f;
  --accent-hover: #2c5279;
  --accent-soft: #e6edf4;
  --accent-line: #9fb4c9;
  --focus: #2f6fb1;

  --ok: #1e7b45;
  --ok-soft: #e3f1e8;
  --warn: #9a6100;
  --warn-soft: #f7ecd6;
  --crit: #b42318;
  --crit-soft: #fbe7e5;
  --idle: #8a939d;
  --idle-soft: #eceff2;

  --map-bg: #e8eaed;
  --shadow-pop: 0 6px 24px rgba(16, 24, 32, 0.14), 0 1px 3px rgba(16, 24, 32, 0.10);

  --font: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-display: "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --mono: "Cascadia Mono", "Cascadia Code", Consolas, "Courier New", monospace;

  --fs-cap: 11px;
  --fs-sm: 12px;
  --fs: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;

  --radius: 4px;
  --radius-sm: 3px;

  --h-menubar: 30px;
  --h-toolbar: 40px;
  --h-statusbar: 24px;
  --w-nav: 216px;
  --w-list: 304px;
  --w-inspector: 360px;
  --row: 30px;
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --bg: #15191e;
  --surface: #1c2128;
  --surface-2: #222831;
  --surface-3: #29303a;
  --hover: #262d36;
  --line: #2e3640;
  --line-strong: #3d4753;

  --ink: #e6eaef;
  --ink-2: #a3adb8;
  --ink-3: #6e7883;
  --ink-inverse: #0f1318;

  --accent: #6fa3d8;
  --accent-hover: #8ab6e2;
  --accent-soft: #1f2f40;
  --accent-line: #3d5c7c;
  --focus: #8ab6e2;

  --ok: #4cc38a;
  --ok-soft: #173326;
  --warn: #e0a23b;
  --warn-soft: #3a2c14;
  --crit: #f06a5e;
  --crit-soft: #3d1b19;
  --idle: #6e7883;
  --idle-soft: #262c33;

  --map-bg: #0f1216;
  --shadow-pop: 0 8px 28px rgba(0, 0, 0, 0.5), 0 1px 3px rgba(0, 0, 0, 0.4);
}