/* =============================================================================
 * tokens.css — Northledger design tokens. WCAG-AA verified text colors.
 * ========================================================================== */
:root {
  /* brand + surfaces */
  --primary: #1B3A8B;
  --primary-dark: #13286A;
  --primary-soft: #E6ECF8;
  --accent: #0F9D8C;
  --accent-soft: #E1F5EE;

  --bg: #F6F7FB;
  --surface: #FFFFFF;
  --surface-alt: #EEF1F7;
  --surface-hover: #F3F5FA;
  --border: #E2E6EF;
  --border-strong: #CBD2E1;

  --text-primary: #0E1726;
  --text-secondary: #2C3650;
  --text-muted: #5B647A;
  --text-inverse: #FFFFFF;

  /* semantic */
  --success: #15803D;
  --success-soft: #EAF3DE;
  --warning: #B45309;
  --warning-soft: #FAEEDA;
  --danger: #C0392B;
  --danger-soft: #FCEBEB;
  --info: #1D6FB8;
  --info-soft: #E6F1FB;

  /* status pill fill / text pairs */
  --pill-paid-bg: #EAF3DE;    --pill-paid-fg: #27500A;
  --pill-sent-bg: #E6F1FB;    --pill-sent-fg: #0C447C;
  --pill-draft-bg: #F1EFE8;   --pill-draft-fg: #555349;
  --pill-due-bg: #FAEEDA;     --pill-due-fg: #633806;
  --pill-overdue-bg: #FCEBEB; --pill-overdue-fg: #791F1F;
  --pill-partial-bg: #E1F5EE; --pill-partial-fg: #085041;
  --pill-void-bg: #F1EFE8;    --pill-void-fg: #2C2C2A;
  --pill-uncollectible-bg: #F3E7E7; --pill-uncollectible-fg: #5C1A1A;

  /* aging risk ramp (green -> red) */
  --c-current: #639922;
  --c-1-30: #BA7517;
  --c-31-60: #EF9F27;
  --c-61-90: #D85A30;
  --c-90: #C0392B;

  /* behavior bands */
  --band-good: #15803D;
  --band-fair: #B45309;
  --band-risky: #C0392B;

  /* typography */
  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-heading: "Lexend", "Inter", -apple-system, "Segoe UI", sans-serif;

  /* spacing (4px base) */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;

  /* radius */
  --r-sm: 6px; --r-md: 8px; --r-lg: 12px; --r-full: 999px;

  /* elevation */
  --e1: 0 1px 2px rgba(14,23,38,.06), 0 1px 1px rgba(14,23,38,.04);
  --e2: 0 4px 12px rgba(14,23,38,.08);
  --e3: 0 12px 32px rgba(14,23,38,.14);
  --focus: 0 0 0 3px rgba(27,58,139,.30);

  /* layout */
  --sidebar-w: 256px;
  --sidebar-w-collapsed: 68px;
  --topbar-h: 60px;
  --content-max: 1320px;
  --form-max: 1040px;
}