.wc-stripe-payment-button-preview{align-items:center;background-color:#000;border-radius:5px;display:flex;height:40px;justify-content:center}.wc-stripe-payment-button-preview img{height:22px}.wc-stripe-payment-button-preview:hover{cursor:pointer;filter:opacity(.7)}.wc-stripe-payment-button-preview.wc-stripe-amazon-pay-preview{background-color:#ffd814}.wc-stripe-payment-button-preview.wc-stripe-amazon-pay-preview img{height:40px}.wc-stripe-payment-button-preview.wc-stripe-link-preview{background-color:#00d66f}.wc-stripe-payment-button-preview.wc-stripe-link-preview img{height:40px}
button.stripe-gateway-stripelink-modal-trigger{background:no-repeat url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA3MiAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTM2LjEyIDMuNjc2ODNDMzYuMTIgMi41NDg4MiAzNy4wNzA0IDEuNjMyMDIgMzguMTg4OCAxLjYzMjAyQzM5LjMwNzIgMS42MzIwMiA0MC4yNTc2IDIuNTUzNjIgNDAuMjU3NiAzLjY3NjgzQzQwLjI1NzYgNC44MDAwMyAzOS4zNDA4IDUuNzQ1NjMgMzguMTg4OCA1Ljc0NTYzQzM3LjAzNjggNS43NDU2MyAzNi4xMiA0LjgyODgzIDM2LjEyIDMuNjc2ODNaIiBmaWxsPSIjMDExRTBGIi8+CjxwYXRoIGQ9Ik0yOS45ODA4IDEuOTIwMDFIMzMuNTgwOFYyMi4wOEgyOS45ODA4VjEuOTIwMDFaIiBmaWxsPSIjMDExRTBGIi8+CjxwYXRoIGQ9Ik00MC4wMDggNy42ODAwMUgzNi4zNzkyVjIyLjA4SDQwLjAwOFY3LjY4MDAxWiIgZmlsbD0iIzAxMUUwRiIvPgo8cGF0aCBkPSJNNjYuMDk2IDE0LjM5MDRDNjguODI3MiAxMi43MTA0IDcwLjY4NDggMTAuMjA5NiA3MS40MTkyIDcuNjc1MjRINjcuNzkwNEM2Ni44NDQ4IDEwLjA5NDQgNjQuNjc1MiAxMS45MTM2IDYyLjI4OTYgMTIuNjg2NFYxLjkxNTIzSDU4LjY2MDhWMjIuMDc1Mkg2Mi4yODk2VjE2LjA4QzY1LjA1OTIgMTYuNzcxMiA2Ny4yNDggMTkuMTY2NCA2Ny45OTY4IDIyLjA3NTJINzEuNjQ5NkM3MS4wOTI4IDE5LjAyMjQgNjkuMDA0OCAxNi4xNjY0IDY2LjA5NiAxNC4zOTA0WiIgZmlsbD0iIzAxMUUwRiIvPgo8cGF0aCBkPSJNNDYuNDQgOS4yOTI4M0M0Ny4zOTA0IDguMDMwNDMgNDkuMjQzMiA3LjI5NjAyIDUwLjc0NTYgNy4yOTYwMkM1My41NDg4IDcuMjk2MDIgNTUuODY3MiA5LjM0NTYzIDU1Ljg3MiAxMi40NDE2VjIyLjA3NTJINTIuMjQzMlYxMy4yNDMyQzUyLjI0MzIgMTEuOTcxMiA1MS42NzY4IDEwLjUwMjQgNDkuODM4NCAxMC41MDI0QzQ3LjY3ODQgMTAuNTAyNCA0Ni40MzUyIDEyLjQxNzYgNDYuNDM1MiAxNC42NTkyVjIyLjA4NDhINDIuODA2NFY3LjY4OTYySDQ2LjQ0VjkuMjkyODNaIiBmaWxsPSIjMDExRTBGIi8+CjxwYXRoIGQ9Ik0xMiAyNEMxOC42Mjc0IDI0IDI0IDE4LjYyNzQgMjQgMTJDMjQgNS4zNzI1NyAxOC42Mjc0IDAgMTIgMEM1LjM3MjU5IDAgMCA1LjM3MjU3IDAgMTJDMCAxOC42Mjc0IDUuMzcyNTkgMjQgMTIgMjRaIiBmaWxsPSIjMDBENjZGIi8+CjxwYXRoIGQ9Ik0xMS40NDc5IDQuODAwMDVINy43NDcwN0M4LjQ2NzA3IDcuODA5NjUgMTAuNTY5NSAxMC4zODI0IDEzLjE5OTkgMTJDMTAuNTY0NyAxMy42MTc2IDguNDY3MDcgMTYuMTkwNCA3Ljc0NzA3IDE5LjJIMTEuNDQ3OUMxMi4zNjQ3IDE2LjQxNiAxNC45MDM5IDEzLjk5NjggMTguMDIzOSAxMy41MDI0VjEwLjQ5MjlDMTQuODk5MSAxMC4wMDMzIDEyLjM1OTkgNy41ODQwNSAxMS40NDc5IDQuODAwMDVaIiBmaWxsPSIjMDExRTBGIi8+Cjwvc3ZnPgo=);background-color:transparent!important;border:none;cursor:pointer;display:none;height:40px;position:absolute;right:5px;width:64px}button.stripe-gateway-stripelink-modal-trigger:hover{background-color:transparent;border-color:transparent}.wc-block-checkout__payment-method .wc-block-components-radio-control__label>span{width:100%}.wc-block-checkout__payment-method .wc-block-components-radio-control__label>span>span:not(.wc-stripe-test-mode-badge){align-items:center;display:flex;float:right;justify-content:center}.wcstripe-payment-element+.wc-block-components-payment-methods__save-card-info{margin-top:1.4em}#radio-control-wc-payment-method-options-stripe__content.optimized-checkout-element{padding-top:0}#radio-control-wc-payment-method-options-stripe__content.optimized-checkout-element .content:empty{display:none}#radio-control-wc-payment-method-options-stripe__label>span>span{border:none}body.wc-stripe-hide-save-checkbox .wc-block-components-payment-methods__save-card-info{display:none!important}.wc-stripe-test-mode-badge{background-color:#fff2d7;border-radius:4px;color:#4d3716;display:none;font-size:12px;font-weight:400;line-height:16px;margin-left:8px;padding:4px 6px}.wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-option input:checked~div .wc-block-components-radio-control__label .wc-stripe-test-mode-badge,.wc-block-checkout__payment-method .wc-block-components-radio-control__option input:checked~div .wc-block-components-radio-control__label .wc-stripe-test-mode-badge{display:inline-block}
.wc-block-components-express-payment--cart .wc-block-components-express-payment__event-buttons{display:flex!important;flex-direction:column!important;gap:12px!important}.wc-block-components-express-payment--cart .wc-block-components-express-payment__event-buttons>li{font-size:0!important;line-height:0!important;margin:0!important;padding:0!important;width:100%!important}.wc-block-components-express-payment-continue-rule--cart{height:20px;margin:24px 0!important}.wc-block-components-express-payment .wc-block-components-express-payment__event-buttons .StripeElement iframe{max-width:unset}@supports not (-webkit-appearance:-apple-pay-button){#express-payment-method-stripe_express_checkout_element_applePay:has(#express-checkout-button-preview-applePay){display:none}}#express-checkout-button-preview-googlePay .gpay-card-info-container{min-width:auto}
.wc-stripe-copy-test-number{align-items:center;background-color:transparent!important;border:none!important;border-radius:0;box-shadow:none!important;color:inherit!important;cursor:pointer;display:inline-flex;font-family:inherit!important;font-size:inherit;font-weight:400;line-height:inherit;padding:2px 1px!important;vertical-align:baseline}.wc-stripe-copy-test-number span{margin-right:4px}.wc-stripe-copy-test-number i{background-color:currentColor;display:block;height:1.2em;-webkit-mask-image:url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIzIDMgMjAgMjAiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01IDQuNWgxMWMuMTMyNiAwIC4yNTk4LjA1MjY4LjM1MzYuMTQ2NDUuMDkzNy4wOTM3Ni4xNDY0LjIyMDk0LjE0NjQuMzUzNTV2MTFjMCAuMTMyNi0uMDUyNy4yNTk4LS4xNDY0LjM1MzYtLjA5MzguMDkzNy0uMjIxLjE0NjQtLjM1MzYuMTQ2NGgtMTFjLS4xMzI2MSAwLS4yNTk3OS0uMDUyNy0uMzUzNTUtLjE0NjQtLjA5Mzc3LS4wOTM4LS4xNDY0NS0uMjIxLS4xNDY0NS0uMzUzNnYtMTFjMC0uMTMyNjEuMDUyNjgtLjI1OTc5LjE0NjQ1LS4zNTM1NS4wOTM3Ni0uMDkzNzcuMjIwOTQtLjE0NjQ1LjM1MzU1LS4xNDY0NXptLTIgLjVjMC0uNTMwNDMuMjEwNzEtMS4wMzkxNC41ODU3OS0xLjQxNDIxLjM3NTA3LS4zNzUwOC44ODM3OC0uNTg1NzkgMS40MTQyMS0uNTg1NzloMTFjLjUzMDQgMCAxLjAzOTEuMjEwNzEgMS40MTQyLjU4NTc5LjM3NTEuMzc1MDcuNTg1OC44ODM3OC41ODU4IDEuNDE0MjF2MTFjMCAuNTMwNC0uMjEwNyAxLjAzOTEtLjU4NTggMS40MTQycy0uODgzOC41ODU4LTEuNDE0Mi41ODU4aC0xMWMtLjUzMDQzIDAtMS4wMzkxNC0uMjEwNy0xLjQxNDIxLS41ODU4LS4zNzUwOC0uMzc1MS0uNTg1NzktLjg4MzgtLjU4NTc5LTEuNDE0MnptMTcgM3YxMC43NWMwIC42OS0uNTYgMS4yNS0xLjI1IDEuMjVoLTEyLjc1djEuNWgxMi43NWMuNzI5MyAwIDEuNDI4OC0uMjg5NyAxLjk0NDUtLjgwNTUuNTE1OC0uNTE1Ny44MDU1LTEuMjE1Mi44MDU1LTEuOTQ0NXYtMTAuNzV6IiBmaWxsPSIjMTAxNTE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4K);mask-image:url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIzIDMgMjAgMjAiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01IDQuNWgxMWMuMTMyNiAwIC4yNTk4LjA1MjY4LjM1MzYuMTQ2NDUuMDkzNy4wOTM3Ni4xNDY0LjIyMDk0LjE0NjQuMzUzNTV2MTFjMCAuMTMyNi0uMDUyNy4yNTk4LS4xNDY0LjM1MzYtLjA5MzguMDkzNy0uMjIxLjE0NjQtLjM1MzYuMTQ2NGgtMTFjLS4xMzI2MSAwLS4yNTk3OS0uMDUyNy0uMzUzNTUtLjE0NjQtLjA5Mzc3LS4wOTM4LS4xNDY0NS0uMjIxLS4xNDY0NS0uMzUzNnYtMTFjMC0uMTMyNjEuMDUyNjgtLjI1OTc5LjE0NjQ1LS4zNTM1NS4wOTM3Ni0uMDkzNzcuMjIwOTQtLjE0NjQ1LjM1MzU1LS4xNDY0NXptLTIgLjVjMC0uNTMwNDMuMjEwNzEtMS4wMzkxNC41ODU3OS0xLjQxNDIxLjM3NTA3LS4zNzUwOC44ODM3OC0uNTg1NzkgMS40MTQyMS0uNTg1NzloMTFjLjUzMDQgMCAxLjAzOTEuMjEwNzEgMS40MTQyLjU4NTc5LjM3NTEuMzc1MDcuNTg1OC44ODM3OC41ODU4IDEuNDE0MjF2MTFjMCAuNTMwNC0uMjEwNyAxLjAzOTEtLjU4NTggMS40MTQycy0uODgzOC41ODU4LTEuNDE0Mi41ODU4aC0xMWMtLjUzMDQzIDAtMS4wMzkxNC0uMjEwNy0xLjQxNDIxLS41ODU4LS4zNzUwOC0uMzc1MS0uNTg1NzktLjg4MzgtLjU4NTc5LTEuNDE0MnptMTcgM3YxMC43NWMwIC42OS0uNTYgMS4yNS0xLjI1IDEuMjVoLTEyLjc1djEuNWgxMi43NWMuNzI5MyAwIDEuNDI4OC0uMjg5NyAxLjk0NDUtLjgwNTUuNTE1OC0uNTE1Ny44MDU1LTEuMjE1Mi44MDU1LTEuOTQ0NXYtMTAuNzV6IiBmaWxsPSIjMTAxNTE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4K);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;order:1;width:1.2em}.wc-stripe-copy-test-number:hover{background-color:transparent;opacity:.7}.wc-stripe-copy-test-number:active i{transform:scale(.9)}.wc-stripe-copy-test-number:focus{box-shadow:none!important;outline:none}.wc-stripe-copy-test-number:focus-visible{outline:2px solid currentColor;outline-offset:2px}.wc-stripe-copy-test-number.state--success i{-webkit-mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxMiAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTEuMzI3NCAwLjUzMTIxNkw0LjU3NjY3IDkuNjEwMTlMMC42NjIyMDYgNi42OTk1NyIgc3Ryb2tlPSIjMDA4QTIwIiBzdHJva2Utd2lkdGg9IjEuNSIvPjwvc3ZnPgo=);mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxMiAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTEuMzI3NCAwLjUzMTIxNkw0LjU3NjY3IDkuNjEwMTlMMC42NjIyMDYgNi42OTk1NyIgc3Ryb2tlPSIjMDA4QTIwIiBzdHJva2Utd2lkdGg9IjEuNSIvPjwvc3ZnPgo=)}@keyframes wc-skeleton-shimmer{to{transform:translateX(100%)}}body.wc-block-product-gallery-modal-open,body.wc-modal--open{overflow:hidden}.wc-block-grid__products .wc-block-grid__product-image{display:block;position:relative;text-decoration:none}.wc-block-grid__products .wc-block-grid__product-image a{border:0;box-shadow:none;outline:0;text-decoration:none}.wc-block-grid__products .wc-block-grid__product-image img{height:auto;max-width:100%;width:100%}.wc-block-grid__products .wc-block-grid__product-image img[hidden]{display:none}.wc-block-grid__products .wc-block-grid__product-image img[alt=""]{border:1px solid #f2f2f2}.edit-post-visual-editor .editor-block-list__block .wc-block-grid__product-title,.editor-styles-wrapper .wc-block-grid__product-title,.wc-block-grid__product-title{color:inherit;display:block;font-family:inherit;font-size:inherit;font-weight:700;line-height:1.2;padding:0}.wc-block-grid__product-price{display:block}.wc-block-grid__product-price .wc-block-grid__product-price__regular{margin-right:.5em}.wc-block-grid__product-add-to-cart.wp-block-button{white-space:normal;word-break:break-word}.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link{display:inline-flex;font-size:1em;justify-content:center;text-align:center;white-space:normal;word-break:break-word}.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link.loading{opacity:.25}.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link.added:after{content:"";display:inline-block;font-family:WooCommerce;height:auto;margin-left:.5em;width:auto}.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link.loading:after{animation:spin 2s linear infinite;content:"";display:inline-block;font-family:WooCommerce;height:auto;margin-left:.5em;width:auto}.has-5-columns:not(.alignfull) .wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link:after,.has-6-columns .wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link:after,.has-7-columns .wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link:after,.has-8-columns .wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link:after,.has-9-columns .wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link:after{content:"";margin:0}.wc-block-grid__product-rating,.wp-block-woocommerce-product-review-rating{display:block}.wc-block-grid__product-rating .star-rating,.wc-block-grid__product-rating .wc-block-grid__product-rating__stars,.wc-block-grid__product-rating .wc-block-product-review-rating__stars,.wp-block-woocommerce-product-review-rating .star-rating,.wp-block-woocommerce-product-review-rating .wc-block-grid__product-rating__stars,.wp-block-woocommerce-product-review-rating .wc-block-product-review-rating__stars{font-family:WooCommerce;font-size:1em;font-weight:400;height:1.618em;line-height:1.618;margin:0 auto;overflow:hidden;position:relative;text-align:left;width:5.3em}.wc-block-grid__product-rating .star-rating:before,.wc-block-grid__product-rating .wc-block-grid__product-rating__stars:before,.wc-block-grid__product-rating .wc-block-product-review-rating__stars:before,.wp-block-woocommerce-product-review-rating .star-rating:before,.wp-block-woocommerce-product-review-rating .wc-block-grid__product-rating__stars:before,.wp-block-woocommerce-product-review-rating .wc-block-product-review-rating__stars:before{content:"SSSSS";left:0;opacity:.5;position:absolute;right:0;top:0;white-space:nowrap}.wc-block-grid__product-rating .star-rating span,.wc-block-grid__product-rating .wc-block-grid__product-rating__stars span,.wc-block-grid__product-rating .wc-block-product-review-rating__stars span,.wp-block-woocommerce-product-review-rating .star-rating span,.wp-block-woocommerce-product-review-rating .wc-block-grid__product-rating__stars span,.wp-block-woocommerce-product-review-rating .wc-block-product-review-rating__stars span{left:0;overflow:hidden;padding-top:1.5em;position:absolute;right:0;top:0}.wc-block-grid__product-rating .star-rating span:before,.wc-block-grid__product-rating .wc-block-grid__product-rating__stars span:before,.wc-block-grid__product-rating .wc-block-product-review-rating__stars span:before,.wp-block-woocommerce-product-review-rating .star-rating span:before,.wp-block-woocommerce-product-review-rating .wc-block-grid__product-rating__stars span:before,.wp-block-woocommerce-product-review-rating .wc-block-product-review-rating__stars span:before{color:inherit;content:"SSSSS";left:0;position:absolute;right:0;top:0;white-space:nowrap}.wc-block-grid .wc-block-grid__product-onsale,.wc-block-grid__product-image .wc-block-grid__product-onsale{background:#fff;border:1px solid #43454b;border-radius:4px;color:#43454b;display:inline-block;font-size:.875em;font-weight:600;left:auto;padding:.25em .75em;position:absolute;right:4px;text-align:center;text-transform:uppercase;top:4px;width:auto;z-index:9}.wc-block-grid__product .wc-block-grid__product-image,.wc-block-grid__product .wc-block-grid__product-link{display:inline-block;position:relative}.wc-block-grid__product .wc-block-grid__product-image:not(.wc-block-components-product-image),.wc-block-grid__product .wc-block-grid__product-title{margin:0 0 12px}.wc-block-grid__product .wc-block-grid__product-add-to-cart,.wc-block-grid__product .wc-block-grid__product-onsale,.wc-block-grid__product .wc-block-grid__product-price,.wc-block-grid__product .wc-block-grid__product-rating{margin:0 auto 12px}.theme-twentysixteen .wc-block-grid .price ins{color:#77a464}.theme-twentynineteen .wc-block-grid__product{font-size:.88889em}.theme-twentynineteen .wc-block-components-product-sale-badge,.theme-twentynineteen .wc-block-components-product-title,.theme-twentynineteen .wc-block-grid__product-onsale,.theme-twentynineteen .wc-block-grid__product-title{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.theme-twentynineteen .wc-block-grid__product-title:before{display:none}.theme-twentynineteen .wc-block-components-product-sale-badge,.theme-twentynineteen .wc-block-grid__product-onsale{line-height:1}.theme-twentynineteen .editor-styles-wrapper .wp-block-button .wp-block-button__link:not(.has-text-color){color:#fff}.theme-twentytwenty .wc-block-grid__product-link{color:#000}.theme-twentytwenty .wc-block-components-product-title,.theme-twentytwenty .wc-block-grid__product-title{color:#cd2653;font-family:-apple-system,blinkmacsystemfont,Helvetica Neue,helvetica,sans-serif;font-size:1em}.theme-twentytwenty .wp-block-columns .wc-block-components-product-title{margin-top:0}.theme-twentytwenty .wc-block-components-product-price .woocommerce-Price-amount,.theme-twentytwenty .wc-block-components-product-price__value,.theme-twentytwenty .wc-block-grid__product-price .woocommerce-Price-amount,.theme-twentytwenty .wc-block-grid__product-price__value{font-family:-apple-system,blinkmacsystemfont,Helvetica Neue,helvetica,sans-serif;font-size:.9em}.theme-twentytwenty .wc-block-components-product-price del,.theme-twentytwenty .wc-block-grid__product-price del{opacity:.7}.theme-twentytwenty .wc-block-components-product-price ins,.theme-twentytwenty .wc-block-grid__product-price ins{text-decoration:none}.theme-twentytwenty .star-rating,.theme-twentytwenty .wc-block-grid__product-rating{font-size:.7em}.theme-twentytwenty .star-rating .wc-block-components-product-rating__stars,.theme-twentytwenty .star-rating .wc-block-grid__product-rating__stars,.theme-twentytwenty .wc-block-grid__product-rating .wc-block-components-product-rating__stars,.theme-twentytwenty .wc-block-grid__product-rating .wc-block-grid__product-rating__stars{line-height:1}.theme-twentytwenty .wc-block-components-product-button>.wp-block-button__link,.theme-twentytwenty .wc-block-grid__product-add-to-cart>.wp-block-button__link{font-family:-apple-system,blinkmacsystemfont,Helvetica Neue,helvetica,sans-serif}.theme-twentytwenty .wc-block-components-product-sale-badge,.theme-twentytwenty .wc-block-grid__products .wc-block-grid__product-onsale{background:#cd2653;color:#fff;font-family:-apple-system,blinkmacsystemfont,Helvetica Neue,helvetica,sans-serif;font-weight:700;letter-spacing:-.02em;line-height:1.2;text-transform:uppercase}.theme-twentytwenty .wc-block-grid__products .wc-block-components-product-sale-badge{position:static}.theme-twentytwenty .wc-block-grid__products .wc-block-grid__product-image .wc-block-components-product-sale-badge{position:absolute}.theme-twentytwenty .wc-block-grid__products .wc-block-grid__product-onsale:not(.wc-block-components-product-sale-badge){position:absolute;right:4px;top:4px;z-index:1}.theme-twentytwenty .wc-block-active-filters__title,.theme-twentytwenty .wc-block-attribute-filter__title,.theme-twentytwenty .wc-block-price-filter__title,.theme-twentytwenty .wc-block-stock-filter__title{font-size:1em}.theme-twentytwenty .wc-block-active-filters .wc-block-active-filters__clear-all,.theme-twentytwenty .wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link{font-size:.75em}@media only screen and (min-width:768px){.theme-twentytwenty .wc-block-grid__products .wc-block-grid__product-onsale{font-size:.875em;padding:.5em}}@media only screen and (min-width:1168px){.theme-twentytwenty .wc-block-grid__products .wc-block-grid__product-onsale{font-size:.875em;padding:.5em}}.theme-twentytwentytwo .wc-block-grid__product-add-to-cart .added_to_cart{display:block;margin-top:12px}.theme-twentytwentytwo .wc-block-components-product-price ins,.theme-twentytwentytwo .wc-block-grid__product-price ins{text-decoration:none}.screen-reader-text{clip:rect(1px,1px,1px,1px);word-wrap:normal!important;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;overflow-wrap:normal!important;padding:0;position:absolute!important;width:1px}.screen-reader-text:focus{clip:auto!important;background-color:#fff;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip-path:none;color:#2b2d2f;display:block;font-size:.875rem;font-weight:700;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}.wp-block-group.woocommerce.product .up-sells.upsells.products{max-width:var(--wp--style--global--wide-size)}
@keyframes wc-skeleton-shimmer{to{transform:translateX(100%)}}.wc-block-components-notice-banner{align-content:flex-start;align-items:stretch;background-color:#fff;border:1px solid #2f2f2f;border-radius:4px;box-sizing:border-box;color:#2f2f2f;display:flex;font-size:.875em;font-weight:400;gap:12px;line-height:1.5;margin:16px 0;padding:16px!important}.wc-block-components-notice-banner>.wc-block-components-notice-banner__content{align-self:center;flex-basis:100%;padding-right:16px;white-space:normal}.wc-block-components-notice-banner>.wc-block-components-notice-banner__content:last-child{padding-right:0}.wc-block-components-notice-banner>.wc-block-components-notice-banner__content .wc-block-components-notice-banner__summary{font-weight:600;margin:0 0 8px}.wc-block-components-notice-banner>.wc-block-components-notice-banner__content ol,.wc-block-components-notice-banner>.wc-block-components-notice-banner__content ul{margin:0 0 0 24px;padding:0}.wc-block-components-notice-banner>.wc-block-components-notice-banner__content ol li:after,.wc-block-components-notice-banner>.wc-block-components-notice-banner__content ul li:after{clear:both;content:"";display:block}.wc-block-components-notice-banner>.wc-block-components-notice-banner__content .wc-forward{appearance:none;background:transparent!important;border:0;color:#2f2f2f!important;float:right;margin:0;opacity:.7;padding:0!important;text-decoration-line:underline;text-underline-position:under;transition:all .2s ease-in-out}.wc-block-components-notice-banner>.wc-block-components-notice-banner__content .wc-forward:active,.wc-block-components-notice-banner>.wc-block-components-notice-banner__content .wc-forward:focus,.wc-block-components-notice-banner>.wc-block-components-notice-banner__content .wc-forward:hover{opacity:1;text-decoration:none}.wc-block-components-notice-banner>svg{fill:#fff;background-color:#2f2f2f;border-radius:50%;flex-grow:0;flex-shrink:0;height:100%;padding:2px}.wc-block-components-notice-banner>.wc-block-components-button{background:transparent none!important;border:0!important;box-shadow:none!important;color:#2f2f2f!important;flex:0 0 16px;height:16px!important;margin:6px 0 0 auto!important;min-height:auto!important;min-width:0!important;opacity:.6;outline:none!important;padding:0!important;width:16px!important}.wc-block-components-notice-banner>.wc-block-components-button>svg{margin:0!important}.wc-block-components-notice-banner>.wc-block-components-button:active,.wc-block-components-notice-banner>.wc-block-components-button:focus,.wc-block-components-notice-banner>.wc-block-components-button:hover{opacity:1}.wc-block-components-notice-banner>.wc-block-components-button:focus{outline:2px solid currentColor!important;outline-offset:0}.wc-block-components-notice-banner.is-error{background-color:#fff0f0;border-color:#cc1818}.wc-block-components-notice-banner.is-error>svg{background-color:#cc1818;transform:rotate(180deg)}.wc-block-components-notice-banner.is-warning{background-color:#fffbf4;border-color:#f0b849}.wc-block-components-notice-banner.is-warning>svg{background-color:#f0b849;transform:rotate(180deg)}.wc-block-components-notice-banner.is-success{background-color:#f4fff7;border-color:#4ab866}.wc-block-components-notice-banner.is-success>svg{background-color:#4ab866}.wc-block-components-notice-banner.is-info{background-color:#f4f8ff;border-color:#007cba}.wc-block-components-notice-banner.is-info>svg{background-color:#007cba}.wc-block-components-notice-banner:focus{outline-width:0}.wc-block-components-notice-banner:focus-visible{outline-style:solid;outline-width:2px}.woocommerce.wc-block-store-notices.alignwide{max-width:var(--wp--style--global--wide-size)}.dpi-shortcode-wrapper {
width: 100%;
} .dpi-product-grid-wrapper {
display: flex;
gap: 24px;
align-items: flex-start;
max-width: 1440px;
margin: 0 auto;
padding: 32px 24px 80px;
font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
color: #333;
box-sizing: border-box;
} .dpi-vehiculier-section {
background: #f8f8f8;
padding: 32px 24px 36px;
margin-bottom: 0;
}
.dpi-vehiculier-inner {
max-width: 1440px;
margin: 0 auto;
}
.dpi-vehiculier-title {
margin-bottom: 16px;
}
.dpi-vehiculier-title h2 {
margin: 0 0 6px !important;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 32px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
color: #000 !important;
line-height: 1.2 !important;
}
.dpi-vehiculier-title h2 span {
color: #FF0000 !important;
}
.dpi-vehiculier-title p {
margin: 0 !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 15px !important;
color: #666 !important;
}
.dpi-vehiculier-wrapper {
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 12px;
padding: 24px 28px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}
.dpi-vehiculier-row {
display: flex;
align-items: center;
gap: 10px;
}
.dpi-vehiculier-selects {
display: flex;
flex: 1;
gap: 10px;
width:100%;
}
.dpi-vehiculier-select {
flex: 1;
min-width: 0;
padding: 12px 36px 12px 14px !important;
background: #fff;
border: 1px solid #e0e0e0 !important;
border-radius: 10px !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 14px !important;
color: #333;
appearance: none !important;
-webkit-appearance: none !important;
background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 12px center;
cursor: pointer;
transition: border-color 0.2s!important;
}
.dpi-vehiculier-select:focus {
border-color: #FF0000;
outline: none;
box-shadow: 0 0 0 2px rgba(255, 0, 0, 0.1);
}
.dpi-vehiculier-select:disabled {
background-color: #f5f5f5;
color: #999;
cursor: not-allowed;
} .dpi-searchable-wrap {
position: relative;
flex: 1;
min-width: 0;
}
.dpi-searchable-input {
width: 100%;
box-sizing: border-box;
}
.dpi-searchable-input::placeholder {
color: #999;
}
.dpi-searchable-dropdown {
display: none;
position: absolute;
top: calc(100% + 4px);
left: 0;
right: 0;
max-height: 220px;
overflow-y: auto;
background: #fff;
border: 1px solid #e0e0e0;
border-radius: 10px;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
z-index: 101;
padding: 4px;
}
.dpi-searchable-option {
padding: 10px 14px;
font-family: "SF Pro Display", sans-serif;
font-size: 14px;
color: #333;
border-radius: 6px;
cursor: pointer;
transition: background 0.15s;
}
.dpi-searchable-option:hover {
background: #f5f5f5;
}
.dpi-searchable-empty {
padding: 12px 14px;
font-family: "SF Pro Display", sans-serif;
font-size: 13px;
color: #999;
text-align: center;
}
.dpi-vehiculier-btn {
padding: 12px 24px;
white-space: nowrap;
background: #FF0000 !important;
color: #fff !important;
border: none !important;
border-radius: 10px !important;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 13px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
transition: background 0.2s, box-shadow 0.2s;
flex-shrink: 0;
}
.dpi-vehiculier-btn:hover:not(:disabled) {
background: #cc0000 !important;
box-shadow: 0 4px 12px rgba(255, 0, 0, 0.25);
}
.dpi-vehiculier-btn:disabled {
opacity: 0.5;
cursor: not-allowed;
} .dpi-vehiculier-separator {
display: flex;
align-items: center;
gap: 16px;
margin: 16px 0;
}
.dpi-vehiculier-separator::before,
.dpi-vehiculier-separator::after {
content: '';
flex: 1;
height: 1px;
background: #e5e5e5;
}
.dpi-vehiculier-separator span {
font-family: "SF Pro Display", sans-serif !important;
font-size: 13px !important;
color: #999 !important;
text-transform: uppercase;
letter-spacing: 1px;
flex-shrink: 0;
} .dpi-vehiculier-search {
position: relative;
}
.dpi-vehiculier-search .dpi-search-bar-icon {
position: absolute;
left: 14px;
top: 50%;
transform: translateY(-50%);
color: #999;
pointer-events: none;
}
.dpi-vehiculier-search .dpi-filter-search {
width: 100%;
padding: 12px 16px 12px 42px !important;
border: 1px solid #e0e0e0 !important;
border-radius: 10px !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 14px !important;
color: #333 !important;
background: #fff !important;
box-sizing: border-box;
transition: border-color 0.2s, box-shadow 0.2s;
}
.dpi-vehiculier-search .dpi-filter-search:focus {
border-color: #FF0000 !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(255, 0, 0, 0.1) !important;
} .dpi-vehicle-bar {
position: sticky;
top: 0;
z-index: 100;
background: #fff;
border-bottom: 1px solid #e5e5e5;
padding: 10px 24px;
box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.admin-bar .dpi-vehicle-bar {
top: 32px;
}
@media screen and (max-width: 782px) {
.admin-bar .dpi-vehicle-bar {
top: 46px;
}
}
.dpi-vehicle-bar-inner {
max-width: 1440px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.dpi-vehicle-bar-left {
display: flex;
align-items: center;
gap: 10px;
flex-shrink: 0;
}
.dpi-vehicle-bar-icon {
color: #666;
flex-shrink: 0;
width: 40px;
height: 40px;
}
.dpi-vehicle-bar.dpi-vehicle-applied .dpi-vehicle-bar-icon {
color: #FF0000;
}
.dpi-vehicle-bar-label {
font-family: "SF Pro Display", sans-serif;
font-size: 13px;
font-weight: 600;
color: #666;
white-space: nowrap;
}
.dpi-vehicle-bar-value {
font-family: "SF Pro Display", sans-serif;
font-size: 15px;
color: #999;
white-space: nowrap;
}
.dpi-vehicle-bar.dpi-vehicle-applied .dpi-vehicle-bar-value {
color: #000;
font-weight: 600;
}
.dpi-vehicle-bar-action {
background: none;
border: 1px solid #ddd;
border-radius: 4px!important;
padding: 3px 8px;
font-family: "SF Pro Display", sans-serif!important;
font-size: 14px!important;
font-weight: 500!important;
cursor: pointer;
transition: all 0.2s;
white-space: nowrap;
}
.dpi-vehicle-bar-action:hover {
background: #FF0000;
border-color: #FF0000;
color: #fff;
}
.dpi-vehicle-bar-delete {
display: none;
align-items: center;
color: #bbb;
cursor: pointer;
transition: color 0.2s;
margin-left: 2px;
}
.dpi-vehicle-bar-delete:hover {
color: #FF0000;
}
.dpi-vehicle-bar.dpi-vehicle-applied .dpi-vehicle-bar-delete {
display: flex;
}
.dpi-vehicle-bar-right {
flex: 1;
max-width: 520px;
min-width: 200px;
}
.dpi-vehicle-bar-search {
display: flex;
align-items: center;
background: #f5f5f5;
border: 1px solid #e5e5e5;
border-radius: 36px;
padding: 1px 4px;
transition: border-color 0.2s;
}
.dpi-vehicle-bar-search:focus-within {
border-color: #FF0000;
background: #fff;
}
.dpi-vehicle-bar-search .dpi-filter-search {
border: none !important;
background: none !important;
padding: 10px 16px !important;
margin: 0 !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 14px !important;
color: #333 !important;
width: 100% !important;
outline: none !important;
box-shadow: none !important;
border-radius: 8px 0 0 8px !important;
}
.dpi-vehicle-bar-search .dpi-filter-search::placeholder {
color: #aaa;
}
.dpi-vehicle-bar-search-btn {
display: flex;
align-items: center;
justify-content: center;
background: #FF0000;
border: none;
color: #fff;
padding: 10px 14px;
cursor: pointer;
transition: background 0.2s;
flex-shrink: 0;
border-radius: 0 8px 8px 0;
}
.dpi-vehicle-bar-search-btn:hover {
background: #cc0000;
} .dpi-vehiculier-section.dpi-hidden {
display: none;
} .dpi-filters-sidebar {
width: 260px;
min-width: 260px;
background: #fff;
border: 1px solid #e8e8e8;
border-radius: 12px;
padding: 20px;
position: sticky;
top: 100px;
max-height: calc(100vh - 120px);
overflow-y: auto;
}
.dpi-filters-sidebar::-webkit-scrollbar {
width: 4px;
}
.dpi-filters-sidebar::-webkit-scrollbar-track {
background: transparent;
}
.dpi-filters-sidebar::-webkit-scrollbar-thumb {
background: #ddd;
border-radius: 4px;
}
.dpi-filters-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 2px solid #f0f0f0;
}
.dpi-filters-header h3 {
margin: 0 !important;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
color: #000 !important;
}
.dpi-filters-close {
display: none;
background: none;
border: none;
font-size: 24px;
cursor: pointer;
padding: 0;
line-height: 1;
color: #666;
}
.dpi-filters-reset {
display: none;
width: 100%;
padding: 8px 16px !important;
margin-bottom: 16px;
background: #FF0000 !important;
border: none !important;
border-radius: 4px !important;
cursor: pointer;
font-family: "SF Pro Display", sans-serif !important;
font-size: 14px !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
color: #fff !important;
transition: background 0.2s;
}
.dpi-filters-reset:hover {
background: #cc0000 !important;
} .dpi-filter-group {
margin-bottom: 16px;
padding-bottom: 16px;
border-bottom: 1px solid #f0f0f0;
}
.dpi-filter-group:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
.dpi-filter-label {
display: block;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 12px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
letter-spacing: 0.3px !important;
color: #000 !important;
margin-bottom: 8px !important;
}
.dpi-filter-toggle-label {
cursor: pointer;
user-select: none;
display: flex;
justify-content: space-between;
align-items: center;
}
.dpi-toggle-icon {
font-size: 10px;
color: #999;
transition: transform 0.2s;
}
.dpi-filter-content {
transition: max-height 0.3s ease;
overflow-x: hidden;
} .dpi-filter-search {
width: 100%;
padding: 8px 12px;
border: 1px solid #ddd !important;
border-radius: 6px !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 13px !important;
box-sizing: border-box;
transition: border-color 0.2s;
}
.dpi-filter-search:focus {
border-color: #FF0000 !important;
outline: none !important;
box-shadow: 0 0 0 2px rgba(255, 0, 0, 0.1) !important;
} .dpi-filter-checkbox-list {
max-height: 240px;
overflow-y: auto;
}
.dpi-filter-checkbox-list::-webkit-scrollbar {
width: 3px;
}
.dpi-filter-checkbox-list::-webkit-scrollbar-thumb {
background: #ddd;
border-radius: 3px;
}
.dpi-filter-nested {
margin-left: 16px;
}
.dpi-filter-checkbox {
display: flex;
align-items: center;
gap: 6px;
padding: 4px 0;
font-family: "SF Pro Display", sans-serif !important;
font-size: 12px !important;
color: #444 !important;
cursor: pointer;
line-height: 1.3 !important;
}
.dpi-filter-checkbox:hover {
color: #000 !important;
}
.dpi-filter-checkbox input[type="checkbox"] {
margin: 0;
accent-color: #FF0000;
flex-shrink: 0;
}
.dpi-filter-count {
color: #aaa !important;
font-size: 11px !important;
flex-shrink: 0;
} .dpi-filter-categories {
display: flex;
flex-direction: column;
}
.dpi-cat-row {
display: flex;
align-items: center;
padding: 8px 4px;
border-bottom: 1px solid #f0f0f0;
border-radius: 4px;
transition: background 0.15s, opacity 0.2s;
}
.dpi-cat-row:hover {
background: #f8f8f8;
} .dpi-cat-row.dpi-cat-empty {
opacity: 0.35;
pointer-events: none;
cursor: default;
}
.dpi-cat-row.dpi-cat-empty .dpi-cat-name {
cursor: default;
}
.dpi-cat-name {
flex: 1;
font-family: "SF Pro Display", sans-serif !important;
font-size: 13px !important;
color: #444 !important;
cursor: pointer;
transition: color 0.15s, font-weight 0.15s;
padding: 2px 4px;
border-radius: 4px;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dpi-cat-name:hover {
color: #FF0000 !important;
}
.dpi-cat-name.active {
color: #FF0000 !important;
font-weight: 600 !important;
background: rgba(255, 0, 0, 0.06);
}
.dpi-cat-count {
color: #aaa !important;
font-size: 11px !important;
flex-shrink: 0;
margin-left: 4px;
margin-right: 4px;
transition: color 0.2s;
}
.dpi-cat-toggle {
background: none;
border: none;
padding: 4px;
cursor: pointer;
color: #999;
display: flex;
align-items: center;
justify-content: center;
transition: transform 0.2s ease;
flex-shrink: 0;
}
.dpi-cat-toggle:hover {
color: #666;
}
.dpi-cat-toggle.open {
transform: rotate(90deg);
}
.dpi-cat-children {
padding-left: 16px;
overflow: hidden;
max-height: 0;
transition: max-height 0.3s ease;
}
.dpi-cat-children.open {
max-height: 500px;
}
.dpi-cat-children .dpi-cat-name {
font-size: 12px !important;
}
.dpi-cat-children .dpi-cat-row {
padding: 6px 4px;
} .dpi-filter-brands {
display: flex;
flex-direction: column;
}
.dpi-brand-logo {
width: 24px;
height: 18px;
object-fit: contain;
flex-shrink: 0;
border-radius: 3px;
margin-right: 2px;
}
.dpi-brand-name {
flex: 1;
font-family: "SF Pro Display", sans-serif !important;
font-size: 13px !important;
color: #444 !important;
cursor: pointer;
transition: color 0.15s, font-weight 0.15s;
padding: 2px 4px;
border-radius: 4px;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dpi-brand-name:hover {
color: #FF0000 !important;
}
.dpi-brand-name.active {
color: #FF0000 !important;
font-weight: 600 !important;
background: rgba(255, 0, 0, 0.06);
}
.dpi-brand-count {
color: #aaa !important;
font-size: 11px !important;
flex-shrink: 0;
margin-left: 4px;
margin-right: 4px;
transition: color 0.2s;
} .dpi-price-range {
padding: 4px 0;
}
.dpi-price-inputs {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 10px;
}
.dpi-price-inputs input[type="number"] {
width: 80px;
padding: 6px 8px;
border: 1px solid #ddd !important;
border-radius: 6px !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 13px !important;
text-align: center;
}
.dpi-price-inputs input[type="number"]:focus {
border-color: #FF0000 !important;
outline: none !important;
box-shadow: 0 0 0 2px rgba(255, 0, 0, 0.1) !important;
}
.dpi-price-separator {
color: #999;
}
.dpi-price-currency {
color: #666;
font-size: 13px !important;
} .dpi-range-slider {
position: relative;
height: 30px;
}
.dpi-range-slider input[type="range"] {
position: absolute;
width: 100%;
top: 0;
height: 30px;
margin: 0;
pointer-events: none;
-webkit-appearance: none;
appearance: none;
background: transparent;
}
.dpi-range-slider input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 18px;
height: 18px;
background: #FF0000;
border-radius: 50%;
cursor: pointer;
pointer-events: all;
border: 2px solid #fff;
box-shadow: 0 1px 4px rgba(0,0,0,0.25);
margin-top: -7.5px;
}
.dpi-range-slider input[type="range"]::-moz-range-thumb {
width: 18px;
height: 18px;
background: #FF0000;
border-radius: 50%;
cursor: pointer;
pointer-events: all;
border: 2px solid #fff;
box-shadow: 0 1px 4px rgba(0,0,0,0.25);
}
.dpi-range-slider input[type="range"]::-webkit-slider-runnable-track {
height: 3px;
background: #e0e0e0;
border-radius: 2px;
margin-top: 0;
}
.dpi-range-slider input[type="range"]::-moz-range-track {
height: 3px;
background: #e0e0e0;
border-radius: 2px;
border: none;
} .dpi-filter-content select {
width: 100%;
padding: 8px 10px;
border: 1px solid #ddd !important;
border-radius: 6px !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 12px !important;
margin-bottom: 8px;
background: #fff;
color: #333 !important;
}
.dpi-filter-content select:focus {
border-color: #FF0000 !important;
outline: none !important;
box-shadow: 0 0 0 2px rgba(255, 0, 0, 0.1) !important;
}
.dpi-filter-content select:disabled {
background: #f5f5f5;
color: #999 !important;
} .dpi-filter-spec-select {
width: 100%;
padding: 8px 10px;
border: 1px solid #ddd !important;
border-radius: 6px !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 12px !important;
} .dpi-products-container {
flex: 1;
min-width: 0;
position: relative;
} .dpi-loading-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(255, 255, 255, 0.75);
display: flex;
align-items: center;
justify-content: center;
z-index: 10;
pointer-events: all;
border-radius: inherit;
}
.dpi-spinner {
width: 32px;
height: 32px;
border: 3px solid #e5e5e5;
border-top-color: #FF0000;
border-radius: 50%;
animation: dpi-spin 0.7s linear infinite;
}
.dpi-spinner-sm {
width: 18px;
height: 18px;
border-width: 2px;
} .dpi-vehiculier-select.dpi-select-loading {
pointer-events: none;
opacity: 0.6;
background-image: none !important;
} .dpi-category-grid-section.dpi-is-loading {
position: relative;
min-height: 200px;
}
.dpi-category-grid-section.dpi-is-loading .dpi-category-grid {
opacity: 0.4;
pointer-events: none;
transition: opacity 0.2s;
} .dpi-products-container.dpi-is-loading {
position: relative;
min-height: 200px;
}
.dpi-filters-sidebar.dpi-locked {
pointer-events: none;
opacity: 0.6;
transition: opacity 0.2s;
}
.dpi-vehiculier-wrapper.dpi-locked {
pointer-events: none;
opacity: 0.6;
transition: opacity 0.2s;
} .dpi-products-topbar {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
padding: 10px 0;
}
.dpi-products-count {
font-family: "SF Pro Display", sans-serif !important;
font-size: 14px !important;
color: #666 !important;
}
.dpi-products-topbar-right {
display: flex;
align-items: center;
gap: 10px;
}
.dpi-sort-select {
padding: 6px 10px;
border: 1px solid #ddd !important;
border-radius: 6px !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 13px !important;
background: #fff;
}
.dpi-sort-select:focus {
border-color: #FF0000 !important;
outline: none !important;
}
.dpi-filters-toggle {
display: none;
padding: 8px 20px !important;
background: #FF0000 !important;
color: #fff !important;
border: none !important;
border-radius: 100px !important;
cursor: pointer;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 11px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
}
.dpi-filters-toggle:hover {
background: #cc0000 !important;
} .dpi-products-grid {
display: grid;
grid-template-columns: repeat(var(--dpi-cols, 4), 1fr);
gap: 20px;
} .dpi-product-card {
background: #fff !important;
border: 1px solid #e8e8e8 !important;
border-radius: 10px !important;
overflow: hidden;
transition: box-shadow 0.2s, transform 0.2s;
display: flex;
flex-direction: column;
}
.dpi-product-card:hover {
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
transform: translateY(-2px);
}
.dpi-product-link {
text-decoration: none !important;
color: inherit !important;
display: flex;
flex-direction: column;
flex: 1;
}
.dpi-product-image {
position: relative;
padding-top: 100%;
overflow: hidden;
}
.dpi-product-image > img,
.dpi-product-image > .wp-post-image {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
transition: transform 0.3s;
}
.dpi-product-card:hover .dpi-product-image > img,
.dpi-product-card:hover .dpi-product-image > .wp-post-image {
transform: scale(1.05);
} .dpi-brand-badge {
position: absolute !important;
top: 8px !important;
left: 8px !important;
z-index: 2 !important;
background: rgba(255, 255, 255, 0.92) !important;
border-radius: 6px !important;
padding: 4px 6px !important;
line-height: 1 !important;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1) !important;
}
.dpi-brand-badge img {
position: static !important;
width: auto !important;
height: 28px !important;
max-width: 80px !important;
padding-top: 0 !important;
object-fit: contain !important;
display: block !important;
}
.dpi-brand-badge-text {
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 10px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
color: #333 !important;
letter-spacing: 0.5px !important;
padding: 5px 10px !important;
}
.dpi-product-title {
font-family: "SF Pro Display", -apple-system, sans-serif !important;
font-size: 18px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
color: #000 !important;
margin: 12px 14px 4px !important;
line-height: 1.3 !important;
text-align: center !important;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.dpi-product-brand {
display: block !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 12px !important;
font-weight: 400 !important;
color: #888 !important;
margin: 0 14px 6px !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
text-align: center !important;
}
.dpi-product-price {
font-family: "SF Pro Display", -apple-system, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
color: #FF0000 !important;
margin: 0 14px 12px !important;
text-align: center !important;
}
.dpi-product-price del {
color: #999 !important;
font-size: 13px !important;
font-weight: 300 !important;
}
.dpi-product-price ins {
text-decoration: none !important;
color: #FF0000 !important;
}
.dpi-product-price-na {
color: #999 !important;
font-size: 13px !important;
font-style: italic !important;
}
.dpi-product-info {
display: flex;
flex-direction: column;
align-items: center;
padding: 0 0 14px;
flex: 1;
}
.dpi-product-cat {
font-family: "SF Pro Display", sans-serif !important;
font-size: 11px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
color: #999 !important;
margin: 10px 14px 2px !important;
text-align: center !important;
}
.dpi-product-sku {
font-family: "SF Pro Display", sans-serif !important;
font-size: 11px !important;
font-weight: 400 !important;
color: #aaa !important;
margin: 2px 14px 4px !important;
text-align: center !important;
}
.dpi-product-stock {
font-family: "SF Pro Display", sans-serif !important;
font-size: 11px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.3px !important;
margin: 4px 14px 0 !important;
text-align: center !important;
}
.dpi-product-stock.in-stock {
color: #22c55e !important;
}
.dpi-product-stock.out-of-stock {
color: #ef4444 !important;
}
.dpi-product-img-placeholder {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 48px !important;
color: #ddd !important;
background: #f5f5f5 !important;
}
.dpi-product-add-to-cart {
display: block !important;
text-align: center !important;
padding: 12px 24px !important;
margin: 0 14px 14px !important;
background: #FF0000 !important;
color: #fff !important;
border: none !important;
border-radius: 100px !important;
font-family: Neuropolitical, sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
cursor: pointer;
transition: background 0.2s;
text-decoration: none !important;
}
.dpi-product-add-to-cart:hover {
background: #cc0000 !important;
color: #fff !important;
} .dpi-products-loading {
grid-column: 1 / -1;
text-align: center;
padding: 60px 20px;
color: #bbb !important;
font-size: 13px !important;
}
@keyframes dpi-spin {
to { transform: rotate(360deg); }
} .dpi-no-products {
grid-column: 1 / -1;
text-align: center;
padding: 60px 20px;
color: #999 !important;
font-size: 15px !important;
} .dpi-products-pagination {
text-align: center;
margin-top: 24px;
}
.dpi-load-more-btn {
display: inline-block;
padding: 12px 32px !important;
background: #FF0000 !important;
color: #fff !important;
border: none !important;
border-radius: 100px !important;
cursor: pointer;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
transition: background 0.2s;
}
.dpi-load-more-btn:hover {
background: #cc0000 !important;
}
.dpi-load-more-btn:disabled {
opacity: 0.6;
cursor: not-allowed;
}
.dpi-load-more-btn.loading::after {
content: '';
display: inline-block;
width: 14px;
height: 14px;
margin-left: 8px;
border: 2px solid transparent;
border-top-color: #fff;
border-radius: 50%;
animation: dpi-spin 0.8s linear infinite;
vertical-align: middle;
} .dpi-pagination-numbers {
display: flex;
justify-content: center;
gap: 6px;
flex-wrap: wrap;
}
.dpi-pagination-numbers a,
.dpi-pagination-numbers span {
display: inline-block;
padding: 8px 14px;
border: 1px solid #ddd !important;
border-radius: 6px !important;
font-size: 13px !important;
text-decoration: none !important;
color: #333 !important;
cursor: pointer;
transition: background 0.2s;
}
.dpi-pagination-numbers a:hover {
background: #f5f5f5 !important;
}
.dpi-pagination-numbers .dpi-page-current {
background: #FF0000 !important;
color: #fff !important;
border-color: #FF0000 !important;
} .dpi-filters-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
z-index: 99998;
} @media screen and (max-width: 991px) {
.dpi-products-grid {
--dpi-cols: 3 !important;
grid-template-columns: repeat(3, 1fr);
}
}
@media screen and (max-width: 768px) {
.dpi-product-grid-wrapper {
flex-direction: column;
padding: 0 16px;
}
.dpi-filters-sidebar {
display: none;
position: fixed;
top: 0;
left: 0;
width: 85%;
max-width: 320px;
height: 100%;
max-height: 100vh;
z-index: 99999;
border-radius: 0;
border: none;
box-shadow: 4px 0 20px rgba(0, 0, 0, 0.2);
}
.dpi-filters-sidebar.dpi-sidebar-open {
display: block;
}
.dpi-filters-close {
display: block;
}
.dpi-filters-toggle {
display: inline-block;
}
.dpi-filters-overlay.active {
display: block;
}
.dpi-products-grid {
--dpi-cols: 2 !important;
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
.dpi-product-title {
font-size: 14px !important;
}
.dpi-product-brand {
font-size: 11px !important;
}
.dpi-product-price {
font-size: 14px !important;
}
.dpi-product-add-to-cart {
margin: 0 10px 10px !important;
padding: 8px 10px !important;
font-size: 10px !important;
}
.dpi-vehiculier-section {
padding: 24px 16px 32px;
}
.dpi-vehiculier-title h2 {
font-size: 22px !important;
}
.dpi-vehiculier-wrapper {
padding: 18px 14px;
}
.dpi-vehiculier-row {
flex-direction: column;
gap: 10px;
}
.dpi-vehiculier-selects {
flex-direction: column;
gap: 8px;
}
.dpi-vehiculier-btn {
width: 100%;
font-size: 12px !important;
padding: 12px !important;
}
.dpi-vehiculier-separator {
margin: 12px 0;
}
.dpi-vehicle-bar-inner {
flex-wrap: wrap;
}
.dpi-vehicle-bar-right {
max-width: none;
width: 100%;
}
.dpi-vehicle-bar-label {
display: none;
}
}
@media screen and (max-width: 480px) {
.dpi-products-grid {
--dpi-cols: 1 !important;
grid-template-columns: 1fr;
}
.dpi-products-topbar {
flex-direction: column;
gap: 10px;
align-items: stretch;
}
.dpi-products-topbar-right {
justify-content: space-between;
}
.dpi-vehiculier-title h2 {
font-size: 18px !important;
}
.dpi-vehicle-bar {
padding: 8px 12px;
}
.dpi-vehicle-bar-left {
gap: 6px;
}
.dpi-vehicle-bar-value {
font-size: 12px;
}
} .dpi-category-grid-section {
max-width: 1440px;
margin: 0 auto;
padding: 28px 24px 24px;
} .dpi-category-grid-header {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 20px;
}
.dpi-category-grid-title {
margin: 0 !important;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 28px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
color: #000 !important;
line-height: 1.2 !important;
}
.dpi-category-grid-title span {
color: #FF0000 !important;
} .dpi-category-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
padding: 0;
} .dpi-category-card {
position: relative;
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 12px;
padding: 28px 24px;
cursor: pointer;
transition: all 0.2s ease;
display: flex;
flex-direction: column;
gap: 6px;
}
.dpi-category-card:hover {
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
border-color: rgba(255, 0, 0, 0.3);
} .dpi-category-card.dpi-selected {
border-color: #FF0000;
box-shadow: 0 0 0 1px #FF0000, 0 4px 12px rgba(255, 0, 0, 0.15);
} .dpi-category-card-check {
display: none;
position: absolute;
top: 10px;
right: 10px;
width: 22px;
height: 22px;
background: #FF0000;
border-radius: 50%;
align-items: center;
justify-content: center;
z-index: 2;
}
.dpi-category-card.dpi-selected .dpi-category-card-check {
display: flex;
}
.dpi-category-card-check svg {
width: 14px;
height: 14px;
} .dpi-category-card-icon-wrap {
width: 125px;
height: 125px;
margin-bottom: 12px;
display: flex;
align-items: center;
justify-content: center;
}
.dpi-category-card-icon-wrap svg {
width: 52px;
height: 52px;
color: #FF0000;
}
.dpi-category-card-img {
width: 125px;
height: 125px;
object-fit: contain;
border-radius: 6px;
} .dpi-category-card-icon-wrap svg path,
.dpi-category-card-icon-wrap svg circle,
.dpi-category-card-icon-wrap svg rect,
.dpi-category-card-icon-wrap svg polygon,
.dpi-category-card-icon-wrap svg line,
.dpi-category-card-icon-wrap svg polyline,
.dpi-category-card-icon-wrap svg ellipse {
fill: #FF0000 !important;
stroke: none !important;
} .dpi-category-card.dpi-cat-empty {
opacity: 0.35;
pointer-events: none;
cursor: default;
} .dpi-category-card-info {
display: flex;
flex-direction: column;
gap: 2px;
}
.dpi-category-card-info h4 {
margin: 0 !important;
font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.3px !important;
color: #000 !important;
line-height: 1.3 !important;
}
.dpi-category-card-desc {
margin: 4px 0 0 !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 12px !important;
color: #888 !important;
line-height: 1.4 !important;
font-weight: 400 !important;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.dpi-category-card-count {
font-size: 13px;
color: #FF0000;
font-family: "SF Pro Display", sans-serif;
font-weight: 500;
margin-top: 8px;
display: flex;
align-items: center;
gap: 6px;
}
.dpi-category-card-count::after {
content: '';
display: inline-block;
width: 20px;
height: 20px;
background: #FF0000;
border-radius: 50%;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
background-size: 12px 12px;
flex-shrink: 0;
} .dpi-category-back-card {
position: relative;
background: #f9f9f9;
border: 1px solid #e5e5e5;
border-radius: 12px;
padding: 28px 24px;
cursor: pointer;
transition: all 0.2s ease;
display: flex;
flex-direction: column;
gap: 6px;
}
.dpi-category-back-card:hover {
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
border-color: rgba(255, 0, 0, 0.3);
}
.dpi-category-back-card .dpi-category-card-icon-wrap svg {
color: #999;
}
.dpi-category-back-card .dpi-category-card-icon-wrap svg path,
.dpi-category-back-card .dpi-category-card-icon-wrap svg circle,
.dpi-category-back-card .dpi-category-card-icon-wrap svg rect,
.dpi-category-back-card .dpi-category-card-icon-wrap svg polygon,
.dpi-category-back-card .dpi-category-card-icon-wrap svg line,
.dpi-category-back-card .dpi-category-card-icon-wrap svg polyline {
fill: none !important;
stroke: #999 !important;
}
.dpi-category-back-card:hover .dpi-category-card-icon-wrap svg path,
.dpi-category-back-card:hover .dpi-category-card-icon-wrap svg circle,
.dpi-category-back-card:hover .dpi-category-card-icon-wrap svg rect,
.dpi-category-back-card:hover .dpi-category-card-icon-wrap svg polygon,
.dpi-category-back-card:hover .dpi-category-card-icon-wrap svg line,
.dpi-category-back-card:hover .dpi-category-card-icon-wrap svg polyline {
stroke: #FF0000 !important;
}
.dpi-category-back-card .dpi-category-card-info h4 {
color: #666 !important;
}
.dpi-category-back-card:hover .dpi-category-card-info h4 {
color: #FF0000 !important;
} .dpi-category-viewall-card {
position: relative;
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 12px;
padding: 28px 24px;
cursor: pointer;
transition: all 0.2s ease;
display: flex;
flex-direction: column;
gap: 6px;
}
.dpi-category-viewall-card:hover {
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
border-color: rgba(255, 0, 0, 0.3);
}
.dpi-category-viewall-card.dpi-selected {
border-color: #FF0000;
box-shadow: 0 0 0 1px #FF0000, 0 4px 12px rgba(255, 0, 0, 0.15);
}
.dpi-category-viewall-card .dpi-category-card-check {
display: none;
position: absolute;
top: 10px;
right: 10px;
width: 22px;
height: 22px;
background: #FF0000;
border-radius: 50%;
align-items: center;
justify-content: center;
z-index: 2;
}
.dpi-category-viewall-card.dpi-selected .dpi-category-card-check {
display: flex;
}
.dpi-category-viewall-card .dpi-category-card-check svg {
width: 14px;
height: 14px;
} @media (max-width: 1024px) {
.dpi-category-grid {
grid-template-columns: repeat(3, 1fr);
gap: 14px;
}
.dpi-category-grid-title {
font-size: 24px !important;
}
.dpi-category-card {
padding: 20px 16px;
}
} @media (max-width: 768px) {
.dpi-category-grid-section {
padding: 20px 16px;
}
.dpi-category-grid {
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
.dpi-category-grid-title {
font-size: 20px !important;
}
.dpi-category-card {
padding: 16px 14px;
border-radius: 10px;
}
.dpi-category-card-icon-wrap {
width: 80px;
height: 80px;
}
.dpi-category-card-icon-wrap svg {
width: 36px;
height: 36px;
}
.dpi-category-card-img {
width: 80px;
height: 80px;
}
.dpi-category-card-info h4 {
font-size: 12px !important;
}
.dpi-category-card-desc {
font-size: 11px !important;
}
.dpi-category-grid-header {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
} @media (max-width: 480px) {
.dpi-category-grid {
grid-template-columns: repeat(2, 1fr);
gap: 10px;
}
.dpi-category-card {
padding: 14px 12px;
border-radius: 8px;
}
.dpi-category-card-icon-wrap {
width: 60px;
height: 60px;
}
.dpi-category-card-icon-wrap svg {
width: 32px;
height: 32px;
}
.dpi-category-card-img {
width: 60px;
height: 60px;
}
.dpi-category-card-info h4 {
font-size: 11px !important;
}
.dpi-category-card-desc {
display: none;
}
}  .dpi-equipment-wrapper {
width: 100%;
} .dpi-equip-grid-section {
max-width: 1440px;
margin: 0 auto;
padding: 32px 24px 28px;
position: relative;
}
.dpi-equip-grid-header {
margin-bottom: 20px;
}
.dpi-equip-grid-title {
margin: 0 !important;
font-family: Neuropolitical, "SF Pro Display", sans-serif !important;
font-size: 28px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
color: #000 !important;
line-height: 1.2 !important;
}
.dpi-equip-grid-title span {
color: #FF0000 !important;
} .dpi-equip-grid {
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 16px;
} .dpi-equip-card {
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 12px;
overflow: hidden;
cursor: pointer;
transition: all 0.2s ease;
}
.dpi-equip-card:hover {
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
border-color: rgba(255, 0, 0, 0.3);
transform: translateY(-2px);
}
.dpi-equip-card.dpi-selected {
border-color: #FF0000;
box-shadow: 0 0 0 1px #FF0000, 0 4px 12px rgba(255, 0, 0, 0.15);
} .dpi-equip-card-image {
width: 100%;
aspect-ratio: 1;
overflow: hidden;
background: #f8f8f8;
display: flex;
align-items: center;
justify-content: center;
}
.dpi-equip-card-image img {
width: 100%;
height: 100%;
object-fit: contain;
transition: transform 0.3s;
}
.dpi-equip-card:hover .dpi-equip-card-image img {
transform: scale(1.05);
} .dpi-equip-card-placeholder {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: #f0f0f0;
} .dpi-equip-card-name {
padding: 12px 10px;
text-align: center;
font-family: "SF Pro Display", -apple-system, sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
color: #333 !important;
text-transform: uppercase;
letter-spacing: 0.3px;
line-height: 1.3;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} .dpi-equip-back-card {
background: #f9f9f9;
border: 1px solid #e5e5e5;
border-radius: 12px;
overflow: hidden;
cursor: pointer;
transition: all 0.2s ease;
}
.dpi-equip-back-card:hover {
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
border-color: rgba(255, 0, 0, 0.3);
}
.dpi-equip-back-card .dpi-equip-card-image {
background: #f2f2f2;
}
.dpi-equip-back-card .dpi-equip-card-image svg {
width: 48px;
height: 48px;
color: #999;
transition: color 0.2s;
}
.dpi-equip-back-card:hover .dpi-equip-card-image svg {
color: #FF0000;
}
.dpi-equip-back-card .dpi-equip-card-name {
color: #666 !important;
}
.dpi-equip-back-card:hover .dpi-equip-card-name {
color: #FF0000 !important;
} .dpi-equip-grid-section.dpi-is-loading {
min-height: 200px;
}
.dpi-equip-grid-section.dpi-is-loading .dpi-equip-grid {
opacity: 0.4;
pointer-events: none;
transition: opacity 0.2s;
} .dpi-equip-products-hidden {
display: none !important;
} .dpi-equip-search-bar {
display: flex;
align-items: center;
background: #f5f5f5;
border: 1px solid #e5e5e5;
border-radius: 8px;
overflow: hidden;
transition: border-color 0.2s;
max-width: 280px;
}
.dpi-equip-search-bar:focus-within {
border-color: #FF0000;
background: #fff;
}
.dpi-equip-search-bar .dpi-filter-search {
border: none !important;
background: none !important;
padding: 7px 12px !important;
margin: 0 !important;
font-family: "SF Pro Display", sans-serif !important;
font-size: 13px !important;
color: #333 !important;
width: 100% !important;
outline: none !important;
box-shadow: none !important;
}
.dpi-equip-search-bar .dpi-filter-search::placeholder {
color: #aaa;
}
.dpi-equip-search-btn {
display: flex;
align-items: center;
justify-content: center;
background: #FF0000;
border: none;
color: #fff;
padding: 8px 12px;
cursor: pointer;
transition: background 0.2s;
flex-shrink: 0;
}
.dpi-equip-search-btn:hover {
background: #cc0000;
} @media (max-width: 1200px) {
.dpi-equip-grid {
grid-template-columns: repeat(5, 1fr);
}
}
@media (max-width: 1024px) {
.dpi-equip-grid {
grid-template-columns: repeat(4, 1fr);
gap: 14px;
}
.dpi-equip-grid-title {
font-size: 24px !important;
}
}
@media (max-width: 768px) {
.dpi-equip-grid-section {
padding: 24px 16px;
}
.dpi-equip-grid {
grid-template-columns: repeat(3, 1fr);
gap: 12px;
}
.dpi-equip-grid-title {
font-size: 20px !important;
}
.dpi-equip-card-name {
font-size: 11px !important;
padding: 8px 6px;
}
.dpi-equip-search-bar {
max-width: none;
flex: 1;
}
}
@media (max-width: 480px) {
.dpi-equip-grid {
grid-template-columns: repeat(2, 1fr);
gap: 10px;
}
.dpi-equip-card {
border-radius: 8px;
}
.dpi-equip-card-name {
font-size: 10px !important;
padding: 6px 4px;
}
} .dpi-infinite-sentinel {
height: 1px;
width: 100%;
}
.dpi-infinite-loading {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 32px 0;
font-family: "SF Pro Display", sans-serif;
font-size: 13px;
color: #999;
} .dpi-sidebar-subcategories {
margin: 15px 0 25px 0;
padding-bottom: 20px;
border-bottom: 1px solid #f0f0f0;
}
.dpi-sidebar-subcat-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 12px;
}
.dpi-sidebar-subcat-item {
display: flex;
justify-content: space-between;
align-items: flex-start;
font-family: "SF Pro Display", sans-serif;
font-size: 14px;
cursor: pointer;
color: #444;
transition: all 0.2s ease;
line-height: 1.4;
}
.dpi-subcat-name {
flex: 1;
padding-right: 10px;
word-break: break-word;
overflow-wrap: break-word;
}
.dpi-subcat-count {
color: #999;
font-size: 13px;
white-space: nowrap;
flex-shrink: 0;
}
.dpi-sidebar-subcat-item:hover {
color: #FF0000;
}
.dpi-sidebar-subcat-item.active {
color: #FF0000;
font-weight: 700;
}
.dpi-sidebar-subcat-item.active .dpi-subcat-count {
color: #FF0000;
font-weight: 700;
}
.dpi-sidebar-subcat-child {
padding-left: 24px;
}@media screen and (max-width: 768px) { .dpi-vehiculier-section {
padding: 20px 14px 24px !important;
}
.dpi-vehiculier-title {
margin-bottom: 12px;
text-align: center;
}
.dpi-vehiculier-title h2 {
font-size: 20px !important;
letter-spacing: 0.5px !important;
}
.dpi-vehiculier-title p {
font-size: 13px !important;
}
.dpi-vehiculier-wrapper {
padding: 14px 12px !important;
border-radius: 10px;
}
.dpi-vehiculier-row {
flex-direction: column !important;
gap: 8px !important;
}
.dpi-vehiculier-selects {
flex-direction: column !important;
gap: 8px !important;
width: 100% !important;
}
.dpi-vehiculier-select,
.dpi-searchable-input {
width: 100% !important;
min-width: unset !important;
padding: 14px 36px 14px 14px !important;
font-size: 16px !important; border-radius: 10px !important;
}
.dpi-searchable-wrap {
width: 100% !important;
}
.dpi-searchable-dropdown {
max-height: 200px !important;
width: 100% !important;
left: 0 !important;
right: 0 !important;
}
.dpi-vehiculier-btn {
width: 100% !important;
padding: 14px !important;
font-size: 13px !important;
border-radius: 10px !important;
min-height: 48px; }
.dpi-vehiculier-separator {
margin: 10px 0 !important;
}
.dpi-vehiculier-separator span {
font-size: 12px !important;
} .dpi-vehicle-bar {
padding: 8px 12px !important;
}
.dpi-vehicle-bar-inner {
flex-wrap: wrap !important;
gap: 8px !important;
}
.dpi-vehicle-bar-left {
width: 100% !important;
justify-content: space-between;
gap: 6px !important;
}
.dpi-vehicle-bar-icon {
width: 32px !important;
height: 32px !important;
}
.dpi-vehicle-bar-value {
font-size: 13px !important;
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dpi-vehicle-bar-label {
display: none !important;
}
.dpi-vehicle-bar-action {
padding: 6px 12px !important;
font-size: 12px !important;
min-height: 36px;
}
.dpi-vehicle-bar-delete {
min-width: 36px;
min-height: 36px;
display: flex !important;
align-items: center;
justify-content: center;
}
.dpi-vehicle-bar-right {
width: 100% !important;
max-width: none !important;
min-width: unset !important;
}
.dpi-vehicle-bar-search {
border-radius: 10px !important;
}
.dpi-vehicle-bar-search input {
font-size: 16px !important; padding: 10px 12px !important;
} .dpi-product-grid-wrapper {
flex-direction: column !important;
padding: 12px 12px 40px !important;
gap: 0 !important;
} .dpi-filters-sidebar {
display: none !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 88% !important;
max-width: 340px !important;
height: 100vh !important;
height: 100dvh !important; max-height: 100vh !important;
max-height: 100dvh !important;
z-index: 99999 !important;
border-radius: 0 !important;
border: none !important;
box-shadow: 4px 0 24px rgba(0, 0, 0, 0.25) !important;
padding: 16px !important;
overflow-y: auto !important;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
}
.dpi-filters-sidebar.dpi-sidebar-open {
display: block !important;
}
.dpi-filters-close {
display: flex !important;
align-items: center;
justify-content: center;
width: 40px !important;
height: 40px !important;
font-size: 28px !important;
border-radius: 50%;
background: #f5f5f5 !important;
border: none;
color: #333 !important;
cursor: pointer;
min-height: 44px;
min-width: 44px;
}
.dpi-filters-header {
position: sticky;
top: 0;
background: #fff;
z-index: 2;
padding-bottom: 12px !important;
margin-bottom: 12px !important;
}
.dpi-filters-overlay.active {
display: block !important;
} .dpi-filters-toggle {
display: none !important; align-items: center;
gap: 6px;
padding: 10px 18px !important;
min-height: 44px; font-size: 12px !important;
border-radius: 100px !important;
} .dpi-products-topbar {
flex-wrap: wrap;
gap: 8px !important;
padding: 8px 0 !important;
}
.dpi-products-count {
font-size: 13px !important;
width: 100%;
}
.dpi-products-topbar-right {
width: 100%;
display: flex !important;
justify-content: space-between !important;
gap: 8px !important;
}
.dpi-sort-select {
flex: 1;
font-size: 13px !important;
padding: 10px 8px !important;
min-height: 44px; border-radius: 8px !important;
} .dpi-products-grid {
--dpi-cols: 2 !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 10px !important;
} .dpi-product-card {
border-radius: 8px !important;
}
.dpi-product-card:hover {
transform: none !important; }
.dpi-product-title {
font-size: 13px !important;
margin: 8px 10px 2px !important;
-webkit-line-clamp: 2;
}
.dpi-product-brand {
font-size: 10px !important;
margin: 0 10px 4px !important;
}
.dpi-product-price {
font-size: 14px !important;
margin: 0 10px 8px !important;
}
.dpi-product-price del {
font-size: 11px !important;
}
.dpi-product-cat {
font-size: 10px !important;
margin: 6px 10px 0 !important;
}
.dpi-product-sku {
font-size: 10px !important;
margin: 1px 10px 2px !important;
}
.dpi-product-stock {
font-size: 10px !important;
margin: 2px 10px 0 !important;
}
.dpi-product-info {
padding: 0 0 10px !important;
}
.dpi-product-add-to-cart {
margin: 0 8px 8px !important;
padding: 10px 12px !important;
font-size: 11px !important;
min-height: 44px; border-radius: 100px !important;
}
.dpi-brand-badge {
top: 6px !important;
left: 6px !important;
padding: 3px 5px !important;
}
.dpi-brand-badge img {
height: 20px !important;
max-width: 60px !important;
}
.dpi-brand-badge-text {
font-size: 8px !important;
padding: 3px 6px !important;
} .dpi-category-grid-section {
padding: 16px 12px 16px !important;
}
.dpi-category-grid-header {
margin-bottom: 12px !important;
gap: 10px !important;
}
.dpi-category-grid-title {
font-size: 20px !important;
}
.dpi-category-grid {
grid-template-columns: repeat(2, 1fr) !important;
gap: 10px !important;
}
.dpi-category-card {
padding: 14px 12px !important;
border-radius: 10px !important;
gap: 4px !important;
}
.dpi-category-card:hover {
transform: none !important;
}
.dpi-category-card-icon-wrap {
width: 70px !important;
height: 70px !important;
margin-bottom: 6px !important;
}
.dpi-category-card-icon-wrap svg {
width: 36px !important;
height: 36px !important;
}
.dpi-category-card-img {
width: 70px !important;
height: 70px !important;
}
.dpi-category-card-info h4 {
font-size: 12px !important;
letter-spacing: 0.2px !important;
}
.dpi-category-card-desc {
font-size: 11px !important;
-webkit-line-clamp: 1 !important;
}
.dpi-category-card-count {
font-size: 11px !important;
margin-top: 4px !important;
}
.dpi-category-card-check {
top: 6px !important;
right: 6px !important;
width: 18px !important;
height: 18px !important;
}
.dpi-category-card-check svg {
width: 12px !important;
height: 12px !important;
} .dpi-equip-grid-section {
padding: 20px 12px 16px !important;
}
.dpi-equip-grid-title {
font-size: 20px !important;
}
.dpi-equip-grid {
grid-template-columns: repeat(3, 1fr) !important;
gap: 10px !important;
}
.dpi-equip-card {
border-radius: 8px !important;
}
.dpi-equip-card:hover {
transform: none !important;
}
.dpi-equip-card-name {
padding: 8px 6px !important;
font-size: 11px !important;
}
.dpi-equip-search-bar {
max-width: none !important;
flex: 1 !important;
} .dpi-products-pagination {
padding: 16px 0 !important;
}
.dpi-pagination-numbers {
gap: 4px !important;
}
.dpi-pagination-numbers a,
.dpi-pagination-numbers span {
padding: 8px 12px !important;
font-size: 13px !important;
min-width: 40px;
min-height: 40px;
display: inline-flex !important;
align-items: center;
justify-content: center;
}
.dpi-load-more-btn {
width: 100% !important;
padding: 14px 24px !important;
min-height: 48px;
font-size: 13px !important;
} .dpi-sidebar-subcategories {
margin: 12px 0 16px !important;
}
.dpi-sidebar-subcat-item {
font-size: 14px !important;
padding: 8px 0 !important;
min-height: 44px;
display: flex !important;
align-items: center !important;
}
.dpi-sidebar-subcat-list {
gap: 4px !important;
} .dpi-filter-group {
margin-bottom: 14px !important;
padding-bottom: 14px !important;
}
.dpi-filter-label {
font-size: 13px !important;
margin-bottom: 10px !important;
}
.dpi-filter-toggle-label {
min-height: 44px;
display: flex !important;
align-items: center;
padding: 4px 0 !important;
}
.dpi-filter-checkbox {
padding: 6px 0 !important;
font-size: 13px !important;
min-height: 40px;
display: flex !important;
align-items: center !important;
}
.dpi-filter-checkbox input[type="checkbox"] {
width: 20px !important;
height: 20px !important;
min-width: 20px;
}
.dpi-filter-search {
padding: 10px 12px !important;
font-size: 16px !important; min-height: 44px;
}
.dpi-filter-content select {
padding: 10px !important;
font-size: 14px !important;
min-height: 44px;
} .dpi-cat-row {
padding: 10px 4px !important;
min-height: 44px;
}
.dpi-cat-name {
font-size: 14px !important;
padding: 4px !important;
}
.dpi-cat-toggle {
padding: 8px !important;
min-width: 36px;
min-height: 36px;
} .dpi-loading-overlay {
border-radius: 8px;
} .dpi-back-all-cats {
font-size: 13px !important;
padding: 10px 14px !important;
min-height: 44px;
}
} @media screen and (max-width: 480px) { .dpi-products-grid {
--dpi-cols: 2 !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 8px !important;
} .dpi-vehiculier-title h2 {
font-size: 17px !important;
}
.dpi-vehiculier-title p {
font-size: 12px !important;
} .dpi-vehicle-bar {
padding: 6px 10px !important;
}
.dpi-vehicle-bar-icon {
width: 28px !important;
height: 28px !important;
}
.dpi-vehicle-bar-value {
font-size: 12px !important;
}
.dpi-vehicle-bar-action {
font-size: 11px !important;
padding: 4px 8px !important;
} .dpi-product-card {
border-radius: 6px !important;
}
.dpi-product-title {
font-size: 12px !important;
margin: 6px 8px 2px !important;
}
.dpi-product-brand {
font-size: 9px !important;
margin: 0 8px 3px !important;
}
.dpi-product-price {
font-size: 13px !important;
margin: 0 8px 6px !important;
}
.dpi-product-cat {
font-size: 9px !important;
margin: 4px 8px 0 !important;
}
.dpi-product-sku {
display: none !important; }
.dpi-product-add-to-cart {
margin: 0 6px 6px !important;
padding: 8px 8px !important;
font-size: 10px !important;
}
.dpi-brand-badge {
top: 4px !important;
left: 4px !important;
padding: 2px 4px !important;
}
.dpi-brand-badge img {
height: 16px !important;
max-width: 50px !important;
} .dpi-category-grid-section {
padding: 12px 10px 12px !important;
}
.dpi-category-grid-title {
font-size: 17px !important;
}
.dpi-category-grid {
gap: 8px !important;
}
.dpi-category-card {
padding: 10px 8px !important;
border-radius: 8px !important;
}
.dpi-category-card-icon-wrap {
width: 56px !important;
height: 56px !important;
margin-bottom: 4px !important;
}
.dpi-category-card-icon-wrap svg {
width: 28px !important;
height: 28px !important;
}
.dpi-category-card-img {
width: 56px !important;
height: 56px !important;
}
.dpi-category-card-info h4 {
font-size: 11px !important;
}
.dpi-category-card-desc {
display: none !important;
}
.dpi-category-card-count {
font-size: 10px !important;
} .dpi-equip-grid-section {
padding: 14px 10px 12px !important;
}
.dpi-equip-grid-title {
font-size: 17px !important;
}
.dpi-equip-grid {
grid-template-columns: repeat(2, 1fr) !important;
gap: 8px !important;
}
.dpi-equip-card-name {
font-size: 10px !important;
padding: 6px 4px !important;
} .dpi-products-topbar {
padding: 6px 0 !important;
}
.dpi-sort-select {
font-size: 12px !important;
}
.dpi-products-count {
font-size: 12px !important;
} .dpi-pagination-numbers a,
.dpi-pagination-numbers span {
padding: 6px 10px !important;
font-size: 12px !important;
min-width: 36px;
min-height: 36px;
}
} @media screen and (max-width: 360px) {
.dpi-product-grid-wrapper {
padding: 8px 8px 32px !important;
}
.dpi-vehiculier-section {
padding: 16px 10px 20px !important;
}
.dpi-vehiculier-title h2 {
font-size: 15px !important;
}
.dpi-products-grid {
gap: 6px !important;
}
.dpi-product-title {
font-size: 11px !important;
}
.dpi-product-price {
font-size: 12px !important;
}
.dpi-product-add-to-cart {
font-size: 9px !important;
padding: 7px 6px !important;
}
.dpi-category-grid {
gap: 6px !important;
}
.dpi-category-card-icon-wrap {
width: 48px !important;
height: 48px !important;
}
.dpi-category-card-info h4 {
font-size: 10px !important;
}
} @media (pointer: coarse) { .dpi-vehiculier-btn,
.dpi-filters-toggle,
.dpi-product-add-to-cart,
.dpi-load-more-btn,
.dpi-vehicle-bar-action,
.dpi-filters-close,
.dpi-cat-toggle,
.dpi-back-all-cats {
min-height: 44px;
} .dpi-product-card:hover {
transform: none !important;
box-shadow: none !important;
}
.dpi-category-card:hover {
transform: none !important;
}
.dpi-equip-card:hover {
transform: none !important;
} .dpi-filter-checkbox-list,
.dpi-filters-sidebar {
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
} .dpi-category-card,
.dpi-product-card,
.dpi-equip-card,
.dpi-cat-row,
.dpi-sidebar-subcat-item {
-webkit-tap-highlight-color: rgba(255, 0, 0, 0.08);
} .dpi-vehiculier-btn:active,
.dpi-product-add-to-cart:active,
.dpi-filters-toggle:active,
.dpi-load-more-btn:active {
opacity: 0.85;
transform: scale(0.98);
}
} @supports (padding-bottom: env(safe-area-inset-bottom)) {
@media screen and (max-width: 768px) {
.dpi-filters-sidebar {
padding-bottom: calc(16px + env(safe-area-inset-bottom)) !important;
}
.dpi-products-pagination {
padding-bottom: calc(16px + env(safe-area-inset-bottom)) !important;
}
}
} @media screen and (max-width: 768px) and (orientation: landscape) {
.dpi-vehiculier-section {
padding: 14px 14px 18px !important;
}
.dpi-vehiculier-row {
flex-direction: row !important;
flex-wrap: wrap;
}
.dpi-vehiculier-selects {
flex-direction: row !important;
flex-wrap: wrap;
}
.dpi-vehiculier-select,
.dpi-searchable-wrap {
flex: 1 !important;
min-width: 120px !important;
}
.dpi-vehiculier-btn {
width: auto !important;
flex: 0 0 auto !important;
}
.dpi-products-grid {
--dpi-cols: 3 !important;
grid-template-columns: repeat(3, 1fr) !important;
}
.dpi-category-grid {
grid-template-columns: repeat(3, 1fr) !important;
}
.dpi-equip-grid {
grid-template-columns: repeat(4, 1fr) !important;
}
.dpi-filters-sidebar {
max-width: 300px !important;
}
} @media screen and (max-width: 768px) { .dpi-filters-toggle {
display: none !important;
} .dpi-mobile-subcats-btn {
padding: 8px 16px !important;
font-size: 11px !important;
border-radius: 100px !important;
min-height: 36px !important;
}
.dpi-mobile-subcats-arrow {
font-size: 7px !important;
margin-top: 1px !important;
}
.dpi-mobile-subcats-dropdown {
margin: 4px 0 !important;
} .dpi-products-topbar-right {
justify-content: flex-start !important;
}
}
@media screen and (max-width: 480px) {
.dpi-mobile-subcats-btn {
padding: 6px 12px !important;
font-size: 10px !important;
} .dpi-cat-reopen-link {
text-align: center !important;
padding: 10px 0 !important;
cursor: pointer !important;
margin-top: 5px !important;
}
.dpi-cat-reopen-link span {
color: #ff0000 !important;
font-size: 13px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
}
}