/* Woocommerce notices
-------------------------------------- */
.woocommerce-notices-wrapper > * + * { margin-top: 1em; }
.woocommerce-notices-wrapper > *:last-child { margin-bottom: 2em; }

.wc-block-components-notice-banner { --fs: 1.6rem; display: flex; align-items: center; column-gap: 2rem; background-color:var(--clr-success); border-radius: 2px; color:#fff; clear: both; padding: 1.6rem 2.4rem; position: relative; list-style: none outside; }
.wc-block-components-notice-banner svg { fill: #fff; }  
.wc-block-components-notice-banner ul { padding-left: 2rem; }
.wc-block-components-notice-banner .wc-block-components-notice-banner__content { color: inherit; flex-grow: 1; display: flex; flex-wrap: wrap; column-gap: .75rem; }
.wc-block-components-notice-banner .wc-block-components-notice-banner__content .button { all: unset; order: 1; text-decoration: underline; }
.wc-block-components-notice-banner .wc-block-components-notice-banner__content .button:hover { all: unset; }
.wc-block-components-notice-banner.is-error { background-color: var(--clr-danger); }
.wc-block-components-notice-banner.is-info { background-color: var(--clr-info); }

.woocommerce-message,.woocommerce-info,.woocommerce-error,.woocommerce-noreviews,p.no-comments { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; background-color:var(--clr-success); border-radius: .35rem; color:#fff; clear: both; padding: 1em 2em!important; position: relative; list-style: none outside; }
.woocommerce-message a,.woocommerce-info a,.woocommerce-error a,.woocommerce-noreviews a,p.no-comments a { color:#fff; }
.woocommerce-message a:hover,.woocommerce-info a:hover,.woocommerce-error a:hover,.woocommerce-noreviews a:hover,p.no-comments a:hover { color: #fff; opacity:.7; }
.woocommerce-message a.button:hover,.woocommerce-info a.button:hover,.woocommerce-error a.button:hover,.woocommerce-noreviews a.button:hover,p.no-comments a.button:hover { opacity: 1; border-left: 1px solid rgba(255,255,255,.25) !important; }
.woocommerce-message .button,.woocommerce-info .button,.woocommerce-error .button,.woocommerce-noreviews .button,p.no-comments .button { --p: 0!important; --bg-clr: transparent!important; --border: none!important; --hover-bg-clr: transparent; --br: 0!important; min-height: 0rem; padding-left: 1em!important; border-width: 0; border-left: 1px solid rgba(255,255,255,.25) !important; }
.woocommerce-message .button:hover,.woocommerce-info .button:hover,.woocommerce-error .button:hover,.woocommerce-noreviews .button:hover,p.no-comments .button:hover { background: none; color: #fff; opacity: .7; }

.site-content>.col-full>.woocommerce>.woocommerce-message:first-child,.site-content>.col-full>.woocommerce>.woocommerce-info:first-child,.site-content>.col-full>.woocommerce>.woocommerce-error:first-child { margin-top: 2.617924em; }
.woocommerce-error { list-style: none; }
.woocommerce-info,.woocommerce-noreviews,p.no-comments { background-color: var(--clr-info); }
.woocommerce-info.woocommerce-no-products-found { background-color: rgba(0,0,0,0); border: none; color: inherit; padding: 1em 0; }
.woocommerce-error { background-color: var(--clr-danger); }
.woocommerce-error p, .woocommerce-error li { color: #fff; }

ul.woocommerce-error { flex-direction: column; align-items: start; }

/* Algemeen
-------------------------------------- */
.screen-reader-text { clip: rect(1px,1px,1px,1px); word-wrap: normal!important; border: 0; -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute!important; width: 1px } 
.woocommerce .col2-set { --gc: 1; --gap: 2rem; display: grid; grid-template-columns: repeat(var(--gc), minmax(0, 1fr)); -webkit-column-gap: var(--gap); -moz-column-gap: var(--gap); column-gap: var(--gap); -webkit-row-gap: var(--gap); -moz-row-gap: var(--gap); row-gap: var(--gap) }
.password-input { position: relative; }
.wpb-backdrop.wpb-backdrop--woocommerce { z-index: 1040; }  

@media (min-width: 768px) {
    .woocommerce .col2-set, .woocommerce-page .col2-set { --gc: 2; }
}

/* Payment icons
-------------------------------------- */
.woocommerce-payment-icons { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.woocommerce-payment-icons img { width: auto; height: 2.4rem; }

/* Breadcrumbs
-------------------------------------- */
.woocommerce-breadcrumb { --fs: 1.3rem; display: inline-flex; align-items: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--clr-text); max-width: 100%; }
.woocommerce-breadcrumb > * { margin-right: .8rem }
.woocommerce-breadcrumb a { color: var(--clr-text); text-decoration: none; }

@media (min-width: 992px) {
    .woocommerce-breadcrumb { --fs: 1.5rem; }
}

/* Quantity select
-------------------------------------- */
.quantity { display: inline-flex; align-items: center; }
.quantity button { --size: 3.6rem; width: var(--size); min-width: var(--size); height: var(--size); border: none; background-color: var(--clr-primary); border-radius: 50%; display: inline-grid; place-items: center; cursor: pointer; transition: background-color var(--ts-15) ease; }  
.quantity button i { font-size: 1.6rem; color: #fff; pointer-events: none; }
.quantity input { --size: 3.6rem; font: inherit; text-align: center; pointer-events: none; padding: 0!important; -moz-appearance: textfield; width: var(--size)!important; min-width: var(--size); height: var(--size); min-height: 0!important; border: none!important; background-color: transparent; }
.quantity input::-webkit-outer-spin-button,
.quantity input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.quantity input:focus { outline: none!important; border: none!important; }

/* Product price
-------------------------------------- */
.prd-price { line-height: 1.2; margin-top: auto; flex-wrap: wrap; align-items: baseline; column-gap: .3em; }
.prd-price del { display: block; width: 100%; font-size: 1.4rem; }
.prd-price > ins,
.prd-price bdi { text-decoration: none; font-weight: 700; font-size: 2.2rem; }  

/* Stock
-------------------------------------- */
.prd-stock { margin-bottom: 1.6rem; font-weight: 600; }  
.prd-stock::before { content: ''; display: inline-block; margin-right: .6rem; width: 1rem; height: 1rem; border-radius: 50%; } 
.prd-stock.prd-stock--instock { color: var(--clr-success); }
.prd-stock.prd-stock--instock::before { background-color: var(--clr-success); }
.prd-stock.prd-stock--outofstock { color: var(--clr-danger) }
.prd-stock.prd-stock--outofstock::before { background-color: var(--clr-danger); }

/* Woocommerce loop
-------------------------------------- */
body.woocommerce-page ul.products { --gc: 1; --gap: 2.2rem; list-style: none; display: grid; grid-template-columns: repeat(var(--gc), minmax(0, 1fr)); -webkit-column-gap: var(--gap); -moz-column-gap: var(--gap); column-gap: var(--gap); -webkit-row-gap: var(--gap); -moz-row-gap: var(--gap); row-gap: var(--gap) }
body.woocommerce-page .products.--loading .product * { opacity: 0; } 

@media (min-width: 768px) {
    body.woocommerce-page ul.products.columns-2,
    body.woocommerce-page ul.products.columns-3,
    body.woocommerce-page ul.products.columns-4,
    body.woocommerce-page ul.products.columns-5 { --gc: 2; }
}

@media (min-width: 992px) {
    body.woocommerce-page ul.products.columns-3,
    body.woocommerce-page ul.products.columns-4,
    body.woocommerce-page ul.products.columns-5 { --gc: 3; }
}

@media (min-width: 1200px) {
    body.woocommerce-page ul.products.columns-4,
    body.woocommerce-page ul.products.columns-5 { --gc: 4; }
}

/* Woocommerce loop item
-------------------------------------- */
li.wpb-product { --br: .5rem; position: relative; border: .1rem solid var(--clr-border); background-color: #fff; padding: 2rem; border-radius: .8rem; display: flex; flex-direction: column }
li.wpb-product.is-removing { opacity: 0; transition: opacity var(--ts-250) ease; }
li.wpb-product > * + * { margin-top: 1em; }
li.wpb-product a { text-decoration: none; }
li.wpb-product .product__header { position: relative; height: 20rem; text-align: center;  }
li.wpb-product .product__header img { width: 100%; height: 100%; object-fit: contain; }
li.wpb-product .product__header .toggle-bookmark { position: absolute; top: 1rem; right: 1rem;  }
li.wpb-product .product__body { flex-grow: 1; display: flex; flex-direction: column; }
li.wpb-product .onsale { position: absolute; top: 1rem; left: 1rem; }
li.wpb-product .prd-title { --fs: clamp(2rem, 3vw, 2.4rem); margin-bottom: 1.2rem; }  
li.wpb-product .prd-short-desc { color: var(--clr-text); font-size: 1.5rem; line-height: 1.2; margin-bottom: 1.2rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }  
li.wpb-product .add_to_cart_button { width: 100%; margin-top: 2rem; position: relative; overflow: hidden; }
li.wpb-product .add_to_cart_button.loading::before,
li.wpb-product .add_to_cart_button.loading::after { content: ''; display: block; position: absolute; z-index: 1; }
li.wpb-product .add_to_cart_button.loading::before { top: 0; right: 0; bottom: 0; left: 0; background: var(--clr-primary); }
li.wpb-product .add_to_cart_button.loading::after { --src: url('/app/themes/wuxnl-theme/assets/icons/default/icon_loading.svg'); --clr: #fff; --width: 2rem; --height: 2rem; -webkit-mask-image: var(--src); mask-image: var(--src); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; display: inline-block; width: var(--width); height: var(--height); background-color: var(--clr); top: calc(50% - (var(--height) / 2)); left: calc(50% - (var(--width) / 2)); animation: woocommerce_rotate 0.5s linear infinite; }

@keyframes woocommerce_rotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Widget cart / mini-cart
-------------------------------------- */
.wpb-cart-button { position: relative; cursor: pointer; }
.wpb-cart-button::before { content: attr(data-count); display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background-color: var(--clr); color: var(--bg-clr); font-size: 1.4rem; line-height: 1.4rem; transition: background-color var(--ts-15) ease, color var(--ts-15) ease;; }
.wpb-cart-button:hover::before { background-color: var(--hover-clr); color: var(--hover-bg-clr); }

.wpb-woocommerce-mini-cart { position: relative; display: flex; align-items: center; }
.wpb-woocommerce-mini-cart:hover .woocommerce-mini-cart__content { opacity: 1; pointer-events: all; }
.wpb-woocommerce-mini-cart .woocommerce-mini-cart__content .woocommerce-mini-cart__content-header { display: none; }
.wpb-woocommerce-mini-cart.is-loading .product_list_widget { pointer-events: none; opacity: .5; }

.woocommerce-mini-cart__content { position: absolute; top: 100%; right: 0; bottom: auto; left: auto; background-color: #fff; width: 100%; min-width: 38rem; z-index: 1000; padding: 2rem; border: 1px solid var(--clr-border); opacity: 0; pointer-events: none; transition: opacity var(--ts-15) ease; }

.product_list_widget { position: relative; max-height: 30rem; overflow-y: auto; scroll-snap-type: y proximity; list-style: none; margin: 0 0 1.6rem 0; transition: opacity var(--ts-15) ease; }
.product_list_widget::-webkit-scrollbar { width: .5rem; }
.product_list_widget::-webkit-scrollbar-track { background: #f2f2f2; }
.product_list_widget::-webkit-scrollbar-thumb { background: var(--clr-border); }

.woocommerce-mini-cart-item { --py: .75rem; padding: var(--py) 0 var(--py) 8rem; min-height: 6.7rem; position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; scroll-snap-align: start; }
.woocommerce-mini-cart-item + .woocommerce-mini-cart-item { border-top: 1px solid var(--clr-border);  }
.woocommerce-mini-cart-item a { grid-column: span 2; text-decoration: none; line-height: 1.25; font-size: 1.4rem; }
.woocommerce-mini-cart-item img { width: 7rem; height: 7rem; position: absolute; left: 0; top: var(--py); aspect-ratio: 1/1; }
.woocommerce-mini-cart-item .remove { position: absolute; right: 0; top: var(--py); text-align: center; background-color: rgba(0,0,0,.1); color: rgba(0, 0, 0,1)!important; line-height: 1.1; transition: background-color var(--ts-15), color var(--ts-15) ease; width: 1.6rem; height: 1.6rem; border-radius: 50%; font-size: 1.6rem; }
.woocommerce-mini-cart-item .quantity { margin-right: auto; padding: .25rem; }
.woocommerce-mini-cart-item .quantity button { --size: 2.2rem; }
.woocommerce-mini-cart-item .quantity button i { font-size: 1.4rem; }
.woocommerce-mini-cart-item .quantity input { font-size: 1.4rem; height: 2.4rem; width: 2.4rem; }
.woocommerce-mini-cart-item .item-price { grid-column: span 2; --fs: 1.2rem; }
.woocommerce-mini-cart-item .item-subtotal { --fs: 1.4rem; font-weight: bold; }
.woocommerce-mini-cart-item .variation { display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.woocommerce-mini-cart-item .variation dt { font-weight: 700; font-size: 1.4rem; line-height: 1.25; margin-right: .5rem; }
.woocommerce-mini-cart-item .variation dd { margin-right: 1rem!important; font-size: 1.4rem; line-height: 1.25; }
.woocommerce-mini-cart-item .variation dd p { font: inherit; }

.woocommerce-mini-cart__total { display: flex; justify-content: space-between; align-items: center; padding: 1rem 0 0 0; border-top: 1px solid var(--clr-border); margin: 0 0 1.6rem 0; }

.woocommerce-mini-cart__empty-message { padding: 1rem; font-size: 1.6rem; text-align: center; background-color: var(--clr-primary-20); color: var(--clr-primary); }

.woocommerce .widget_shopping_cart .total *, .woocommerce.widget_shopping_cart .total * { font-size: 1.6rem; }