/**
 * Blogger Autopilot v1.5.0 Design Tokens (Light default, Dark on request, Logical RTL/LTR, WCAG 2.2 AA Contrast).
 *
 * Defaults: Light theme (matches the 2D flat portal design).
 * Dark mode applied via @media or [data-theme="dark"].
 */

/* ── Light theme (default for all) ────────────────────────────── */
:root {
	--bap-bg: #f8fafc;
	--bap-surface: #ffffff;
	--bap-surface-2: #f1f5f9;
	--bap-surface-3: #e2e8f0;
	--bap-text: #0f172a;
	--bap-text-muted: #64748b;
	--bap-border: #e2e8f0;
	--bap-primary: #4F46E5;
	--bap-primary-dark: #3730A3;
	--bap-primary-light: #EEF2FF;
	--bap-primary-contrast: #ffffff;
	--bap-accent: #06B6D4;
	--bap-success: #10B981;
	--bap-warn: #F59E0B;
	--bap-error: #EF4444;
	--bap-info: #3B82F6;
	--bap-focus-ring: #6366F1;
	--bap-radius-sm: 6px;
	--bap-radius-md: 10px;
	--bap-radius-lg: 14px;
	--bap-radius: 8px;
	--bap-space-1: 4px;
	--bap-space-2: 8px;
	--bap-space-3: 12px;
	--bap-space-4: 16px;
	--bap-space-6: 24px;
	--bap-touch-min: 44px;
	--bap-shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
	--bap-shadow-md: 0 2px 8px rgba(0,0,0,0.10);
}

/* ── Explicit dark theme override ──────────────────────────────── */
/* ── Dark theme: system preference ─────────────────────────────── */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--bap-bg: #0b0f19;
		--bap-surface: #111827;
		--bap-surface-2: #1e293b;
		--bap-surface-3: #334155;
		--bap-text: #f8fafc;
		--bap-text-muted: #cbd5e1;
		--bap-border: #475569;
		--bap-primary: #60a5fa;
		--bap-primary-dark: #3b82f6;
		--bap-primary-light: #1e3a5f;
		--bap-primary-contrast: #0b0f19;
		--bap-accent: #22d3ee;
		--bap-success: #34d399;
		--bap-warn: #fbbf24;
		--bap-error: #f87171;
		--bap-info: #60a5fa;
		--bap-focus-ring: #93c5fd;
		--bap-shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
		--bap-shadow-md: 0 2px 8px rgba(0,0,0,0.4);
	}
}

/* ── Dark theme: explicit override ─────────────────────────────── */
[data-theme="dark"] {
	--bap-bg: #0b0f19;
	--bap-surface: #111827;
	--bap-surface-2: #1e293b;
	--bap-surface-3: #334155;
	--bap-text: #f8fafc;
	--bap-text-muted: #cbd5e1;
	--bap-border: #475569;
	--bap-primary: #60a5fa;
	--bap-primary-dark: #3b82f6;
	--bap-primary-light: #1e3a5f;
	--bap-primary-contrast: #0b0f19;
	--bap-accent: #22d3ee;
	--bap-success: #34d399;
	--bap-warn: #fbbf24;
	--bap-error: #f87171;
	--bap-info: #60a5fa;
	--bap-focus-ring: #93c5fd;
	--bap-shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
	--bap-shadow-md: 0 2px 8px rgba(0,0,0,0.4);
}

[data-theme="light"] {
	--bap-bg: #f8fafc;
	--bap-surface: #ffffff;
	--bap-surface-2: #f1f5f9;
	--bap-surface-3: #e2e8f0;
	--bap-text: #0f172a;
	--bap-text-muted: #64748b;
	--bap-border: #e2e8f0;
	--bap-primary: #4F46E5;
	--bap-primary-dark: #3730A3;
	--bap-primary-light: #EEF2FF;
	--bap-primary-contrast: #ffffff;
	--bap-accent: #06B6D4;
	--bap-success: #10B981;
	--bap-warn: #F59E0B;
	--bap-error: #EF4444;
	--bap-info: #3B82F6;
	--bap-focus-ring: #6366F1;
}