.input {
  border: 1px solid #969FAA;
  border-radius: 6px;
  width: 100%;
  height: 40px;
  padding: 0 15px;

  &.--error {
    border-color: $color-primary;
  }

  @include placeholder {
    color: #697687
  };

  &-datepicker {
    position: relative;

    &:after {
      content: '';
      position: absolute;
      right: 10px;
      top: 50%;
      margin-top: -10px;
      width: 20px;
      height: 20px;
      background-image: url('../images/icons/calendar.svg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      pointer-events: none;
    }
  }

  &-selecter {
    position: relative;

    .input {
      line-height: 38px;
    }

    &:after {
      content: '';
      position: absolute;
      right: 18px;
      top: 50%;
      margin-top: -7px;
      width: 8px;
      height: 14px;
      background-image: url('../images/icons/arrow-right.svg');
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      pointer-events: none;
      transform: rotate(90deg);
      opacity: 0.6;
    }
  }
}