/* Design tokens — mirror frontend/patient_app/lib/theme/tokens.dart light mode.
   Single source of truth; component CSS reads from these vars. */
:root {
  color-scheme: light;

  /* Accent (Midnight Navy) */
  --accent: #0a1628;
  --accent-hover: #142336;
  --accent-soft: rgb(10 22 40 / 12%);
  --accent-edge: rgb(10 22 40 / 22%);
  --accent-on-bg: #ffffff;

  /* Semantic */
  --danger: #d4312c;
  --danger-soft: rgb(212 49 44 / 8%);
  --danger-edge: rgb(212 49 44 / 24%);
  --success: #1b7f4b;
  --success-soft: rgb(27 127 75 / 8%);
  --success-edge: rgb(27 127 75 / 22%);
  --warning: #b45309;
  --warning-soft: rgb(180 83 9 / 8%);
  --warning-edge: rgb(180 83 9 / 26%);

  /* Neutrals — light */
  --canvas: #ffffff;
  --surface-1: #fafaf9;
  --surface-2: #f4f4f5;
  --surface-3: #ebebee;
  --border-subtle: #ebebee;
  --border-default: #e4e4e7;
  --text-tertiary: #a1a1aa;
  --text-secondary: #52525b;
  --text-primary: #18181b;

  /* Page background — slightly warm off-white, matches patient app's home */
  --page: #f7f7f5;

  /* Radii (4 / 6 / 8 / 12 / 20) */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 20px;

  /* Spacing — 4pt grid (matches patient app FTokens.s1..s11) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-7: 32px;
  --s-8: 40px;
  --s-9: 48px;
  --s-10: 64px;
  --s-11: 80px;

  /* Shadows — match FTokens.floatLight / popLight */
  --shadow-float: 0 1px 2px rgb(16 24 40 / 5%);
  --shadow-pop:
    0 1px 2px rgb(16 24 40 / 4%),
    0 12px 32px rgb(16 24 40 / 8%);

  /* Type families */
  --font-sans: "Inter Tight", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Acuity (Stage 2 will color-code dots; tokens are stable) */
  --acuity-immediate: var(--danger);
  --acuity-same-day: var(--warning);
  --acuity-routine: var(--text-tertiary);
}