/* ============================================================ GKExpress - Design Tokens Fuente única de colores, tipografía, radios y sombras para todo el sistema (admin, cliente, motorizado, login/registro). Un solo tema de variables; Motorizado usa la variante oscura vía [data-theme="dark"] en (uso en calle/exterior). ============================================================ */ :root { /* Marca: naranja del logo GK Express como color principal de acentos/CTAs; azul marino como color estructural secundario (sidebar, superficies oscuras). */ --color-primary: #f39c12; --color-primary-dark: #d9840a; --color-primary-light: #fef3e2; --color-primary-rgb: 243, 156, 18; --color-navy: #001a35; --color-navy-light: #0a3868; --color-secondary: #64748b; /* Estado */ --color-success: #10b981; --color-success-bg: #d1fae5; --color-success-text: #047857; --color-danger: #ef4444; --color-danger-bg: #fee2e2; --color-danger-text: #b91c1c; --color-warning: #f59e0b; --color-warning-bg: #fef3c7; --color-warning-text: #b45309; --color-info: #0ea5e9; --color-info-bg: #e0f2fe; --color-info-text: #0369a1; /* Neutrales / superficies */ --color-bg: #f8fafc; --color-surface: #ffffff; --color-border: #e2e8f0; --color-text: #1e293b; --color-text-muted: #64748b; /* Tipografía */ --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; /* Radios */ --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-full: 9999px; /* Sombras */ --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06); --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08); --shadow-lg: 0 25px 50px -12px rgba(15, 23, 42, 0.25); } /* Variante oscura: panel Motorizado (uso en exterior / de noche). Mismo naranja de marca como acento, sobre fondo oscuro. */ :root[data-theme="dark"] { --color-bg: #0f172a; --color-surface: #1e293b; --color-border: rgba(255, 255, 255, 0.08); --color-text: #f1f5f9; --color-text-muted: #94a3b8; --color-primary-light: rgba(243, 156, 18, 0.18); --shadow-lg: 0 25px 50px -12px rgba(0, 0, 0, 0.5); } body { font-family: var(--font-sans); background: var(--color-bg); color: var(--color-text); }