/* ==========================================================================
   9WEB STARTER THEME — DESIGN TOKEN ALIASES
   theme.json is the single source of truth for all token VALUES
   (edit values there, and in Site Editor > Styles — never here).
   This file only maps WordPress's generated custom properties to the
   --9w-* naming convention so component CSS/JS/patterns have one
   stable, predictable API regardless of how WordPress names things
   internally. Do not hard-code raw values in this file.
   ========================================================================== */

:root {
	/* ---- Color ---------------------------------------------------- */
	--9w-color-primary: var(--wp--preset--color--primary);
	--9w-color-secondary: var(--wp--preset--color--secondary);
	--9w-color-accent: var(--wp--preset--color--accent);
	--9w-color-background: var(--wp--preset--color--background);
	--9w-color-surface: var(--wp--preset--color--surface);
	--9w-color-text: var(--wp--preset--color--text);
	--9w-color-muted: var(--wp--preset--color--muted);
	--9w-color-border: var(--wp--preset--color--border);

	/* ---- Typography ------------------------------------------------ */
	--9w-font-display: var(--wp--preset--font-family--display);
	--9w-font-heading: var(--wp--preset--font-family--heading);
	--9w-font-body: var(--wp--preset--font-family--body);
	--9w-font-mono: var(--wp--preset--font-family--mono);

	--9w-text-xs: var(--wp--preset--font-size--xs);
	--9w-text-sm: var(--wp--preset--font-size--sm);
	--9w-text-base: var(--wp--preset--font-size--base);
	--9w-text-lg: var(--wp--preset--font-size--lg);
	--9w-text-xl: var(--wp--preset--font-size--xl);
	--9w-text-2xl: var(--wp--preset--font-size--2xl);
	--9w-text-3xl: var(--wp--preset--font-size--3xl);
	--9w-text-4xl: var(--wp--preset--font-size--4xl);
	--9w-text-5xl: var(--wp--preset--font-size--5xl);
	--9w-text-6xl: var(--wp--preset--font-size--6xl);
	--9w-text-display: var(--wp--preset--font-size--display);

	/* ---- Spacing ----------------------------------------------------- */
	--9w-space-1: var(--wp--preset--spacing--1);
	--9w-space-2: var(--wp--preset--spacing--2);
	--9w-space-3: var(--wp--preset--spacing--3);
	--9w-space-4: var(--wp--preset--spacing--4);
	--9w-space-5: var(--wp--preset--spacing--5);
	--9w-space-6: var(--wp--preset--spacing--6);
	--9w-space-8: var(--wp--preset--spacing--8);
	--9w-space-10: var(--wp--preset--spacing--10);
	--9w-space-12: var(--wp--preset--spacing--12);
	--9w-space-16: var(--wp--preset--spacing--16);
	--9w-space-20: var(--wp--preset--spacing--20);
	--9w-space-24: var(--wp--preset--spacing--24);
	--9w-space-32: var(--wp--preset--spacing--32);

	/* ---- Radius ------------------------------------------------------ */
	--9w-radius-sm: var(--wp--custom--radius--sm);
	--9w-radius-md: var(--wp--custom--radius--md);
	--9w-radius-lg: var(--wp--custom--radius--lg);
	--9w-radius-xl: var(--wp--custom--radius--xl);
	--9w-radius-pill: var(--wp--custom--radius--pill);

	/* ---- Shadow ------------------------------------------------------ */
	--9w-shadow-sm: var(--wp--custom--shadow--sm);
	--9w-shadow-md: var(--wp--custom--shadow--md);
	--9w-shadow-lg: var(--wp--custom--shadow--lg);
	--9w-shadow-xl: var(--wp--custom--shadow--xl);

	/* ---- Font weight (Phase 6) --------------------------------------- */
	--9w-font-weight-regular: var(--wp--custom--font-weight--regular);
	--9w-font-weight-medium: var(--wp--custom--font-weight--medium);
	--9w-font-weight-semibold: var(--wp--custom--font-weight--semibold);
	--9w-font-weight-bold: var(--wp--custom--font-weight--bold);

	/* ---- Container -------------------------------------------------------
	   lg/wide are intentionally NOT duplicated in settings.custom.container
	   — they alias WordPress's own layout.contentSize/wideSize globals
	   directly, so there is exactly one source of truth for those two
	   values. See docs/DECISIONS.md #7. ------------------------------- */
	--9w-container-sm: var(--wp--custom--container--sm);
	--9w-container-md: var(--wp--custom--container--md);
	--9w-container-lg: var(--wp--style--global--content-size);
	--9w-container-xl: var(--wp--custom--container--xl);
	--9w-container-wide: var(--wp--style--global--wide-size);
	--9w-prose-max-width: var(--wp--custom--prose--max-width);

	/* ---- Z-Index (controlled hierarchy — do not add ad-hoc values elsewhere) - */
	--9w-z-base: var(--wp--custom--z-index--base);
	--9w-z-dropdown: var(--wp--custom--z-index--dropdown);
	--9w-z-sticky: var(--wp--custom--z-index--sticky);
	--9w-z-header: var(--wp--custom--z-index--header);
	--9w-z-overlay: var(--wp--custom--z-index--overlay);
	--9w-z-modal: var(--wp--custom--z-index--modal);
	--9w-z-toast: var(--wp--custom--z-index--toast);
	--9w-z-tooltip: var(--wp--custom--z-index--tooltip);
}