/*
 * The only place web colours are defined (admin dashboard + public legal pages).
 * Mirrors mobile/src/theme/colors.ts — change both together.
 * Templates must only ever use var(--token).
 */
:root {
  --bg: #F6F6F6;
  --card: #FFFFFF;
  --ink: #000000;
  --muted: #545454;
  --faint: #AFAFAF;
  --line: #E2E2E2;
  --brand: #000000;
  --brand-tint: #F6F6F6;
  --on-brand: #FFFFFF;
  --on-brand-muted: #AFAFAF;
  --on-brand-subtle: rgba(255, 255, 255, 0.08);
  --accent: #06C167;
  --accent-strong: #05A357;
  --accent-glow: rgba(6, 193, 103, 0.14);
  --success: #05A357;
  --success-tint: #E6F8EE;
  --warning: #C98A00;
  --warning-tint: #FFF4DB;
  --danger: #E11900;
  --danger-tint: #FDECEA;
  --special: #7356BF;
  --special-tint: #EFEBF8;
  --info: #4B6178;
  --info-tint: #EAEFF4;

  /* Older names still used by some templates. */
  --blue: var(--brand);
  --green: var(--success);
  --red: var(--danger);
  --amber: var(--warning);
  --violet: var(--special);
}

/* Public legal pages follow the reader's system theme. */
@media (prefers-color-scheme: dark) {
  .auto-dark {
    --bg: #000000;
    --card: #141414;
    --ink: #FFFFFF;
    --muted: #AFAFAF;
    --faint: #757575;
    --line: #333333;
    --blue: var(--accent);
  }
}
