/* Design tokens: the only file with raw colours, font stacks and radii. See docs/tech/01_design-system.md. */

:root {
  --a-bg: #f3f5f7;
  --a-surface: #ffffff;
  --a-surface-2: #e9edf1;
  --a-text: #17212b;
  --a-text-muted: #5f6b77;
  --a-line: #d6dde4;
  --a-brand: #2457c5;
  --a-brand-soft: #e4ecfb;
  --a-on-brand: #ffffff;
  --a-ok: #197a42;
  --a-ok-soft: #e1f3e8;
  --a-warn: #8f5e14;
  --a-warn-soft: #fbf0d9;
  --a-bad: #b83333;
  --a-bad-soft: #fbe3e3;
  --a-wait: #6b7280;
  --a-wait-soft: #e8eaed;
  --a-av-a: #d98324;
  --a-av-b: #2457c5;
  --a-av-c: #7a4fd6;
  --a-font-ui: "Figtree", "Helvetica Neue", Arial, sans-serif;
  --a-font-mono: "IBM Plex Mono", "SFMono-Regular", Menlo, monospace;
  --a-radius: 10px;
  --a-radius-sm: 8px;
  --a-radius-full: 50%;
  --a-radius-pill: 999px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --a-bg: #0f1419;
    --a-surface: #171d24;
    --a-surface-2: #1f272f;
    --a-text: #e6ebf0;
    --a-text-muted: #9aa6b2;
    --a-line: #2b353f;
    --a-brand: #7aa2ff;
    --a-brand-soft: #1b2a4a;
    --a-on-brand: #0f1419;
    --a-ok: #5ccf8a;
    --a-ok-soft: #163325;
    --a-warn: #e9b454;
    --a-warn-soft: #3a2d12;
    --a-bad: #f07878;
    --a-bad-soft: #3d1b1b;
    --a-wait: #9aa6b2;
    --a-wait-soft: #262e36;
    --a-av-a: #f0a24a;
    --a-av-b: #7aa2ff;
    --a-av-c: #b393ff;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --a-bg: #0f1419;
  --a-surface: #171d24;
  --a-surface-2: #1f272f;
  --a-text: #e6ebf0;
  --a-text-muted: #9aa6b2;
  --a-line: #2b353f;
  --a-brand: #7aa2ff;
  --a-brand-soft: #1b2a4a;
  --a-on-brand: #0f1419;
  --a-ok: #5ccf8a;
  --a-ok-soft: #163325;
  --a-warn: #e9b454;
  --a-warn-soft: #3a2d12;
  --a-bad: #f07878;
  --a-bad-soft: #3d1b1b;
  --a-wait: #9aa6b2;
  --a-wait-soft: #262e36;
  --a-av-a: #f0a24a;
  --a-av-b: #7aa2ff;
  --a-av-c: #b393ff;
  color-scheme: dark;
}