/*
 * Vida Aromatica Design Tokens — single visual source of truth.
 *
 * Kadence Global Palette is authoritative. The child theme never invents a
 * second brand palette: it only exposes semantic --va-* aliases so custom
 * components, WooCommerce and future modules consume the same Kadence colors.
 *
 * Mapping:
 * 1 accent / primary action
 * 2 accent dark / hover
 * 3 primary text
 * 4 secondary text
 * 5 muted text
 * 6 strong border
 * 7 standard border
 * 8 soft section background
 * 9 page / surface background
 */

html:root {
	/*
	 * Brand colours: aliases to Kadence. Hex values are fallbacks only for a
	 * context where Kadence variables are unexpectedly unavailable.
	 */
	--va-accent: var(--global-palette1, #b7df38);
	--va-accent-bright: var(--global-palette1, #b7df38);
	--va-accent-dark: var(--global-palette2, #263a25);
	--va-text: var(--global-palette3, #1d211c);
	--va-text-secondary: var(--global-palette4, #596157);
	--va-text-muted: var(--global-palette5, #8b9187);
	--va-border-strong: var(--global-palette6, #c8d0c4);
	--va-border: var(--global-palette7, #e3e7e1);
	--va-bg-soft: var(--global-palette8, #f7f8f5);
	--va-bg-muted: var(--global-palette8, #f7f8f5);
	--va-bg: var(--global-palette9, #ffffff);
	--va-surface: var(--global-palette9, #ffffff);
	--va-surface-soft: var(--global-palette8, #f7f8f5);

	/* Derived states. */
	--va-accent-pale: color-mix(in srgb, var(--va-accent) 18%, var(--va-surface));
	--va-on-accent: var(--va-text);
	--va-on-dark: var(--va-surface);
	--va-focus-ring: var(--va-accent-dark);

	/* Typography. */
	--va-font-heading: 'Libre Baskerville', Georgia, 'Times New Roman', serif;
	--va-font-display: var(--va-font-heading);
	--va-font-serif: var(--va-font-heading);
	--va-font-body: 'Inter', 'Segoe UI', Arial, sans-serif;

	--va-text-xs: 0.8125rem;
	--va-text-sm: 0.875rem;
	--va-text-base: 1rem;
	--va-text-lg: 1.125rem;
	--va-text-xl: clamp(1.25rem, 1.19rem + 0.2vw, 1.375rem);
	--va-text-2xl: clamp(1.625rem, 1.5rem + 0.35vw, 1.875rem);
	--va-text-3xl: clamp(1.875rem, 1.7rem + 0.5vw, 2.25rem);

	/* Spacing. */
	--va-space-1: 0.25rem;
	--va-space-2: 0.5rem;
	--va-space-3: 0.75rem;
	--va-space-4: 1rem;
	--va-space-5: 1.5rem;
	--va-space-6: 2rem;
	--va-space-7: 3rem;
	--va-space-8: 4.5rem;
	--va-space-9: 7rem;

	/* Geometry. */
	--va-radius-sm: 2px;
	--va-radius-md: 4px;
	--va-radius-lg: 8px;
	--va-container: 1180px;
	--va-content: 800px;

	/* Motion. */
	--va-transition-fast: 150ms ease;
	--va-transition: 240ms ease;
	--va-transition-slow: 420ms ease;
}
