/* Sanjivani design tokens — generated from the Sanjivani design system tokens.json (v1).
   Light is the default; dark applies via prefers-color-scheme (unless data-theme="light")
   or explicitly via data-theme="dark" on <html>. */

:root {
  /* Brand */
  --brand-red: #ee3038;
  --brand-ink: #231f20;
  --brand-red-tint: #fdecec;

  /* Action */
  --action: #c81e28;
  --action-hover: #a5161f;
  --on-action: #ffffff;
  --link: #c81e28;

  /* Surfaces */
  --surface: #ffffff;
  --surface-sunken: #f6f4f3;
  --surface-raised: #ffffff;

  /* Text */
  --ink: #231f20;
  --ink-muted: #5c5557;
  --ink-subtle: #7a7375;

  /* Borders */
  --border: #e3dfdd;
  --border-strong: #8a8385;

  /* Status */
  --success: #1b7a43;
  --success-tint: #e8f5ed;
  --warning: #9a5b00;
  --warning-tint: #fdf3e1;
  --danger: #b3261e;
  --danger-tint: #fdeceb;
  --info: #2d5f8b;
  --info-tint: #e8f0f8;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(35, 31, 32, 0.08);
  --shadow-md: 0 8px 24px rgba(35, 31, 32, 0.12);

  /* Font families */
  --font-display: "Marcellus", Georgia, serif; /* website/covers only — never in app UI */
  --font-sans: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;

  /* Type scale (size / line-height / weight) */
  --h1: 600 28px/36px var(--font-sans);
  --h2: 600 22px/30px var(--font-sans);
  --h3: 600 18px/26px var(--font-sans);
  --body: 400 16px/24px var(--font-sans);
  --body-sm: 400 14px/20px var(--font-sans);   /* default app text */
  --label: 600 13px/18px var(--font-sans);     /* letter-spacing 0.01em */
  --caption: 400 12px/16px var(--font-sans);
  --overline: 600 12px/16px var(--font-sans);  /* letter-spacing 0.08em, text in capitals */
  --data: 400 13px/20px var(--font-mono);      /* codes, batch/PO numbers, quantities */

  /* Spacing (4px grid) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  /* Motion */
  --motion-fast: 120ms ease-out;
  --motion-base: 200ms ease-out;

  color-scheme: light;
}

/* Dark theme tokens (shared by both selectors below) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --brand-red-tint: #3a1c1e;
    --link: #ff6b70;
    --surface: #1a1718;
    --surface-sunken: #121011;
    --surface-raised: #242021;
    --ink: #f4f1ef;
    --ink-muted: #b3acae;
    --ink-subtle: #8f8789;
    --border: #3a3536;
    --border-strong: #7a7375;
    --success: #5cc98a;
    --success-tint: #15291d;
    --warning: #f0b24a;
    --warning-tint: #2e2312;
    --danger: #ff8a80;
    --danger-tint: #331816;
    --info: #8dbbe6;
    --info-tint: #16212d;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.6);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --brand-red-tint: #3a1c1e;
  --link: #ff6b70;
  --surface: #1a1718;
  --surface-sunken: #121011;
  --surface-raised: #242021;
  --ink: #f4f1ef;
  --ink-muted: #b3acae;
  --ink-subtle: #8f8789;
  --border: #3a3536;
  --border-strong: #7a7375;
  --success: #5cc98a;
  --success-tint: #15291d;
  --warning: #f0b24a;
  --warning-tint: #2e2312;
  --danger: #ff8a80;
  --danger-tint: #331816;
  --info: #8dbbe6;
  --info-tint: #16212d;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}

/* ProcureWatch additions (not part of the Sanjivani design system): Follow-up sheet cell states.
   These are the colours the sheet has always used; they carry meaning and are the same in light and dark.
   Every state also shows its text, so colour is never the only signal. */
:root {
  --fu-red: #e8261c;        --fu-red-text: #ffffff;
  --fu-orange: #f4a259;     --fu-orange-text: #111111;
  --fu-blue: #1fb6f5;       --fu-blue-text: #111111;
  --fu-green: #8ac43f;      --fu-green-text: #111111;
  --fu-focus: #111111;      /* focus ring drawn inside a coloured cell */
}
