:root {
    --darker-theme-gray: #4a4d55;
    --darker-theme-black-shade2: #202225;
    --darker-theme-white: #f9fafb;
    --darker-theme-black: #2b2d31;
    --darker-theme-panel-heading: #40434a;
}

.night-mode,
.night-mode .wells,
.night-mode #accmenucontainer .panel-body,
.night-mode #NotificationPaneTableBody,
.night-mode #map-menu,
.night-mode .well,
.night-mode .ersi-search__input-container,
.night-mode .panel-primary,
.night-mode .esri-attribution,
.night-mode .panel {
    background-color: var(--darker-theme-gray);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-black) !important;
}

.night-mode #accmenucontainer .panel-heading,
.night-mode #NotificationPaneTableHeader th,
.night-mode #mapSubInfo,
.night-mode .btn[disabled],
.night-mode input,
.night-mode .selectpicker {
    background-color: var(--darker-theme-black-shade2);
    border-color: var(--darker-theme-black-shade2);
    color: var(--darker-theme-white);
}

.night-mode #mapStyleSelectList {
    background-color: var(--darker-theme-gray);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-gray);
}

.night-mode .dropdown-menu > li > a,
.night-mode .dropdown-menu > li > a,
.night-mode .dropdown-menu,
.night-mode .esri-widget {
    background-color: var(--darker-theme-gray) !important;
    color: var(--darker-theme-white) !important;
}

.night-mode img {
    border-color: var(--darker-theme-gray) !important;
}

.night-mode .btn-default,
.night-mode .btn-group > * {
    color: var(--darker-theme-white) !important;
}

.night-mode .mapMenuTextStyle {
    border-color: var(--darker-theme-gray) !important;
}

.night-mode .navbar-default {
    background-color: var(--darker-theme-gray) !important;
    color: var(--darker-theme-white) !important;
    box-shadow: 0px 2px 7px rgba(16, 22, 26, 0.09);
    border-color: var(--darker-theme-gray) !important;
}

.night-mode .panel-default > .panel-heading {
    background-color: var(--darker-theme-panel-heading);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-black);
}

.night-mode .navbar-default .navbar-nav > li > a,
.night-mode button.close {
    color: var(--darker-theme-white);
}

.night-mode .esri-widget--button,
.night-mode .esri-input,
.night-mode .esri-menu {
    background: var(--darker-theme-black);
    border: 1px solid var(--darker-theme-black);
    color: var(--darker-theme-white);
}

/* 
   .night-mode div:has(.btn-group) {
  background-color: var(--darker-theme-gray);
  color: var(--darker-theme-white);
  border-color: var(--darker-theme-gray) !important;
}
*/

.night-mode #navsettingsapplybutton {
    background-color: var(--darker-theme-black);
    color: var(--darker-theme-white);
}

.night-mode .fashing-notif {
    border: 3px solid red !important;
}

.night-mode .modal-content {
    background-color: var(--darker-theme-gray);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-black);
}

.night-mode #VehicleSearchButton {
    background-color: var(--darker-theme-black);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-black);
}

.night-mode .modal-header {
    background-color: var(--darker-theme-panel-heading);
    border-color: var(--darker-theme-panel-heading);
}

.night-mode legend {
    color: var(--darker-theme-white);
}

.night-mode .btn-default {
    background-color: var(--darker-theme-gray);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-black);
}

.night-mode .btn-group {
    background-color: var(--darker-theme-gray);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-gray);
}

.night-mode .btn-group > * {
    background-color: var(--darker-theme-gray);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-gray);
}

.night-mode .list-group-item {
    background-color: var(--darker-theme-gray);
    color: var(--darker-theme-white);
    border-color: var(--darker-theme-black) !important;
}