/* ====================================================================
   TEMAS DEL SISTEMA: ROSADO, BLANCO Y NEGRO
   Compatible con html, body y variables CSS globales
   ==================================================================== */

:root {
    --transition-speed: 0.25s;
    --font-family: 'Segoe UI', system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;

    /* Valores por defecto (Blanco / Light) */
    --bg-page: #f8fafc;
    --bg-card: #ffffff;
    --bg-card-subtle: #f1f5f9;
    --bg-input: #ffffff;
    --border-color: #cbd5e1;
    --border-focus: #2563eb;
    --text-main: #1e293b;
    --text-muted: #64748b;
    --text-heading: #0f172a;
    
    --primary: #2563eb;
    --primary-hover: #1d4ed8;
    --primary-light: #eff6ff;
    --primary-text: #ffffff;
    
    --accent: #0284c7;
    --accent-bg: #e0f2fe;
    
    --success: #16a34a;
    --success-bg: #dcfce7;
    --success-border: #86efac;
    
    --danger: #dc2626;
    --danger-bg: #fee2e2;
    --danger-border: #fca5a5;
    
    --warning: #d97706;
    --warning-bg: #fef3c7;
    --warning-border: #fcd34d;
    
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    
    --navbar-bg: #ffffff;
    --navbar-border: #e2e8f0;
    --badge-good: #16a34a;
    --badge-bad: #dc2626;
    --table-header: #f8fafc;
    --table-stripe: #f1f5f9;
    --signature-bg: #ffffff;
    --signature-pen: #1e293b;
}

/* --------------------------------------------------------------------
   1. TEMA BLANCO (WHITE / CORPORATIVO)
   -------------------------------------------------------------------- */
html.theme-white,
body.theme-white {
    --bg-page: #f8fafc;
    --bg-card: #ffffff;
    --bg-card-subtle: #f1f5f9;
    --bg-input: #ffffff;
    --border-color: #cbd5e1;
    --border-focus: #2563eb;
    --text-main: #1e293b;
    --text-muted: #64748b;
    --text-heading: #0f172a;
    
    --primary: #2563eb;
    --primary-hover: #1d4ed8;
    --primary-light: #eff6ff;
    --primary-text: #ffffff;
    
    --accent: #0284c7;
    --accent-bg: #e0f2fe;
    
    --navbar-bg: #ffffff;
    --navbar-border: #e2e8f0;
    --table-header: #f8fafc;
    --table-stripe: #f1f5f9;
    --signature-bg: #ffffff;
    --signature-pen: #1e293b;
}

/* --------------------------------------------------------------------
   2. TEMA ROSADO (PINK THEME - VIBRANTE Y MODERNO)
   -------------------------------------------------------------------- */
html.theme-pink,
body.theme-pink {
    --bg-page: #fdf2f8 !important;
    --bg-card: #ffffff !important;
    --bg-card-subtle: #fce7f3 !important;
    --bg-input: #fff5f9 !important;
    --border-color: #f472b6 !important;
    --border-focus: #db2777 !important;
    --text-main: #500724 !important;
    --text-muted: #9d174d !important;
    --text-heading: #831843 !important;
    
    --primary: #db2777 !important;
    --primary-hover: #be185d !important;
    --primary-light: #fce7f3 !important;
    --primary-text: #ffffff !important;
    
    --accent: #f43f5e !important;
    --accent-bg: #ffe4e6 !important;
    
    --navbar-bg: #ffffff !important;
    --navbar-border: #f472b6 !important;
    --table-header: #fce7f3 !important;
    --table-stripe: #fdf2f8 !important;
    --signature-bg: #fff5f9 !important;
    --signature-pen: #831843 !important;
    
    --shadow-sm: 0 1px 3px rgba(219, 39, 119, 0.12) !important;
    --shadow-md: 0 4px 10px rgba(219, 39, 119, 0.18) !important;
}

/* --------------------------------------------------------------------
   3. TEMA NEGRO (DARK / ALTO CONTRASTE)
   -------------------------------------------------------------------- */
html.theme-black,
body.theme-black {
    --bg-page: #0b0f19 !important;
    --bg-card: #131c2e !important;
    --bg-card-subtle: #1c273e !important;
    --bg-input: #0e1626 !important;
    --border-color: #27354f !important;
    --border-focus: #38bdf8 !important;
    --text-main: #e2e8f0 !important;
    --text-muted: #94a3b8 !important;
    --text-heading: #f8fafc !important;
    
    --primary: #38bdf8 !important;
    --primary-hover: #0284c7 !important;
    --primary-light: #162c46 !important;
    --primary-text: #0b0f19 !important;
    
    --accent: #818cf8 !important;
    --accent-bg: #1e2238 !important;
    
    --navbar-bg: #131c2e !important;
    --navbar-border: #27354f !important;
    --table-header: #1c273e !important;
    --table-stripe: #172136 !important;
    --signature-bg: #0e1626 !important;
    --signature-pen: #38bdf8 !important;
    
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.6) !important;
}

/* Estilos de fondo globales */
html, body {
    background-color: var(--bg-page) !important;
    color: var(--text-main) !important;
    transition: background-color var(--transition-speed) ease, color var(--transition-speed) ease;
}