.textinput {
  &__widget.is-disabled &-item__textbox {
    background-color: @disabled;
    border-color: @disabled;
    color: @disabled-inverted;
  }

  &__widget.is-disabled &-item__icon {
    color: @disabled-inverted;
  }
}

.textinput-item {
  &__prefix-container,
  &__suffix-container {
    text-align: center;
  }

  &__textbox-container {
    position: relative;
  }

  &__textbox {
    padding: @item-padding (@icon-size + (@item-padding * 2)) @item-padding @item-padding;
    line-height: @body-line-height;

    .dir-rtl & {
      padding-left: @icon-size + (@item-padding * 2);
      padding-right: @item-padding;
    }
  }

  &__state {
    position: absolute;
    top: 50%;
    right: @item-padding;
    .transform(translateY(-50%));

    .dir-rtl & {
      right: inherit;
      left: @item-padding;
    }
  }
}
