/*------------------------------------------------------------
CHECKOUT
Adresses, Expédition, Paiement, Confirmation
====================================*/

/* Variables Custom */
$checkout-block-padding-y-mobile: 30px;
$checkout-block-padding-x-mobile: 20px;

$checkout-block-padding-y-desktop: 45px;
$checkout-block-padding-x-desktop: 40px;
/***************************************/

.checkout-block {
    margin-bottom: 30px;
    padding: $checkout-block-padding-y-mobile $checkout-block-padding-x-mobile;
    border: 1px solid $gray-200;
    .h3 {
        margin-bottom: 25px;
    }
}

// Addresses
.checkout-address-form {
    margin-bottom: 30px;
    .required-fields {
        margin: 15px 0;
    }
    .checkout-address-shipping {
        position: relative;
        padding-top: $checkout-block-padding-y-mobile;
        margin-top: $checkout-block-padding-y-mobile;
        &:before {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            right: -$checkout-block-padding-x-mobile;
            left: -$checkout-block-padding-x-mobile;
            height: 1px;
            background: $gray-200;
        }
    }
}
.address-book-select-wrapper {
    padding: 20px $checkout-block-padding-x-mobile;
    margin: 0 (-$checkout-block-padding-x-mobile) 15px;
    background: $gray-400;
}

// Thank you page
.order-thank-you-container {
    margin-bottom: 30px;
}
.order-thank-intro {
    margin: 50px 0;
    text-align: center;
}
.order-thank-summary {
    margin-bottom: 20px;
}

/* RESPONSIVE */
/***************************************/
@include media-breakpoint-down(sm) {
    .checkout-navigation {
        display: flex;
        flex-direction: column-reverse;
        .btn {
            width: 100%;
            margin-top: 20px;
            padding-right: 1rem;
            padding-left: 1rem;
        }
    }
}
@include media-breakpoint-up(md) {
    .checkout-navigation {
        display: flex;
        justify-content: center;
        margin-top: 40px;
        .btn + .btn {
            margin-left: auto;
        }
    }

    .checkout-block {
        padding: $checkout-block-padding-y-desktop $checkout-block-padding-x-desktop;
        .h3 {
            margin-bottom: 30px;
        }
    }

    // Addresses
    .checkout-address-form {
        .checkout-address-shipping {
            padding-top: $checkout-block-padding-y-desktop;
            margin-top: $checkout-block-padding-y-desktop;
            &:before {
                right: -$checkout-block-padding-x-desktop;
                left: -$checkout-block-padding-x-desktop;
            }
        }
    }
    .address-book-select-wrapper {
        padding: 20px $checkout-block-padding-x-desktop;
        margin: 0 (-$checkout-block-padding-x-desktop) 15px;
    }
}
