/* Clinic OS design tokens. The ONLY place colours, fonts, sizes, radii and
   shadows are defined. Components use these variables, never raw values.
   Source: Foundation v3 design-tokens.json, extended for accessibility and
   responsive layout. To rebrand, change this file only. */

:root {
  /* Navigation (midnight sidebar) */
  --nav-bg: #061022;
  --nav-bg-2: #03182D;
  --nav-text: #D6DEEA;
  --nav-muted: #8A9BB2;
  --nav-active: #17305B;
  --nav-hover: #12294A;
  --nav-line: #1C3047;
  --brand-slash: #0CC5C7;
  --brand-os: #198BFF;

  /* Workspace */
  --bg: #F6F8FC;
  --surface: #FFFFFF;
  --surface-2: #F8FAFD;
  --surface-sunk: #F1F4F9;
  --text: #151F32;
  --text-2: #3E4B61;
  --muted: #5E6A80;          /* 5.5:1 on white */
  --muted-2: #67738C;        /* 4.8:1 on white, 4.6:1 on surface-2; labels only */
  --border: #E2E7EF;
  --border-strong: #CBD3DF;
  --line: #EDF0F5;

  /* Action colour (purple) */
  --primary: #6C4FF6;
  --primary-hover: #5B3FE2;
  --primary-ink: #5236D6;    /* text on tint, 6.0:1 */
  --primary-tint: #F0ECFF;
  --primary-tint-2: #E4DCFF;
  --on-primary: #FFFFFF;

  /* Semantic */
  --ok: #21B67A;   --ok-ink: #1F7449;   --ok-tint: #E8F6EE;
  --warn: #F29A1F; --warn-ink: #8F530B; --warn-tint: #FFF3E1; --warn-line: #F4D9AE;
  --bad: #E2456F;  --bad-ink: #AE2E52;  --bad-tint: #FDECF1;  --bad-line: #F4C6D3;
  --info: #0EA5A8; --info-ink: #11706F; --info-tint: #E8F8F7; --info-line: #C9ECE9;
  --grey-ink: #4F5C72; --grey-tint: #EEF1F5;

  /* Module colours (accent only; text uses the -ink variant) */
  --m-neuropathy: #6C4FF6;   --m-neuropathy-ink: #5236D6;
  --m-iv: #0CBFC2;           --m-iv-ink: #0A7375;
  --m-primary-care: #21B67A; --m-primary-care-ink: #1F7449;
  --m-sexual-wellness: #C2410C; --m-sexual-wellness-ink: #9A3412;
  --m-wound-care: #DC2626;   --m-wound-care-ink: #B91C1C;
  --m-weight: #F29A1F;       --m-weight-ink: #8F530B;
  --m-regenerative: #2563EB; --m-regenerative-ink: #1D4ED8;
  --m-hair: #9333EA;         --m-hair-ink: #7E22CE;
  --m-podiatry: #0891B2;     --m-podiatry-ink: #0E7490;
  --m-chiropractic: #65A30D; --m-chiropractic-ink: #4D7C0F;
  --m-medspa: #EC577E;       --m-medspa-ink: #B22D56;
  --m-general: #64748B;      --m-general-ink: #475569;

  /* Type */
  --font: "Inter", "Segoe UI", Arial, Helvetica, sans-serif;
  --font-num: "Inter", "Segoe UI", Arial, sans-serif;
  --fs-xs: 11px;   /* labels, never smaller */
  --fs-sm: 12.5px;
  --fs-base: 14px;
  --fs-md: 15px;
  --fs-lg: 17px;
  --fs-xl: 21px;
  --fs-2xl: 26px;  /* page title */
  --fs-kpi: 26px;
  --lh: 1.5;

  /* Space (4 px grid) */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s8: 32px; --s10: 40px;

  /* Shape */
  --r-sm: 6px; --r: 8px; --r-card: 12px; --r-drawer: 16px; --r-pill: 999px;
  --shadow-card: 0 1px 2px rgba(17, 34, 68, .04), 0 3px 10px rgba(17, 34, 68, .03);
  --shadow-pop: 0 12px 32px rgba(17, 34, 68, .16);
  --shadow-drawer: -12px 0 32px rgba(17, 34, 68, .10);

  /* Layout */
  --side-w: 240px;
  --side-w-mini: 72px;
  --topbar-h: 60px;
  --bottombar-h: 62px;
  --content-max: 1680px;
  --drawer-w: 440px;
  --tap: 44px;
  --dur: 180ms;

  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; }
}
