/* <link rel="stylesheet" href="{ basePath }/sfsites/c/resource/ecommStyle/css/components/commerce-b2b-cart-contents.css?{ versionKey }"/> */
/* 
    This component is used on the "Cart" page
*/

/* CART ITEMS HEADER */

commerce_builder-b2b-cart-contents commerce_cart-header {
    flex-direction: row !important;
    padding-bottom: 2rem !important;
}

commerce_builder-b2b-cart-contents commerce_cart-header .header-labels {
    align-items: center !important;
    grid-column-gap: 2rem;
    flex-grow: unset !important;
}

@media (max-width: 574.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-header .header-labels {
        grid-column-gap: 1rem;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-header lightning-combobox {
    margin-left: 1rem;
    flex-grow: unset !important;
}

commerce_builder-b2b-cart-contents commerce_cart-header lightning-dialog {
    display: none;
}

commerce_builder-b2b-cart-contents commerce_cart-header .header-labels .clear-cart-section {
    margin-left: 0;
}

commerce_builder-b2b-cart-contents commerce_cart-header .label-count {
    flex-grow: unset !important;
}

commerce_builder-b2b-cart-contents commerce_cart-header .label-count dxp_base-text-block p {
    font-size: 2.25rem;
    font-weight: 500;
    line-height: 2.5rem;
}

@media (max-width: 574.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-header .label-count dxp_base-text-block p {
        font-size: 1.5rem;
        line-height: 2rem;
    }
    
}

commerce_builder-b2b-cart-contents commerce_cart-header .clear-cart-section {
    flex-grow: unset !important;
}

commerce_builder-b2b-cart-contents commerce_cart-header lightning-combobox.sort-menu .slds-combobox__input {
    color: var(--ecomm-color-gray-01);
}

commerce_builder-b2b-cart-contents commerce_cart-header lightning-combobox.sort-menu .slds-input__icon-group::before {
    content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%233B3F42' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

@media (max-width: 767.98px), (min-width: 1024px) and (max-width: 1299.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-header {
        flex-direction: column !important;
        flex-wrap: wrap;
    }

    commerce_builder-b2b-cart-contents commerce_cart-header .header-labels {
        justify-content: space-between;
    }

    commerce_builder-b2b-cart-contents commerce_cart-header lightning-combobox {
        margin-top: 1.5rem;
        margin-left: 0;
    }

    commerce_builder-b2b-cart-contents commerce_cart-header lightning-combobox,
    commerce_builder-b2b-cart-contents commerce_cart-header lightning-combobox > div {
        width: 100%;
    }

}

/* LIST OF PRODUCTS */

commerce_builder-b2b-cart-contents commerce_cart-items ul.items {
    padding-top: 0;
    padding-bottom: 0;
}

commerce_builder-b2b-cart-contents commerce_cart-items ul.items > section > article > li {
    padding-top: 1.5rem !important;
    border-top: 1px solid var(--ecomm-color-white-06) !important;
    padding-bottom: 1.5rem !important;
    border-bottom: 0 !important;
}

commerce_builder-b2b-cart-contents commerce_cart-items ul.items > section > article:last-child > li {
    padding-bottom: 0 !important;
}

@media (max-width: 1023.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-items ul.items > section > article:last-child > li {
        padding-bottom: 1.5rem !important;
    }
    
}

/* CART ITEM */

commerce_builder-b2b-cart-contents commerce_cart-item .container {
    grid-template-areas:
        "image name unit prices"
        "image details-pills-qty details-pills-qty prices"
        "image details-pills-qty details-pills-qty delete" !important;
    grid-template-columns: calc(9.375rem + 1.5rem) 1fr min-content min-content !important;
    grid-template-rows: min-content min-content 1fr !important;
}

@media (max-width: 767.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .container {
        grid-template-areas:
            "image name"
            "image details-pills-qty"
            "image unit"
            "image prices"
            "image delete" !important;
        grid-template-columns: calc(9.375rem + 1.5rem) 1fr !important;
        grid-template-rows: min-content !important;
    }

}

@media (max-width: 479.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .container {
        grid-template-columns: calc(7.5rem + 0.625rem) 1fr !important;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .item-image {
    margin-right: 0 !important;
    padding-right: 1.5rem;
}

@media (max-width: 479.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-image {
        padding-right: 0.625rem;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .item-image a:has(img[src=""]) experience-picture,
commerce_builder-b2b-cart-contents commerce_cart-item .item-image a:has(img[src*="default-product-image"]) experience-picture {
    opacity: 0;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-image a:has(img[src=""]),
commerce_builder-b2b-cart-contents commerce_cart-item .item-image a:has(img[src*="default-product-image"]) {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-image a:has(img[src=""])::after,
commerce_builder-b2b-cart-contents commerce_cart-item .item-image a:has(img[src*="default-product-image"])::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.5rem;
    height: 2.5rem;
    display: block;
    transform: translate(-50%, -50%);
    content: url("data:image/svg+xml,%3Csvg class='ecomm-product-image__svg' viewBox='0 0 150 143' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M37.1027 59.5577H143.31C147.005 59.5577 150 62.553 150 66.2479V135.659C150 139.354 147.005 142.349 143.31 142.349H37.1027C33.4078 142.349 30.4124 139.354 30.4124 135.659V66.2479C30.4124 62.553 33.4078 59.5577 37.1027 59.5577ZM46.3017 127.296H135.783V103.058L124.856 78.792L99.9469 88.3917L80.6025 107.95L60.0355 82.1553L46.3017 114.492V127.296ZM69.0875 46.1773H24.5585C20.8636 46.1773 17.8683 49.1726 17.8683 52.8675V93.2844L0.40529 45.3052C-0.858441 41.8331 0.931774 37.994 4.40385 36.7303L104.206 0.40529C107.678 -0.858441 111.517 0.931774 112.781 4.40385L127.985 46.1773H112.118L110.51 41.7599L91.9423 22.6947L71.819 40.2347L69.0875 46.1773Z' fill='%23E1E1E1' %3E%3C/path%3E%3C/svg%3E");
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-name {
    display: flex;
    padding-right: 1.5rem;
}

@media (max-width: 767.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-name {
        padding-right: 0;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .item-name a {
    text-decoration: none !important;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-name a h2 {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.5rem;
    color: var(--ecomm-color-primary-01);
    transition: color 0.1s;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-name a:hover h2,
commerce_builder-b2b-cart-contents commerce_cart-item .item-name a:focus h2 {
    color: var(--ecomm-color-primary-02);
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-details-pills-qty:not(:empty) {
    padding-top: 1rem;
}

@media (max-width: 767.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-details-pills-qty:not(:empty) {
        padding-top: 0.25rem;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .bundle-child-product-count,
commerce_builder-b2b-cart-contents commerce_cart-item .product-sku,
commerce_builder-b2b-cart-contents commerce_cart-item commerce_product_information-variant-attributes-display[class*="lwc-"] ul[class*="lwc-"] li.new-line {
    font-size: 1rem !important;
    line-height: 1.375rem !important;
    color: var(--ecomm-color-black-01) !important;
}

commerce_builder-b2b-cart-contents commerce_cart-item .product-sku {
    color: var(--ecomm-color-gray-01) !important;
}

commerce_builder-b2b-cart-contents commerce_cart-item commerce_product_information-variant-attributes-display[class*="lwc-"] ul[class*="lwc-"] li.new-line + li.new-line {
    margin-top: 0.25rem;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-pills:not(:empty) {
    padding-top: 12px;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-pills commerce-pill .slds-pill {
    padding-top: 3px;
    padding-bottom: 2px;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-pills commerce-pill .slds-pill .slds-pill__label {
    padding-top: 0;
    font-size: 0.75rem;
}

commerce_builder-b2b-cart-contents commerce_cart-item commerce-quantity-selector {
    width: 100% !important;
    flex-direction: column !important;
    align-items: flex-start;
    margin-top: 0.75rem !important;
}

commerce_builder-b2b-cart-contents commerce_cart-item commerce-quantity-selector > p[role="alert"][class*="error"] {
    margin: 1rem 0 0 0 !important;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    color: var(--ecomm-color-secondary-02);
    border-radius: 0.25rem;
    border: 1px solid var(--ecomm-color-secondary-02);
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-unit-price:not(:empty) {
    line-height: 1.5rem;
}

@media (max-width: 767.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-unit-price:not(:empty) {
        padding-top: 1rem;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .item-unit-price .unitPrice span {
    text-align: right;
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5rem;
    color: var(--ecomm-color-black-01);
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-prices:not(:empty) {
    min-width: 12rem;
    padding-left: 1.5rem;
    line-height: 1.5rem;
}

@media (max-width: 1199.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-prices:not(:empty) {
        min-width: unset;
    }

}

@media (max-width: 767.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-prices:not(:empty) {
        padding-left: 0;
        padding-top: 1rem;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .item_details_currency {
    flex-direction: column;
    align-items: flex-end;
    padding-bottom: 1rem;
}

@media (max-width: 767.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .item_details_currency {
        padding-bottom: 0;
        flex-direction: row-reverse;
        grid-column-gap: 1rem;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .actualPrice {
    margin-left: 0;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .originalPrice {
    text-decoration: none !important;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .originalPrice span,
commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .actualPrice span {
    text-align: right;
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5rem;
    color: var(--ecomm-color-black-01);
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .originalPrice span {
    text-decoration: line-through;
    text-decoration-line: line-through;
    -webkit-text-decoration-line: line-through;
    text-decoration-color: var(--ecomm-color-gray-01);
    -webkit-text-decoration-color: var(--ecomm-color-gray-01);
    text-underline-offset: 0px !important;
    color: var(--ecomm-color-gray-01);
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-prices .actualPrice span {
    font-weight: 600;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-delete {
    padding-left: 0.5rem;
    text-decoration: none !important;
}

@media (max-width: 1023.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-delete {
        justify-self: end !important;
    }

}

@media (max-width: 767.98px) {

    commerce_builder-b2b-cart-contents commerce_cart-item .item-delete {
        justify-self: start !important;
        padding-left: 0;
        padding-top: 0.5rem;
    }

}

commerce_builder-b2b-cart-contents commerce_cart-item .item-delete button.slds-button {
    padding: 0;
    bottom: 0;
    font-size: 1rem;
    text-decoration: underline 2px transparent !important;
    text-underline-offset: 6px !important;
    box-shadow: unset !important;
    transition: color 0.1s, text-decoration-color 0.1s;
}

commerce_builder-b2b-cart-contents commerce_cart-item .item-delete button.slds-button:hover,
commerce_builder-b2b-cart-contents commerce_cart-item .item-delete button.slds-button:focus {
    color: var(--ecomm-color-primary-02);
    text-decoration: underline 2px var(--ecomm-color-secondary-01) !important;
}

/* CART ITEMS FOOTER */

commerce_builder-b2b-cart-contents commerce_cart-footer .footer-container:empty {
    display: none;
}