/*
 * Design tokeny obchodu i adminu. Barevný motiv vybírá shop.brand.theme (atribut data-theme na <html>):
 *   paper – neutrální papír a inkoust (výchozí), sage – šalvějová zelená, clay – terakota, ink – tmavý.
 * Komponenty používají jen tyhle proměnné, žádné přímé barvy. Kontrast textu ≥ 4.5:1 ve všech motivech.
 */

:root {
	--font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	--font-display: 'Fraunces', Georgia, 'Times New Roman', serif;

	--text-xs: 0.8125rem;
	--text-sm: 0.9375rem;
	--text-base: 1rem;
	--text-lg: 1.125rem;
	--text-xl: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
	--text-2xl: clamp(1.6rem, 1.3rem + 1.2vw, 2.25rem);
	--text-3xl: clamp(2.1rem, 1.5rem + 2.6vw, 3.6rem);

	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.5rem;
	--space-6: 2rem;
	--space-7: 3rem;
	--space-8: 4.5rem;
	--space-9: 6.5rem;

	--radius-sm: 8px;
	--radius: 14px;
	--radius-lg: 22px;
	--radius-pill: 999px;

	--container: 1180px;
	--gutter: clamp(1rem, 0.6rem + 2vw, 2rem);
	--header-h: 68px;

	--ease-out: cubic-bezier(0.22, 0.7, 0.2, 1);
	--dur-fast: 160ms;
	--dur: 240ms;

	--focus: #2d5bd7;
	--danger: #b3261e;
	--danger-soft: #fbeae8;
	--success: #2c6a4c;
	--success-soft: #e5f2ea;
	--warning: #8a5a00;
	--warning-soft: #fbf1dc;
}

:root,
[data-theme='paper'] {
	--bg: #f6f3ec;
	--surface: #fffdf8;
	--surface-2: #efeadf;
	--ink: #1d1b17;
	--muted: #5c574e;
	--line: #e0d9ca;
	--line-strong: #c9c0ad;
	--accent: #1d1b17;
	--accent-hover: #3a362f;
	--on-accent: #fffdf8;
	--accent-soft: #e8e1d2;
	--highlight: #a24a26;
	--shadow-sm: 0 1px 2px rgb(29 27 23 / 6%), 0 2px 8px rgb(29 27 23 / 5%);
	--shadow: 0 10px 30px rgb(29 27 23 / 9%), 0 2px 6px rgb(29 27 23 / 5%);
	color-scheme: light;
}

[data-theme='sage'] {
	--bg: #f3f5ef;
	--surface: #fdfefb;
	--surface-2: #e7ece2;
	--ink: #18211b;
	--muted: #4f5c53;
	--line: #d7ded3;
	--line-strong: #bcc7b8;
	--accent: #355f48;
	--accent-hover: #2a4d3a;
	--on-accent: #ffffff;
	--accent-soft: #dfe9e0;
	--highlight: #355f48;
}

[data-theme='clay'] {
	--bg: #f8f2ec;
	--surface: #fffcf9;
	--surface-2: #f1e5da;
	--ink: #24180f;
	--muted: #63554a;
	--line: #e7d7c8;
	--line-strong: #d3bba5;
	--accent: #9c4123;
	--accent-hover: #7f341c;
	--on-accent: #ffffff;
	--accent-soft: #f3dfd3;
	--highlight: #9c4123;
}

[data-theme='ink'] {
	--bg: #141518;
	--surface: #1c1e22;
	--surface-2: #25282d;
	--ink: #f1eee7;
	--muted: #b3ada2;
	--line: #34373d;
	--line-strong: #4a4e56;
	--accent: #e9c77b;
	--accent-hover: #f3d697;
	--on-accent: #17181b;
	--accent-soft: #33302a;
	--highlight: #e9c77b;
	--focus: #8fb0ff;
	--danger: #ff8a80;
	--danger-soft: #3a2220;
	--success: #8fd3ae;
	--success-soft: #1f3329;
	--warning: #f0c36a;
	--warning-soft: #3a3020;
	--shadow-sm: 0 1px 2px rgb(0 0 0 / 30%);
	--shadow: 0 12px 34px rgb(0 0 0 / 38%);
	color-scheme: dark;
}