﻿
@media (prefers-color-scheme: light) {
    :root {
        --primary: #fff;
        --secondary: f9f9f9;
        --light: #fff;
        --dark: #222;
        --font: #666;
        --light-font: #ddd;
        --dark-font: #666;
        --link: #666;
        --hover: #D89328;
        --accent: #DB792C;
        --highlight: #fcf8e4;
        --highlight-hover: #e6e6e5;
        --border: #cccccc;
        --well: #f5f5f5;
        --addon: #eeeeee;
        --addon-border: #cccccc;
        --info: #d9edf6;
        --breadcrumb: #f5f5f5;
        --breadcrumb-active: #747774;
        --list-item: #ffffff;
        --list-item-border: #dedcdc;
        --list-item-hover: #f5f5f5;
        --list-item-parent: #fcf8e4;
        --list-item-parent-hover: #f5f5f5;
        --warning: #fcf8e4;
        --warning-hover: #e6e6e5;
        --card-heading: #f5f5f5;
        --card-heading-border: #dddddd;
        --card-border: #dedede;
        --invert: 0%;
        --project-header: #EEEEEE;
        --project-footer: #EEEEEE;
        --modal-body: #ffffff;
        --sub-menu-bg: #f5f5f5;
        --sub-menu-link: #666666;
        --sub-menu-hover: #DB792C;
        --nav-tab: #ffffff;
        --nav-tab-active: #ffffff;
        --nav-tab-hover: #eeeeee;
        --nav-tab-border: #dddddd;
        --tab-pane: #c0c0c0;
        --boxed-fade: #dddddd;
        --form: #fff;
        --form-border: #cccccc;
        --separator-bar: #009bfc;
        --CAES-bg: #fff;
        --inactive-item: #666666;
        --deleted-item: #666666;
        --chosen-search-highlight-color: #ffffff;
        --chosen-search-highlight-bg: #dc7b38;
        --badge-primary: #0d6efd;
        --staff-bg1: #f9f9f9;
        --staff-bg2: #dedcdc;
    }
}

@media (prefers-color-scheme: dark) {
    :root {
        --primary: #2b2b2b;
        --secondary: #333333;
        --light: #fff;
        --dark: #222;
        --font: #dddddd;
        --dark-font: #666;
        --light-font: #666;
        --link: #DB792C;
        --hover: #D89328;
        --accent: #DB792C;
        --highlight: #4a4a4a;
        --highlight-hover: #747474;
        --border: #666666;
        --well: #333333;
        --addon: #2b2b2b;
        --addon-border: #000;
        --info: #374c56;
        --breadcrumb: #666666;
        --breadcrumb-active: #d9d9d9;
        --list-item: #4a4a4a;
        --list-item-border: #cccccc;
        --list-item-hover: #747474;
        --list-item-parent: #6b6b6b;
        --list-item-parent-hover: #222;
        --warning: #2b2b2b;
        --warning-hover: #333333;
        --card-heading: #333333;
        --card-heading-border: #000000;
        --card-border: #000000;
        --invert: 100%;
        --project-header: #4a4a4a;
        --project-footer: #4a4a4a;
        --modal-body: #4a4a4a;
        --sub-menu-bg: #515151;
        --sub-menu-link: #f2f2f2;
        --sub-menu-hover: #DB792C;
        --nav-tab: #333333;
        --nav-tab-active: #808080;
        --nav-tab-hover: #666666;
        --nav-tab-border: #111111;
        --tab-pane: #000;
        --boxed-fade: #222;
        --form: #222;
        --form-border: #000000;
        --separator-bar: #07325a;
        --CAES-bg: #555555;
        --inactive-item: #666666;
        --deleted-item: #666666;
        --chosen-search-highlight-color: #ffffff;
        --chosen-search-highlight-bg: #dc7b38;
        --badge-primary: #0d6efd;
        --staff-bg1: #2b2b2b;
        --staff-bg2: #333333;
    }
}

ul.chosen-results > li.active-result em, ul.chosen-results > li.no-results {
    background-color: var(--chosen-search-highlight-bg) !important;
    color: var(--chosen-search-highlight-color) !important;
}

.form-control, .form-select, .bootstrap-tagsinput, .chosen-select, .chosen-single, .chosen-choices, .chosen-drop, .chosen-results, .tt-menu, .tt-suggestion, .tt-selectable, input,
ul.formbuilder-autocomplete-list > li, .input-control, button.dt-button, .ui-menu, .ui-menu-item, .ui-menu-item-wrapper, input[role="combobox"], div.ts-control {
    background-color: var(--form) !important;
    color: var(--font) !important;
    border-color: var(--form-border) !important;
}

.form-elements, .form-elements > div, .field-options, .field-options > div, .form-wrap.form-builder .frmb .sortable-options > li {
    background-color: var(--form) !important;
    color: var(--font) !important;
    border-color: var(--form-border) !important;
    background: var(--secondary) !important;
}



.sortable-options {
    border-color: var(--form-border) !important;
}

li.form-field, label.field-label {
    background-color: var(--secondary) !important;
    color: var(--font) !important;
}

tr.info > td, tr.even.info > td, tr.odd.info > td {
    color: var(--light-font) !important;
    background-color: #d9edf6!important;
}

h6.admin{
    color:var(--dark-font);
}

.input-control:hover {
    background-color: var(--nav-tab-hover) !important;
}

div.note-editable, div.note-resizebar {
    background-color: var(--form) !important;
    color: var(--font) !important;
}

div.tab-content {
    border-radius: 0px 5px 5px 5px!important;
}
div.select-tab {
    background: var(--primary) !important;
    border:none!important;
}
div.tab-pane{
    color:var(--tab-pane)!important;
}
ul.nav-tabs {
    background: var(--primary) !important;
    border: none !important;
}

div.tab-pane > div > div > span {
    color: var(--font) !important;
}


.nav-tabs > li.nav-item > a.active,
.nav-tabs > li.nav-item > a.active:focus {
    color: var(--font) !important;
    background-color: var(--nav-tab-hover) !important;
    border-top: 1px solid var(--nav-tab-border) !important;
    border-left: 1px solid var(--nav-tab-border) !important;
    border-right: 1px solid var(--nav-tab-border) !important;
    border-bottom: transparent !important;
}

.select-tab-content {
    background-color: var(--nav-tab-hover) !important;
    border-top: transparent !important;
    border-left: 1px solid var(--nav-tab-border) !important;
    border-right: 1px solid var(--nav-tab-border) !important;
    border-bottom: 1px solid var(--nav-tab-border) !important;
}

.nav > li > a:hover {
    background-color: var(--nav-tab-hover) !important;
    border: 1px solid transparent !important;
}


.boxed {
    box-shadow: 0px 0px 5px 3px var(--boxed-fade);
}
div.private{
    color: var(--font);
}


.staff-row h2 {
    color: var(--font) !important;
}

.note-palette-title, .note-color-reset, .note-color-palette {
    color: var(--dark) !important;
}

.wrap-alt {
    background: var(--secondary) !important;
}

.list-box:disabled{
    color:var(--dark)!important;
}

.btn-warning{
    background: var(--accent) !important;
    color: var(--light) !important;
}

.btn-warning:hover{
    background: var(--hover) !important;
}

.btn-danger, btn-success{
    color:var(--light)!important;
}

body  {
    color: var(--font);
    background: var(--primary);
}
.card-body, .card, .bg-light {
    color: var(--font)!important;
    background: var(--secondary)!important;
}


a:not(.btn, .no-link, .chosen-single, .list-group-item) {
    text-decoration: underline !important;
}
a.btn, a.no-link, a.chosen-single, a.list-group-item, ul.dropdown-menu > li > a{
    text-decoration: none !important;
}



    body a, .card-body a:not(.btn-danger):not(.btn-success){
        color: var(--link);
    }
    body a:hover, .card-body a:hover:not(.btn-danger):not(.btn-success) {
        color: var(--hover);
    }
    body a:focus, .card-body a:focus:not(.btn-danger):not(.btn-success) {
        color: var(--hover);
    }

.showme-content h3 a {
    color: var(--font);
}

.showme-content h3 a:hover {
    color: var(--hover);
}

.showmelist h2 {
    color: var(--font);
}

.showmelist .container p {
    color: var(--font);
}

.counter {
    color: var(--font);
}

h4.counter_title {
    color: var(--font);
}

.partners h2 {
    color: var(--font);
}

.partners .container p {
    color: var(--font);
}
.slick-list{
    background: var(--light)
}
.researchers .container h2 {
    color: var(--font);
    background: var(--primary);
}
.researchers .container p {
    color: var(--font);
    background: var(--primary);
}
.work-list .container h2{
    color: var(--light);
}
.work-list .container p {
    color: var(--light);
}
#page-content h1 {
    color: var(--font) !important;
}
#page-content h2 {
    color: var(--font) !important;
}
#page-content h3 {
    color: var(--font) !important;
}
legend {
    color: var(--font) !important;
}
#page-content li span {
    color: var(--font) !important;
}
#page-content a {
    background: var(--primary) !important;
}
#page-content a.btn {
    color: var(--light) !important;
    background: var(--accent) !important;
}
#page-content a.btn span{
    color: var(--light) !important;
    background: var(--accent) !important;
}
tr.odd, tr:nth-child(even) {
    color: var(--font) !important;
    background: var(--secondary) !important;
}
tr.even, th.sorting, tr:nth-child(odd) {
    color: var(--font) !important;
    background: var(--primary) !important;
}

table.dataTable > thead > th:nth-child(odd), table.dataTable > thead > tr:nth-child(odd), table.dataTable > tbody > tr:nth-child(odd), table.table.dataTable > :not(caption) > * > *, .table > :not(caption) > * > * {
    color: var(--font) !important;
    background: var(--primary) !important;
}

table.dataTable > thead > th:nth-child(even), table.dataTable > thead > tr:nth-child(even), table.dataTable > tbody > tr:nth-child(even) {
    color: var(--font) !important;
    background: var(--secondary) !important;
}


.table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th,
.table-bordered {
    border-color: var(--border) !important;
}
#cardbody, .popover-content {
    background: var(--primary) !important;
}
.card-heading, .popover-title {
    background: var(--card-heading) !important;
    border-color: var(--card-heading-border) !important;
    color: var(--font) !important;
}
.card-header {
    background: var(--card-heading) !important;
    border-color: var(--card-heading-border) !important;
    color: var(--font) !important;
}
.card-footer{
    background:var(--secondary);
    border-top:var(--primary)
}
.card{
    border-color:var(--card-border)!important;
}

.popover {
    background: var(--card-heading) !important;
    border-color: var(--card-heading-border) !important;
}

.breadcrumb {
    background: var(--breadcrumb) !important;
    color: var(--font) !important;
    border-color: var(--list-item-border) !important;
}
ol.breadcrumb > li.active {
    color: var(--breadcrumb-active) !important;
}


.list-group-item.parent-item, .list-group-item.new-item {
    background: var(--list-item-parent) !important;
    color: var(--font) !important;
}

.list-group-item.parent-item:hover, .list-group-item.new-item:hover {
    background: var(--list-item-parent-hover) !important;
    color: var(--font) !important;
}


.list-group-item {
    background: var(--list-item) !important;
    color: var(--font) !important;
    border-color: var(--list-item-border) !important;
}

.list-group-item:hover {
    background: var(--list-item-hover) !important;
    color: var(--font) !important;
}

.list-group-item-heading {
    color: var(--font) !important;
}

.accordion {
    background: var(--well) !important;
    color: var(--font)!important;
}

.accordion-header {
    background: var(--well) !important;
}
accordion-item {
    background-color: var(--dark)!important;
    border: none !important;
}

.accordion-body {
    background: var(--well) !important;
    color: var(--font) !important;
}
.accordion-button {
    background: var(--list-item-hover) !important;
    color: var(--font) !important;
}

.accordion-button:not(.collapsed) {
    background: var(--accent) !important;
}
/*.list-group-item-action {
    color: var(--font) !important;
    background-color: var(--light) !important;
}*/
.select-tab {
    /*background: var(--select) !important; missing? */
    color: var(--font) !important;
}
.alert-warning {
    background: var(--warning) !important;
    color: var(--font) !important;
}

.well, .well h3{
    background: var(--well) !important;
    color: var(--font) !important;
}


.input-group-text {
    background: var(--addon) !important;
    border-color: var(--addon-border) !important;
    color: var(--font) !important;
}
.alert-info{
    background: var(--info) !important;
    color: var(--font) !important;
}
#Export, #References {
    background: var(--addon) !important;
}
.rendered-form span {
    color: var(--font) !important; 
}
.breadcrumb a:hover{
    color:antiquewhite !important;
}
img.nsuf-logo {
    filter: invert(var(--invert))!important;
}
.dataTables_info{
    color: var(--font)!important;
}
.page-item .page-link {
    color: var(--font) !important;
    background-color: var(--secondary) !important;
    border-color: var(--primary) !important;
}
.page-item.active .page-link {
    color: var(--light) !important;
    background: var(--accent) !important;
    border-color: var(--addon-border) !important;
}
.project-header {
    background: var(--project-header) !important;
}
.project-footer {
    background: var(--project-footer) !important;
}
.modal-body{
    background: var(--modal-body);
    color: var(--font) !important;
}

.sub-menu{
    background: var(--sub-menu-bg) !important;
    
}
.sub-menu i {
    color: var(--sub-menu-bg) !important;
}
.sub-menu-item a:hover {
    color: var(--sub-menu-hover) !important;
}

.sub-menu-item a {
    color: var(--font) !important;
}
.card-default{
    background: var(--primary) !important;
}
dd > div.pull-left {
    background: var(--primary) !important;
}
div.logo-shadow > dl > dt, div.logo-shadow > dl > dd{
    color: var(--dark)!important;
}
.top-separator-bar {
    border-top-style: solid;
    border-top-width: 15px;
    border-top-color: var(--separator-bar) !important;
}
.bottom-separator-bar {
    border-bottom-style: solid;
    border-bottom-width: 15px;
    border-bottom-color: var(--separator-bar) !important;
}
.work-footer, .staff-list, .work-list {
    background-color: var(--CAES-bg);
    background-blend-mode: multiply;
}
.inactive-item {
    color: var(--inactive-item) !important;
}
.deleted-item {
    color: var(--deleted-item) !important;
}
.mentions-input-box {
    background: var(--card-border)!important;
}
    .mentions-input-box .mentions-autocomplete-list {
        background: var(--secondary)!important;
        border: var(--card-border) !important;
    }
        .mentions-input-box .mentions-autocomplete-list li {
            background-color: var(--primary) !important;
            border-bottom: 1px solid var(--card-border) !important;
        }
            .mentions-input-box .mentions-autocomplete-list li:hover,
            .mentions-input-box .mentions-autocomplete-list li.active {
                background: var(--sub-menu-bg) !important;
                color: var(--sub-menu-hover) !important;
            }
            .mentions-input-box .mentions-autocomplete-list li b {
                background: var(--sub-menu-hover) !important;
                color: var(--light) !important;
            }

.bootstrap-tagsinput .tag {
    color: var(--font) !important;
}
a.nav-link {
    text-decoration:none!important;
    color: var(--link) !important;
}
.text-bg-warning {
    color: var(--light)!important;
    background-color: var(--accent)!important;
}
.ts-dropdown-content, .ts-dropdown-content > div.create{
    background: var(--sub-menu-bg) !important;
    color: var(--sub-menu-hover) !important;
}
    .ts-dropdown-content > div.option > span.highlight {
        background: var(--sub-menu-hover) !important;
        color: var(--light) !important;
    }
    .ts-dropdown-content > div.active {
        background: var(--primary) !important;
        color: var(--font) !important;
    }
.bootstrap-tagsinput .tag {
    color: var(--font) !important;
}
.badge-primary {
    background-color: var(--badge-primary) !important;
}
.staff-bg1{
    background-color: var(--staff-bg1) !important;
}
.staff-bg2 {
    background-color: var(--staff-bg2) !important;
}

