:root {
	/* Brand accents — WhatsApp action green & high-trust neutral ink */
	--wa-green: #25D366;
	--wa-green-dark: #1DA851;
	--wa-green-hover: #128C7E;
	--wa-green-light: #DCFCE7;
	--wa-ink: #0F172A;
	--wa-ink-soft: #475569;
	--wa-ink-muted: #64748B;
	--wa-surface: #FFFFFF;
	--wa-surface-alt: #F8FAFC;
	--wa-surface-subtle: #F1F5F9;
	--wa-border: #E2E8F0;
	--wa-border-dark: #CBD5E1;
	--wa-danger: #DC2626;
	--wa-danger-bg: #FEF2F2;

	/* Layered shadows for true depth */
	--wa-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
	--wa-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.04);
	--wa-shadow-md: 0 4px 14px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
	--wa-shadow-lg: 0 16px 36px rgba(15, 23, 42, 0.14), 0 4px 12px rgba(15, 23, 42, 0.06);
	--wa-shadow-xl: 0 24px 48px -12px rgba(15, 23, 42, 0.22);
	--wa-shadow-btn: 0 4px 14px rgba(37, 211, 102, 0.35);
	--wa-shadow-btn-hover: 0 6px 20px rgba(37, 211, 102, 0.45);

	/* Radius scale */
	--wa-radius-sm: 6px;
	--wa-radius-md: 10px;
	--wa-radius-lg: 16px;
	--wa-radius-xl: 22px;
	--wa-radius-pill: 999px;

	/* Smooth Shopify-like motion */
	--wa-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--wa-duration-fast: 160ms;
	--wa-duration-base: 240ms;
	--wa-duration-slow: 360ms;

	--wa-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, Helvetica, Arial, sans-serif;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--wa-duration-fast: 0ms;
		--wa-duration-base: 0ms;
		--wa-duration-slow: 0ms;
	}
}