/* Family Finance design tokens — the only place colours are defined. Contrast ratios noted are on the
   surface each token is used on (WCAG AA needs 4.5:1 for text). */
@font-face { font-family: 'Cormorant Garamond'; src: url('/fonts/cormorant-garamond-latin-600-normal.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Cormorant Garamond'; src: url('/fonts/cormorant-garamond-latin-700-normal.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Cormorant Garamond'; src: url('/fonts/cormorant-garamond-latin-500-italic.woff2') format('woff2'); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: 'Figtree'; src: url('/fonts/figtree-latin-400-normal.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Figtree'; src: url('/fonts/figtree-latin-500-normal.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Figtree'; src: url('/fonts/figtree-latin-600-normal.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Figtree'; src: url('/fonts/figtree-latin-700-normal.woff2') format('woff2'); font-weight: 700; font-display: swap; }

:root {
  /* brand palette (as approved) */
  --midnight: #071A2B;
  --teal-deep: #0B3B3D;
  --teal: #155A57;
  --gold: #C6A15B;          /* decorative only on light surfaces (2.1:1 on parchment) */
  --gold-light: #E7CB87;
  --parchment: #F5F0E5;
  --ivory: #FFFCF5;
  --ink: #172A35;           /* 13.0:1 on parchment */
  --slate: #5B6770;         /* adjusted from #64717B for 5.1:1 */

  /* semantic tokens — light */
  --bg: var(--parchment);
  --surface: var(--ivory);
  --surface-2: #EFE8D8;
  --text: var(--ink);
  --text-muted: var(--slate);
  --heading: var(--teal-deep);
  --accent: var(--teal);
  --accent-contrast: #FFFFFF;
  --rule: #D9CBA8;
  --border: #DDD3BD;
  --ornament: var(--gold);
  --focus: #1B6F6A;
  --success: #2F6B45;       /* 5.6:1 */
  --warning: #8A5A0B;       /* text, 5.2:1 */
  --warning-bright: #B7791F;/* icons only */
  --error: #8E2C2C;         /* 8.1:1 */
  --success-bg: #E5F0E7; --warning-bg: #F6EBD3; --error-bg: #F5E1DE;
  --shadow: 0 1px 2px rgba(7, 26, 43, .06), 0 4px 16px rgba(7, 26, 43, .06);
  --chart-1: #155A57; --chart-2: #B07D2A; --chart-3: #3E5C8A; --chart-4: #8E2C2C; --chart-5: #6B4E8A; --chart-6: #4F7A3A;

  --font-head: 'Cormorant Garamond', 'Iowan Old Style', Georgia, serif;
  --font-body: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius: 12px; --radius-sm: 8px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #06111D; --surface: #102131; --surface-2: #0C1A28; --text: #F3EBD8; --text-muted: #B9B2A2;
    --heading: var(--gold-light); --accent: #6FC1B8; --accent-contrast: #06111D; --rule: #3A3420; --border: #22364A;
    --ornament: var(--gold); --focus: #8FD3CB; --success: #8FCB9F; --warning: #E9BE6A; --warning-bright: #E9BE6A; --error: #F0A39A;
    --success-bg: #12301F; --warning-bg: #33280F; --error-bg: #3A1716; --shadow: 0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25);
    --chart-1: #6FC1B8; --chart-2: #E7CB87; --chart-3: #8DA9D8; --chart-4: #F0A39A; --chart-5: #C3A6E0; --chart-6: #A6CF8D;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #06111D; --surface: #102131; --surface-2: #0C1A28; --text: #F3EBD8; --text-muted: #B9B2A2;
  --heading: var(--gold-light); --accent: #6FC1B8; --accent-contrast: #06111D; --rule: #3A3420; --border: #22364A;
  --ornament: var(--gold); --focus: #8FD3CB; --success: #8FCB9F; --warning: #E9BE6A; --warning-bright: #E9BE6A; --error: #F0A39A;
  --success-bg: #12301F; --warning-bg: #33280F; --error-bg: #3A1716; --shadow: 0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25);
  --chart-1: #6FC1B8; --chart-2: #E7CB87; --chart-3: #8DA9D8; --chart-4: #F0A39A; --chart-5: #C3A6E0; --chart-6: #A6CF8D;
  color-scheme: dark;
}