.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-9800 .elementor-element.elementor-element-b69dcec:not(.elementor-motion-effects-element-type-background), .elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F2F6F9;}.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-background-overlay{background-image:url("https://vita.biz.ua/wp-content/uploads/Pattern_img.png");background-position:center center;background-repeat:no-repeat;opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-container{max-width:1280px;}.elementor-9800 .elementor-element.elementor-element-b69dcec{overflow:hidden;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0em 0em 0em 0em;}.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-shape-bottom svg{width:calc(100% + 1.3px);height:95px;transform:translateX(-50%) rotateY(180deg);}.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-shape-bottom{z-index:2;pointer-events:none;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-9800 .elementor-element.elementor-element-c977c8b .elementor-heading-title{font-size:72px;color:#020101;}.elementor-bc-flex-widget .elementor-9800 .elementor-element.elementor-element-562baa6.elementor-column .elementor-widget-wrap{align-items:flex-end;}.elementor-9800 .elementor-element.elementor-element-562baa6.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-end;align-items:flex-end;}.elementor-9800 .elementor-element.elementor-element-562baa6 > .elementor-element-populated{margin:0px 0px -10px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-9800 .elementor-element.elementor-element-aac706f > .elementor-widget-container{margin:0px 0px -50px 0px;padding:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-background-overlay{background-image:url("https://vita.biz.ua/wp-content/uploads/Pattern_img.png");background-position:center center;background-repeat:no-repeat;opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-9800 .elementor-element.elementor-element-622351a{overflow:hidden;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-shape-bottom svg{width:calc(100% + 1.3px);height:95px;transform:translateX(-50%) rotateY(180deg);}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-shape-bottom{z-index:2;pointer-events:none;}.elementor-9800 .elementor-element.elementor-element-55d756d .elementor-heading-title{color:#020101;}.elementor-9800 .elementor-element.elementor-element-16ededc{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:-60px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9800 .elementor-element.elementor-element-1bd3948 > .elementor-widget-container{margin:020px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-1bd3948{text-align:center;}.elementor-9800 .elementor-element.elementor-element-1bd3948 .elementor-heading-title{color:#020101;}.elementor-9800 .elementor-element.elementor-element-725f7f3f > .elementor-container{text-align:center;}.elementor-9800 .elementor-element.elementor-element-725f7f3f{padding:0em 0em 0em 0em;}.elementor-9800 .elementor-element.elementor-element-bccfabc > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-9800 .elementor-element.elementor-element-bccfabc > .elementor-element-populated, .elementor-9800 .elementor-element.elementor-element-bccfabc > .elementor-element-populated > .elementor-background-overlay, .elementor-9800 .elementor-element.elementor-element-bccfabc > .elementor-background-slideshow{border-radius:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-202ee269 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-202ee269{text-align:center;}.elementor-9800 .elementor-element.elementor-element-70a1bf62 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-70a1bf62{text-align:center;}.elementor-9800 .elementor-element.elementor-element-5d38c9d5 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-5d38c9d5{text-align:center;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-9800 .elementor-element.elementor-element-485208ad .elementor-button{background-color:#FFCC26;fill:#000000;color:#000000;border-radius:20px 20px 20px 20px;padding:-1px -1px -1px -1px;}.elementor-9800 .elementor-element.elementor-element-485208ad > .elementor-widget-container{border-radius:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-731844c5 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-9800 .elementor-element.elementor-element-731844c5 > .elementor-element-populated, .elementor-9800 .elementor-element.elementor-element-731844c5 > .elementor-element-populated > .elementor-background-overlay, .elementor-9800 .elementor-element.elementor-element-731844c5 > .elementor-background-slideshow{border-radius:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-6e062d5a > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-6e062d5a{text-align:center;}.elementor-9800 .elementor-element.elementor-element-6798f99 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-6798f99{text-align:center;}.elementor-9800 .elementor-element.elementor-element-36b48f8 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-9800 .elementor-element.elementor-element-36b48f8{text-align:center;}.elementor-9800 .elementor-element.elementor-element-c9817e7 .elementor-button{background-color:#FFCC26;fill:#000000;color:#000000;border-radius:20px 20px 20px 20px;padding:-1px -1px -1px -1px;}.elementor-9800 .elementor-element.elementor-element-c9817e7 > .elementor-widget-container{border-radius:0px 0px 0px 0px;}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products{--products-title-color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.products-heading-show .related-products > h2, .elementor-widget-woocommerce-products.products-heading-show .upsells > h2, .elementor-widget-woocommerce-products.products-heading-show .cross-sells > h2{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product{text-align:center;border-style:solid;border-width:1px 1px 1px 1px;border-radius:30px;padding:0px 0px 20px 0px;background-color:#FFFEFE;border-color:#FCD039;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products{grid-column-gap:30px;grid-row-gap:30px;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products .attachment-woocommerce_thumbnail{border-radius:30px 30px 30px 30px;margin-bottom:28px;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:#020101;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:#020101;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:"Roboto", Sans-serif;font-size:18px;font-weight:500;line-height:1em;letter-spacing:0px;word-spacing:0px;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .price{color:#020101;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .price ins{color:#020101;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .price ins .amount{color:#020101;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .price del{color:#7A7A7A;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .price del .amount{color:#7A7A7A;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .button{background-color:#FCD039;border-radius:99px 99px 99px 99px;margin-top:12px;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products .added_to_cart{color:#FDBF12;margin-inline-start:0px;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product span.onsale{display:block;}.elementor-9800 .elementor-element.elementor-element-51e5300{--display:flex;}@media(min-width:768px){.elementor-9800 .elementor-element.elementor-element-1ad2f5d{width:73.665%;}.elementor-9800 .elementor-element.elementor-element-562baa6{width:26%;}.elementor-9800 .elementor-element.elementor-element-16ededc{--content-width:1280px;}}@media(max-width:1024px){.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-background-overlay{background-size:cover;}.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-shape-bottom svg{height:65px;}.elementor-9800 .elementor-element.elementor-element-b69dcec{padding:0em 1em 0em 1em;}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-background-overlay{background-size:cover;}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-shape-bottom svg{height:65px;}.elementor-9800 .elementor-element.elementor-element-622351a{padding:0em 1em 0em 1em;}.elementor-9800 .elementor-element.elementor-element-55d756d{text-align:center;}.elementor-9800 .elementor-element.elementor-element-725f7f3f{padding:0em 0em 3em 0em;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-size:16px;}}@media(max-width:767px){.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-background-overlay{background-size:contain;}.elementor-9800 .elementor-element.elementor-element-b69dcec > .elementor-shape-bottom svg{height:55px;}.elementor-9800 .elementor-element.elementor-element-b69dcec{padding:2em 0em 0em 0em;}.elementor-9800 .elementor-element.elementor-element-1ad2f5d > .elementor-element-populated{padding:1em 2em 1em 2em;}.elementor-9800 .elementor-element.elementor-element-c977c8b{text-align:center;}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-background-overlay{background-size:contain;}.elementor-9800 .elementor-element.elementor-element-622351a > .elementor-shape-bottom svg{height:55px;}.elementor-9800 .elementor-element.elementor-element-622351a{padding:2em 0em 0em 0em;}.elementor-9800 .elementor-element.elementor-element-e78fb30 > .elementor-element-populated{padding:1em 2em 1em 2em;}.elementor-9800 .elementor-element.elementor-element-55d756d{text-align:center;}.elementor-9800 .elementor-element.elementor-element-725f7f3f{padding:0em 0em 2em 0em;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-size:14px;}}/* Start custom CSS for column, class: .elementor-element-bccfabc *//* ========================================================= */ /* ФИЛЬТРЫ В ЛЕВОЙ КОЛОНКЕ */ /* Заголовок и мультичекбоксы как единый блок */ /* Вставлять в CSS родительского контейнера фильтров */ /* ========================================================= */ /* ========================================================= */ /* 1. ОСНОВНЫЕ НАСТРОЙКИ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc, .elementor-9800 .elementor-element.elementor-element-bccfabc * { box-sizing: border-box !important; scroll-behavior: auto !important; } /* Отключаем анимации только внутри блока фильтров */ .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading *, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter *, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap * { animation: none !important; animation-name: none !important; animation-duration: 0s !important; animation-delay: 0s !important; transition: none !important; } /* Убираем entrance animation Elementor */ .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-invisible, .elementor-9800 .elementor-element.elementor-element-bccfabc .animated, .elementor-9800 .elementor-element.elementor-element-bccfabc .fadeIn, .elementor-9800 .elementor-element.elementor-element-bccfabc .fadeInUp, .elementor-9800 .elementor-element.elementor-element-bccfabc .fadeInDown, .elementor-9800 .elementor-element.elementor-element-bccfabc .fadeInLeft, .elementor-9800 .elementor-element.elementor-element-bccfabc .fadeInRight, .elementor-9800 .elementor-element.elementor-element-bccfabc .slideInUp, .elementor-9800 .elementor-element.elementor-element-bccfabc .slideInDown, .elementor-9800 .elementor-element.elementor-element-bccfabc .slideInLeft, .elementor-9800 .elementor-element.elementor-element-bccfabc .slideInRight, .elementor-9800 .elementor-element.elementor-element-bccfabc .zoomIn { opacity: 1 !important; visibility: visible !important; transform: none !important; animation: none !important; } /* Отключаем Motion Effects и Sticky-анимацию */ .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-sticky, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-sticky--active, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-motion-effects-element, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-motion-effects-container { opacity: 1 !important; visibility: visible !important; transform: none !important; animation: none !important; transition: none !important; } /* ========================================================= */ /* 2. ЗАГОЛОВОК ФИЛЬТРА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading { position: relative !important; z-index: 2 !important; width: 100% !important; background: #ffcc26 !important; border: 1px solid #ffcc26 !important; border-bottom: none !important; border-radius: 28px 28px 0 0 !important; padding: 0 !important; margin: 0 !important; overflow: hidden !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading .elementor-heading-title { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 110px !important; background: #ffcc26 !important; color: #111111 !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 800 !important; text-align: center !important; padding: 18px 20px !important; margin: 0 !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; } /* ========================================================= */ /* 3. НИЖНЯЯ БЕЛАЯ ЧАСТЬ ФИЛЬТРА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading + .elementor-widget-wl-product-filter { position: relative !important; z-index: 1 !important; width: 100% !important; background: #ffffff !important; border: 1px solid #ffcc26 !important; border-top: none !important; border-radius: 0 0 28px 28px !important; padding: 8px 14px 14px !important; margin: 0 0 28px !important; overflow: hidden !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading + .elementor-widget-wl-product-filter .elementor-widget-container, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading + .elementor-widget-wl-product-filter .woolentor-filter-wrap { width: 100% !important; background: #ffffff !important; border: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; } /* ========================================================= */ /* 4. ЕСЛИ ЗАГОЛОВОК НАХОДИТСЯ ВНУТРИ ВИДЖЕТА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter:not( .elementor-widget-heading + .elementor-widget-wl-product-filter ) { width: 100% !important; background: #ffffff !important; border: 1px solid #ffcc26 !important; border-radius: 28px !important; padding: 0 !important; margin: 0 0 28px !important; overflow: hidden !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter:not( .elementor-widget-heading + .elementor-widget-wl-product-filter ) .elementor-widget-container { background: transparent !important; border: none !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter h2, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter h3, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter h4, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .widget-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .filter-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .wlpf-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .wl-filter-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .woolentor-filter-title { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 110px !important; background: #ffcc26 !important; color: #111111 !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 800 !important; text-align: center !important; padding: 18px 20px !important; margin: 0 !important; border: none !important; border-radius: 0 !important; } /* ========================================================= */ /* 5. СПИСОК ФИЛЬТРОВ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap { width: 100% !important; background: #ffffff !important; border: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul { width: 100% !important; list-style: none !important; padding: 0 !important; margin: 0 !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li { position: relative !important; width: 100% !important; list-style: none !important; padding: 0 !important; margin: 0 !important; background: transparent !important; border: none !important; } /* * Ссылка опции. * Используем не только href*="filter_", потому что WooLentor * может изменить href активной ссылки после перехода. */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a { position: relative !important; display: flex !important; align-items: center !important; width: 100% !important; min-height: 46px !important; padding: 12px 48px 12px 46px !important; margin: 0 !important; background: #ffffff !important; color: #333333 !important; border: none !important; border-bottom: 1px solid #eeeeee !important; border-radius: 0 !important; font-size: 15px !important; line-height: 1.35 !important; font-weight: 400 !important; text-align: left !important; text-decoration: none !important; white-space: normal !important; overflow-wrap: anywhere !important; box-shadow: none !important; outline: none !important; cursor: pointer !important; } /* Последний пункт без нижней линии */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li:last-child > a { border-bottom: none !important; } /* Без hover-анимации */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a:hover, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a:focus, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a:active { color: #111111 !important; text-decoration: none !important; box-shadow: none !important; outline: none !important; } /* ========================================================= */ /* 6. УДАЛЕНИЕ КРАСНОГО КРЕСТИКА WOOLENTOR */ /* ========================================================= */ /* * Сначала отключаем стандартные псевдоэлементы WooLentor. * Ниже наши чекбоксы создаются заново более точными правилами. */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a::before, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a::after { content: none !important; display: none !important; background-image: none !important; font-size: 0 !important; color: transparent !important; opacity: 0 !important; } /* Возможные отдельные элементы крестика */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap .remove, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap .remove-filter, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap .remove-item, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap .clear-filter, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap .selected-filter-remove, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap [class*="remove"], .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap [class*="close"] { display: none !important; } /* * Убираем красный цвет, который плагин может назначать * активной ссылке или вложенному элементу. */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a *, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.active > a, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.selected > a, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.current > a { text-decoration: none !important; } /* ========================================================= */ /* 7. НАШ ЧЕКБОКС ДЛЯ ВСЕХ ОПЦИЙ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a::before { content: "" !important; position: absolute !important; display: block !important; left: 16px !important; top: 50% !important; transform: translateY(-50%) !important; width: 17px !important; height: 17px !important; background: #ffffff !important; border: 2px solid #ffcc26 !important; border-radius: 4px !important; opacity: 1 !important; box-shadow: none !important; pointer-events: none !important; } /* ========================================================= */ /* 8. АКТИВНОЕ СОСТОЯНИЕ */ /* ========================================================= */ /* * Поддерживаются: * data-vita-checked из вашего JavaScript; * vita-filter-active; * активный класс на родительском li; * возможные классы самого WooLentor. */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a[data-vita-checked="1"], .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a.vita-filter-active, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.vita-filter-active-item > a, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.active > a, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.selected > a, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.current > a { background: #fff7d6 !important; color: #111111 !important; font-weight: 700 !important; } /* Жёлтая заливка выбранного чекбокса */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::before, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a.vita-filter-active::before, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.vita-filter-active-item > a::before, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.active > a::before, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.selected > a::before, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.current > a::before { content: "" !important; display: block !important; background: #ffcc26 !important; border-color: #ffcc26 !important; opacity: 1 !important; } /* Галочка выбранной опции */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a.vita-filter-active::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.vita-filter-active-item > a::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.active > a::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.selected > a::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.current > a::after { content: "✓" !important; position: absolute !important; display: flex !important; align-items: center !important; justify-content: center !important; left: 16px !important; top: 50% !important; transform: translateY(-50%) !important; width: 17px !important; height: 17px !important; background: transparent !important; color: #111111 !important; font-size: 13px !important; line-height: 1 !important; font-weight: 900 !important; opacity: 1 !important; pointer-events: none !important; } /* ========================================================= */ /* 9. НЕАКТИВНОЕ СОСТОЯНИЕ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a[data-vita-checked="0"] { background: #ffffff !important; color: #333333 !important; font-weight: 400 !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a[data-vita-checked="0"]::before { background: #ffffff !important; border-color: #ffcc26 !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a[data-vita-checked="0"]::after { content: none !important; display: none !important; } /* ========================================================= */ /* 10. КОЛИЧЕСТВО ТОВАРОВ СПРАВА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a span { position: absolute !important; right: 12px !important; top: 50% !important; transform: translateY(-50%) !important; max-width: 42px !important; padding: 0 !important; margin: 0 !important; color: inherit !important; font-size: inherit !important; line-height: 1 !important; font-weight: inherit !important; white-space: nowrap !important; background: transparent !important; border: none !important; pointer-events: none !important; } /* ========================================================= */ /* 11. AJAX-ЗАГРУЗКА ТОВАРОВ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-bccfabc ul.products.vita-products-loading, ul.products.vita-products-loading { opacity: 0.55 !important; pointer-events: none !important; transition: opacity 0.15s ease !important; } /* ========================================================= */ /* 12. МОБИЛЬНАЯ ВЕРСИЯ */ /* ========================================================= */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading { border-radius: 24px 24px 0 0 !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading .elementor-heading-title { min-height: 90px !important; font-size: 19px !important; padding: 15px 14px !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-heading + .elementor-widget-wl-product-filter { border-radius: 0 0 24px 24px !important; padding: 6px 12px 12px !important; margin-bottom: 24px !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter:not( .elementor-widget-heading + .elementor-widget-wl-product-filter ) { border-radius: 24px !important; margin-bottom: 24px !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter h2, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter h3, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter h4, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .widget-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .filter-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .wlpf-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .wl-filter-title, .elementor-9800 .elementor-element.elementor-element-bccfabc .elementor-widget-wl-product-filter .woolentor-filter-title { min-height: 90px !important; font-size: 19px !important; padding: 15px 14px !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a { min-height: 44px !important; padding: 11px 42px 11px 43px !important; font-size: 14px !important; line-height: 1.3 !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a::before { left: 14px !important; width: 16px !important; height: 16px !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a.vita-filter-active::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.vita-filter-active-item > a::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.active > a::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.selected > a::after, .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li.current > a::after { left: 14px !important; width: 16px !important; height: 16px !important; font-size: 12px !important; } .elementor-9800 .elementor-element.elementor-element-bccfabc .woolentor-filter-wrap ul li > a span { right: 9px !important; font-size: 14px !important; } }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-731844c5 *//* ========================================================= */ /* ФИЛЬТРЫ В ЛЕВОЙ КОЛОНКЕ */ /* Заголовок и мультичекбоксы как единый блок */ /* Вставлять в CSS родительского контейнера фильтров */ /* ========================================================= */ /* ========================================================= */ /* 1. ОСНОВНЫЕ НАСТРОЙКИ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5, .elementor-9800 .elementor-element.elementor-element-731844c5 * { box-sizing: border-box !important; scroll-behavior: auto !important; } /* Отключаем анимации только внутри блока фильтров */ .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading *, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter *, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap * { animation: none !important; animation-name: none !important; animation-duration: 0s !important; animation-delay: 0s !important; transition: none !important; } /* Убираем entrance animation Elementor */ .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-invisible, .elementor-9800 .elementor-element.elementor-element-731844c5 .animated, .elementor-9800 .elementor-element.elementor-element-731844c5 .fadeIn, .elementor-9800 .elementor-element.elementor-element-731844c5 .fadeInUp, .elementor-9800 .elementor-element.elementor-element-731844c5 .fadeInDown, .elementor-9800 .elementor-element.elementor-element-731844c5 .fadeInLeft, .elementor-9800 .elementor-element.elementor-element-731844c5 .fadeInRight, .elementor-9800 .elementor-element.elementor-element-731844c5 .slideInUp, .elementor-9800 .elementor-element.elementor-element-731844c5 .slideInDown, .elementor-9800 .elementor-element.elementor-element-731844c5 .slideInLeft, .elementor-9800 .elementor-element.elementor-element-731844c5 .slideInRight, .elementor-9800 .elementor-element.elementor-element-731844c5 .zoomIn { opacity: 1 !important; visibility: visible !important; transform: none !important; animation: none !important; } /* Отключаем Motion Effects и Sticky-анимацию */ .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-sticky, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-sticky--active, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-motion-effects-element, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-motion-effects-container { opacity: 1 !important; visibility: visible !important; transform: none !important; animation: none !important; transition: none !important; } /* ========================================================= */ /* 2. ЗАГОЛОВОК ФИЛЬТРА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading { position: relative !important; z-index: 2 !important; width: 100% !important; background: #ffcc26 !important; border: 1px solid #ffcc26 !important; border-bottom: none !important; border-radius: 28px 28px 0 0 !important; padding: 0 !important; margin: 0 !important; overflow: hidden !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading .elementor-heading-title { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 110px !important; background: #ffcc26 !important; color: #111111 !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 800 !important; text-align: center !important; padding: 18px 20px !important; margin: 0 !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; } /* ========================================================= */ /* 3. НИЖНЯЯ БЕЛАЯ ЧАСТЬ ФИЛЬТРА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading + .elementor-widget-wl-product-filter { position: relative !important; z-index: 1 !important; width: 100% !important; background: #ffffff !important; border: 1px solid #ffcc26 !important; border-top: none !important; border-radius: 0 0 28px 28px !important; padding: 8px 14px 14px !important; margin: 0 0 28px !important; overflow: hidden !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading + .elementor-widget-wl-product-filter .elementor-widget-container, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading + .elementor-widget-wl-product-filter .woolentor-filter-wrap { width: 100% !important; background: #ffffff !important; border: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; } /* ========================================================= */ /* 4. ЕСЛИ ЗАГОЛОВОК НАХОДИТСЯ ВНУТРИ ВИДЖЕТА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter:not( .elementor-widget-heading + .elementor-widget-wl-product-filter ) { width: 100% !important; background: #ffffff !important; border: 1px solid #ffcc26 !important; border-radius: 28px !important; padding: 0 !important; margin: 0 0 28px !important; overflow: hidden !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter:not( .elementor-widget-heading + .elementor-widget-wl-product-filter ) .elementor-widget-container { background: transparent !important; border: none !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter h2, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter h3, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter h4, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .widget-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .filter-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .wlpf-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .wl-filter-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .woolentor-filter-title { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 110px !important; background: #ffcc26 !important; color: #111111 !important; font-size: 22px !important; line-height: 1.25 !important; font-weight: 800 !important; text-align: center !important; padding: 18px 20px !important; margin: 0 !important; border: none !important; border-radius: 0 !important; } /* ========================================================= */ /* 5. СПИСОК ФИЛЬТРОВ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap { width: 100% !important; background: #ffffff !important; border: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul { width: 100% !important; list-style: none !important; padding: 0 !important; margin: 0 !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li { position: relative !important; width: 100% !important; list-style: none !important; padding: 0 !important; margin: 0 !important; background: transparent !important; border: none !important; } /* * Ссылка опции. * Используем не только href*="filter_", потому что WooLentor * может изменить href активной ссылки после перехода. */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a { position: relative !important; display: flex !important; align-items: center !important; width: 100% !important; min-height: 46px !important; padding: 12px 48px 12px 46px !important; margin: 0 !important; background: #ffffff !important; color: #333333 !important; border: none !important; border-bottom: 1px solid #eeeeee !important; border-radius: 0 !important; font-size: 15px !important; line-height: 1.35 !important; font-weight: 400 !important; text-align: left !important; text-decoration: none !important; white-space: normal !important; overflow-wrap: anywhere !important; box-shadow: none !important; outline: none !important; cursor: pointer !important; } /* Последний пункт без нижней линии */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li:last-child > a { border-bottom: none !important; } /* Без hover-анимации */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a:hover, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a:focus, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a:active { color: #111111 !important; text-decoration: none !important; box-shadow: none !important; outline: none !important; } /* ========================================================= */ /* 6. УДАЛЕНИЕ КРАСНОГО КРЕСТИКА WOOLENTOR */ /* ========================================================= */ /* * Сначала отключаем стандартные псевдоэлементы WooLentor. * Ниже наши чекбоксы создаются заново более точными правилами. */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a::before, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a::after { content: none !important; display: none !important; background-image: none !important; font-size: 0 !important; color: transparent !important; opacity: 0 !important; } /* Возможные отдельные элементы крестика */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap .remove, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap .remove-filter, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap .remove-item, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap .clear-filter, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap .selected-filter-remove, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap [class*="remove"], .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap [class*="close"] { display: none !important; } /* * Убираем красный цвет, который плагин может назначать * активной ссылке или вложенному элементу. */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a *, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.active > a, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.selected > a, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.current > a { text-decoration: none !important; } /* ========================================================= */ /* 7. НАШ ЧЕКБОКС ДЛЯ ВСЕХ ОПЦИЙ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a::before { content: "" !important; position: absolute !important; display: block !important; left: 16px !important; top: 50% !important; transform: translateY(-50%) !important; width: 17px !important; height: 17px !important; background: #ffffff !important; border: 2px solid #ffcc26 !important; border-radius: 4px !important; opacity: 1 !important; box-shadow: none !important; pointer-events: none !important; } /* ========================================================= */ /* 8. АКТИВНОЕ СОСТОЯНИЕ */ /* ========================================================= */ /* * Поддерживаются: * data-vita-checked из вашего JavaScript; * vita-filter-active; * активный класс на родительском li; * возможные классы самого WooLentor. */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a[data-vita-checked="1"], .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a.vita-filter-active, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.vita-filter-active-item > a, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.active > a, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.selected > a, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.current > a { background: #fff7d6 !important; color: #111111 !important; font-weight: 700 !important; } /* Жёлтая заливка выбранного чекбокса */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::before, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a.vita-filter-active::before, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.vita-filter-active-item > a::before, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.active > a::before, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.selected > a::before, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.current > a::before { content: "" !important; display: block !important; background: #ffcc26 !important; border-color: #ffcc26 !important; opacity: 1 !important; } /* Галочка выбранной опции */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a.vita-filter-active::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.vita-filter-active-item > a::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.active > a::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.selected > a::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.current > a::after { content: "✓" !important; position: absolute !important; display: flex !important; align-items: center !important; justify-content: center !important; left: 16px !important; top: 50% !important; transform: translateY(-50%) !important; width: 17px !important; height: 17px !important; background: transparent !important; color: #111111 !important; font-size: 13px !important; line-height: 1 !important; font-weight: 900 !important; opacity: 1 !important; pointer-events: none !important; } /* ========================================================= */ /* 9. НЕАКТИВНОЕ СОСТОЯНИЕ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a[data-vita-checked="0"] { background: #ffffff !important; color: #333333 !important; font-weight: 400 !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a[data-vita-checked="0"]::before { background: #ffffff !important; border-color: #ffcc26 !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a[data-vita-checked="0"]::after { content: none !important; display: none !important; } /* ========================================================= */ /* 10. КОЛИЧЕСТВО ТОВАРОВ СПРАВА */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a span { position: absolute !important; right: 12px !important; top: 50% !important; transform: translateY(-50%) !important; max-width: 42px !important; padding: 0 !important; margin: 0 !important; color: inherit !important; font-size: inherit !important; line-height: 1 !important; font-weight: inherit !important; white-space: nowrap !important; background: transparent !important; border: none !important; pointer-events: none !important; } /* ========================================================= */ /* 11. AJAX-ЗАГРУЗКА ТОВАРОВ */ /* ========================================================= */ .elementor-9800 .elementor-element.elementor-element-731844c5 ul.products.vita-products-loading, ul.products.vita-products-loading { opacity: 0.55 !important; pointer-events: none !important; transition: opacity 0.15s ease !important; } /* ========================================================= */ /* 12. МОБИЛЬНАЯ ВЕРСИЯ */ /* ========================================================= */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading { border-radius: 24px 24px 0 0 !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading .elementor-heading-title { min-height: 90px !important; font-size: 19px !important; padding: 15px 14px !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-heading + .elementor-widget-wl-product-filter { border-radius: 0 0 24px 24px !important; padding: 6px 12px 12px !important; margin-bottom: 24px !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter:not( .elementor-widget-heading + .elementor-widget-wl-product-filter ) { border-radius: 24px !important; margin-bottom: 24px !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter h2, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter h3, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter h4, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .widget-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .filter-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .wlpf-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .wl-filter-title, .elementor-9800 .elementor-element.elementor-element-731844c5 .elementor-widget-wl-product-filter .woolentor-filter-title { min-height: 90px !important; font-size: 19px !important; padding: 15px 14px !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a { min-height: 44px !important; padding: 11px 42px 11px 43px !important; font-size: 14px !important; line-height: 1.3 !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a::before { left: 14px !important; width: 16px !important; height: 16px !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a.vita-filter-active::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.vita-filter-active-item > a::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.active > a::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.selected > a::after, .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li.current > a::after { left: 14px !important; width: 16px !important; height: 16px !important; font-size: 12px !important; } .elementor-9800 .elementor-element.elementor-element-731844c5 .woolentor-filter-wrap ul li > a span { right: 9px !important; font-size: 14px !important; } } /* ========================================================= */ /* 13. МОБИЛЬНЫЙ И ПЛАНШЕТНЫЙ ФИЛЬТР — ЧИСТАЯ ВЕРСИЯ V17 */ /* Используется с текущим JS модального фильтра */ /* Класс колонки Elementor: vita-filter-column */ /* ========================================================= */ .vita-mobile-filter-trigger, .vita-mobile-filter-overlay, .vita-mobile-filter-modal { display: none; } @media (max-width: 1024px) { html.vita-filter-modal-open, html.vita-filter-modal-open body { overflow: hidden !important; touch-action: none !important; } /* * ВАЖНО: * Не превращаем общий контейнер товаров в flex/grid. * Это исправляет огромную пустую карточку под сортировкой. */ .vita-mobile-filter-toolbar { position: relative !important; display: block !important; width: 100% !important; max-width: 100% !important; min-height: 0 !important; height: auto !important; margin: 0 0 20px !important; padding: 0 !important; overflow: visible !important; z-index: 30 !important; } .vita-mobile-filter-toolbar > .woocommerce-result-count { display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 0 14px !important; padding: 0 !important; color: #111111 !important; font-size: 16px !important; line-height: 1.35 !important; font-weight: 500 !important; text-align: center !important; } /* Кнопка «Фільтри» */ .vita-mobile-filter-toolbar > .vita-mobile-filter-trigger { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 14px !important; width: 100% !important; min-height: 60px !important; margin: 0 0 14px !important; padding: 14px 24px !important; background: #ffffff !important; color: #111111 !important; border: 2px solid #ffcc26 !important; border-radius: 999px !important; box-shadow: none !important; outline: none !important; font-family: inherit !important; font-size: 17px !important; line-height: 1 !important; font-weight: 800 !important; text-align: left !important; cursor: pointer !important; } .vita-mobile-filter-trigger:hover, .vita-mobile-filter-trigger:focus, .vita-mobile-filter-trigger:active, .vita-mobile-filter-trigger[aria-expanded="true"] { background: #ffffff !important; color: #111111 !important; border-color: #ffcc26 !important; box-shadow: none !important; outline: none !important; } .vita-mobile-filter-trigger-label { display: inline-flex !important; align-items: center !important; gap: 14px !important; min-width: 0 !important; } .vita-mobile-filter-trigger-icon { position: relative !important; display: inline-block !important; flex: 0 0 28px !important; width: 28px !important; height: 20px !important; } .vita-mobile-filter-trigger-icon::before, .vita-mobile-filter-trigger-icon::after, .vita-mobile-filter-trigger-icon span { content: "" !important; position: absolute !important; left: 0 !important; display: block !important; width: 28px !important; height: 2px !important; background: #111111 !important; border-radius: 999px !important; } .vita-mobile-filter-trigger-icon::before { top: 0 !important; } .vita-mobile-filter-trigger-icon span { top: 9px !important; } .vita-mobile-filter-trigger-icon::after { top: 18px !important; } /* Стрелку у кнопки фильтра убираем */ .vita-mobile-filter-trigger-arrow { display: none !important; } /* Сортировка */ .vita-mobile-filter-toolbar > form.woocommerce-ordering { position: relative !important; display: block !important; width: 100% !important; max-width: 100% !important; min-height: 60px !important; height: auto !important; margin: 0 !important; padding: 0 !important; background: #ffffff !important; border: 2px solid #ffcc26 !important; border-radius: 999px !important; box-shadow: none !important; overflow: visible !important; } .vita-mobile-filter-toolbar > form.woocommerce-ordering > select.orderby { display: block !important; width: 100% !important; max-width: 100% !important; min-height: 56px !important; margin: 0 !important; padding: 14px 54px 14px 24px !important; background: #ffffff !important; color: #111111 !important; border: none !important; border-radius: 999px !important; box-shadow: none !important; outline: none !important; font-family: inherit !important; font-size: 17px !important; line-height: 1 !important; font-weight: 800 !important; appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; } .vita-mobile-filter-toolbar > form.woocommerce-ordering::after { content: "" !important; position: absolute !important; top: 50% !important; right: 24px !important; width: 10px !important; height: 10px !important; border-right: 2px solid #111111 !important; border-bottom: 2px solid #111111 !important; transform: translateY(-65%) rotate(45deg) !important; pointer-events: none !important; z-index: 3 !important; } /* Если основной JS использует кастомную сортировку */ .vita-mobile-filter-toolbar > form.woocommerce-ordering .vita-custom-sort, .vita-mobile-filter-toolbar > form.woocommerce-ordering .vita-sort-trigger { width: 100% !important; max-width: 100% !important; min-height: 56px !important; margin: 0 !important; padding: 14px 54px 14px 24px !important; background: #ffffff !important; color: #111111 !important; border: none !important; border-radius: 999px !important; box-shadow: none !important; font-size: 17px !important; line-height: 1 !important; font-weight: 800 !important; } .vita-mobile-filter-toolbar > form.woocommerce-ordering:has(.vita-custom-sort)::after, .vita-mobile-filter-toolbar > form.woocommerce-ordering:has(.vita-sort-trigger)::after { display: none !important; } /* * Исходная колонка скрыта на сайте и доступна внутри модалки. */ .vita-filter-column { display: none !important; } .vita-mobile-filter-modal-body > .vita-filter-column { display: block !important; } /* Elementor editor */ body.elementor-editor-active .vita-filter-column, body.elementor-editor-preview .vita-filter-column, .elementor-editor-active .vita-filter-column, .elementor-editor-preview .vita-filter-column { display: block !important; } body.elementor-editor-active .vita-mobile-filter-trigger, body.elementor-editor-active .vita-mobile-filter-overlay, body.elementor-editor-active .vita-mobile-filter-modal, body.elementor-editor-preview .vita-mobile-filter-trigger, body.elementor-editor-preview .vita-mobile-filter-overlay, body.elementor-editor-preview .vita-mobile-filter-modal { display: none !important; } /* Затемнение без анимации */ .vita-mobile-filter-overlay { position: fixed !important; inset: 0 !important; z-index: 999996 !important; display: block !important; background: rgba(17, 17, 17, 0.58) !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; transition: none !important; animation: none !important; } html.vita-filter-modal-open .vita-mobile-filter-overlay { visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; } /* Модальное окно */ .vita-mobile-filter-modal { position: fixed !important; top: 16px !important; left: 16px !important; bottom: 16px !important; z-index: 999997 !important; display: flex !important; flex-direction: column !important; width: min(460px, calc(100vw - 32px)) !important; max-width: min(460px, calc(100vw - 32px)) !important; height: auto !important; margin: 0 !important; padding: 0 !important; background: #ffffff !important; border: 1px solid #ffcc26 !important; border-radius: 28px !important; box-shadow: 0 18px 50px rgba(17, 17, 17, 0.22) !important; overflow: hidden !important; visibility: hidden !important; opacity: 0 !important; transform: none !important; pointer-events: none !important; transition: none !important; animation: none !important; } html.vita-filter-modal-open .vita-mobile-filter-modal { visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; } .vita-mobile-filter-modal-header { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 14px !important; flex: 0 0 auto !important; min-height: 72px !important; margin: 0 !important; padding: 14px 18px !important; background: #ffcc26 !important; color: #111111 !important; border: none !important; border-bottom: 1px solid #f0b400 !important; border-radius: 28px 28px 0 0 !important; } .vita-mobile-filter-modal-title { margin: 0 !important; padding: 0 !important; color: #111111 !important; font-family: inherit !important; font-size: 22px !important; line-height: 1.2 !important; font-weight: 800 !important; text-shadow: none !important; -webkit-text-stroke: 0 !important; filter: none !important; } .vita-mobile-filter-close { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 42px !important; height: 42px !important; min-width: 42px !important; margin: 0 !important; padding: 0 0 2px !important; background: #ffffff !important; color: #111111 !important; border: 2px solid #111111 !important; border-radius: 50% !important; box-shadow: none !important; outline: none !important; font-family: Arial, sans-serif !important; font-size: 27px !important; line-height: 1 !important; font-weight: 500 !important; cursor: pointer !important; } .vita-mobile-filter-modal-body { flex: 1 1 auto !important; width: 100% !important; min-height: 0 !important; margin: 0 !important; padding: 18px !important; background: #ffffff !important; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior: contain !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: thin; scrollbar-color: #ffcc26 #f3f3f3; } .vita-mobile-filter-modal-body::-webkit-scrollbar { width: 7px !important; } .vita-mobile-filter-modal-body::-webkit-scrollbar-track { background: #f3f3f3 !important; border-radius: 999px !important; } .vita-mobile-filter-modal-body::-webkit-scrollbar-thumb { background: #ffcc26 !important; border-radius: 999px !important; } .vita-mobile-filter-modal-body > .vita-filter-column, .vita-mobile-filter-modal-body > .vita-filter-column > .elementor-widget-wrap, .vita-mobile-filter-modal-body > .vita-filter-column > .elementor-element-populated, .vita-mobile-filter-modal-body > .vita-filter-column > .e-con-inner { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; transform: none !important; visibility: visible !important; opacity: 1 !important; } /* Заголовки фильтров */ .vita-mobile-filter-modal-body .elementor-widget-heading { position: relative !important; z-index: 2 !important; width: 100% !important; margin: 0 !important; padding: 0 !important; background: #ffcc26 !important; border: 1px solid #ffcc26 !important; border-bottom: none !important; border-radius: 24px 24px 0 0 !important; overflow: hidden !important; box-shadow: none !important; } .vita-mobile-filter-modal-body .elementor-widget-heading .elementor-heading-title { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 88px !important; margin: 0 !important; padding: 16px 18px !important; background: #ffcc26 !important; color: #111111 !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; font-size: 20px !important; line-height: 1.25 !important; font-weight: 800 !important; text-align: center !important; } .vita-mobile-filter-modal-body .elementor-widget-heading + .elementor-widget-wl-product-filter, .vita-mobile-filter-modal-body .elementor-widget-heading + .elementor-widget-woolentor-product-filter { position: relative !important; z-index: 1 !important; width: 100% !important; margin: 0 0 20px !important; padding: 8px 12px 12px !important; background: #ffffff !important; border: 1px solid #ffcc26 !important; border-top: none !important; border-radius: 0 0 24px 24px !important; overflow: hidden !important; box-shadow: none !important; } .vita-mobile-filter-modal-body .elementor-widget-wl-product-filter .elementor-widget-container, .vita-mobile-filter-modal-body .elementor-widget-woolentor-product-filter .elementor-widget-container, .vita-mobile-filter-modal-body .woolentor-filter-wrap { width: 100% !important; margin: 0 !important; padding: 0 !important; background: #ffffff !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul { width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li { position: relative !important; width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: none !important; list-style: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a { position: relative !important; display: flex !important; align-items: center !important; width: 100% !important; min-height: 50px !important; margin: 0 !important; padding: 13px 50px 13px 48px !important; background: #ffffff !important; color: #333333 !important; border: none !important; border-bottom: 1px solid #ededed !important; border-radius: 0 !important; box-shadow: none !important; outline: none !important; font-size: 15px !important; line-height: 1.35 !important; font-weight: 400 !important; text-align: left !important; text-decoration: none !important; white-space: normal !important; overflow-wrap: anywhere !important; cursor: pointer !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li:last-child > a { border-bottom: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a::before, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a::after { content: none !important; display: none !important; opacity: 0 !important; background-image: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a::before { content: "" !important; position: absolute !important; left: 16px !important; top: 50% !important; display: block !important; width: 18px !important; height: 18px !important; transform: translateY(-50%) !important; background: #ffffff !important; border: 2px solid #ffcc26 !important; border-radius: 5px !important; opacity: 1 !important; pointer-events: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a[data-vita-checked="1"], .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a.vita-filter-active, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.vita-filter-active-item > a, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.active > a, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.selected > a, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.current > a { background: #fff7d6 !important; color: #111111 !important; font-weight: 700 !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::before, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a.vita-filter-active::before, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.vita-filter-active-item > a::before, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.active > a::before, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.selected > a::before, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.current > a::before { background: #ffcc26 !important; border-color: #ffcc26 !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::after, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a.vita-filter-active::after, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.vita-filter-active-item > a::after, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.active > a::after, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.selected > a::after, .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li.current > a::after { content: "✓" !important; position: absolute !important; left: 16px !important; top: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; width: 18px !important; height: 18px !important; transform: translateY(-50%) !important; background: transparent !important; color: #111111 !important; font-size: 13px !important; line-height: 1 !important; font-weight: 900 !important; opacity: 1 !important; pointer-events: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a[data-vita-checked="0"] { background: #ffffff !important; color: #333333 !important; font-weight: 400 !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a[data-vita-checked="0"]::after { content: none !important; display: none !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a span { position: absolute !important; right: 12px !important; top: 50% !important; max-width: 44px !important; margin: 0 !important; padding: 0 !important; transform: translateY(-50%) !important; background: transparent !important; color: inherit !important; border: none !important; font-size: inherit !important; line-height: 1 !important; font-weight: inherit !important; white-space: nowrap !important; pointer-events: none !important; } .vita-mobile-filter-modal-footer { display: flex !important; align-items: center !important; gap: 10px !important; flex: 0 0 auto !important; width: 100% !important; margin: 0 !important; padding: 14px 16px !important; background: #ffffff !important; border-top: 1px solid #eeeeee !important; border-radius: 0 0 28px 28px !important; box-shadow: 0 -8px 22px rgba(17, 17, 17, 0.06) !important; } .vita-mobile-filter-reset, .vita-mobile-filter-apply { min-height: 52px !important; margin: 0 !important; padding: 12px 18px !important; border-radius: 999px !important; box-shadow: none !important; outline: none !important; font-family: inherit !important; font-size: 15px !important; line-height: 1 !important; font-weight: 800 !important; cursor: pointer !important; } .vita-mobile-filter-reset { flex: 0 0 auto !important; background: #ffffff !important; color: #111111 !important; border: 2px solid #ffcc26 !important; } .vita-mobile-filter-apply { flex: 1 1 auto !important; background: #ffcc26 !important; color: #111111 !important; border: 2px solid #ffcc26 !important; } /* Никаких глобальных правил для ul.products и li.product */ html.vita-filter-resetting ul.products.vita-products-loading, html.vita-filter-resetting .vita-products-loading { opacity: 1 !important; filter: none !important; } } @media (max-width: 767px) { .vita-mobile-filter-toolbar > .vita-mobile-filter-trigger, .vita-mobile-filter-toolbar > form.woocommerce-ordering { min-height: 58px !important; } .vita-mobile-filter-modal { top: 0 !important; left: 0 !important; bottom: 0 !important; width: calc(100vw - 12px) !important; max-width: calc(100vw - 12px) !important; border-radius: 0 24px 24px 0 !important; border-left: none !important; } .vita-mobile-filter-modal-header { min-height: 66px !important; padding: 12px 14px !important; border-radius: 0 24px 0 0 !important; } .vita-mobile-filter-modal-title { font-size: 20px !important; } .vita-mobile-filter-close { width: 38px !important; height: 38px !important; min-width: 38px !important; font-size: 25px !important; } .vita-mobile-filter-modal-body { padding: 12px !important; } .vita-mobile-filter-modal-body .elementor-widget-heading .elementor-heading-title { min-height: 78px !important; padding: 14px !important; font-size: 18px !important; } .vita-mobile-filter-modal-body .woolentor-filter-wrap ul li > a { min-height: 48px !important; padding: 12px 46px 12px 44px !important; font-size: 14px !important; } .vita-mobile-filter-modal-footer { padding: 12px !important; border-radius: 0 0 24px 0 !important; } .vita-mobile-filter-reset { flex: 0 0 118px !important; } .vita-mobile-filter-apply { min-width: 0 !important; } } @media (min-width: 1025px) { .vita-mobile-filter-trigger, .vita-mobile-filter-overlay, .vita-mobile-filter-modal { display: none !important; } } /* ========================================================= */ /* 14. TOOLBAR ДЛЯ ПЛАНШЕТА И МОБИЛЬНОГО — CLEAN FINAL */ /* JS размещает toolbar в широком контейнере виджета. */ /* Порядок: результат → сортировка → фильтр → товары. */ /* ========================================================= */ @media (max-width: 1024px) { .vita-shop-toolbar.vita-mobile-filter-toolbar, .vita-mobile-filter-toolbar { position: relative !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 0 14px !important; padding: 0 !important; gap: 10px !important; float: none !important; clear: both !important; overflow: visible !important; box-sizing: border-box !important; z-index: 30 !important; } .vita-mobile-filter-toolbar::before, .vita-mobile-filter-toolbar::after { content: none !important; display: none !important; } /* Количество результатов */ .vita-mobile-filter-toolbar > .woocommerce-result-count { order: 1 !important; display: block !important; float: none !important; clear: none !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 0 8px !important; padding: 0 !important; color: #111111 !important; font-size: 14px !important; line-height: 1.4 !important; font-weight: 500 !important; text-align: center !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; } /* Оболочка сортировки */ .vita-mobile-filter-toolbar > form.woocommerce-ordering { order: 2 !important; position: relative !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 50px !important; min-height: 50px !important; max-height: 50px !important; margin: 0 !important; padding: 0 !important; float: none !important; clear: none !important; background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; box-sizing: border-box !important; } .vita-mobile-filter-toolbar > form.woocommerce-ordering::before, .vita-mobile-filter-toolbar > form.woocommerce-ordering::after { content: none !important; display: none !important; } /* Нативный select */ .vita-mobile-filter-toolbar > form.woocommerce-ordering > select.orderby { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 50px !important; min-height: 50px !important; max-height: 50px !important; margin: 0 !important; padding: 0 48px 0 20px !important; background-color: #ffffff !important; color: #111111 !important; border: 2px solid #ffcc26 !important; border-radius: 999px !important; box-shadow: none !important; outline: none !important; font-family: inherit !important; font-size: 15px !important; line-height: normal !important; font-weight: 700 !important; appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23111111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 20px center !important; background-size: 12px 8px !important; box-sizing: border-box !important; cursor: pointer !important; } /* Кастомная сортировка */ .vita-mobile-filter-toolbar .vita-sort, .vita-mobile-filter-toolbar .vita-custom-sort { position: relative !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 50px !important; min-height: 50px !important; max-height: 50px !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; overflow: visible !important; box-sizing: border-box !important; } .vita-mobile-filter-toolbar button.vita-sort__trigger, .vita-mobile-filter-toolbar button.vita-sort-trigger { display: flex !important; align-items: center !important; justify-content: space-between !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 50px !important; min-height: 50px !important; max-height: 50px !important; margin: 0 !important; padding: 0 20px !important; background: #ffffff !important; color: #111111 !important; border: 2px solid #ffcc26 !important; border-radius: 999px !important; box-shadow: none !important; outline: none !important; font-family: inherit !important; font-size: 15px !important; line-height: 1 !important; font-weight: 700 !important; text-align: left !important; box-sizing: border-box !important; cursor: pointer !important; } /* Закрытый список сортировки не занимает место */ .vita-mobile-filter-toolbar .vita-sort:not(.is-open) > .vita-sort__dropdown, .vita-mobile-filter-toolbar .vita-sort__dropdown[hidden], .vita-mobile-filter-toolbar .vita-sort__dropdown[aria-hidden="true"] { display: none !important; position: absolute !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; } /* Открытый список поверх товаров */ .vita-mobile-filter-toolbar .vita-sort.is-open > .vita-sort__dropdown, .vita-mobile-filter-toolbar .vita-sort-menu, .vita-mobile-filter-toolbar .vita-sort-options, .vita-mobile-filter-toolbar [role="listbox"] { position: absolute !important; top: calc(100% + 8px) !important; left: 0 !important; right: 0 !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; z-index: 1000 !important; } /* Кнопка фильтра */ .vita-mobile-filter-toolbar > button.vita-mobile-filter-trigger, .vita-mobile-filter-toolbar > .vita-mobile-filter-trigger { order: 3 !important; position: relative !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 11px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: 50px !important; min-height: 50px !important; max-height: 50px !important; margin: 0 !important; padding: 0 20px !important; float: none !important; clear: none !important; background: #ffffff !important; color: #111111 !important; border: 2px solid #ffcc26 !important; border-radius: 999px !important; box-shadow: none !important; outline: none !important; font-family: inherit !important; font-size: 15px !important; line-height: 1 !important; font-weight: 700 !important; text-align: left !important; transform: none !important; box-sizing: border-box !important; cursor: pointer !important; } .vita-mobile-filter-trigger:hover, .vita-mobile-filter-trigger:focus, .vita-mobile-filter-trigger:active, .vita-mobile-filter-trigger[aria-expanded="true"] { background: #ffffff !important; color: #111111 !important; border-color: #ffcc26 !important; box-shadow: none !important; outline: none !important; } .vita-mobile-filter-trigger-label { display: inline-flex !important; align-items: center !important; gap: 11px !important; min-width: 0 !important; font-family: inherit !important; font-size: 15px !important; line-height: 1 !important; font-weight: 700 !important; } .vita-mobile-filter-trigger-icon { position: relative !important; display: inline-block !important; flex: 0 0 24px !important; width: 24px !important; height: 18px !important; } .vita-mobile-filter-trigger-icon::before, .vita-mobile-filter-trigger-icon::after, .vita-mobile-filter-trigger-icon span { content: "" !important; position: absolute !important; left: 0 !important; display: block !important; width: 24px !important; height: 2px !important; background: #111111 !important; border-radius: 999px !important; } .vita-mobile-filter-trigger-icon::before { top: 0 !important; } .vita-mobile-filter-trigger-icon span { top: 8px !important; } .vita-mobile-filter-trigger-icon::after { top: 16px !important; } .vita-mobile-filter-trigger-arrow { display: none !important; } /* Товары сразу после панели */ .woocommerce ul.products, .woocommerce-page ul.products, .elementor-widget-woocommerce-products ul.products, .elementor-widget-woolentor-product-grid ul.products, .elementor-widget-wl-product-grid ul.products, ul.products.vita-products-after-toolbar { float: none !important; clear: none !important; position: relative !important; top: auto !important; margin-top: 0 !important; padding-top: 0 !important; transform: none !important; } } @media (max-width: 767px) { .vita-shop-toolbar.vita-mobile-filter-toolbar, .vita-mobile-filter-toolbar { margin-bottom: 12px !important; gap: 8px !important; } .vita-mobile-filter-toolbar > form.woocommerce-ordering, .vita-mobile-filter-toolbar > form.woocommerce-ordering > select.orderby, .vita-mobile-filter-toolbar .vita-sort, .vita-mobile-filter-toolbar .vita-custom-sort, .vita-mobile-filter-toolbar button.vita-sort__trigger, .vita-mobile-filter-toolbar button.vita-sort-trigger, .vita-mobile-filter-toolbar > button.vita-mobile-filter-trigger, .vita-mobile-filter-toolbar > .vita-mobile-filter-trigger { height: 48px !important; min-height: 48px !important; max-height: 48px !important; } .vita-mobile-filter-toolbar > form.woocommerce-ordering > select.orderby { padding-left: 16px !important; padding-right: 42px !important; background-position: right 16px center !important; } .vita-mobile-filter-toolbar button.vita-sort__trigger, .vita-mobile-filter-toolbar button.vita-sort-trigger, .vita-mobile-filter-toolbar > button.vita-mobile-filter-trigger, .vita-mobile-filter-toolbar > .vita-mobile-filter-trigger { padding-left: 16px !important; padding-right: 16px !important; } } /* ========================================================= */ /* 21. РОЗТЯГНУТІ ТОВАРИ НА ДЕСКТОПІ — V27 */ /* Контейнер каталогу: 1280 px */ /* Ліва колонка фільтрів: 415 px */ /* Права колонка товарів: приблизно 841 px */ /* 3 однакові картки: приблизно 264 px кожна */ /* ========================================================= */ @media (min-width: 1025px) { /* * Розтягуємо весь ряд «фільтри + товари» до 1280 px. * На скріншоті він займав приблизно 1020 px, тому * корисна ширина каталогу збільшується приблизно на 260 px. */ .elementor-container:has(> .vita-filter-column), .e-con-inner:has(> .vita-filter-column), .e-con:has(> .vita-filter-column) { width: 100% !important; max-width: 1280px !important; margin-left: auto !important; margin-right: auto !important; } /* * Фіксуємо ширину фільтра і віддаємо весь вільний простір * правій колонці з товарами. */ .elementor-container:has(> .vita-filter-column), .e-con-inner:has(> .vita-filter-column) { display: grid !important; grid-template-columns: 415px minmax(0, 1fr) !important; column-gap: 24px !important; align-items: start !important; } .vita-filter-column { width: 415px !important; max-width: 415px !important; min-width: 415px !important; flex: 0 0 415px !important; } .elementor-container:has(> .vita-filter-column) > :not(.vita-filter-column), .e-con-inner:has(> .vita-filter-column) > :not(.vita-filter-column) { width: 100% !important; max-width: none !important; min-width: 0 !important; flex: 1 1 auto !important; } /* * Три рівні колонки товарів без старих float та * відсоткової ширини WooCommerce. */ .elementor-container:has(> .vita-filter-column) > :not(.vita-filter-column) ul.products, .e-con-inner:has(> .vita-filter-column) > :not(.vita-filter-column) ul.products { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 28px 24px !important; width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } .elementor-container:has(> .vita-filter-column) > :not(.vita-filter-column) ul.products > li.product, .e-con-inner:has(> .vita-filter-column) > :not(.vita-filter-column) ul.products > li.product { float: none !important; clear: none !important; width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; } /* Панель результатів і сортування також займає всю ширину товарів. */ .elementor-container:has(> .vita-filter-column) > :not(.vita-filter-column) .vita-shop-toolbar, .elementor-container:has(> .vita-filter-column) > :not(.vita-filter-column) .vita-mobile-filter-toolbar, .e-con-inner:has(> .vita-filter-column) > :not(.vita-filter-column) .vita-shop-toolbar, .e-con-inner:has(> .vita-filter-column) > :not(.vita-filter-column) .vita-mobile-filter-toolbar { width: 100% !important; max-width: none !important; } } /* ========================================================= */ /* ТОЧНЫЙ ФИКС ШИРИНЫ ПО COMPUTED DEVTOOLS — FINAL */ /* Убирает 300px, flex-basis:300px и margin-left:416px */ /* ========================================================= */ @media (max-width: 1024px) { .vita-shop-toolbar.vita-mobile-filter-toolbar { display: flex !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } .vita-shop-toolbar.vita-mobile-filter-toolbar > form.woocommerce-ordering.vita-ordering-ready, .vita-shop-toolbar.vita-mobile-filter-toolbar > form.woocommerce-ordering, .vita-shop-toolbar.vita-mobile-filter-toolbar .vita-sort, .vita-shop-toolbar.vita-mobile-filter-toolbar button.vita-sort__trigger, .vita-shop-toolbar.vita-mobile-filter-toolbar button.vita-sort-trigger, .vita-shop-toolbar.vita-mobile-filter-toolbar > button.vita-mobile-filter-trigger, .vita-shop-toolbar.vita-mobile-filter-toolbar > .vita-mobile-filter-trigger { position: relative !important; left: auto !important; right: auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 100% !important; flex-basis: 100% !important; margin-left: 0 !important; margin-right: 0 !important; transform: none !important; box-sizing: border-box !important; } .vita-shop-toolbar.vita-mobile-filter-toolbar > form.woocommerce-ordering.vita-ordering-ready { align-self: stretch !important; } .vita-shop-toolbar.vita-mobile-filter-toolbar .vita-sort { align-self: stretch !important; } .vita-shop-toolbar.vita-mobile-filter-toolbar button.vita-sort__trigger, .vita-shop-toolbar.vita-mobile-filter-toolbar > button.vita-mobile-filter-trigger { display: flex !important; } }/* End custom CSS */ /* Start custom CSS for woocommerce-products, class: .elementor-element-58d328b8 *//* ========================================================= VITA — ОЧИЩЕННЫЙ ФИНАЛЬНЫЙ CSS Вставлять в Custom CSS нужного контейнера Elementor ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 { --vita-yellow: #ffcc26; --vita-yellow-dark: #f2be00; --vita-black: #111; --vita-title: #222; --vita-text: #333; } /* ========================================================= КАРТОЧКИ ТОВАРОВ ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products li.product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product { position: relative !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; height: 100% !important; transform: none !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products li.product:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .product:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product:hover { transform: none !important; box-shadow: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products li.product:hover img, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .product:hover img, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item:hover img, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product:hover img, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product:hover img { transform: none !important; filter: none !important; opacity: 1 !important; } /* ========================================================= НАЗВАНИЕ, ОПИСАНИЕ И ЦЕНА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-loop-product__title a { min-height: 42px !important; margin: 14px 10px 6px !important; padding: 0 !important; color: var(--vita-title) !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.15 !important; text-align: center !important; text-decoration: none !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-product-short-description { display: -webkit-box !important; width: 100% !important; min-height: 62px !important; margin: 4px 0 8px !important; padding: 0 14px !important; overflow: hidden !important; box-sizing: border-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 3 !important; color: var(--vita-text) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.4 !important; text-align: center !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-product-short-description p { margin: 0 !important; padding: 0 !important; color: inherit !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .price { display: block !important; min-height: 28px !important; margin: 0 0 8px !important; color: var(--vita-black) !important; font-size: 19px !important; font-weight: 800 !important; line-height: 1.25 !important; text-align: center !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .price *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-Price-amount, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-Price-currencySymbol { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .price del { font-size: 15px !important; font-weight: 500 !important; opacity: .55 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .price ins { text-decoration: none !important; } /* Текст карточки не меняется при наведении */ .elementor-9800 .elementor-element.elementor-element-58d328b8 a:hover .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 a:hover .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 a:hover .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-loop-product__title:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-product-short-description:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .price:hover { color: inherit !important; background: transparent !important; text-decoration: none !important; transform: none !important; opacity: 1 !important; } /* ========================================================= БЛОК ВАРИАЦИЙ ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variations { position: relative !important; z-index: 20 !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-wrap: wrap !important; gap: 8px !important; min-height: 0 !important; margin: 10px 0 12px !important; padding: 0 !important; pointer-events: auto !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn { position: relative !important; z-index: 30 !important; isolation: isolate !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 76px !important; min-width: 76px !important; height: 82px !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--vita-black) !important; cursor: pointer !important; outline: none !important; pointer-events: auto !important; transition: transform .18s ease !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn::before { content: "" !important; position: absolute !important; z-index: 2 !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important; background-color: transparent !important; pointer-events: none !important; opacity: 1 !important; filter: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn::after { content: none !important; display: none !important; } /* Общий текст веса */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn .vita-weight-label { position: absolute !important; z-index: 3 !important; left: 50% !important; top: 52% !important; display: flex !important; align-items: center !important; justify-content: center !important; width: 52px !important; height: 20px !important; margin: 0 !important; padding: 0 !important; transform: translate(-50%, -50%) !important; color: var(--vita-black) !important; font-size: 12px !important; font-weight: 800 !important; line-height: 1 !important; text-align: center !important; white-space: nowrap !important; pointer-events: none !important; } /* ========================================================= УПАКОВКА 1КГ / 1.5КГ ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack::before { width: 68px !important; height: 76px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 100'%3E%3Cpath d='M8 8H80V18H8Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 18C8 27 17 31 19 41V69C17 79 8 83 8 92H80C80 83 71 79 69 69V41C71 31 80 27 80 18Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 82H80V92H8Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack .vita-weight-label { top: 52% !important; width: 50px !important; } /* ========================================================= МЕШОК 20КГ / 25КГ ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag::before { width: 70px !important; height: 76px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 76'%3E%3Cpath d='M21 5h22c4 0 7 3 8 7l8 51c1 5-3 9-8 9H13c-5 0-9-4-8-9l8-51c1-4 4-7 8-7Z' fill='none' stroke='%23ffcc26' stroke-width='2.4' stroke-linejoin='round'/%3E%3Crect x='24' y='11' width='16' height='7' rx='3.5' fill='none' stroke='%23ffcc26' stroke-width='2.2'/%3E%3C/svg%3E") !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag .vita-weight-label { top: 53% !important; width: 52px !important; } /* ========================================================= БУТЫЛКИ МАСЛА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-small, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-large { width: 84px !important; min-width: 84px !important; height: 96px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-small::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-large::before { width: 72px !important; height: 88px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-small::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 82 100'%3E%3Cpath d='M34 3h14v10H34zM31 13h20v10c0 3 1 5 4 8 5 5 8 11 8 18v38c0 6-4 10-10 10H29c-6 0-10-4-10-10V49c0-7 3-13 8-18 3-3 4-5 4-8z' fill='none' stroke='%23ffcc26' stroke-width='2.8' stroke-linejoin='round'/%3E%3Cpath d='M21 48h40M21 55h40M24 78h34M24 85h34' fill='none' stroke='%23ffcc26' stroke-width='2.8'/%3E%3C/svg%3E") !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-large::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 82 100'%3E%3Cpath d='M33 3h16v10H33zM29 13h24v10c0 3 2 5 5 8 6 5 10 12 10 20v35c0 7-5 11-12 11H26c-7 0-12-4-12-11V51c0-8 4-15 10-20 3-3 5-5 5-8z' fill='none' stroke='%23ffcc26' stroke-width='2.8' stroke-linejoin='round'/%3E%3Cpath d='M17 47h48M16 55h50M20 77h42M20 85h42' fill='none' stroke='%23ffcc26' stroke-width='2.8'/%3E%3C/svg%3E") !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-small .vita-weight-label, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-large .vita-weight-label { top: 56px !important; width: 42px !important; font-size: 12px !important; } /* ========================================================= HOVER / ACTIVE ДЛЯ ИКОНОК ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-hovered { transform: translateY(-1px) !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn:active { transform: scale(.98) !important; } /* Упаковка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack:hover::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack.vita-hovered::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack.is-active::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack:focus-visible::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 100'%3E%3Cpath d='M8 8H80V18H8Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 18C8 27 17 31 19 41V69C17 79 8 83 8 92H80C80 83 71 79 69 69V41C71 31 80 27 80 18Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 82H80V92H8Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } /* Мешок */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag:hover::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag.vita-hovered::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag.is-active::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag:focus-visible::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 76'%3E%3Cpath d='M21 5h22c4 0 7 3 8 7l8 51c1 5-3 9-8 9H13c-5 0-9-4-8-9l8-51c1-4 4-7 8-7Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.4' stroke-linejoin='round'/%3E%3Crect x='24' y='11' width='16' height='7' rx='3.5' fill='%23fff' stroke='%23f2be00' stroke-width='2.2'/%3E%3C/svg%3E") !important; } /* Бутылки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-small:hover::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-small.vita-hovered::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 82 100'%3E%3Cpath d='M34 3h14v10H34zM31 13h20v10c0 3 1 5 4 8 5 5 8 11 8 18v38c0 6-4 10-10 10H29c-6 0-10-4-10-10V49c0-7 3-13 8-18 3-3 4-5 4-8z' fill='%23ffcc26' stroke='%23ffcc26' stroke-width='2.8' stroke-linejoin='round'/%3E%3Cpath d='M21 48h40M21 55h40M24 78h34M24 85h34' fill='none' stroke='%23f2be00' stroke-width='2.2'/%3E%3C/svg%3E") !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-large:hover::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-weight-oil-large.vita-hovered::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 82 100'%3E%3Cpath d='M33 3h16v10H33zM29 13h24v10c0 3 2 5 5 8 6 5 10 12 10 20v35c0 7-5 11-12 11H26c-7 0-12-4-12-11V51c0-8 4-15 10-20 3-3 5-5 5-8z' fill='%23ffcc26' stroke='%23ffcc26' stroke-width='2.8' stroke-linejoin='round'/%3E%3Cpath d='M17 47h48M16 55h50M20 77h42M20 85h42' fill='none' stroke='%23f2be00' stroke-width='2.2'/%3E%3C/svg%3E") !important; } /* ========================================================= КНОПКА «ПЕРЕГЛЯНУТИ» ВАЖНО: стилизуем только кастомную кнопку, а не все .button ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-wrap { display: flex !important; justify-content: center !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 128px !important; max-width: max-content !important; min-height: 38px !important; height: auto !important; margin: 0 auto 18px !important; padding: 8px 20px !important; border: 1.5px solid var(--vita-yellow) !important; border-radius: 999px !important; background: #fff !important; color: var(--vita-black) !important; box-shadow: none !important; outline: none !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1 !important; text-align: center !important; text-decoration: none !important; white-space: nowrap !important; opacity: 1 !important; transform: none !important; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn::after { content: none !important; display: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:focus-visible, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn.vita-hovered { background: var(--vita-yellow) !important; border-color: var(--vita-yellow) !important; color: var(--vita-black) !important; transform: translateY(-1px) !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:active { transform: scale(.98) !important; } /* Стандартные кнопки WooCommerce в карточке скрываем. Остаётся только кастомная .vita-view-product-btn */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products li.product > a.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products li.product > button.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .product > a.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .product > button.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item > a.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item > button.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product > a.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product > button.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product > a.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product > button.button:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 a.product_type_simple:not(.vita-view-product-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 a.product_type_variable:not(.vita-view-product-btn) { display: none !important; } /* Кастомная кнопка всегда обычного размера */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-wrap { position: static !important; flex: 0 0 auto !important; align-self: stretch !important; order: 99 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn { position: static !important; flex: 0 0 auto !important; align-self: center !important; width: auto !important; min-width: 128px !important; max-width: max-content !important; height: 38px !important; min-height: 38px !important; max-height: 38px !important; margin: 0 auto 18px !important; } /* Иконки веса перед кнопкой */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variations { flex: 0 0 auto !important; align-self: stretch !important; order: 98 !important; } /* ========================================================= КАСТОМНАЯ СОРТИРОВКА — ФИНАЛЬНЫЙ ФИКС ========================================================= */ /* Верхняя строка: счётчик слева, сортировка справа */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .elementor-widget-container { overflow: visible !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .elementor-widget-container::after { content: "" !important; display: block !important; clear: both !important; } /* Счётчик результатов */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-result-count { float: left !important; clear: none !important; display: block !important; width: auto !important; margin: 0 20px 24px 0 !important; padding: 0 !important; color: var(--vita-text) !important; line-height: 48px !important; } /* Форма сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { position: relative !important; z-index: 1000 !important; float: right !important; clear: none !important; display: block !important; width: 300px !important; max-width: 100% !important; min-height: 48px !important; margin: 0 0 24px auto !important; padding: 0 !important; overflow: visible !important; box-sizing: border-box !important; transform: none !important; } /* Обычный select — отображается корректно, пока JS ещё не создал кастомный список */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering select.orderby { display: block !important; width: 100% !important; height: 48px !important; margin: 0 !important; padding: 0 48px 0 18px !important; border: 2px solid var(--vita-yellow) !important; border-radius: 999px !important; background-color: #fff !important; color: var(--vita-black) !important; box-shadow: none !important; outline: none !important; font-size: 14px !important; font-weight: 700 !important; line-height: 48px !important; box-sizing: border-box !important; cursor: pointer !important; } /* Скрываем исходный select только после инициализации кастомной сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; top: 0 !important; width: 1px !important; height: 1px !important; padding: 0 !important; border: 0 !important; opacity: 0 !important; pointer-events: none !important; } /* Обёртка кастомной сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort { position: relative !important; z-index: 1001 !important; display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; } /* Кнопка открытия */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger { display: flex !important; align-items: center !important; justify-content: space-between !important; width: 100% !important; height: 48px !important; min-height: 48px !important; margin: 0 !important; padding: 0 18px !important; border: 2px solid var(--vita-yellow) !important; border-radius: 999px !important; background: #fff !important; color: var(--vita-black) !important; box-shadow: none !important; outline: none !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1 !important; text-align: left !important; box-sizing: border-box !important; cursor: pointer !important; transform: none !important; } /* Hover/focus */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger:focus-visible, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort.is-open .vita-sort__trigger { background: #fff !important; border-color: var(--vita-yellow-dark) !important; color: var(--vita-black) !important; box-shadow: 0 0 0 3px rgba(255, 204, 38, .14) !important; } /* Стрелка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__arrow { flex: 0 0 9px !important; width: 9px !important; height: 9px !important; margin-left: 14px !important; border-right: 2px solid var(--vita-black) !important; border-bottom: 2px solid var(--vita-black) !important; transform: translateY(-2px) rotate(45deg) !important; transition: transform .18s ease !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort.is-open .vita-sort__arrow { transform: translateY(2px) rotate(225deg) !important; } /* Выпадающий список — строго под кнопкой */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__dropdown { position: absolute !important; z-index: 99999 !important; top: calc(100% + 6px) !important; left: 0 !important; right: auto !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 8px !important; overflow: hidden !important; border: 2px solid var(--vita-yellow) !important; border-radius: 18px !important; background: #fff !important; box-shadow: 0 12px 28px rgba(0, 0, 0, .14) !important; box-sizing: border-box !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: translateY(-6px) !important; transition: opacity .18s ease, visibility .18s ease, transform .18s ease !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort.is-open .vita-sort__dropdown { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: translateY(0) !important; } /* Пункты списка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__item { display: flex !important; align-items: center !important; width: 100% !important; min-height: 42px !important; margin: 0 !important; padding: 10px 12px !important; border: 0 !important; border-radius: 12px !important; background: #fff !important; color: var(--vita-black) !important; box-shadow: none !important; outline: none !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.2 !important; text-align: left !important; box-sizing: border-box !important; cursor: pointer !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__item + .vita-sort__item { margin-top: 3px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__item:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__item:focus-visible { background: rgba(255, 204, 38, .22) !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__item.is-selected { background: var(--vita-yellow) !important; color: var(--vita-black) !important; font-weight: 700 !important; } /* Товары всегда начинаются ниже строки сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products ul.products { clear: both !important; width: 100% !important; } /* Мобильная версия */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-result-count, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { float: none !important; clear: both !important; width: 100% !important; max-width: 100% !important; margin: 0 0 14px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-result-count { line-height: 1.4 !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__dropdown { border-radius: 16px !important; } } /* ========================================================= АВАРИЙНЫЙ ФИКС: УБИРАЕМ БОЛЬШОЙ ОВАЛ СПРАВА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .product, .elementor-9800 .elementor-element.elementor-element-58d328b8 li.product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product { grid-template-columns: 1fr !important; grid-template-areas: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .product > *, .elementor-9800 .elementor-element.elementor-element-58d328b8 li.product > *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item > *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product > *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product > * { grid-column: 1 !important; width: auto !important; max-width: 100% !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-wrap, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn { writing-mode: horizontal-tb !important; transform: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn { display: inline-flex !important; width: auto !important; min-width: 128px !important; max-width: max-content !important; height: 38px !important; min-height: 38px !important; max-height: 38px !important; padding: 8px 20px !important; border-radius: 999px !important; } /* ========================================================= ТЕКСТ И ЦЕНА ВСЕГДА ЧЁРНЫЕ Hover кнопки веса не влияет на текст карточки ========================================================= */ /* Название товара */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-loop-product__title a, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product:hover .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product:hover .woocommerce-loop-product__title a, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item:hover .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product:hover .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product:hover .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 a:hover .woocommerce-loop-product__title { color: #111 !important; opacity: 1 !important; text-decoration: none !important; background: transparent !important; transform: none !important; } /* Короткое описание */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-product-short-description p, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product:hover .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product:hover .vita-product-short-description p, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item:hover .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product:hover .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product:hover .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 a:hover .vita-product-short-description { color: #111 !important; opacity: 1 !important; text-decoration: none !important; background: transparent !important; transform: none !important; } /* Цена */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 .price *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-Price-amount, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-Price-currencySymbol, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product:hover .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product:hover .price *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item:hover .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product:hover .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product:hover .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 a:hover .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 a:hover .price * { color: #111 !important; opacity: 1 !important; text-decoration: none !important; background: transparent !important; transform: none !important; } /* Даже когда наведена, выбрана или нажата кнопка веса */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn:hover ~ .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn:hover ~ .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn:hover ~ .price, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.is-active ~ .woocommerce-loop-product__title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.is-active ~ .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.is-active ~ .price { color: #111 !important; } /* Убираем цвет ссылки, который может наследоваться от темы */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .product a:not(.vita-view-product-btn):not(.vita-card-variation-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .product a:not(.vita-view-product-btn):not(.vita-card-variation-btn):hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item a:not(.vita-view-product-btn):not(.vita-card-variation-btn), .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item a:not(.vita-view-product-btn):not(.vita-card-variation-btn):hover { color: #111 !important; } /* ========================================================= HOVER ДЛЯ «ПЕРЕГЛЯНУТИ» КАК У КНОПОК ВЕСА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn { background: #fff !important; border: 1.5px solid #ffcc26 !important; color: #111 !important; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important; } /* Наведение мышкой + класс из JS */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn.vita-hovered, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:focus-visible { background: #ffcc26 !important; border-color: #f2be00 !important; color: #111 !important; transform: translateY(-1px) !important; } /* Нажатие */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:active { background: #ffcc26 !important; border-color: #f2be00 !important; color: #111 !important; transform: scale(.98) !important; } /* Текст внутри кнопки не меняет цвет отдельно */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:hover *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn.vita-hovered *, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-view-product-btn:focus-visible * { color: #111 !important; } /* Пагинация справа */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-pagination, .elementor-9800 .elementor-element.elementor-element-58d328b8 nav.woocommerce-pagination { display: flex !important; justify-content: flex-end !important; width: 100% !important; text-align: right !important; } /* Сам список страниц прижимаем вправо */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-pagination ul, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-pagination ul.page-numbers { margin-left: auto !important; margin-right: 0 !important; } /* ========================================================= УПАКОВКА 1.5КГ — НЕМНОГО ШИРЕ variation ID: 4409 ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack[data-variation-id="4409"] { width: 82px !important; min-width: 82px !important; } /* Расширяем только изображение упаковки 1.5кг */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack[data-variation-id="4409"]::before { width: 90px !important; height: 79px !important; } /* Надпись оставляем строго по центру */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack[data-variation-id="4409"] .vita-weight-label { left: 50% !important; width: 58px !important; transform: translate(-50%, -50%) !important; } /* ========================================================= ФИНАЛЬНЫЕ БУТЫЛКИ 0,9Л И 3Л Крупнее, с правильными пропорциями: 0,9л меньше, 3л заметно больше. Изначально контурные, при hover/active — жёлтая заливка. ========================================================= */ /* Общая зона кнопок */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"], .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"] { width: 84px !important; min-width: 84px !important; height: 94px !important; padding: 0 !important; overflow: visible !important; } /* ========================================================= БУТЫЛКА 0,9Л ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"]::before { width: 58px !important; height: 78px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 94'%3E%3Cpath d='M28 3H40V12H28Z' fill='none' stroke='%23ffcc26' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M25 12H43V21C43 25 46 28 50 32C55 37 58 44 58 52V80C58 86 54 90 48 90H20C14 90 10 86 10 80V52C10 44 13 37 18 32C22 28 25 25 25 21Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M18 34H50M17 40H51M19 76H49M20 82H48' fill='none' stroke='%23ffcc26' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"] .vita-weight-label { left: 50% !important; top: 62% !important; width: 44px !important; height: 20px !important; transform: translate(-50%, -50%) !important; color: #111 !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1 !important; } /* Hover / active 0,9л */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"]:hover::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"].vita-hovered::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"].is-active::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"]:focus-visible::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 94'%3E%3Cpath d='M28 3H40V12H28Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M25 12H43V21C43 25 46 28 50 32C55 37 58 44 58 52V80C58 86 54 90 48 90H20C14 90 10 86 10 80V52C10 44 13 37 18 32C22 28 25 25 25 21Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M18 34H50M17 40H51M19 76H49M20 82H48' fill='none' stroke='%23f2be00' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; } /* ========================================================= БУТЫЛКА 3Л ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"]::before { width: 68px !important; height: 84px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 78 98'%3E%3Cpath d='M32 3H46V12H32Z' fill='none' stroke='%23ffcc26' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M28 12H50V21C50 25 54 29 58 33C64 39 67 46 67 55V84C67 90 63 94 57 94H21C15 94 11 90 11 84V55C11 46 14 39 20 33C24 29 28 25 28 21Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M20 35H58M19 42H59M21 79H57M22 86H56' fill='none' stroke='%23ffcc26' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"] .vita-weight-label { left: 50% !important; top: 62% !important; width: 46px !important; height: 20px !important; transform: translate(-50%, -50%) !important; color: #111 !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1 !important; } /* Hover / active 3л */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"]:hover::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"].vita-hovered::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"].is-active::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"]:focus-visible::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 78 98'%3E%3Cpath d='M32 3H46V12H32Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M28 12H50V21C50 25 54 29 58 33C64 39 67 46 67 55V84C67 90 63 94 57 94H21C15 94 11 90 11 84V55C11 46 14 39 20 33C24 29 28 25 28 21Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M20 35H58M19 42H59M21 79H57M22 86H56' fill='none' stroke='%23f2be00' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; } /* ========================================================= АВАРИЙНЫЙ ФИНАЛЬНЫЙ ФИКС СОРТИРОВКИ Возвращает рамку, стрелку и правильное положение ========================================================= */ /* Сам блок сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { position: relative !important; z-index: 9999 !important; float: right !important; clear: none !important; display: block !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; height: 48px !important; min-height: 48px !important; margin: 0 0 24px auto !important; padding: 0 !important; overflow: visible !important; opacity: 1 !important; visibility: visible !important; box-sizing: border-box !important; } /* Нативный select виден, пока кастомная сортировка не готова */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering:not(.vita-ordering-ready) select.orderby { position: relative !important; left: auto !important; top: auto !important; display: block !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; height: 48px !important; min-height: 48px !important; margin: 0 !important; padding: 0 48px 0 18px !important; border: 2px solid #ffcc26 !important; border-radius: 999px !important; background-color: #fff !important; color: #111 !important; box-shadow: none !important; outline: none !important; opacity: 1 !important; visibility: visible !important; font-size: 14px !important; font-weight: 700 !important; line-height: 48px !important; appearance: auto !important; -webkit-appearance: menulist !important; -moz-appearance: menulist !important; box-sizing: border-box !important; cursor: pointer !important; } /* После инициализации скрывается только исходный select */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; top: 0 !important; display: block !important; width: 1px !important; min-width: 1px !important; max-width: 1px !important; height: 1px !important; min-height: 1px !important; padding: 0 !important; border: 0 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } /* Кастомный блок */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort { position: relative !important; z-index: 10000 !important; display: block !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; margin: 0 !important; padding: 0 !important; opacity: 1 !important; visibility: visible !important; box-sizing: border-box !important; } /* Кнопка сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger { position: relative !important; display: flex !important; align-items: center !important; justify-content: space-between !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; height: 48px !important; min-height: 48px !important; margin: 0 !important; padding: 0 18px !important; border: 2px solid #ffcc26 !important; border-radius: 999px !important; background: #fff !important; color: #111 !important; box-shadow: none !important; outline: none !important; opacity: 1 !important; visibility: visible !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1 !important; text-align: left !important; box-sizing: border-box !important; cursor: pointer !important; } /* Стрелка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__arrow { display: block !important; flex: 0 0 9px !important; width: 9px !important; height: 9px !important; margin-left: 14px !important; border-right: 2px solid #111 !important; border-bottom: 2px solid #111 !important; transform: translateY(-2px) rotate(45deg) !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open .vita-sort__arrow { transform: translateY(2px) rotate(225deg) !important; } /* Выпадающий список */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__dropdown { position: absolute !important; z-index: 10001 !important; top: 54px !important; left: 0 !important; right: auto !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; margin: 0 !important; padding: 8px !important; border: 2px solid #ffcc26 !important; border-radius: 18px !important; background: #fff !important; box-shadow: 0 12px 28px rgba(0, 0, 0, .14) !important; box-sizing: border-box !important; } /* Товары ниже строки сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products ul.products { clear: both !important; width: 100% !important; } /* Мобильная версия */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering:not(.vita-ordering-ready) select.orderby, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__dropdown { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { float: none !important; clear: both !important; margin: 0 0 14px !important; } } /* ========================================================= СОРТИРОВКА КАК ЕДИНАЯ СЕКЦИЯ Кнопка + выпадающий список визуально объединены ========================================================= */ /* В закрытом состоянии обычная овальная кнопка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger { border-radius: 999px !important; box-shadow: none !important; } /* В открытом состоянии нижние углы у кнопки убираем */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open .vita-sort__trigger { border-radius: 18px 18px 0 0 !important; border-bottom-color: transparent !important; box-shadow: none !important; } /* Список вплотную к кнопке */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__dropdown { top: 46px !important; left: 0 !important; border-top: 0 !important; border-radius: 0 0 18px 18px !important; box-shadow: 0 12px 24px rgba(0, 0, 0, .12) !important; } /* Выбранный пункт */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__item.is-selected { background: #ffcc26 !important; color: #111 !important; font-weight: 700 !important; border-radius: 10px !important; } /* Hover остальных пунктов */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__item:not(.is-selected):hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__item:not(.is-selected):focus-visible { background: rgba(255, 204, 38, .22) !important; color: #111 !important; } /* Убираем визуальный зазор между кнопкой и списком */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open { filter: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open .vita-sort__dropdown { margin-top: 0 !important; transform: none !important; } /* ========================================================= ФИКС ЦВЕТА СОРТИРОВКИ Цвет кнопки не меняется при hover / focus / открытии ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger:focus, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger:focus-visible, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open .vita-sort__trigger { background: #fff !important; border-color: #ffcc26 !important; color: #111 !important; box-shadow: none !important; outline: none !important; } /* Текст внутри кнопки всегда чёрный */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger *, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger:hover *, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger:focus-visible *, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open .vita-sort__trigger * { color: #111 !important; } /* Стрелка всегда чёрная */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__arrow, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger:hover .vita-sort__arrow, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger:focus-visible .vita-sort__arrow, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open .vita-sort__arrow { border-right-color: #111 !important; border-bottom-color: #111 !important; } /* Общая рамка открытой секции остаётся жёлтой */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort.is-open .vita-sort__trigger { border-bottom-color: transparent !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__dropdown { border-color: #ffcc26 !important; } /* Выбранная опция остаётся жёлтой */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__item.is-selected, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__item.is-selected:hover, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__item.is-selected:focus-visible { background: #ffcc26 !important; color: #111 !important; } /* ========================================================= СООБЩЕНИЕ «ТОВАР НЕ НАЙДЕН» ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { position: relative !important; clear: both !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; float: none !important; grid-column: 1 / -1 !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; min-height: 150px !important; margin: 10px auto 40px !important; padding: 20px !important; box-sizing: border-box !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title { display: block !important; width: 100% !important; margin: 0 0 8px !important; padding: 0 !important; color: #555 !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.4 !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { display: block !important; width: 100% !important; max-width: 700px !important; margin: 0 auto !important; padding: 0 !important; color: #555 !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.45 !important; text-align: center !important; } /* Убираем стандартное сообщение WooCommerce */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-no-products-found { display: none !important; } @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { min-height: 120px !important; margin: 10px auto 30px !important; padding: 15px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { font-size: 15px !important; } } /* ========================================================= СООБЩЕНИЕ ПУСТОГО РЕЗУЛЬТАТА ПО ЦЕНТРУ ОБЛАСТИ ТОВАРОВ ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { position: relative !important; clear: both !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 260px !important; margin: 0 auto !important; padding: 20px !important; text-align: center !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { width: 100% !important; max-width: 700px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title { margin-top: 0 !important; margin-bottom: 8px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { margin-top: 0 !important; margin-bottom: 0 !important; } /* ========================================================= ФИКС: СОРТИРОВКА НЕ УХОДИТ В ХЕДЕР ========================================================= */ /* Родитель сортировки создаёт отдельный контекст */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .elementor-widget-container { position: relative !important; display: flow-root !important; overflow: visible !important; } /* Сама сортировка остаётся внутри товарной области */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; float: right !important; clear: none !important; display: block !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; margin: 0 0 24px auto !important; padding: 0 !important; transform: none !important; } /* После строки сортировки товары начинаются ниже */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products ul.products { clear: both !important; width: 100% !important; } /* Дополнительная очистка float */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .elementor-widget-container::after { content: "" !important; display: table !important; clear: both !important; } /* На мобильном сортировка на всю ширину */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { float: none !important; clear: both !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; margin: 0 0 16px !important; } } /* ========================================================= ФИНАЛЬНЫЙ ФИКС ПОЛОЖЕНИЯ СОРТИРОВКИ Сортировка остаётся внутри блока товаров ========================================================= */ /* Основной контейнер товаров */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products > .elementor-widget-container, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .woocommerce, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce { position: relative !important; overflow: visible !important; } /* * Форма занимает отдельную строку. * Float полностью отключён, поэтому сортировка * больше не сможет подняться в область хедера. */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; float: none !important; clear: both !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; min-height: 48px !important; margin: 30px 0 24px !important; padding: 0 !important; overflow: visible !important; box-sizing: border-box !important; z-index: 100 !important; transform: none !important; } /* Кастомная сортировка остаётся шириной 300px */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort { position: relative !important; flex: 0 0 300px !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; margin: 0 !important; } /* Кнопка сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } /* Выпадающий список */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__dropdown { left: 0 !important; right: auto !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; } /* Нативный select до загрузки кастомного JS */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering:not(.vita-ordering-ready) select.orderby { flex: 0 0 300px !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; margin-left: auto !important; } /* Список товаров всегда начинается после сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { float: none !important; clear: both !important; width: 100% !important; } /* Убираем старую очистку через псевдоэлемент */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .elementor-widget-container::after { content: none !important; display: none !important; } /* ========================================================= ПЛАНШЕТ ========================================================= */ @media (max-width: 1024px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { margin-top: 24px !important; } } /* ========================================================= МОБИЛЬНАЯ ВЕРСИЯ ========================================================= */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering { display: block !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; margin: 20px 0 16px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering .vita-sort__dropdown, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering:not(.vita-ordering-ready) select.orderby { width: 100% !important; min-width: 100% !important; max-width: 100% !important; flex-basis: 100% !important; } } /* ========================================================= ФИНАЛЬНАЯ ПАНЕЛЬ: РЕЗУЛЬТАТ + СОРТИРОВКА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { position: relative !important; z-index: 50 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; float: none !important; clear: both !important; width: 100% !important; min-height: 48px !important; margin: 0 0 24px !important; padding: 0 !important; overflow: visible !important; box-sizing: border-box !important; } /* Результат найденных товаров слева */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { position: static !important; display: block !important; float: none !important; clear: none !important; flex: 1 1 auto !important; width: auto !important; margin: 0 !important; padding: 0 !important; line-height: 48px !important; text-align: left !important; } /* Сортировка справа на том же уровне */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; display: block !important; float: none !important; clear: none !important; flex: 0 0 300px !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; height: 48px !important; min-height: 48px !important; margin: 0 !important; padding: 0 !important; z-index: 60 !important; transform: none !important; overflow: visible !important; box-sizing: border-box !important; } /* Кастомный список занимает ширину формы */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__dropdown { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } /* Скрываем нативный select после создания кастомного */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; appearance: none !important; -webkit-appearance: none !important; } /* Убираем стрелки, которые может добавлять тема */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::after { content: none !important; display: none !important; } /* Оставляем только одну кастомную стрелку */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow { display: block !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow ~ .vita-sort__arrow { display: none !important; } /* Нативный select до загрузки JS — только одна стрелка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering:not(.vita-ordering-ready) select.orderby { appearance: auto !important; -webkit-appearance: menulist !important; -moz-appearance: menulist !important; } /* Товары всегда ниже общей панели */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar + ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { float: none !important; clear: both !important; } /* Убираем старые clearfix, которые растягивали блок */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .elementor-widget-container::after { content: none !important; display: none !important; } /* ========================================================= МОБИЛЬНАЯ ВЕРСИЯ ========================================================= */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { width: 100% !important; line-height: 1.4 !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__dropdown, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering:not(.vita-ordering-ready) select.orderby { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } } /* ========================================================= ФИНАЛЬНЫЙ ФИКС: ВЫБИРАЕТСЯ ТОЛЬКО НАЖАТЫЙ ЧЕКБОКС ========================================================= */ /* * Сначала сбрасываем ложное активное состояние, * которое WooLentor назначает через active/selected/current. */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a { background: #ffffff !important; color: #333333 !important; font-weight: 400 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a::before { content: "" !important; display: block !important; background: #ffffff !important; border: 2px solid #ffcc26 !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a::after { content: none !important; display: none !important; } /* * Активным считается ТОЛЬКО пункт, * которому наш JS установил data-vita-checked="1". */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a[data-vita-checked="1"] { background: #fff7d6 !important; color: #111111 !important; font-weight: 700 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::before { content: "" !important; display: block !important; background: #ffcc26 !important; border-color: #ffcc26 !important; opacity: 1 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a[data-vita-checked="1"]::after { content: "✓" !important; position: absolute !important; display: flex !important; align-items: center !important; justify-content: center !important; left: 16px !important; top: 50% !important; width: 17px !important; height: 17px !important; transform: translateY(-50%) !important; background: transparent !important; color: #111111 !important; font-size: 13px !important; font-weight: 900 !important; line-height: 1 !important; opacity: 1 !important; pointer-events: none !important; } /* Неактивный пункт всегда без галочки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a[data-vita-checked="0"] { background: #ffffff !important; color: #333333 !important; font-weight: 400 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a[data-vita-checked="0"]::before { background: #ffffff !important; border-color: #ffcc26 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-filter-wrap ul li > a[data-vita-checked="0"]::after { content: none !important; display: none !important; } /* ========================================================= ФИНАЛЬНОЕ РАСПОЛОЖЕНИЕ ПАНЕЛИ МАГАЗИНА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { position: relative !important; z-index: 20 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; float: none !important; clear: both !important; width: 100% !important; min-height: 48px !important; margin: 0 0 24px !important; padding: 0 !important; overflow: visible !important; box-sizing: border-box !important; } /* Результат слева */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { position: static !important; display: block !important; float: none !important; clear: none !important; flex: 1 1 auto !important; width: auto !important; margin: 0 !important; padding: 0 !important; line-height: 48px !important; text-align: left !important; } /* Сортировка строго справа */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; display: block !important; float: none !important; clear: none !important; flex: 0 0 300px !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; height: 48px !important; min-height: 48px !important; margin: 0 0 0 auto !important; padding: 0 !important; transform: none !important; overflow: visible !important; box-sizing: border-box !important; } /* Кнопка и выпадающий список */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__dropdown { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } /* ========================================================= ТОЛЬКО ОДНА СТРЕЛКА ========================================================= */ /* Убираем стрелки темы */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::after { content: none !important; display: none !important; } /* Нативный select полностью скрывается после инициализации */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; appearance: none !important; -webkit-appearance: none !important; } /* Оставляем только первую кастомную стрелку */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow { display: block !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow ~ .vita-sort__arrow { display: none !important; } /* ========================================================= ПУСТОЙ РЕЗУЛЬТАТ ПО ЦЕНТРУ ТОВАРНОГО КОНТЕЙНЕРА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; float: none !important; clear: both !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; min-height: 300px !important; margin: 0 !important; padding: 30px 20px !important; text-align: center !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { display: block !important; width: 100% !important; max-width: 700px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title { margin-top: 0 !important; margin-bottom: 8px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { margin-top: 0 !important; margin-bottom: 0 !important; } /* Убираем стандартное пустое сообщение */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-no-products-found { display: none !important; } /* ========================================================= МОБИЛЬНАЯ ВЕРСИЯ ========================================================= */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { width: 100% !important; line-height: 1.4 !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__dropdown { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { min-height: 220px !important; padding: 20px 15px !important; } } /* ========================================================= ФИНАЛЬНЫЙ ФИКС ПОСЛЕ ОБНОВЛЕНИЯ JS Панель результатов, сортировка и пустой результат ========================================================= */ /* Основной товарный виджет */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woolentor-product-grid, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-wl-product-grid, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products > .elementor-widget-container, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woolentor-product-grid > .elementor-widget-container, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-wl-product-grid > .elementor-widget-container { position: relative !important; overflow: visible !important; } /* ========================================================= ОБЩАЯ СТРОКА: РЕЗУЛЬТАТ + СОРТИРОВКА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { position: relative !important; z-index: 50 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; float: none !important; clear: both !important; width: 100% !important; min-height: 48px !important; margin: 0 0 24px !important; padding: 0 !important; overflow: visible !important; box-sizing: border-box !important; } /* Количество найденных товаров слева */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { position: static !important; display: block !important; float: none !important; clear: none !important; flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; color: #333 !important; line-height: 48px !important; text-align: left !important; transform: none !important; } /* ========================================================= СОРТИРОВКА СПРАВА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; display: block !important; float: none !important; clear: none !important; flex: 0 0 300px !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; height: 48px !important; min-height: 48px !important; margin: 0 0 0 auto !important; padding: 0 !important; z-index: 100 !important; overflow: visible !important; transform: none !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__dropdown { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } /* ========================================================= УБИРАЕМ ВТОРУЮ СТРЕЛКУ ========================================================= */ /* Стрелки темы и Elementor */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::after { content: none !important; display: none !important; } /* Скрываем нативный select после создания кастомной сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; top: 0 !important; display: block !important; width: 1px !important; min-width: 1px !important; max-width: 1px !important; height: 1px !important; min-height: 1px !important; padding: 0 !important; border: 0 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; } /* Показываем только первую кастомную стрелку */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow { display: block !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow ~ .vita-sort__arrow { display: none !important; } /* ========================================================= ПУСТОЙ РЕЗУЛЬТАТ ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; float: none !important; clear: both !important; grid-column: 1 / -1 !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; min-height: 300px !important; margin: 0 !important; padding: 30px 20px !important; text-align: center !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { display: block !important; width: 100% !important; max-width: 700px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title { margin-top: 0 !important; margin-bottom: 8px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { margin-top: 0 !important; margin-bottom: 0 !important; } /* Стандартное сообщение WooCommerce */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-no-products-found { display: none !important; } /* Товары и сообщение всегда ниже панели */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar + ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woolentor-product-grid ul.products, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-wl-product-grid ul.products { float: none !important; clear: both !important; width: 100% !important; } /* Отключаем старые clearfix */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woocommerce-products .elementor-widget-container::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-woolentor-product-grid .elementor-widget-container::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-widget-wl-product-grid .elementor-widget-container::after { content: none !important; display: none !important; } /* ========================================================= МОБИЛЬНАЯ ВЕРСИЯ ========================================================= */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { width: 100% !important; line-height: 1.4 !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__dropdown, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering:not(.vita-ordering-ready) select.orderby { width: 100% !important; min-width: 100% !important; max-width: 100% !important; flex-basis: 100% !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { min-height: 220px !important; padding: 20px 15px !important; } } /* Пустой результат строго по центру товарной области */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; clear: both !important; float: none !important; width: 100% !important; min-width: 100% !important; min-height: 300px !important; margin: 0 !important; padding: 30px 20px !important; text-align: center !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { display: block !important; width: 100% !important; max-width: 700px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title { margin-top: 0 !important; margin-bottom: 8px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { margin-top: 0 !important; margin-bottom: 0 !important; } /* ========================================================= ОКОНЧАТЕЛЬНЫЙ ФИКС ФИЛЬТРА И СОРТИРОВКИ Должен находиться последним в CSS товаров ========================================================= */ /* Общая строка результата и сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { position: relative !important; z-index: 50 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; float: none !important; clear: both !important; width: 100% !important; min-height: 48px !important; margin: 0 0 24px !important; padding: 0 !important; overflow: visible !important; box-sizing: border-box !important; } /* Счётчик слева */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { position: static !important; display: block !important; float: none !important; clear: none !important; flex: 1 1 auto !important; width: auto !important; margin: 0 !important; padding: 0 !important; line-height: 48px !important; } /* Сортировка справа */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering { position: relative !important; top: auto !important; right: auto !important; bottom: auto !important; left: auto !important; display: block !important; float: none !important; clear: none !important; flex: 0 0 300px !important; width: 300px !important; min-width: 300px !important; max-width: 300px !important; height: 48px !important; min-height: 48px !important; margin: 0 0 0 auto !important; padding: 0 !important; transform: none !important; overflow: visible !important; box-sizing: border-box !important; } /* Скрываем исходный select */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; top: 0 !important; width: 1px !important; min-width: 1px !important; max-width: 1px !important; height: 1px !important; min-height: 1px !important; padding: 0 !important; border: 0 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; } /* Убираем стрелки темы */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger { background-image: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::after { content: none !important; display: none !important; background-image: none !important; } /* Только первая кастомная стрелка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow { display: block !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow ~ .vita-sort__arrow { display: none !important; } /* Пустой результат */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; float: none !important; clear: both !important; width: 100% !important; min-width: 100% !important; max-width: 100% !important; min-height: 300px !important; margin: 0 !important; padding: 30px 20px !important; text-align: center !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { display: block !important; width: 100% !important; max-width: 700px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-title { margin-top: 0 !important; margin-bottom: 8px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-text { margin-top: 0 !important; margin-bottom: 0 !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .woocommerce-no-products-found { display: none !important; } @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .woocommerce-result-count { width: 100% !important; line-height: 1.4 !important; text-align: center !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar form.woocommerce-ordering, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__trigger, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-shop-toolbar .vita-sort__dropdown { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-filter-empty-message { min-height: 220px !important; padding: 20px 15px !important; } } /* ========================================================= ОДНА СТРЕЛКА И КАСТОМНАЯ СОРТИРОВКА ========================================================= */ /* Нативный select скрывается после создания кастомного */ .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; top: 0 !important; width: 1px !important; min-width: 1px !important; max-width: 1px !important; height: 1px !important; min-height: 1px !important; max-height: 1px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; } /* Убираем дополнительные стрелки темы */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger { background-image: none !important; appearance: none !important; -webkit-appearance: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::after { content: none !important; display: none !important; background-image: none !important; } /* Оставляем только один элемент стрелки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow { display: block !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow ~ .vita-sort__arrow { display: none !important; } /* Только одна стрелка сортировки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger { background-image: none !important; appearance: none !important; -webkit-appearance: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger::after, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering::after { content: none !important; display: none !important; background-image: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow { display: block !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-sort__trigger .vita-sort__arrow ~ .vita-sort__arrow { display: none !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 form.woocommerce-ordering.vita-ordering-ready select.orderby { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } /* ========================================================= ФИНАЛЬНЫЙ ФИКС: ЗАЛИВКА ИКОНОК ТОЛЬКО ПРИ НАВЕДЕНИИ ========================================================= */ /* После клика кнопка не остаётся приподнятой */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.is-active:not(:hover), .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-hovered:not(:hover), .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn:focus:not(:hover), .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn:focus-visible:not(:hover) { transform: none !important; } /* ========================================================= УПАКОВКА 1КГ / 1.5КГ — БЕЗ ЗАЛИВКИ ПОСЛЕ КЛИКА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack.vita-hovered:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack:focus:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack:focus-visible:not(:hover):not(.is-active):not([aria-pressed="true"])::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 100'%3E%3Cpath d='M8 8H80V18H8Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 18C8 27 17 31 19 41V69C17 79 8 83 8 92H80C80 83 71 79 69 69V41C71 31 80 27 80 18Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 82H80V92H8Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } /* ========================================================= МЕШОК 20КГ / 25КГ — БЕЗ ЗАЛИВКИ ПОСЛЕ КЛИКА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag.vita-hovered:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag:focus:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag:focus-visible:not(:hover):not(.is-active):not([aria-pressed="true"])::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 76'%3E%3Cpath d='M21 5h22c4 0 7 3 8 7l8 51c1 5-3 9-8 9H13c-5 0-9-4-8-9l8-51c1-4 4-7 8-7Z' fill='none' stroke='%23ffcc26' stroke-width='2.4' stroke-linejoin='round'/%3E%3Crect x='24' y='11' width='16' height='7' rx='3.5' fill='none' stroke='%23ffcc26' stroke-width='2.2'/%3E%3C/svg%3E") !important; } /* ========================================================= БУТЫЛКА 0,9Л — БЕЗ ЗАЛИВКИ ПОСЛЕ КЛИКА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"].vita-hovered:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"]:focus:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"]:focus-visible:not(:hover):not(.is-active):not([aria-pressed="true"])::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 94'%3E%3Cpath d='M28 3H40V12H28Z' fill='none' stroke='%23ffcc26' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M25 12H43V21C43 25 46 28 50 32C55 37 58 44 58 52V80C58 86 54 90 48 90H20C14 90 10 86 10 80V52C10 44 13 37 18 32C22 28 25 25 25 21Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M18 34H50M17 40H51M19 76H49M20 82H48' fill='none' stroke='%23ffcc26' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; } /* ========================================================= БУТЫЛКА 3Л — БЕЗ ЗАЛИВКИ ПОСЛЕ КЛИКА ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"].vita-hovered:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"]:focus:not(:hover):not(.is-active):not([aria-pressed="true"])::before, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"]:focus-visible:not(:hover):not(.is-active):not([aria-pressed="true"])::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 78 98'%3E%3Cpath d='M32 3H46V12H32Z' fill='none' stroke='%23ffcc26' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M28 12H50V21C50 25 54 29 58 33C64 39 67 46 67 55V84C67 90 63 94 57 94H21C15 94 11 90 11 84V55C11 46 14 39 20 33C24 29 28 25 28 21Z' fill='none' stroke='%23ffcc26' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M20 35H58M19 42H59M21 79H57M22 86H56' fill='none' stroke='%23ffcc26' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; } /* ========================================================= ЗАЛИВКА СРАБАТЫВАЕТ ИСКЛЮЧИТЕЛЬНО ПРИ HOVER ========================================================= */ /* Упаковка */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-pack:hover::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 100'%3E%3Cpath d='M8 8H80V18H8Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 18C8 27 17 31 19 41V69C17 79 8 83 8 92H80C80 83 71 79 69 69V41C71 31 80 27 80 18Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M8 82H80V92H8Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } /* Мешок */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-bag:hover::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 76'%3E%3Cpath d='M21 5h22c4 0 7 3 8 7l8 51c1 5-3 9-8 9H13c-5 0-9-4-8-9l8-51c1-4 4-7 8-7Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.4' stroke-linejoin='round'/%3E%3Crect x='24' y='11' width='16' height='7' rx='3.5' fill='%23fff' stroke='%23f2be00' stroke-width='2.2'/%3E%3C/svg%3E") !important; } /* Бутылка 0,9л */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-small[data-variation-id="4840"]:hover::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 94'%3E%3Cpath d='M28 3H40V12H28Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M25 12H43V21C43 25 46 28 50 32C55 37 58 44 58 52V80C58 86 54 90 48 90H20C14 90 10 86 10 80V52C10 44 13 37 18 32C22 28 25 25 25 21Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M18 34H50M17 40H51M19 76H49M20 82H48' fill='none' stroke='%23f2be00' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; } /* Бутылка 3л */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-card-variation-btn.vita-weight-oil-large[data-variation-id="4841"]:hover::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 78 98'%3E%3Cpath d='M32 3H46V12H32Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M28 12H50V21C50 25 54 29 58 33C64 39 67 46 67 55V84C67 90 63 94 57 94H21C15 94 11 90 11 84V55C11 46 14 39 20 33C24 29 28 25 28 21Z' fill='%23ffcc26' stroke='%23f2be00' stroke-width='2.6' stroke-linejoin='round'/%3E%3Cpath d='M20 35H58M19 42H59M21 79H57M22 86H56' fill='none' stroke='%23f2be00' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important; } /* ========================================================= КАРТОЧКА БЕЗ КОРОТКОГО ОПИСАНИЯ Картинка начинается от верхней границы карточки ========================================================= */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: stretch !important; align-content: flex-start !important; } .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .vita-product-short-description, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .woocommerce-product-details__short-description { display: none !important; min-height: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; } /* Убираем верхние отступы у блока изображения */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .woocommerce-LoopProduct-link:first-child, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .ht-product-image, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .woolentor-product-image, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .product-image, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .elementor-widget-image { margin-top: 0 !important; padding-top: 0 !important; align-self: stretch !important; } /* Само изображение прижимаем вверх */ .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description img.wp-post-image, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description img.attachment-woocommerce_thumbnail, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .product-image img, .elementor-9800 .elementor-element.elementor-element-58d328b8 .vita-no-short-description .ht-product-image img { display: block !important; margin-top: 0 !important; align-self: flex-start !important; } /* Карточка всегда начинается сверху */ .elementor-9800 .elementor-element.elementor-element-58d328b8 li.product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item, .elementor-9800 .elementor-element.elementor-element-58d328b8 .elementor-grid-item, .elementor-9800 .elementor-element.elementor-element-58d328b8 .woolentor-product, .elementor-9800 .elementor-element.elementor-element-58d328b8 .ht-product { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: stretch !important; } /* Обёртка кнопки не должна быть самой карточкой */ .elementor-9800 .elementor-element.elementor-element-58d328b8 li.product.vita-view-product-wrap, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product.vita-view-product-wrap, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item.vita-view-product-wrap { justify-content: flex-start !important; } /* Отдельная обёртка только кнопки */ .elementor-9800 .elementor-element.elementor-element-58d328b8 li.product > .vita-view-product-wrap, .elementor-9800 .elementor-element.elementor-element-58d328b8 .product > .vita-view-product-wrap, .elementor-9800 .elementor-element.elementor-element-58d328b8 .e-loop-item > .vita-view-product-wrap { display: flex !important; justify-content: center !important; align-items: center !important; width: 100% !important; margin-top: auto !important; } /* HUSKY / WOOF — скрыть панель активных фильтров */ .woof_products_top_panel, .woof_products_top_panel_ul, .woof_products_top_panel li { display: none !important; }/* End custom CSS */ /* Start custom CSS for column, class: .elementor-element-7c20a77f *//* ===================================================== СОРТИРОВКА, СЕТКА ТОВАРОВ И ПАГИНАЦИЯ Актуальный объединённый код ===================================================== */ /* ===================================================== 1. СОРТИРОВКА ===================================================== */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering { margin: 0 !important; padding: 0 !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering select, .elementor-9800 .elementor-element.elementor-element-7c20a77f select.orderby { display: block !important; width: 230px !important; min-width: 230px !important; max-width: 100% !important; height: 40px !important; padding: 8px 42px 8px 22px !important; border: 1px solid #ffcc26 !important; border-radius: 22px !important; background-color: #ffffff !important; color: #111111 !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.2 !important; outline: none !important; box-shadow: none !important; cursor: pointer !important; appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23111111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 20px center !important; background-size: 12px 8px !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering select:hover, .elementor-9800 .elementor-element.elementor-element-7c20a77f select.orderby:hover { border-color: #ffcc26 !important; background-color: #ffffff !important; color: #111111 !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering select:focus, .elementor-9800 .elementor-element.elementor-element-7c20a77f select.orderby:focus { border-color: #ffcc26 !important; outline: none !important; box-shadow: none !important; } /* ===================================================== 2. ОБЩАЯ ШИРИНА ВИДЖЕТА ===================================================== */ .elementor-9800 .elementor-element.elementor-element-7c20a77f, .elementor-9800 .elementor-element.elementor-element-7c20a77f > .elementor-widget-container, .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } /* ===================================================== 3. КОЛИЧЕСТВО РЕЗУЛЬТАТОВ ===================================================== */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-result-count { color: #111111 !important; font-size: 14px !important; font-weight: 500 !important; line-height: 40px !important; white-space: nowrap !important; word-break: normal !important; overflow-wrap: normal !important; } /* ===================================================== 4. СЕТКА ТОВАРОВ — ОБЩИЕ ПРАВИЛА ===================================================== */ .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products { clear: both !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products li.product, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products li.product { min-width: 0 !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products li.product img, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products li.product img { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; object-fit: contain !important; box-sizing: border-box !important; } /* ===================================================== 5. ПАГИНАЦИЯ ===================================================== */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination, .elementor-9800 .elementor-element.elementor-element-7c20a77f nav.pagination, .elementor-9800 .elementor-element.elementor-element-7c20a77f .elementor-pagination, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers { clear: both !important; width: 100% !important; max-width: 100% !important; text-align: center !important; border: none !important; margin-top: 20px !important; margin-left: auto !important; margin-right: auto !important; } /* Список пагинации */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 18px !important; padding: 0 !important; margin: 0 auto !important; list-style: none !important; border: none !important; background: transparent !important; } /* Элементы */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul li, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers li { list-style: none !important; border: none !important; background: transparent !important; margin: 0 !important; padding: 0 !important; } /* Номера страниц */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul li a, .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul li span, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers li a, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers li span, .elementor-9800 .elementor-element.elementor-element-7c20a77f .elementor-pagination a, .elementor-9800 .elementor-element.elementor-element-7c20a77f .elementor-pagination span { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 32px !important; min-width: 32px !important; height: 32px !important; padding: 0 !important; border: none !important; border-radius: 50% !important; background: transparent !important; box-shadow: none !important; color: #0f1d3a !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1 !important; text-decoration: none !important; } /* Активная страница */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul li .current, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers li .current, .elementor-9800 .elementor-element.elementor-element-7c20a77f .elementor-pagination .current { width: 32px !important; min-width: 32px !important; height: 32px !important; background: #f2be00 !important; color: #ffffff !important; border-radius: 50% !important; } /* Hover */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul li a:hover, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers li a:hover, .elementor-9800 .elementor-element.elementor-element-7c20a77f .elementor-pagination a:hover { background: transparent !important; color: #0f1d3a !important; transform: none !important; } /* Стрелки */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul li a.next, .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul li a.prev, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers li a.next, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers li a.prev { width: auto !important; min-width: auto !important; height: auto !important; padding: 0 !important; border-radius: 0 !important; background: transparent !important; font-size: 22px !important; line-height: 1 !important; } /* ===================================================== 6. ПЛАНШЕТ И ТЕЛЕФОН — НА ВСЮ ШИРИНУ ===================================================== */ @media (max-width: 1024px) { /* * Выводим виджет из узкой колонки Elementor. * Отступ по краям экрана — 16px. */ .elementor-9800 .elementor-element.elementor-element-7c20a77f { display: block !important; width: calc(100vw - 32px) !important; max-width: calc(100vw - 32px) !important; min-width: 0 !important; margin-left: calc(50% - 50vw + 16px) !important; margin-right: 0 !important; padding: 0 !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f > .elementor-widget-container, .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; } /* Убираем старые float WooCommerce */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-result-count, .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering { float: none !important; clear: none !important; } /* Количество результатов */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-result-count { display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 0 10px !important; padding: 0 !important; line-height: 1.4 !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; } /* Сортировка */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering { display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 0 14px !important; padding: 0 !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering select, .elementor-9800 .elementor-element.elementor-element-7c20a77f select.orderby { width: 230px !important; min-width: 0 !important; max-width: 100% !important; } /* Товары используют всю ширину */ .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products { clear: both !important; display: grid !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 18px 0 0 !important; padding: 0 !important; column-gap: 14px !important; row-gap: 24px !important; box-sizing: border-box !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products::before, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products::after, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products::before, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products::after { display: none !important; content: none !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products li.product, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products li.product, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products .product { float: none !important; clear: none !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; box-sizing: border-box !important; } /* Кнопка фильтра */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-mobile-filter-button, .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-filter-toggle, .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-open-filter, .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-filter-button { max-width: 100% !important; } } /* ===================================================== 7. ПЛАНШЕТ — 3 ТОВАРА В РЯД ===================================================== */ @media (min-width: 768px) and (max-width: 1024px) { .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } } /* ===================================================== 8. ТЕЛЕФОН И УЗКИЙ ПЛАНШЕТ — 2 ТОВАРА В РЯД ===================================================== */ @media (max-width: 767px) { .elementor-9800 .elementor-element.elementor-element-7c20a77f { width: calc(100vw - 24px) !important; max-width: calc(100vw - 24px) !important; margin-left: calc(50% - 50vw + 12px) !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 12px !important; row-gap: 20px !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering select, .elementor-9800 .elementor-element.elementor-element-7c20a77f select.orderby { width: 100% !important; min-width: 0 !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce nav.woocommerce-pagination ul, .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.page-numbers { gap: 12px !important; } } /* ===================================================== 9. ОЧЕНЬ УЗКИЕ ЭКРАНЫ ===================================================== */ @media (max-width: 380px) { .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products { column-gap: 8px !important; } } /* ===================================================== ПЛАНШЕТ И МОБАЙЛ: ФИЛЬТР + СОРТИРОВКА В ОДНОЙ СТРОКЕ ===================================================== */ @media (max-width: 1024px) { /* Скрываем разорванный текст Showing 1–27 of 88 results */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-result-count { display: none !important; } /* Сортировка справа */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering { float: right !important; clear: none !important; display: block !important; width: calc(50% - 7px) !important; max-width: calc(50% - 7px) !important; margin: 0 0 18px !important; padding: 0 !important; } .elementor-9800 .elementor-element.elementor-element-7c20a77f .woocommerce-ordering select, .elementor-9800 .elementor-element.elementor-element-7c20a77f select.orderby { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 40px !important; margin: 0 !important; box-sizing: border-box !important; } /* Кнопка фильтра слева */ .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-mobile-filter-button, .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-filter-toggle, .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-open-filter, .elementor-9800 .elementor-element.elementor-element-7c20a77f .vita-filter-button, .elementor-9800 .elementor-element.elementor-element-7c20a77f button[class*="filter"], .elementor-9800 .elementor-element.elementor-element-7c20a77f a[class*="filter"] { float: left !important; clear: none !important; display: inline-flex !important; align-items: center !important; justify-content: flex-start !important; width: calc(50% - 7px) !important; max-width: calc(50% - 7px) !important; min-width: 0 !important; height: 40px !important; margin: 0 0 18px !important; padding: 0 16px !important; box-sizing: border-box !important; } /* Сетка начинается ниже обеих кнопок */ .elementor-9800 .elementor-element.elementor-element-7c20a77f ul.products, .elementor-9800 .elementor-element.elementor-element-7c20a77f .products { clear: both !important; padding-top: 0 !important; margin-top: 0 !important; } }/* End custom CSS */