//
// Textual form controls
//

.form-control {
  color: $input-color;
  background-color: $input-bg;
  border: $input-btn-border-width solid $input-border-color;

  @include box-shadow($input-box-shadow);

  // Customize the `:focus` state to imitate native WebKit styles.
  @include form-control-focus();

  // Placeholder
  &::placeholder {
    color: $input-color-placeholder;
  }

  // Disabled and read-only inputs
  //
  // HTML5 says that controls under a fieldset > legend:first-child won't be
  // disabled if the fieldset is disabled. Due to implementation difficulty, we
  // don't honor that edge case; we style them as disabled anyway.
  &:disabled,
  &[readonly] {
    background-color: $input-bg-disabled;
  }
}

select.form-control {
  &:focus::-ms-value {
    // Suppress the nested default white text on blue background highlight given to
    // the selected option text when the (still closed) <select> receives focus
    // in IE and (under certain conditions) Edge, as it looks bad and cannot be made to
    // match the appearance of the native widget.
    // See https://github.com/twbs/bootstrap/issues/19398.
    color: $input-color;
    background-color: $input-bg;
  }
}

// Form validation states
// Form validation states
.has-success {
  @include form-control-validation($brand-success);

  .form-control-success {
    background-image: $form-icon-success;
  }
}

.has-warning {
  @include form-control-validation($brand-warning);

  .form-control-warning {
    background-image: $form-icon-warning;
  }
}

.has-danger {
  @include form-control-validation($brand-danger);

  .form-control-danger {
    background-image: $form-icon-danger;
  }
}