:root {
    --cart-font-family: 'Inter';

    --cart-error-color: #dc2626;
    --cart-text-color: #000;
    --cart-background-color: #fff;

    --cart-border-color: none;
    --cart-border-width: 1px;
    --cart-borders: var(--cart-border-width) solid var(--cart-border-color);
    --cart-border-radius: 0;
    --cart-item-border-radius: 0;

    --cart-remove-button-background-color: hsla(0, 100%, 60%, 0%);
    --cart-remove-button-text-color: hsla(0, 100%, 60%, 100%);
    --cart-remove-button-hover-background-color: hsla(0, 100%, 60%, 8%);
    --cart-remove-button-border-radius: 0;

    --cart-submit-button-background-color: #00a972;
    --cart-submit-button-text-color: #fff;
    --cart-submit-button-hover-background-color: hsla(160, 100%, 36%);
    --cart-submit-button-disabled-background-color: #cccccc;
    --cart-submit-button-disabled-text-color: #fff;
    --cart-submit-button-height: 60px;
    --cart-submit-button-font-size: 20px;

    --cart-shopping-button-text-color: #fff;
    --cart-shopping-button-background-color: #000;
    --cart-shopping-button-hover-background-color: #212121;

    --cart-coupon-button-background-color: #ec000c;
    --cart-coupon-button-text-color: #000;
    --cart-coupon-button-hover-background-color: #ff3333;

    --cart-item-background-color: #fff;
    --cart-item-border-bottom-color: var(--cart-border-color);

    --cart-summary-background-color: #fff;
    --cart-totals-border-color: var(--cart-border-color);

    --cart-notice-text-color: #084298;
    --cart-notice-background-color: #cfe2ff;
    --cart-notice-border-color: #b6d4fe;
}

.main {
    font-family:
        'Inter',
        Roboto,
        system-ui,
        -apple-system;
}

.totals-wrapper {
    margin-top: 0;
}

.cart-summary-sidebar .cart-summary {
    margin-top: 0 !important;
}

.hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.list-item-details-attributes {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.list-item-price,
.list-item-row_total {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.btn.clear {
    border: 1px solid hsla(0, 100%, 60%, 100%);
}

.cart-items-wrapper .list-item-row_total span strong {
    font-weight: 700 !important;
}

.cart-wrapper .list-item-quantity select {
    width: 100%;
    border: 1px solid rgb(220, 220, 220);
    border-radius: 0;
    appearance: none;
    background-image: url(../../../assets/images/icons/chevron-down.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - 1rem) center;
    background-size: 1.5em;
    text-align: center !important;
    margin-bottom: 2rem;
}

.btn,
.remove {
    transition: all 100ms ease;
}

.btn:focus-visible,
.remove:focus-visible,
a:focus-visible,
button:focus-visible {
    outline: #d6aa85;
    box-shadow:
        0 0 0 1.5px #fff,
        0 0 0 3px #d6aa85;
}

.cart-items-wrapper {
    position: relative;
}

button.remove {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    margin-top: 0 !important;
}

.quantity-button-container {
    display: flex;
    align-items: center;
}

.quantity-button-container button {
    height: 52px;
    padding-inline: 1rem;
    background-color: #00000007;
    transition: background-color 100ms;
}

.quantity-button-container button:hover {
    background-color: #00000012;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type='number'] {
    appearance: textfield;
    -moz-appearance: textfield;
}

.cart-items-wrapper .list-item {
    grid-template-columns: 100px 1fr 120px 159px 120px;
}

.cart-items-wrapper .list-item-quantity button.remove {
    width: max-content;
}

@media (max-width: 630px) {
    .cart-wrapper .list-item-row_total .row_total_excluding_tax {
        border-bottom: 1px solid rgb(240, 240, 240) !important;
    }

    .cart-wrapper .list-item-row_total strong {
        padding-block: 0.6rem;
        text-align: center !important;
    }
}

@media (min-width: 631px) {
    .cart-items-wrapper .list-item-quantity button.remove {
        position: static;
        top: initial;
        right: initial;
        width: 100%;
        margin-top: initial;
    }

    .cart-wrapper .list-item-quantity select {
        margin-bottom: 0;
    }
}

@media (max-width: 768px) {
    .cart-wrapper .list-item {
        grid-template-columns: 90px 1fr 140px;
        gap: 16px;
    }
}

@media (max-width: 900px) {
    .cart-wrapper .list-item-quantity {
        grid-column: span 4;
        max-width: 160px;
    }
}