#MainContent{position: relative;}
.hdt-container--main-cart{
    padding-block: 6rem;
}
.hdt-main-cart.is-empty{
    display: block;
    padding-block: 5.7rem;
    .hdt-marquee, .hdt-cart__shipping-estimator, .hdt-cart__blocks, .hdt-cart-header{
        display: none;
    }
    .hdt-cart-empty{
        width: 100%;
        max-width: 550px;
        margin-inline: auto;
        .hdt-heading--cart__empty{
            margin-block: 1.5rem 2rem;
        }
        .hdt-icon-cart-empty svg{
            max-width: 7rem;
            height: auto;
        }
    }
}
.hdt-main-cart:not(.is-empty){
    display: flex;
    flex-direction: column;
    column-gap: var(--spacing-y);
    --padding-y: 2rem;
    --height-maquee: 2.5rem;
    .hdt-cart-empty{display: none;}
    .hdt-cart-header{
        margin-block-end: 5rem;
    }
    .hdt-marquee{
        width: 100%;
        align-self: flex-start;
        padding: 1.8rem var(--padding-y) 1.4rem;
        border-bottom: 1px solid var(--color-line-border);
        border-top: 1px solid var(--color-line-border);
        .hdt-icwt-cart {
            display: inline-flex;
            gap: 0.6rem;
            align-items: center;
            a {
                display: inline; 
                margin: 0;
            }
        }
    }
    .hdt-cart__blocks{
        border: 1px solid var(--color-line-border);
        align-self: flex-start;
        background: var(--color-background2);
        padding: var(--height-maquee) 0 3.2rem;
        display: grid;
        width: 100%;
    }
    .hdt-cart__shipping-estimator{
        padding: 1.8rem var(--padding-y) 3.8rem;
        border: 1px solid var(--color-line-border);
        margin-block-end: 2.4rem;
        .hdt-cart__shipping-estimator-heading{
            padding: 0.6rem;
        }
        .hdt-shipping-calculator{
            width: 100%;
            align-items: flex-end;
            flex-wrap: wrap;
            display: flex;
            column-gap: 0.8rem;
            row-gap: 1.4rem;
            .hdt-field--fieldset{
                border-radius: var(--rounded-input);
                margin-block-end: 0
            }
            .hdt-input{
                margin-block-start: 0;
                border: none;
            }
            .hdt-field--fieldset{
                flex-grow: 1;
            }
            .hdt-shipping-province .hdt-field--fieldset{
                width: min(24rem, 50%);
            }
            .hdt-field-shipcode{
               width: min(18rem, 33%);
               overflow: hidden;
               @media (max-width: 575.98px) {
                width: 100%;
               }
            }
            .hdt-field--btns {
                min-width: 14.7rem;
                .hdt-btn{
                    width: 100%;
                }
                @media (max-width: 575.98px) {
                    margin-left: auto;
                }
            }
            .hdt-response__rates{
                display: block;
                width: 100%;
                &:empty{display: none;}
            }
        }
    }
}
table.hdt-table--cart{
    margin-block-end: 2.4rem;
    th {
        font-weight: var(--font-medium, 500);
        font-size: var(--h6-size-xl);
        background: transparent;
        color: var(--color-foreground);
        border: none;
        border-bottom: 1px solid var(--color-line-border);
    }
    td{
        border: none;
        padding: 0;
        &:last-child{
            text-align: right;
        }
        .hdt-cart-remove-button{display: inline-flex;}
    }
    tr.hdt-main-cart-item{
        position: relative;
    }
    tr.hdt-row-border td{
        padding: 0;
        &:after{
            content: "";
            display: block;
            border-bottom: 1px solid var(--color-line-border);
            margin-inline: 0;
        }
    }
}
.hdt-main-cart-item {
    .hdt-main-cart-item-inner {
        display: flex;
        column-gap: 2.2rem;
        align-items: center;
        .hdt-cart-item__media{
            flex:  0 0 9.8rem;
        }
        .hdt-cart-item-header{
            margin-block-end: 0.6rem;
        }
    }
    .hdt-discounts {
        margin-block-start: .3rem;
    }
}
.hdt-main-cart-item__quantity{
    .hdt-cart-quantity{
        padding: 0.5rem;
        button{
            background: var(--color-foreground);
            color: var(--color-background);
            &[name="minus"].disabled {
                opacity: .5;
                pointer-events: none;
            }
        }
    }
}
.hdt-cart__blocks{
    .hdt-free-shipping-bar{
        padding: 2.4rem var(--padding-y) 2rem;
        border-bottom: 1px solid var(--color-line-border);
    }
    .hdt-cart__note{
        padding: 2.2rem var(--padding-y) 0;
        display: flex;
        flex-direction: column;
        .hdt-textarea{
            min-height: 10.8rem;
            margin-block-start: 0.7rem;
            border-radius: min(var(--rounded-input), 1rem);
        }
        
        .hdt-cart-openable__heading {
            display: grid;
            .hdt-lb-note, .hdt-lb-shownote{
                grid-area: 1/-1;
                transition: visibility 0.3s ease-out, opacity 0.3s ease-out;
            }
            .hdt-lb-shownote{visibility: hidden; opacity: 0}
            &.has-noted{
                .hdt-lb-note{visibility: hidden; opacity: 0;}
                .hdt-lb-shownote{visibility: visible; opacity: 1}
            }
        }
    }
    .hdt-page-cart__add-gift{
        padding: 0 var(--padding-y);
    }
    .hdt-cart__note + .hdt-page-cart__add-gift{
        padding-block-end: 2.4rem;
        border-bottom: 1px solid var(--color-line-border);
    }
    .hdt-page-cart__add-gift[hidden] + .hdt-cart__discount,
    .hdt-cart__note +  .hdt-cart__discount{
        margin-block-start: 2.4rem;
        border-top: 1px solid var(--color-line-border);
    }
    .hdt-cart__discount{
        padding: 2rem var(--padding-y) 2.4rem;
        border-bottom: 1px solid var(--color-line-border);
        .hdt-discount-heading{
            margin-block-end: 0.7rem;
            + form {
                margin-block-start: .7rem;
            }
        }
        .hdt-field--discount{background: var(--input-background);}
    }
    .hdt-cart__footer{
        padding: 2rem var(--padding-y);
    }
    .hdt-cart__ctas{
        padding: 0 var(--padding-y) 2.4rem;
    }
    .hdt-cart__dynamic-checkout-buttons{
        padding: 0 var(--padding-y) 2.4rem;
    }
    .hdt-cart__payment{
        padding: 0 var(--padding-y);
        .hdt-list-payment{
            justify-content: center;
        }
    }
    > *:last-child{
        padding-block-end: 0;
    }
}
@media (max-width: 767.98px) {
    table.hdt-table--cart{
        box-shadow: none;
        thead{
            display: none;
        }
        tr.hdt-main-cart-item {
            display: grid;
            grid-template-columns: 9.8rem minmax(0, 1fr) 3.5rem;
            grid-template-areas: "image pr-info remove"
                       "image quantity quantity"
                       "image total total";
            column-gap: 1rem;
            padding-block: 2rem 0.6rem;
            .hdt-main-cart-item__details{
                display: contents;
                .hdt-main-cart-item-inner{
                    display: contents;
                    .hdt-cart-item__media{
                        grid-area: image;
                        align-self: flex-start;
                    }
                    .hdt-main-cart-item__content{
                        grid-area: pr-info;
                        padding-block-end: 0.5rem;
                    }
                }
            }
            .hdt-main-cart-item__quantity{
                grid-area: quantity;
            }
            .hdt-main-cart-item__total{
                grid-area: total;
            }
            .hdt-remove-cart-item{
                grid-area: remove;
            }
            .hdt-main-cart-item__quantity, .hdt-main-cart-item__total{
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: 1rem;
                padding-block: 1rem;
                border-top: 1px dashed var(--color-line-border);
                &:before{
                    content: attr(data-label);
                    color: var(--color-foreground);
                    font-weight: var(--font-medium);
                }
            }
        }
    }
}
@media (min-width: 768px) {
    .hdt-main-cart:not(.is-empty){
        .hdt-marquee{
            margin-block-end: 2.4rem;
        }
    }
    table.hdt-table--cart{
        margin-block-end: 2.4rem;
        th {
            padding: var(--padding-x-xl, 1.8rem) 1rem var(--padding-x, 1.4rem);
            &:first-child{
                padding-inline-start: var(--padding-y);
            }
            &:last-child{
                padding-inline-end: var(--padding-y);
            }
        }
        td{
            padding-inline: 1rem;
            padding-block: 1.4rem;
            &:first-child{
                padding-inline-start: var(--padding-y);
            }
            &:last-child{
                padding-inline-end: var(--padding-y);
                min-width: 5.5rem;
            }
        }
        tr.hdt-main-cart-item:first-child{
            td{padding-block-start: 2.4rem;}
        }
        tr.hdt-main-cart-item:last-child{
            td{padding-block-end: 2.4rem;}
        }
        tr.hdt-row-border td{
            &:after{
                margin-inline: var(--padding-y);
            }
        }
    }
}
@media (min-width: 992px) {
    .hdt-container--main-cart{
        padding-block: 9rem;
        .hdt-main-cart.is-empty{
            padding-block: 0;
        }
    }
    .hdt-main-cart:not(.is-empty){
        display: grid;
        column-gap: var(--spacing-y);
        grid-template-columns: minmax(0, 1fr) min(35%, 432px);
        --padding-y: 2.8rem;
        --height-maquee: 5.7rem;
        .hdt-cart-header{
            grid-area: 1/1/2/3;
        }
        .hdt-marquee{
            grid-area: 2/2/5/3;
            align-self: flex-start;
            border-top: none;
            margin-block-end: 0;
            border-radius: var(--rounded) var(--rounded) 0 0;
        }
        .hdt-cart__blocks{
            grid-area: 2/2/5/3;
        }
        .hdt-main-cart-items-wrap{
            grid-area: 2/1/3/2;
        }
        .hdt-cart__shipping-estimator{
            grid-area: 3/1/4/2;
            margin-block-end: 0;
            .hdt-shipping-calculator{
                display: flex;
                gap: 0.8rem;
                align-items: flex-end;
                .hdt-field--fieldset{
                    margin-block-end: 0;
                }
            }
        }
    }
}