/* /_shared/css/tokens.css
 * Design tokens · single source of truth for color, type, spacing, layout.
 * Applied to :root so every component references the same values.
 */

:root {
    /* ─── Palette · parchment, ink, terracotta — the 4Lyf voice ─── */
    --parchment:        #f5ecd9;
    --parchment-soft:   #ede2c9;
    --parchment-deep:   #e5d7b5;
    --ink:              #3d2817;
    --ink-soft:         #5c4632;
    --ink-muted:        #8b7355;
    --terracotta:       #a8563a;
    --terracotta-deep:  #8b4329;
    --ochre:            #c9934c;
    --sage:             #7a8566;
    --rule:             #c9b896;
    --rule-soft:        #e5dcc9;

    /* Semantic */
    --color-success:    #4a8e5c;
    --color-warning:    #e07a2e;
    --color-danger:     #c25a5a;

    /* ─── Chakra palette · used by consent-v2 + ceremony surfaces ───
       Promoted to tokens.css so consent-v2.css references one source of truth.
       Each colour has a one-line WCAG-compliant body-text companion documented
       inline · use the *-on-paper variant when overlaying these on parchment. */
    --c-root:           #A8453A;   /* root chakra · contrast 5.5:1 on paper */
    --c-sacral:         #C77A4B;   /* sacral · contrast 3.8:1 on paper (LARGE TEXT ONLY) */
    --c-solar:          #C99C42;   /* solar · contrast 2.9:1 on paper (UI elements only) */
    --c-heart:          #4A7E5C;   /* heart · contrast 5.4:1 on paper */
    --c-throat:         #406B86;   /* throat · contrast 6.5:1 on paper */
    --c-indigo:         #4A4E80;   /* indigo · contrast 8.7:1 on paper */
    --c-crown:          #6B4E80;   /* crown · contrast 6.8:1 on paper */
    --c-gold:           #BA7517;   /* gold accent · contrast 4.7:1 on paper */
    --c-gold-deep:      #a06513;   /* gold hover/active state */
    --c-gold-bg:        #FAEEDA;   /* gold-tinted background fill */

    /* ─── Surfaces · neutrals for the consent flow ─── */
    --paper:            #FFFFFF;   /* pure white · highest-contrast surface */
    --parchment-2:      #FAF7F2;   /* warm paper · consent form bg */
    --parchment-3:      #F2EDE3;   /* deeper parchment · subtle layer */
    --ink-2:            #2A2622;   /* near-black · primary text */
    --ink-soft-2:       #5A524A;   /* secondary text · 7.6:1 on paper */
    --ink-faint:        #9A8F82;   /* tertiary · UI hints only · 3:1 NEVER body text */
    --hair:             #E5DCC9;   /* hairline */
    --hair-strong:      #D4C9B0;   /* stronger hairline */

    /* ─── Type ─── */
    --font-display:     'Cormorant Garamond', Georgia, 'Iowan Old Style', serif;
    --font-body:        'Newsreader', 'Iowan Old Style', Georgia, serif;
    --font-mono:        'JetBrains Mono', 'Courier New', monospace;

    --fs-xs:   12px;
    --fs-sm:   14px;
    --fs-base: 16px;
    --fs-md:   17px;
    --fs-lg:   1.15rem;
    --fs-xl:   1.5rem;
    --fs-h2:   1.7rem;
    --fs-h1:   2.6rem;

    --ls-mono: 0.18em;

    /* ─── Spacing ─── */
    --gap-xs: 6px;
    --gap-sm: 12px;
    --gap-md: 18px;
    --gap-lg: 28px;
    --gap-xl: 40px;

    /* ─── Borders / radii ─── */
    --r-sm: 4px;
    --r-md: 6px;
    --r-lg: 12px;
    --r-pill: 999px;

    /* ─── Layout ─── */
    --vessel-narrow: 560px;
    --vessel-mid:    760px;
    --vessel-wide:   980px;

    /* ─── Transition ─── */
    --t-fast: 0.15s;
}
