/*
 * Dark Mode Fixes for Merlin Flow
 * Ensures all components properly support dark mode
 */

/* Dark mode variables */
[data-bs-theme="dark"] {
    --bs-body-bg: #1a1d29;
    --bs-body-color: #e2e8f0;
    --bs-card-bg: #2d3142;
    --bs-card-border-color: #3d4152;
    --bs-border-color: #3d4152;
    --bs-secondary-bg: #2d3142;
    --bs-tertiary-bg: #252837;
}

/* Card components in dark mode */
[data-bs-theme="dark"] .card {
    background-color: var(--bs-card-bg);
    border-color: var(--bs-card-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .card-header {
    background-color: rgba(255, 255, 255, 0.05);
    border-bottom-color: var(--bs-card-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .card-body {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .card-title {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .card-text {
    color: var(--bs-body-color);
}

/* Chart containers and performance widgets */
[data-bs-theme="dark"] .chart-container {
    background-color: var(--bs-card-bg);
    border: 1px solid var(--bs-card-border-color);
    border-radius: 0.375rem;
}

[data-bs-theme="dark"] .performance-widget {
    background-color: var(--bs-card-bg);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .performance-widget h3,
[data-bs-theme="dark"] .performance-widget h4,
[data-bs-theme="dark"] .performance-widget h5,
[data-bs-theme="dark"] .performance-widget h6 {
    color: var(--bs-body-color);
}

/* Statistics cards */
[data-bs-theme="dark"] .stats-card {
    background-color: var(--bs-card-bg);
    border-color: var(--bs-card-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .stats-card .stats-title {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .stats-card .stats-value {
    color: var(--bs-body-color);
}

/* DataTables dark mode */
[data-bs-theme="dark"] .dataTables_wrapper {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_info,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_processing {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter input {
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length select {
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .table-dark {
    --bs-table-bg: var(--bs-card-bg);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
    --bs-table-hover-bg: rgba(255, 255, 255, 0.075);
    --bs-table-border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

/* Pagination in dark mode */
[data-bs-theme="dark"] .pagination .page-link {
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .pagination .page-link:hover {
    background-color: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .pagination .page-item.active .page-link {
    background-color: #3b82f6;
    border-color: #3b82f6;
    color: white;
}

/* Form controls in dark mode */
[data-bs-theme="dark"] .form-control {
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .form-control:focus {
    background-color: var(--bs-secondary-bg);
    border-color: #3b82f6;
    color: var(--bs-body-color);
    box-shadow: 0 0 0 0.25rem rgba(59, 130, 246, 0.25);
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: #94a3b8;
}

[data-bs-theme="dark"] .form-select {
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

/* Button groups and filters */
[data-bs-theme="dark"] .btn-group .btn {
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .btn-outline-secondary {
    color: var(--bs-body-color);
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .btn-outline-secondary:hover {
    background-color: var(--bs-secondary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

/* Chart.js canvas backgrounds */
[data-bs-theme="dark"] canvas {
    background-color: transparent;
}

/* Performance chart specific fixes */
[data-bs-theme="dark"] .performance-chart-container {
    background-color: var(--bs-card-bg);
    border-radius: 0.375rem;
    padding: 1rem;
}

[data-bs-theme="dark"] .chart-legend {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .chart-title {
    color: var(--bs-body-color);
}

/* Ticket status badges in dark mode */
[data-bs-theme="dark"] .badge {
    color: white;
}

[data-bs-theme="dark"] .badge.bg-secondary {
    background-color: #6c757d !important;
}

[data-bs-theme="dark"] .badge.bg-success {
    background-color: #198754 !important;
}

[data-bs-theme="dark"] .badge.bg-warning {
    background-color: #fd7e14 !important;
}

[data-bs-theme="dark"] .badge.bg-danger {
    background-color: #dc3545 !important;
}

[data-bs-theme="dark"] .badge.bg-info {
    background-color: #0dcaf0 !important;
}

[data-bs-theme="dark"] .badge.bg-primary {
    background-color: #0d6efd !important;
}

/* Alert components */
[data-bs-theme="dark"] .alert {
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .alert-info {
    background-color: rgba(13, 202, 240, 0.1);
    border-color: rgba(13, 202, 240, 0.2);
    color: #0dcaf0;
}

[data-bs-theme="dark"] .alert-success {
    background-color: rgba(25, 135, 84, 0.1);
    border-color: rgba(25, 135, 84, 0.2);
    color: #198754;
}

[data-bs-theme="dark"] .alert-warning {
    background-color: rgba(253, 126, 20, 0.1);
    border-color: rgba(253, 126, 20, 0.2);
    color: #fd7e14;
}

[data-bs-theme="dark"] .alert-danger {
    background-color: rgba(220, 53, 69, 0.1);
    border-color: rgba(220, 53, 69, 0.2);
    color: #dc3545;
}

/* Modal components */
[data-bs-theme="dark"] .modal-content {
    background-color: var(--bs-card-bg);
    border-color: var(--bs-card-border-color);
}

[data-bs-theme="dark"] .modal-header {
    border-bottom-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .modal-footer {
    border-top-color: var(--bs-border-color);
}

/* Dropdown menus */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--bs-card-bg);
    border-color: var(--bs-card-border-color);
}

[data-bs-theme="dark"] .dropdown-item {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: var(--bs-secondary-bg);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .dropdown-divider {
    border-top-color: var(--bs-border-color);
}

/* List groups */
[data-bs-theme="dark"] .list-group-item {
    background-color: var(--bs-card-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .list-group-item:hover {
    background-color: var(--bs-secondary-bg);
}

/* Progress bars */
[data-bs-theme="dark"] .progress {
    background-color: var(--bs-secondary-bg);
}

/* Tooltips and popovers */
[data-bs-theme="dark"] .tooltip .tooltip-inner {
    background-color: var(--bs-card-bg);
    color: var(--bs-body-color);
    border: 1px solid var(--bs-border-color);
}

[data-bs-theme="dark"] .popover {
    background-color: var(--bs-card-bg);
    border-color: var(--bs-card-border-color);
}

[data-bs-theme="dark"] .popover-body {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .popover-header {
    background-color: var(--bs-secondary-bg);
    border-bottom-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

/* Text colors */
[data-bs-theme="dark"] .text-muted {
    color: #94a3b8 !important;
}

[data-bs-theme="dark"] .text-secondary {
    color: #94a3b8 !important;
}

/* Border utilities */
[data-bs-theme="dark"] .border {
    border-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .border-top {
    border-top-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .border-bottom {
    border-bottom-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .border-start {
    border-left-color: var(--bs-border-color) !important;
}

[data-bs-theme="dark"] .border-end {
    border-right-color: var(--bs-border-color) !important;
}

/* Background utilities */
[data-bs-theme="dark"] .bg-light {
    background-color: var(--bs-secondary-bg) !important;
}

[data-bs-theme="dark"] .bg-white {
    background-color: var(--bs-card-bg) !important;
}

/* Fix for specific dashboard elements */
[data-bs-theme="dark"] .dashboard-card {
    background-color: var(--bs-card-bg);
    border-color: var(--bs-card-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .dashboard-card .card-title {
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .performance-title {
    color: var(--bs-body-color) !important;
}

/* Fix for chart containers */
[data-bs-theme="dark"] .chart-container,
[data-bs-theme="dark"] .performance-chart {
    background-color: var(--bs-card-bg);
    color: var(--bs-body-color);
}

/* Fix for any remaining white backgrounds */
[data-bs-theme="dark"] .bg-body-tertiary {
    background-color: var(--bs-tertiary-bg) !important;
}

[data-bs-theme="dark"] .bg-body-secondary {
    background-color: var(--bs-secondary-bg) !important;
}