/* === AJUSTES FINOS PARA PRESERVAR COLORES ORIGINALES === */
/* Este archivo se carga después de custom-theme.css para hacer ajustes específicos */

/* === PRESERVAR NAVEGACIÓN Y TÍTULOS === */

/* Forzar preservación de colores originales en elementos de navegación */
.nav-header,
.nav-header *,
.header,
.header *,
.page-titles,
.page-titles *,
.breadcrumb,
.breadcrumb *,
.bc-title {
    color: inherit !important;
}

/* Preservar títulos h1-h6 con sus colores originales */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    color: #3f3f3f !important;
}

/* Asegurar que elementos específicos no sobrescriban títulos */
.card-title,
.card-header h1,
.card-header h2,
.card-header h3,
.card-header h4,
.card-header h5,
.card-header h6,
.widget-stat h1,
.widget-stat h2,
.widget-stat h3,
.widget-stat h4,
.widget-stat h5,
.widget-stat h6 {
    color: inherit !important;
}

/* === RESTAURAR NAVEGACIÓN LATERAL ORIGINAL === */

/* Preservar colores en la navegación lateral EXCEPTO elementos activos */
.deznav .metismenu a {
    color: #737B8B !important;
}

/* RESTAURAR el color aqua original para elementos activos */
.deznav .metismenu > li.mm-active > a,
.deznav .metismenu > li:hover > a,
.deznav .metismenu > li:focus > a,
.deznav .metismenu ul a:hover,
.deznav .metismenu ul a:focus,
.deznav .metismenu ul a.mm-active {
    color: var(--primary) !important;
}

/* Preservar iconos y elementos SVG en navegación activa */
.deznav .metismenu > li.mm-active > a .menu-icon svg path,
.deznav .metismenu > li:hover > a .menu-icon svg path,
.deznav .metismenu > li:focus > a .menu-icon svg path {
    stroke: var(--primary) !important;
}

.deznav .metismenu > li.mm-active > a g [fill],
.deznav .metismenu > li:hover > a g [fill],
.deznav .metismenu > li:focus > a g [fill] {
    fill: var(--primary) !important;
}

/* Preservar colores de fondo para elementos activos */
.deznav .metismenu > li.mm-active > a {
    background-color: rgba(25, 188, 185, 0.05) !important;
}

/* Preservar estilo compacto para iconos activos */
[data-sidebar-style="compact"] .deznav .metismenu > li.mm-active > a i {
    background: var(--primary) !important;
    color: #fff !important;
}

/* Preservar títulos de menú */
.deznav .metismenu .menu-title {
    color: var(--primary) !important;
}

/* === OTROS ELEMENTOS DE NAVEGACIÓN === */

/* Preservar colores en header-profile y elementos similares */
.header-profile *,
.nav-user *,
.header-right * {
    color: inherit !important;
}

/* Preservar notificaciones y dropdowns del header */
.notification_dropdown *,
.dropdown-toggle::after {
    color: inherit !important;
}

/* === PRESERVAR ICONOS EN BOTONES === */

/* Asegurar que los iconos en botones mantengan colores apropiados */
.btn i,
.btn svg,
.btn .fa,
.btn .fas,
.btn .far,
.btn .fab,
.btn .fal,
.btn .fad {
    color: inherit !important;
    fill: inherit !important;
}

/* Iconos específicos en botones de colores claros */
.btn-light i,
.btn-light svg,
.btn-warning i,
.btn-warning svg {
    color: #666666 !important;
}

/* === DROPDOWNS Y MENÚS === */

/* Preservar colores originales en dropdowns */
.dropdown-menu,
.dropdown-menu *,
.dropdown-item,
.dropdown-header {
    color: inherit !important;
}

/* Excepto cuando específicamente queremos nuestros colores */
.dropdown-item:hover,
.dropdown-item:focus {
    color: var(--primary) !important;
    background-color: var(--rgba-primary-1) !important;
}

/* === CARDS Y CONTENIDO === */

/* Preservar colores de texto en cards excepto enlaces específicos */
.card-header,
.card-body,
.card-footer,
.card-title,
.card-text {
    color: inherit !important;
}

/* Solo aplicar nuestros colores en contextos muy específicos */
.card .btn-link,
.alert .alert-link {
    color: var(--primary) !important;
}

/* === TABLAS === */

/* Preservar colores originales en tablas */
.table th,
.table td,
.table-responsive,
.dataTable th,
.dataTable td {
    color: inherit !important;
}

/* === FORMULARIOS === */

/* Preservar labels y textos de formulario */
.form-label,
.form-text,
.form-check-label,
.input-group-text {
    color: inherit !important;
}

/* === PAGINACIÓN Y NAVEGACIÓN === */

/* Solo aplicar colores en elementos interactivos de paginación */
/* Usando especificidad alta para sobrescribir Bootstrap que se carga después */
.pagination .page-link {
    color: var(--primary) !important;
}

.pagination .page-link:hover,
.pagination .page-link:focus {
    color: white !important;
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
}

.pagination .page-item.active .page-link,
.pagination .page-item.active .page-link:hover,
.pagination .page-item.active .page-link:focus {
    color: white !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* === TABS Y NAVEGACIÓN === */

/* Preservar colores originales excepto estados activos */
.nav-tabs .nav-link {
    color: inherit !important;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover {
    color: var(--primary) !important;
}

.nav-pills .nav-link.active {
    background-color: var(--primary) !important;
    color: white !important;
}

/* === BREADCRUMBS ESPECÍFICOS === */

/* Asegurar que los breadcrumbs mantengan su estilo original */
.breadcrumb-item a {
    color: inherit !important;
    text-decoration: none !important;
}

.breadcrumb-item.active a {
    color: inherit !important;
}

/* === COLORES DE ESTADO EN CONTEXTOS ESPECÍFICOS === */

/* Solo aplicar colores de estado donde realmente los necesitamos */
.alert .text-primary { color: var(--primary-dark) !important; }
.alert .text-success { color: var(--success-dark) !important; }
.alert .text-danger { color: var(--danger-dark) !important; }
.alert .text-info { color: var(--info-dark) !important; }

/* === EXCEPCIONES PARA ELEMENTOS ESPECÍFICOS DEL TEMPLATE === */

/* Preservar colores en elementos específicos del template w3crm */
.profile-info h4,
.profile-info h5,
.profile-info .h4,
.profile-info .h5,
.widget-stat h3,
.widget-stat .h3,
.widget-media .media-body h5,
.widget-media .media-body .h5 {
    color: inherit !important;
}

/* === UTILIDADES FINALES === */

/* Clase para forzar preservar color original cuando sea necesario */
.preserve-color,
.preserve-color * {
    color: inherit !important;
}

/* Clase para aplicar color primary específicamente cuando se necesite */
.force-primary-color {
    color: var(--primary) !important;
}

.force-primary-color:hover {
    color: var(--primary-hover) !important;
}

/* === BOTÓN DE AYUDA EN SIDEBAR === */

/* Solo asegurar que el texto sea blanco y visible */
.help-desk .btn-primary {
    color: white !important;
}

.help-desk .btn-primary:hover,
.help-desk .btn-primary:focus {
    color: white !important;
}

/* === REGLAS ESPECIALES PARA SOBRESCRIBIR BOOTSTRAP TARDÍO === */

/* Paginación con máxima especificidad para forzar sobre Bootstrap 5.3+ */
body .pagination .page-item.active .page-link,
body .pagination .page-item.active .page-link:hover,
body .pagination .page-item.active .page-link:focus,
body .pagination .page-item.active .page-link:active {
    color: white !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    z-index: 1 !important;
}

/* Asegurar que no se sobrescriba el color del texto */
body .pagination .page-item.active > .page-link {
    color: white !important;
}

/* Regla de respaldo con ID si es necesario */
#main-wrapper .pagination .page-item.active .page-link {
    color: white !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* === REGLAS ULTRA ESPECÍFICAS PARA CASOS EXTREMOS === */

/* Forzar color blanco con todas las combinaciones posibles */
html body .pagination .page-item.active .page-link,
html body .pagination .page-item.active .page-link:visited,
html body .pagination .page-item.active .page-link:link,
html body .pagination .page-item.active .page-link:hover,
html body .pagination .page-item.active .page-link:focus,
html body .pagination .page-item.active .page-link:active {
    color: #ffffff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* Regla con atributo para máxima especificidad */
.pagination .page-item.active[class] .page-link[class] {
    color: #ffffff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* Regla con pseudo-elementos si es necesario */
.pagination .page-item.active .page-link::before,
.pagination .page-item.active .page-link::after {
    color: inherit !important;
}

/* Forzar con especificidad de ID + clase */
body[class] .pagination .page-item.active .page-link {
    color: #ffffff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* === TRUCO DE ESPECIFICIDAD EXTREMA === */

/* Usar :not() para aumentar especificidad sin cambiar funcionalidad */
.pagination .page-item.active:not(.fake-class) .page-link:not(.fake-class) {
    color: #ffffff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* Regla con múltiples :not() para especificidad máxima */
.pagination .page-item.active:not(.x):not(.y) .page-link:not(.x):not(.y) {
    color: #ffffff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* Última opción: usar style attribute simulation */
.pagination .page-item.active .page-link[style*=""], 
.pagination .page-item.active .page-link:not([style*="color: #"]) {
    color: #ffffff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* === SOLUCIÓN DE RESPALDO JAVASCRIPT === */
/*
Si el CSS no funciona, agregar este script al final del HTML:

<script>
document.addEventListener('DOMContentLoaded', function() {
    function forceWhiteTextOnActivePagination() {
        const activePageLinks = document.querySelectorAll('.pagination .page-item.active .page-link');
        activePageLinks.forEach(link => {
            link.style.setProperty('color', '#ffffff', 'important');
            link.style.setProperty('background-color', '#19BCB9', 'important');
            link.style.setProperty('border-color', '#19BCB9', 'important');
        });
    }
    
    // Ejecutar inmediatamente
    forceWhiteTextOnActivePagination();
    
    // Ejecutar después de un pequeño delay por si hay cambios dinámicos
    setTimeout(forceWhiteTextOnActivePagination, 100);
    setTimeout(forceWhiteTextOnActivePagination, 500);
});
</script>
*/