/* static/css/dark-mode.css */

html.dark-mode,
html.dark-mode body,
body.dark-mode {
    --bs-body-bg: #121212;
    --bs-body-color: #e0e0e0;
    --bs-border-color: #262c36;
    --bs-secondary-bg: #1a1a1a;
    --bs-tertiary-bg: #1c1c1c;
    --bs-card-bg: #1e1e1e;
    --bs-card-border-color: #343a40;
    --bs-form-control-bg: #1e1e1e;
    --bs-link-color: #74c0fc;
    --bs-link-hover-color: #a5d8ff;
    --bs-secondary-color: #adb5bd;
    --bs-hover-bg: #2a2a2a;
    --app-navbar-bg: #161b22;
    --app-navbar-border: #262c36;
    --app-navbar-link-color: #d0d8e6;
    --app-navbar-link-hover-color: #8ec5ff;
    --app-navbar-link-active-color: #8ec5ff;
    --app-navbar-link-active-underline: #58a6ff;
    --app-sidebar-bg: #10141a;
    --app-sidebar-border: #262c36;
    --app-sidebar-link-color: #d0d8e6;
    --app-sidebar-link-hover-bg: rgba(123, 195, 255, 0.18);
    --app-sidebar-link-hover-color: #8ec5ff;
    --app-sidebar-link-active-bg: rgba(31, 111, 235, 0.35);
    --app-sidebar-link-active-color: #f6fbff;
    --app-sidebar-link-active-indicator: #58a6ff;
    --app-divider-color: rgba(255, 255, 255, 0.08);
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
}

html.dark-mode .navbar,
body.dark-mode .navbar {
    background-color: var(--app-navbar-bg) !important;
}

html.dark-mode .sidebar,
body.dark-mode .sidebar {
    background-color: var(--app-sidebar-bg) !important;
}

html.dark-mode .navbar .nav-link,
body.dark-mode .navbar .nav-link {
    color: var(--app-navbar-link-color) !important;
}

html.dark-mode .navbar .nav-link.active,
body.dark-mode .navbar .nav-link.active {
    color: var(--app-navbar-link-active-color) !important;
    background-color: transparent !important;
}

html.dark-mode .navbar .nav-link.active::after,
body.dark-mode .navbar .nav-link.active::after {
    background-color: var(--app-navbar-link-active-underline);
}

html.dark-mode .sidebar .nav-link.active,
body.dark-mode .sidebar .nav-link.active {
    background-color: var(--app-sidebar-link-active-bg) !important;
    color: var(--app-sidebar-link-active-color) !important;
}

html.dark-mode .sidebar .nav-link,
body.dark-mode .sidebar .nav-link {
    color: var(--app-sidebar-link-color) !important;
}

html.dark-mode .sidebar-heading,
body.dark-mode .sidebar-heading {
    color: rgba(224, 230, 240, 0.75);
}

html.dark-mode .sidebar .submenu,
body.dark-mode .sidebar .submenu {
    border-left: 2px solid rgba(88, 166, 255, 0.35);
}

html.dark-mode .support-dashboard .hero-card,
body.dark-mode .support-dashboard .hero-card {
    background: linear-gradient(135deg, #1e293b, #0f172a);
    color: #e2e8f0;
    box-shadow: 0 25px 55px rgba(15, 23, 42, 0.32);
}

html.dark-mode .support-dashboard .hero-copy,
body.dark-mode .support-dashboard .hero-copy {
    color: rgba(226, 232, 240, 0.78);
}

html.dark-mode .support-dashboard .hero-card .btn-light,
body.dark-mode .support-dashboard .hero-card .btn-light {
    color: #1f2937 !important;
}

html.dark-mode .support-dashboard .hero-card .btn-outline-light,
body.dark-mode .support-dashboard .hero-card .btn-outline-light {
    border-color: rgba(255, 255, 255, 0.38);
    color: #f8fafc;
}

html.dark-mode .support-dashboard .stat-card,
body.dark-mode .support-dashboard .stat-card {
    background-color: #1b2433;
    border-color: rgba(148, 163, 184, 0.25);
    box-shadow: none;
}

html.dark-mode .support-dashboard .stat-value,
body.dark-mode .support-dashboard .stat-value {
    color: #f8fafc;
}

html.dark-mode .support-dashboard .support-tile,
body.dark-mode .support-dashboard .support-tile {
    background-color: #1b2535;
    border-color: rgba(148, 163, 184, 0.25);
    color: #e2e8f0;
}

html.dark-mode .support-dashboard .support-tile:hover,
body.dark-mode .support-dashboard .support-tile:hover {
    background-color: #223347;
}

html.dark-mode .support-dashboard .support-tile__description,
body.dark-mode .support-dashboard .support-tile__description {
    color: rgba(148, 163, 184, 0.85);
}

html.dark-mode .support-dashboard .support-activity__item,
body.dark-mode .support-dashboard .support-activity__item {
    border-bottom-color: rgba(148, 163, 184, 0.25);
}

html.dark-mode .form-control,
html.dark-mode .form-select,
body.dark-mode .form-control,
body.dark-mode .form-select {
    background-color: #1e1e1e;
    color: #e0e0e0;
    border-color: #444;
}

html.dark-mode .table,
body.dark-mode .table {
    color: #e0e0e0;
}

html.dark-mode .table-striped tbody tr:nth-of-type(odd),
body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: #2a2a2a;
}

html.dark-mode .table-striped tbody tr:nth-of-type(even),
body.dark-mode .table-striped tbody tr:nth-of-type(even) {
    background-color: #1e1e1e;
}

html.dark-mode input,
html.dark-mode select,
html.dark-mode textarea,
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
    background-color: #1e1e1e;
    color: #e0e0e0;
    border-color: #444;
}

html.dark-mode .btn-secondary,
body.dark-mode .btn-secondary {
    background-color: #333;
    border-color: #555;
    color: #eee;
}

/* Dark mode for Select2 dropdowns */
html.dark-mode .select2-container--default .select2-selection--single,
body.dark-mode .select2-container--default .select2-selection--single {
    background-color: #2c2c2c;
    color: #e0e0e0;
    border-color: #555;
}

html.dark-mode .select2-container--default .select2-selection--multiple,
body.dark-mode .select2-container--default .select2-selection--multiple {
    background-color: #2c2c2c;
    color: #e0e0e0;
    border-color: #555;
}

html.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered,
html.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__rendered,
body.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered,
body.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #e0e0e0;
}

html.dark-mode .select2-dropdown,
body.dark-mode .select2-dropdown {
    background-color: #1f2633;
    color: #f1f3f5;
    border: 1px solid #3c4250;
}

html.dark-mode .select2-results__options,
body.dark-mode .select2-results__options {
    background-color: transparent;
}

html.dark-mode .select2-results__option,
body.dark-mode .select2-results__option {
    color: #f1f3f5;
}

html.dark-mode .select2-results__option[aria-selected="true"],
body.dark-mode .select2-results__option[aria-selected="true"] {
    background-color: #2d3648;
    color: #fff;
}

html.dark-mode .select2-results__option--highlighted[aria-selected],
body.dark-mode .select2-results__option--highlighted[aria-selected] {
    background-color: #3c8bff;
    color: #0b1326;
}

html.dark-mode .select2-search--dropdown .select2-search__field,
body.dark-mode .select2-search--dropdown .select2-search__field {
    background-color: #111826;
    border: 1px solid #3c4250;
    color: #f1f3f5;
}

html.dark-mode .select2-container--default .select2-selection--single .select2-selection__placeholder,
body.dark-mode .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: rgba(255, 255, 255, 0.6);
}

/* Selected choices in multiple select */
html.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice,
body.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #444;
    color: #f0f0f0;
    border: 1px solid #666;
}

/* Remove button inside selected choice */
html.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
body.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #bbb;
}
html.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
body.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #fff;
}