[data-theme='dark'] {
    --bg-color: #0f172a;           /* Darker, richer blue-black */
    --sidebar-bg: #1e293b;        /* Slightly lighter than bg */
    --topbar-bg: #1e293b;
    --card-bg: #1e293b;
    --surface-light: #ffffff;
    --surface-light-border: #ced4da;
    --surface-light-text: #111827;
    --text-color: #f8fafc;        /* Brighter white for better contrast */
    --text-muted: #cbd5e1;        /* Brighter muted text */
    --border-color: #334155;      /* More visible but subtle border */
    --input-bg: #0f172a;
    --input-border: #475569;
    --table-hover: #334155;
    --primary-accent: #38bdf8;    /* Light blue for accents */
}

[data-theme='dark'] body {
    background-color: var(--bg-color) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #wrapper,
[data-theme='dark'] #content-wrapper,
[data-theme='dark'] #content,
[data-theme='dark'] #page-wrapper {
    background-color: var(--bg-color) !important;
}

[data-theme='dark'] .navbar.topbar,
[data-theme='dark'] .navbar.bg-white {
    background-color: var(--topbar-bg) !important;
    border-bottom: 1px solid var(--border-color) !important;
}

[data-theme='dark'] .sidebar,
[data-theme='dark'] .bg-gradient-primary {
    background-color: var(--sidebar-bg) !important;
    background-image: none !important;
}

[data-theme='dark'] .sidebar .nav-item .nav-link,
[data-theme='dark'] .sidebar .sidebar-heading {
    color: var(--text-muted) !important;
}

[data-theme='dark'] .sidebar .nav-item.active .nav-link,
[data-theme='dark'] .sidebar .nav-item .nav-link:hover {
    color: var(--text-color) !important;
}

[data-theme='dark'] .card,
[data-theme='dark'] .panel {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.1) !important;
}

[data-theme='dark'] .card-header,
[data-theme='dark'] .panel-heading {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] .card-header h6, 
[data-theme='dark'] .card-body .h5,
[data-theme='dark'] .m-0.font-weight-bold.text-primary {
    color: var(--primary-accent) !important;
}

[data-theme='dark'] .table {
    color: var(--text-color) !important;
}

[data-theme='dark'] .table td,
[data-theme='dark'] .table th,
[data-theme='dark'] .table tbody td,
[data-theme='dark'] .table tbody th {
    color: var(--text-color) !important;
}

[data-theme='dark'] .table thead th {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-bottom: 2px solid var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] .table-bordered,
[data-theme='dark'] .table-bordered > thead > tr > th,
[data-theme='dark'] .table-bordered > tbody > tr > th,
[data-theme='dark'] .table-bordered > tfoot > tr > th,
[data-theme='dark'] .table-bordered > thead > tr > td,
[data-theme='dark'] .table-bordered > tbody > tr > td,
[data-theme='dark'] .table-bordered > tfoot > tr > td {
    border-color: var(--border-color) !important;
}

[data-theme='dark'] .table-hover tbody tr:hover {
    background-color: var(--table-hover) !important;
}

[data-theme='dark'] #reports .report-body .list-group-item,
[data-theme='dark'] #reports .report-body .list-group-item:hover,
[data-theme='dark'] #reports .report-body .list-group-item:focus {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #reports .report-body .table,
[data-theme='dark'] #reports .report-body .table th,
[data-theme='dark'] #reports .report-body .table td,
[data-theme='dark'] #reports .report-body .table-responsive {
    background-color: transparent !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] .form-control,
[data-theme='dark'] select,
[data-theme='dark'] textarea {
    background-color: var(--input-bg) !important;
    border-color: var(--input-border) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #v-time-from,
[data-theme='dark'] #v-time-to,
[data-theme='dark'] #v-time-from.form-control,
[data-theme='dark'] #v-time-to.form-control {
    color: var(--text-color) !important;
    -webkit-text-fill-color: var(--text-color) !important;
}

[data-theme='dark'] #id_event_type,
[data-theme='dark'] #id_event_type.form-control,
[data-theme='dark'] #id_event_type option,
[data-theme='dark'] #id_time_range,
[data-theme='dark'] #id_email,
[data-theme='dark'] #id_plate_number {
    background-color: var(--input-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--input-border) !important;
}

[data-theme='dark'] .form-control:focus {
    border-color: var(--primary-accent) !important;
    box-shadow: 0 0 0 0.2rem rgba(56, 189, 248, 0.25) !important;
}

[data-theme='dark'] .bootstrap-datetimepicker-widget,
[data-theme='dark'] .bootstrap-datetimepicker-widget table td,
[data-theme='dark'] .bootstrap-datetimepicker-widget table th,
[data-theme='dark'] .bootstrap-datetimepicker-widget .timepicker-hour,
[data-theme='dark'] .bootstrap-datetimepicker-widget .timepicker-minute,
[data-theme='dark'] .bootstrap-datetimepicker-widget .timepicker-picker,
[data-theme='dark'] .bootstrap-datetimepicker-widget a,
[data-theme='dark'] .bootstrap-datetimepicker-widget span {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme='dark'] input.login-field,
[data-theme='dark'] input.password-field {
    background-color: var(--surface-light) !important;
    border-color: var(--surface-light-border) !important;
    color: var(--surface-light-text) !important;
}

[data-theme='dark'] input.login-field::placeholder,
[data-theme='dark'] input.password-field::placeholder {
    color: #6b7280 !important;
}

[data-theme='dark'] input.login-field:focus,
[data-theme='dark'] input.password-field:focus {
    background-color: var(--surface-light) !important;
    border-color: var(--primary-accent) !important;
    color: var(--surface-light-text) !important;
}

[data-theme='dark'] label {
    color: var(--text-color) !important;
}

[data-theme='dark'] .text-gray-800,
[data-theme='dark'] h1, 
[data-theme='dark'] h2, 
[data-theme='dark'] h3, 
[data-theme='dark'] h4, 
[data-theme='dark'] h5, 
[data-theme='dark'] h6 {
    color: var(--text-color) !important;
}

[data-theme='dark'] .text-gray-600,
[data-theme='dark'] .text-muted,
[data-theme='dark'] .small,
[data-theme='dark'] p.text-muted {
    color: var(--text-muted) !important;
}

[data-theme='dark'] .dropdown-menu {
    background-color: var(--sidebar-bg) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4) !important;
}

[data-theme='dark'] .dropdown-item,
[data-theme='dark'] .dropdown-menu > li > a {
    color: var(--text-color) !important;
}

[data-theme='dark'] .dropdown-item:hover,
[data-theme='dark'] .dropdown-menu > li > a:hover {
    background-color: var(--table-hover) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] .dropdown-divider {
    border-top: 1px solid var(--border-color) !important;
}

[data-theme='dark'] .border-left-primary { border-left-color: #4e73df !important; }
[data-theme='dark'] .border-left-success { border-left-color: #1cc88a !important; }
[data-theme='dark'] .border-left-info { border-left-color: #36b9cc !important; }
[data-theme='dark'] .border-left-warning { border-left-color: #f6c23e !important; }

[data-theme='dark'] .footer {
    background-color: var(--topbar-bg) !important;
    border-top: 1px solid var(--border-color) !important;
    color: var(--text-muted) !important;
}

[data-theme='dark'] .modal-content {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] .popover,
[data-theme='dark'] .popover-body,
[data-theme='dark'] .popover-header,
[data-theme='dark'] .editable-container.popover {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] .popover .arrow::before,
[data-theme='dark'] .bs-popover-top > .arrow::before,
[data-theme='dark'] .bs-popover-right > .arrow::before,
[data-theme='dark'] .bs-popover-bottom > .arrow::before,
[data-theme='dark'] .bs-popover-left > .arrow::before {
    border-top-color: var(--border-color) !important;
    border-right-color: var(--border-color) !important;
    border-bottom-color: var(--border-color) !important;
    border-left-color: var(--border-color) !important;
}

[data-theme='dark'] .popover .arrow::after,
[data-theme='dark'] .bs-popover-top > .arrow::after,
[data-theme='dark'] .bs-popover-right > .arrow::after,
[data-theme='dark'] .bs-popover-bottom > .arrow::after,
[data-theme='dark'] .bs-popover-left > .arrow::after {
    border-top-color: var(--card-bg) !important;
    border-right-color: var(--card-bg) !important;
    border-bottom-color: var(--card-bg) !important;
    border-left-color: var(--card-bg) !important;
}

[data-theme='dark'] .editable-container input,
[data-theme='dark'] .editable-container .form-control,
[data-theme='dark'] .editable-input input {
    background-color: var(--input-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--input-border) !important;
}

[data-theme='dark'] #test_stream_results_popup pre,
[data-theme='dark'] #log {
    background-color: rgba(15, 23, 42, 0.65) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme='dark'] #test_complete_status_success,
[data-theme='dark'] #test_complete_status_fail {
    background: var(--card-bg) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #test_complete_status_success p,
[data-theme='dark'] #test_complete_status_success span,
[data-theme='dark'] #test_complete_status_success h2,
[data-theme='dark'] #test_complete_status_fail p,
[data-theme='dark'] #test_complete_status_fail span,
[data-theme='dark'] #test_complete_status_fail h2,
[data-theme='dark'] #test_complete_status_fail .error_message,
[data-theme='dark'] #webhook_test_results,
[data-theme='dark'] #test_complete_status_fail .message_content {
    color: var(--text-color) !important;
}

[data-theme='dark'] #test_complete_status_fail pre {
    background-color: rgba(15, 23, 42, 0.65) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme='dark'] .modal-header {
    border-bottom: 1px solid var(--border-color) !important;
}

[data-theme='dark'] .modal-footer {
    border-top: 1px solid var(--border-color) !important;
}

[data-theme='dark'] .close {
    color: var(--text-color) !important;
    text-shadow: none !important;
    opacity: 0.8 !important;
}

[data-theme='dark'] .close:hover {
    opacity: 1 !important;
}

[data-theme='dark'] .btn-link {
    color: var(--primary-accent) !important;
}

[data-theme='dark'] .btn.btn-default,
[data-theme='dark'] .btn.btn-default.bg-white,
[data-theme='dark'] .bootstrap-select > .dropdown-toggle.btn-default {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] .btn.btn-default:hover,
[data-theme='dark'] .btn.btn-default:focus,
[data-theme='dark'] .btn.btn-default:active,
[data-theme='dark'] .btn.btn-default.bg-white:hover,
[data-theme='dark'] .btn.btn-default.bg-white:focus,
[data-theme='dark'] .btn.btn-default.bg-white:active,
[data-theme='dark'] .bootstrap-select > .dropdown-toggle.btn-default:hover,
[data-theme='dark'] .bootstrap-select > .dropdown-toggle.btn-default:focus,
[data-theme='dark'] .bootstrap-select.open > .dropdown-toggle.btn-default {
    background-color: var(--table-hover) !important;
    border-color: var(--primary-accent) !important;
    color: var(--text-color) !important;
    box-shadow: none !important;
}

[data-theme='dark'] .btn.btn-default .caret,
[data-theme='dark'] .bootstrap-select > .dropdown-toggle .caret {
    border-top-color: var(--text-muted) !important;
}

[data-theme='dark'] .bg-light {
    background-color: #1e293b !important;
}

[data-theme='dark'] #alertToastContainer .toast,
[data-theme='dark'] #alertToastContainer .toast-body {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #alertToastContainer .toast-body strong,
[data-theme='dark'] #alertToastContainer .alert-plate,
[data-theme='dark'] #alertToastContainer .alert-site,
[data-theme='dark'] #alertToastContainer .alert-hotlist {
    color: var(--text-color) !important;
}

[data-theme='dark'] #alertToastContainer .toast-header {
    border-bottom-color: var(--border-color) !important;
}

[data-theme='dark'] #alertToastContainer .alert-region.badge-secondary {
    background-color: var(--table-hover) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #result_panel .card-header-tabs a {
    background: rgba(255, 255, 255, 0.03) !important;
    border-bottom-color: var(--border-color) !important;
    color: var(--text-muted) !important;
}

[data-theme='dark'] #result_panel .card-header-tabs .resultpanellink a {
    background: var(--card-bg) !important;
    border-bottom-color: var(--card-bg) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #result_panel .resultpanellink,
[data-theme='dark'] #result_panel .resultpanellink a,
[data-theme='dark'] #result_panel #nav-menu > li > a {
    color: var(--text-color) !important;
}

[data-theme='dark'] #result_panel {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

[data-theme='dark'] #result_panel .card-header {
    background: transparent !important;
}

[data-theme='dark'] #result_panel .card-body,
[data-theme='dark'] #result-panel-content {
    background: var(--card-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme='dark'] #alert_list > tr:not(.hot-alert-row):not(.selected-alert-row) {
    background-color: rgba(148, 163, 184, 0.08) !important;
}

[data-theme='dark'] #alert_list > tr:not(.hot-alert-row):not(.selected-alert-row) > th,
[data-theme='dark'] #alert_list > tr:not(.hot-alert-row):not(.selected-alert-row) > td,
[data-theme='dark'] #alert_list > tr:not(.hot-alert-row):not(.selected-alert-row) a {
    color: var(--text-muted) !important;
}

[data-theme='dark'] #alert_table tbody > tr:hover,
[data-theme='dark'] #search_table tbody > tr:hover,
[data-theme='dark'] #alert_list > tr:hover,
[data-theme='dark'] #search_results > tr:hover {
    background-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme='dark'] #alert_table tbody > tr:hover > th,
[data-theme='dark'] #alert_table tbody > tr:hover > td,
[data-theme='dark'] #search_table tbody > tr:hover > th,
[data-theme='dark'] #search_table tbody > tr:hover > td,
[data-theme='dark'] #alert_list > tr:hover > th,
[data-theme='dark'] #alert_list > tr:hover > td,
[data-theme='dark'] #search_results > tr:hover > th,
[data-theme='dark'] #search_results > tr:hover > td,
[data-theme='dark'] #alert_table tbody > tr:hover a,
[data-theme='dark'] #search_table tbody > tr:hover a,
[data-theme='dark'] #alert_list > tr:hover a,
[data-theme='dark'] #search_results > tr:hover a {
    color: var(--text-color) !important;
}

[data-theme='dark'] .leaflet-control-container .btn.btn-default,
[data-theme='dark'] .leaflet-control-container .btn.btn-default.bg-white,
[data-theme='dark'] .leaflet-control-container .bootstrap-select > .dropdown-toggle.btn-default,
[data-theme='dark'] .leaflet-control-container .filter-button {
    background-color: var(--surface-light) !important;
    border-color: var(--surface-light-border) !important;
    color: var(--surface-light-text) !important;
}

[data-theme='dark'] .leaflet-control-container .btn.btn-default:hover,
[data-theme='dark'] .leaflet-control-container .btn.btn-default:focus,
[data-theme='dark'] .leaflet-control-container .btn.btn-default:active,
[data-theme='dark'] .leaflet-control-container .bootstrap-select > .dropdown-toggle.btn-default:hover,
[data-theme='dark'] .leaflet-control-container .bootstrap-select > .dropdown-toggle.btn-default:focus,
[data-theme='dark'] .leaflet-control-container .bootstrap-select.open > .dropdown-toggle.btn-default,
[data-theme='dark'] .leaflet-control-container .filter-button:hover,
[data-theme='dark'] .leaflet-control-container .filter-button:focus,
[data-theme='dark'] .leaflet-control-container .filter-button:active {
    background-color: var(--surface-light) !important;
    border-color: var(--surface-light-border) !important;
    color: var(--surface-light-text) !important;
    box-shadow: none !important;
}

[data-theme='dark'] .leaflet-control-layers-expanded,
[data-theme='dark'] .leaflet-control-layers-expanded label,
[data-theme='dark'] .leaflet-control-layers-expanded label:hover,
[data-theme='dark'] .leaflet-control-layers-expanded label span {
    color: var(--surface-light-text) !important;
}

[data-theme='dark'] #cloud_api_demo .demo_initial_overlay,
[data-theme='dark'] #cloud_api_demo .upload_form_label,
[data-theme='dark'] #cloud_api_demo .demo_preview_info,
[data-theme='dark'] #cloud_api_demo .demo_preview_info .demo_info_header,
[data-theme='dark'] #cloud_api_demo .demo_preview_info .demo_info_value {
    color: var(--text-color) !important;
}

[data-theme='dark'] #cloud_api_demo .demo_preview_img_container {
    background-color: var(--input-bg) !important;
}

[data-theme='dark'] #cloud_api_demo .demo_initial_overlay {
    border-color: var(--border-color) !important;
}

[data-theme='dark'] .nav-tabs .nav-link:not(.active):not(.disabled) {
    background-color: #e5e7eb !important;
    border-color: #d1d5db !important;
    color: #111827 !important;
}

[data-theme='dark'] .nav-tabs .nav-link:not(.active):not(.disabled):hover,
[data-theme='dark'] .nav-tabs .nav-link:not(.active):not(.disabled):focus {
    background-color: #f3f4f6 !important;
    border-color: #d1d5db !important;
    color: #111827 !important;
}

[data-theme='dark'] #results-table tbody td,
[data-theme='dark'] #results-table tbody td strong {
    color: var(--text-color) !important;
}

[data-theme='dark'] #platetable tbody td,
[data-theme='dark'] #platetable tbody td span,
[data-theme='dark'] #platetable tbody td div,
[data-theme='dark'] #platetable tbody td strong {
    color: var(--text-color) !important;
}

[data-theme='dark'] .dataTables_info,
[data-theme='dark'] .dataTables_wrapper .dataTables_info,
[data-theme='dark'] .dataTables_paginate,
[data-theme='dark'] .dataTables_wrapper .dataTables_paginate {
    color: var(--text-color) !important;
}

[data-theme='dark'] #main-title,
[data-theme='dark'] #main-title.text-primary,
[data-theme='dark'] .main-box-header,
[data-theme='dark'] .main-box-header .int-title-name {
    color: var(--text-color) !important;
}

[data-theme='dark'] .vp-info {
    background-color: var(--card-bg) !important;
    border-color: var(--primary-accent) !important;
}

[data-theme='dark'] .vp-info__title,
[data-theme='dark'] .vp-info__text,
[data-theme='dark'] .vp-info__text-d,
[data-theme='dark'] .vp-info__item,
[data-theme='dark'] .m-infi-box {
    color: var(--text-color) !important;
}

[data-theme='dark'] .alert_marker_popup .leaflet-popup-content-wrapper,
[data-theme='dark'] .alert_marker_popup .leaflet-popup-tip,
[data-theme='dark'] .popupCustom .leaflet-popup-content-wrapper,
[data-theme='dark'] .popupCustom .leaflet-popup-tip,
[data-theme='dark'] #alert-pupup-card,
[data-theme='dark'] #alert-popup-card-body {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
}

[data-theme='dark'] #alert-popup-card-body,
[data-theme='dark'] #alert-popup-card-body .card-title,
[data-theme='dark'] #alert-popup-card-body .card-text,
[data-theme='dark'] #alert-popup-card-body dt,
[data-theme='dark'] #alert-popup-card-body dd,
[data-theme='dark'] #alert-popup-card-body .text_platenumber,
[data-theme='dark'] #alert-popup-card-body .text_time,
[data-theme='dark'] #alert-popup-card-body .text_alertlist,
[data-theme='dark'] #alert-popup-card-body .text_site,
[data-theme='dark'] #alert-popup-card-body .text_camera,
[data-theme='dark'] #alert-popup-card-body .text_description,
[data-theme='dark'] #alert-popup-card-body .text_state_province {
    color: var(--text-color) !important;
}

.dark-mode-toggle {
    cursor: pointer;
    padding: 0 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    color: #5a5c69;
    transition: all 0.2s;
}

[data-theme='dark'] .dark-mode-toggle {
    color: #f6c23e;
}

.dark-mode-toggle:hover {
    color: #4e73df;
    transform: scale(1.1);
}
