.newsletter-cta {
  $block: #{&};

  @include flex(column, nowrap, $whitespace-4);

  @include media-down(tablet-xs) {
    /* stylelint-disable-next-line @morev/bem/no-block-properties -- Exception */
    flex: 1;
  }

  @include media-down(mobile-m) {
    display: none;
  }

  &__form {
    @include flex(row, nowrap);

    @include media-down(tablet-xs) {
      flex: 1;
    }
  }

  &__input-container {
    @include flex(row, nowrap, $whitespace-3, center);

    max-inline-size: 40rem;
    block-size: 5rem;
    padding: $whitespace-4 $whitespace-5;
    border: 0.1rem solid $color-neutral-10;

    &--error {
      border-color: $color-status-error;

      #{$block}__input::placeholder,
      #{$block}__label-icon {
        color: $color-status-error;
      }
    }

    @include media-down(tablet-xs) {
      flex: 1;
      max-inline-size: 21rem;
    }
  }

  &__input::placeholder,
  &__label-icon {
    color: $color-neutral-7;
  }

  &__input {
    @include remove-input-styles;

    flex: 1;
    min-inline-size: 0;

    &::placeholder {
      font-size: $font-size-3;
    }
  }

  &__label-icon {
    inline-size: 2rem;
  }

  &__error-message {
    color: $color-status-error;
  }

  &__button {
    @include media-down(tablet-xs) {
      padding: $whitespace-2 $whitespace-3;
    }
  }
}