@import "../InputErrors/style";

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

.hui-SelectInput__wrap {
  @extend %hui-input-border;
}

.hui-SelectInput__label {
  @extend %hui-input-label;
}

.hui-SelectInput__displayValue {
  background-image: none;
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.hui-SelectInput__selected,
.hui-SelectInput__selected--noSelection {
  position: absolute;
  top: 9px;
  left: 0px;
  color: $grey;
  letter-spacing: 0.10em;
  line-height: $x-9 - 1;
  pointer-events:none;
  padding-right: $x-7;
}

.hui-SelectInput__selected--noSelection {
  color: $grey-light;
}

.hui-SelectInput__inputWrap {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 42px;
}

.hui-SelectInput__input {
  background-image: none;
  opacity: 0;
  width: 100%;
  min-height: 42px;
  position: relative;
  top: 0px;
  left: 0px;
}

.hui-SelectInput__icon {
  position: absolute;
  right: 10px;
  top: 10px;
}

.hui-SelectInput--disabled .hui-SelectInput__wrap,
.hui-SelectInput--disabled .hui-SelectInput__selected,
.hui-SelectInput--disabled .hui-SelectInput__label {
  @extend %hui-input-disabled;
}

.hui-SelectInput--focused .hui-SelectInput__wrap,
.hui-SelectInput--focused .hui-SelectInput__label {
  @extend %hui-input-focused;
}

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

.hui-SelectInput--error .hui-SelectInput__icon,
.hui-SelectInput--error .hui-SelectInput__wrap,
.hui-SelectInput--error .hui-SelectInput__label {
  @extend %hui-input-error;
}

@include input-sizes(SelectInput);