$blue-primary: #161832 !default;
$blue-secondary: #53A1FF !default;
$grey-background: #7a7a7a !default;

//number field
input[type="number"]:not(.browser-default):not([readonly]):not([disabled]).sieau-input + label {
  color: $blue-primary;
}

input[type="number"]:not(.browser-default):focus:not([readonly]).sieau-input + label {
  color: $blue-secondary;
}

input[type="number"]:not(.browser-default):not([readonly]):not([disabled]).sieau-input {
  border: 1px solid $grey-background;
}

input[type="number"]:not(.browser-default):focus:not([readonly]).sieau-input {
  border-bottom: 1px solid $blue-secondary;
  border-top: 1px solid $grey-background;
  border-left: 1px solid $grey-background;
  border-right: 1px solid $grey-background;
  box-shadow: 0 1px 0 0 $blue-secondary;
}

//text field
input[type="text"]:not(.browser-default):not([readonly]):not([disabled]).sieau-input + label {
  color: $blue-primary;
}

input[type="text"]:not(.browser-default):not([readonly]):not([disabled]).sieau-input {
  border: 1px solid $grey-background;
  background-color: white;
  color: black;
}

input[type="text"]:not(.browser-default):focus:not([readonly]).sieau-input + label {
  color: $blue-secondary;
}

//Password type
input[type="password"]:not(.browser-default):not([readonly]):not([disabled]).sieau-input + label {
  color: $blue-primary;
}

input[type="password"]:not(.browser-default):not([readonly]):not([disabled]).sieau-input {
  border: 1px solid $grey-background;
  background-color: white;
}

input[type="password"]:not(.browser-default):focus:not([readonly]).sieau-input + label {
  color: $blue-secondary;
}

//textarea field
textarea:not(.browser-default):not([readonly]):not([disabled]).sieau-input + label {
  color: $blue-primary;
}

textarea:not(.browser-default):not([readonly]):not([disabled]).sieau-input {
  background-color: white
}

textarea[readonly].materialize-textarea.sieau-input {
  border: 1px solid #ddd;
}

input[type="text"]:not(.browser-default):focus:not([readonly]).sieau-input {
  box-shadow: 0 1px 0 0 $blue-secondary;
  border-bottom: 1px solid $blue-secondary;
  border-top: 1px solid $grey-background;
  border-left: 1px solid $grey-background;
  border-right: 1px solid $grey-background;
}

textarea:not(.browser-default):focus:not([readonly]).sieau-input + label {
  color: $blue-secondary;
}

//checkbox
[type="checkbox"].filled-in.sieau-input + label {
  top: 3px;
}

input[type="checkbox"]:not(.browser-default):not([readonly]):not([disabled]).sieau-input + label {
  color: $blue-primary;
  font-weight: bold;
}

input[type="checkbox"]:not(.browser-default).sieau-input + label {
  font-weight: bold;
}

body div [type="checkbox"]:not([disabled]).filled-in:checked.sieau-input + label::after {
  border: 2px solid $blue-primary;
  background-color: $blue-primary;
}

input[type="checkbox"]:not([disabled]):not(.browser-default):focus:not([readonly]).sieau-input + label {
  color: $blue-secondary;
  font-weight: bold;
}

body div [type="checkbox"]:not([disabled]).filled-in:checked.sieau-input:focus + label::after {
  box-shadow: 0 1px 0 0 $blue-secondary;
  border: 2px solid $blue-secondary;
  background-color: $blue-secondary;
}

[type="checkbox"].display-table + label {
  display: table;
}

[type="checkbox"].filled-in:not(:checked).sieau-input.white-checkbox + label::after {
  background-color: #ffffff;
  border: 2px solid #ffffff;
}

[type="checkbox"]:not([disabled]).filled-in:checked.sieau-input.white-checkbox + label::after {
  border: 2px solid #ffffff;
  background-color: #ffffff;
}

[type="checkbox"]:not([disabled]).filled-in:checked.sieau-input.white-checkbox + label::before {
  border-right: 2px solid $blue-primary;
  border-bottom: 2px solid $blue-primary;
}

body div [type="checkbox"]:not([disabled]).filled-in:checked.sieau-input.white-checkbox:focus + label::after {
  border: 2px solid #ffffff;
  background-color: #ffffff;
}

//Select
input[type="text"]:not(.browser-default):not([disabled]).select-dropdown {
  background-color: white;
  border: 1px solid $grey-background;
}

label.sieau-input.select-label:not([disabled]) {
  color: $blue-primary;
}

.select-wrapper ul.dropdown-content.select-dropdown {
  background-color: rgb(240, 240, 240);
}

.select-wrapper ul.dropdown-content.select-dropdown li.selected {
  background-color: rgb(220, 220, 220);
}

.select-wrapper ul.dropdown-content.select-dropdown li:hover span {
  background-color: $blue-primary;
  color:#ffffff;
}

div.select-wrapper span.caret {
  z-index: 1;
}

//Radio buttons
label.sieau-input.radioButtons-label:not([disabled]) {
  color: $blue-primary;
}

[type="radio"].sieau-input:checked:not([disabled]) + label::after, [type="radio"].sieau-input.with-gap:checked:not([disabled]) + label::before, [type="radio"]:not([disabled]).sieau-input.with-gap:checked + label::after {
  border: 2px solid $blue-primary;
}

[type="radio"]:not([disabled]).sieau-input:checked + label::after {
  background-color: $blue-primary;
}

//Datepicker
input[type="text"].datepicker:not(.browser-default):not([disabled]).sieau-input + label {
  color: $blue-primary;
}

input[type="text"].datepicker:not([disabled]).sieau-input {
  border: 1px solid $grey-background;
  background-color: white;
}

//active cards
.card-title.active {
  background-color: $blue-primary;
}

.card .card-title.card-disabled {
  background-color: #949494;
}

.card .card-content div.card-title.active {
  background-color: $blue-primary;
}

//form cards
.card-content.grey-background {
  background-color: #d9dfe4;
  border-left: 2px solid #161832;
  border-right: 2px solid #161832;
}

body div .job-form {
    .input-field {
        .select-wrapper input[type=text].select-dropdown {
            border: 1px solid #ddd;
            border-radius: 5px;
            padding-left: 5px;
            padding-right: 5px;
            height: 3rem;
        }

        label.select-label.sieau-input, label.job-label{
            color: #9e9e9e;
            font-weight: 500;
            font-size: 1rem;
        }
    }

    div.job-parameter-table {
        .clearable-input > [data-clear-input] {
            top: 15px;
        }

        input.sieau-input {
            margin: 5px 0 !important;
        }
    }
}
