/**
 * Teton Troutfitters — Design Tokens
 *
 * CSS custom properties only. No element-targeting rules.
 *
 * CANONICAL SOURCE OF TRUTH for brand color + typography.
 * The block theme's theme.json palette mirrors these values — if you
 * change a brand color here, update theme.json to match.
 *
 * Brand system: NAVY / GOLD / CREAM (adopted 2026-07-07).
 * Legacy teal token NAMES (--tt-teal, --tt-teal-dark, ...) are retained
 * so existing token-driven pages keep working, but they now resolve to
 * the Navy brand roles, unifying every page onto one palette.
 */

:root {
	/* ── Brand — Navy (primary) ──────────────────────────── */
	--tt-navy:          #0B1A2C;   /* primary dark — hero/section bg, headings */
	--tt-navy-mid:      #142236;
	--tt-navy-dark:     #070F1A;

	/* ── Brand — Gold (accent) ───────────────────────────── */
	--tt-gold:          #C49A3C;
	--tt-gold-hover:    #D4A94E;
	--tt-gold-light:    #D4A94E;

	/* ── Brand — Teal (secondary accent) ─────────────────── */
	--tt-teal-accent:       #2B7A6F;
	--tt-teal-accent-light: #3A9B8E;

	/* ── Legacy teal token names → mapped to Navy roles ──── */
	--tt-teal:          var(--tt-navy);        /* was #2a4a52 (primary) → navy */
	--tt-teal-light:    var(--tt-teal-accent); /* was #3a6a75 (light accent) → teal-accent */
	--tt-teal-dark:     var(--tt-navy-dark);   /* was #1e3a40 (darkest) → navy-dark */

	/* ── Surfaces & Neutrals ─────────────────────────────── */
	--tt-white:         #ffffff;
	--tt-page-bg:       #F7F4EF;
	--tt-section-bg:    #EFECE6;
	--tt-cream:         #F2EDE2;
	--tt-cream-dark:    #E8E4DC;
	--tt-cream-dim:     rgba(242, 237, 226, 0.55);   /* was undefined (latent bug) */
	--tt-text:          #1a1a18;
	--tt-text-muted:    #7a7265;
	--tt-text-dark:     #3c3530;
	--tt-border:        rgba(196, 189, 178, 0.4);
	--tt-border-strong: rgba(196, 189, 178, 0.7);

	/* Colors — Status */
	--tt-success:       #29972e;
	--tt-success-bg:    #e6f4ea;
	--tt-info:          #1a6a8a;
	--tt-info-bg:       #e3f0f7;
	--tt-warning:       #bf6b00;
	--tt-warning-bg:    #fff8e1;
	--tt-error:         #c62828;
	--tt-error-bg:      #fdecea;

	/* ── Type Scale — Legacy (Major Third 1.25) ────────────
	   DEPRECATED: Use --tt-text-* tokens below for new work.
	   Retained for fishing-report and booking-card compat. */
	--tt-fs-xs:         0.8125rem;  /* 13px */
	--tt-fs-sm:         0.875rem;   /* 14px */
	--tt-fs-base:       1rem;       /* 16px */
	--tt-fs-md:         1.125rem;   /* 18px */
	--tt-fs-lg:         1.25rem;    /* 20px */
	--tt-fs-xl:         1.5625rem;  /* 25px */
	--tt-fs-2xl:        1.9375rem;  /* 31px */
	--tt-fs-3xl:        2.4375rem;  /* 39px */
	--tt-fs-4xl:        3.0625rem;  /* 49px */
	--tt-fs-5xl:        3.8125rem;  /* 61px */

	/* ── Type Scale — v2 Kit (Slathers / Cabin / Lora / Arial) ── */
	--tt-text-hero:     2.75rem;
	--tt-text-h1:       2.5rem;
	--tt-text-h2:       2rem;
	--tt-text-h2-card:  1.5rem;
	--tt-text-h3:       1.75rem;
	--tt-text-h3-sm:    0.9375rem;
	--tt-text-lead:     1.25rem;
	--tt-text-body:     0.875rem;
	--tt-text-card:     0.8125rem;
	--tt-text-quote:    1rem;
	--tt-text-stat:     0.9375rem;
	--tt-text-price:    1.375rem;
	--tt-text-price-sm: 1.3125rem;
	--tt-text-ui:       0.75rem;
	--tt-text-filter:   0.71875rem;
	--tt-text-spec:     0.875rem;
	--tt-text-tag:      0.625rem;
	--tt-text-eyebrow:  0.625rem;
	--tt-text-micro:    0.5625rem;
	--tt-text-legal:    0.6875rem;

	/* ── Font Weights ──────────────────────────────────── */
	--tt-weight-normal:   400;
	--tt-weight-semibold: 600;
	--tt-weight-bold:     700;

	/* ── Line Heights — v2 Kit ─────────────────────────── */
	--tt-lh-hero:    1.08;
	--tt-lh-h1:      1.1;
	--tt-lh-h2:      1.15;
	--tt-lh-heading: 1.2;
	--tt-lh-lead:    1.5;
	--tt-lh-quote:   1.65;
	--tt-lh-card:    1.65;
	--tt-lh-body:    1.8;
	--tt-lh-ui:      1.3;
	--tt-lh-micro:   1.4;

	/* ── Line Heights — Legacy aliases ─────────────────── */
	--tt-lh-tight:      1.15;
	--tt-lh-snug:       1.3;
	--tt-lh-normal:     1.5;
	--tt-lh-relaxed:    1.65;

	/* ── Letter Spacing ────────────────────────────────── */
	--tt-ls-hero:    -0.01em;
	--tt-ls-none:     normal;
	--tt-ls-filter:   0.04em;
	--tt-ls-tag:      0.05em;
	--tt-ls-btn-sec:  0.06em;
	--tt-ls-btn:      0.08em;
	--tt-ls-micro:    0.10em;
	--tt-ls-eyebrow:  0.12em;
	--tt-ls-legal:    0.01em;

	/* ── Font Families ─────────────────────────────────── */
	--tt-font-display:  'Slathers', Georgia, serif;
	--tt-font-heading:  'Cabin', Arial, sans-serif;
	--tt-font-body:     'Lora', Georgia, serif;
	--tt-font-sans:     Arial, Helvetica, sans-serif;

	/* Spacing Scale */
	--tt-space-xs:      0.25rem;
	--tt-space-sm:      0.5rem;
	--tt-space-md:      1rem;
	--tt-space-lg:      1.5rem;
	--tt-space-xl:      2rem;
	--tt-space-2xl:     3rem;
	--tt-space-3xl:     4rem;

	/* Border Radius */
	--tt-radius-sm:     4px;
	--tt-radius-md:     8px;
	--tt-radius-lg:     12px;

	/* Shadows */
	--tt-shadow-sm:     0 1px 3px rgba(0, 0, 0, 0.08);
	--tt-shadow-md:     0 4px 12px rgba(0, 0, 0, 0.1);
	--tt-shadow-lg:     0 8px 24px rgba(0, 0, 0, 0.12);
}
