@import "../InputErrors/style";

.hui-TextArea {
  @extend %hui-input-base;
}

.hui-TextArea__inputWrap {
  @extend %hui-input-border;
  @extend %hui-input-label;
  height: auto;
  padding: 0px;
}

.hui-TextArea__input {
  height: 124px;
  max-width: 100%;
  min-width: 100%;
  font-size: 15px;
  line-height: $x-5;
  border: 0px;
  padding: 0px $x-2 $x-2 $x-2;
  box-sizing: border-box;
}

.hui-TextArea__label {
  @extend %hui-input-label;
  margin: $x-2;
}

.hui-TextArea--error .hui-TextArea__label {
  @extend %hui-input-error;
}

.hui-TextArea--error .hui-TextArea__message {
  @extend %error-message;
}

.hui-TextArea--error .hui-TextArea__icon {
  @extend %hui-input-error;
}

.hui-TextArea--valid .hui-TextArea__icon {
  color: $green-light;
}

.hui-TextArea__iconButton {
  @extend %general-reset;
  @extend %a-reset;
  background: none;
  margin-top: -11px;
  cursor: pointer;
}


.hui-TextArea--focused .hui-TextArea__message {
  opacity: 1;
  top: 0;
}

.hui-TextArea--disabled .hui-TextArea__input,
.hui-TextArea--disabled .hui-TextArea__label {
  @extend %hui-input-disabled;
}

.hui-TextArea--disabled .hui-TextArea__input,
.hui-TextArea--focused .hui-TextArea__label {
  @extend %hui-input-focused;
}

.hui-TextArea--error .hui-TextInput__message {
  @extend %error-message;
}

.hui-TextArea--disabled .hui-TextArea__input,
.hui-TextArea--error .hui-TextArea__label {
  @extend %hui-input-error;
}

.hui-TextArea--error .hui-TextArea__icon,
.hui-TextArea--error .hui-TextArea__wrap,
.hui-TextArea--error .hui-TextArea__label {
  @extend %hui-input-error;
}

.hui-TextArea--focused .hui-TextInput__message {
  @extend %hui-input-focused;
}

@include input-sizes(TextArea);