/* EMU customization file.
**************************
Please do all styling changes here, do not edit file emu.css (changes there will be lost on next upgrade).
Copy selector from emu.css and add here just the changes/additions (no need to copy the whole rule).
*/

:root {
  --black-colour: black;
  --white-colour: white;
  --grey-colour: rgb(179, 179, 179);
  --red-colour: red;
  --green-colour: green;
  --light-colour: hsl(195, 100%, 96%);
  --dark-colour: #222428;
  --accent-colour: #00a9e0;
  /* --accent-colour: #f1493a; */
  
  --background-colour: var(--dark-colour);
  --foreground-colour: var(--light-colour);
  --text-colour: var(--light-colour);
  --control-background-colour: var(--light-colour);
  --control-text-colour: var(--black-colour);

  --box-shadow-colour: hsl(195, 100%, 90%);
  --watermark-colour: var(--grey-colour);
  --success-colour: var(--green-colour);
  --danger-colour: var(--red-colour);

  --emu-margin: 20px;
  --emu-padding: 20px;
  --font-size: 12pt;
}

body {
  background-color: var(--black-colour);
}

.container {
  border: none;
}

#emuHeader {
  border: none;
  background-color: var(--black-colour);
  color: var(--foreground-colour);
}

#emuNav {
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: solid var(--foreground-colour) thin;
  background-color: var(--background-colour);
  color: var(--accent-colour);
  padding-top: var(--emu-padding);
  padding-bottom: var(--emu-padding);
  font-size: var(--font-size);
}

#emuBody {
  border: solid var(--background-colour) thin;
  background-color: var(--background-colour);
  color: var(--foreground-colour);
}

#emuFooter {
  background-color: var(--black-colour);
}

#emuFooterText {
  color: var(--watermark-colour);
}

#emuBottom {
  padding-top: var(--emu-padding);
  padding-bottom: var(--emu-padding);
}

/*
* legends
*/

#emuMiddle > #emuFieldSet > .emuFieldSet > legend {
  color: var(--text-colour);
}

#emuFieldSet {
  margin-top: var(--emu-margin);
  border: solid var(--foreground-colour) thin;
  background-color: transparent;
  padding-left: var(--emu-padding);
  padding-right: var(--emu-padding);
  padding-bottom: 30px;
}

legend {
  color: var(--accent-colour);
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: solid var(--foreground-colour) thin;
}

.emuFieldSetDiv {
  border: solid var(--accent-colour) thin;
  background-color: transparent;
}

/*
* Controls
*/
.form-control {
  border: 1px solid var(--accent-colour);
  background-color: var(--control-background-colour);
  color: var(--control-text-colour);
}

.form-control[readonly] {
  border: 1px solid var(--accent-colour);
  background-color: var(--control-background-colour);
  color: var(--control-text-colour);
}

.form-control:focus {
  border-color: var(--accent-colour);
  /* box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--box-shadow-colour); */
}

.select2-container--bootstrap .select2-selection {
  background-color: var(--control-background-colour);
  border: 1px solid var(--accent-colour);
  color: var(--control-text-colour);
  /* box-shadow: 0 0 10px 100px var(--box-shadow-colour) inset; */
}

.select2-container--bootstrap
  .select2-selection--single
  .select2-selection__rendered {
  color: var(--control-text-colour);
  background-color: var(--control-background-colour);
}

.select2-container--bootstrap
  .select2-selection--multiple
  .select2-selection__choice {
  color: var(--control-text-colour);
  background-color: var(--control-background-colour);
  border: none;
  box-shadow: none;
}

.select2-container--bootstrap .select2-selection .select2-selection__arrow {
  color: var(--control-text-colour);
}

.select2-container--bootstrap .select2-dropdown {
  border-color: var(--accent-colour);
  background-color: var(--background-colour);
  color: var(--text-colour);
}

.select2-container--bootstrap .select2-search--dropdown .select2-search__field {
  background-color: var(--control-background-colour);
  border: 1px solid var(--accent-colour);
  color: var(--control-text-colour);
}

.select2-container--bootstrap
  .select2-results__option--highlighted[aria-selected="false"] {
  background-color: var(--background-colour);
  color: var(--accent-colour);
}

.select2-container--bootstrap
  .select2-results__option--highlighted[aria-selected="true"] {
  background-color: var(--accent-colour);
  color: var(--text-colour);
}

.select2-container--bootstrap .select2-results__option[aria-selected="true"] {
  background-color: var(--accent-colour);
  color: var(--text-colour);
}

.select2-container--bootstrap.select2-container--disabled .select2-selection,
.select2-container--bootstrap.select2-container--disabled {
  color: var(--grey-colour);
  background-color: var(--control-background-colour);
}

.select2-container--bootstrap
  .select2-selection--multiple
  .select2-selection__clear,
.select2-container .select2-selection--single .select2-selection__clear {
  color: var(--danger-colour);
}

.select2-container--bootstrap
  .select2-selection--multiple
  .select2-selection__choice__remove {
  color: var(--danger-colour);
}

select.form-control {
  /* box-shadow: 0 0 10px 100px var(--box-shadow-colour) inset; */
}

select option {
    color: var(--accent-colour)  !important;
    background-color: var(--background-colour) !important;
}

.dropdown-menu {
  background-color: var(--background-colour);
  color: var(--foreground-colour);
}

.dropdown-menu > li a {
  background-color: transparent !important;
  color: var(--foreground-colour);
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-color: transparent !important;
  color: var(--accent-colour);
}

.dropdown-menu > li.active > a,
.dropdown-menu > li.active > a:focus,
.dropdown-menu > li.active > a:hover {
  background-color: var(--accent-colour) !important;
  color: var(--text-colour);
}

input[readonly] {
  background-color: var(--control-background-colour) !important;
  border-color: var(--accent-colour);
  /* box-shadow: 0 0 10px 100px var(--box-shadow-colour) inset; */
}

.emuTextArea {
  border: solid var(--accent-colour) thin;
  background-color: var(--control-background-colour);
}

.input-group-addon {
  border: 1px solid var(--accent-colour);
  background-color: var(--background-colour);
}

.table-hover > tbody > tr:focus,
.table-hover > tbody > tr:hover {
  background-color: var(--accent-colour) !important;
}

.emuCheckbox-group {
  margin-top: 15px;
  margin-bottom: 15px;
}

.gentleselect-dialog {
  border: 1px solid var(--accent-colour);
  background-color: var(--control-background-colour);
  color: var(--control-text-colour);
}

.gentleselect-dialog > .gentleselect-title {
  background-color: var(--control-background-colour);
  color: var(--accent-colour);
}

.gentleselect-dialog > ul > li.selected,
.gentleselect-dialog > ul > li:hover {
  color: var(--white-colour);
  background-color: var(--accent-colour);
}

.fixed-table-container tbody .selected td {
  background-color: var(--accent-colour);
}

/*
* labels
*/
label {
  color: var(--grey-colour);
}

.gentleselect-label {
  color: var(--control-text-colour);
  background-color: var(--control-background-colour);
  border: 1px solid var(--accent-colour);
}

/*
* buttons
*/

.btn-primary {
  color: var(--text-colour);
  background-color: var(--accent-colour);
  border-color: var(--accent-colour);
}

.btn-primary.active,
.btn-primary:active,
.btn-primary:hover,
.open > .dropdown-toggle.btn-primary {
  color: var(--text-colour);
  background-color: var(--accent-colour);
  border-color: var(--accent-colour);
}

/* file buttons */
.btn-default.active,
.btn-default:active,
.btn-default:hover,
.open > .dropdown-toggle.btn-default {
  color: var(--danger-colour);
  background-color: var(--accent-colour);
  border-color: var(--accent-colour);
}

.btn-file input[type="file"] {
  background: var(--background-colour);
  border-color: var(--accent-colour);
}

#emuExportOutput {
  border: solid var(--accent-colour) thin;
  background-color: var(--control-background-colour);
  color: var(--control-text-colour);
}

#emuImportOutput {
  border: solid var(--accent-colour) thin;
  background-color: var(--control-background-colour);
  color: var(--control-text-colour);
}

#emuOutputLogsPostButton,
#emuOutputErrorsPostButton {
  background-color: var(--accent-colour);
  color: var(--text-colour);
  margin-top: 10px;
  border: none;
}

.emuStageBtnFile {
  background-color: var(--background-colour);
  color: var(--text-colour);
  border-color: var(--accent-colour);
}

.emuStageBtnFile:hover {
  background-color: var(--accent-colour);
  color: var(--accent-colour);
  border-color: var(--accent-colour);
}

.emuCustomBtn {
  color: var(--text-colour) !important;
  background: linear-gradient(#3eb6de, #01506a);
  /* background: linear-gradeint(#ec6e62, #a01d11); */
  border-color: var(--accent-colour);
  outline-color: var(--accent-colour) !important;
  font-size: 14pt;
}

.emuCustomBtn:focus {
  outline-color: var(--accent-colour) !important;
  border: none;
}

.emuCustomBtn:active {
  background-color: var(--foreground-colour) !important;
  color: var(--accent-colour) !important;
  border: none;
}

.emu-radio-btn {
  background: linear-gradient(hsl(195, 94%, 61%), #02779f);
  border-color: var(--accent-colour);
}

.emu-radio-btn:active,
.emu-radio-btn:hover,
.emu-radio-btn:focus {
  background-color: var(--accent-colour);
  border-color: var(--accent-colour);
}

.emuProgressBar {
  background-color: var(--accent-colour);
}

/*
* Icons
*/

.fa {
  color: var(--text-colour);
}

.emuColour {
  color: var(--accent-colour);
}

.emuIconColour {
  color: var(--text-colour);
}

/*
* Lines
*/
.emuSeparator {
  color: var(--accent-colour);
}

/* links */
a:link {
  color: var(--text-colour);
  text-decoration: none;
}

a:visited {
  color: var(--text-colour);
  text-decoration: none;
}

a:hover {
  color: var(--text-colour);
}

a:active {
  color: var(--text-colour);
}

/* tabs */
.tab-content {
  /*background-color: var(--light-colour);*/
  /*color: #EE3224;*/
}

.nav-pills li a {
  background-color: transparent !important;
  color: var(--text-colour);
}

.nav-pills li a:hover {
  background-color: transparent !important;
  color: var(--text-colour);
}

.nav-pills li.active a,
.nav-pills li.active a:focus,
.nav-pills li.active a:hover {
  background-color: var(--accent-colour) !important;
  color: var(--text-colour);
}

.nav-tabs li a,
.nav-tabs li a:focus,
.nav-tabs li a:hover {
  background-color: var(--background-colour);
  color: var(--text-colour);
}

.nav-tabs li.active a,
.nav-tabs li.active a:focus,
.nav-tabs li.active a:hover {
  border-bottom: solid var(--background-colour) thick;
  background-color: var(--background-colour) !important;
  color: var(--accent-colour);
}

/* alerts */
.alertify .ajs-dialog {
  background: var(--background-colour);
  color: var(--text-colour);
  border: 1px solid var(--accent-colour);
}

.alertify .ajs-header {
    background: var(--background-colour) !important;
    color: var(--danger-colour) !important;
    border: none !important;
}

.alertify .ajs-body {
    background: var(--background-colour) !important;
    color: var(--text-colour) !important;
    border: none !important;
}

.alertify .ajs-footer {
    background: var(--background-colour) !important;
    color: var(--text-colour) !important;
    border: none !important;
}

.alertify-notifier .ajs-message {
  background: var(--background-colour)!important;
  color: var(--text-colour)!important;
  border: 1px solid var(--accent-colour)!important;
}

.ajs-content {
  color: var(--text-colour)!important;
}

.ajs-close {
  border: dotted var(--accent-colour) thin!important;
}