@media (max-width:991.98px) {
    .app-header
    .navbar-brand {
        margin-left: -130px;
    }
}

@media (prefers-color-scheme: dark) {
    body,
    footer,
    .bg-light { /* 1 */
        color: #dcd7d3 !important;
        background-color: #000 !important;
    }
    .bg-holiday,
    .timesheet tr:nth-child(1),
    .iframe,
    .form-control,
    .table-striped tbody tr:nth-of-type(odd),
    .select2-container--bootstrap .select2-selection,
    .select2-search__field,
    .select2-container--bootstrap .select2-results__option[aria-selected=true],
    .tab-content .card-header,
    .ui-widget-header.elfinder-workzone-path,
    .ui-widget-header.elfinder-statusbar,
    .datepicker table tr td.highlighted { /* 3 */
        color: #b6afa8 !important;
        background-color: rgb(34, 37, 38) !important;
    }
    .container-fluid > #elfinder,
    .ui-widget-header.elfinder-workzone-path,
    .ui-widget-header.elfinder-statusbar {
        border: none;
    }
    .table-bordered,
    .table-bordered td,
    .table-bordered th {
        border-color: #000 !important;
    }
    #elfinder
    {
        background-color: rgb(34, 37, 38) !important;
    }
    .tab-content .card-header {
        border-bottom: none;
    }
    .table {
        color: #dcd7d3 !important;
    }
    .array-container tbody tr:nth-of-type(even) .form-control {
        background-color: rgb(34, 37, 38) !important;
    }
    .array-container tbody tr:nth-of-type(odd) .form-control {
        background-color: rgb(50, 54, 56) !important;
    }
    .card,
    .bg-white,
    .modal-content,
    .swal-modal,
    .jumbotron,
    .tab-content,
    .nav-tabs .nav-link.active, .nav-tabs .nav-link.active:focus { /* 2 */
        color: #dcd7d3 !important;
        background-color: rgb(21, 22, 23) !important;
    }
    .card.bg-light {
        border-color: rgb(50, 54, 56) !important;
        background-color: rgb(34, 37, 38) !important;
    }
    /*.card.bg-light*/ textarea {
        color: #b6afa8 !important;
        background-color: rgb(50, 54, 56) !important;
    }
    .swal-title, .swal-text {
        color: #dcd7d3 !important;
    }
    .array-row input,
    .table-striped tbody tr:nth-of-type(even),
    .select2-dropdown,
    .tab-content .select2-container--bootstrap .select2-selection,
    .tab-content .select2-search__field,
    .tab-content .form-control,
    .elfinder-workzone,
    .datepicker.dropdown-menu { /* 4 */
        color: #b6afa8 !important;
        background-color: rgb(50, 54, 56) !important;
    }
    .timesheet tr:not(:first-child) {
        color: #b6afa8;
        background-color: rgb(50, 54, 56);
    }
    
    .list-group-item {
        color: #b6afa8;
        background-color: rgb(34, 37, 38);
    }
    #searchSection input
    {
        border-color: rgb(34, 37, 38) !important;
    }
    #searchSection input,
    .list-group-item-secondary {
        color: #b6afa8;
        background-color: rgb(50, 54, 56);
    }
    .list-group-item:hover, .list-group-item:focus {
        color: #b6afa8 !important;
        background-color: rgb(50, 54, 56) !important;
    }
    .list-group-item-success:hover, .list-group-item-success:focus {
        color: white !important;
        background-color: green !important;
    }
    .list-group-item-warning:hover, .list-group-item-warning:focus {
        color: white !important;
        background-color: orange !important;
    }
    .alert-warning,
    .badge-warning,
    .list-group-item-warning {
        color: white;
        background-color: darkorange;
    }
    .alert-success,
    .badge-success,
    .btn-success,
    .list-group-item-success {
        color: white;
        background-color: darkgreen;
    }
    .upload .bg-success
    {
        background-color: darkgreen !important;
    }
    .alert-danger,
    .alert-error,
    .badge-danger {
        color: white;
        background-color: darkred;
    }
    .upload .bg-error
    {
        background-color: darkred !important;
    }
    .alert-info,
    .badge-info,
    .btn-primary,
    .modal-primary,
    .modal-primary .modal-header, 
    .btn-ghost-primary:not(:disabled):not(.disabled).active{
        color: white;
        background-color: darkblue;
    }
    .badge-dark {
        color: white;
        background-color: black;
    }
    .badge-secondary,
    .btn-default {
        color: white;
        background-color:  gray;
    }
    .bg-rejected {
        background-color: darkred !important;
    }
    
    .noty_type__success {
        background-color: darkgreen !important;
    }
    
    .noty_type__error {
        background-color: darkred !important;
    }
}