/** Shopify CDN: Minification failed Line 3746:0 Unexpected "}" **/ @scope (.essentae-oregano-source) { #stickyAddToCart{position:fixed;bottom:0;left:0;width:100vw;max-width:100%;box-shadow:0 -1px 5px #0000001a;opacity:0;transform:translateY(100%);transition:transform .4s ease,opacity .3s ease;padding:12px 0;pointer-events:none;display:block;box-sizing:border-box;overflow-x:hidden;z-index:9900}#stickyAddToCart.show{transform:translateY(0);opacity:1;pointer-events:all;display:block!important}.sticky-add-to-cart__container{display:flex;flex-direction:column;max-width:1200px;width:100%;margin:0 auto;padding:0 15px;box-sizing:border-box;overflow:hidden}.sticky-add-to-cart__product{display:flex;align-items:center;margin-bottom:12px}.sticky-add-to-cart__image{width:60px;height:60px;border-radius:4px;overflow:hidden;border:1px solid #e0e0e0;background:#fff;margin-right:15px}.sticky-add-to-cart__image img{width:100%;height:100%;object-fit:contain}.sticky-add-to-cart__details{flex:1}.sticky-add-to-cart__ratings{display:flex;align-items:center;margin-bottom:3px}.sticky-add-to-cart__stars{display:flex;margin-right:8px}.star{font-size:14px;line-height:1;margin-right:2px;display:flex;align-items:center;justify-content:center}.star svg{display:block}.sticky-add-to-cart__title{font-weight:var(--font-weight-bold);margin:0}.sticky-add-to-cart__shipping{display:flex;align-items:center;justify-content:flex-end;margin-bottom:12px;font-size:14px;letter-spacing:var(--letter-spacing-body)}.hide-desktop-shipping,.hide-mobile-shipping{display:none!important}.sticky-add-to-cart__shipping-icon{margin-right:5px;font-size:16px}.sticky-add-to-cart__shipping-date{display:flex;align-items:center;gap:5px;font-weight:var(--font-weight-semibold)}.delivery-icon{display:inline-flex;align-items:center;margin-right:5px}.delivery-text{margin-right:5px;font-weight:var(--font-weight-regular)!important}.delivery-date{margin-left:0;font-weight:var(--font-weight-bold)}.mobile-shipping-info{display:flex;justify-content:center;width:100%;margin-top:2px;text-align:center;font-size:13px;font-weight:var(--font-weight-regular);padding:3px 0}.mobile-shipping-info .delivery-date-calculator__date{font-weight:var(--font-weight-bold)}@keyframes shine{0%{left:-100%;opacity:0}10%{opacity:.8}20%{opacity:.9}40%{opacity:.8}to{left:200%;opacity:0}}.sticky-add-to-cart__button,#stickyAddToCart .sticky-add-to-cart__button,html body .sticky-add-to-cart__button{display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer;text-decoration:none;text-align:center;transition:background-color .3s ease,opacity .3s ease;position:relative;overflow:hidden;z-index:1}.sticky-add-to-cart__button:hover,#stickyAddToCart .sticky-add-to-cart__button:hover,html body .sticky-add-to-cart__button:hover{background-color:var(--global-button-hover-bg-color);color:var(--global-button-hover-text-color)}.sticky-add-to-cart__button .button-text,.sticky-add-to-cart__button .button-added-text,#stickyAddToCart .sticky-add-to-cart__button .button-text,#stickyAddToCart .sticky-add-to-cart__button .button-added-text,html body #stickyAddToCart .sticky-add-to-cart__button .button-text,html body #stickyAddToCart .sticky-add-to-cart__button .button-added-text{font-size:var(--button-text-font-size, inherit)!important;transition:all .7s ease}.sticky-add-to-cart__button .button-added-text{position:absolute;left:0;right:0;opacity:0;transform:translateY(20px)}.sticky-add-to-cart__button.added .button-text{opacity:0;transform:translateY(-20px)}.sticky-add-to-cart__button.added .button-added-text{opacity:1;transform:translateY(0)}.mobile-view .sticky-add-to-cart__button:after{content:"";position:absolute;top:-50%;left:-100%;width:25%;height:200%;background:linear-gradient(to right,#fff0,#fff3,#fff0);transform:rotate(25deg);pointer-events:none;animation:shine 6s infinite;animation-delay:2s}#stickyAddToCart:has(.mobile-view--full-width) .sticky-add-to-cart__button,html body #stickyAddToCart:has(.mobile-view--full-width) .sticky-add-to-cart__button{border:none!important}.sticky-add-to-cart__button:hover{transform:translateY(-2px)}.sticky-add-to-cart__button:active{transform:translateY(1px)}.sticky-add-to-cart__mobile-info{display:flex;justify-content:center;align-items:center;width:100%;margin-top:10px;text-align:center}.sticky-add-to-cart__guarantee{display:flex;align-items:center;justify-content:center;font-size:12px;letter-spacing:var(--letter-spacing-body);white-space:nowrap;flex:1;padding:0 5px}.sticky-add-to-cart__guarantee-icon{font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-body);margin-right:4px}.mobile-divider{width:1px;height:16px;margin:0 10px}.mobile-button-wrapper{width:100%;padding:0;margin:0;box-sizing:border-box;max-width:100%}.desktop-view{display:none!important}.mobile-view{display:flex;flex-direction:column;width:100%;align-items:center;box-sizing:border-box;max-width:100%;overflow:hidden}@media(min-width:768px){.sticky-add-to-cart__container{flex-direction:row;align-items:center;gap:20px}.desktop-view{display:flex!important;flex-direction:row;align-items:center;gap:20px;width:100%;visibility:visible!important;opacity:1!important}.mobile-view{display:none!important}.sticky-add-to-cart__product{margin-bottom:0;flex:1}.sticky-add-to-cart__shipping{margin-bottom:0;white-space:nowrap}#stickyAddToCart .desktop-view .sticky-add-to-cart__button{flex:1;max-width:250px}}@media(max-width:767px){.sticky-add-to-cart__container{padding:0}.mobile-view{padding:0 15px;width:100%;box-sizing:border-box}.sticky-add-to-cart__button{margin:0!important}.mobile-shipping-info .delivery-icon svg{width:16px!important;height:16px!important}.mobile-shipping-info{font-size:11px!important}}#stickyAddToCart .hide-desktop-shipping,#stickyAddToCart .sticky-add-to-cart__shipping.hide-desktop-shipping,#stickyAddToCart .sticky-add-to-cart__shipping-date.hide-desktop-shipping,#stickyAddToCart .delivery-icon.hide-desktop-shipping,#stickyAddToCart .delivery-text.hide-desktop-shipping,#stickyAddToCart .delivery-date.hide-desktop-shipping,#stickyAddToCart .hide-mobile-shipping,#stickyAddToCart .mobile-shipping-info.hide-mobile-shipping,#stickyAddToCart .sticky-add-to-cart__shipping-date.hide-mobile-shipping,#stickyAddToCart .delivery-icon.hide-mobile-shipping,#stickyAddToCart .delivery-text.hide-mobile-shipping,#stickyAddToCart .delivery-date.hide-mobile-shipping{display:none!important;visibility:hidden!important;opacity:0!important;width:0!important;height:0!important;position:absolute!important;pointer-events:none!important;overflow:hidden!important}body.overflow-hidden-tablet #stickyAddToCart,body.overflow-hidden-desktop #stickyAddToCart,body.overflow-hidden-mobile #stickyAddToCart{display:none!important;opacity:0!important;pointer-events:none!important;transform:translateY(100%)!important}#stickyAddToCart .sticky-add-to-cart__button:hover:after,#stickyAddToCart .sticky-add-to-cart__button:after,#stickyAddToCart .sticky-add-to-cart__button:before,.sticky-add-to-cart__button:hover:after,.sticky-add-to-cart__button:after,.sticky-add-to-cart__button:before{box-shadow:unset!important} /*# sourceMappingURL=/cdn/shop/t/49/assets/sticky-add-to-cart.css.map?v=10923591659564325681789229490 */ .variant-selector-container{margin:20px 0;width:100%;--card-gap: 8px;--card-padding: 12px;--border-radius: 8px;--card-background: white;--title-font-size: 14px;--description-font-size: 11px;--current-price-font-size: 16px;--original-price-font-size: 11px;letter-spacing:var(--letter-spacing-body)}.variant-products-container{display:flex;gap:var(--card-gap, 8px);width:100%;overflow:visible;margin-top:20px}.variant-layout-horizontal{flex-direction:row;width:100%}.variant-layout-vertical{flex-direction:column;width:100%;gap:var(--card-gap, 8px)}.variant-layout-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--card-gap, 8px);width:100%}.variant-products-container[data-variants-count="4"]{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--card-gap, 8px)}.variant-products-container[data-variants-count="3"]{display:flex;flex-direction:row;gap:var(--card-gap, 8px)}@media(max-width:768px){.variant-products-container[data-variants-count="3"]{display:flex;flex-direction:row;gap:var(--card-gap, 8px)}}.variant-product-card{display:flex;flex-direction:column;gap:0;background:var(--card-background);border:var(--card-border-width, 2px) solid var(--variant-border-color);border-radius:var(--border-radius);padding:0;flex:1 1 0%;position:relative;min-width:0;transition:all .3s ease;cursor:pointer;overflow:visible}.variant-products-container[data-image-padding-style=with_padding] .variant-product-card{padding:var(--card-padding);gap:4px}.variant-products-container[data-show-images=false] .variant-product-image{display:none}.variant-products-container[data-image-padding-style=with_padding] .variant-product-image{width:100%;border-radius:8px;margin-bottom:8px}.variant-products-container[data-image-padding-style=with_padding] .variant-product-content{padding:0}.variant-product-card:hover:not(.selected){border-color:#3b82f6}.variant-product-card.selected{border-color:#3b82f6!important;background:#eff6ff}.variant-best-value-badge{position:absolute;top:var(--badge-offset-top, -10px);left:50%;transform:translate(-50%);background:var(--variant-badge-bg-color, #3b82f6);color:var(--variant-badge-text-color, white);padding:var(--badge-padding-y, 4px) var(--badge-padding-x, 8px);border-radius:var(--badge-radius, 4px);transition:all .3s ease;font-size:var(--badge-font-size, 10px);font-weight:var(--font-weight-bold)!important;text-transform:uppercase;letter-spacing:var(--letter-spacing-body);z-index:2;white-space:nowrap;box-shadow:0 2px 4px #0000001a;border:var(--badge-border-width, 0) solid var(--badge-border-color, transparent)}.variant-product-image{width:100%;display:flex;justify-content:center;align-items:center;aspect-ratio:1;border-radius:var(--border-radius) var(--border-radius) 0 0;overflow:hidden;position:relative}.variant-product-content{padding:var(--card-padding);display:flex;flex-direction:column;gap:4px;flex-grow:1}.variant-products-container[data-image-width-desktop=auto] .variant-product-card{flex:1 1 0%}.variant-selector-container[style*=--variant-image-width-desktop] .variant-product-card{flex:0 0 auto;width:calc(var(--variant-image-width-desktop) + 4px)}.variant-selector-container[style*=--variant-image-width-desktop] .variant-products-container[data-image-padding-style=with_padding] .variant-product-card{width:calc(var(--variant-image-width-desktop) + (var(--card-padding) * 2) + 4px)}@media(max-width:768px){.variant-products-container[data-image-width-mobile=auto] .variant-product-card{flex:1 1 0!important;width:auto!important;min-width:auto!important}.variant-selector-container[style*=--variant-image-width-mobile] .variant-product-card{flex:0 0 auto!important;width:calc(var(--variant-image-width-mobile) + 4px)!important}.variant-selector-container[style*=--variant-image-width-mobile] .variant-products-container[data-image-padding-style=with_padding] .variant-product-card{width:calc(var(--variant-image-width-mobile) + (var(--card-padding) * 2) + 4px)!important}}.variant-product-visual{width:100%;height:100%;background:linear-gradient(135deg,#f3f4f6,#e5e7eb);border-radius:6px;position:relative;background-size:cover;background-position:center;background-repeat:no-repeat}.variant-product-card .variant-product-content .variant-product-title,.variant-product-card h3.variant-product-title{font-size:var(--title-font-size)!important;font-weight:var(--font-weight-bold)!important;letter-spacing:var(--letter-spacing-body)!important;color:var(--variant-title-color, #1f2937)!important;text-align:center!important;margin-top:4px!important;font-family:inherit!important}.variant-product-description{font-size:var(--description-font-size);color:var(--variant-description-color);text-align:center;margin:0}.variant-pricing{display:flex;align-items:center;justify-content:center;gap:4px;transition:all .3s ease}.variant-original-price{font-size:var(--original-price-font-size);color:var(--variant-original-price-color);text-decoration:line-through}.variant-current-price{font-size:var(--current-price-font-size);font-weight:var(--font-weight-bold);color:var(--variant-current-price-color);transition:all .3s ease}.variant-sold-out{margin-top:8px;color:#ef4444;font-size:12px;font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-body)}.variant-product-card[data-variant-available=false]{opacity:.6;pointer-events:auto;position:relative}.variant-product-card[data-variant-available=false]:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:#fffc;border-radius:inherit}.variant-selector-container{--variant-border-color: #e5e7eb;--variant-hover-border-color: #3b82f6;--variant-selected-border-color: #3b82f6;--variant-selected-bg-color: #eff6ff;--variant-badge-bg-color: #3b82f6;--variant-badge-text-color: white;--variant-title-color: #1f2937;--variant-description-color: #6b7280;--variant-original-price-color: #9ca3af;--variant-current-price-color: #3b82f6}.variant-product-card{border-color:var(--variant-border-color)}.variant-product-card:hover:not(.selected){border-color:var(--variant-hover-border-color);transform:translateY(-1px);box-shadow:0 2px 8px #00000014}.variant-product-card.selected{border-color:var(--variant-selected-border-color)!important;background:var(--variant-selected-bg-color);box-shadow:0 1px 4px #0000000f}.variant-product-card:active{transform:scale(.98);transition-duration:.15s}.variant-product-card:focus-visible{outline:2px solid var(--variant-selected-border-color, #3b82f6);outline-offset:2px}@media(prefers-reduced-motion:reduce){*{transition:none!important}}.variant-product-description{color:var(--variant-description-color)}.variant-original-price{color:var(--variant-original-price-color)}.variant-current-price{color:var(--variant-current-price-color)}@media(max-width:480px){.variant-products-container{gap:6px;padding:0}.variant-product-content,.variant-products-container[data-image-padding-style=with_padding] .variant-product-card{padding:calc(var(--card-padding) - 4px)}.variant-products-container[data-image-padding-style=with_padding] .variant-product-content{padding:0}.variant-product-card .variant-product-content .variant-product-title,.variant-product-card h3.variant-product-title{font-size:calc(var(--title-font-size) - 2px)!important}.variant-product-description{font-size:calc(var(--description-font-size) - 1px)}.variant-current-price{font-size:calc(var(--current-price-font-size) - 2px)}.variant-original-price{font-size:calc(var(--original-price-font-size) - 1px)}.variant-best-value-badge{font-size:calc(var(--badge-font-size, 10px) * .8);padding:calc(var(--badge-padding-y, 4px) * .5) calc(var(--badge-padding-x, 8px) * .75)}} /*# sourceMappingURL=/cdn/shop/t/49/assets/variant-selector.css.map?v=5130211847511689131789229492 */ .visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.shop-thumbnail.visually-hidden{position:absolute!important;width:0!important;height:0!important;margin:0!important;padding:0!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important}.shop-add-to-cart-button{display:flex;justify-content:center;align-items:center;width:100%!important;font-size:16px;padding:20px 10px;border-radius:var(--button-border-radius, 10px);border:none;font-weight:600;cursor:pointer;transition:background-color .3s ease;font-family:var(--font-body-family-override);position:relative;gap:10px;--button-text-color: inherit;--button-price-color: var(--button-text-color, inherit)}.rating-component{font-family:var(--font-body-family-override);letter-spacing:var(--letter-spacing-body)}.image_review-star{width:15px;height:15px;margin-right:-2px}.review-star-half,.review-star{width:20px;height:20px;margin-right:-3px}[dir=rtl] .review-star-half{direction:ltr}.shop-product-price{font-size:1.8rem;font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-body)}.shop-product-price.on-sale{color:#ef4a65!important}.shop-compare-price{text-decoration:line-through!important;font-size:1.6rem;margin-left:.5rem!important;letter-spacing:var(--letter-spacing-body)}.shop-product-price-block{letter-spacing:var(--letter-spacing-body);line-height:1.2!important}.shop-save-price{font-weight:var(--font-weight-semibold);padding:.5rem .8rem!important;border-radius:50px!important;margin-left:.75rem!important;letter-spacing:var(--letter-spacing-body);display:inline-flex!important;align-items:center!important;line-height:1!important}.shop-save-price .tag-icon{margin-right:4px;transform:rotate(90deg);position:relative;top:-.5px}.shop-product-description{margin:1rem 0;line-height:1.6;letter-spacing:var(--letter-spacing-body)}.shop-read-more,.shop-read-less{display:inline-block;margin-left:.5rem;text-decoration:none;font-weight:var(--font-weight-regular);letter-spacing:var(--letter-spacing-body)}.shop-custom-content{margin-top:1rem;padding-top:1rem;letter-spacing:var(--letter-spacing-body)}.shop-indicator-dot{width:8px;height:8px;border-radius:50%;cursor:pointer}.shop-thumbnails img{object-fit:cover;border-radius:0;cursor:pointer;opacity:.7;transition:all .3s ease}.shop-product-title{font-size:28px!important;margin-top:0;margin-bottom:0;line-height:1.3;font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-heading);overflow:visible;word-wrap:break-word;max-width:100%}.shop-award-badge{padding:3px 12px;display:inline-flex;align-items:center;letter-spacing:var(--letter-spacing-body);line-height:1.4;width:fit-content;white-space:nowrap;align-self:flex-start}.shop-product-price-container{margin:1rem 0;position:relative;font-family:var(--font-body-family-override);display:flex!important;align-items:center!important;flex-wrap:wrap!important;width:100%!important}.shop-carousel-container{flex:0 0 50%;max-width:50%;position:relative;align-self:flex-start}.shop-image-container img.shop-main-image{width:100%;height:100%;object-fit:contain;position:absolute;top:0;left:0}.shop-thumbnails img:hover{opacity:.9}.warning-title{font-weight:700!important;margin-bottom:1px;letter-spacing:var(--letter-spacing-body)}.shop-thumbnails img.active{opacity:1;border-color:#000}.shop-main-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;display:block;opacity:0;background-color:#fff0;transition:opacity .35s cubic-bezier(.4,0,.2,1);pointer-events:none;border-radius:var(--product-image-border-radius)!important}.shop-main-image.active{opacity:1;pointer-events:auto}.shop-main-image img{transition:opacity .3s ease}.shop-add-to-cart-button .button-icon{line-height:0;display:flex;align-items:center}.shop-add-to-cart-button .button-text{color:var(--button-text-color, inherit)}.shop-add-to-cart-button:hover{background-color:var(--button-hover-color)!important}.shop-add-to-cart-wrapper{width:100%!important;display:block;border-radius:var(--button-border-radius, 10px)}.loading__spinner{position:absolute;width:1.8rem;display:flex;align-items:center;justify-content:center}.shop-add-to-cart-button.loading span{visibility:hidden}.shop-add-to-cart-button .spinner{animation:rotator 1.4s linear infinite}.limited-stock-component{font-family:var(--font-body-family);letter-spacing:var(--letter-spacing-body);display:inline-flex;align-items:center;width:auto;max-width:100%}.stock-icon{margin-right:8px;display:flex;align-items:center;position:relative;width:14px;height:14px}.clock-face,.hour-hand,.minute-hand{width:14px;height:14px}.hour-hand,.minute-hand{position:absolute;top:0;left:0}.minute-hand{transform-origin:center;animation:rotate 8s linear infinite}.hourglass{animation:flip 2s infinite;transform-origin:center}.limited-stock-text{font-weight:var(--font-weight-regular);margin-right:4px}.stock-available{font-weight:var(--font-weight-regular)}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes flip{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(0)}}@media(max-width:768px){.limited-stock-component{flex-wrap:wrap}.product-faq{font-size:90%;width:100%}.product-faq .faq-question-image{margin-right:8px}.product-faq .faq-item.active .faq-answer{max-height:350px}}@keyframes rotator{0%{transform:rotate(0)}to{transform:rotate(270deg)}}.shop-add-to-cart-button .path{stroke-dasharray:280;stroke-dashoffset:0;transform-origin:center;animation:dash 1.4s ease-in-out infinite}@keyframes dash{0%{stroke-dashoffset:280}50%{stroke-dashoffset:75;transform:rotate(135deg)}to{stroke-dashoffset:280;transform:rotate(450deg)}}.shop-stock-indicator{display:flex;align-items:center;border-radius:50px;width:fit-content}.shop-stock-dot-container{position:relative;margin-right:12px}.shop-stock-dot{display:block;border-radius:50%}.shop-stock-dot.static-dot{position:relative;z-index:2}.shop-stock-dot.animated-dot{position:absolute;top:0;left:0}.shop-product-details{max-width:1200px;margin:0 auto!important;padding:0;letter-spacing:var(--letter-spacing-body);font-family:var(--font-body-family-override)}.shop-add-to-cart-button .button-content{display:flex;align-items:center;justify-content:center;gap:.5rem;position:relative}.shop-add-to-cart-button .current-price{font-size:14px;font-weight:var(--font-weight-regular);letter-spacing:var(--letter-spacing-body);color:var(--button-price-color, var(--button-text-color, inherit))}.shop-add-to-cart-button .compare-price{font-size:14px;font-weight:var(--font-weight-regular);text-decoration:line-through;opacity:.7;letter-spacing:var(--letter-spacing-body);margin-left:0;color:var(--button-price-color, var(--button-text-color, inherit))}.shop-add-to-cart-button .price-separator{color:var(--button-price-color, var(--button-text-color, inherit));margin:0 2px}.shop-product-section{box-sizing:border-box;width:100%;padding:10px 8px;font-family:inherit}.shop-product-inner-container{max-width:1200px;margin:0 auto;width:100%}.shop-product-layout{display:flex;flex-wrap:wrap;align-items:flex-start;gap:20px}.shop-carousel-container{flex:0 0 55%;max-width:55%;position:relative;align-self:flex-start}.shop-product-info{flex:0 0 calc(45% - 20px);max-width:calc(45% - 20px);display:flex;flex-direction:column;width:100%;overflow:visible;text-align:left;align-items:flex-start}.shop-carousel-container *,.shop-carousel-container *:before,.shop-carousel-container *:after{box-sizing:border-box;margin:0;padding:0}.shop-video{width:100%;height:100%}.shop-product-carousel{width:90%;display:block;position:relative;padding:0}.shop-main-image-wrapper{width:100%;position:relative;overflow:hidden;border-radius:var(--product-image-border-radius)!important;margin-bottom:5px}.shop-image-container{position:relative;width:100%;border-radius:var(--product-image-border-radius)!important;overflow:hidden;background-color:#fff0}@media(max-width:799px){.shop-product-section[data-full-width-image=true] .shop-image-container{height:auto!important}.shop-product-section[data-full-width-image=true] .shop-main-image{opacity:0;transition:opacity .35s cubic-bezier(.4,0,.2,1);pointer-events:none}.shop-product-section[data-full-width-image=true] .shop-main-image.active{position:static!important;height:auto!important;width:100%!important;object-fit:contain!important;display:block!important;opacity:1!important;pointer-events:auto!important}.shop-product-section[data-full-width-image=true] .shop-main-image:not(.active){opacity:0!important;pointer-events:none!important}.shop-product-section[data-full-width-image=true] .shop-mobile-arrows{position:absolute;top:0;left:0;right:0;bottom:auto;height:100%}.shop-product-section[data-full-width-image=true] .shop-mobile-arrows-below{position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;height:auto!important}.shop-product-section[data-full-width-image=true] .shop-desktop-arrows.shop-desktop-arrows-overlaid{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:auto!important;height:100%!important}.shop-product-section[data-full-width-image=true] .shop-desktop-arrows.shop-desktop-arrows-below{position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;height:auto!important}}@media(max-width:799px){.shop-product-section[data-full-width-image=true] .shop-main-image-wrapper{height:auto}.shop-product-section[data-full-width-image=true] .shop-thumbnails-outer{margin-top:10px}}.shop-product-section[data-hide-thumbnails=true] .shop-thumbnails-outer{display:none!important}@media(min-width:800px){.shop-product-section[data-hide-thumbnails=true] .shop-thumbnails-outer{display:none!important}}@media(max-width:799px){.shop-product-section[data-hide-thumbnails=true] .shop-thumbnails-outer{display:none!important}}.shop-dots-navigation{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:15px;padding:10px 0;flex-wrap:wrap;max-width:100%}.shop-dot{width:var(--dot-size, 8px);height:var(--dot-size, 8px);border-radius:50%;background-color:var(--dot-color, #cccccc);cursor:pointer;transition:all .2s ease;display:block}.shop-dot:hover{background-color:var(--dot-active-color, #000000);opacity:.7}.shop-dot:focus{outline:2px solid var(--dot-active-color, #000000);outline-offset:2px}.shop-dot.active{background-color:var(--dot-active-color, #000000);box-shadow:0 0 0 2px #fffc}@media(max-width:767px){.shop-dots-navigation{margin-top:12px;gap:6px;padding:8px 0}}@media(max-width:480px){.shop-dots-navigation{gap:5px;margin-top:10px}.shop-product-section[data-full-width-image=true] .shop-image-container{max-width:none;margin:0}}@media(max-width:767px){.shopify-section:has(.shop-product-section[data-mobile-full-width=true]){padding:0!important;margin:0!important}.shop-product-section.shop-product-section[data-mobile-full-width=true]{padding:0!important;margin:0!important}.shop-product-section[data-mobile-full-width=true] .shop-product-inner-container{padding:0!important;margin:0!important;max-width:100%!important}.shop-product-section[data-mobile-full-width=true] .shop-product-layout{padding:0!important;margin:0!important;gap:0!important}.shop-product-section[data-mobile-full-width=true] .shop-carousel-container{padding:0!important;margin:0!important;max-width:100%!important;width:100%!important}.shop-product-section[data-mobile-full-width=true] .shop-product-carousel{width:100%!important;padding:0!important;margin:0!important;max-width:100%!important}.shop-product-section[data-mobile-full-width=true] .shop-image-container{border-radius:0!important;padding:0!important;margin:0!important;max-width:100%!important;width:100%!important;height:auto!important}.shop-product-section[data-mobile-full-width=true] .shop-main-image-wrapper{border-radius:0!important;padding:0!important;margin:0!important;max-width:100%!important;width:100vw!important;height:auto!important;position:relative;left:50%;right:50%;margin-left:-50vw!important;margin-right:-50vw!important}.shop-product-section[data-mobile-full-width=true] .shop-main-image,.shop-product-section[data-mobile-full-width=true] .shop-main-image img{width:100%!important;height:auto!important;max-width:100%!important;border-radius:0!important;object-fit:cover!important;display:block!important}.shop-product-section[data-mobile-full-width=true] .shop-image-zoom-wrapper{width:100%!important;height:auto!important;margin:0!important;padding:0!important}.shop-product-section[data-mobile-full-width=true] .page-fade-in{transform:none!important}}.shop-desktop-arrows{display:none}@media(min-width:800px){.shop-desktop-arrows{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:20px;padding:10px 0}.shop-dots-navigation+.shop-desktop-arrows{margin-top:10px}.shop-desktop-arrow{width:44px;height:44px;border-radius:var(--arrow-border-radius, 50%)!important;background-color:var(--desktop-arrow-bg, #ffffff);border:1px solid var(--desktop-arrow-border, #e0e0e0);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #0000001a}.shop-desktop-arrow:hover{background-color:var(--desktop-arrow-hover-bg, #f5f5f5);border-color:var(--desktop-arrow-hover-border, #d0d0d0);transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.shop-desktop-arrow:active{transform:translateY(0);box-shadow:0 2px 8px #0000001a}.shop-desktop-arrow:focus{outline:none;border-color:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrow svg{width:18px;height:18px;transition:all .2s ease}.shop-desktop-arrow svg path{stroke:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrow:disabled{opacity:.4;cursor:not-allowed;transform:none}.shop-desktop-arrow:disabled:hover{background-color:var(--desktop-arrow-bg, #ffffff);border-color:var(--desktop-arrow-border, #e0e0e0);transform:none;box-shadow:0 2px 8px #0000001a}}@media(min-width:1200px){.shop-desktop-arrows{margin-top:25px;gap:30px}.shop-desktop-arrow{width:48px;height:48px;border-radius:var(--arrow-border-radius, 50%)!important}.shop-desktop-arrow svg{width:20px;height:20px}.shop-desktop-arrow svg path{stroke:var(--desktop-arrow-icon, #000000)}}.shop-desktop-arrows.shop-desktop-arrows-overlaid{display:none!important;position:static;margin:0;padding:0;gap:0}@media(min-width:800px){.shop-desktop-arrows.shop-desktop-arrows-overlaid{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:0!important;display:flex!important;justify-content:space-between;align-items:center;padding:0 15px!important;pointer-events:none;z-index:2;margin:0!important;gap:0!important}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow{width:44px;height:44px;border-radius:var(--arrow-border-radius, 50%)!important;background-color:var(--desktop-arrow-bg, #ffffff);border:1px solid var(--desktop-arrow-border, #e0e0e0);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;opacity:var(--arrow-opacity, .9);box-shadow:0 2px 8px #0000001a;pointer-events:auto;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow:hover{background-color:var(--desktop-arrow-hover-bg, #f5f5f5);border-color:var(--desktop-arrow-hover-border, #d0d0d0);transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow:active{transform:translateY(0);box-shadow:0 2px 8px #0000001a;border-color:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow:focus{outline:none;border-color:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow svg{width:18px;height:18px;transition:all .2s ease}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow svg path{stroke:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrow-prev{margin-left:0}.shop-desktop-arrow-next{margin-right:0}}@media(min-width:1200px){.shop-desktop-arrows.shop-desktop-arrows-overlaid{padding:0 20px!important}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow{width:50px;height:50px}.shop-desktop-arrows.shop-desktop-arrows-overlaid .shop-desktop-arrow svg{width:20px;height:20px}}.shop-desktop-arrows.shop-desktop-arrows-below{display:none}@media(min-width:800px){.shop-desktop-arrows.shop-desktop-arrows-below{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:0;padding:10px 0}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow{width:40px;height:40px;border-radius:var(--arrow-border-radius, 50%)!important;background-color:var(--desktop-arrow-bg, #ffffff);border:1px solid var(--desktop-arrow-border, #e0e0e0);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #0000001a}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow:hover{background-color:var(--desktop-arrow-hover-bg, #f5f5f5);border-color:var(--desktop-arrow-hover-border, #d0d0d0);transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow:active{transform:translateY(0);box-shadow:0 2px 8px #0000001a;border-color:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow:focus{outline:none;border-color:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow svg{width:18px;height:18px;transition:all .2s ease}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow svg path{stroke:var(--desktop-arrow-icon, #000000)}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow:disabled{opacity:.4;cursor:not-allowed;transform:none}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow:disabled:hover{background-color:var(--desktop-arrow-bg, #ffffff);border-color:var(--desktop-arrow-border, #e0e0e0);transform:none;box-shadow:0 2px 8px #0000001a}}@media(min-width:1200px){.shop-desktop-arrows.shop-desktop-arrows-below{margin-top:25px;gap:30px}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow{width:48px;height:48px}.shop-desktop-arrows.shop-desktop-arrows-below .shop-desktop-arrow svg{width:20px;height:20px}}.shop-mobile-arrows{display:none}@media(max-width:799px){.shop-mobile-arrows{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;padding:0 10px;pointer-events:none;z-index:2;animation:fadeInMobileArrows .3s ease-in-out}@keyframes fadeInMobileArrows{0%{opacity:0}to{opacity:1}}.shop-mobile-arrow{width:40px;height:40px;border-radius:var(--arrow-border-radius, 50%)!important;background-color:var(--desktop-arrow-bg, #ffffff);border:1px solid var(--desktop-arrow-border, #e0e0e0);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;opacity:var(--arrow-opacity, .9);box-shadow:0 2px 8px #00000026;pointer-events:auto;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.shop-mobile-arrow:active{transform:scale(.95);opacity:1;border-color:var(--desktop-arrow-icon, #000000)}.shop-mobile-arrow:focus{outline:none;border-color:var(--desktop-arrow-icon, #000000)}.shop-mobile-arrow svg{width:16px;height:16px;transition:all .2s ease}.shop-mobile-arrow svg path{stroke:var(--desktop-arrow-icon, #000000)}.shop-mobile-prev-arrow{margin-left:0}.shop-mobile-next-arrow{margin-right:0}}@media(max-width:480px){.shop-mobile-arrows{padding:0 8px}.shop-mobile-arrow{width:36px;height:36px}.shop-mobile-arrow svg{width:14px;height:14px}}.shop-mobile-arrow-in-thumbnails{display:none}@media(max-width:799px){.shop-thumbnails-wrapper{display:flex!important;align-items:center;gap:10px}.shop-mobile-arrow-in-thumbnails{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--arrow-border-radius, 50%)!important;background-color:var(--desktop-arrow-bg, #ffffff);border:1px solid var(--desktop-arrow-border, #e0e0e0);cursor:pointer;transition:all .2s ease;opacity:var(--arrow-opacity, .9);box-shadow:0 2px 6px #0000001a;pointer-events:auto;flex-shrink:0}.shop-mobile-arrow-in-thumbnails:hover{background-color:var(--desktop-arrow-hover-background, #f5f5f5);border-color:var(--desktop-arrow-hover-border, #d0d0d0);opacity:1}.shop-mobile-arrow-in-thumbnails:active{transform:scale(.95);opacity:1;border-color:var(--desktop-arrow-icon, #000000)}.shop-mobile-arrow-in-thumbnails:focus{outline:none;border-color:var(--desktop-arrow-icon, #000000)}.shop-mobile-arrow-in-thumbnails svg{width:19px;height:19px;transition:all .2s ease}.shop-mobile-arrow-in-thumbnails svg path{stroke:var(--desktop-arrow-icon, #000000)}.shop-thumbnails{display:flex;flex:1;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.shop-thumbnails::-webkit-scrollbar{display:none}.shop-thumbnail{width:50px!important;height:50px!important}.shop-thumbnails{gap:8px!important}.shop-thumbnails-wrapper:has(.shop-mobile-arrow-in-thumbnails) .shop-thumbnail,.shop-thumbnails-wrapper.has-mobile-arrows .shop-thumbnail{width:45px!important;height:45px!important}.shop-thumbnails-wrapper:has(.shop-mobile-arrow-in-thumbnails) .shop-thumbnails,.shop-thumbnails-wrapper.has-mobile-arrows .shop-thumbnails{gap:6px!important}}@media(max-width:480px){.shop-mobile-arrow-in-thumbnails{width:28px;height:28px}.shop-mobile-arrow-in-thumbnails svg{width:17px;height:17px}.shop-thumbnails-wrapper{gap:8px}.shop-thumbnail{width:45px!important;height:45px!important}.shop-thumbnails{gap:6px!important}.shop-thumbnails-wrapper:has(.shop-mobile-arrow-in-thumbnails) .shop-thumbnail,.shop-thumbnails-wrapper.has-mobile-arrows .shop-thumbnail{width:40px!important;height:40px!important}.shop-thumbnails-wrapper:has(.shop-mobile-arrow-in-thumbnails) .shop-thumbnails,.shop-thumbnails-wrapper.has-mobile-arrows .shop-thumbnails{gap:4px!important}}.shop-mobile-arrows-below{display:none}@media(max-width:799px){.shop-mobile-arrows-below{position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;display:flex;justify-content:center;align-items:center;gap:20px;margin-top:15px;padding:10px 0;pointer-events:auto!important;z-index:auto!important;animation:none!important}.shop-mobile-arrows-below .shop-mobile-arrow{width:40px;height:40px;border-radius:var(--arrow-border-radius, 50%)!important;background-color:var(--desktop-arrow-bg, #ffffff);border:1px solid var(--desktop-arrow-border, #e0e0e0);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;opacity:var(--arrow-opacity, .9);box-shadow:0 2px 8px #00000026;pointer-events:auto;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.shop-mobile-arrows-below .shop-mobile-arrow:active{transform:scale(.95);opacity:1;border-color:var(--desktop-arrow-icon, #000000)}.shop-mobile-arrows-below .shop-mobile-arrow:focus{outline:none;border-color:var(--desktop-arrow-icon, #000000)}.shop-mobile-arrows-below .shop-mobile-arrow svg{width:16px;height:16px;transition:all .2s ease}.shop-mobile-arrows-below .shop-mobile-arrow svg path{stroke:var(--desktop-arrow-icon, #000000)}}@media(max-width:480px){.shop-mobile-arrows-below{gap:15px;margin-top:12px;padding:8px 0}.shop-mobile-arrows-below .shop-mobile-arrow{width:36px;height:36px}.shop-mobile-arrows-below .shop-mobile-arrow svg{width:14px;height:14px}}.shop-thumbnails-outer{position:relative;width:100%;margin-top:10px;display:flex;justify-content:center}.shop-thumbnails-wrapper{position:relative;width:100%;display:flex;align-items:center;gap:10px;padding:0 5px;max-width:100%;margin:0 auto}.shop-thumbnails{display:flex;gap:10px;width:100%;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding:5px 0;flex-wrap:nowrap;align-items:center}.shop-thumbnails::-webkit-scrollbar{display:none}.shop-thumbnail{flex:0 0 auto;width:70px;height:70px;cursor:pointer;border-radius:4px!important;overflow:hidden;transition:opacity .2s ease,border-color .2s ease;padding:0;margin:0;background-color:#f8f8f8}.thumb-square{width:100%;height:100%;position:relative;display:block;overflow:hidden;padding:0;margin:0}.thumb-square img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;top:0;left:0;right:0;bottom:0}.thumb-square .video-icon{position:absolute;transform:translate(-50%,-50%)}.shop-thumbnail-indicators{display:none;justify-content:center;gap:5px;margin-top:10px}.shop-square-container{position:relative;aspect-ratio:1 / 1;width:100%;overflow:hidden}.shop-match-image-width{width:100%;max-width:100%;padding:0}@media(min-width:768px){.shop-thumbnail{width:64px;height:64px}.shop-thumbnails{gap:4px}.shop-product-{padding:0 7px}.shop-main-image-wrapper{margin-bottom:14px}.shop-thumbnails-outer{margin:10px 0}}@media(min-width:800px){.shop-carousel-container::-webkit-scrollbar{display:none}.shop-main-image-wrapper,.shop-image-container{align-self:flex-start;margin-left:0;margin-right:auto}.shop-thumbnails-wrapper{max-width:100%;width:100%;justify-content:center}.shop-thumbnails{max-width:100%;justify-content:flex-start;margin:0 auto}.shop-match-image-width{max-width:100%;width:100%;padding:0}.shop-square-container{width:100%}.shop-product-layout{display:flex;gap:20px;align-items:flex-start}.shop-carousel-container{flex:0 0 50%;max-width:50%;position:sticky;top:20px;height:fit-content;max-height:calc(100vh - 40px);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;display:flex;flex-direction:column;align-items:center}.shop-product-info{flex:0 0 calc(50% - 20px);max-width:calc(50% - 20px)}}@media screen and (min-width:750px){.shop-add-to-cart-button .current-price{font-size:16px}.shop-add-to-cart-button .compare-price{font-size:14px}}@media(max-width:799px){.shop-product-layout{flex-direction:column;gap:0}.shop-carousel-container{margin-bottom:2px;display:flex;flex-direction:column;align-items:center}.shop-thumbnails-wrapper{max-width:600px;margin:0 auto}.shop-product-info{padding-top:10px;align-items:flex-start;text-align:left}.shop-carousel-container,.shop-product-info{flex:0 0 100%;max-width:100%;position:static;max-height:none}.shop-carousel-container{display:flex;flex-direction:column;align-items:center;margin-bottom:20px}.shop-image-container{max-width:600px;margin:0 auto}.shop-thumbnails-outer{max-width:600px;width:100%;margin:10px auto 0}.shop-product-title{font-size:26px!important;padding-right:0;width:100%}.shop-thumbnail-indicators{display:flex}.shop-image-container{width:100%!important;max-width:100%!important;margin:0!important}.shop-thumbnails-outer{width:100%!important;max-width:100%!important;margin:10px 0 0!important}.shop-thumbnails-wrapper{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}.shop-product-carousel{width:100%!important}.shop-carousel-container{padding:0!important;width:100%!important}.shop-thumbnail{width:60px;height:60px;border-radius:4px!important}.shop-thumbnails{gap:8px;padding:5px 6px;justify-content:center}.shop-main-image{object-fit:contain}.shop-main-image:hover img{transform:scale(1.03)}.shop-square-container,.shop-match-image-width{margin:0 auto;max-width:600px}.shop-square-container{aspect-ratio:4 / 3}}@media(max-width:767px){.shop-image-container,.shop-thumbnails-outer,.shop-thumbnails-wrapper{max-width:500px}.shop-award-badge{white-space:normal;padding:3px 12px}.rating-component{flex-wrap:wrap}.rating-satisfaction{margin-left:0;letter-spacing:var(--letter-spacing-body);margin-top:0}.shop-product-info{align-items:flex-start;text-align:left}.shop-image-container{width:100%!important;max-width:100%!important;margin:0!important}.shop-thumbnails-outer{width:100%!important;max-width:100%!important;margin:10px 0 0!important}.shop-thumbnails-wrapper{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}.shop-product-carousel{width:100%!important}.shop-carousel-container{padding:0!important;width:100%!important}.shop-image-container{margin:0 auto;max-width:500px}.shop-main-image{object-fit:contain}.shop-main-image:hover img{transform:scale(1.03)}.shop-square-container,.shop-match-image-width{max-width:500px}.shop-square-container{aspect-ratio:5 / 4}.shop-add-to-cart-button,.shop-add-to-cart-wrapper{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}.shop-carousel-container,.shop-product-carousel,.shop-image-container,.shop-thumbnails-outer,.shop-thumbnails-wrapper{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;margin-bottom:2px}.shop-product-info{padding-top:0}.shop-product-title{font-size:26px!important;padding-right:0;width:100%}.shop-thumbnail-indicators{display:flex}.shop-thumbnail{width:60px;height:60px;border-radius:4px!important}.shop-thumbnails{gap:8px;padding:5px 6px;justify-content:flex-start;width:100%!important}}@media(max-width:480px){.shop-image-container,.shop-thumbnails-wrapper{max-width:100%}.shop-thumbnail{width:50px;height:50px;border-radius:3px!important}.shop-square-container,.shop-match-image-width{max-width:100%}.shop-thumbnails{gap:6px;padding:5px 4px}.shop-image-container,.shop-thumbnails-outer,.shop-thumbnails-wrapper{width:100%;max-width:100%;margin:0}.shop-thumbnails-outer{margin-top:10px}}@media(max-width:767px){.shop-thumbnail{width:60px;height:60px;border-radius:4px!important}}@media(max-width:480px){.shop-thumbnail{width:50px;height:50px;border-radius:3px!important}}.shop-product-layout.no-gallery{display:block}.shop-product-layout.no-gallery .shop-product-info{flex:1 1 100%;max-width:100%;width:100%}.shop-product-layout.no-gallery .shop-carousel-container{display:none}@media(min-width:800px){.shop-product-layout.no-gallery .shop-product-info{max-width:800px;margin:0 auto}}@media(max-width:799px){.shop-product-layout.no-gallery .shop-product-info{padding-top:0}} /*# sourceMappingURL=/cdn/shop/t/49/assets/shop-product-details.css.map?v=2224478214620041641789229490 */ .shop-product-section { letter-spacing: var(--letter-spacing-body); background-color: #ffffff; color: #2a2929; --accent-color: #1a371a; --dot-size: 8px; --dot-color: #cccccc; --dot-active-color: #000000; --desktop-arrow-bg: #ffffff; --desktop-arrow-border: #e0e0e0; --desktop-arrow-icon: #000000; --desktop-arrow-hover-bg: #f5f5f5; --desktop-arrow-hover-border: #d0d0d0; --arrow-border-radius: 50%; --arrow-opacity: 0.9; } /* Added container class to handle the margin without affecting other sections */ .shop-product-info { gap: 0px; color: #2a2929; } .shop-thumbnail { border: 1px solid #f2f2f2; } .shop-thumbnail.active { border-color: #1a371a; } .shop-thumbnail .thumb-square { position: relative; } .shop-thumbnail .thumbnail-video-icon { position: absolute; top: 4px; right: 4px; width: 16px; height: 16px; border-radius: 50%; background: rgba(255, 255, 255, 0.9); display: flex; align-items: center; justify-content: center; color: #1a1a1a; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08); z-index: 3; } .shop-thumbnail .thumbnail-video-icon svg { width: 8px; height: 8px; display: block; } .shop-indicator-dot { background-color: ; } /* Flèches mobiles - version plus spécifique */ .shop-product-section .shop-mobile-arrows { display: none !important; } @media screen and (max-width: 767px) { .shop-product-section .shop-mobile-arrows { display: flex !important; align-items: center; justify-content: space-between; position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; z-index: 5; } .shop-product-section .shop-mobile-arrow { width: 40px !important; height: 40px !important; border-radius: var(--arrow-border-radius); background-color: var(--desktop-arrow-bg); border: 1px solid var(--desktop-arrow-border); display: flex !important; align-items: center; justify-content: center; opacity: var(--arrow-opacity); pointer-events: auto; cursor: pointer; transition: all 0.2s ease; } } /* Masquer sur desktop */ @media screen and (min-width: 768px) { .shop-product-section .shop-mobile-arrows { display: none !important; } } /* Dynamic aspect ratio based on setting */ /* Default 1:1 square aspect ratio */ .shop-image-container.shop-square-container { aspect-ratio: 1 !important; } /* Desktop thumbnails only - not mobile */ @media screen and (min-width: 768px) { .shop-thumbnail .thumb-square { padding-bottom: 100% !important; } .shop-thumbnails-wrapper.left-column-layout .shop-thumbnail { height: auto; aspect-ratio: 1 !important; } .shop-thumbnails-wrapper.left-column-layout .shop-thumbnails.mobile-2x2-grid .shop-thumbnail { height: auto; } } /* Make all thumbnails height auto for natural square appearance */ .shop-thumbnail { height: auto; } /* Mobile 4-in-row layout for thumbnails using swiper-wrapper style */ @media screen and (max-width: 767px) { /* When arrows are overlaid, add padding to avoid overlap */ .shop-thumbnails.mobile-2x2-grid { box-sizing: border-box !important; display: flex !important; position: relative !important; transition-property: transform !important; width: 100% !important; z-index: 1 !important; height: auto !important; justify-content: flex-start !important; align-items: flex-start !important; padding: 0 40px !important; margin: 5px 0px 0px !important; gap: 0 !important; } /* When arrows are NOT overlaid (arrows off), remove padding */ .shop-product-section[data-show-mobile-arrows="false"] .shop-thumbnails.mobile-2x2-grid { padding: 0 !important; } /* Full width image + 4 thumbnails specific spacing */ .shop-product-section[data-full-width-image="true"] .shop-thumbnails.mobile-2x2-grid { margin: 5px 0px 0px !important; } .shop-thumbnails.mobile-2x2-grid .shop-thumbnail { flex: 0 0 calc(25% - 3px) !important; width: calc(25% - 3px) !important; max-width: calc(25% - 3px) !important; box-sizing: border-box !important; padding: 0 !important; margin: 0 !important; height: auto !important; position: relative !important; border-radius: 4px !important; overflow: hidden !important; } .shop-thumbnails.mobile-2x2-grid .shop-thumbnail:not(:last-child) { margin-right: 4px !important; } .shop-thumbnails.mobile-2x2-grid .thumb-square { width: 100%; height: 0; padding-bottom: 100%; position: relative; box-sizing: border-box; overflow: hidden; border-radius: 4px; background: #f8f8f8; z-index: 2 !important; } .shop-thumbnails.mobile-2x2-grid .thumb-square img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 4px; } } /* Thumbnail section padding option */ /* Hide thumbnails on mobile */ /* Left column thumbnails on desktop */ /* Portrait image adaptation */ .shop-indicator-dot.active { background-color: ; } .shop-product-title { color: ; text-wrap: balance; } .shop-product-price { color: !important; } .shop-compare-price { color: !important; } .shop-save-price { background-color: !important; color: !important; } .shop-product-description { color: ; } .shop-read-more, .shop-read-less { color: #1a371a; } .shop-custom-content { color: ; } /* Style for the add to cart button */ .shop-add-to-cart-button { background-color: !important; color: !important; border: 2px solid !important; } /* Add to cart button from blocks */ .shop-product-section .shop-add-to-cart-button, .shop-add-to-cart-wrapper .shop-add-to-cart-button, form .shop-add-to-cart-button, .shop-product-details .shop-add-to-cart-button { transition: background-color 0.3s ease !important; /* Use Section/Block Custom Colors and Sizing */ padding: 13px 20px !important; font-size: 16px !important; /* Always use global letter spacing and font weight for consistency */ letter-spacing: var(--global-button-letter-spacing, 1px) !important; font-weight: var(--global-button-font-weight, 700) !important; border-color: #ef4a65 !important;background-color: var(--button-bg-color, #ffce2f) !important; color: #24272c !important; border-radius: 4px !important; } /* Handle button-text elements inside add to cart button */ .shop-product-section .shop-add-to-cart-button .button-text, .shop-add-to-cart-wrapper .shop-add-to-cart-button .button-text, form .shop-add-to-cart-button .button-text { /* Use Custom Button Text Sizing */ font-size: 16px !important; font-weight: var(--global-button-font-weight, 700) !important; letter-spacing: var(--global-button-letter-spacing, 1px) !important; text-transform: var(--global-button-text-transform, none) ; } .shop-product-section .shop-add-to-cart-button:hover, .shop-add-to-cart-wrapper .shop-add-to-cart-button:hover, form .shop-add-to-cart-button:hover, .shop-product-details .shop-add-to-cart-button:hover { /* Custom Section Hover State - Use CSS variable already defined in inline style */ background-color: var(--button-hover-color, #D63953) !important; } /* Loading / redirect state: keep the button coloured (it was turning white via a base disabled style while waiting for checkout). */ .shop-product-section .shop-add-to-cart-button[disabled], .shop-product-section .shop-add-to-cart-button[aria-disabled="true"], .shop-add-to-cart-wrapper .shop-add-to-cart-button[disabled], .shop-add-to-cart-wrapper .shop-add-to-cart-button[aria-disabled="true"], form .shop-add-to-cart-button[disabled], form .shop-add-to-cart-button[aria-disabled="true"], .shop-add-to-cart-button.loading { background-color: var(--button-hover-color, #D63953) !important; color: #24272c !important; opacity: 1 !important; cursor: wait !important; } .shop-add-to-cart-button .loading__spinner .path { stroke: #FFFFFF !important; } /* Shopify Payment Button Styling */ .shop-product-section shopify-payment-button, .shop-product-section .shopify-payment-button { margin-top: 5px !important; } .shop-product-section .shopify-payment-button__button, .shop-product-section .shopify-payment-button__button--unbranded { padding-top: var(--global-button-padding-y, 12px) !important; padding-bottom: var(--global-button-padding-y, 12px) !important; } @media (min-width: 768px) { .shop-carousel-container { max-width: %; } } /* Mobile full-width image styles - MOBILE AND TABLET ONLY */ @media screen and (max-width: 799px) and (min-width: 0px) { .shop-product-section { padding: 0 !important; } .shop-product-carousel { padding: 0 !important; } .shop-main-image-wrapper { margin: 0 !important; border-radius: 0 !important; } .shop-image-container { border-radius: 0 !important; } .shop-thumbnails-outer { margin-top: 0 !important; } .shop-product-info { padding: 0px 15px 15px 15px !important; } } /* Flèches mobiles */ @media screen and (max-width: 767px) { .shop-mobile-arrows { display: flex !important; } .shop-mobile-arrows { justify-content: center; gap: 20px; margin-top: 10px; } } /* Explicitly prevent desktop changes */ @media screen and (min-width: 800px) { .shop-product-section { padding: 10px 8px; } .shop-product-carousel { padding: 0 5px; } } /* Tablet and mobile specific styles */ @media (max-width: 799px) { .shop-product-info { gap: 2px; } } @media (max-width: 767px) { .shop-product-info { gap: 2px; } } /* Added CSS for block-level styling */ @media screen and (max-width: 768px) { .shop-carousel-container .shop-main-image-wrapper { margin-bottom: 0 !important; } .shop-carousel-container .shop-thumbnails-outer { margin-top: 4px !important; } } /* Subtiele, "blended" thumbnail prev/next pijlen (mobiel) */ /* Kleine, gekleurde pijlen die OVER de thumbnail-randen vallen */ .shop-thumbnails-wrapper.has-mobile-arrows { position: relative !important; } /* Thumbnails iets inspringen zodat de eerste/laatste onder de pijl uit blijft kijken */ .shop-thumbnails-wrapper.has-mobile-arrows .shop-thumbnails { padding-left: 22px !important; padding-right: 22px !important; scroll-padding-left: 22px; scroll-padding-right: 22px; } .shop-mobile-arrow.shop-mobile-arrow-in-thumbnails { position: absolute !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 3 !important; width: 26px !important; height: 26px !important; min-width: 26px !important; background: rgba(13,62,50,0.86) !important; border: 1px solid rgba(255, 255, 255, 0.30) !important; border-radius: 8px !important; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.20) !important; color: #ffffff !important; padding: 0 !important; margin: 0 !important; transition: background .18s ease, transform .12s ease !important; } .shop-mobile-arrow.shop-mobile-prev-arrow.shop-mobile-arrow-in-thumbnails { left: 0 !important; right: auto !important; } .shop-mobile-arrow.shop-mobile-next-arrow.shop-mobile-arrow-in-thumbnails { right: 0 !important; left: auto !important; } .shop-mobile-arrow.shop-mobile-arrow-in-thumbnails:active { transform: translateY(-50%) scale(0.92) !important; } .shop-mobile-arrow.shop-mobile-arrow-in-thumbnails svg { width: 13px !important; height: 13px !important; } .shop-mobile-arrow.shop-mobile-arrow-in-thumbnails svg path { stroke: #ffffff !important; stroke-width: 2 !important; }@media screen and (min-width: 769px) { .shop-thumbnail { width: 80px !important; height: 80px !important; flex: 0 0 auto !important; margin-right: 8px !important; } .shop-thumbnail:last-child { margin-right: 0 !important; } .shop-thumbnail .thumb-square { width: 80px !important; height: 80px !important; aspect-ratio: 1 / 1 !important; } .shop-thumbnail .thumb-square img { width: 100% !important; height: 100% !important; object-fit: cover !important; } }@media screen and (max-width: 768px) { .shop-thumbnails:not(.mobile-2x2-grid) .shop-thumbnail { width: 64px !important; height: 64px !important; flex: 0 0 auto !important; margin-right: 6px !important; } .shop-thumbnails:not(.mobile-2x2-grid) .shop-thumbnail:last-child { margin-right: 0 !important; } .shop-thumbnails:not(.mobile-2x2-grid) .shop-thumbnail .thumb-square { width: 64px !important; height: 64px !important; aspect-ratio: 1 / 1 !important; } .shop-thumbnails:not(.mobile-2x2-grid) .shop-thumbnail .thumb-square img { width: 100% !important; height: 100% !important; object-fit: cover !important; } .shop-product-section .shop-mobile-arrow, .shop-mobile-arrow.shop-mobile-arrow-in-thumbnails { z-index: 1 !important; } } /* Main product image border radius */ .shop-main-image, .shop-main-image img, .shop-image-zoom-wrapper, .shop-video { border-radius: 4px !important; } /* Thumbnail border radius */ .shop-thumbnail, .shop-thumbnail img, .shop-thumbnail .thumb-square { border-radius: 0px !important; } } /* Load-in Animation — uitgezet: geen fade-in-van-onder op de thumbnails */ .page-fade-in { opacity: 1; transform: none; animation: none; } @keyframes fadeInUp { to { opacity: 1; transform: translateY(0); } } .imgr-container { display: flex; align-items: center; width: max-content; max-width: none; position: relative; z-index: 1; white-space: nowrap; } .imgr-link { text-decoration: none; cursor: pointer; } .imgr-avatar-group { display: flex; margin-right: 12px; align-items: center; flex-shrink: 0; } .imgr-avatar { width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid white; margin-right: calc(-24px * 0.4); overflow: hidden; position: relative; } .imgr-avatar:nth-child(1) { z-index: 5; } .imgr-avatar:nth-child(2) { z-index: 4; } .imgr-avatar:nth-child(3) { z-index: 3; } .imgr-avatar:nth-child(4) { z-index: 2; } .imgr-avatar:nth-child(5) { z-index: 1; } .imgr-avatar img { width: 100%; height: 100%; object-fit: cover; } .imgr-rating-text-container { display: flex; align-items: center; margin-right: 12px; margin-left: 4px; flex-shrink: 0; white-space: nowrap; } .imgr-rating-text { font-weight: var(--font-weight-semibold); line-height: 1; white-space: nowrap; } .imgr-rating-text p { margin: 0; display: inline; white-space: nowrap; } .imgr-rating-text p strong, .imgr-rating-text p b { font-weight: var(--font-weight-bold); white-space: nowrap; } .imgr-rating-value { font-weight: var(--font-weight-regular); margin-left: 3px; line-height: 1; white-space: nowrap; } .imgr-rating-value p { margin: 0; display: inline; white-space: nowrap; } .imgr-rating-value p strong, .imgr-rating-value p b { font-weight: var(--font-weight-bold); white-space: nowrap; } .imgr-stars { display: flex; align-items: center; flex-shrink: 0; } .imgr-star { width: 24px; height: 24px; flex-shrink: 0; margin-right: calc(-24px * 0.25); } .imgr-star-half-container { position: relative; width: 24px; height: 24px; flex-shrink: 0; margin-right: calc(-24px * 0.25); } .imgr-star-half-wrapper { position: absolute; top: 0; left: 0; width: 50%; height: 100%; overflow: hidden; } /* Mobile responsive styles - 85% scale for better readability */ @media screen and (max-width: 767px) { .imgr-container { width: max-content; max-width: none; white-space: nowrap; } .imgr-avatar-group { margin-right: calc(12px * 0.85); } .imgr-avatar { width: calc(24px * 0.85); height: calc(24px * 0.85); border: 1px solid white; margin-right: calc(-24px * 0.4 * 0.85); } .imgr-rating-text-container { margin-right: calc(12px * 0.85); margin-left: calc(4px * 0.85); } .imgr-rating-text { font-size: 14px !important; } .imgr-rating-value { font-size: 14px !important; } .imgr-star, .imgr-star-half-container { width: calc(24px * 0.85) !important; height: calc(24px * 0.85) !important; margin-right: calc(-24px * 0.25 * 0.85); } .imgr-star-half-container svg { width: calc(24px * 0.85) !important; height: calc(24px * 0.85) !important; } } .custom-text-block-container-custom_text_bVmMc8 { width: 100%; display: block; } .custom-text-block-custom_text_bVmMc8 { margin-top: 0px; margin-bottom: 0px; text-align: left; width: 100%; } .custom-text-block-custom_text_bVmMc8 .custom-text-wrapper { width: 100%; } .custom-text-block-custom_text_bVmMc8 .custom-text-with-divider { display: flex; align-items: center; width: 100%; gap: 12px; } .custom-text-block-custom_text_bVmMc8 .divider-line { flex: 1; height: 1px; min-height: 1px; min-width: 20px; background-color: #e0e0e0; border: none; margin: 0; display: block; } .custom-text-block-custom_text_bVmMc8 .custom-text-main { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: var(--font-weight-regular) ; width: 100%; justify-content: flex-start; flex-shrink: 0; } @media screen and (max-width: 768px) { .custom-text-block-custom_text_bVmMc8 .custom-text-main { font-size: 14px; } } .custom-text-block-custom_text_bVmMc8 .custom-text-icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #333333; width: 20px; height: 20px; margin-left: 0px; margin-right: 8px; } .custom-text-block-custom_text_bVmMc8 .custom-text-icon svg { width: 100%; height: 100%; fill: currentColor; stroke: currentColor; } .custom-text-block-custom_text_bVmMc8 .custom-text-after-icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #333333; width: 20px; height: 20px; margin-left: 8px; margin-right: 0px; } .custom-text-block-custom_text_bVmMc8 .custom-text-after-icon svg { width: 100%; height: 100%; fill: currentColor; stroke: currentColor; } .custom-text-block-custom_text_bVmMc8 .custom-text-content { color: #333333; margin: 0; width: 100%; } .custom-text-block-custom_text_bVmMc8 .custom-text-content a, .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content a { color: #0066cc; text-decoration: underline; } .custom-text-block-custom_text_bVmMc8 .custom-text-content a:hover, .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content a:hover { opacity: 0.8; } .custom-text-block-custom_text_bVmMc8 .custom-text-content strong, .custom-text-block-custom_text_bVmMc8 .custom-text-content b, .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content strong, .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content b { font-weight: 700 !important; } .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content { text-align: left; width: auto; font-weight: var(--font-weight-regular) ; } /* Ensure paragraph tags inherit the text alignment and font weight */ .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content p { text-align: inherit; font-weight: inherit; } /* Ensure strong tags within the custom text also respect the font weight setting */ .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content strong, .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content b { font-weight: var(--font-weight-semibold) ; } .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content p { margin-top: 0; margin-bottom: px; } .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content p:last-child { margin-bottom: 0; } .custom-text-block-custom_text_bVmMc8 .custom-text-description { font-size: 16px; margin-top: 4px; color: #323539; opacity: 0.8; font-weight: var(--font-weight-regular) ; text-align: left; } @media screen and (max-width: 768px) { .custom-text-block-custom_text_bVmMc8 .custom-text-description { font-size: 16px; } } /* Accent Text Styles */ /* Ensure strong tags within the description also work properly */ .custom-text-block-custom_text_bVmMc8 .custom-text-description strong, .custom-text-block-custom_text_bVmMc8 .custom-text-description b { font-weight: var(--font-weight-semibold) ; } .custom-text-block-custom_text_bVmMc8 .custom-text-description p { margin-top: 0; margin-bottom: px; } .custom-text-block-custom_text_bVmMc8 .custom-text-description p:last-child { margin-bottom: 0; } /* Special handling for center alignment with divider */ /* Ensure strong and bold tags always display as bold */ .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content strong, .custom-text-block-custom_text_bVmMc8 .custom-text-main-text-content b, .custom-text-block-custom_text_bVmMc8 .custom-text-description strong, .custom-text-block-custom_text_bVmMc8 .custom-text-description b { font-weight: 700 !important; } /* Override font weight inheritance for non-bold elements only */ .custom-text-block-custom_text_bVmMc8 *:not(strong):not(b) { font-weight: inherit; } /* Ensure all text elements respect the custom font weight (except strong/b tags) */ .custom-text-block-custom_text_bVmMc8 span:not(strong):not(b), .custom-text-block-custom_text_bVmMc8 div:not(.custom-text-icon):not(strong):not(b), .custom-text-block-custom_text_bVmMc8 p:not(strong):not(b), .custom-text-block-custom_text_bVmMc8 h1:not(strong):not(b), .custom-text-block-custom_text_bVmMc8 h2:not(strong):not(b), .custom-text-block-custom_text_bVmMc8 h3:not(strong):not(b), .custom-text-block-custom_text_bVmMc8 h4:not(strong):not(b), .custom-text-block-custom_text_bVmMc8 h5:not(strong):not(b), .custom-text-block-custom_text_bVmMc8 h6:not(strong):not(b) { font-weight: var(--font-weight-regular) ; } .bg-benefits-grid { display: grid; /* Desktop: 3x2 with more than 4 benefits, otherwise 2x2 */ grid-template-columns: repeat(3, 1fr); gap: 5px !important; max-width: 560px; margin-top: -5px; margin-bottom: 0px; padding: 0px; padding-top: 15px; padding-right: 10px; } .bg-benefit-item { display: flex; align-items: center; gap: 4px; } .bg-benefit-icon { flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; } .bg-benefit-icon.no-background { border-radius: 0 !important; } .bg-benefit-icon svg { width: 20px; height: 20px; } .bg-benefit-text { font-family: var(--font-body-family-override); font-weight: var(--font-weight-semibold) !important; letter-spacing: var(--letter-spacing-body); line-height: 1.3; } @media (max-width: 768px) { /* Mobile: always 2 columns (2x3 with 6 benefits) */ .bg-benefits-grid { grid-template-columns: repeat(2, 1fr); gap: 2px !important; } } /* "What's inside" voor de custom bundle (bundle 3): checklist met groene vinkjes, geen boxen/stippellijn. Toont alleen als de custom-bundle-kaart gekozen is. */ .bundle-includes-strip { display: none; margin-top: var(--bi-spacing, 8px); } .quantity-bundle-selector:has(.quantity-bundle-card[data-bundle-variant][data-selected="true"]) .bundle-includes-strip { display: block; } .bundle-includes-title { font-family: var(--font-heading-family); font-style: var(--font-heading-style, normal); font-weight: var(--bi-title-weight, 700) !important; font-size: var(--bi-title-size, 17px); color: var(--title-color, #1a1a1a); margin: 0 0 8px; text-align: left; } .bundle-includes-row { display: flex; flex-direction: column; align-items: flex-start; } .bundle-includes-item { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-family: var(--font-body-family); font-size: var(--bi-item-size, 14px); line-height: 1; color: var(--title-color, #2a2a2a); } .bundle-includes-item + .bundle-includes-item { margin-top: var(--bi-row-gap, 7px) !important; } .bundle-includes-item span { font-weight: var(--bi-item-weight, 600) !important; font-size: inherit; font-family: inherit; } .bundle-includes-check { width: var(--bi-check-size, 16px); height: var(--bi-check-size, 16px); flex-shrink: 0; display: block; color: var(--bi-check-color, #1f8a4c); } .bundle-includes-check path { stroke-width: var(--bi-check-weight, 3); } /* Mobiele groottes (ná de desktop-regels zodat ze winnen) */ @media screen and (max-width: 749px) { .bundle-includes-strip { margin-top: var(--bi-spacing-m, var(--bi-spacing, 8px)); } .bundle-includes-title { font-size: var(--bi-title-size-m, var(--bi-title-size, 16px)); } .bundle-includes-item { font-size: var(--bi-item-size-m, var(--bi-item-size, 13px)); } .bundle-includes-check { width: var(--bi-check-size-m, var(--bi-check-size, 15px)); height: var(--bi-check-size-m, var(--bi-check-size, 15px)); } } .quantity-bundle-selector { width: 100%; font-family: var(--font-body-family); } .quantity-bundle-container { display: flex; gap: var(--card-gap); flex-wrap: nowrap; width: 100%; margin: 0; padding-top: 15px; justify-content: flex-start; } /* 2x2 Grid Layout */ .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-container { display: grid; grid-template-columns: 1fr 1fr; gap: var(--card-gap); flex-wrap: unset; justify-content: unset; } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-card { flex: unset; min-width: unset; max-width: 100%; width: 100%; display: flex; flex-direction: column; text-align: left; padding: 0 10px !important; margin-bottom: 0 !important; } /* 2x2 Grid inner layout: text left, image right */ .quantity-bundle-grid-inner { display: flex; flex-direction: row; align-items: stretch; justify-content: space-between; gap: 12px; width: 100%; height: 100%; min-height: inherit; } .quantity-bundle-grid-text { flex: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; text-align: left; gap: 4px; } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-title { text-align: left; margin: 0; } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-description { text-align: left; margin: 0; } .quantity-bundle-grid-per-item { font-size: var(--description-font-size); color: #ffffff; font-weight: 500; text-align: left; margin: 0; background: #0c2e1d; border-radius: 20px; padding: 0px 5px; display: inline-block; } .quantity-bundle-grid-per-item .price-amount, .quantity-bundle-grid-per-item .price-suffix { font-size: inherit; font-weight: inherit; color: inherit; } /* Hide the per-item below container in grid layout since it's inside */ .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-per-item-below { display: none !important; } .quantity-bundle-grid-image { flex-shrink: 0; width: 90px; height: 100%; display: flex; align-items: center; justify-content: center; align-self: stretch; } .quantity-bundle-grid-image img { max-width: 100%; height: 100%; width: auto; object-fit: contain; border-radius: 4px; } /* 2x2 Grid without images - centered content */ .quantity-bundle-selector.layout-grid-2x2.no-grid-images .quantity-bundle-grid-inner { justify-content: center; } .quantity-bundle-selector.layout-grid-2x2.no-grid-images .quantity-bundle-grid-text { align-items: center; text-align: center; } .quantity-bundle-selector.layout-grid-2x2.no-grid-images .quantity-bundle-title, .quantity-bundle-selector.layout-grid-2x2.no-grid-images .quantity-bundle-description, .quantity-bundle-selector.layout-grid-2x2.no-grid-images .quantity-bundle-grid-per-item { text-align: center; } /* Horizontal Layout with Images */ .quantity-bundle-horizontal-inner { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 8px; width: 100%; height: 100%; } .quantity-bundle-horizontal-text { width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; } .quantity-bundle-horizontal-text .quantity-bundle-content { width: 100%; text-align: center; } .quantity-bundle-horizontal-text .quantity-bundle-title, .quantity-bundle-horizontal-text .quantity-bundle-description, .quantity-bundle-horizontal-text .quantity-bundle-pricing { text-align: center; } .quantity-bundle-horizontal-image { flex-shrink: 0; height: 60px; display: flex; align-items: center; justify-content: center; } .quantity-bundle-horizontal-image img { height: 100%; width: auto; object-fit: contain; border-radius: 4px; } /* Keep horizontal layout on all screen sizes */ .quantity-bundle-card { position: relative; flex: 1 1 0; min-width: 0; max-width: 180px; min-height: 80px; height: auto; padding: var(--card-padding); border: var(--card-border-width) solid var(--card-border-color, #e5e5e5); border-radius: var(--border-radius) !important; background: var(--card-background, #ffffff); cursor: pointer; transition: all 0.3s ease, border-color 0.2s ease, border-width 0.2s ease, background-color 0.2s ease, transform 0.2s ease; overflow: visible; display: flex; flex-direction: column; margin-bottom: 40px; } .quantity-bundle-card > *:not(.quantity-bundle-badge):not(.quantity-bundle-per-item-below) { overflow: hidden; } .quantity-bundle-card:hover { transform: translateY(-2px) scale(1.02); } .quantity-bundle-card[data-selected="true"] { border-color: var(--card-selected-border-color, #007acc); border-width: var(--selected-card-border-width); background: var(--card-selected-bg-color, #f8f9ff); transform: scale(1.03); } .quantity-bundle-card[data-selected="true"]:hover { transform: translateY(-1px) scale(1.03); } .quantity-bundle-badge { position: absolute; top: -10px; padding: 3px 8px; font-size: 10px; font-weight: var(--font-weight-bold) !important; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; z-index: 2; display: inline-block; } /* Horizontal Layout Badge Position */ .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-bundle-badge { left: 50% !important; right: auto !important; transform: translateX(-50%) !important; } /* 2x2 Grid Layout Badge Position */ .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-badge { left: 50% !important; right: auto !important; transform: translateX(-50%) !important; } .quantity-bundle-image { width: 100%; height: 0; padding-bottom: 100%; margin-bottom: 12px; position: relative; overflow: hidden; } .quantity-bundle-visual { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; border-radius: 4px; overflow: hidden; } .quantity-bundle-content { flex: 1; display: flex; flex-direction: column; justify-content: center; border-radius: inherit; overflow: hidden; } .quantity-bundle-content.content-below-layout { /* Hide content when it's being displayed below */ padding: 0; min-height: 0; } .quantity-bundle-content-below { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; text-align: center; } .quantity-bundle-selector .quantity-bundle-content-below .quantity-bundle-title, .quantity-bundle-selector .quantity-bundle-content-below .quantity-bundle-custom-title { font-size: var(--title-font-size); color: var(--title-color) !important; margin: 0; font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: 1px; } .quantity-bundle-content-below .quantity-bundle-custom-serving { font-size: calc(var(--description-font-size) * 0.95); color: var(--description-color); margin: 0; font-weight: 400; } .quantity-bundle-content-below .quantity-bundle-description { font-size: var(--description-font-size); color: var(--description-color); margin: 0; font-weight: 400; } .quantity-bundle-content-below .quantity-bundle-pricing { display: flex; flex-direction: row; gap: 8px; align-items: center; justify-content: center; flex-wrap: wrap; } /* Hide pricing in below layout when empty */ .quantity-bundle-content-below .quantity-bundle-pricing:empty, .quantity-bundle-content-below .quantity-bundle-pricing:not(:has(.quantity-current-price, .quantity-original-price)) { display: none !important; margin: 0 !important; padding: 0 !important; } .quantity-bundle-content-below .quantity-price-row { display: flex; align-items: center; gap: 8px; justify-content: center; } .quantity-bundle-content-below .quantity-current-price { font-size: calc(var(--current-price-font-size) * 1.2); font-weight: var(--font-weight-bold); color: var(--current-price-color); } .quantity-bundle-content-below .quantity-original-price { font-size: var(--original-price-font-size); color: var(--original-price-color); text-decoration: line-through; } .quantity-bundle-content-below .quantity-bundle-per-unit-text { font-size: calc(var(--description-font-size) * 0.9); color: var(--description-color); font-weight: 400; margin-top: -2px; } /* No Image Layout Styles */ .quantity-bundle-content.no-image-layout { display: flex !important; flex-direction: column !important; text-align: center; justify-content: center; align-items: center; gap: var(--no-image-content-gap, 12px) !important; row-gap: var(--no-image-content-gap, 12px) !important; height: 100%; padding: 12px; overflow: hidden; } /* Remove all margins from child elements to let gap control spacing */ .quantity-bundle-content.no-image-layout > * { margin: 0 !important; padding: 0 !important; } /* Ensure specific elements have no margins in no-image layout */ .quantity-bundle-selector .quantity-bundle-content.no-image-layout .quantity-bundle-title, .quantity-bundle-selector .quantity-bundle-content.no-image-layout .quantity-bundle-description, .quantity-bundle-selector .quantity-bundle-content.no-image-layout .quantity-bundle-pricing, .quantity-bundle-selector .quantity-bundle-content.no-image-layout .quantity-bundle-custom-save-badge { margin: 0 !important; padding: 0 !important; } .quantity-bundle-selector .quantity-bundle-content.no-image-layout .quantity-bundle-title, .quantity-bundle-selector h3.quantity-bundle-title { color: var(--title-color) !important; } /* Title First Order: Title → Description → Price → Per-Item → Badge */ .quantity-bundle-selector .quantity-bundle-content.no-image-layout .quantity-bundle-title { order: 1; font-size: var(--title-font-size); color: var(--title-color) !important; } .quantity-bundle-content.no-image-layout .quantity-bundle-description { order: 2; } .quantity-bundle-content.no-image-layout .pricing-middle { order: 3; } .quantity-bundle-content.no-image-layout .quantity-bundle-per-item { order: 4; } .quantity-bundle-content.no-image-layout .quantity-bundle-custom-save-badge { order: 5; align-self: center; } .quantity-bundle-per-item { background: #0c2e1d; border-radius: 20px; padding: 0px 5px; display: inline-block; } .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price { font-size: 14px; color: #ffffff; font-weight: 500 !important; opacity: 1; } .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price *, .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price span { font-weight: 500 !important; } .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price .price-amount, .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price .price-amount *, .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price span.price-amount { font-weight: 500 !important; } .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price .price-suffix, .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price .price-suffix *, .quantity-bundle-selector .quantity-bundle-per-item .quantity-per-item-price span.price-suffix { font-weight: 500 !important; } /* Per-unit text below container styling (ALWAYS present for main pricing modes) */ .quantity-bundle-per-item-below { position: absolute; bottom: -30px; left: 0; right: 0; text-align: center; width: 100%; z-index: 1; } /* Add space to card for per-item price below */ .quantity-bundle-card { margin-bottom: var(--card-gap) !important; } .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price { font-size: 14px; color: #ffffff; font-weight: 500 !important; opacity: 1; background: #0c2e1d; border-radius: 20px; padding: 0px 5px; display: inline-block; } .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price *, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price span { font-weight: 500 !important; } .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-amount, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-amount *, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price span.price-amount { font-weight: 500 !important; } .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-suffix, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-suffix *, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price span.price-suffix { font-weight: 500 !important; } .quantity-bundle-custom-save-badge { background: #ff4444; color: #ffffff; font-size: 10px; font-weight: var(--font-weight-bold) !important; text-transform: uppercase; padding: 4px 8px; border-radius: 4px; display: inline-block; letter-spacing: 0.5px; width: fit-content; max-width: 100%; white-space: nowrap; align-self: center; } .quantity-bundle-selector .quantity-bundle-title, .quantity-bundle-selector h3.quantity-bundle-title { font-size: var(--title-font-size); color: var(--title-color) !important; font-weight: var(--font-weight-bold); margin: 0 0 6px 0; line-height: 1.2; } .quantity-bundle-description { font-size: var(--description-font-size); color: var(--description-color, #666666); margin: 0; line-height: 1.3; opacity: 0.8; } .quantity-bundle-pricing { display: flex; flex-direction: column; gap: 2px; } /* Hide pricing container when empty or has no visible children */ .quantity-bundle-pricing:empty, .quantity-bundle-pricing:not(:has(.quantity-current-price, .quantity-original-price)) { display: none !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; height: 0 !important; } .quantity-price-row { display: inline-flex; align-items: baseline; gap: 5px; justify-content: center; } /* Hide price row when empty */ .quantity-price-row:empty { display: none !important; margin: 0 !important; padding: 0 !important; } .quantity-price-row .quantity-current-price { order: 1; } .quantity-price-row .quantity-original-price { order: 2; } .quantity-current-price { font-size: var(--current-price-font-size); color: var(--current-price-color, #333333); /* Gelijk aan de bundle-titel (die door een globale [class*="title"] regel op 550 staat) */ font-weight: 550; } .quantity-original-price { font-size: var(--original-price-font-size); color: var(--original-price-color, #999999); text-decoration: line-through; opacity: 0.7; } .quantity-per-unit-price { font-size: 10px; color: #666666; font-weight: 500; opacity: 0.8; } .quantity-per-unit-container { display: inline-block; padding: 2px 6px; border-radius: 4px; margin-top: 2px; } .quantity-bundle-radio { position: absolute; opacity: 0; pointer-events: none; } /* Always maintain vertical layout */ .quantity-bundle-card { flex-direction: column; text-align: center; } .quantity-bundle-image { align-self: center; } .quantity-bundle-content { text-align: center; } /* Mobile responsive */ @media (max-width: 768px) { .quantity-bundle-container { gap: calc(var(--card-gap) / 2); width: 100%; flex-wrap: nowrap; padding-top: 10px; } /* Mobile font sizes */ .quantity-bundle-title { font-size: var(--title-font-size-mobile) !important; } .quantity-bundle-description { font-size: var(--description-font-size-mobile) !important; } .quantity-current-price { font-size: var(--current-price-font-size-mobile) !important; } .quantity-original-price { font-size: var(--original-price-font-size-mobile) !important; } .quantity-per-item-price, .quantity-bundle-per-item, .quantity-bundle-grid-per-item { font-size: var(--per-item-font-size-mobile) !important; } /* 2x2 Grid mobile */ .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-container { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--card-gap) / 2); } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-card { flex: unset; min-width: unset; max-width: 100%; width: 100%; padding: 0 8px !important; margin-bottom: 0 !important; } .quantity-bundle-grid-inner { gap: 8px; } .quantity-bundle-grid-image { width: 70px; } .quantity-bundle-horizontal-image { height: 50px; } .quantity-bundle-horizontal-inner { gap: 6px; } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-title { font-size: calc(var(--title-font-size) * 0.9); } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-description { font-size: calc(var(--description-font-size) * 0.9); } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-grid-per-item { font-size: calc(var(--description-font-size) * 0.9); } .quantity-bundle-card { flex: 1 1 0; min-width: 0; min-height: 90px; height: auto; padding: calc(var(--card-padding) * 0.8); margin-bottom: 32.0px; } .quantity-bundle-image { margin-bottom: 8px; } .quantity-bundle-selector .quantity-bundle-title { font-size: calc(var(--title-font-size) * 0.9); color: var(--title-color) !important; } .quantity-current-price { font-size: calc(var(--current-price-font-size) * 0.9); } } /* Mobile screens - additional styles */ @media (max-width: 768px) { .quantity-bundle-card { /* Width and height already set above */ } .quantity-bundle-content { height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 8px; } .quantity-bundle-content.no-image-layout { display: flex !important; flex-direction: column !important; align-items: center; padding: 12px; gap: calc(var(--no-image-content-gap, 12px) * 0.6) !important; row-gap: calc(var(--no-image-content-gap, 12px) * 0.6) !important; overflow: hidden; justify-content: center !important; } .quantity-bundle-content.no-image-layout > * { margin: 0 !important; } .quantity-bundle-image { margin-bottom: 8px; } .quantity-bundle-pricing { margin-top: auto; } /* Ensure hidden pricing takes no space on mobile */ .quantity-bundle-pricing:empty, .quantity-bundle-pricing:not(:has(.quantity-current-price, .quantity-original-price)) { margin-top: 0 !important; } } /* Very small screens */ @media (max-width: 480px) { .quantity-bundle-card { /* Width and height already set in mobile styles above */ } /* 2x2 Grid very small screens - maintain 2 columns */ .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-container { grid-template-columns: 1fr 1fr; gap: 6px; } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-card { min-height: 76.5px; padding: 0 6px !important; margin-bottom: 0 !important; } .quantity-bundle-grid-inner { gap: 6px; } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-title { font-size: calc(var(--title-font-size) * 0.8); } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-description { font-size: calc(var(--description-font-size) * 0.85); } .quantity-bundle-selector.layout-grid-2x2 .quantity-bundle-grid-per-item { font-size: calc(var(--description-font-size) * 0.85); } .quantity-bundle-content { padding: 6px; } .quantity-bundle-content.no-image-layout { display: flex !important; flex-direction: column !important; align-items: center; padding: 9.6px; gap: calc(var(--no-image-content-gap, 12px) * 0.4) !important; row-gap: calc(var(--no-image-content-gap, 12px) * 0.4) !important; overflow: hidden; } } /* Force per-item price font-weight to use parameter value - must be last to override all other rules */ .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price *, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price span, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-amount, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-amount *, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price span.price-amount, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-suffix, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price .price-suffix *, .quantity-bundle-selector .quantity-bundle-per-item-below .quantity-per-item-price span.price-suffix { font-weight: 500 !important; } /* ===== Style refresh: full-width top badge bar, red strike-through price first, save pill ===== */ /* Badge as a full-width bar that extends ABOVE the card (not part of the box) */ .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-bundle-badge { top: auto !important; bottom: 100% !important; left: calc(-1 * var(--card-border-width)) !important; right: calc(-1 * var(--card-border-width)) !important; width: auto !important; transform: none !important; text-align: center !important; padding: 6px 8px !important; border-radius: var(--border-radius) var(--border-radius) 0 0 !important; letter-spacing: 0.6px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Room above the cards for the badge extensions */ .quantity-bundle-container { padding-top: 30px; align-items: stretch !important; } /* Cards with a badge: square top corners so the box connects seamlessly with the badge */ .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-bundle-card:has(> .quantity-bundle-badge) { border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; } /* Equal card heights, no scale shifting the boxes out of line */ .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-bundle-card { height: auto; margin-top: 0 !important; } .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-bundle-card[data-selected="true"], .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-bundle-card[data-selected="true"]:hover { transform: none; } .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-bundle-card:hover { transform: none; } /* Align content across cards: image top, title below, prices + save pill anchored at the bottom */ .quantity-bundle-horizontal-text { flex: 1; display: flex; flex-direction: column; } .quantity-bundle-horizontal-text .quantity-bundle-content { display: flex; flex-direction: column; flex: 1; justify-content: flex-start; } .quantity-bundle-horizontal-text .quantity-bundle-content .quantity-bundle-pricing { margin-top: auto; } /* Price format: red strike-through compare price BEFORE the bold current price */ .quantity-price-row .quantity-original-price { order: 1; } .quantity-price-row .quantity-current-price { order: 2; } .quantity-original-price { opacity: 1; } /* Save percentage pill */ .quantity-bundle-save-pill { display: inline-block; align-self: center; margin: 6px auto 0; background: #FBF0CE; color: #D02E26; font-size: 13px; font-weight: 600; line-height: 1.2; padding: 5px 12px; border-radius: 6px; white-space: nowrap; width: fit-content; } @media screen and (max-width: 749px) { .quantity-bundle-save-pill { font-size: 12px; padding: 4px 10px; } } /* Mobile: old (strike-through) price stacked above the discounted price */ @media (max-width: 768px) { .quantity-bundle-selector:not(.layout-grid-2x2) .quantity-price-row { flex-direction: column; align-items: center; gap: 1px; } } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts { width: 100%; margin: 8px 0 10px !important; padding: 11px 12px 12px; border: 1px solid #e5e2dc; border-radius: 4px; background: #fdfbf7; font: inherit; box-sizing: border-box; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts__kop { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; line-height: 1; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts__label { font-size: 12.5px; font-weight: 650; color: #24272C; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts__stand { font-size: 11.5px; font-weight: 500; color: #8a857b; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts__stand b { color: #0d3e32; font-weight: 700; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts__rij { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift { display: flex; align-items: center; gap: 9px; min-width: 0; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__thumb { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 4px; background: #fff; border: 1px solid #e5e2dc; display: flex; align-items: center; justify-content: center; transition: border-color .18s; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift.is-vrij .gh-gift__thumb { border-color: #0d3e32; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__thumb img { width: 100%; height: 100%; object-fit: contain; border-radius: 3px; display: block; opacity: 0.38; filter: grayscale(1); transition: opacity .18s, filter .18s; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift.is-vrij .gh-gift__thumb img { opacity: 1; filter: none; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__emoji { font-size: 24px; line-height: 1; opacity: 0.38; filter: grayscale(1); transition: opacity .18s, filter .18s; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift.is-vrij .gh-gift__emoji { opacity: 1; filter: none; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__tekst { display: flex; flex-direction: column; gap: 4px; min-width: 0; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__naam { font-size: 12px; font-weight: 600; line-height: 1.2; color: #a8a296; transition: color .18s; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift.is-vrij .gh-gift__naam { color: #24272C; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde { display: flex; align-items: center; gap: 4px; font-size: 10.5px; line-height: 1; white-space: nowrap; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde s { color: #b8b0a2; font-weight: 500; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde b { color: #0d3e32; font-weight: 700; letter-spacing: 0.02em; display: none; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift.is-vrij .gh-gift__waarde b { display: inline; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__slotje { color: #b8b0a2; flex: 0 0 auto; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift.is-vrij .gh-gift__slotje { display: none; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde s, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde b { white-space: nowrap; } @media (max-width: 430px) { #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde { flex-wrap: wrap; row-gap: 2px; white-space: normal; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts { padding: 10px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts__rij { gap: 7px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift { gap: 7px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__thumb { width: 40px; height: 40px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__naam { font-size: 11px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde { font-size: 9.5px; gap: 3px; } } @media (max-width: 360px) { #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gifts__rij { gap: 6px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift { gap: 5px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__thumb { width: 32px; height: 32px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__naam { font-size: 10.5px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .gh-gift__waarde { font-size: 9px; } } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .subscribe-save-wrapper, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .subscribe-save-wrapper-dynamic { position: absolute !important; top: 0 !important; left: 0 !important; width: 1px !important; height: 1px !important; max-width: 1px !important; margin: 0 !important; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; } .subscribe-save-wrapper { margin-top: 8px; margin-bottom: 8px; width: 100% !important; margin-left: auto; margin-right: auto; /* Custom Variables */ --subscribe-border-color: #e6faf5; --subscribe-border-color-selected: #0d3e32; --subscribe-border-width-unselected: 1px; --subscribe-border-width-selected: 1px; --subscribe-border-radius: 4px; --subscribe-bg-unselected: #ffffff; --subscribe-bg-selected: #e6faf5; --subscribe-hover-bg: #f8f9fa; --subscribe-heading-color: #000000; --subscribe-heading-size: 16px; --subscribe-title-color: #333333; --subscribe-title-size: 11px; --subscribe-title-weight: 500; --subscribe-toggle-w: 30px; --subscribe-toggle-h: 16px; --subscribe-subtitle-color: #666666; --subscribe-subtitle-size: 13px; --subscribe-price-color-unselected: #000000; --subscribe-price-color-selected: #000000; --subscribe-price-size: 18px; --subscribe-compare-price-color-unselected: #999999; --subscribe-compare-price-color-selected: #999999; --subscribe-compare-price-size: 14px; --subscribe-per-serving-size: 12px; --subscribe-benefits-color: #666666; --subscribe-benefits-size: 13px; --subscribe-toggle-bg-unselected: #cccccc; --subscribe-toggle-bg-selected: #0d3e32; --subscribe-toggle-circle: #ffffff; --subscribe-badge-size: 11px; --subscribe-badge-radius: 4px; --subscribe-badge-padding-v: 4px; --subscribe-badge-padding-h: 8px; --subscribe-save-badge-bg: #ff4444; --subscribe-save-badge-color: #ffffff; --subscribe-save-badge-size: 11px; --subscribe-save-badge-radius: 4px; --subscribe-gift-image-size: 60px; --subscribe-gift-text-color-unselected: #333333; --subscribe-gift-text-color-selected: #333333; --subscribe-gift-text-size: 12px; --subscribe-gift-text-size-mobile: 12px; --subscribe-gift-text-weight: 600; --subscribe-gift-qty-bg: #e6faf5; --subscribe-gift-qty-color: #ffffff; --subscribe-gift-qty-size: 11px; --subscribe-gift-container-radius: 4px; --subscribe-gift-bg-unselected: #f9f9f9; --subscribe-gift-border-unselected: #cccccc; --subscribe-gift-bg-selected: #e6faf5; --subscribe-gift-border-selected: #0d3e32; --subscribe-bonus-text-color: #333333; --subscribe-bonus-size: 13px; --subscribe-bonus-icon-size: 16px; --subscribe-bonus-icon-color: #333333; --subscribe-padding-top: 6px; --subscribe-padding-bottom: 6px; --subscribe-padding-left: 8px; --subscribe-padding-right: 8px; --subscribe-gap: 0px; --subscribe-top-row-border-color: #e0e0e0; --subscribe-top-row-border-color-selected: #d32f2f; --subscribe-top-row-border-width: 1px; --subscribe-tab-bg: #333333; --subscribe-tab-text-color: #ffffff; --subscribe-tab-font-size: 11px; --subscribe-frequency-label-color: #666666; --subscribe-frequency-label-size: 12px; --subscribe-frequency-dropdown-bg: #ffffff; --subscribe-frequency-dropdown-border: #cccccc; --subscribe-frequency-dropdown-text: #333333; --subscribe-frequency-dropdown-size: 13px; --subscribe-frequency-wrapper-bg: #f9f9f9; --subscribe-frequency-wrapper-padding: 10px; --subscribe-frequency-wrapper-radius: 4px; } .subscribe-save-wrapper, .subscribe-save-wrapper * { letter-spacing: var(--letter-spacing-body) !important; font-family: var(--font-body-family) !important; } /* Heading */ .subscribe-save-heading { font-size: var(--subscribe-heading-size) !important; font-weight: 700; margin-bottom: 10px; color: var(--subscribe-heading-color); } .subscribe-save-heading p { margin: 0; } .subscribe-save-heading strong, .subscribe-save-heading b { font-weight: 700 !important; } /* Container */ .subscribe-save-container { border: var(--subscribe-border-width-unselected) dashed var(--subscribe-border-color); border-radius: var(--subscribe-border-radius); padding: var(--subscribe-padding-top) var(--subscribe-padding-right) var(--subscribe-padding-bottom) var(--subscribe-padding-left); position: relative; background: var(--subscribe-bg-unselected); transition: all 0.3s ease; cursor: pointer; user-select: none; } /* Container state changes based on toggle */ .subscribe-save-container:has(input:checked) { border-color: var(--subscribe-border-color-selected); border-width: var(--subscribe-border-width-selected); background-color: var(--subscribe-bg-selected); } /* Active Pop-up Tab */ .subscribe-active-tab { position: absolute; top: -24px; background-color: var(--subscribe-tab-bg); color: var(--subscribe-tab-text-color); font-size: var(--subscribe-tab-font-size) !important; padding: 6px 16px; border-radius: 8px 8px 0 0; font-weight: 700; text-transform: uppercase; opacity: 0; transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); z-index: -1; white-space: nowrap; line-height: 1; pointer-events: none; } /* Alignment Variants */ .subscribe-active-tab--center { left: 50%; transform: translateX(-50%) translateY(10px); } .subscribe-active-tab--left { left: 20px; transform: translateY(10px); } .subscribe-active-tab--right { right: 20px; left: auto; transform: translateY(10px); } /* Reveal States */ .subscribe-save-container:has(input:checked) .subscribe-active-tab--center { opacity: 1; transform: translateX(-50%) translateY(0); } .subscribe-save-container:has(input:checked) .subscribe-active-tab--left { opacity: 1; transform: translateY(0); } .subscribe-save-container:has(input:checked) .subscribe-active-tab--right { opacity: 1; transform: translateY(0); } /* Top Row */ .subscribe-top-row { width: 100%; transition: border-color 0.3s ease; } .subscribe-row-content { display: flex; justify-content: space-between; align-items: center; gap: 15px; width: 100%; } .subscribe-save-container:has(input:checked) .subscribe-top-row { } /* Divider Line */ .subscribe-divider { height: 1px; background-color: var(--subscribe-border-color); width: 100%; margin-bottom: 8px; opacity: 0.5; } .subscribe-top-left { display: flex; align-items: center; gap: 12px; } /* Toggle Switch */ .subscribe-toggle-switch { position: relative; display: inline-block; width: 52px; height: 28px; flex-shrink: 0; } /* Toggle Header */ .subscribe-toggle-header { display: flex; flex-direction: column; align-items: flex-start; gap: 0px; min-width: 0; } .subscribe-title-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .subscribe-toggle-option { font-size: var(--subscribe-title-size) !important; font-weight: var(--subscribe-title-weight, 700); color: var(--subscribe-title-color); user-select: none; } .subscribe-title-subtitle { font-size: var(--subscribe-subtitle-size) !important; color: var(--subscribe-subtitle-color); line-height: 1.4; font-weight: 400; } .subscribe-title-subtitle p { margin: 0; } .subscribe-title-subtitle strong, .subscribe-title-subtitle b { font-weight: 700 !important; } /* Delivery Frequency Dropdown */ .subscribe-frequency-wrapper { display: flex; flex-direction: column; align-items: stretch; gap: 6px; margin-top: 0px; width: 100%; /* Hidden state by default */ max-height: 0; opacity: 0; overflow: hidden; margin-bottom: 0; padding: 0 var(--subscribe-frequency-wrapper-padding); background-color: var(--subscribe-frequency-wrapper-bg); border-radius: var(--subscribe-frequency-wrapper-radius); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .subscribe-save-container:has(input:checked) .subscribe-frequency-wrapper { max-height: 80px; opacity: 1; margin-top: 12px; padding: 10px; } .subscribe-frequency-label { font-size: var(--subscribe-frequency-label-size) !important; color: var(--subscribe-frequency-label-color); font-weight: 500; white-space: nowrap; } .subscribe-frequency-dropdown { font-size: var(--subscribe-frequency-dropdown-size) !important; color: var(--subscribe-frequency-dropdown-text); background-color: var(--subscribe-frequency-dropdown-bg); border: 1px solid var(--subscribe-frequency-dropdown-border); border-radius: 4px; padding: 8px 12px; cursor: pointer; width: 100%; box-sizing: border-box; font-family: var(--font-body-family) !important; letter-spacing: var(--letter-spacing-body) !important; transition: border-color 0.3s ease; } .subscribe-frequency-dropdown:hover { border-color: var(--subscribe-border-color-selected); } .subscribe-frequency-dropdown:focus { outline: none; border-color: var(--subscribe-border-color-selected); } .subscribe-toggle-switch input { opacity: 0; width: 0; height: 0; } .subscribe-toggle-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--subscribe-toggle-bg-unselected); transition: 0.3s; border-radius: 28px; } .subscribe-toggle-slider:before { position: absolute; content: ""; height: 20px; width: 20px; left: 4px; bottom: 4px; background-color: var(--subscribe-toggle-circle); transition: 0.3s; border-radius: 50%; } .subscribe-toggle-switch input:checked + .subscribe-toggle-slider { background-color: var(--subscribe-toggle-bg-selected); } .subscribe-toggle-switch input:checked + .subscribe-toggle-slider:before { transform: translateX(24px); } /* Badge (Always Visible) */ .subscribe-badges { position: absolute; top: -12px; right: 20px; display: flex; pointer-events: none; } .subscribe-badge { padding: var(--subscribe-badge-padding-v) var(--subscribe-badge-padding-h); border-radius: var(--subscribe-badge-radius); font-size: var(--subscribe-badge-size) !important; font-weight: 800; text-transform: uppercase; line-height: 1; } .subscribe-save-badge { display: inline-flex; align-items: center; justify-content: center; background-color: var(--subscribe-save-badge-bg); color: var(--subscribe-save-badge-color); font-size: var(--subscribe-save-badge-size) !important; padding: 4px 8px; border-radius: var(--subscribe-save-badge-radius); font-weight: 700 !important; text-transform: uppercase; white-space: nowrap; line-height: 1; } /* Main Content */ .subscribe-main-content { padding-top: 0; } .subscribe-price-row { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; width: 80px !important; flex-shrink: 0; margin-left: auto; } .subscribe-price-current { font-weight: 700; font-size: var(--subscribe-price-size) !important; color: var(--subscribe-price-color-unselected); line-height: 1.2; transition: color 0.3s ease; } .subscribe-price-compare { font-size: var(--subscribe-compare-price-size) !important; text-decoration: line-through; color: var(--subscribe-compare-price-color-unselected); line-height: 1.2; transition: color 0.3s ease; } .subscribe-save-container:has(input:checked) .subscribe-price-current { color: var(--subscribe-price-color-selected) !important; } .subscribe-save-container:has(input:checked) .subscribe-price-compare { color: var(--subscribe-compare-price-color-selected) !important; } /* Benefits Wrapper - Always visible, faded when not subscribed */ .subscribe-benefits-wrapper { margin-top: 0px; transition: opacity 0.3s ease; opacity: 0.4; } .subscribe-save-container:has(input:checked) .subscribe-benefits-wrapper { opacity: 1; } /* General Benefits (Richtext) */ .subscribe-benefits { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #eee; font-size: var(--subscribe-benefits-size) !important; line-height: 1.6; color: var(--subscribe-benefits-color); } .subscribe-benefits p { margin: 0 0 5px; display: flex; align-items: center; gap: 5px; } .subscribe-benefits:last-child { border-bottom: none; } /* Benefits Layout: Two Columns */ .subscribe-benefits-two_column { display: flex !important; flex-wrap: wrap !important; gap: 5px 10px !important; } .subscribe-benefits-two_column p, .subscribe-benefits-two_column li { width: calc(50% - 5px) !important; display: inline-flex !important; margin: 0 !important; box-sizing: border-box !important; } /* Benefits Layout: Flex Row */ .subscribe-benefits-flex_row { display: flex !important; flex-wrap: wrap !important; gap: 10px 15px !important; } .subscribe-benefits-flex_row p, .subscribe-benefits-flex_row li { width: auto !important; margin: 0 !important; flex-shrink: 0 !important; display: inline-flex !important; } /* Bonus List (Bullet list with icons) */ .bonus-list { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; margin-bottom: 0; } .bonus-item { display: inline-flex; align-items: center; gap: 8px; font-size: var(--subscribe-bonus-size) !important; color: var(--subscribe-bonus-text-color); width: fit-content; } .bonus-icon { flex-shrink: 0; width: var(--subscribe-bonus-icon-size); height: var(--subscribe-bonus-icon-size); object-fit: contain; color: var(--subscribe-bonus-icon-color); } /* Bonus text - handle richtext p tags */ .bonus-text { display: inline; } .bonus-text p { display: inline; margin: 0; padding: 0; } .bonus-text strong, .bonus-text b { font-weight: 700 !important; } /* Bonus List Layouts */ .bonus-list.bonus-list-two_column { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 5px 10px !important; } .bonus-list.bonus-list-two_column .bonus-item { width: calc(50% - 5px) !important; display: inline-flex !important; margin: 0 !important; box-sizing: border-box !important; flex: 0 0 auto !important; } .bonus-list.bonus-list-flex_row { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 10px 15px !important; } .bonus-list.bonus-list-flex_row .bonus-item { width: auto !important; margin: 0 !important; flex-shrink: 0 !important; display: inline-flex !important; flex: 0 0 auto !important; } /* Free Gift Container */ .free-gift-container { display: flex; align-items: center; justify-content: space-between; background: var(--subscribe-gift-bg-unselected); border: 1px dashed var(--subscribe-gift-border-unselected); border-radius: var(--subscribe-gift-container-radius); padding: 8px 8px; margin-top: 5px; opacity: 0.6; transition: background-color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease; } .subscribe-save-container:has(input:checked) .free-gift-container { background: var(--subscribe-gift-bg-selected); border-color: var(--subscribe-gift-border-selected); opacity: 1; } .gift-content-left { display: flex; align-items: center; gap: 8px; flex: 1; } .gift-image { width: calc(var(--subscribe-gift-image-size) * 0.53); height: calc(var(--subscribe-gift-image-size) * 0.53); object-fit: contain; border-radius: 4px; flex-shrink: 0; } .gift-qty-inline { background: var(--subscribe-gift-qty-bg); color: var(--subscribe-gift-qty-color); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: var(--subscribe-gift-qty-size) !important; font-weight: 700; flex-shrink: 0; width: 17px; height: 17px; min-width: 17px; padding: 0; } .gift-qty-inline span { line-height: 1; } .gift-text { font-size: var(--subscribe-gift-text-size) !important; font-weight: var(--subscribe-gift-text-weight); color: var(--subscribe-gift-text-color-unselected); flex: 1; transition: color 0.3s ease; } .subscribe-save-container:has(input:checked) .gift-text { color: var(--subscribe-gift-text-color-selected); } .gift-price-right { display: flex; align-items: center; margin-left: 10px; flex-shrink: 0; gap: 6px; } .gift-price-locked-wrapper { position: relative; overflow: hidden; display: flex; align-items: center; border-radius: 4px; } .gift-price { font-weight: 700; font-size: var(--subscribe-gift-text-size) !important; color: var(--subscribe-gift-text-color-unselected); opacity: 0; transform: translateX(-10px); transition: opacity 0.4s ease, transform 0.4s ease, color 0.3s ease; display: inline-block; } .subscribe-save-container:has(input:checked) .gift-price { color: var(--subscribe-gift-text-color-selected); } .gift-price-lock { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--subscribe-gift-bg-unselected); display: flex; align-items: center; justify-content: center; z-index: 2; color: #999; opacity: 1; transform: translateX(0); transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.4s ease; } /* Reveal on Subscribe with Stagger */ .subscribe-save-container:has(input:checked) .gift-price-lock { transform: translateX(100%); opacity: 0; transition-delay: calc(var(--gift-index) * 0.15s); } .subscribe-save-container:has(input:checked) .gift-price { opacity: 1; transform: translateX(0); transition-delay: calc(var(--gift-index) * 0.15s); } .gift-compare-price { text-decoration: line-through; color: #999; font-size: calc(var(--subscribe-gift-text-size) * 0.9) !important; } @media (max-width: 480px) { .subscribe-row-content { flex-direction: row; align-items: flex-start; gap: 10px; } .subscribe-top-left { width: 100%; } .subscribe-price-row { width: 100%; justify-content: flex-start; } .subscribe-toggle-option { font-size: 14px; } .subscribe-save-badge { font-size: 9px; padding: 4px 8px; } .subscribe-badge { font-size: 9px; padding: 2px 6px; } .gift-text { font-size: var(--subscribe-gift-text-size-mobile); } .subscribe-frequency-wrapper { flex-direction: column; align-items: stretch; } .subscribe-frequency-dropdown { width: 100%; font-size: 12px !important; } /* Stack benefits layouts on mobile */ .subscribe-benefits-two_column, .subscribe-benefits-flex_row, .bonus-list-two_column, .bonus-list-flex_row { flex-direction: column; } .subscribe-benefits-two_column p, .bonus-list-two_column .bonus-item { width: 100% !important; } } .shop-add-to-cart-button .button-text { text-transform: none !important; } /* Ensure form takes full width */ #product-form-template--32040255783254__shop_product_details_JbqzwH, .form { width: 100% !important; display: block; } .shop-add-to-cart-button .path { stroke: #24272c; } /* ------------------------------------------------------------------ ATC-knop: kleur vastzetten over ALLE states. De knop werd wit/achtergrondloos bij het indrukken. De veroorzakende regel is niet te achterhalen: de verdachte stylesheets (LoadingOverlay-*, Stack-*, layout-* en de review-widgets) komen van een andere origin en zijn daardoor niet via de CSSOM te inspecteren. Pseudoklassen als :active en :focus veranderen ook geen attributen, dus een MutationObserver ziet het niet gebeuren. Daarom niet zoeken maar afdwingen: geel in rust en de lichtere gele hover-kleur bij interactie. Achtergrondloos of wit kan niet meer. Specificiteit spiegelt de bestaande hover-regels in shop-product-details.liquid en staat later in de bron, dus wint. ------------------------------------------------------------------ */ .shop-product-section .shop-add-to-cart-button, .shop-add-to-cart-wrapper .shop-add-to-cart-button, form .shop-add-to-cart-button, .shop-product-details .shop-add-to-cart-button, .shop-product-section .shop-add-to-cart-button[disabled], .shop-add-to-cart-wrapper .shop-add-to-cart-button[disabled], form .shop-add-to-cart-button[disabled], .shop-product-section .shop-add-to-cart-button[aria-disabled="true"], .shop-add-to-cart-wrapper .shop-add-to-cart-button[aria-disabled="true"], form .shop-add-to-cart-button[aria-disabled="true"], .shop-product-section .shop-add-to-cart-button.loading, .shop-add-to-cart-wrapper .shop-add-to-cart-button.loading, form .shop-add-to-cart-button.loading { background-color: var(--button-bg-color, #ffce2f) !important; background-image: none !important; opacity: 1 !important; } .shop-product-section .shop-add-to-cart-button:hover, .shop-add-to-cart-wrapper .shop-add-to-cart-button:hover, form .shop-add-to-cart-button:hover, .shop-product-details .shop-add-to-cart-button:hover, .shop-product-section .shop-add-to-cart-button:focus, .shop-add-to-cart-wrapper .shop-add-to-cart-button:focus, form .shop-add-to-cart-button:focus, .shop-product-section .shop-add-to-cart-button:focus-visible, .shop-add-to-cart-wrapper .shop-add-to-cart-button:focus-visible, form .shop-add-to-cart-button:focus-visible, .shop-product-section .shop-add-to-cart-button:active, .shop-add-to-cart-wrapper .shop-add-to-cart-button:active, form .shop-add-to-cart-button:active, .shop-product-details .shop-add-to-cart-button:active { background-color: var(--button-hover-color, #f3cf5d) !important; background-image: none !important; opacity: 1 !important; } .guarantee-badges-container { display: flex; justify-content: flex-start; align-items: center; gap: 6px; margin-top: -5px; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; font-size: 11px; letter-spacing: var(--letter-spacing-body); color: #000000 !important; width: 100%; flex-direction: row; flex-wrap: wrap; } .guarantee-blinking-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; vertical-align: middle; position: relative; flex-shrink: 0; margin-bottom: 1px; } .guarantee-blinking-dot-1 { background-color: #4CAF50; animation: guarantee-blink-1 1s infinite linear; } .guarantee-blinking-dot-1::after { content: ""; width: 8px; height: 8px; background-color: #4CAF50; border-radius: 50%; position: absolute; top: 0; left: 0; z-index: -1; animation: guarantee-pulse-1 1s infinite cubic-bezier(0.165, 0.84, 0.44, 1); } .guarantee-blinking-dot-2 { background-color: #4CAF50; animation: guarantee-blink-2 1s infinite linear; } .guarantee-blinking-dot-2::after { content: ""; width: 8px; height: 8px; background-color: #4CAF50; border-radius: 50%; position: absolute; top: 0; left: 0; z-index: -1; animation: guarantee-pulse-2 1s infinite cubic-bezier(0.165, 0.84, 0.44, 1); } @keyframes guarantee-blink-1 { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } } @keyframes guarantee-pulse-1 { 0% { transform: scale(1); opacity: 0.5; } 100% { transform: scale(2.2); opacity: 0; } } @keyframes guarantee-blink-2 { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } } @keyframes guarantee-pulse-2 { 0% { transform: scale(1); opacity: 0.5; } 100% { transform: scale(2.2); opacity: 0; } } .guarantee-item { display: flex; align-items: center; gap: 4px; flex-shrink: 0; min-width: 0; } .guarantee-icon { width: 16px; height: 16px; display: block; flex-shrink: 0; stroke: #00C7FF !important; color: #00C7FF !important; margin-bottom: 1px; } .guarantee-icon svg { width: 100%; height: 100%; display: block; } .guarantee-custom-icon { width: 16px; height: 16px; margin-bottom: 1px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .guarantee-custom-icon svg { width: 100% !important; height: 100% !important; max-width: 16px !important; max-height: 16px !important; fill: #00C7FF !important; stroke: #00C7FF !important; } .guarantee-custom-icon img { width: 100% !important; height: 100% !important; max-width: 16px !important; max-height: 16px !important; object-fit: contain !important; } .guarantee-text { font-weight: 500; letter-spacing: var(--letter-spacing-body); word-wrap: break-word; hyphens: auto; } @media (max-width: 480px) { .guarantee-badges-container { flex-direction: row; justify-content: flex-start; margin-top: -5px; flex-wrap: wrap; } .guarantee-item { flex-wrap: wrap; justify-content: center; } } /* Subscribe & Save gate — on pages that have a Subscribe & Save toggle, these subscription badges are hidden by default and only appear while the toggle is switched ON. Pages without a subscribe toggle are unaffected. */ body:has(.subscribe-save-wrapper) .guarantee-badges-container { display: none; } body:has(.subscribe-save-wrapper input:checked) .guarantee-badges-container { display: flex; } .guarantee-badges-container { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 5px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; font-size: 12px; letter-spacing: var(--letter-spacing-body); color: #2a2929 !important; width: 100%; flex-direction: row; flex-wrap: wrap; } .guarantee-blinking-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; vertical-align: middle; position: relative; flex-shrink: 0; margin-bottom: 1px; } .guarantee-blinking-dot-1 { background-color: #4caf50; animation: guarantee-blink-1 1s infinite linear; } .guarantee-blinking-dot-1::after { content: ""; width: 8px; height: 8px; background-color: #4caf50; border-radius: 50%; position: absolute; top: 0; left: 0; z-index: -1; animation: guarantee-pulse-1 1s infinite cubic-bezier(0.165, 0.84, 0.44, 1); } .guarantee-blinking-dot-2 { background-color: #4caf50; animation: guarantee-blink-2 1s infinite linear; } .guarantee-blinking-dot-2::after { content: ""; width: 8px; height: 8px; background-color: #4caf50; border-radius: 50%; position: absolute; top: 0; left: 0; z-index: -1; animation: guarantee-pulse-2 1s infinite cubic-bezier(0.165, 0.84, 0.44, 1); } @keyframes guarantee-blink-1 { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } } @keyframes guarantee-pulse-1 { 0% { transform: scale(1); opacity: 0.5; } 100% { transform: scale(2.2); opacity: 0; } } @keyframes guarantee-blink-2 { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } } @keyframes guarantee-pulse-2 { 0% { transform: scale(1); opacity: 0.5; } 100% { transform: scale(2.2); opacity: 0; } } .guarantee-item { display: flex; align-items: center; gap: 4px; flex-shrink: 0; min-width: 0; } .guarantee-icon { width: 12px; height: 12px; display: block; flex-shrink: 0; stroke: #0d3e32 !important; color: #0d3e32 !important; margin-bottom: 1px; } .guarantee-icon svg { width: 100%; height: 100%; display: block; } .guarantee-custom-icon { width: 12px; height: 12px; margin-bottom: 1px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .guarantee-custom-icon svg { width: 100% !important; height: 100% !important; max-width: 12px !important; max-height: 12px !important; fill: #0d3e32 !important; stroke: #0d3e32 !important; } .guarantee-custom-icon img { width: 100% !important; height: 100% !important; max-width: 12px !important; max-height: 12px !important; object-fit: contain !important; } .guarantee-text { font-weight: 500; letter-spacing: var(--letter-spacing-body); word-wrap: break-word; hyphens: auto; } @media (max-width: 480px) { .guarantee-badges-container { flex-direction: row; justify-content: center; margin-top: 5px; flex-wrap: wrap; } .guarantee-item { flex-wrap: wrap; justify-content: center; } } /* Subscribe & Save gate — on pages that have a Subscribe & Save toggle, these subscription badges are hidden by default and only appear while the toggle is switched ON. Pages without a subscribe toggle are unaffected. */ body:has(.subscribe-save-wrapper) .guarantee-badges-container { display: none; } body:has(.subscribe-save-wrapper input:checked) .guarantee-badges-container { display: flex; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .nosub-eenmalig { display: block; width: 100%; margin: 6px 0 2px; padding: 4px 0; background: none; border: 0; cursor: pointer; font: inherit; font-size: 13px; line-height: 1.4; text-align: center; color: #2c2c2c; text-decoration: underline; text-underline-offset: 3px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .nosub-eenmalig[hidden] { display: none; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .nosub-eenmalig__label { font-weight: 500; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .nosub-eenmalig__prijs { font-weight: 500; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .nosub-eenmalig[aria-busy="true"] { opacity: .55; pointer-events: none; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review { margin: 14px 0 0; padding: 12px 14px; border: 1px solid #e5e2dc; border-radius: 4px; background: #faf3e6; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review__sterren { color: #f5a623; font-size: 13px; letter-spacing: 1px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review__tekst { margin: 6px 0 10px; font-size: 14px; line-height: 1.45; color: #2c2c2c; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review__wie { display: flex; align-items: center; gap: 8px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review__foto { border-radius: 50%; width: 28px; height: 28px; object-fit: cover; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review__naam { font-size: 13px; font-weight: 600; color: #2c2c2c; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review__badge { font-size: 11px; color: #4a7a52; background: #eaf3ea; padding: 2px 7px; border-radius: 999px; } #pdp-faq { margin: 24px 0 4px; border-top: 1px solid #e4ddce; } #pdp-faq .pdp-faq__item { border-bottom: 1px solid #e4ddce; } #pdp-faq .pdp-faq__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 14px; background: none; border: 0; padding: 16px 2px; cursor: pointer; text-align: left; } #pdp-faq .pdp-faq__q-text { color: #1f2421; font-size: 15px; font-weight: 600; line-height: 1.35; } #pdp-faq .pdp-faq__icon { position: relative; width: 16px; height: 16px; flex-shrink: 0; } #pdp-faq .pdp-faq__icon::before, #pdp-faq .pdp-faq__icon::after { content: ''; position: absolute; background: #1f2421; transition: opacity .2s ease, transform .2s ease; } #pdp-faq .pdp-faq__icon::before { top: 7px; left: 0; width: 16px; height: 2px; } #pdp-faq .pdp-faq__icon::after { left: 7px; top: 0; width: 2px; height: 16px; } #pdp-faq .pdp-faq__q[aria-expanded="true"] .pdp-faq__icon::after { opacity: 0; transform: rotate(90deg); } #pdp-faq .pdp-faq__a { overflow: hidden; max-height: 0; transition: max-height .28s ease; } #pdp-faq .pdp-faq__a p { margin: 0; padding: 0 2px 18px; color: #5b6058; font-size: 14px; font-weight: 400; line-height: 1.5; } #pdp-trust { margin: 24px 0 4px; background: linear-gradient(rgba(15, 61, 53, 0.88), rgba(15, 61, 53, 0.88)), url('https://cdn.shopify.com/s/files/1/0981/5598/7286/files/image_3_1_2_d08a0401-21f3-4da8-a98a-d270bff3150c.png') center/cover no-repeat; border-radius: 4px; padding: 28px 22px; text-align: center; overflow: hidden; } #pdp-trust .pdp-trust__heading { color: #ffffff !important; font-size: 22px; font-weight: 700; margin: 0 0 10px; } #pdp-trust .pdp-trust__subtext { color: #e0e9e2; font-size: 14px; font-weight: 400; line-height: 1.4; margin: 0 auto 24px; max-width: 420px; } #pdp-trust .pdp-trust__icons { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px 0; } #pdp-trust .pdp-trust__item { display: flex; flex-direction: column; align-items: center; gap: 11px; padding: 4px 8px; border-left: 1px solid #0d3e32; } #pdp-trust .pdp-trust__item:first-child { border-left: 0; } #pdp-trust .pdp-trust__ico { width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; } #pdp-trust .pdp-trust__ico img { width: 100%; height: 100%; object-fit: contain; } #pdp-trust .pdp-trust__label { color: #ffffff; font-size: 10px; font-weight: 600; line-height: 1.3; } #pdp-trust .pdp-trust__no-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px 16px; margin-top: 24px; padding-top: 22px; border-top: 1px solid #0d3e32; } #pdp-trust .pdp-trust__no { color: #e0e9e2; font-size: 12px; font-weight: 600; white-space: nowrap; } #pdp-trust .pdp-trust__x { opacity: .8; margin-right: 1px; } #pdp-trust .pdp-trust__no-text { text-decoration: line-through; } @media screen and (max-width: 749px) { #pdp-trust .pdp-trust__icons { gap: 12px 0; } #pdp-trust .pdp-trust__item { padding: 2px 3px; gap: 7px; } #pdp-trust .pdp-trust__ico { width: 26px !important; height: 26px !important; } #pdp-trust .pdp-trust__label { font-size: 10px !important; line-height: 1.2; } } @media screen and (min-width: 750px) { #pdp-trust .pdp-trust__icons { grid-template-columns: repeat(4, 1fr); } #pdp-trust .pdp-trust__item:nth-child(odd) { border-left: 1px solid #0d3e32; } #pdp-trust .pdp-trust__item:first-child { border-left: 0; } } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-container { padding-top: 16px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-card { max-width: none; flex: 1 1 0; min-width: 0; margin-bottom: 0 !important; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-title, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-content { text-align: center; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-badge { left: 50% !important; right: auto !important; transform: translateX(-50%) !important; top: -9px !important; bottom: auto !important; width: auto !important; min-width: 0 !important; height: auto !important; display: inline-block !important; white-space: nowrap !important; padding: 2px 9px !important; border-radius: 4px !important; font-size: 9.5px !important; letter-spacing: .4px; line-height: 1.5 !important; box-shadow: 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.12) !important; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-save-pill { font-weight: 600 !important; border-radius: 999px; line-height: 1.35; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-card, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-save-pill, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .shop-add-to-cart-wrapper, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .selling-out-fast-block, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .selling-out-fast-progress-container, #shopify-section-template--32040255783254__shop_product_details_JbqzwH .on-review__badge { border-radius: 4px !important; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-selector { margin-bottom: 14px !important; } @media (min-width: 750px) { #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-card { padding: 14px 10px !important; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-title { font-size: 14.5px !important; line-height: 1.25; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-save-pill { font-size: 11px !important; padding: 2px 8px !important; } } @media (max-width: 749px) { #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-card { padding: 10px 6px !important; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-title { font-size: 12px !important; line-height: 1.2; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-save-pill { font-size: 9.5px !important; padding: 1px 5px !important; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .quantity-bundle-badge { font-size: 8.5px !important; padding: 2px 6px !important; } } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .customer-review-block, #shopify-section-template--32040255783254__shop_product_details_JbqzwH [class*="customer-review"] { margin-top: 14px; } #shopify-section-template--32040255783254__shop_product_details_JbqzwH .custom-text-accent {font-weight: 700 !important;} #shopify-section-template--32040255783254__shop_product_details_JbqzwH .simple-variant-picker__selected-variant {opacity: 0% !important;} /* Custom colors enabled - DEBUG: use_theme_colors = false */ /* Override gradient background when theme colors are off */ .button-gradient-effect, #stickyAddToCart .button-gradient-effect, html body #stickyAddToCart .button-gradient-effect { background: transparent !important; background-image: none !important; } #stickyAddToCart, html body #stickyAddToCart { background: #ffffff !important; box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.1) !important; color: #1d3a1d !important; z-index: 9900; } /* Mobile-only transparent background for custom colors */ @media (max-width: 767px) { } #stickyAddToCart .sticky-add-to-cart__container, html body #stickyAddToCart .sticky-add-to-cart__container { background: #ffffff !important; } /* Mobile-only transparent background for custom colors container */ @media (max-width: 767px) { } #stickyAddToCart .sticky-add-to-cart__product, #stickyAddToCart .sticky-add-to-cart__shipping, #stickyAddToCart .sticky-add-to-cart__shipping-date, #stickyAddToCart .sticky-add-to-cart__details, #stickyAddToCart .sticky-add-to-cart__ratings, #stickyAddToCart .sticky-add-to-cart__stars, #stickyAddToCart .sticky-add-to-cart__rating-text, #stickyAddToCart .sticky-add-to-cart__title, #stickyAddToCart .desktop-view, #stickyAddToCart .mobile-view, #stickyAddToCart .mobile-shipping-info { background: #ffffff !important; } /* Mobile-only transparent background for custom colors elements */ @media (max-width: 767px) { } #stickyAddToCart .sticky-add-to-cart__button, html body #stickyAddToCart .sticky-add-to-cart__button { /* Use Global Button Styling System */ --button-text-font-size: var(--global-button-font-size, 14px); padding: var(--global-button-padding-y, 12px) var(--global-button-padding-x, 24px) !important; font-size: var(--global-button-font-size, 14px) !important; font-weight: var(--global-button-font-weight, 700) !important; font-family: var(--global-button-font-family, inherit) !important; letter-spacing: var(--global-button-letter-spacing, 1px) !important; text-transform: var(--global-button-text-transform, none) !important; color: var(--global-button-text-color) !important; border-radius: var(--global-button-radius); background-color: var(--global-button-bg-color) !important; border-left: var(--global-button-border-width, 0) solid var(--global-button-border-color, transparent) !important; border-right: var(--global-button-border-width, 0) solid var(--global-button-border-color, transparent) !important; border-top: var(--global-button-border-width, 0) solid var(--global-button-border-color, transparent) !important; border-bottom: var(--global-button-bottom-border-width, 0) solid var(--global-button-bottom-border-color, transparent) !important; } #stickyAddToCart .sticky-add-to-cart__button:hover, html body #stickyAddToCart .sticky-add-to-cart__button:hover { /* Use Global Button Hover Styling */ background-color: var(--global-button-hover-bg-color) !important; color: var(--global-button-hover-text-color) !important; border-color: var(--global-button-hover-border-color, transparent) !important; opacity: 1 !important; filter: none !important; } /* Button text elements */ #stickyAddToCart .sticky-add-to-cart__button .button-text, #stickyAddToCart .sticky-add-to-cart__button .button-added-text, html body #stickyAddToCart .sticky-add-to-cart__button .button-text, html body #stickyAddToCart .sticky-add-to-cart__button .button-added-text { font-size: var(--button-text-font-size, var(--global-button-font-size)) !important; } #stickyAddToCart .sticky-add-to-cart__title, html body #stickyAddToCart .sticky-add-to-cart__title { color: #1d3a1d !important; font-size: 14px; letter-spacing: 0px; } #stickyAddToCart .sticky-add-to-cart__rating-text, html body #stickyAddToCart .sticky-add-to-cart__rating-text { color: #b4c66e !important; font-size: 14px; font-weight: var(--font-weight-regular); letter-spacing: 0px; } #stickyAddToCart .star, html body #stickyAddToCart .star { color: #2a4d2a !important; opacity: 1 !important; } #stickyAddToCart .sticky-add-to-cart__image, html body #stickyAddToCart .sticky-add-to-cart__image, #stickyAddToCart .sticky-add-to-cart__image img { border: 0 !important; border-width: 0 !important; border-color: transparent !important; box-shadow: none !important; } #stickyAddToCart .delivery-icon, html body #stickyAddToCart .delivery-icon { color: #2a4d2a !important; } #stickyAddToCart .delivery-text, html body #stickyAddToCart .delivery-text { color: #1d3a1d !important; font-size: 12px; font-weight: var(--font-weight-bold); letter-spacing: var(--letter-spacing-body); } #stickyAddToCart .delivery-date, html body #stickyAddToCart .delivery-date { color: #2a4d2a !important; font-size: 12px; font-weight: var(--font-weight-bold); letter-spacing: var(--letter-spacing-body); } @media (min-width: 768px) { #stickyAddToCart .sticky-add-to-cart__title, html body #stickyAddToCart .sticky-add-to-cart__title { font-size: 16 px !important; } #stickyAddToCart .sticky-add-to-cart__rating-text, html body #stickyAddToCart .sticky-add-to-cart__rating-text { font-size: 14 px !important; } #stickyAddToCart .delivery-text, html body #stickyAddToCart .delivery-text { font-size: 14 px !important; } #stickyAddToCart .delivery-date, html body #stickyAddToCart .delivery-date { font-size: 14 px !important; } } /* Full-width mobile button mode */ @media (max-width: 767px) { .mobile-view--full-width .mobile-shipping-info { display: none !important; } .mobile-view--full-width .mobile-button-wrapper { width: 100%; } .mobile-view--full-width .sticky-add-to-cart__button { width: 100% !important; text-align: center; border-radius: 0 !important; } .mobile-view--full-width { padding: 0 !important; } .mobile-view--full-width .sticky-add-to-cart__container { padding: 0 !important; } #stickyAddToCart:has(.mobile-view--full-width) { padding: 0 !important; } } .essentae-oregano-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.essentae-oregano-gallery>div{flex:0 0 100%;scroll-snap-align:start}.essentae-oregano-gallery img,.essentae-oregano-gallery video{display:block;width:100%;height:auto}.essentae-oregano-thumbs{display:flex;gap:8px;overflow:auto}.essentae-oregano-thumbs button{flex:0 0 18%;border:0;padding:0;background:none}.essentae-oregano-thumbs img{width:100%}[data-offer-card]{cursor:pointer}.shop-add-to-cart-button{background:#ffce2f;color:#24272c;border-radius:8px;padding:13px 20px;width:100%;font-weight:700}.nosub-eenmalig{display:block} .guarantee-custom-icon svg{width:20px;height:20px;overflow:hidden;display:block} .essentae-oregano-thumbs{min-width:0;scrollbar-width:none;flex:1}.essentae-oregano-thumbs button[aria-current="true"]{outline:1px solid var(--accent-color);outline-offset:-1px}.shop-thumbnail-indicators button{padding:0;border:0}.shop-mobile-prev-arrow,.shop-mobile-next-arrow{flex-shrink:0} .essentae-oregano-thumbs button.shop-thumbnail{flex:0 0 auto;min-height:0;box-shadow:none}.essentae-oregano-thumbs{width:100%} .subscribe-toggle-slider{border-radius:999px} }