/* Vet Talk design tokens (audit §2.1). RGB triplets for rgb(var(--x) / a).
   Old names kept as aliases so untouched screens still render. */

:root {
  color-scheme: light;

  /* brand */
  --c-primary: 11 58 91;        /* #0B3A5B header, primary button, active tab */
  --c-primary-hover: 28 84 123;
  --c-primary-deep: 7 40 64;
  --c-accent: 13 148 136;       /* fills/borders only  #0D9488 */
  --c-accent-text: 15 118 110;  /* text on white  #0F766E (5.5:1) */

  /* surfaces */
  --c-bg: 238 242 246;          /* workspace  #EEF2F6 */
  --c-surface: 255 255 255;
  --c-surface-2: 247 249 251;   /* table header, section strip */
  --c-line: 221 227 234;        /* borders  #DDE3EA */
  --c-ink: 22 30 46;
  --c-mute: 88 100 118;

  /* status (fill / text-safe) */
  --c-ok: 22 150 84;
  --c-ok-text: 21 128 61;
  --c-warn: 217 119 6;
  --c-warn-text: 180 83 9;
  --c-danger: 192 57 43;
  --c-danger-text: 176 42 30;
  --c-info: 37 99 235;
  --c-info-text: 29 78 216;

  /* spacing 4px scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;

  /* type */
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 24px;
  --fs-live: clamp(1.25rem, 2.4vw + 0.5rem, 1.75rem);
  --font: "Noto Sans HK", -apple-system, BlinkMacSystemFont, "PingFang HK", "Microsoft JhengHei", system-ui, sans-serif;

  /* density */
  --hit: 32px;
  --row-h: 36px;
  --radius: 8px;
  --radius-sm: 6px;
  --radius-pill: 999px;
  --radius-sheet: 12px;
  --shadow-1: 0 1px 2px rgb(var(--c-ink) / 0.06);
  --shadow-2: 0 8px 24px rgb(var(--c-ink) / 0.14);
  --header-h: 48px;
  --nav-w: 220px;
  --banner-h: 56px;

  /* aliases (pre-F0 names; raw RGB so rgb(var(--x)/a) keeps working) */
  --c-primary-soft: 28 84 123;
  --c-accent-soft: 204 240 236;
  --c-success: 22 150 84;
  --radius-control: 6px;
  --radius-segment: 6px;
  --shadow-soft: 0 1px 2px rgb(var(--c-ink) / 0.06);
  --shadow-pop: 0 8px 24px rgb(var(--c-ink) / 0.14);
  --shadow-glass: 0 0 0 0.5px rgb(var(--c-ink) / 0.08), 0 8px 32px rgb(var(--c-primary) / 0.10);
}

@media (pointer: coarse) {
  :root {
    --hit: 44px;
    --row-h: 48px;
  }
}