.checkout-left {
    flex-grow: 1;
    padding-right: 15px;
}

.checkout-form {
    .account-details {
        margin-bottom: 14px;
    }

    .section-title {
        margin-bottom: 25px;
        padding-bottom: 13px;
        border-bottom: 1px solid $border-color-lite;
    }

    .create-an-account-form {
        .helper-text {
            font-size: 14px;
            display: block;
            margin: -4px 0 14px;
            color: $color-gray;
        }
    }

    .create-an-account-label,
    .ship-to-different-address-label {
        margin: 4px 0 7px;

        label {
            color: $color-black;
        }
    }

    .address-card-wrap {
        margin-bottom: -10px;

        > .row {
            margin-left: -10px;
            margin-right: -10px;

            > .col {
                flex: 0 0 33.33333333333333%;
                max-width: 33.33333333333333%;
                padding-left: 10px;
                padding-right: 10px;
            }
        }

        .address-card {
            margin-bottom: 20px;
        }

        .error-message {
            display: inline-flex;
            margin: 0 0 20px;
        }
    }

    .add-new-address-wrap {
        .btn-add-new-address {
            font-weight: var(--font-medium);
            margin-bottom: 20px;
            padding: 5px 0;

            &:hover {
                color: $color-default;
                color: var(--color-primary);
            }
        }
    }

    .ship-to-different-address-form {
        padding-top: 14px;
    }

    .order-notes {
        margin-bottom: 0;

        textarea {
            height: 80px;
        }
    }
}

@media screen and (max-width: 1700px) {
    .checkout-form {
        .address-card-wrap {
            padding: 3px 0;

            > .row {
                > .col {
                    flex: 0 0 50%;
                    max-width: 50%;
                }
            }
        }
    }
}

@media screen and (max-width: 1350px) {
    .checkout-form {
        .address-card-wrap {
            > .row {
                > .col {
                    flex: 0 0 100%;
                    max-width: 100%;
                }
            }
        }
    }
}

@media screen and (max-width: 1280px) {
    .checkout-form {
        .address-card-wrap {
            > .row {
                > .col {
                    flex: 0 0 33.33333333333333%;
                    max-width: 33.33333333333333%;
                }
            }
        }

        .order-notes {
            margin-bottom: 20px;
        }
    }
}

@media screen and (max-width: $xl) {
    .checkout-form {
        .address-card-wrap {
            > .row {
                > .col {
                    flex: 0 0 50%;
                    max-width: 50%;
                }
            }
        }
    }
}

@media screen and (max-width: $lg) {
    .checkout-left {
        padding-right: 0;
    }

    .checkout-form {
        .address-card-wrap {
            > .row {
                > .col {
                    flex: 0 0 33.33333333333333%;
                    max-width: 33.33333333333333%;
                }
            }
        }
    }
}

@media screen and (max-width: 850px) {
    .checkout-form {
        .address-card-wrap {
            > .row {
                > .col {
                    flex: 0 0 50%;
                    max-width: 50%;
                }
            }
        }
    }
}

@media screen and (max-width: $sm) {
    .checkout-form {
        .address-card-wrap {
            > .row {
                > .col {
                    flex: 0 0 100%;
                    max-width: 100%;
                }
            }
        }
    }
}
