// Mixins for text input
//================================================== //

@mixin input-style() {
  -webkit-appearance: none;
  background-color: $input-color-initial-background;
  border: 1px solid $trigger-color-initial-border;
  border-collapse: separate;
  border-radius: 2px;
  color: $input-color;
  display: inline-block;
  font-size: $ids-size-font-base;
  height: $input-size-regular-height;
  max-width: 100%;
  padding: $input-field-padding;
  resize: none;
  text-align: left;
  width: 300px;

  @include css3(transition, border 300ms ease 0s, box-shadow 300ms ease 0s);
  @include antialiased();

  &:hover {
    border-color: $input-color-hover-border;
  }

  &[disabled] {
    background-color: $input-color-disabled-background;
    border: solid 1px $input-color-disabled-border;
    color: $input-disabled-color;
  }

  &[readonly] {
    background-color: $input-color-readonly-background;
    border-color: $input-color-readonly-border;
    color: $input-readonly-color;
  }

  &.is-placeholder {
    color: $input-placeholder-color;

    &.error {
      color: $error-color;
    }

    &.alert {
      color: $alert-color;
    }

    &.info {
      color: $info-color;
    }
  }

  &:focus,
  &.is-focused {
    @include focus-state();
  }

  &.error {
    border-color: $error-border-color;

    &:focus {
      border-color: $error-border-color !important;
      box-shadow: $error-focus-box-shadow !important;
      color: $input-color !important;
    }
  }

  &.alert {
    border-color: $alert-color;

    &:focus {
      border-color: $alert-color !important;
      color: $input-color !important;
    }
  }

  &.success {
    border-color: $success-color;

    &:focus {
      border-color: $success-color !important;
      color: $input-color !important;
    }
  }

  &.info {
    border-color: $info-color;

    &:focus {
      border-color: $info-color !important;
      color: $input-color !important;
    }
  }
}

// Required Indicator
@mixin required-indicator() {
  content: '*';
  color: $error-color !important;
  display: inline-block;
  font-size: $ids-size-font-lg;
  left: 3px;
  line-height: 0;
  position: relative;
  top: 3px;
  speak: none;
}

// Labels without the "for" attribute
@mixin inline-control-label($controls) {
  @each $control in $controls {
    &.inline-#{$control} {
      .label-text {
        margin-bottom: 8px;
      }
    }
  }
}

@mixin inline-control($controls) {
  $exclude-controls: '';

  @each $control in $controls {
    $exclude-controls: $exclude-controls + ':not(.#{$control})';
  }

  input {
    &#{$exclude-controls} {
      margin: 5px 0 15px;
    }
  }

  textarea {
    &#{$exclude-controls} {
      margin: 5px 0 12px;
    }
  }
}