/* Tillzy brand tokens v4 (2026-10-14): Midnight + Tillzy Green; logo = Plus Jakarta Sans ExtraBold with i-l-l as rising growth bars (softened corners) and a green dot on the i.
   Fonts: Plus Jakarta Sans (headings, 700/800) + Inter (UI and body, 400/500/600, tabular figures for money).
   Contrast ratios are WCAG 2. */
:root {
  /* Brand */
  --tz-midnight: #0B1F2A;     /* Logo text, headings, body text, dark panels. 16.9:1 on white */
  --tz-green: #22C55E;        /* The tick. Accents, icons, primary button fill (with midnight label, 7.4:1). Never small text on white (2.3:1) */
  --tz-green-deep: #15803D;   /* Green for text, links, and buttons with white labels. 5.0:1 on white */
  --tz-mint: #E8F8EF;         /* Selected rows, active nav, success banners */
  --tz-ivory: #FAF8F3;        /* Print and stationery paper, warm sections on the website */
  --tz-apricot: #F4A261;      /* Warm accent for marketing only: illustrations, highlights, stickers, social. Never in the app UI or for text (2.1:1 on white). Pairs with midnight (8.2:1) */
  --tz-peach: #FDEEE2;        /* Warm tint behind marketing panels and testimonials */

  /* Neutrals */
  --tz-cloud: #F5F7F6;        /* App page background */
  --tz-surface: #FFFFFF;      /* Cards, panels, inputs */
  --tz-line: #DDE4E8;         /* Borders, table rules */
  --tz-slate: #5A6B76;        /* Secondary text. 5.1:1 on cloud */

  /* Status */
  --tz-success: #15803D;
  --tz-warning: #B45309;      /* 5.0:1 */
  --tz-danger: #C2412D;       /* 5.1:1 */

  /* Type */
  --tz-font-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --tz-font-ui: "Inter", system-ui, sans-serif;
  --tz-radius: 12px;          /* Cards and inputs; buttons are fully rounded (999px) */

  /* Buttons */
  --tz-btn-primary-bg: var(--tz-green);   --tz-btn-primary-fg: var(--tz-midnight);
  --tz-btn-dark-bg: var(--tz-midnight);   --tz-btn-dark-fg: #FFFFFF;
}

/* Dark theme */
:root[data-theme="dark"] {
  --tz-midnight: #E9F0F2;     /* text flips to near-white */
  --tz-green: #34D877;        /* 9.0:1 on dark ground */
  --tz-green-deep: #34D877;
  --tz-mint: #123A2B;
  --tz-cloud: #0B1F2A;
  --tz-surface: #12293A;
  --tz-line: #1F3A4C;
  --tz-slate: #9FB0BA;        /* 7.5:1 */
  --tz-btn-primary-bg: #34D877; --tz-btn-primary-fg: #0B1F2A;
  --tz-btn-dark-bg: #E9F0F2;    --tz-btn-dark-fg: #0B1F2A;
}