@media (prefers-color-scheme: dark) {
    body {
        background: #001423;
        color: #eeeeee;
    }

    #slay-contentContainer {
        box-shadow: none;
        border: 1px solid #25384f;
        color: #eeeeee;
        background: linear-gradient(270deg, #00f2d400, #00f2d41a), #001423;
    }

    #slay-contentContainer, #jTimeout-timer, #slay-userMenuDropdown, .dropdown-menu {
        font-family: "Inter", system-ui, sans-serif;
        font-feature-settings: normal;
        font-variant-ligatures: none;
        font-size: .95rem;
    }

    .slay-header {
        background-image: linear-gradient(#50627e 0%, #002a35 90%);
        box-shadow: none; /*0 0 0 1px #151f2c;*/
    }

    #slay-footer,
    #slay-footer ul.navbar-nav li.nav-item a {
        color: #eeeeee;
        font-weight: bold;
    }

    #slay-footer .slay-rightFooter {
        color: #eeeeee;
        font-weight: normal;
    }

    .close {
        color: #eeeeee;
    }
    .close:hover {
        color: #eee;
    }

    /* TOP-RIGHT USER MENU */
    .dropdown-menu {
        border-color: #25384f;
        background-color: #182433;
    }
    .dropdown-menu .dropdown-item, .dropdown-menu .dropdown-header {
        color: #eeeeee !important;
    }
    .dropdown-menu .dropdown-item:hover {
        background-color: #25384f !important;
    }

    /* LINKS */
    a, a:visited {
        color: #aabb2a;
    }
    a, a:hover, a:visited {
        font-weight: normal;
        text-decoration: none !important;
    }
    a:hover {
        color: #cde051;
    }

    /* BUTTONS */
    .btn-success, a.btn-success {
        color: #111111;
        background-color: #8e9c23
    }
    .btn-success:hover, a.btn-success:hover {
        color: #111111;
        background-color: #aabb2a;
    }

    .btn-primary, a.btn-primary {
        color: #eeeeee;
        background-color: #314a72;
    }
    .btn-primary:hover, a.btn-primary:hover {
        color: #eeeeee;
        background-color: #3d5d8f;
    }

    .btn-secondary, a.btn-secondary {
        color: #eeeeee;
        background-color: #182433;
    }
    .btn-secondary:hover, a.btn-secondary:hover {
        color: #eeeeee;
        background-color: #25384f;
    }

    /* TOGGLER */
    span.f-toggler {
        background-color: #444 !important;
    }
    span.f-toggler:hover {
        background-color: #5e5e5e !important;
    }

    span.f-toggler.false {
        background-color: #9f2727 !important;
    }
    span.f-toggler.false:hover {
        background-color: #c43232 !important;
    }

    span.f-toggler.true {
        background-color: #138514 !important;
    }
    span.f-toggler.true:hover {
        background-color: #179b18 !important;
    }

    /* NAVIGATION */
    .slay-leftMenuHeadlineContainer .slay-leftMenuHeadline {
        background: #002a35 !important;
        color: #eeeeee !important;
    }

    div.leftMenu ul.nav-pills li.nav-item {
        background-color: unset !important;
        border: unset;
    }

    div.leftMenu ul.nav-pills li.nav-item a.nav-link,
    div.leftMenu ul.nav-pills li.nav-item a.nav-link.active {
        border-top: unset;
        color: #eeeeee;
        background-color: #001423;
        padding-top: 0.4rem;
        padding-bottom: 0.4rem;
    }

    div.leftMenu ul.nav-pills li.nav-item a.nav-link:hover {
        background-color: #25384f;
        border-radius: 0.25rem;
    }
    div.leftMenu ul.nav-pills li.nav-item a.nav-link.active {
        /*background-color: #25384f;*/
        color: #aabb2a;
    }

    div.leftMenu > ul.nav-pills > li.nav-item {
        border: 1px solid #25384f !important;
        /*padding: 3px;*/
    }
    div.leftMenu > ul.nav-pills > li.nav-item > a.nav-link {
        padding-left: 19px;
    }
    div.leftMenu > ul.nav-pills > li.nav-item > a.nav-link.active {
        margin-left: 3px;
        padding-left: 16px;
        background-color: #25384f !important;
    }
    div.leftMenu > ul.nav-pills > li.nav-item:has(a.nav-link.active) {
        /*padding: 3px;*/
        box-shadow: /* left "inner border" */ inset 3px 0 0 0 #aabb2a,
            /* right "inner border" */ inset -1px 0 0 0 #25384f,
            /* top "inner border" */ inset 0 1px 0 0 #25384f,
            /* bottom "inner border" */ inset 0 -1px 0 0 #25384f;
    }
    div.leftMenu > ul.nav-pills > li.nav-item:has(a.nav-link.active) > ul {
        margin-left: 3px !important;
    }


    /* CARDS */
    .card {
        border-color: #25384f;
        background-color: #182433;
    }

    .card .card-header {
        background-color: #25384f;
        padding: 0.25rem 0.5rem 0.25rem 0.5rem;
        text-align: center;
    }
    .card .card-header:has(.nav) {
        padding: 0 0.6rem 0.75rem 0.6rem;
        text-align: unset !important;
        border-bottom: 1px solid #25384f;
        background-color: #182433;
    }
    .card-header .nav .nav-item .nav-link {
        color: #eeeeee;
        background-color: #001423;
        margin: 4px 0 1px 5px;
        border: unset;
    }
    .card-header .nav .nav-item .nav-link:hover {
        background-color: #25384f;
    }
    .card-header .nav .nav-item .nav-link.active {
        color: #aabb2a;
        background-color: #25384f;
        /*background-image: linear-gradient(#001423 90%, #25384f 100%);*/
    }

    /* TABLES / DATATABLES */
    table, table.dataTables_wrapper, #slay-contentContainer table.dataTable {
        /*background: linear-gradient(180deg, #00f2d400, #00f2d41a), #001423;*/
        border: 1px solid #25384f !important;
        border-collapse: collapse !important;
    }

    div.dataTables_wrapper div.dataTables_processing {
        color: #eee;
        background: linear-gradient(to right, rgba(0, 51, 61,0.75) 0%, rgba(0, 51, 61, 0.95) 25%, rgba(0, 51, 61, 0.95) 75%, rgba(0, 51, 61,0.75) 100%);
        /*border-color: #80c2be !important;*/
        border-color: #aabb2a !important;
        /*box-shadow: rgba(220, 225, 231, 0.06) 0px 1px 1px 0px, rgba(0, 242, 212, 0.25) 0px 0px 0px 4px;*/
    }

    table th, .dataTables_wrapper table.dataTable thead th {
        color: #eee;
        background-color: #001423 !important;
        border: 1px solid #25384f !important;
    }

    table tr {
        color: #eee;
        border: 1px solid #25384f !important;
    }
    table tr td {
        border-top: none !important;
        padding: 5px 8px;
    }
    table tr th {
        padding: 5px 8px;
    }

    .dataTables_wrapper table.dataTable tbody tr.odd {
        background-color: rgba(0, 242, 212, .05) !important;
        border: 1px solid #25384f !important;
    }

    .dataTables_wrapper table.dataTable tbody tr.even {
        background-color: #001423 !important;
        border: 1px solid #25384f !important;
    }

    .dataTables_wrapper .dataTables_info {
        color: #eeeeee !important;
    }

    .dataTables_wrapper .dataTables_paginate .pagination .page-item.active .page-link {
        background-color: #25384f;
        color: #aabb2a;
        font-weight: bold;
    }
    .dataTables_wrapper .dataTables_paginate .pagination .page-item .page-link {
        border: 1px solid #25384f !important;
        color: #eeeeee;
        background-color: #001423;
        text-decoration: none !important;
    }
    .dataTables_wrapper .dataTables_paginate .pagination .page-item .page-link:hover {
        background-color: #25384f;
    }
    .dataTables_wrapper .dataTables_paginate .pagination .page-item .page-link:focus {
        box-shadow: none;
    }


    /* FORMS */
    *:focus {
        outline: none;
    }

    input::placeholder, textarea::placeholder, select::placeholder {
        color: #999999 !important;
    }

    input:not([class*="btn"]), textarea, select,
    .form-control, .f-field,
    .select2-container--default .select2-selection--single,
    .select2-search--dropdown .select2-search__field {
        /*color: #8a97ab !important;*/
        color: #eeeeee !important;
        background-color: #151f2c !important;
        border-color: #25384f !important;
    }

    input:focus, textarea:focus, select:focus,
    .form-control:focus,
    .select2-search--dropdown .select2-search__field:focus,
    .switch input:focus + label::before {
        color: #8a97ab;
        background-color: #151f2c;
        /*border-color: #80c2be !important;*/
        /*box-shadow: rgba(220, 225, 231, 0.06) 0px 1px 1px 0px, rgba(0, 242, 212, 0.25) 0px 0px 0px 4px;*/
        border-color: #aabb2a !important;
        box-shadow: rgba(220, 225, 231, 0.06) 0px 1px 1px 0px, rgba(170, 187, 42, 0.25) 0px 0px 0px 4px !important;
    }

    /* select2 */
    .select2-container *:focus {
        outline: none;
    }

    .select2-container .select2-dropdown {
        background-color: #151f2c !important;
        border-color: #25384f !important;
    }

    .select2-container .selection .select2-selection .select2-selection__rendered {
        color: #eeeeee;
        line-height: unset !important;
    }
    .select2-container .selection .select2-selection .select2-selection__clear {
        margin-left: 8px;
        font-size: larger;
        line-height: 1.3rem;
    }

    .select2-container .select2-selection--multiple .select2-selection__choice {
        background-color: #25384f !important;
        /*background-color: #5897fb !important;*/
        color: #eeeeee;
        border-color: #25384f !important;
    }
    .select2-container .select2-results__option--highlighted[aria-selected] {
        background-color: #25384f !important;
        color: #eeeeee;
    }
    .select2-container--default .select2-results__option[aria-selected="true"] {
        background-color: #25384f !important;
        color: #eeeeee;
    }

    .select2-container .selection .select2-selection {
        background-color: #151f2c !important;
        color: #eeeeee;
        border-color: #25384f !important;
    }

    /* checkbox */
    .switch input + label::before {
        color: #eeeeee !important;
        background-color: #151f2c !important;
        border: 2px solid #25384f;
    }
    .switch input + label::after {
        background-color: #446688 !important;
    }
    .switch.switch-sm input + label::after {
        width: calc(calc(1.9375rem * .6) - calc(2px * 2)) !important;
        height: calc(calc(1.9375rem * .6) - calc(2px * 2)) !important;
    }
    .switch input + label::after {
        top: 5px !important;
        left: 6px !important;
    }
    .switch.switch-sm input:checked + label::after {
        margin-left: calc(1.9375rem * .75) !important;

    }

    /* ALERTS */
    .alert {
        border-color: #80c2be;
    }

    .alert-info, .alert-warning, .alert-danger {
        background-color: #182433;
        border-color: #25384f;
    }

    .alert-info {
        color: #4299e1;
        border-left: 4px solid #4299e1;
    }

    .alert-warning {
        color: #ff9000; /*#f76707;*/
        border-left: 4px solid #ff9000; /*#f76707;*/
    }

    .alert-danger {
        color: #d63939;
        border-left: 4px solid #d63939;
    }

    /* MODALS */
    .modal-backdrop.show {
        opacity: 0.7;
    }

    .modal-content {
        /*background: linear-gradient(180deg,#00f2d400,#00f2d41a),#001423;*/
        /*background-color: #182433;*/
        color: #eeeeee;
        background-color: #001423;
        border: 1px solid #25384f;
    }

    .modal-footer {
        color: #eeeeee;
        border-top: 1px solid #25384f;
    }
    .modal-header {
        color: #eeeeee;
        border-bottom: 1px solid #25384f;
    }

    /* DATEPICKER */
    .datepicker table tr td.day:hover {
        background-color: #25384f !important;
    }

}