/* ComplyVox — Colour tokens
   Colour does two jobs only: IDENTITY (violet) and SIGNAL (status).
   Everything else is a violet-tinted greyscale. No decorative colour.
   All values verified WCAG 2.2 AA. Neutrals + signals are structured so a
   dark mode is derivable later by inverting the ink and surface ramps. */

:root {
  /* — Brand — */
  --violet:        #4F36C9;  /* primary: links, focus rings, primary fills. 7.77:1 on white */
  --violet-tint:   #EEEBFC;  /* selected rows, active nav, brand chips */
  --violet-tint-2: #F4F1FE;  /* hover on brand surfaces */

  /* — Ink (violet-tinted greyscale) — */
  --ink:   #1A1530;  /* 17.6:1  body copy, headings */
  --ink-2: #3A3554;  /* 11.6:1  secondary text */
  --ink-3: #6B6584;  /*  5.5:1  tertiary text, dates at rest, nav labels */
  --ink-4: #948FA8;  /*  3.1:1  NEVER body text — icons, borders, disabled; text only >=24px or >=18.66px bold */

  /* — Surface — */
  --paper:  #FBFAFE;  /* the page — a slight violet-tinted off-white, never pure white */
  --tint:   #F7F5FC;  /* the one recessed step: left nav, table headers */
  --line:   #E4E1EE;  /* the hairline — workhorse of the system */
  --line-2: #EFEDF6;  /* interior rules inside a dense table */

  /* — Signal — each hue has exactly one job — */
  --red:       #9F1239;  /* needs you now: overdue, high risk, error */
  --red-tint:  #FCE7EF;
  --amber:     #8A5A00;  /* approaching: needs review, awaiting someone */
  --amber-tint:#FFF1DD;
  --green:     #1F7A4D;  /* settled, approved, nothing to do */
  --green-tint:#DEF7EA;

  /* — Semantic aliases — */
  --text-primary:   var(--ink);
  --text-secondary: var(--ink-2);
  --text-tertiary:  var(--ink-3);
  --text-muted:     var(--ink-4);
  --text-on-violet: #FFFFFF;
  --link:           var(--violet);
  --focus-ring:     var(--violet);
  --surface-page:   var(--paper);
  --surface-sunken: var(--tint);
  --border:         var(--line);
  --border-interior:var(--line-2);
}