/* Scoped compact checkout layout. Keep the coupon field and primary next action visible together on desktop. */
.subscription-checkout-page {
    padding-top: .75rem !important;
    padding-bottom: 1rem !important;
}

.subscription-checkout-page .checkout-page-heading {
    margin-bottom: .85rem !important;
}

.subscription-checkout-page .checkout-page-heading h1 {
    font-size: clamp(1.45rem, 1.8vw, 1.85rem);
    line-height: 1.2;
}

.subscription-checkout-page .checkout-page-heading p {
    font-size: .92rem;
}

.subscription-checkout-page .checkout-main-grid {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1rem;
    align-items: flex-start;
}

.subscription-checkout-page .checkout-detail-body,
.subscription-checkout-page .checkout-order-body {
    padding: 1rem !important;
}

.subscription-checkout-page .checkout-tenant-heading {
    margin-bottom: .75rem !important;
}

.subscription-checkout-page .checkout-tenant-heading .fs-5 {
    font-size: 1.05rem !important;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.subscription-checkout-page .checkout-selected-plan {
    padding: .7rem .8rem !important;
    margin-bottom: .7rem !important;
}

.subscription-checkout-page .checkout-selected-plan .fs-4 {
    font-size: 1.25rem !important;
    line-height: 1.25;
}

.subscription-checkout-page .checkout-billing-details {
    margin-bottom: .7rem !important;
}

.subscription-checkout-page .checkout-detail-tile {
    padding: .6rem .7rem !important;
    line-height: 1.25;
}

.subscription-checkout-page .checkout-coupon-card {
    padding: .8rem !important;
    margin-bottom: .7rem !important;
}

.subscription-checkout-page .checkout-coupon-card .form-label {
    margin-bottom: .2rem;
}

.subscription-checkout-page .checkout-coupon-card .form-control,
.subscription-checkout-page .checkout-coupon-card .btn {
    min-height: 38px;
}

.subscription-checkout-page .checkout-coupon-card .btn {
    white-space: nowrap;
    padding-left: .8rem;
    padding-right: .8rem;
}

.subscription-checkout-page .checkout-coupon-card .alert {
    font-size: .86rem;
    line-height: 1.35;
}

.subscription-checkout-page .checkout-payment-info-card {
    padding: .8rem !important;
}

.subscription-checkout-page .checkout-payment-info-card > .d-flex {
    margin-bottom: .35rem !important;
}

.subscription-checkout-page .checkout-payment-info-card .alert {
    font-size: .86rem;
    line-height: 1.35;
}

.subscription-checkout-page .checkout-order-card {
    height: auto;
}

.subscription-checkout-page .checkout-order-body .h4 {
    margin-bottom: .65rem !important;
}

.subscription-checkout-page .checkout-order-body .d-flex.justify-content-between.mb-2 {
    margin-bottom: .4rem !important;
    gap: .75rem;
}

.subscription-checkout-page .checkout-order-body .d-flex.justify-content-between.mb-2 > :last-child {
    text-align: right;
    overflow-wrap: anywhere;
}

.subscription-checkout-page .checkout-amount-due {
    margin-bottom: .8rem !important;
    gap: .75rem;
}

.subscription-checkout-page .checkout-amount-due .fs-3 {
    font-size: clamp(1.45rem, 1.8vw, 1.75rem) !important;
    white-space: nowrap;
}

.subscription-checkout-page .checkout-payment-action .form-control {
    min-height: 40px;
}

.subscription-checkout-page .checkout-phone-help {
    font-size: .76rem;
    line-height: 1.3;
    margin-top: .25rem;
}

.subscription-checkout-page .checkout-primary-action {
    min-height: 44px;
    font-weight: 650;
    margin-top: .55rem !important;
}

.subscription-checkout-page .checkout-security-note {
    font-size: .76rem;
    line-height: 1.35;
}

@media (min-width: 992px) {
    .subscription-checkout-page .checkout-detail-card {
        height: auto !important;
    }

    .subscription-checkout-page .checkout-order-card {
        align-self: flex-start;
    }
}

@media (max-width: 991.98px) {
    .subscription-checkout-page {
        padding-top: .5rem !important;
    }

    .subscription-checkout-page .checkout-detail-body,
    .subscription-checkout-page .checkout-order-body {
        padding: 1rem !important;
    }
}

@media (max-width: 575.98px) {
    .subscription-checkout-page .checkout-coupon-card .row {
        align-items: stretch !important;
    }

    .subscription-checkout-page .checkout-coupon-card .col-auto {
        width: 100%;
    }

    .subscription-checkout-page .checkout-coupon-card .btn {
        width: 100%;
    }
}