/* =============================================================================
   CSS Variables / Custom Properties
   Centralizado para uso global en toda la aplicación
   ========================================================================== */

/* Variables de fuente */
:root {
  --font-family-primary: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  /* Alias para compatibilidad con código existente */
  --primary-text-font: var(--font-family-primary);
}

/* Variables comunes (movidas de HomeResponsive.css) */
/* NOTA: Usamos :root, [data-bs-theme="light"] para igualar la especificidad de Bootstrap 5.3
   que define sus variables en :root, [data-bs-theme=light] */
:root,
[data-bs-theme="light"] {
    /*Common*/
    --primary-text-color: #333 !important;
    --primary-text-size: 0.875rem !important;
    --secondary-text-size: 13px !important;
    --primary-tab-font-size: var(--primary-text-size) !important;
    --primary-table-header-font-size: var(--primary-text-size) !important;
    --primary-table-cell-font-size: var(--primary-text-size) !important;
    --primary-text-highlight-color: #f3f3f3 !important;
    --primary-menu-icon-size: 16px !important;
    --master-background-color: #f3f3f3 !important;
    --content-background-color: #fff;
    --primary-background-color: #495057;
    --primary-highlight-background-color: #337ab7;
    --primary-highlight-color: #337ab7;
    --primary-highlight-contrast-color: #ffffff; /* Se actualiza dinámicamente con JS */
    --primary-highlight-alternate-color: #525252;
    --primary-highlight-font: var(--font-family-primary);
    --primary-highlight-size: 0.875rem !important;
    --disabled-text-color: #c0c0c0 !important;
    --primary-color: #337ab7;
    --primary-color-dark: #2c699d;
    --primary-color-light: #504f56;
    --secondary-color: #ef781d;
    --primary-header-background-color: #f3f3f3;
    --primary-header-text-color: #525252;
    /* --primary-leftbar-background-color: #525252; */
    --primary-leftbar-background-color: #495057;
    --primary-leftbar-text-color: #fff;
    --primary-button-background-color: var(--primary-highlight-color);
    --primary-button-border-background-color: transparent;
    --primary-button-text-color: #fff;
    --primary-button-hover-background-color: var(--primary-color-dark);
    --primary-button-hover-border-color: var(--primary-color-dark);
    --primary-button-hover-text-color: #fff;
    --primary-select-text-color: #525252;
    --primary-select-background-color: #f3f3f3;
    --primary-input-text-color: #525252;
    --primary-input-background-color: #fff;
    --primary-table-background-color: #f3f3f3;
    --primary-table-text-color: #333;
    --primary-table-group-background-color: #e2e2e2;
    --primary-table-group-text-color: #525252;
    --primary-table-group-separator-color: #ccc;
    --primary-table-header-background-color: #96a4b39c;
    --primary-table-header-text-color: #525252;
    --primary-table-border-color: #ddd;
    --primary-border-color: #ddd;
    --primary-view-group-border-color: #49505733;
    --primary-notification-background-color: #f3f3f3;
    --primary-notification-unread-background-color: #e3e6ea;
    --primary-notification-unread-border-color: #959ca6;
    --primary-notification-unread-text-color: #212529;
    --primary-notification-text-color: #525252;
    --primary-notification-read-background-color: #f8f9fa;
    --primary-notification-read-border-color: #dee2e6;
    --primary-notification-read-text-color: #495057;
    --primary-notification-read-hover-background-color: #e9ecef;
    --primary-menu-background-color: #f3f3f3;
    --primary-menu-hover-background-color: #E1E1E1;
    /* =============================================================================
        OVERRIDES DE BOOTSTRAP 5 - Variables CSS Nativas
        Documentación: Bootstrap-Override-Guide.md
       ========================================================================== */
    /* Fuente del Body */
    --bs-body-font-size: var(--primary-text-size);
    --bs-body-font-family: var(--primary-text-font, var(--font-family-primary, "Inter", system-ui, sans-serif)) !important;
    /* Fuente de Nav Links */
    --bs-nav-link-font-size: var(--primary-text-size) !important;
    /* Nav Links - Colores */
    --bs-nav-link-color: var(--primary-highlight-color) !important;
    --bs-link-color: var(--primary-highlight-color) !important;
    --bs-nav-link-hover-color: var(--primary-highlight-color) !important;
    --bs-nav-link-disabled-color: var(--disabled-text-color) !important;
    --bs-link-hover-color: var(--primary-highlight-color) !important;
    /* Nav Tabs - Bordes */
    --bs-nav-tabs-border-width: 1px !important;
    --bs-nav-tabs-border-color: var(--primary-border-color) !important;
    --bs-nav-tabs-border-radius: 0 !important;
    /* Nav Tabs Links - Estados */
    
    --bs-nav-tabs-link-hover-border-color: var(--primary-border-color) var(--primary-border-color) transparent !important;
    --bs-link-hover-color: var(--primary-highlight-color) !important;
    
    --bs-nav-tabs-link-active-color: var(--primary-highlight-color) !important;
    --bs-nav-tabs-link-active-bg: var(--content-background-color) !important;
    --bs-nav-tabs-link-active-border-color: var(--primary-border-color) var(--primary-border-color) transparent !important;
    
    /* Colores Primarios de Bootstrap */
    --bs-primary: var(--primary-highlight-color);
    --bs-primary-rgb: 51, 122, 183; /* RGB de --primary-highlight-color (blue default) */
    /* Botones - Primary */
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--primary-highlight-color);
    --bs-btn-border-color: var(--primary-highlight-color);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary-color-dark);
    --bs-btn-hover-border-color: var(--primary-color-dark);
    --bs-btn-active-bg: var(--primary-color-dark);
    --bs-btn-active-border-color: var(--primary-color-dark);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    /* Botones - Outline Primary */
    --bs-btn-outline-color: var(--bs-primary);
    --bs-btn-outline-hover-color: #fff;
    --bs-btn-outline-hover-bg: var(--bs-primary);
    --bs-btn-outline-hover-border-color: var(--bs-primary);
    --bs-btn-outline-active-color: #fff;
    --bs-btn-outline-active-bg: var(--bs-primary);
    --bs-btn-outline-active-border-color: var(--bs-primary);
    --bs-btn-outline-disabled-color: var(--bs-primary);
    --bs-btn-outline-focus-shadow-rgb: var(--bs-primary-rgb);
    /* Form Controls - Base */
    --bs-form-control-color: var(--primary-input-text-color, var(--primary-text-color, #525252));
    --bs-form-control-bg: var(--primary-input-background-color, #fff);
    --bs-form-control-border-color: var(--primary-input-border-color, var(--primary-border-color, #ddd));
    --bs-form-control-font-size: var(--primary-text-size, 0.875rem);
    --bs-form-control-font-family: var(--primary-text-font, var(--font-family-primary, "Inter", system-ui, sans-serif));
    /* Form Controls - Focus */
    --bs-form-control-focus-border-color: var(--primary-highlight-color);
    --bs-form-control-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
    /* Form Select - Base */
    --bs-form-select-color: var(--primary-select-text-color, var(--primary-input-text-color, #525252));
    --bs-form-select-bg: var(--primary-select-background-color, var(--primary-input-background-color, #f3f3f3));
    --bs-form-select-border-color: var(--primary-input-border-color, var(--primary-border-color, #ddd));
    --bs-form-select-font-size: var(--primary-text-size, 0.875rem);
    --bs-form-select-font-family: var(--primary-text-font, var(--font-family-primary, "Inter", system-ui, sans-serif));
    /* Form Select - Focus */
    --bs-form-select-focus-border-color: var(--primary-highlight-color);
    --bs-form-select-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
    /* Labels */
    --bs-label-color: var(--primary-text-color, #495057);
    --bs-label-font-size: var(--primary-text-size, 0.875rem);
    --bs-label-font-family: var(--primary-text-font, var(--font-family-primary, "Inter", system-ui, sans-serif));
    /* Tables */
    --bs-table-border-color: var(--primary-border-color, #dee2e6);
    --bs-table-bg: var(--content-background-color, #fff);
    --bs-table-color: var(--primary-text-color, #495057);
    --bs-table-head-bg: var(--primary-table-header-background-color, #f3f3f3);
    --bs-table-head-color: var(--primary-table-header-text-color, #525252);
    /* Border color general */
    --bs-border-color: var(--primary-border-color, #dee2e6);
    /* Body color (afecta a labels y texto general) */
    --bs-body-color: var(--primary-text-color, #495057);
}

/* Variables para dark mode */
/* NOTA: Se usa [data-bs-theme="dark"] nativo de Bootstrap 5.3
   Se mantiene html[data-dark-mode] temporalmente para compatibilidad durante la migración */
html[data-dark-mode],
[data-bs-theme="dark"] {
    --primary-text-color: #fff !important;
    --primary-text-font: var(--font-family-primary);
    --primary-text-size: 0.875rem !important;
    --primary-tab-font-size: var(--primary-text-size) !important;
    --primary-table-header-font-size: var(--primary-text-size) !important;
    --primary-table-cell-font-size: var(--primary-text-size) !important;
    --primary-text-highlight-color: #f3f3f3 !important;
    --primary-menu-icon-size: 16px !important;
    --master-background-color: #212529 !important;
    --content-background-color: #495057;
    --primary-background-color: #495057;
    --primary-highlight-background-color: #0d6efd;
    --primary-highlight-color: #0d6efd;
    --primary-highlight-contrast-color: #ffffff; /* Se actualiza dinámicamente con JS */
    --primary-highlight-alternate-color: #504f56;
    --primary-highlight-font: var(--font-family-primary);
    --primary-highlight-size: 0.875rem !important;
    --disabled-text-color: #c0c0c0 !important;
    --primary-color: #337ab7;
    --primary-color-dark: #2c699d;
    --primary-color-light: #504f56;
    --secondary-color: #ef781d;
    --primary-header-background-color: #212529;
    --primary-header-text-color: #fff;
    --primary-leftbar-background-color: #495057;
    --primary-leftbar-text-color: #fff;
    --primary-button-background-color: var(--primary-highlight-color);
    --primary-button-border-background-color: transparent;
    --primary-button-text-color: #fff;
    --primary-button-hover-background-color: var(--primary-color-dark);
    --primary-button-hover-border-color: var(--primary-color-dark);
    --primary-button-hover-text-color: #fff;
    --primary-select-text-color: #fff;
    --primary-select-background-color: #212529;
    --primary-input-text-color: #fff;
    --primary-input-background-color: #212529;
    --primary-input-border-color: #495057;
    --primary-table-background-color: #495057;
    --primary-table-text-color: #f3f3f3;
    --primary-table-group-background-color: #495057;
    --primary-table-group-text-color: #fff;
    --primary-table-group-separator-color: #212529;
    --primary-table-header-background-color: #96a4b39c;
    --primary-table-header-text-color: #212529;
    --primary-table-border-color: #212529;
    --primary-border-color: #495057;
    --primary-view-group-border-color: #495057;
    --primary-notification-background-color: #495057;
    --primary-notification-unread-background-color: #5a6268;
    --primary-notification-unread-border-color: #6c757d;
    --primary-notification-unread-text-color: #ffffff;
    --primary-notification-text-color: #fff;
    --primary-notification-border-color: #212529;
    --primary-notification-read-background-color: #343a40;
    --primary-notification-read-border-color: #495057;
    --primary-notification-read-text-color: #e9ecef;
    --primary-notification-read-hover-background-color: #3d4449;
    --primary-menu-background-color: #495057;
    --primary-menu-hover-background-color: #9097a4;
    /* Fuente del Body - Dark Mode */
    --bs-body-font-size: var(--primary-text-size);
    /* Fuente de Nav Links - Dark Mode */
    --bs-nav-link-font-size: var(--primary-text-size) !important;
    /* Nav Links - Colores Dark Mode */
    --bs-nav-link-color: var(--primary-highlight-color) !important;
    --bs-link-color: var(--primary-highlight-color) !important;
    --bs-nav-link-hover-color: var(--primary-highlight-color) !important;
    --bs-nav-link-disabled-color: var(--disabled-text-color) !important;
    --bs-link-hover-color: var(--primary-highlight-color) !important;
    /* Nav Tabs - Bordes Dark Mode */
    --bs-nav-tabs-border-width: 1px !important;
    --bs-nav-tabs-border-color: var(--primary-border-color) !important;
    --bs-nav-tabs-border-radius: 0 !important;
    /* Nav Tabs Links - Estados Dark Mode */
    --bs-nav-tabs-link-hover-border-color: var(--primary-border-color) var(--primary-border-color) transparent !important;
    --bs-nav-tabs-link-active-color: var(--primary-highlight-color) !important;
    --bs-nav-tabs-link-active-bg: var(--content-background-color) !important;
    --bs-nav-tabs-link-active-border-color: var(--primary-border-color) var(--primary-border-color) transparent !important;
    /* Colores Primarios de Bootstrap - Dark Mode */
    --bs-primary: var(--primary-highlight-color);
    --bs-primary-rgb: 13, 110, 253; /* RGB de --primary-highlight-color en dark mode (blue) */
    /* Botones - Primary Dark Mode */
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--primary-highlight-color);
    --bs-btn-border-color: var(--primary-highlight-color);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary-color-dark);
    --bs-btn-hover-border-color: var(--primary-color-dark);
    --bs-btn-active-bg: var(--primary-color-dark);
    --bs-btn-active-border-color: var(--primary-color-dark);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    /* Botones - Outline Primary Dark Mode */
    --bs-btn-outline-color: var(--bs-primary);
    --bs-btn-outline-hover-color: #fff;
    --bs-btn-outline-hover-bg: var(--bs-primary);
    --bs-btn-outline-hover-border-color: var(--bs-primary);
    --bs-btn-outline-active-color: #fff;
    --bs-btn-outline-active-bg: var(--bs-primary);
    --bs-btn-outline-active-border-color: var(--bs-primary);
    --bs-btn-outline-disabled-color: var(--bs-primary);
    --bs-btn-outline-focus-shadow-rgb: var(--bs-primary-rgb);
    /* Form Controls - Base Dark Mode */
    --bs-form-control-color: var(--primary-input-text-color, #fff);
    --bs-form-control-bg: var(--primary-input-background-color, #212529);
    --bs-form-control-border-color: var(--primary-input-border-color, var(--primary-border-color, #495057));
    --bs-form-control-font-size: var(--primary-text-size, 0.875rem);
    --bs-form-control-font-family: var(--primary-text-font, var(--font-family-primary, "Inter", system-ui, sans-serif));
    /* Form Controls - Focus Dark Mode */
    --bs-form-control-focus-border-color: var(--primary-highlight-color);
    --bs-form-control-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
    /* Form Select - Base Dark Mode */
    --bs-form-select-color: var(--primary-select-text-color, #fff);
    --bs-form-select-bg: var(--primary-select-background-color, #212529);
    --bs-form-select-border-color: var(--primary-input-border-color, var(--primary-border-color, #495057));
    --bs-form-select-font-size: var(--primary-text-size, 0.875rem);
    --bs-form-select-font-family: var(--primary-text-font, var(--font-family-primary, "Inter", system-ui, sans-serif));
    /* Form Select - Focus Dark Mode */
    --bs-form-select-focus-border-color: var(--primary-highlight-color);
    --bs-form-select-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25);
    /* Labels Dark Mode */
    --bs-label-color: var(--primary-text-color, #fff);
    --bs-label-font-size: var(--primary-text-size, 0.875rem);
    --bs-label-font-family: var(--primary-text-font, var(--font-family-primary, "Inter", system-ui, sans-serif));
    /* Tables Dark Mode */
    --bs-table-border-color: var(--primary-border-color, #495057);
    --bs-table-bg: var(--content-background-color, #495057);
    --bs-table-color: var(--primary-text-color, #fff);
    --bs-table-head-bg: var(--primary-table-header-background-color, #96a4b39c);
    --bs-table-head-color: var(--primary-table-header-text-color, #212529);
    /* Border color general Dark Mode */
    --bs-border-color: var(--primary-border-color, #495057);
    /* Body color Dark Mode */
    --bs-body-color: var(--primary-text-color, #fff);
    /* Body background Dark Mode */
    /* --bs-body-bg: var(--content-background-color, #495057); */
    /* Modal background Dark Mode */
    /* --bs-modal-bg: var(--content-background-color, #495057) !important; */
    --bs-modal-color: var(--primary-text-color, #fff) !important;
    --bs-modal-border-color: var(--primary-border-color, #495057) !important;
    --bs-modal-header-border-color: var(--primary-border-color, #495057) !important;
    --bs-modal-footer-border-color: var(--primary-border-color, #495057) !important;
}

/* ============================================
   ESQUEMAS DE COLOR - LIGHT MODE
   ============================================ */


/* Blue (default) - ya definido en :root */
html[data-color-scheme="blue"],
[data-bs-theme="light"][data-color-scheme="blue"] {
    --primary-highlight-color: #076ed5;
    --primary-highlight-background-color: #076ed5;
    --primary-color: #076ed5;
    --primary-color-dark: #0d6efd;
    --bs-primary-rgb: 51, 122, 183;
}

/* Green */
html[data-color-scheme="green"],
[data-bs-theme="light"][data-color-scheme="green"] {
    --primary-highlight-color: #28a745;
    --primary-highlight-background-color: #28a745;
    --primary-color: #28a745;
    --primary-color-dark: #218838;
    --bs-primary-rgb: 40, 167, 69;
}

/* Purple */
html[data-color-scheme="purple"],
[data-bs-theme="light"][data-color-scheme="purple"] {
    --primary-highlight-color: #6f42c1;
    --primary-highlight-background-color: #6f42c1;
    --primary-color: #6f42c1;
    --primary-color-dark: #5a32a3;
    --bs-primary-rgb: 111, 66, 193;
}

/* Orange */
html[data-color-scheme="orange"],
[data-bs-theme="light"][data-color-scheme="orange"] {
    --primary-highlight-color: #fd7e14;
    --primary-highlight-background-color: #fd7e14;
    --primary-color: #fd7e14;
    --primary-color-dark: #e66a00;
    --bs-primary-rgb: 253, 126, 20;
}

/* Teal */
html[data-color-scheme="teal"],
[data-bs-theme="light"][data-color-scheme="teal"] {
    --primary-highlight-color: #20c997;
    --primary-highlight-background-color: #20c997;
    --primary-color: #20c997;
    --primary-color-dark: #1aa179;
    --bs-primary-rgb: 32, 201, 151;
}

/* Red */
html[data-color-scheme="red"],
[data-bs-theme="light"][data-color-scheme="red"] {
    --primary-highlight-color: #dc3545;
    --primary-highlight-background-color: #dc3545;
    --primary-color: #dc3545;
    --primary-color-dark: #c82333;
    --bs-primary-rgb: 220, 53, 69;
}

/* Indigo */
html[data-color-scheme="indigo"],
[data-bs-theme="light"][data-color-scheme="indigo"] {
    --primary-highlight-color: #6610f2;
    --primary-highlight-background-color: #6610f2;
    --primary-color: #6610f2;
    --primary-color-dark: #520dc2;
    --bs-primary-rgb: 102, 16, 242;
}

/* Pink */
html[data-color-scheme="pink"],
[data-bs-theme="light"][data-color-scheme="pink"] {
    --primary-highlight-color: #e83e8c;
    --primary-highlight-background-color: #e83e8c;
    --primary-color: #e83e8c;
    --primary-color-dark: #d91a72;
    --bs-primary-rgb: 232, 62, 140;
}

/* Cyan */
html[data-color-scheme="cyan"],
[data-bs-theme="light"][data-color-scheme="cyan"] {
    --primary-highlight-color: #17a2b8;
    --primary-highlight-background-color: #17a2b8;
    --primary-color: #17a2b8;
    --primary-color-dark: #138496;
    --bs-primary-rgb: 23, 162, 184;
}

/* Yellow */
html[data-color-scheme="yellow"],
[data-bs-theme="light"][data-color-scheme="yellow"] {
    --primary-highlight-color: #ffc107;
    --primary-highlight-background-color: #ffc107;
    --primary-color: #ffc107;
    --primary-color-dark: #e0a800;
    --bs-primary-rgb: 255, 193, 7;
}

/* ============================================
   NUEVOS ESQUEMAS - PASTEL
   ============================================ */

/* Lavender */
html[data-color-scheme="lavender"],
[data-bs-theme="light"][data-color-scheme="lavender"] {
    --primary-highlight-color: #c4a5f5;
    --primary-highlight-background-color: #c4a5f5;
    --primary-color: #c4a5f5;
    --primary-color-dark: #b894d1;
    --bs-primary-rgb: 196, 165, 245;
}

/* Mint */
html[data-color-scheme="mint"],
[data-bs-theme="light"][data-color-scheme="mint"] {
    --primary-highlight-color: #5eead4;
    --primary-highlight-background-color: #5eead4;
    --primary-color: #5eead4;
    --primary-color-dark: #4ec9b0;
    --bs-primary-rgb: 94, 234, 212;
}

/* Peach */
html[data-color-scheme="peach"],
[data-bs-theme="light"][data-color-scheme="peach"] {
    --primary-highlight-color: #ffb88c;
    --primary-highlight-background-color: #ffb88c;
    --primary-color: #ffb88c;
    --primary-color-dark: #ff9a6b;
    --bs-primary-rgb: 255, 184, 140;
}

/* Sky Blue */
html[data-color-scheme="skyblue"],
[data-bs-theme="light"][data-color-scheme="skyblue"] {
    --primary-highlight-color: #6cb2eb;
    --primary-highlight-background-color: #6cb2eb;
    --primary-color: #6cb2eb;
    --primary-color-dark: #4da3ff;
    --bs-primary-rgb: 108, 178, 235;
}

/* Rose */
html[data-color-scheme="rose"],
[data-bs-theme="light"][data-color-scheme="rose"] {
    --primary-highlight-color: #fda4af;
    --primary-highlight-background-color: #fda4af;
    --primary-color: #fda4af;
    --primary-color-dark: #ff8fa3;
    --bs-primary-rgb: 253, 164, 175;
}

/* Lilac */
html[data-color-scheme="lilac"],
[data-bs-theme="light"][data-color-scheme="lilac"] {
    --primary-highlight-color: #c4a5f5;
    --primary-highlight-background-color: #c4a5f5;
    --primary-color: #c4a5f5;
    --primary-color-dark: #b894d1;
    --bs-primary-rgb: 196, 165, 245;
}

/* ============================================
   NUEVOS ESQUEMAS - MATE/APAGADOS
   ============================================ */

/* Slate */
html[data-color-scheme="slate"],
[data-bs-theme="light"][data-color-scheme="slate"] {
    --primary-highlight-color: #64748b;
    --primary-highlight-background-color: #64748b;
    --primary-color: #64748b;
    --primary-color-dark: #475569;
    --bs-primary-rgb: 100, 116, 139;
}

/* Sage */
html[data-color-scheme="sage"],
[data-bs-theme="light"][data-color-scheme="sage"] {
    --primary-highlight-color: #87a96b;
    --primary-highlight-background-color: #87a96b;
    --primary-color: #87a96b;
    --primary-color-dark: #6b8e5a;
    --bs-primary-rgb: 135, 169, 107;
}

/* Dusty Rose */
html[data-color-scheme="dustyrose"],
[data-bs-theme="light"][data-color-scheme="dustyrose"] {
    --primary-highlight-color: #d4a5a5;
    --primary-highlight-background-color: #d4a5a5;
    --primary-color: #d4a5a5;
    --primary-color-dark: #c49494;
    --bs-primary-rgb: 212, 165, 165;
}

/* Muted Blue */
html[data-color-scheme="mutedblue"],
[data-bs-theme="light"][data-color-scheme="mutedblue"] {
    --primary-highlight-color: #5b7fa8;
    --primary-highlight-background-color: #5b7fa8;
    --primary-color: #5b7fa8;
    --primary-color-dark: #4a6b8f;
    --bs-primary-rgb: 91, 127, 168;
}

/* Terracotta */
html[data-color-scheme="terracotta"],
[data-bs-theme="light"][data-color-scheme="terracotta"] {
    --primary-highlight-color: #c97d60;
    --primary-highlight-background-color: #c97d60;
    --primary-color: #c97d60;
    --primary-color-dark: #b86a4f;
    --bs-primary-rgb: 201, 125, 96;
}

/* Olive */
html[data-color-scheme="olive"],
[data-bs-theme="light"][data-color-scheme="olive"] {
    --primary-highlight-color: #8b956d;
    --primary-highlight-background-color: #8b956d;
    --primary-color: #8b956d;
    --primary-color-dark: #6f7854;
    --bs-primary-rgb: 139, 149, 109;
}

/* ============================================
   NUEVOS ESQUEMAS - MODERNOS/NEUTROS
   ============================================ */

/* Charcoal */
html[data-color-scheme="charcoal"],
[data-bs-theme="light"][data-color-scheme="charcoal"] {
    --primary-highlight-color: #4a5568;
    --primary-highlight-background-color: #4a5568;
    --primary-color: #4a5568;
    --primary-color-dark: #2d3748;
    --bs-primary-rgb: 74, 85, 104;
}

/* Emerald */
html[data-color-scheme="emerald"],
[data-bs-theme="light"][data-color-scheme="emerald"] {
    --primary-highlight-color: #10b981;
    --primary-highlight-background-color: #10b981;
    --primary-color: #10b981;
    --primary-color-dark: #059669;
    --bs-primary-rgb: 16, 185, 129;
}

/* Amber */
html[data-color-scheme="amber"],
[data-bs-theme="light"][data-color-scheme="amber"] {
    --primary-highlight-color: #f59e0b;
    --primary-highlight-background-color: #f59e0b;
    --primary-color: #f59e0b;
    --primary-color-dark: #d97706;
    --bs-primary-rgb: 245, 158, 11;
}

/* Violet */
html[data-color-scheme="violet"],
[data-bs-theme="light"][data-color-scheme="violet"] {
    --primary-highlight-color: #8b5cf6;
    --primary-highlight-background-color: #8b5cf6;
    --primary-color: #8b5cf6;
    --primary-color-dark: #7c3aed;
    --bs-primary-rgb: 139, 92, 246;
}

/* Navy */
html[data-color-scheme="navy"],
[data-bs-theme="light"][data-color-scheme="navy"] {
    --primary-highlight-color: #1e3a8a;
    --primary-highlight-background-color: #1e3a8a;
    --primary-color: #1e3a8a;
    --primary-color-dark: #1e2e6e;
    --bs-primary-rgb: 30, 58, 138;
}

/* Coral */
html[data-color-scheme="coral"],
[data-bs-theme="light"][data-color-scheme="coral"] {
    --primary-highlight-color: #f97316;
    --primary-highlight-background-color: #f97316;
    --primary-color: #f97316;
    --primary-color-dark: #ea580c;
    --bs-primary-rgb: 249, 115, 22;
}

/* ============================================
   ESQUEMAS DE COLOR - DARK MODE
   ============================================ */

/* Blue (default) - ya definido en html[data-dark-mode] */
html[data-dark-mode][data-color-scheme="blue"],
[data-bs-theme="dark"][data-color-scheme="blue"],
[data-dark-mode][data-color-scheme="blue"] {
    --primary-highlight-color: #0d6efd;
    --primary-highlight-background-color: #0d6efd;
    --primary-color: #0d6efd;
    --primary-color-dark: #0a58ca;
    --bs-primary-rgb: 13, 110, 253;
}

/* Green */
html[data-dark-mode][data-color-scheme="green"],
[data-bs-theme="dark"][data-color-scheme="green"],
[data-dark-mode][data-color-scheme="green"] {
    --primary-highlight-color: #20c997;
    --primary-highlight-background-color: #20c997;
    --primary-color: #20c997;
    --primary-color-dark: #1aa179;
    --bs-primary-rgb: 32, 201, 151;
}

/* Purple */
html[data-dark-mode][data-color-scheme="purple"],
[data-bs-theme="dark"][data-color-scheme="purple"],
[data-dark-mode][data-color-scheme="purple"] {
    --primary-highlight-color: #6610f2;
    --primary-highlight-background-color: #6610f2;
    --primary-color: #6610f2;
    --primary-color-dark: #520dc2;
    --bs-primary-rgb: 102, 16, 242;
}

/* Orange */
html[data-dark-mode][data-color-scheme="orange"],
[data-bs-theme="dark"][data-color-scheme="orange"],
[data-dark-mode][data-color-scheme="orange"] {
    --primary-highlight-color: #ff6b35;
    --primary-highlight-background-color: #ff6b35;
    --primary-color: #ff6b35;
    --primary-color-dark: #ff4500;
    --bs-primary-rgb: 255, 107, 53;
}

/* Teal */
html[data-dark-mode][data-color-scheme="teal"],
[data-bs-theme="dark"][data-color-scheme="teal"],
[data-dark-mode][data-color-scheme="teal"] {
    --primary-highlight-color: #17a2b8;
    --primary-highlight-background-color: #17a2b8;
    --primary-color: #17a2b8;
    --primary-color-dark: #138496;
    --bs-primary-rgb: 23, 162, 184;
}

/* Red */
html[data-dark-mode][data-color-scheme="red"],
[data-bs-theme="dark"][data-color-scheme="red"],
[data-dark-mode][data-color-scheme="red"] {
    --primary-highlight-color: #dc3545;
    --primary-highlight-background-color: #dc3545;
    --primary-color: #dc3545;
    --primary-color-dark: #c82333;
    --bs-primary-rgb: 220, 53, 69;
}

/* Indigo */
html[data-dark-mode][data-color-scheme="indigo"],
[data-bs-theme="dark"][data-color-scheme="indigo"],
[data-dark-mode][data-color-scheme="indigo"] {
    --primary-highlight-color: #6f42c1;
    --primary-highlight-background-color: #6f42c1;
    --primary-color: #6f42c1;
    --primary-color-dark: #5a32a3;
    --bs-primary-rgb: 111, 66, 193;
}

/* Pink */
html[data-dark-mode][data-color-scheme="pink"],
[data-bs-theme="dark"][data-color-scheme="pink"],
[data-dark-mode][data-color-scheme="pink"] {
    --primary-highlight-color: #e83e8c;
    --primary-highlight-background-color: #e83e8c;
    --primary-color: #e83e8c;
    --primary-color-dark: #d91a72;
    --bs-primary-rgb: 232, 62, 140;
}

/* Cyan */
html[data-dark-mode][data-color-scheme="cyan"],
[data-bs-theme="dark"][data-color-scheme="cyan"],
[data-dark-mode][data-color-scheme="cyan"] {
    --primary-highlight-color: #0dcaf0;
    --primary-highlight-background-color: #0dcaf0;
    --primary-color: #0dcaf0;
    --primary-color-dark: #0aa2c0;
    --bs-primary-rgb: 13, 202, 240;
}

/* Yellow */
html[data-dark-mode][data-color-scheme="yellow"],
[data-bs-theme="dark"][data-color-scheme="yellow"],
[data-dark-mode][data-color-scheme="yellow"] {
    --primary-highlight-color: #ffc107;
    --primary-highlight-background-color: #ffc107;
    --primary-color: #ffc107;
    --primary-color-dark: #e0a800;
    --bs-primary-rgb: 255, 193, 7;
}

/* ============================================
   NUEVOS ESQUEMAS DARK MODE - PASTEL
   ============================================ */

/* Lavender */
html[data-dark-mode][data-color-scheme="lavender"],
[data-bs-theme="dark"][data-color-scheme="lavender"],
[data-dark-mode][data-color-scheme="lavender"] {
    --primary-highlight-color: #b19cd9;
    --primary-highlight-background-color: #b19cd9;
    --primary-color: #b19cd9;
    --primary-color-dark: #9b87f5;
    --bs-primary-rgb: 177, 156, 217;
}

/* Mint */
html[data-dark-mode][data-color-scheme="mint"],
[data-bs-theme="dark"][data-color-scheme="mint"],
[data-dark-mode][data-color-scheme="mint"] {
    --primary-highlight-color: #4ec9b0;
    --primary-highlight-background-color: #4ec9b0;
    --primary-color: #4ec9b0;
    --primary-color-dark: #3da890;
    --bs-primary-rgb: 78, 201, 176;
}

/* Peach */
html[data-dark-mode][data-color-scheme="peach"],
[data-bs-theme="dark"][data-color-scheme="peach"],
[data-dark-mode][data-color-scheme="peach"] {
    --primary-highlight-color: #ff9a6b;
    --primary-highlight-background-color: #ff9a6b;
    --primary-color: #ff9a6b;
    --primary-color-dark: #ff7a4a;
    --bs-primary-rgb: 255, 154, 107;
}

/* Sky Blue */
html[data-dark-mode][data-color-scheme="skyblue"],
[data-bs-theme="dark"][data-color-scheme="skyblue"],
[data-dark-mode][data-color-scheme="skyblue"] {
    --primary-highlight-color: #4da3ff;
    --primary-highlight-background-color: #4da3ff;
    --primary-color: #4da3ff;
    --primary-color-dark: #2d8fff;
    --bs-primary-rgb: 77, 163, 255;
}

/* Rose */
html[data-dark-mode][data-color-scheme="rose"],
[data-bs-theme="dark"][data-color-scheme="rose"],
[data-dark-mode][data-color-scheme="rose"] {
    --primary-highlight-color: #ff8fa3;
    --primary-highlight-background-color: #ff8fa3;
    --primary-color: #ff8fa3;
    --primary-color-dark: #ff6b85;
    --bs-primary-rgb: 255, 143, 163;
}

/* Lilac */
html[data-dark-mode][data-color-scheme="lilac"],
[data-bs-theme="dark"][data-color-scheme="lilac"],
[data-dark-mode][data-color-scheme="lilac"] {
    --primary-highlight-color: #b894d1;
    --primary-highlight-background-color: #b894d1;
    --primary-color: #b894d1;
    --primary-color-dark: #a67bc4;
    --bs-primary-rgb: 184, 148, 209;
}

/* ============================================
   NUEVOS ESQUEMAS DARK MODE - MATE/APAGADOS
   ============================================ */

/* Slate */
html[data-dark-mode][data-color-scheme="slate"],
[data-bs-theme="dark"][data-color-scheme="slate"],
[data-dark-mode][data-color-scheme="slate"] {
    --primary-highlight-color: #475569;
    --primary-highlight-background-color: #475569;
    --primary-color: #475569;
    --primary-color-dark: #334155;
    --bs-primary-rgb: 71, 85, 105;
}

/* Sage */
html[data-dark-mode][data-color-scheme="sage"],
[data-bs-theme="dark"][data-color-scheme="sage"],
[data-dark-mode][data-color-scheme="sage"] {
    --primary-highlight-color: #6b8e5a;
    --primary-highlight-background-color: #6b8e5a;
    --primary-color: #6b8e5a;
    --primary-color-dark: #567448;
    --bs-primary-rgb: 107, 142, 90;
}

/* Dusty Rose */
html[data-dark-mode][data-color-scheme="dustyrose"],
[data-bs-theme="dark"][data-color-scheme="dustyrose"],
[data-dark-mode][data-color-scheme="dustyrose"] {
    --primary-highlight-color: #c49494;
    --primary-highlight-background-color: #c49494;
    --primary-color: #c49494;
    --primary-color-dark: #b38383;
    --bs-primary-rgb: 196, 148, 148;
}

/* Muted Blue */
html[data-dark-mode][data-color-scheme="mutedblue"],
[data-bs-theme="dark"][data-color-scheme="mutedblue"],
[data-dark-mode][data-color-scheme="mutedblue"] {
    --primary-highlight-color: #4a6b8f;
    --primary-highlight-background-color: #4a6b8f;
    --primary-color: #4a6b8f;
    --primary-color-dark: #3d5876;
    --bs-primary-rgb: 74, 107, 143;
}

/* Terracotta */
html[data-dark-mode][data-color-scheme="terracotta"],
[data-bs-theme="dark"][data-color-scheme="terracotta"],
[data-dark-mode][data-color-scheme="terracotta"] {
    --primary-highlight-color: #b86a4f;
    --primary-highlight-background-color: #b86a4f;
    --primary-color: #b86a4f;
    --primary-color-dark: #a55a3f;
    --bs-primary-rgb: 184, 106, 79;
}

/* Olive */
html[data-dark-mode][data-color-scheme="olive"],
[data-bs-theme="dark"][data-color-scheme="olive"],
[data-dark-mode][data-color-scheme="olive"] {
    --primary-highlight-color: #6f7854;
    --primary-highlight-background-color: #6f7854;
    --primary-color: #6f7854;
    --primary-color-dark: #5a6244;
    --bs-primary-rgb: 111, 120, 84;
}

/* ============================================
   NUEVOS ESQUEMAS DARK MODE - MODERNOS/NEUTROS
   ============================================ */

/* Charcoal */
html[data-dark-mode][data-color-scheme="charcoal"],
[data-bs-theme="dark"][data-color-scheme="charcoal"],
[data-dark-mode][data-color-scheme="charcoal"] {
    --primary-highlight-color: #2d3748;
    --primary-highlight-background-color: #2d3748;
    --primary-color: #2d3748;
    --primary-color-dark: #1a202c;
    --bs-primary-rgb: 45, 55, 72;
}

/* Emerald */
html[data-dark-mode][data-color-scheme="emerald"],
[data-bs-theme="dark"][data-color-scheme="emerald"],
[data-dark-mode][data-color-scheme="emerald"] {
    --primary-highlight-color: #059669;
    --primary-highlight-background-color: #059669;
    --primary-color: #059669;
    --primary-color-dark: #047857;
    --bs-primary-rgb: 5, 150, 105;
}

/* Amber */
html[data-dark-mode][data-color-scheme="amber"],
[data-bs-theme="dark"][data-color-scheme="amber"],
[data-dark-mode][data-color-scheme="amber"] {
    --primary-highlight-color: #d97706;
    --primary-highlight-background-color: #d97706;
    --primary-color: #d97706;
    --primary-color-dark: #b45309;
    --bs-primary-rgb: 217, 119, 6;
}

/* Violet */
html[data-dark-mode][data-color-scheme="violet"],
[data-bs-theme="dark"][data-color-scheme="violet"],
[data-dark-mode][data-color-scheme="violet"] {
    --primary-highlight-color: #7c3aed;
    --primary-highlight-background-color: #7c3aed;
    --primary-color: #7c3aed;
    --primary-color-dark: #6d28d9;
    --bs-primary-rgb: 124, 58, 237;
}

/* Navy */
html[data-dark-mode][data-color-scheme="navy"],
[data-bs-theme="dark"][data-color-scheme="navy"],
[data-dark-mode][data-color-scheme="navy"] {
    --primary-highlight-color: #1e40af;
    --primary-highlight-background-color: #1e40af;
    --primary-color: #1e40af;
    --primary-color-dark: #1e3a8a;
    --bs-primary-rgb: 30, 64, 175;
}

/* Coral */
html[data-dark-mode][data-color-scheme="coral"],
[data-bs-theme="dark"][data-color-scheme="coral"],
[data-dark-mode][data-color-scheme="coral"] {
    --primary-highlight-color: #ea580c;
    --primary-highlight-background-color: #ea580c;
    --primary-color: #ea580c;
    --primary-color-dark: #dc2626;
    --bs-primary-rgb: 234, 88, 12;
}


/* =============================================================================
   ESTILOS GLOBALES PARA BOTONES BOOTSTRAP 5.3
   NOTA: Los estilos de botones se movieron a Bootstrap.Buttons.Override.css
   para asegurar que se carguen después de Bootstrap y evitar problemas de caché
   ========================================================================== */

