:root{
  --page-bg: #666;
  --table-bg: #555;
  --bg-dark: #333;
  --content-bg: #999;
  --text-light: #e6e2d0;
  --text-dark: #24231f;
  --link: #053868;
  --input: #666;
  --input-dark: #555;
  --tr-dark: #888;
  --tr-light: #999;
  --menu-button: #666;
  --dbmenu-active: #617d7b;
  --border: #333;
  --shadow: #333;
  --hover: #6e828c;
  --modal-bg: #aaa;
  --modal-header: #8e999d;
  --tab-bg: #777;
  --tab-active: #6e828c;
  --selection: #335070;
  --disabled-bg: #aaa;
  --disabled-text: #444;
  --disabled-border: #777;
  --sort-header: #8e999d;
  --sort-asc: #395d84;
  --sort-desc: #617d7b;
  --light-blue: #bbddee;
  --light-yellow: #fffbd0;
  --light-green: #bddec9;
  --pink: #ffb4b4;
  --red: #660000;
  --green: #004400;
  --orange: #673900;
  --blue: #042b50;
  --dark-yellow: #8c8d42;
  --clients: var(--tr-light);

  /* Menu system accent colors (dark mode) - all set to match dark mode defaults, customize as needed */
  --menu-pm-accent: #053868;
  --menu-pm-tint: #666;
  --menu-maint-accent: #053868;
  --menu-maint-tint: #666;
  --menu-moc-accent: #053868;
  --menu-moc-tint: #666;
  --menu-rims-accent: #053868;
  --menu-rims-tint: #666;
  --menu-training-accent: #053868;
  --menu-training-tint: #666;
  --menu-contractors-accent: #053868;
  --menu-contractors-tint: #666;
  --menu-dig-accent: #053868;
  --menu-dig-tint: #666;
  --menu-fh-accent: #053868;
  --menu-fh-tint: #666;
  --menu-ppo-accent: #053868;
  --menu-ppo-tint: #666;
}
body {
  background-color: var(--page-bg);
  color: var(--text-dark);
}
#copyright {
  color: var(--text-light);
}
#heading {
  background-blend-mode: multiply;
  background-color: var(--tr-light);
}
table{
  color: var(--text-dark);
}
a,span.link,span.boldlink{
  color: var(--text-dark);
}
div[id^='num_'] {
  color: var(--text-light);
}
table a,table span.link,table span.boldlink{
  color: var(--link);
}
TABLE.trng_mgr,TABLE.trng_mgr_bottom,TABLE.trng_mgr_top,table.cams {
  background-color: var(--table-bg);
  box-shadow: 0 0 8px var(--shadow);
}
#heading,.content_box,.content_box_inner,.content_div,.shadow,H2,H3,object {
  box-shadow: 0 0 8px var(--shadow);
}
#login_box>div{
  background-color: var(--tr-light);
  color: var(--text-dark);
}
button,input[type='button'],input,select,textarea {
  background-color: var(--input);
  color: var(--text-light);
  border: 1px solid var(--border);
}
button,input[type='button'] {
  box-shadow: 0 0 8px var(--shadow);
}
select option:checked{
  background-image: linear-gradient(var(--hover), var(--hover));
  color: var(--text-light);
}
select:disabled,input:disabled,button:disabled,textarea:disabled{
  background-color: var(--disabled-bg) !important;
  color: var(--disabled-text) !important;
  border: 1px solid var(--disabled-border);
}
#test_form .option{
  background-color: var(--input);
  color: var(--text-light);
}
.ui-button:hover,.btn:hover,button:hover,input[type='button']:hover {
  background-color: var(--hover);
  color: var(--text-light);
}
.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus,.ui-button:hover,.ui-button:focus {
    background: var(--tr-light);
    color: var(--text-dark);
}
button:hover:disabled,input[type='button']:hover:disabled {
  background-color: var(--disabled-bg);
  color: var(--disabled-text);
  cursor: default;
}
.dbmenu-active{
  background-color: var(--dbmenu-active);
}
#menubar {
  box-shadow: 0 0 10px var(--shadow);
  background-color: var(--menu-button);
}
#menubar .dropdown{
  border-color: var(--border);
}
#menubar .dropdown:hover .dropbtn {
  background-color: var(--hover) !important;
}
#menubar .dropdown:hover {
  background-color: var(--hover) !important;
}
#menubar .dropdown-content a:hover {
  background-color: var(--hover);
}
#menubar .dropdown-content a {
  color: var(--text-light);
}
#menubar .dropdown-content {
  background-color: var(--menu-button);
  box-shadow: 0 0 8px var(--shadow);
  color: var(--text-light);
}
#menubar .dropbtn {
  background-color: var(--menu-button);
  color: var(--text-light);
}
.db_menubar{
  background-color: var(--menu-button);
  box-shadow: 0 0 8px var(--shadow);
}
.db_menubar .dropdown {
  border-left: 3px solid var(--border);
  border-right: 1px solid var(--border);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.db_menubar :hover{
  background-color: var(--hover);
}
.db_menubar .dropdown-content a:hover {
  background-color: var(--hover);
}
.db_menubar .dropdown-content {
  background-color: var(--menu-button);
  box-shadow: 0 0 8px var(--shadow);
}
.db_menubar .dropdown-content a{
  color: var(--text-light);
}
.content_box_inner {
  background-color: var(--tr-light);
}
.db_menubar .dropbtn {
  background-color: var(--menu-button);
  color: var(--text-light);
}
::placeholder{
  color: var(--text-light);
  opacity: 1;
}
tr:nth-child(odd){
  background-color: var(--tr-dark);
}
tr:nth-child(even){
  background-color: var(--tr-light);
}
.ui-dialog,.ui-dialog-buttonpane,.ui-tabs{
  background-color: var(--modal-bg);
}
.ui-tab{
  background-color: var(--tab-bg) !important;
}
.ui-tabs-active{
  background-color: var(--tab-active) !important;
}
.ui-widget{
  border: 1px solid var(--border) !important;
}
.ui-button{
  background-color: var(--page-bg);
  color: var(--text-light);
}
.ui-widget select,select {
  border: 1px solid var(--border);
  background-color: var(--page-bg);
}
.ui-widget-header {
  background-color: var(--modal-header) !important;
  background-image: none;
  border: 1px solid var(--border);
}
.ui-accordion{
  border: 0 !important;
}
.ui-accordion-header{
  color: var(--text-light);
  background-color: var(--page-bg);
  border: 1px solid var(--border);
}
.ui-accordion-content{
  background-color: var(--modal-bg);
}
.ui-spinner{
  color: var(--text-light);
  background-color: var(--page-bg);
  border: 1px solid var(--border);
}
.ui-tooltip{
  color: var(--text-light);
  background-color: var(--page-bg);
}
.ui-state-active{
  background-color: var(--hover);
  color: var(--text-dark);
}
.ui-state-focus{
  background-color: var(--hover);
  color: var(--text-dark);
}
.ui-visual-focus {
  box-shadow: 0 0 3px 1px var(--shadow);
}
.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active,a.ui-button:active,.ui-button:active,.ui-button.ui-state-active:hover {
  border: 1px solid var(--border);
  background: var(--hover);
  color: var(--text-dark);
}

.slider {
  border-color: var(--border) !important;
  background-color: var(--border) !important;
}
.slider .slide img {
  filter: brightness(70%);
}
svg.highcharts-root{
  filter: invert(0.8) sepia(0.1);
}
/*darken elfinder*/
iframe[src='browser.html']{
  filter: brightness(0.8);
}
#ispring{
  filter: brightness(0.7) contrast(1.2);
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{
  -webkit-box-shadow: 0 0 0 1000px var(--input) inset !important;
  -webkit-transition-delay: 9999s;
  -webkit-transition: color 9999s ease-out, background-color 9999s ease-out;
}


/* Menu system button tinting (dark mode) */
.db_menubar.menubar_pm .dropbtn { background-color: var(--menu-pm-tint); }
.db_menubar.menubar_pm .dropdown-content { background-color: var(--menu-pm-tint); }
.db_menubar.menubar_maint .dropbtn { background-color: var(--menu-maint-tint); }
.db_menubar.menubar_maint .dropdown-content { background-color: var(--menu-maint-tint); }
.db_menubar.menubar_moc .dropbtn { background-color: var(--menu-moc-tint); }
.db_menubar.menubar_moc .dropdown-content { background-color: var(--menu-moc-tint); }
.db_menubar.menubar_rims .dropbtn { background-color: var(--menu-rims-tint); }
.db_menubar.menubar_rims .dropdown-content { background-color: var(--menu-rims-tint); }
.db_menubar.menubar_training .dropbtn { background-color: var(--menu-training-tint); }
.db_menubar.menubar_training .dropdown-content { background-color: var(--menu-training-tint); }
.db_menubar.menubar_contractors .dropbtn { background-color: var(--menu-contractors-tint); }
.db_menubar.menubar_contractors .dropdown-content { background-color: var(--menu-contractors-tint); }
.db_menubar.menubar_dig .dropbtn { background-color: var(--menu-dig-tint); }
.db_menubar.menubar_dig .dropdown-content { background-color: var(--menu-dig-tint); }
.db_menubar.menubar_fh .dropbtn { background-color: var(--menu-fh-tint); }
.db_menubar.menubar_fh .dropdown-content { background-color: var(--menu-fh-tint); }
.db_menubar.menubar_ppo .dropbtn { background-color: var(--menu-ppo-tint); }
.db_menubar.menubar_ppo .dropdown-content { background-color: var(--menu-ppo-tint); }

/* Menu system panel header accent colors (dark mode) */
.panel-pm h3 { background-color: var(--menu-pm-accent); color: var(--text-light); }
.panel-maint h3 { background-color: var(--menu-maint-accent); color: var(--text-light); }
.panel-moc h3 { background-color: var(--menu-moc-accent); color: var(--text-light); }
.panel-rims h3 { background-color: var(--menu-rims-accent); color: var(--text-light); }
.panel-training h3 { background-color: var(--menu-training-accent); color: var(--text-light); }
.panel-contractors h3 { background-color: var(--menu-contractors-accent); color: var(--text-light); }
.panel-dig h3 { background-color: var(--menu-dig-accent); color: var(--text-light); }
.panel-fh h3 { background-color: var(--menu-fh-accent); color: var(--text-light); }
.panel-ppo h3 { background-color: var(--menu-ppo-accent); color: var(--text-light); }
