/* Smart Monitor - Dark Mode CSS */

/* Estilos oscuros para el Centro de Monitoreo Inteligente */
body.dark-mode .smart-monitor-container,
body.dark-theme .smart-monitor-container {
    color: var(--text-primary);
}

/* Tarjetas en modo oscuro */
body.dark-mode .smart-monitor-container .card,
body.dark-theme .smart-monitor-container .card {
    background-color: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-mode .smart-monitor-container .card-header,
body.dark-theme .smart-monitor-container .card-header {
    background-color: rgba(0, 0, 0, 0.2);
    border-color: var(--border-color);
}

body.dark-mode .smart-monitor-container .card-footer,
body.dark-theme .smart-monitor-container .card-footer {
    background-color: rgba(0, 0, 0, 0.2);
    border-color: var(--border-color);
}

/* Tarjetas de estadísticas */
body.dark-mode .smart-monitor-container .stat-card,
body.dark-theme .smart-monitor-container .stat-card {
    background-color: var(--card-bg);
    box-shadow: var(--box-shadow);
}

body.dark-mode .smart-monitor-container .stat-title,
body.dark-theme .smart-monitor-container .stat-title {
    color: var(--text-secondary);
}

body.dark-mode .smart-monitor-container .stat-value,
body.dark-theme .smart-monitor-container .stat-value {
    color: var(--text-primary);
}

/* Tabla de facturas */
body.dark-mode .smart-monitor-container .table,
body.dark-theme .smart-monitor-container .table {
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .table td, 
body.dark-mode .smart-monitor-container .table th,
body.dark-theme .smart-monitor-container .table td, 
body.dark-theme .smart-monitor-container .table th {
    border-color: var(--border-color);
    color: var(--text-primary);
}

/* Corrección para sobreescribir estilos Bootstrap de .table */
body.dark-mode .table>:not(caption)>*>*,
body.dark-theme .table>:not(caption)>*>* {
    color: var(--text-primary) !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

body.dark-mode .smart-monitor-container .table thead th,
body.dark-theme .smart-monitor-container .table thead th {
    background-color: rgba(0, 0, 0, 0.2) !important;
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .table-striped tbody tr:nth-of-type(odd),
body.dark-theme .smart-monitor-container .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.1) !important;
}

body.dark-mode .smart-monitor-container .table-hover tbody tr:hover,
body.dark-theme .smart-monitor-container .table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Panel de filtros */
body.dark-mode .smart-monitor-container .filters-panel,
body.dark-theme .smart-monitor-container .filters-panel {
    background-color: rgba(0, 0, 0, 0.2);
}

/* Modos oscuros para los inputs */
body.dark-mode .smart-monitor-container .form-control,
body.dark-theme .smart-monitor-container .form-control,
body.dark-mode .smart-monitor-container .form-select,
body.dark-theme .smart-monitor-container .form-select {
    background-color: rgba(0, 0, 0, 0.2);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .input-group-text,
body.dark-theme .smart-monitor-container .input-group-text {
    background-color: rgba(0, 0, 0, 0.3);
    border-color: var(--border-color);
    color: var(--text-primary);
}

/* Modales */
body.dark-mode .modal-content,
body.dark-theme .modal-content {
    background-color: var(--card-bg);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .modal-header,
body.dark-theme .modal-header,
body.dark-mode .modal-footer,
body.dark-theme .modal-footer {
    border-color: var(--border-color);
}

body.dark-mode .modal .btn-close,
body.dark-theme .modal .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* Timeline en modo oscuro */
body.dark-mode .timeline-container .timeline-content,
body.dark-theme .timeline-container .timeline-content {
    background-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .timeline-item:not(:last-child)::after,
body.dark-theme .timeline-item:not(:last-child)::after {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Botones en modo oscuro */
body.dark-mode .smart-monitor-container .btn-outline-secondary,
body.dark-theme .smart-monitor-container .btn-outline-secondary {
    color: var(--text-secondary);
    border-color: var(--text-secondary);
}

body.dark-mode .smart-monitor-container .btn-outline-secondary:hover,
body.dark-theme .smart-monitor-container .btn-outline-secondary:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--text-primary);
}

/* Score de IA */
body.dark-mode .smart-monitor-container .ia-score-gauge,
body.dark-theme .smart-monitor-container .ia-score-gauge {
    box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.1);
    border-color: var(--border-color);
}

/* Pre y Code para respuesta DGII */
body.dark-mode .smart-monitor-container pre,
body.dark-theme .smart-monitor-container pre {
    background-color: rgba(0, 0, 0, 0.3);
    color: var(--text-primary);
    border-color: var(--border-color);
}

/* Paginación */
body.dark-mode .pagination .page-link,
body.dark-theme .pagination .page-link {
    background-color: var(--card-bg);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .pagination .page-item.active .page-link,
body.dark-theme .pagination .page-item.active .page-link {
    background-color: var(--primary);
    border-color: var(--primary);
    color: white;
}

body.dark-mode .pagination .page-item.disabled .page-link,
body.dark-theme .pagination .page-item.disabled .page-link {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--text-muted);
}

/* DataTables en modo oscuro */
body.dark-mode .dataTables_wrapper,
body.dark-theme .dataTables_wrapper {
    color: var(--text-primary);
}

body.dark-mode .dataTables_length select,
body.dark-theme .dataTables_length select,
body.dark-mode .dataTables_filter input,
body.dark-theme .dataTables_filter input {
    background-color: rgba(0, 0, 0, 0.2);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .dataTables_info,
body.dark-theme .dataTables_info {
    color: var(--text-secondary) !important;
}

body.dark-mode .dataTables_paginate .paginate_button,
body.dark-theme .dataTables_paginate .paginate_button {
    color: var(--text-primary) !important;
}

body.dark-mode .dataTables_paginate .paginate_button.current,
body.dark-theme .dataTables_paginate .paginate_button.current {
    background: var(--primary) !important;
    color: white !important;
    border-color: var(--primary);
}

body.dark-mode .dataTables_paginate .paginate_button:hover,
body.dark-theme .dataTables_paginate .paginate_button:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color);
}

body.dark-mode .dataTables_paginate .paginate_button.disabled,
body.dark-theme .dataTables_paginate .paginate_button.disabled {
    color: var(--text-muted) !important;
}

/* Fixing DataTable search input in dark mode */
body.dark-mode .dataTables_filter input::placeholder,
body.dark-theme .dataTables_filter input::placeholder {
    color: var(--text-muted);
    opacity: 0.7;
}

/* Sobrescritura para las tablas DataTables */
body.dark-mode table.dataTable tbody td,
body.dark-mode table.dataTable tbody th,
body.dark-theme table.dataTable tbody td,
body.dark-theme table.dataTable tbody th {
    color: var(--text-primary) !important;
}

body.dark-mode table.dataTable>tbody>tr.odd>*,
body.dark-theme table.dataTable>tbody>tr.odd>* {
    box-shadow: none !important;
    background-color: rgba(0, 0, 0, 0.1) !important;
}

body.dark-mode table.dataTable>tbody>tr.even>*,
body.dark-theme table.dataTable>tbody>tr.even>* {
    box-shadow: none !important;
    background-color: transparent !important;
}

body.dark-mode table.dataTable>tbody>tr.odd.selected>*,
body.dark-theme table.dataTable>tbody>tr.odd.selected>*,
body.dark-mode table.dataTable>tbody>tr.even.selected>*,
body.dark-theme table.dataTable>tbody>tr.even.selected>* {
    background-color: rgba(78, 115, 223, 0.15) !important;
    color: var(--text-primary) !important;
}

body.dark-mode table.dataTable>tbody>tr:hover>*,
body.dark-theme table.dataTable>tbody>tr:hover>* {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-primary) !important;
}

/* Asegurar que todos los elementos de texto en DataTables son visibles */
body.dark-mode .dataTables_wrapper .dataTables_length,
body.dark-mode .dataTables_wrapper .dataTables_filter,
body.dark-mode .dataTables_wrapper .dataTables_info,
body.dark-mode .dataTables_wrapper .dataTables_processing,
body.dark-mode .dataTables_wrapper .dataTables_paginate,
body.dark-theme .dataTables_wrapper .dataTables_length,
body.dark-theme .dataTables_wrapper .dataTables_filter,
body.dark-theme .dataTables_wrapper .dataTables_info,
body.dark-theme .dataTables_wrapper .dataTables_processing,
body.dark-theme .dataTables_wrapper .dataTables_paginate {
    color: var(--text-primary) !important;
}

/* Specific DataTable dark mode improvements */
body.dark-mode .dataTable.table-striped tbody tr:nth-of-type(odd),
body.dark-theme .dataTable.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.15) !important;
}

body.dark-mode .dataTable.table-hover tbody tr:hover,
body.dark-theme .dataTable.table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .table.dataTable thead th,
body.dark-theme .table.dataTable thead th {
    border-bottom: 1px solid var(--border-color) !important;
    background-color: var(--panel-bg) !important;
}

body.dark-mode .dataTable .progress,
body.dark-theme .dataTable .progress {
    background-color: rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .dataTable td small,
body.dark-theme .dataTable td small {
    color: var(--text-secondary) !important;
}

/* Panel de filtros y detalles */
body.dark-mode .smart-monitor-container .filters-panel,
body.dark-theme .smart-monitor-container .filters-panel {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.2);
}

body.dark-mode .smart-monitor-container .detail-panel,
body.dark-theme .smart-monitor-container .detail-panel {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.2);
}

body.dark-mode .smart-monitor-container .detail-row,
body.dark-theme .smart-monitor-container .detail-row {
    border-color: var(--border-color);
}

body.dark-mode .smart-monitor-container .detail-label,
body.dark-theme .smart-monitor-container .detail-label {
    color: var(--text-secondary);
}

body.dark-mode .smart-monitor-container .detail-value,
body.dark-theme .smart-monitor-container .detail-value {
    color: var(--text-primary);
}

body.dark-mode .card-header,
body.dark-theme .card-header {
    background-color: rgba(0, 0, 0, 0.2) !important;
    border-bottom: 1px solid var(--border-color) !important;
}

body.dark-mode .card-header h5,
body.dark-mode .card-header h4,
body.dark-mode .card-header h3,
body.dark-theme .card-header h5,
body.dark-theme .card-header h4,
body.dark-theme .card-header h3 {
    color: var(--text-primary) !important;
}

body.dark-mode .card-footer,
body.dark-theme .card-footer {
    background-color: rgba(0, 0, 0, 0.2) !important;
    border-top: 1px solid var(--border-color) !important;
}

/* Dropdown y controles adicionales */
body.dark-mode .smart-monitor-container .dropdown-menu,
body.dark-theme .smart-monitor-container .dropdown-menu {
    background-color: var(--card-bg);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .dropdown-item,
body.dark-theme .smart-monitor-container .dropdown-item {
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .dropdown-item:hover,
body.dark-theme .smart-monitor-container .dropdown-item:hover,
body.dark-mode .smart-monitor-container .dropdown-item:focus,
body.dark-theme .smart-monitor-container .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--text-primary);
}

/* Botones de acción */
body.dark-mode .smart-monitor-container .btn-outline-primary,
body.dark-theme .smart-monitor-container .btn-outline-primary,
body.dark-mode .smart-monitor-container .btn-outline-success,
body.dark-theme .smart-monitor-container .btn-outline-success,
body.dark-mode .smart-monitor-container .btn-outline-info,
body.dark-theme .smart-monitor-container .btn-outline-info,
body.dark-mode .smart-monitor-container .btn-outline-warning,
body.dark-theme .smart-monitor-container .btn-outline-warning {
    border-color: currentColor;
}

body.dark-mode .smart-monitor-container .btn-outline-primary:hover,
body.dark-theme .smart-monitor-container .btn-outline-primary:hover,
body.dark-mode .smart-monitor-container .btn-outline-success:hover,
body.dark-theme .smart-monitor-container .btn-outline-success:hover,
body.dark-mode .smart-monitor-container .btn-outline-info:hover,
body.dark-theme .smart-monitor-container .btn-outline-info:hover,
body.dark-mode .smart-monitor-container .btn-outline-warning:hover,
body.dark-theme .smart-monitor-container .btn-outline-warning:hover {
    color: var(--card-bg);
}

/* Lista de alertas */
body.dark-mode .smart-monitor-container .list-group-item,
body.dark-theme .smart-monitor-container .list-group-item {
    background-color: transparent;
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .alerts-container .table,
body.dark-theme .smart-monitor-container .alerts-container .table {
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .alerts-container .table-hover tbody tr:hover,
body.dark-theme .smart-monitor-container .alerts-container .table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Chart legends */
body.dark-mode .apexcharts-legend-text,
body.dark-theme .apexcharts-legend-text {
    color: var(--text-primary) !important;
}

/* Tooltip and chart elements */
body.dark-mode .apexcharts-canvas .apexcharts-tooltip,
body.dark-theme .apexcharts-canvas .apexcharts-tooltip {
    background: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

body.dark-mode .apexcharts-tooltip-title,
body.dark-theme .apexcharts-tooltip-title {
    background: rgba(0, 0, 0, 0.2) !important;
    border-color: var(--border-color) !important;
}

body.dark-mode .apexcharts-tooltip-series-group,
body.dark-theme .apexcharts-tooltip-series-group {
    color: var(--text-primary) !important;
}

body.dark-mode .apexcharts-xaxistooltip,
body.dark-theme .apexcharts-xaxistooltip,
body.dark-mode .apexcharts-yaxistooltip,
body.dark-theme .apexcharts-yaxistooltip {
    background: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* Fix chart background and text */
body.dark-mode .apexcharts-canvas .apexcharts-text,
body.dark-theme .apexcharts-canvas .apexcharts-text {
    fill: var(--text-secondary) !important;
}

body.dark-mode .apexcharts-canvas .apexcharts-grid-borders line,
body.dark-theme .apexcharts-canvas .apexcharts-grid-borders line,
body.dark-mode .apexcharts-canvas .apexcharts-grid line,
body.dark-theme .apexcharts-canvas .apexcharts-grid line {
    stroke: var(--border-color) !important;
}

/* Timeline improvements */
body.dark-mode .timeline-content h6,
body.dark-theme .timeline-content h6 {
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .timeline-container,
body.dark-theme .smart-monitor-container .timeline-container {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.2);
}

body.dark-mode .smart-monitor-container .timeline-content,
body.dark-theme .smart-monitor-container .timeline-content {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-color);
}

body.dark-mode .smart-monitor-container .timeline-content p,
body.dark-theme .smart-monitor-container .timeline-content p {
    color: var(--text-secondary);
}

body.dark-mode .smart-monitor-container .timeline-content::before,
body.dark-theme .smart-monitor-container .timeline-content::before {
    border-right-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .smart-monitor-container .timeline-icon,
body.dark-theme .smart-monitor-container .timeline-icon {
    border: 2px solid var(--card-bg);
    box-shadow: 0 0 0 2px var(--border-color);
}

body.dark-mode .smart-monitor-container .timeline-item:not(:last-child)::after,
body.dark-theme .smart-monitor-container .timeline-item:not(:last-child)::after {
    background-color: var(--border-color);
}

body.dark-mode .smart-monitor-container pre,
body.dark-theme .smart-monitor-container pre {
    background-color: rgba(0, 0, 0, 0.3) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Respuesta DGII específica en modal */
body.dark-mode .smart-monitor-container .respuesta-dgii pre,
body.dark-theme .smart-monitor-container .respuesta-dgii pre {
    background-color: rgba(0, 0, 0, 0.3) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

body.dark-mode .modal-content .bg-light,
body.dark-theme .modal-content .bg-light {
    background-color: var(--panel-bg) !important;
    color: var(--text-primary) !important;
}

/* Status badges en modo oscuro */
body.dark-mode .smart-monitor-container .status-badge,
body.dark-theme .smart-monitor-container .status-badge {
    border: 1px solid var(--border-color);
}

body.dark-mode .smart-monitor-container .status-badge.success,
body.dark-theme .smart-monitor-container .status-badge.success {
    background-color: rgba(40, 167, 69, 0.15);
    color: #75c987;
    border-color: rgba(40, 167, 69, 0.3);
}

body.dark-mode .smart-monitor-container .status-badge.warning,
body.dark-theme .smart-monitor-container .status-badge.warning {
    background-color: rgba(255, 193, 7, 0.15);
    color: #e5c063;
    border-color: rgba(255, 193, 7, 0.3);
}

body.dark-mode .smart-monitor-container .status-badge.danger,
body.dark-theme .smart-monitor-container .status-badge.danger {
    background-color: rgba(220, 53, 69, 0.15);
    color: #e17a85;
    border-color: rgba(220, 53, 69, 0.3);
}

body.dark-mode .smart-monitor-container .status-badge.info,
body.dark-theme .smart-monitor-container .status-badge.info {
    background-color: rgba(23, 162, 184, 0.15);
    color: #70c7d5;
    border-color: rgba(23, 162, 184, 0.3);
}

/* Alert containers en modo oscuro */
body.dark-mode .smart-monitor-container .alert-container,
body.dark-theme .smart-monitor-container .alert-container {
    border: 1px solid var(--border-color);
}

body.dark-mode .smart-monitor-container .alert-container.success,
body.dark-theme .smart-monitor-container .alert-container.success {
    background-color: rgba(40, 167, 69, 0.15);
    color: #75c987;
    border-color: rgba(40, 167, 69, 0.3);
}

body.dark-mode .smart-monitor-container .alert-container.warning,
body.dark-theme .smart-monitor-container .alert-container.warning {
    background-color: rgba(255, 193, 7, 0.15);
    color: #e5c063;
    border-color: rgba(255, 193, 7, 0.3);
}

body.dark-mode .smart-monitor-container .alert-container.danger,
body.dark-theme .smart-monitor-container .alert-container.danger {
    background-color: rgba(220, 53, 69, 0.15);
    color: #e17a85;
    border-color: rgba(220, 53, 69, 0.3);
}

body.dark-mode .smart-monitor-container .alert-container.info,
body.dark-theme .smart-monitor-container .alert-container.info {
    background-color: rgba(23, 162, 184, 0.15);
    color: #70c7d5;
    border-color: rgba(23, 162, 184, 0.3);
}

/* Progress bars en modo oscuro */
body.dark-mode .smart-monitor-container .progress,
body.dark-theme .smart-monitor-container .progress {
    background-color: rgba(0, 0, 0, 0.3);
}

body.dark-mode .smart-monitor-container .progress-bar,
body.dark-theme .smart-monitor-container .progress-bar {
    background-color: var(--primary);
}

/* Toast notifications */
body.dark-mode .smart-monitor-container .toast,
body.dark-theme .smart-monitor-container .toast {
    background-color: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-mode .smart-monitor-container .toast-header,
body.dark-theme .smart-monitor-container .toast-header {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--text-primary);
    border-bottom-color: var(--border-color);
}

/* Tabs navigation */
body.dark-mode .smart-monitor-container .tabs-header,
body.dark-theme .smart-monitor-container .tabs-header {
    border-bottom-color: var(--border-color);
}

body.dark-mode .smart-monitor-container .tab-button,
body.dark-theme .smart-monitor-container .tab-button {
    color: var(--text-secondary);
}

body.dark-mode .smart-monitor-container .tab-button:hover,
body.dark-theme .smart-monitor-container .tab-button:hover {
    color: var(--text-primary);
}

body.dark-mode .smart-monitor-container .tab-button.active,
body.dark-theme .smart-monitor-container .tab-button.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
}