@import "../bootstrap-core/forms";

// SEB Specific styles for labels
label:not(.form-check-label):not(.custom-checkbox):not(.custom-radio):not(.custom-control-label), legend.col-form-legend {
  font-weight: $font-weight-medium;
  margin-bottom: 0.25rem;
}
label:not(.form-check-label) {
  line-height: 1.5rem;
}

.form-inline label, label.col-form-label {
  margin-bottom: 0;
}
label {
  color: $label-color;
}

// SEB Specific styles for progress feedback
.progress-feedback {
  width: 100%;
  @include font-size($form-feedback-font-size);
  color: $text-muted;
  &::before {
    @include form-validation-line();
  }
  &.progress-0::before {
    width: 0;
  }
  &.progress-10, &.progress-20, &.progress-30 {
    color: $danger;;
    &::before {
      @include form-validation-line-color($danger);
    }
  }
  &.progress-40, &.progress-50, &.progress-60 {
    color: $warning;
    &::before {
      @include form-validation-line-color($warning);
    }
  }
  &.progress-70, &.progress-80, &.progress-90, &.progress-100 {
    color: $success;
    &::before {
      @include form-validation-line-color($success);
    }
  }
}

// SEB Specific styles for form control help
.form-control ~ .form-control-help {
  @include font-size($form-feedback-font-size);
  color: $text-muted;
  width: 100%;
  &::before {
    content: '';
    height: 4px;
    width: 100%;
    display: block;
    position: relative;
    top: -4px;
  }
}

// SEB Specific styles for validation progress bar
.form-control:focus + .progress-feedback,
.form-control:focus + .invalid-feedback,
.form-control:focus + .valid-feedback,
.form-control:focus ~ .input-group-append + .progress-feedback,
.form-control:focus ~ .input-group-append + .invalid-feedback,
.form-control:focus ~ .input-group-append + .valid-feedback {
  &.progress-0::before {
    width: 0;
    border-radius: 0 0 0 4px;
  }
  @for $i from 1 through 9 {
    &.progress-#{$i}0::before {
      width: 10% * $i;
      border-radius: 0 0 0 4px;
    }
  }
  &.progress-100::before {
    width: 100%;
    border-radius: 0 0 4px 4px;
  }
}

.progress-feedback.progress-success {
  color: $success;
}
.progress-feedback.progress-warning {
  color: $warning;
}
.progress-feedback.progress-danger {
  color: $danger;
}
.custom-control-label {
  + .valid-feedback, + .invalid-feedback {
    margin-top: 4px;
  }
}

/* IE fix for input height */
.form-control {
  min-height: 44px;
}
.input-group-sm > .form-control, .form-control-sm {
  min-height: 32px;
}
.input-group-lg > .form-control, .form-control-lg {
  min-height: 56px;
}