:root {
	--spectra-neutral-7: #1A2456;
	--spectra-neutral-5: #454B66;
	--spectra-neutral-4: #E8E4DC;
	--spectra-neutral-2: #0E1433;
	--spectra-neutral-1: #FAFAF7;
	--spectra-neutral-0: #FFFFFF;
	--spectra-primary: #8C6418;
	--spectra-secondary: #D4A24C;
	--spectra-accent: #000000;
	--spectra-success: #10b981;
	--spectra-error: #ef4444;
	--spectra-info: #8b5cf6;
	--spectra-warning: #d97706;
	--spectra-foreground: #ffffff;
	--spectra-white: #ffffff;
	--spectra-transparent: transparent;

	/* Style Guide WP preset color vars */
	--wp--preset--color--sg-accent: #000000;
	--wp--preset--color--sg-heading: #1A2456;
	--wp--preset--color--sg-body: #454B66;
	--wp--preset--color--sg-surface: #FAFAF7;
	--wp--preset--color--sg-background: #FFFFFF;
	--wp--preset--color--sg-border: #0E1433;
	--wp--preset--color--sg-muted: #E8E4DC;
}

:root {
	--color--primary: var(--wp--preset--color--primary);
	--color--primary-near-white: var(--spectra-primary);
	--color--primary-lightest: var(--spectra-primary);
	--color--primary-lighter: var(--spectra-primary);
	--color--primary-light: var(--spectra-primary);
	--color--primary-dark: var(--spectra-primary);
	--color--primary-darker: var(--spectra-primary);
	--color--primary-darkest: var(--spectra-primary);
	--color--primary-near-black: var(--spectra-primary);
	--color--primary-complement: var(--spectra-primary);
	--color--primary-inverted: var(--spectra-neutral-7);
	--color--secondary: var(--wp--preset--color--secondary);
	--color--secondary-near-white: var(--spectra-secondary);
	--color--secondary-lightest: var(--spectra-secondary);
	--color--secondary-lighter: var(--spectra-secondary);
	--color--secondary-light: var(--spectra-secondary);
	--color--secondary-dark: var(--spectra-secondary);
	--color--secondary-darker: var(--spectra-secondary);
	--color--secondary-darkest: var(--spectra-secondary);
	--color--secondary-near-black: var(--spectra-secondary);
	--color--secondary-complement: var(--spectra-secondary);
	--color--secondary-inverted: var(--spectra-neutral-7);
	--color--base: var(--spectra-neutral-4);
	--color--base-near-white: var(--spectra-neutral-7);
	--color--base-lightest: var(--spectra-neutral-7);
	--color--base-lighter: var(--spectra-neutral-5);
	--color--base-light: var(--spectra-neutral-5);
	--color--base-dark: var(--spectra-neutral-2);
	--color--base-darker: var(--spectra-neutral-2);
	--color--base-darkest: var(--spectra-neutral-1);
	--color--base-near-black: var(--spectra-neutral-0);
	--color--accent: var(--wp--preset--color--accent);
	--color--heading: var(--wp--preset--color--heading);
	--color--body: var(--wp--preset--color--body);
	--color--background: var(--wp--preset--color--background);
	--color--surface: var(--wp--preset--color--surface);
	--color--outline: var(--wp--preset--color--outline);
	--color--foreground: var(--wp--preset--color--foreground);
	--color--success: var(--wp--preset--color--success);
	--color--error: var(--wp--preset--color--error);
	--color--info: var(--wp--preset--color--info);
	--color--warning: var(--wp--preset--color--warning);
	--space--xs: var(--spectra-space-xs);
	--space--sm: var(--spectra-space-sm);
	--space--md: var(--spectra-space-md);
	--space--lg: var(--spectra-space-lg);
	--space--xl: var(--spectra-space-xl);
	--space--xxl: var(--spectra-space-2xl);
	--text--xs: var(--spectra-text-xs);
	--text--sm: var(--spectra-text-sm);
	--text--md: var(--spectra-text-md);
	--text--lg: var(--spectra-text-lg);
	--text--xl: var(--spectra-text-xl);
	--text--xxl: var(--spectra-text-2xl);
	--heading--1: var(--spectra-heading-1);
	--heading--2: var(--spectra-heading-2);
	--heading--3: var(--spectra-heading-3);
	--heading--4: var(--spectra-heading-4);
	--heading--5: var(--spectra-heading-5);
	--heading--6: var(--spectra-heading-6);
}