/**
 * MaVitamine design tokens.
 *
 * Components consume these values and never carry their own colour palette.
 * Silo colours remain supplied by mavitamine-core at runtime.
 */

:root {
	/* Semantic ------------------------------------------------------- */
	--mv-success: oklch(0.54 0.15 151);
	--mv-warning: oklch(0.62 0.15 66);
	--mv-danger: oklch(0.55 0.17 24);
	--mv-info: oklch(0.56 0.16 254);

	/* Evidence levels ------------------------------------------------ */
	--mv-evidence-low: oklch(0.65 0.02 236);
	--mv-evidence-limited: oklch(0.72 0.14 73);
	--mv-evidence-moderate: oklch(0.61 0.13 251);
	--mv-evidence-strong: oklch(0.54 0.15 151);

	/* Typography ----------------------------------------------------- */
	--mv-font-heading: "Figtree", system-ui, sans-serif;
	--mv-font-body: "Figtree", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--mv-reading: 72ch;

	/* Layout --------------------------------------------------------- */
	--mv-container: 1680px;
	--mv-container-wide: 1920px;
	--mv-content-reading: 820px;
	--mv-gutter: clamp(16px, 3.6vw, 64px);
	--mv-section-space: clamp(48px, 4.5vw, 76px);

	/* Spacing scale -------------------------------------------------- */
	--mv-space-1: 4px;
	--mv-space-2: 8px;
	--mv-space-3: 12px;
	--mv-space-4: 16px;
	--mv-space-5: 24px;
	--mv-space-6: 32px;
	--mv-space-7: 48px;
	--mv-space-8: 64px;
	--mv-space-9: 96px;

	/* Radii ---------------------------------------------------------- */
	--mv-radius-xs: 6px;
	--mv-radius-sm: 10px;
	--mv-radius-md: 18px;
	--mv-radius-lg: 30px;
	--mv-radius-xl: 44px;
	--mv-radius-pill: 999px;

	/* Brand surfaces ------------------------------------------------- */
	--mv-brand: oklch(0.52 0.15 153);
	--mv-brand-deep: oklch(0.38 0.12 153);
	--mv-ink: oklch(0.23 0.055 246);
	--mv-ink-deep: oklch(0.16 0.04 236);
	--mv-paper: oklch(0.97 0.015 83);
	--mv-on-dark: oklch(0.96 0.008 145);
	--mv-on-dark-muted: oklch(0.81 0.02 220);
	--mv-overlay-soft: oklch(0.12 0.035 236 / 0.42);
	--mv-overlay-strong: oklch(0.12 0.035 236 / 0.94);
	--mv-white-08: oklch(0.98 0.004 145 / 0.08);
	--mv-white-12: oklch(0.98 0.004 145 / 0.12);
	--mv-white-20: oklch(0.98 0.004 145 / 0.2);

	/* Focus ---------------------------------------------------------- */
	--mv-focus: oklch(0.64 0.16 252);
	--mv-focus-offset: 3px;

	/* Silo fallback -------------------------------------------------- */
	--mv-silo: var(--mv-brand);
	--mv-silo-text: var(--mv-brand-deep);
	--mv-silo-fill: var(--mv-brand-deep);
	--mv-silo-contrast: var(--mv-on-dark);
	--mv-silo-nav: var(--mv-brand-deep);
	--mv-silo-nav-hover: color-mix(in srgb, var(--mv-silo-nav) 88%, var(--mv-ink-deep));
	--mv-silo-nav-contrast: var(--mv-on-dark);
	--mv-silo-soft: color-mix(in srgb, var(--mv-brand) 10%, transparent);
	--mv-silo-line: color-mix(in srgb, var(--mv-brand) 28%, transparent);

	/* Motion --------------------------------------------------------- */
	--mv-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--mv-dur: 240ms;
	--mv-dur-slow: 620ms;
}

:root,
[data-theme="light"] {
	--mv-bg: oklch(0.985 0.006 145);
	--mv-bg-soft: oklch(0.962 0.012 145);
	--mv-surface: oklch(0.995 0.004 145);
	--mv-surface-raised: oklch(0.999 0.003 145);
	--mv-text: oklch(0.25 0.05 246);
	--mv-text-muted: oklch(0.49 0.03 235);
	--mv-border: oklch(0.9 0.015 155);
	--mv-border-strong: oklch(0.82 0.025 155);
	--mv-shadow: 0 24px 70px oklch(0.22 0.045 238 / 0.12);
	--mv-shadow-sm: 0 8px 26px oklch(0.22 0.045 238 / 0.08);
	--mv-header-bg: oklch(0.995 0.004 145 / 0.96);
	--mv-footer-bg: oklch(0.18 0.045 238);
	--mv-footer-deep: oklch(0.145 0.035 238);
	--mv-footer-text: oklch(0.96 0.008 145);
	--mv-footer-muted: oklch(0.76 0.025 226);
	--mv-footer-line: oklch(0.96 0.008 145 / 0.12);
	--mv-interactive-hover: var(--mv-bg-soft);
	--mv-search-bg: var(--mv-surface-raised);
	--mv-search-border: var(--mv-border-strong);
	--mv-search-button: var(--mv-brand-deep);
	--mv-search-button-hover: color-mix(in srgb, var(--mv-brand-deep) 86%, var(--mv-ink-deep));
	--mv-search-ring: color-mix(in srgb, var(--mv-brand) 18%, transparent);
	--mv-hero-accent: var(--mv-brand-deep);
	color-scheme: light;
}

[data-theme="dark"] {
	--mv-bg: #000914;
	--mv-bg-soft: #000914;
	--mv-surface: #000914;
	--mv-surface-raised: #020b15;
	--mv-brand-light: #0F0;
	--mv-text: oklch(0.955 0.009 145);
	--mv-text-muted: oklch(0.76 0.025 226);
	--mv-border: oklch(0.34 0.035 231);
	--mv-border-strong: oklch(0.43 0.04 229);
	--mv-shadow: 0 28px 78px oklch(0.07 0.02 236 / 0.5);
	--mv-shadow-sm: 0 9px 30px oklch(0.07 0.02 236 / 0.34);
	--mv-header-bg: rgb(0 9 20 / 0.97);
	--mv-footer-bg: #020b15;
	--mv-footer-deep: #000914;
	--mv-footer-text: oklch(0.96 0.008 145);
	--mv-footer-muted: oklch(0.73 0.025 226);
	--mv-footer-line: oklch(0.96 0.008 145 / 0.1);
	--mv-interactive-hover: #052418;
	--mv-search-bg: #020b15;
	--mv-search-border: #243546;
	--mv-search-button: #075f35;
	--mv-search-button-hover: #0F0;
	--mv-search-ring: rgb(0 255 0 / 0.28);
	--mv-hero-accent: #0F0;
	--mv-focus: #0F0;
	color-scheme: dark;
}