[class*="uex-input-"] {
  &:not([class*="-modal"]) {
    display: block;
    width: 100%;
  }

  &[class*="-modal"] {
    min-height: 0;
  }

  .form-group {
    margin-bottom: 0;

    label {
      display: block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    small[class*="-feedback"] {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .form-group-icon {
      display: flex;
      align-items: center;
      height: $input-height;
    }

    .form-group-button {
      padding: 0;
      padding-left: 0.5rem;
      align-self: center;
    }

    &.has-label {
      .form-group-icon {
        padding-top: ($label-font-size * $line-height-base) -
          $input-border-width;
        height: calc($input-height + $label-font-size * $line-height-base);
      }

      .form-group-button {
        margin-top: ($label-font-size * $label-line-height) +
          $label-margin-bottom - $input-border-width;
      }
    }

    &.is-disabled {
      label:not(.btn) {
        color: $label-disabled-color;
        cursor: not-allowed;
      }

      .form-group-icon {
        opacity: $btn-disabled-opacity;
      }
    }

    &.is-invalid:not(.is-disabled) {
      .form-group-icon {
        &.highlight-state {
          color: $form-feedback-invalid-color;
        }
      }
    }

    .form-control-spinner {
      display: flex;
      padding: 0;
      width: auto;
      height: $input-height;
      align-items: center;
      border: none;
      border-bottom: $input-border-width solid $input-border-color;
    }

    .form-toggle-password {
      position: absolute;
      margin: auto;
      bottom: 0;
      right: 2%;
      transform: translateY(-50%);
      cursor: pointer
    }

    .pr-3 {
      padding-right: 3rem !important;
    }
  }
}

.form-inverse {
  [class*="uex-input-"] {
    .form-group {
      &.is-disabled {
        label:not(.btn) {
          color: $label-inverse-disabled-color;
        }
      }
    }
  }
}