@import '../helpers/helpers';

.checkout-payment-details-v2 {
  .checkout-payment-details {
    margin: 0;

    .form-row {
      padding: 0;
    }

    .form-row__save {
      .form-row__field {
        margin: 0;
      }
    }

    &__card-details {
      margin: 20px 0 0;
    }

    &__title {
      color: $blue-ocean;
      font-weight: 400;
      font-size: 1.25rem;
      line-height: 2rem;
    }

    &__descr {
      @include make-col(12);
      @include make-col-offset(0);
    }

    .form-row__action {
      display: flex;
      margin: 0;

      .form-row__col-btn {
        @include make-col(12);
        margin: 0 0 20px;
        padding: 0;

        .paypal-button-container {
          width: 100%;
          min-width: inherit;
          max-width: inherit;
        }
      }

      .form-row__col-terms {
        @include make-col(12);
        margin: 0;
      }
    }
  }
}

@include media-breakpoint-up(md) {
  .checkout-payment-details-v2 {
    .checkout-payment-details {
      &__title {
        font-size: 1.5rem;
      }

      &__descr {
        @include make-col(12);
        @include make-col-offset(0);
      }

      .form-row__action {
        .form-row__col-btn {
          @include make-col(6);
        }

        .form-row__col-terms {
          @include make-col(6);
          padding-right: 15px;
          padding-left: 15px;
        }
      }
    }
  }
}

@include media-breakpoint-up(lg) {
  .checkout-payment-details-v2 {
    .checkout-payment-details {
      &__descr {
        @include make-col(12);
        @include make-col-offset(0);
      }
    }
  }
}

@media screen and (max-width: 366px) {
  .checkout-payment-details-v2 {
    .checkout-payment-details {
      .hop-iframe__wrapper {
        height: 560px;
      }
    }
  }
}

@media screen and (min-width: 366.1px) {
  .checkout-payment-details-v2 {
    .checkout-payment-details {
      .hop-iframe__wrapper {
        height: 560px;
      }
    }
  }
}
