/* ------------------------------------------------------------------
   Ektaseb / Woodmart Child — Design Tokens
   Loaded on every page. Keeps colors, radii, shadows, and ring values
   in a single source of truth, and declares the @layer order used by
   the rest of the child theme styles.
------------------------------------------------------------------- */

@layer tokens, base, components, utilities, overrides;

@layer tokens {
	:root {
		--ek-color-primary: #ce673b;
		--ek-color-primary-dark: #ad5a30;
		--ek-color-secondary: #fbbc34;
		--ek-color-bg: #f8fafc;
		--ek-color-surface: #ffffff;
		--ek-color-heading: #1f2937;
		--ek-color-text: #4b5563;
		--ek-color-muted: #6b7280;
		--ek-color-border: #e5e7eb;
		--ek-color-primary-soft: rgba(206, 103, 59, 0.08);
		--ek-color-primary-ring: rgba(206, 103, 59, 0.18);
		--ek-color-primary-glow: rgba(206, 103, 59, 0.28);

		--ek-radius-sm: 8px;
		--ek-radius-md: 12px;

		--ek-shadow-sm: 0 8px 22px rgba(15, 23, 42, 0.08);
		--ek-shadow-md: 0 14px 30px rgba(15, 23, 42, 0.12);
		--ek-shadow-cta: 0 6px 16px var(--ek-color-primary-glow);
		--ek-shadow-stat: 0 10px 20px rgba(206, 103, 59, 0.12);

		--ek-ring: 0 0 0 3px var(--ek-color-primary-ring);

		/* Bridge to Woodmart variables so theme components pick up our palette */
		--wd-primary-color: var(--ek-color-primary);
		--wd-alternative-color: var(--ek-color-secondary);
	}
}