/* Dark Mode Overrides */
body.dark-mode {
    background-color: #121212;
    color: #e0e0e0;
}

body.dark-mode a:link,
body.dark-mode a:visited {
    color: #90caf9;
}

body.dark-mode a:hover {
    color: #bbdefb;
}

body.dark-mode div.header,
body.dark-mode div.header-oefenomgeving {
    background: #1e1e1e;
    border-bottom: 1px solid #333;
}

body.dark-mode div.header-oefenomgeving {
    border-bottom: 2px solid #10ff00;
}

body.dark-mode .header-main {
    color: #e0e0e0;
}

body.dark-mode .header-sub {
    color: #ff5252;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5 {
    color: #81c784;
}

body.dark-mode .prop .sbar-melding,
body.dark-mode .prop .name-report,
body.dark-mode .prop .name-report-gave,
body.dark-mode .prop .label-gave,
body.dark-mode .prop .label-sbar {
    color: #e0e0e0;
}

body.dark-mode .nav,
body.dark-mode .nav_net,
body.dark-mode .nav2 {
    background: #1e1e1e;
    border-color: #333;
}

body.dark-mode .menuButton a,
body.dark-mode .menuButton a.home,
body.dark-mode .menuButton a.list,
body.dark-mode .menuButton a.create,
body.dark-mode .menuButton a.right,
body.dark-mode .menuButton a.maps {
    color: #e0e0e0;
}

body.dark-mode .menuButton a.meldingen_toevoegen_medisch,
body.dark-mode .menuButton a.meldingen_toevoegen_brand,
body.dark-mode .menuButton a.meldingen_toevoegen_logistiek,
body.dark-mode .menuButton a.meldingen_toevoegen_logging {
    background-color: #333;
    color: #e0e0e0;
    border-color: #555;
}

body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
    background-color: #2c2c2c !important;
    color: #e0e0e0 !important;
    border: 1px solid #555 !important;
}

body.dark-mode input.lock,
body.dark-mode textarea.lock {
    background: transparent !important;
    border: 0px solid transparent !important;
}

body.dark-mode input:focus,
body.dark-mode select:focus,
body.dark-mode textarea:focus {
    border-color: #90caf9;
}

body.dark-mode table {
    border-color: #444;
}

body.dark-mode th {
    background: #2c2c2c;
    color: #e0e0e0;
    border-color: #444;
}

body.dark-mode th a:link,
body.dark-mode th a:visited,
body.dark-mode th a:hover {
    color: #e0e0e0;
}

body.dark-mode .odd {
    background-color: #1e1e1e;
}

body.dark-mode .even {
    background-color: #121212;
}

body.dark-mode .list th,
body.dark-mode .list-sitrap th,
body.dark-mode .list-medisch th,
body.dark-mode .list-logistiek th {
    border-color: #444;
}

body.dark-mode .list td,
body.dark-mode .list-rapport th,
body.dark-mode .list-rapport td,
body.dark-mode .list-medisch td,
body.dark-mode .list-logistiek td,
body.dark-mode .list-eenheid td,
body.dark-mode .list-eenheid-scroll td,
body.dark-mode .list-sitrap td {
    border-color: #444;
}

body.dark-mode .list th:hover,
body.dark-mode .list tr:hover {
    background-color: #333;
}

body.dark-mode div.list-eenheden .list th:hover,
body.dark-mode div.list-eenheden .list tr:hover {
     background-color: #333;
}

body.dark-mode .list-eenheid,
body.dark-mode .list-eenheid-scroll {
    background: #1e1e1e;
    border-color: #444;
}

body.dark-mode .paginateButtons {
    background: #1e1e1e;
    border-color: #444;
}

body.dark-mode .paginateButtons a {
    background: #2c2c2c;
    border-color: #444;
    color: #e0e0e0;
}

body.dark-mode .buttons {
    background: #1e1e1e;
    border-color: #444;
}

body.dark-mode .buttons input {
    /* background: #2c2c2c; */
    color: #e0e0e0;
    border-color: #555;
}

body.dark-mode .buttons input:hover {
    background: #3c3c3c;
}

body.dark-mode .prop .value-locatie,
body.dark-mode .prop .value-gebeurtenis,
body.dark-mode .prop .value-aandoening {
    background-color: #4a4a00;
}

body.dark-mode .brandwacht-melding {
    background: #502020 !important;
}

body.dark-mode .message {
    background-color: #1e3a5f;
    border-color: #4fc3f7;
    color: #bbdefb;
}

body.dark-mode div.errors {
    background-color: #4a1c1c;
    border-color: #ff5252;
    color: #ff8a80;
}

/* Theme toggle button styles */
#theme-toggle {
    background: transparent;
    border: none;
    color: #666;
    font-size: 1.5em;
    cursor: pointer;
    padding: 10px;
    margin-top: 15px;
}

body.dark-mode #theme-toggle {
    color: #e0e0e0;
}

#theme-toggle:hover {
    color: #333;
}

body.dark-mode #theme-toggle:hover {
    color: #fff;
}

/* jQuery UI Overrides */
body.dark-mode .ui-widget,
body.dark-mode .ui-widget-content {
    background: #1e1e1e;
    color: #e0e0e0;
    border-color: #444;
}

body.dark-mode .ui-widget-header {
    background: #2c2c2c;
    color: #e0e0e0;
    border-color: #444;
}

body.dark-mode .ui-state-default,
body.dark-mode .ui-widget-content .ui-state-default,
body.dark-mode .ui-widget-header .ui-state-default {
    background: #2c2c2c;
    color: #e0e0e0;
    border-color: #555;
}

body.dark-mode .ui-state-active,
body.dark-mode .ui-widget-content .ui-state-active,
body.dark-mode .ui-widget-header .ui-state-active {
    background: #121212;
    color: #fff;
    border-color: #777;
}

body.dark-mode .ui-state-hover,
body.dark-mode .ui-widget-content .ui-state-hover,
body.dark-mode .ui-widget-header .ui-state-hover,
body.dark-mode .ui-state-focus,
body.dark-mode .ui-widget-content .ui-state-focus,
body.dark-mode .ui-widget-header .ui-state-focus {
    background: #333;
    color: #fff;
    border-color: #666;
}

body.dark-mode .ui-tabs .ui-tabs-panel {
    background: #1e1e1e;
    color: #e0e0e0;
    border-width: 0;
}

/* Custom Modal/Popup Overrides */
body.dark-mode .eenheid-popup {
    background: #2c2c2c !important;
    color: #e0e0e0 !important;
    border-color: #555 !important;
}

body.dark-mode .eenheid-popup p,
body.dark-mode .eenheid-popup li {
    color: #e0e0e0 !important;
}

/* Instellingen Sidebar Panel */
body.dark-mode .homePagePanel .panelBody,
body.dark-mode .homePagePanel .panelTop,
body.dark-mode .homePagePanel .panelBtm {
    background-image: none !important;
    background-color: #1e1e1e !important;
}

body.dark-mode .homePagePanel * {
    color: #e0e0e0;
}

body.dark-mode .homePagePanel h1 {
    color: #8bcc68 !important;
}

body.dark-mode .homePagePanel .panelBody {
    border-left: 1px solid #333;
    border-right: 1px solid #333;
}

body.dark-mode .homePagePanel .panelTop {
    border-top: 1px solid #333;
    border-left: 1px solid #333;
    border-right: 1px solid #333;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

body.dark-mode .homePagePanel .panelBtm {
    border-bottom: 1px solid #333;
    border-left: 1px solid #333;
    border-right: 1px solid #333;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

/* Login Page Overrides */
body.dark-mode #login .inner {
    background-color: #1e1e1e !important;
    border-color: #444 !important;
}

body.dark-mode #login .inner .fheader {
    background-color: #2c2c2c !important;
    color: #e0e0e0 !important;
}

body.dark-mode #login .inner .cssform label {
    color: #e0e0e0;
}