/**
 * Dark Mode Support
 * Automatically switches colors based on user's system preference.
 * Overrides semantic tokens using the same --slate-* ramp vars as .is-style-dark.
 */

@media (prefers-color-scheme: dark) {
	:root {
		/* Semantic token overrides */
		--background: var(--slate-950);
		--foreground: var(--slate-50);
		--card: var(--slate-950);
		--card-foreground: var(--slate-50);
		--primary: var(--slate-50);
		--primary-foreground: var(--slate-900);
		--secondary: var(--slate-900);
		--secondary-foreground: var(--slate-50);
		--muted: var(--slate-900);
		--muted-foreground: var(--slate-400);
		--accent: var(--slate-900);
		--accent-foreground: var(--slate-50);
		--destructive: var(--red-900);
		--destructive-foreground: var(--slate-50);
		--border: var(--slate-800);
		--ring: var(--slate-300);

		/* WordPress bridge */
		--wp--preset--color--background: var(--background);
		--wp--preset--color--foreground: var(--foreground);
		--wp--preset--color--card: var(--card);
		--wp--preset--color--card-foreground: var(--card-foreground);
		--wp--preset--color--primary: var(--primary);
		--wp--preset--color--primary-foreground: var(--primary-foreground);
		--wp--preset--color--secondary: var(--secondary);
		--wp--preset--color--secondary-foreground: var(--secondary-foreground);
		--wp--preset--color--muted: var(--muted);
		--wp--preset--color--muted-foreground: var(--muted-foreground);
		--wp--preset--color--accent: var(--accent);
		--wp--preset--color--accent-foreground: var(--accent-foreground);
		--wp--preset--color--destructive: var(--destructive);
		--wp--preset--color--destructive-foreground: var(--destructive-foreground);
		--wp--preset--color--border: var(--border);
		--wp--preset--color--ring: var(--ring);
	}
}