.input-defaults(@isHost: false) {
  display: none;
  appearance: none;
  outline: @input-outline;
  font-weight: normal;
  text-align: left;
}

.input-standard(@isHost: false) {
  font-family: @input-font-family;
  font-size: @input-font-size;
  font-weight: @input-font-weight;
  height: @input-height;
  width: @input-width;
  max-width: 100%;
  padding: @input-padding;
  margin: @input-margin;
  outline: @input-outline;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  position: relative;
  vertical-align: middle;
  color: @input-text-color;
  border-radius: @input-border-radius;
  background-color: @input-background-color;
  text-overflow: ellipsis;

  .states(@input-border-color, @input-focused-border-color);

  &[type='number'] {
    padding-right: 0;
  }
  &[warning] {
    .states(@scheme-color-warning);
  }
  &[error],
  &[error][warning] {
    .states(@scheme-color-error);
  }

  .states (@border-color, @focused-border-color: @border-color) {
    @input-border-color: @border-color;
    @input-focused-border-color: @focused-border-color;
    .border(@input-border-color, @input-focused-border-color);
    &[disabled] {
      color: @input-disabled-text-color;
      .border(@input-disabled-border-color, @input-disabled-border-color);
    }
  }
}
// TODO: This function, with when (default()), causes build error in Halo. Need to recheck!
// .border(@input-border-color: @input-border-color, @input-border-color: @input-border-color) when (default()) {
//   border: @input-border;
// }
.border(@input-border-color: @input-border-color, @input-border-color: @input-border-color) {
  border: @input-border;
}

.border(@input-border-color: @input-border-color, @input-focused-border-color: @input-border-color)
  when
  (@input-border-style = solid)
  and
  (@input-background-color = transparent)
  and
  (extract(@input-border-width, 1) = 0)
  and
  (extract(@input-border-width, 2) = 0)
  and
  (extract(@input-border-width, 3) > 0)
  and
  (extract(@input-border-width, 4) = 0) {
  border: none;
  transition: background-size 200ms ease-out;
  @w: max(@input-border-width);
  @wplus: (@w + 1);
  @bg-default: linear-gradient(@input-border-color, @input-border-color);
  @bg-focused: linear-gradient(@input-focused-border-color, @input-focused-border-color);
  background: @bg-focused center calc(100% + @wplus) / 30% @wplus, @bg-default center bottom / 100% @w;
  background-repeat: no-repeat;
}
.input-focus() {
  @w: max(@input-border-width);
  @wplus: (@w + 1);
  background-size: 100% @wplus, 100% @w!important;
  background-position: center bottom !important;
  border-color: @input-focused-border-color;
}
.input-webkit-normaliser () {
  &::-webkit-clear-button,
  &::-webkit-inner-spin-button,
  &::-webkit-search-decoration,
  &::-webkit-search-cancel-button {
    -webkit-appearance: none;
  }
}