/* Variables globales del sistema TurnosPymes — Versión Producción */
/* Modificar aquí cambia el diseño en toda la aplicación */

:root {
    /* ── 1. Paleta de Colores (SaaS Moderno) ── */
    --color-primary: #2563EB;
    --color-primary-light: #3B82F6;
    --color-primary-dark: #1D4ED8;
    --color-primary-hover: #1D4ED8;

    --color-accent: #38BDF8;
    --color-accent-hover: #0EA5E9;

    /* Colores de estado refinados */
    --color-success: #10B981;
    --color-success-hover: #059669;
    --color-warning: #F59E0B;
    --color-danger: #EF4444;
    --color-info: #38BDF8;

    /* ── 2. Fondos y Superficies ── */
    --color-bg-main: #F8FAFC;
    --color-bg-auth: #F1F5F9;
    --color-bg-sidebar: #0F172A;
    --color-bg-card: #FFFFFF;
    --color-bg-warning: #FEF9E7;
    --color-white: #FFFFFF;
    --color-accent-light: #E0F2FE;
    --color-accent-dark: #0369A1;

    /* ── 3. Tipografía ── */
    --font-family: 'Inter', system-ui, -apple-system, sans-serif;
    --font-size-base: 14px;
    --font-size-small: 12px;
    --font-size-large: 16px;

    /* Textos con contraste balanceado */
    --color-text-primary: #1E293B;
    --color-text-secondary: #64748B;
    --color-text-sidebar: #F8FAFC;
    --color-text-sidebar-muted: #94A3B8;

    /* ── 4. Estructura y Elevación ── */
    --sidebar-width: 250px;
    --sidebar-collapsed-width: 0px;
    --border-radius: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;

    --box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    --box-shadow-card: 0 10px 15px -3px rgba(0, 0, 0, 0.05);

    /* ── 5. Bordes ── */
    --color-border: #E2E8F0;
    --color-border-light: #F1F5F9;

    /* ── 6. Estados ── */
    --color-disabled: #94A3B8;

    /* ── 7. Transiciones ── */
    --transition-speed: 0.2s;
    --transition-fast: 0.15s;

    /* ── 8. Alturas táctiles ── */
    --touch-height: 48px;

    /* ── 9. Espaciado ── */
    --space-card-padding: 1rem;
    --space-element-gap: 1.5rem;

    /* ── 10. Pantalla TV (Dark Mode) ── */
    --color-tv-bg: #0A0A0A;
    --color-tv-main-bg: #111111;
    --color-tv-accent: #E94560;
    --color-tv-ads-bg: #1A1A2E;
    --color-tv-ads-bg-end: #16213E;
    --color-tv-ticker-bg: #0F3460;
    --color-tv-ticker-bg-end: #533483;
    --color-tv-text: #FFFFFF;
    --color-tv-text-muted: rgba(255, 255, 255, 0.5);
    --color-tv-badge-bg: rgba(0, 0, 0, 0.5);
    --color-tv-placeholder-bg-end: #1A1A2E;
}