/* Renewal tracker design tokens - direction A "Saffron Ledger". Canonical copy; app/static/tokens.css must match (a test checks it). */
:root {
  color-scheme: light;

  /* Type: system stack, Tamil-capable fallbacks, no downloads. */
  --font-sans: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Noto Sans", "Noto Sans Tamil", "Nirmala UI", "Latha", "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
  --fs-xs: 0.78125rem;   /* 12.5 - meta, helper, chips */
  --fs-sm: 0.84375rem;   /* 13.5 - buttons, labels, table cells */
  --fs-md: 0.9375rem;    /* 15 - body */
  --fs-field: 1rem;      /* 16 - field text (no iOS zoom) */
  --fs-row: 0.96875rem;  /* 15.5 - customer name */
  --fs-lg: 1.0625rem;    /* 17 - row amount, section title */
  --fs-xl: 1.375rem;     /* 22 - sub-headline */
  --fs-title: 1.875rem;  /* 30 - page title */
  --fs-hero: 2.875rem;   /* 46 - hero figure, phone */
  --fs-hero-lg: 3.5rem;  /* 56 - hero figure, laptop */
  --fw-regular: 400;
  --fw-strong: 650;      /* the only other weight */
  --lh-text: 1.5;
  --lh-tight: 1.2;

  /* Spacing: 4 / 8 scale. */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;

  /* Shape. */
  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 16px;
  --radius-xl: 22px;
  --touch: 2.75rem;      /* 44 px minimum target */
  --touch-lg: 3rem;      /* 48 px fields and the main action */
  --bar-h: 3.5rem;       /* 56 px top bar on phones */
  --side-w: 14.5rem;     /* 232 px laptop sidebar */
  --measure: 80rem;      /* page max width */
  --measure-text: 40rem; /* forms (640) */

  /* Colour: deep ink, cool paper, one saffron. */
  --ink: #101936;            /* Ink: hero, sidebar, headings */
  --ink-2: #2a3358;          /* body, 11:1 on paper */
  --ink-muted: #5e6783;      /* 5.2:1 on paper */
  --ink-faint: #636b88;      /* 5.0:1 on paper, 5.4:1 on white: meta, column heads */
  --ink-on-dark: #aeb5d3;    /* muted text on ink, 8.5:1 */
  --bg: #f4f5f9;             /* Paper */
  --surface: #ffffff;
  --surface-sunk: #f8f9fc;   /* table head, locked field */
  --line: #e3e6ef;           /* Hairline */
  --line-soft: #eef0f6;
  --line-strong: #d5d9e6;    /* field borders */

  --saffron: #ff8a00;        /* brand, the one main action */
  --saffron-hover: #f08000;
  --saffron-deep: #d96f00;   /* links, focus */
  --saffron-tint: #fff1dc;
  --saffron-line: #e5b66a;
  --on-saffron: #1b0f00;     /* 8:1 on saffron */
  --link: #a85600;           /* 4.8:1 on paper, 4.7:1 on tint */

  --paid-fg: #0e7a4f;        /* paid, WhatsApp: 4.6:1 on tint, 5.4:1 under white text */
  --paid-bg: #ddf4e8;
  --overdue-fg: #c2260f;     /* late: 4.9:1 on tint, 5.9:1 on white */
  --overdue-bg: #fde4df;
  --soon-fg: #9a5b00;        /* due today: 4.8:1 on tint */
  --soon-bg: #ffefc7;
  --soon-line: #ebd49a;
  --later-fg: #2a3358;       /* upcoming */
  --later-bg: #e7e9f3;
  --error-fg: #c2260f;
  --error-bg: #fde4df;
  --error-line: #f1b9ae;
  --info-bg: #ddf4e8;

  --ink-raised: #26305c;     /* selected item on ink */
  --ink-line: #2f3a6b;       /* hairline on ink */

  --test-bg: #e7e9f3;        /* simulated-today strip */
  --test-fg: #2a3358;

  /* Literals moved out of app.css and the card (T-34, ADR-9): nothing outside this file names a colour. */
  --on-ink: #fff;            /* text and marks on ink, saffron, green and red fills */
  --on-ink-nav: #c9cee6;     /* nav and tool links on ink */
  --on-ink-wash: rgba(255, 255, 255, 0.08);
  --paid-deep: #0b6641;      /* Remind hover */
  --overdue-deep: #9d1d0b;   /* danger hover */
  --info-fg: #0a5c3b;
  --error-text: #8f1d0b;
  --banner-fg: #6b4000;
  --plan-fg: #5e4300;
  --saffron-wash: #fff8ec;
  --saffron-glow: rgba(217, 111, 0, 0.7);
  --late-on-ink: #ff8f78;
  --wa-bg: #0A7F50;          /* WhatsApp action (emerald: money and WhatsApp only); 5.0:1 with white text (was #0B8F5A, 4.1:1) */
  --chat-bg: #EEF1F4;
  --chart-late: #e5482d;
  --chart-today: #f5b301;
  --chart-later: #6b74c4;

  /* Reminder card (PNG) and demo data: read by app/tokens.py. */
  --card-bg: #EEF1F4;
  --card-surface: #FFFFFF;
  --card-border: #DDE2E8;
  --card-ink: #1B2430;
  --card-muted: #5B6675;
  --card-faint: #8A94A3;
  --card-emerald: #0B8F5A;
  --brand-default: #1B2430;  /* agent brand colour until they pick one */
  --demo-brand: #1B4F72;
  --demo-photo-bg: #CFD6DE;
  --demo-shot-bg: #F7F8FA;

  --focus: #d96f00;
  --focus-ring: rgba(255, 138, 0, 0.22);
  --shadow-card: 0 1px 0 var(--line), 0 10px 24px -18px rgba(16, 25, 54, 0.4);
}

/* Light theme only (founder decision). */
