/*
 * Woo Plus — CSS Variables / Design Tokens
 * Espejo completo de las variables definidas en admin.css.
 * Referencia centralizada para admin y frontend.
 */

:root {
	/* ── FOUNDATION COLORS ── */
	--woo-plus-white: #ffffff;
	--woo-plus-black: #000000;

	/* ── NEUTRALS (Unified Slate Scale) ── */
	--woo-plus-slate-50: #f8fafc;
	--woo-plus-slate-100: #f1f5f9;
	--woo-plus-slate-200: #e2e8f0;
	--woo-plus-slate-300: #cbd5e1;
	--woo-plus-slate-400: #94a3b8;
	--woo-plus-slate-500: #64748b;
	--woo-plus-slate-600: #475569;
	--woo-plus-slate-700: #334155;
	--woo-plus-slate-800: #1e293b;
	--woo-plus-slate-900: #0f172a;

	/* ── BRAND & ACCENTS ── */
	--woo-plus-accent-indigo: #4f46e5;
	--woo-plus-accent-blue: #3b82f6;
	--woo-plus-accent-sky: #0ea5e9;
	--woo-plus-accent-success: #22c55e;
	--woo-plus-accent-warning: #f59e0b;
	--woo-plus-accent-danger: #ef4444;
	--woo-plus-accent-purple: #8b5cf6;
	--woo-plus-accent-primary: var(--woo-plus-accent-indigo);

	/* ── ALPHA COLORS ── */
	--woo-plus-white-alpha: rgba(255, 255, 255, 0.15);
	--woo-plus-black-alpha: rgba(0, 0, 0, 0.04);
	--woo-plus-indigo-alpha: rgba(79, 70, 229, 0.15);
	--woo-plus-sky-alpha: rgba(14, 165, 233, 0.08);
	--woo-plus-slate-alpha: rgba(15, 23, 42, 0.06);
	--woo-plus-border-alpha: rgba(226, 232, 240, 0.8);

	/* ── BORDERS ── */
	--woo-plus-border-subtle: rgba(226, 232, 240, 0.6);
	--woo-plus-border-main: var(--woo-plus-border-alpha);
	--woo-plus-border-strong: var(--woo-plus-slate-200);

	/* ── GRADIENTS ── */
	--woo-plus-grad-sidebar: linear-gradient(180deg, var(--woo-plus-slate-50) 0%, var(--woo-plus-slate-100) 100%);
	--woo-plus-grad-active: linear-gradient(135deg, var(--woo-plus-accent-indigo) 0%, var(--woo-plus-accent-sky) 100%);
	--woo-plus-grad-hover: linear-gradient(135deg, var(--woo-plus-indigo-alpha) 0%, var(--woo-plus-sky-alpha) 100%);
	--woo-plus-grad-card: linear-gradient(180deg, var(--woo-plus-white) 0%, var(--woo-plus-slate-50) 100%);
	--woo-plus-grad-shine: linear-gradient(120deg, transparent 0%, var(--woo-plus-white-alpha) 50%, transparent 100%);

	/* ── UI SPECS ── */
	--woo-plus-radius-sm: 8px;
	--woo-plus-radius-md: 10px;
	--woo-plus-radius-xl: 16px;
	--woo-plus-radius-pill: 999px;

	/* ── SHADOWS ── */
	--woo-plus-shadow-sm: 0 2px 4px var(--woo-plus-black-alpha);
	--woo-plus-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08);
	--woo-plus-shadow-lg: 0 10px 30px rgba(15, 23, 42, 0.12);
	--woo-plus-shadow-active: 0 4px 14px var(--woo-plus-indigo-alpha);
	--woo-plus-shadow-card: 0 4px 6px -1px var(--woo-plus-black-alpha), 0 24px 48px -12px var(--woo-plus-slate-alpha);
	--woo-plus-shadow-card-hover: 0 12px 24px -8px var(--woo-plus-slate-alpha), 0 32px 64px -16px var(--woo-plus-slate-alpha);

	/* ── TYPOGRAPHY ── */
	--woo-plus-font-stack: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, sans-serif;
	--woo-plus-weight-medium: 500;
	--woo-plus-weight-bold: 600;
	--woo-plus-type-h2: 18px;
	--woo-plus-text-main: var(--woo-plus-slate-900);

	/* ── CONTROLS ── */
	--woo-plus-control-height: 38px;
	--woo-plus-pad-lux: 32px;
	--woo-plus-dot-size: 8px;
}