.input-reset {
  border: 0 none;
  box-shadow: none;
  outline: none;
}

.input-group {
  position: relative;

  i {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 28px;
  }
}

.form-control {
  font-size: rem($font-size-sm);
  display: block;
  width: 100%;
  padding: rem($input-btn-padding-x);
  border: 1px solid $input-border-color;
  background-color: $input-background;
  color: $input-color;
  resize: none;

  &:focus {
    outline: none;
    border-color: $login-input-border-color-focus;
  }

  &:disabled {
    opacity: $disable-opacity;
  }

  &.error {
    border-color: $clr-theme-danger;
    color: $clr-theme-danger;

    &:focus {
      border-color: inherit;
    }

    &::placeholder {
      color: inherit;
    }
  }

  &.input-icon {
    padding-left: 40px;

    &:focus {
      + i {
        color: $login-input-border-color-focus;
      }
    }

    &.error {
      + i {
        color: $clr-theme-danger;
      }
    }
  }
}

input[type="search"]::-webkit-search-cancel-button {
  appearance: none;
}

.form-text {
  background: $clr-gray-light;
  border: 1px solid $clr-gray-light-D5;
  border-radius: rem(20);
  color: $clr-desktop-text;
  display: block;
  font-family: $font-family-sans-serif;
  font-size: rem($font-size-sm);
  margin-top: 0;
  padding: rem(10) rem(23);
  transition: border .3s ease;
  width: 100%;

  @include media-breakpoint-down(md) {
    font-size: rem(16);
  }

  &.error {
    border-color: $clr-red !important;
    color: $clr-red;
  }

  &:focus {
    border-color: $clr-desktop-button-color;
    outline: none;
  }
}

.form-search {
  border: 1px solid $clr-gray-light-D5;
  border-radius: rem(17);
  font-family: $font-family-base;
  font-size: rem(14);
  outline: none;
  padding: rem(7) rem(20);

  &:focus {
    border-color: $clr-desktop-button-color;
  }
}

.form-textarea {
  background: $clr-gray-light;
  border: 1px solid $clr-gray-light-D5;
  border-radius: rem(10);
  outline: none;
  padding: rem(10) rem(20);
  resize: none;

  &:focus {
    border-color: $clr-desktop-button-color;
  }
}

::-webkit-input-placeholder {
  color: $clr-gray;
}
::-moz-placeholder {
  color: $clr-gray;
}
:-ms-input-placeholder {
  color: $clr-gray;
}
:-moz-placeholder {
  color: $clr-gray;
}
