.et-widget-standardcheckout {
    .container {
        padding-top: $grid-gutter-width;
        padding-bottom: $grid-gutter-width;
    }

    hr {
        border-color: $colorNeutral5;
    }

    // Checkout Steps Navigation
    .checkout-steps {
        margin-bottom: 0;
        padding: 0;

        @include media-breakpoint-up(md) {
            margin-bottom: rem(40px);
        }

        .breadcrumb {
            padding: 0;
        }

        .breadcrumb-item {
            a:not(.btn):link {
                text-decoration: none;
            }

            &.active {
                color: inherit;
            }
        }
    }

    // checkout steps mobile
    .checkout-steps-mobile {
        padding-top: rem(18px);
        padding-bottom: rem(18px);
        background: $colorNeutral3;

        @include media-breakpoint-up(md) {
            display: none;
        }

        .nav {
            align-items: center;
            justify-content: center;

            .breadcrumb-link {
                background: $colorContentBackground;
                border: $border-width solid $colorButtonPrimary;
                color: color-yiq($colorContentBackground, $colorButtonPrimary);
                width: 22px;
                height: 22px;
                text-align: center;
                text-decoration: none;
                border-radius: 50%;

                &.active {
                    background: $colorButtonPrimary;
                    color: color-yiq($colorButtonPrimary);
                }
            }

            .breadcrumb-divider {
                margin: 0 4px;
                height: 1px;
                width: 30px;
                background: $colorButtonPrimary;
            }

            .breadcrumb-label {
                color: color-yiq($colorNeutral3, $colorButtonPrimary);
                flex: 1 1 100%;
                text-align: center;
                margin-top: 8px;
            }
        }
    }

    // General styles
    .form-group {
        margin-bottom: rem(10px);

        @include media-breakpoint-up(md) {
            margin-bottom: rem(20px)
        }
    }

    input[type=radio]:checked + label,
    input[type=checkbox]:checked + label {
        font-weight: inherit;
    }

    .h3 {
        margin-top: rem(30px);
        margin-bottom: rem(20px);
    }

    .et-boxed-content {
        .h3 {
            margin-top: 0;
        }
    }

    .et-checkout-firm-trigger {
        display: block;
        margin-bottom: rem(20px);
    }
    .et-checkout-coupon-trigger {
        display: block;
        margin-top: rem(20px);
        i {
            margin-right: 0.5em;
        }
    }

    .cart-summary {
        transition: margin-top 300ms;

        margin-top: $grid-gutter-width;

        @include media-breakpoint-up(lg) {
            margin-top: 0;
        }

        &.et-sticky-active {
            margin-top: $grid-gutter-width;
        }
    }

    // Remove last margins to avoid uneven padding of et-boxed-content
    .et-boxed-content {
        .snippets-checkbox-wrapper:last-child,                                  // Custom checkboxes
        &.inc-billing-address-form .col:last-child .col:last-child .form-group, // Billing Address
        .inc-shipping-address .control-toggle,                                  // Different Shipping Address
        #select_shipping_address .list-group                                    // Different Shipping Address
        {
            margin-bottom: 0;
        }
    }

    // -------------------------
    // Step 0: Login Or Register
    // -------------------------
    .checkout-existing-customer {
        &-hr {
            margin-top: rem(20px);

            @include media-breakpoint-up(md) {
                margin-top: rem(40px)
            }
        }

        .h3 {
            margin-top: 0;
        }

        #order_register_or_login {
            margin-top: rem(30px);

            .customer-login-buttons {
                margin-bottom: 0;
            }
        }
    }

    #create_account_data {
        margin-top: rem(20px);
    }

    // ------------------------------
    // Step 2: Address
    // ------------------------------
    #select_shipping_address {
        margin-top: rem(20px);

        .list-group-item {
            display: flex;
            align-items: center;
            label {
                margin-bottom: 0;
            }
        }
    }

    // ------------------------------
    // Step 3/4: Shipping and Payment
    // ------------------------------
    .checkout-shipping-form {
        .h3 {
            margin-top: 0;
        }

        &-options {
            .title {
                font-weight: bold;
            }

            .desc {
                font-weight: normal;
                color: $colorFontMuted;
            }

            .shipping-option-price {
                text-align: right;
                font-weight: $font-weight-bold;
                word-break: break-word;
                hyphens: auto;
            }
        }

        hr {
            margin-top: rem(30px);
            margin-bottom: rem(30px);
        }

        .custom-control:not(:last-child) {
            margin-bottom: rem(30px);
        }

        .custom-control-label {
            cursor: pointer;
        }
    }

    .checkout-shipping-form-packaging {
        &-title {
            font-weight: $font-weight-bold;
        }
    }

    .checkout-payment-options {
        .title {
            font-weight: $font-weight-bold;
        }
    }

    // ------------------------------
    // Step 5: Confirmation
    // ------------------------------
    #complete-order-button {
        margin-top: rem(20px);
    }

    .checkout-confirmation {
        // Billing and Delivery Address
        &-billing-address {
            &-wrapper {
                display: flex;
                flex-flow: column nowrap;
            }

            &-body {
                flex: 1 1 0;
            }
        }

        &-billing-address,
        &-delivery-address {
            flex: 1 1 100%;
            display: flex;
            flex-flow: row wrap;

            @include media-breakpoint-up(md) {
                flex-flow: column nowrap;
            }

            &-header {
                flex-basis: 100%;

                @include media-breakpoint-up(md) {
                    flex-basis: 0;
                }
            }

            &-content {
                display: flex;
                flex-flow: row wrap;
                flex: 1 1 0;

                @include media-breakpoint-up(md) {
                    flex-flow: column nowrap;
                }
            }

            .additional-contact {
                margin-top: rem(5px);

                @include media-breakpoint-up(lg) {
                    margin-top: rem(10px);
                }
            }

            .address-mail {
                margin-top: rem(10px);

                @include media-breakpoint-up(lg) {
                    margin-top: rem(20px);
                }
            }
        }


        &-delivery-address-content {
            margin-top: rem(24px);
            margin-bottom: rem(20px);
            border-bottom: 1px solid $colorNeutral5;

            @include media-breakpoint-up(md) {
                margin-top: 0;
                margin-bottom: 0;
                border-bottom: 0 none;
            }
        }

        // Shipping and Payment Info
        &-shipping {
            display: flex;
            flex-flow: row wrap;
            height: 100%;

            @include media-breakpoint-up(md) {
                flex-flow: column nowrap;
            }

            .checkout-confirmation-heading {
                flex-basis: 100%;

                @include media-breakpoint-up(md) {
                    flex-basis: 0;
                }

                @include media-breakpoint-down(lg) {
                    margin-bottom: rem(10px);
                }
            }

            &-body {
                display: flex;
                flex-flow: row wrap;
                flex: 1 1 0;

                @include media-breakpoint-up(md) {
                    flex-flow: column nowrap;
                }
            }

            .checkout-confirmation-payment-method {
                margin-top: rem(20px);
                display: flex;
                flex-flow: row wrap;
                flex: 1 1 100%;

                @include media-breakpoint-up(md) {
                    flex-flow: column nowrap;
                    flex-basis: 0;
                }

                @include media-breakpoint-up(lg) {
                    margin-top: rem(30px);
                }
            }
        }

        // Details / General
        &-heading {
            margin-top: 0;
            margin-bottom: rem(40px);
        }

        // Content Header and Footer {
        .checkout-confirmation-content {
            &-header {
                flex-basis: 100%;

                @include media-breakpoint-up(md) {
                    flex-basis: 0;
                }

                .checkout-confirmation-change-link {
                    margin-left: 5px;
                }
            }

            &-footer {
                margin-top: auto;
                flex-basis: 100%;

                @include media-breakpoint-up(md) {
                    flex-basis: 0;
                }

                .checkout-confirmation-change {
                    &-link {
                        margin-top: rem(40px);
                        display: none;

                        @include media-breakpoint-up(lg) {
                            display: block;
                        }
                    }

                    &-mobile {
                        float: right;

                        @include media-breakpoint-up(lg) {
                            display: none;
                        }
                    }
                }
            }
        }

        // Comment
        #panel-edit-comment {
            .checkout-confirmation-heading {
                margin-bottom: rem(20px);
            }

            .form-control {
                height: 44px;

                @include media-breakpoint-up(lg) {
                    width: 66.667%;
                }
            }
        }

        // Order Item Table
        .checkout-items-header {
            font-weight: $font-weight-bold;

            @include media-breakpoint-up(lg) {
                font-size: medium;
            }

            hr {
                margin-top: 0;
            }
        }

        .checkout-items-item-image-wrapper img {
            border-radius: $border-radius;
        }

        .checkout-items-item-quantity {
            text-align: center;
        }

        .checkout-items-item-price {
            margin-left: auto;
            text-align: right;
        }

        .checkout-button-row {
            margin-top: 0;
        }

        .order-items-name {
            font-weight: $font-weight-bold;
            line-height: 1.75;
            margin-bottom: 5px;
            display: block;
        }

        .rating {
            display: block;
            margin-bottom: 5px;

            &:not(.btn),
            &:not(.btn):link {
              color: $colorRatings;
            }
        }

        .order-items-product-data {
            color: $colorFontMuted;

            li {
              margin-bottom: 5px;
            }
        }

        .notice {
            color: $colorFontMuted;
        }

        // Sidebar
        .custom-control-inline {
            margin-right: 0;
        }

        .custom-control-label {
            cursor: pointer;
            color: $colorFontMuted;
            font-size: 13px;
        }

        .checkout-coupon-form {
            margin-top: rem(20px);
        }

        .credit-form {
            margin-top: rem(20px);

            .credit-amount-description {
                margin-top: rem(10px);
                margin-bottom: rem(10px);
            }
        }
    }
}