/* LUMIADE brand tokens — "First Light" identity (2026-07-15, Task 6).
   Token NAMES are frozen from the prior clinical scheme so
   base/components/pdp/shop/cart/account CSS keep working untouched;
   VALUES now map onto Palette A. CTAs are --lum-accent (rose), NOT ink —
   ink is reserved for text/headings and dark chrome (header/footer/menus). */

:root {
	/* — Palette A "First Light" — single source of truth — */
	--lum-bg: #FBF8F3;             /* page background: warm ivory */
	--lum-surface: #FFFFFF;        /* cards/panels */
	--lum-soft: #F4E6DF;           /* soft section backgrounds: blush */
	--lum-ink: #33272A;            /* espresso: text, headings, dark chrome */
	--lum-accent: #B96A5F;         /* muted rose: CTAs/buttons */
	--lum-accent-hover: #A05348;   /* rose hover */
	--lum-gold: #C09A6B;           /* bronze: stars, sale price, badges only */
	--lum-font-display: 'Fraunces', Georgia, serif;
	--lum-font-text: 'Inter', system-ui, sans-serif;
}

:root {
	/* — Core palette (legacy names, remapped to Palette A) — */
	--lumiade-ink: var(--lum-ink);             /* text, headings, header/footer/menu chrome */
	--lumiade-navy: var(--lum-ink);            /* retired hue → ink (headings) */
	--lumiade-muted: #7C6C64;                  /* warm secondary text — AA on white at 14px+ */
	--lumiade-soft: var(--lum-soft);           /* section backgrounds — blush */
	--lumiade-paper: var(--lum-bg);            /* page background */
	--lumiade-warm: #EAD9C4;                   /* deeper warm beige-gold field (trust bar) */
	--lumiade-panel: var(--lum-surface);       /* card/panel fill */
	--lumiade-line: color-mix(in srgb, var(--lum-ink) 12%, transparent); /* hairline borders */
	--lumiade-sage: var(--lumiade-muted);      /* retired hue → secondary warm grey */
	--lumiade-clay: var(--lum-accent-hover);   /* semantic error/urgency brick — reuses accent-hover hue */
	--lumiade-gold: var(--lum-gold);           /* bronze accent — stars/badges ONLY, never buttons */
	--lumiade-ink-hover: color-mix(in srgb, var(--lum-ink) 88%, black 12%); /* darker-ink hover (non-CTA) */

	/* — Typography — */
	--lumiade-font-serif: var(--lum-font-display);
	--lumiade-font-sans: var(--lum-font-text);

	/* — Type scale (unchanged) — */
	--lumiade-fs-eyebrow: 13px;
	--lumiade-fs-sm: 15px;
	--lumiade-fs-base: 17px;
	--lumiade-fs-md: 19px;
	--lumiade-fs-lg: clamp(21px, 2vw, 25px);
	--lumiade-fs-xl: clamp(25px, 2.6vw, 31px);
	--lumiade-fs-2xl: clamp(29px, 3vw, 35px);
	--lumiade-fs-3xl: clamp(31px, 3.4vw, 43px);
	--lumiade-fs-display: clamp(42px, 4.4vw, 68px);

	/* — Spacing (unchanged, 8px rhythm) — */
	--lumiade-space-1: 4px;  --lumiade-space-2: 8px;  --lumiade-space-3: 12px; --lumiade-space-4: 16px;
	--lumiade-space-5: 24px; --lumiade-space-6: 32px; --lumiade-space-7: 48px; --lumiade-space-8: 64px;

	/* — Radius: unchanged from prior scheme (out of scope for Task 6 —
	   palette/logo/favicon only). Pills stay round. — */
	--lumiade-radius: 0px;
	--lumiade-radius-sm: 0px;
	--lumiade-radius-pill: 999px;

	/* — Layout (unchanged) — */
	--lumiade-page-gutter: max(42px, calc((100vw - 1300px) / 2 + 42px));

	/* — Blocksy + WP preset mappings (same slots the legacy :root declared).
	   Buttons map to --lum-accent here (theme-wide Woo/Blocksy buttons),
	   NOT --lumiade-ink — this is the primary site-wide CTA-color fix. — */
	--theme-palette-color-1: var(--lum-ink);
	--theme-palette-color-2: var(--lumiade-ink-hover);
	--theme-palette-color-3: var(--lumiade-muted);
	--theme-palette-color-4: var(--lum-ink);
	--theme-palette-color-5: var(--lumiade-line);
	--theme-palette-color-6: var(--lum-surface);
	--theme-palette-color-7: var(--lum-surface);
	--theme-palette-color-8: var(--lum-surface);
	--theme-text-color: var(--lum-ink);
	--theme-headings-color: var(--lum-ink);
	--theme-link-initial-color: var(--lum-ink);
	--theme-link-hover-color: var(--lumiade-muted);
	--theme-border-color: var(--lumiade-line);
	--theme-form-field-border-focus-color: var(--lum-ink);
	--theme-button-background-initial-color: var(--lum-accent);
	--theme-button-background-hover-color: var(--lum-accent-hover);
	--theme-button-text-initial-color: #ffffff;
	--theme-button-text-hover-color: #ffffff;
	--quantity-initial-color: rgba(51, 39, 42, 0.34);
	--quantity-hover-color: var(--lum-ink);
	--wp--preset--color--palette-color-1: var(--lum-ink);
	--wp--preset--color--palette-color-2: var(--lumiade-ink-hover);
	--wp--preset--color--palette-color-3: var(--lumiade-muted);
	--wp--preset--color--palette-color-4: var(--lum-ink);
	--wp--preset--color--palette-color-5: var(--lumiade-line);
	--wp--preset--color--palette-color-6: var(--lum-surface);
	--wp--preset--color--palette-color-7: var(--lum-surface);
	--wp--preset--color--palette-color-8: var(--lum-surface);
}

/* Supersedes the --theme remap in legacy ".lumiade-storefront" (Base typography
   section) — kept here so the remap survives when that legacy block is deleted.
   This class-scoped block has higher specificity than :root, so it is the one
   Blocksy's own CSS actually resolves against on storefront pages — the button
   colors below are the effective site-wide CTA fix, not the :root copies above. */
.lumiade-storefront {
	--theme-palette-color-1: var(--lum-ink);
	--theme-palette-color-2: var(--lumiade-ink-hover);
	--theme-link-initial-color: var(--lum-ink);
	--theme-link-hover-color: var(--lumiade-muted);
	--theme-button-background-initial-color: var(--lum-accent);
	--theme-button-background-hover-color: var(--lum-accent-hover);
	--theme-button-text-initial-color: #ffffff;
	--theme-button-text-hover-color: #ffffff;
	--quantity-initial-color: rgba(51, 39, 42, 0.34);
	--quantity-hover-color: var(--lum-ink);
}
