/* folios.css - Estilos específicos para la tabla de folios y compatibilidad estricta con Modo Oscuro */

.dataTables_wrapper {
    color: var(--color-dark) !important;
    margin-top: 1.5rem;
}

/* Forzar que los textos laterales e inputs de DataTables se adapten al contraste */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    color: var(--color-dark) !important;
}

.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
    background-color: var(--color-white);
    color: var(--color-dark);
    border: 2px solid var(--border-input);
    border-radius: var(--border-radius-1);
    padding: 4px 8px;
    outline: none;
}

/* Estilización base de la Tabla */
table.dataTable {
    background-color: transparent !important; /* Permitir que se vea el fondo del contenedor de la queja */
    border-collapse: collapse !important;
    margin: 1.5rem 0 !important;
    width: 100% !important;
}

table.dataTable thead th {
    background-color: var(--color-primary) !important;
    color: #ffffff !important;
    border-bottom: 3px solid var(--color-accent) !important;
    padding: 12px !important;
}

/* Ajuste del encabezado en Modo Oscuro */
[data-theme="dark"] table.dataTable thead th {
    background-color: #1e293b !important;
}

/* Corregir visibilidad de filas y celdas (Mitiga el error de la captura) */
table.dataTable tbody tr,
table.dataTable tbody tr.odd,
table.dataTable tbody tr.even {
    background-color: transparent !important; /* Rompe el fondo blanco alternado por defecto de DataTables */
}

table.dataTable tbody td {
    background-color: var(--color-white) !important; /* Sigue las variables CSS dinámicas de quejas.css */
    color: var(--color-dark) !important; /* Forzar el texto oscuro en tema claro y claro en tema oscuro */
    border: 1px solid var(--border-input) !important;
    padding: 10px !important;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Efecto Hover adaptativo al pasar el mouse por encima */
table.dataTable tbody tr:hover td {
    background-color: var(--color-background) !important;
    color: var(--color-dark) !important;
}

/* Paginadores */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--color-dark) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--color-primary) !important;
    color: white !important;
    border: 1px solid var(--color-primary) !important;
}