.site-header-top-wrapper.topbar-style--default.sh--dark {
    display: none;
}
.btn-pereyti {
  display: none;
}
#place_order, .checkout-button.button.alt.wc-forward{

  background: #d6d6d6 !important;
}
:focus-visible {
    outline: none;
    box-shadow: none;
}
.woocommerce-message {
  font-family: Montserrat;
}
.payment_box.payment_method_bacs, .payment_box.payment_method_cod {
  padding: 0px !important;
  font-family: Montserrat;
  font-size: 14px !important;
  color: black !important;
}
.button.wc-forward {
  background: #e4e2db !important;
  color: black !important;
  border-radius: 0px !important;
}

p {
  margin: 0 0 5px;
}

.headtop2 {
    text-align:center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000; /* Вища пріоритетність */
    background-color: black;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: -0.12px;
    text-transform: uppercase;
}
.afteroder {
  width: 100%;
}
.header__wrapper {
  height: 80px;
}
.woocommerce-message * {
  text-transform: uppercase;
}
.button.wc-forward {
  background: transparent !important;
  color: white !important;
  letter-spacing: 3px;
}

/* Стилі для #header */
#header {
    position: fixed;
    top: 32px; /* Висота .headtop2 */
    left: 0;
    width: 100%;
    z-index: 999;
    background-color: #f8f8f8;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

@media (max-width: 769px) {
  body #header {
    margin-top: 32px !important;
    left: 0 !important;
    top: 0 !important;
    height: 48px !important;
  }
}

#order_comments_field label {
  text-transform: uppercase;
}
.btn-pereyti {
  position: absolute;
  bottom: 35%; /* Замість відсотків для стабільності */
  left: 50%;
  transform: translateX(-50%);
  background-color: #ffffff;
  color: #000000;
  padding: 7px 30px; /* Більше відступів для кращого вигляду */
  border: none;
  font-family: 'Montserrat', sans-serif;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  font-weight: 500; /* Злегка збільшена товщина шрифта */
  font-size: 16px;
  line-height: 20px;
  text-transform: uppercase;
  transition: background-color 0.3s ease, transform 0.3s ease;
  z-index: 10; /* Високий z-index для уникнення перекриття */
}
.slide {
  position: relative; /* Встановлюємо батьківський блок для абсолютного позиціонування кнопки */
}
.action_box, .action_box.style3::before, .action_box.style3 .action_box-inner::before, .btn.btn-fullcolor, .btn.btn-fullcolor:focus, .btn.btn-fullcolor.btn-skewed::before, .circle-text-box.style3 .wpk-circle-span, .circle-text-box.style2 .wpk-circle-span::before, .circle-text-box:not(.style3) .wpk-circle-span::after, .elm-social-icons.sc--normal .elm-sc-icon:hover, .elm-searchbox--normal .elm-searchbox__submit, .elm-searchbox--transparent .elm-searchbox__submit, .hover-box:hover, .how_to_shop .number, .image-boxes.image-boxes--4 .image-boxes-title::after, .kl-flex--classic .zn_simple_carousel-arr:hover, .kl-flex--modern .flex-underbar, .kl-blog-item-overlay-inner .kl-blog-item-overlay-more:hover, .kl-blog-related-post-link::after, .kl-ioscaption--style1 .more::before, .kl-ioscaption--style1 .more::after, .kl-ioscaption--style2 .more, .kl-ioscaption--style3.s3ext .main_title::before, .kl-ios-selectors-block.bullets2 .item.selected::before, .kl-ioscaption--style5 .klios-separator-line span, .zn-iosSl-caption.zn-iosSl-caption--style1 .zn-iosSl-more::before, .zn-iosSl-caption.zn-iosSl-caption--style1 .zn-iosSl-more::after, .zn-iosSl-caption.zn-iosSl-caption--style2 .zn-iosSl-more, .zn-iosSl-caption.zn-iosSl-caption--style3.s3ext .zn-iosSl-mainTitle::before, .zn-iosSl-caption.zn-iosSl-caption--style5 .zn-iosSl-separatorLine span, .kl-ptfcarousel-carousel-arr:hover, .kl-ptfsortable-nav-link:hover, .kl-ptfsortable-nav-item.current .kl-ptfsortable-nav-link, .latest_posts3-post-date, .latest_posts--style4.kl-style-2 .latest_posts-elm-titlew, .latest_posts--style4.kl-style-2 .latest_posts-title::after, .latest_posts--style4.default-style .latest_posts-readon, .slick-active .slickBtn, .woocommerce ul.products.lt-offers-carousel .product-list-item::after, .media-container__link--style-borderanim1 > i, .nivo-directionNav a:hover, .pricing-table-element .plan-column.featured .subscription-price .inner-cell, .process_steps--style1 .process_steps__intro, .process_steps--style2 .process_steps__intro, .process_steps--style2 .process_steps__intro::before, .recentwork_carousel--1 .recentwork_carousel__bg, .recentwork_carousel--2 .recentwork_carousel__title::after, .recentwork_carousel--2 .recentwork_carousel__cat, .recentwork_carousel_v2 .recentwork_carousel__plus, .recentwork_carousel_v3 .btn::before, .recentwork_carousel_v3 .recentwork_carousel__cat, .timeline-box:hover .timeline-box-icon, .title_circle, .title_circle::before, .services_box--classic:hover .services_box__icon, .stepbox2-box--ok::before, .stepbox2-box--ok::after, .stepbox2-box--ok, .stepbox3-content::before, .stepbox4-number::before, .tbk--color-theme.tbk-symbol--line .tbk__symbol span, .tbk--color-theme.tbk-symbol--line_border .tbk__symbol span, .th-wowslider a.ws_next:hover, .th-wowslider a.ws_prev:hover, .zn-acc--style4 .acc-title, .zn-acc--style4 .acc-tgg-button .acc-icon::before, .zn-acc--style3 .acc-tgg-button::before, .zn_badge_sale, .zn_badge_sale::after, .elm-cmlist.elm-cmlist--v2 a::before, .elm-cmlist.elm-cmlist--v3ext a::before, .elm-custommenu--dd .elm-custommenu-pick, .shop-features .shop-feature:hover, .feature_box.style3 .box:hover, .services_box_element:hover .box .icon, .elm-social-icons.sc--normal .elm-sc-link:hover .elm-sc-icon {
  background-color: white;
  color: black;
}






@media (min-width: 768px) {
.woocommerce-products-header {
  margin-bottom: 0;
}
    
    
    
}


#home_slider_mobile {
    display: none;
}

#home_slider_pc .prev,
#home_slider_mobile .prev,
#home_slider_pc .next,
#home_slider_mobile .next {
    position: absolute;
    top: 40%;
    cursor: pointer;
    z-index: 1;
}

#home_slider_pc .prev svg,
#home_slider_mobile .prev svg,
#home_slider_pc .next svg,
#home_slider_mobile .next svg {
    width: 35px;
}

#home_slider_pc .prev polyline,
#home_slider_mobile .prev polyline,
#home_slider_pc .next polyline,
#home_slider_mobile .next polyline {
    -webkit-transition: all .15s ease-out;
    transition: all .15s ease-out;
    stroke: #141414;
}


#home_slider_pc .prev,
#home_slider_mobile .prev {
    left: 25px;
}

#home_slider_pc .next,
#home_slider_mobile .next {
    right: 25px;
}

@media (max-width: 767px) {
 #home_slider_mobile {
        display: block;
    
    }

    #home_slider_pc {
        display: none;
    }
  #home_slider_mobile {
        display: block;
        max-height: auto;
    }

    #home_slider_pc {
        display: none;
    }

	
}

.woocommerce-products-header__title.page-title {
    font-weight:500;
}






@media (max-width: 768px) {
  #header {
    margin-top: 25px;
    position: fixed;
    left: 0;
  }
}
.site-header.style12 .site-header-main {
        height: 60px;
    }
    
    .kl-top-header.site-header-main-wrapper.clearfix.header-no-bottom.sh--dark {
    background-color: #E4E2DB;
}

h3.m_title.m_title_ext.text-custom.ff-alternative.spp-title.spp-el-title {
    display: none;
}

.fxb-col.fxb.fxb-start-x.fxb-center-y.fxb-basis-auto.fxb-grow-0.fxb-sm-half.site-header-col-left.site-header-main-left, .fxb-col.fxb.fxb-end-x.fxb-center-y.fxb-basis-auto.fxb-sm-half.site-header-col-right.site-header-main-right {
  width: 45%;
}
.fxb-col.fxb.fxb-center-x.fxb-center-y.fxb-basis-auto.fxb-grow-0.site-header-col-center.site-header-main-center {
  width: 10%;
}
.woocommerce ul.products li.product .product-list-item.prod-layout-classic .kw-details {
        padding: 10px 0px 0px;
    background: #e4e2db;
}

.zn_badge_new {
    background-color: #E4E2DB;
}

.zn_badge_sale, .zn_badge_new, .zn_badge_soldout {
    color: #000000;
   
}

.zn_badge_new:after {
    background-color: #E4E2DB;
    z-index: 1;
    left: 5px;
}

h3#head_main {
    padding-left: 20px;
}




#third_section .zn-bgSource-image {
    position: relative;
    display: block;
    /* Задаємо потрібні стилі для самого зображення, якщо необхідно */
}

#third_section .zn-bgSource-image::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30%; /* Висота градієнта, налаштуйте на свій розсуд */
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
    pointer-events: none; /* Щоб псевдоелемент не заважав іншим елементам */
}


.wpc-filters-button-text {
  text-transform: uppercase;
}


/* Стилі для h3 */
section#third_section h3 {
    transition: transform 0.3s ease-in-out;
}

/* Коли ми наводимо на елемент .media-container, h3 всередині зміщується вправо */
section#third_section .media-container:hover h3 {
    transform: translateX(10px); /* Зміщення вправо на 10 пікселів */
}
span.latest_posts-readon.u-trans-all-2s.text-custom-child.kl-main-bgcolor {
    color: black;
    background-color: white;
}



span.latest_posts-readon.u-trans-all-2s.text-custom-child.kl-main-bgcolor {
    color: black !important;
    background-color: white;
}


.hoverBorder:after {
   
    box-shadow: none;
   
}

.hoverBorder:hover:after {
    box-shadow: none;
}


section#third_section .media-container {
    position: relative;
    overflow: hidden; /* Для того, щоб псевдоелемент не виходив за межі */
}



h3#eluid442fc7b2, h3#eluid1c061bc1 {
    margin-top: 0px;
}

.social2 a {
    padding-right: 3px !important;
}

.woocommerce ul.products li.product .product-list-item.prod-layout-style2 .kw-details {
  padding: 14px 5px 0px;
  position: relative;
}
.woocommerce ul.products li.product .product-list-item.prod-layout-style2 .kw-details-title {
  font-size: 14px;
  line-height: 1;
  margin: 0 0 0px;
  padding: 0;
  font-weight: 400;
  min-height: 18px !important;
  max-height: 18px !important;
  height: 18px !important;
  font-family: Montserrat;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  max-width: 100%;
}
.woocommerce ul.products li.product .product-list-item.prod-layout-style2 .kw-details-title a {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: top;
}
.woocommerce ul.products li.product {
  margin: 0 0 38px;
  padding: 0 5px;
  width: 25%;
}
.related.products ul.products, .up-sells.upsells.products ul.products {
  margin: 0 0px;
}
.woocommerce ul.products li.product .product-list-item.prod-layout-style2 .price, .woocommerce ul.products li.product .product-list-item.prod-layout-style2 .price ins {
  color: #282828;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 0;
  text-decoration: none;
  text-align: center;
}

.button.product_type_simple.add_to_cart_button.ajax_add_to_cart, .button.product_type_variable.add_to_cart_button{
  background: transparent;
  text-align: center;
  margin-top: 0px !important;
  font-family: Montserrat;
  font-weight: 400;
  text-transform: uppercase;
  color: black;
  
  
  border-bottom: 1px solid;
  width: max-content;
  border-radius: 0px !important;
  padding: 3px;
  margin: 0 auto;
}

form#form_eluid04573f75 {
    color: black;
}

.kl-material-form .form-control {
   
    border-color: black;
  
}


button.zn_contact_submit.btn.btn-fullcolor.btn-custom-color.btn--square {
    color: black;
    font-family: Montserrat;
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
    text-transform: uppercase;
}

.kl-material-form-label {

    font-size: 16px;
    text-transform: uppercase;
}


input#zn_form_field_1_0, input#zn_form_field__email1_1, input#zn_form_field_1_2, textarea#zn_form_field_1_3 {
    color: black;
    font-family: 'Montserrat';
}


.eluid04573f75 .btn-fullcolor.btn-custom-color:hover {
    background-color: rgb(198, 198, 190);
}


.zn_text_box.eluid8cfd4113.hidden-zn_dummy_value.hidden-zn_dummy_value.hidden-zn_dummy_value.hidden-zn_dummy_value.zn_text_box-light.element-scheme--light {
    font-weight: 300;
}


.zn_text_box.eluide01ca606.hidden-zn_dummy_value.hidden-zn_dummy_value.hidden-zn_dummy_value.hidden-zn_dummy_value.zn_text_box-light.element-scheme--light {
      font-weight: 300;
}

.main-nav > ul > .logo-menu-wrapper,
.main-nav > ul > .menu-item {
  float: left;
  margin-top: 0;
  margin-left: 16px;
}

.main-nav > ul > .menu-item > a {
  position: relative;
  padding: 2px 0px;
  color: #292929;
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.56px;
  text-transform: uppercase;
}

.variations-head * {
  text-transform: uppercase;
  font-weight:500;
}
ul#eluida7b5f7da li {
    padding-bottom: 5px;
}

ul#eluidcd28102b li {
    padding-bottom: 5px;
}
.woocommerce ul.products li.product .product-list-item.prod-layout-style2:hover {
  box-shadow: 8px 15px 40px rgba(0,0,0,0);
}

.button.product_type_variable.add_to_cart_button:hover {
  background: #333030;
  color: white;
}


.related.products.related-products-mobile-normal {
  display: none;
}


/* CHECKOUT */
/* CHECKOUT */
.coupon label {
  display: none !important;
}

.woocommerce div.product form.cart .single_variation_wrap .variations_button div.quantity .qty {
  height: 50px;
  border-radius: 3px;
  border: 1px solid #D9D9D9;
}
/* Custom CHECKOUT ------------------------------------------- */
@media (min-width: 1000px) {
.woocommerce .col2-set, .woocommerce-page .col2-set {
    width: 48%;
    float: left;
}

.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
    float: left;
    width: 100%;
}

.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
    float: left;
    width: 100%;
}

h3#order_review_heading {
    width: 48%;
    display: inline-block;
    padding: 0 0 0 4%;
}
div#order_review {
    width: 48%;
    float: right;
}
}

.woocommerce table.shop_attributes th {
    width: 300px;
    font-weight: 700;
    padding: 8px;
    border-top: 0;
    border-bottom: 0px dotted rgba(0,0,0,.1);
    margin: 0;
    line-height: 1.5;
}

#s {
  font-family: Montserrat;
}

@media (max-width: 1400px) {
.woocommerce .col2-set, .woocommerce-page .col2-set {
    width: 100%;
    float: left;
}

.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
    float: left;
    width: 100%;
}

.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
    float: left;
    width: 100%;
}

h3#order_review_heading {
    width: 100%;
    display: inline-block;
    padding: 0 0 0 4%;
}
div#order_review {
    width: 100%;
    float: left;
}
}


/* Стилі для кількості товарів (варіативні та звичайні) */
.woocommerce div.product.prodpage-style2 form.cart div.quantity .qty,
.woocommerce div.product form.cart div.quantity .qty,
.mobile-cart-version .qty {
  color: #4F5255;
  text-align: center;
  font-family: Roboto, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  padding: 12px 30px;
  border-radius: 0px;
  border: 1px solid #DADADA;
  background: #FFF;
  height: 50px;
  width: 100%;
}

/* Додаткові стилі для .qty (варіативні та звичайні) */
.woocommerce div.product.prodpage-style2 form.cart div.quantity .qty,
.woocommerce div.product form.cart div.quantity .qty {
  width: 50px;
  height: 50px;
  font-family: Montserrat, sans-serif;
  font-size: 17px;
  border-radius: 5px;
}

/* Стилі для кнопок +/- (варіативні та звичайні) */
.woocommerce div.product.prodpage-style2 form.cart div.quantity .minus,
.woocommerce div.product form.cart div.quantity .minus,
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity div.quantity .minus,
.mobile-cart-version .minus,
.woocommerce div.product.prodpage-style2 form.cart div.quantity .plus,
.woocommerce div.product form.cart div.quantity .plus,
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity div.quantity .plus,
.mobile-cart-version .plus {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 15px;
  position: absolute;
  bottom: 0;
  height: 50px;
  display: flex;
  align-items: center;
}

/* Позиціонування кнопок +/- */
.woocommerce div.product.prodpage-style2 form.cart div.quantity .minus,
.woocommerce div.product form.cart div.quantity .minus,
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity div.quantity .minus,
.mobile-cart-version .minus {
  left: 0;
}

.woocommerce div.product.prodpage-style2 form.cart div.quantity .plus,
.woocommerce div.product form.cart div.quantity .plus,
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity div.quantity .plus,
.mobile-cart-version .plus {
  right: 0;
}

/* Стилі для інпутів кількості (варіативні та звичайні) */
.woocommerce div.product.prodpage-style2 form.cart div.quantity .qty,
.woocommerce div.product form.cart div.quantity .qty,
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity input.qty,
.mobile-cart-version input.qty {
  border: 1px solid #DADADA;
  background: white;
  color: black;
  text-align: center;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
  width: 100%;
}

/* Стилі для контейнера продукту */
.woocommerce div.product.prodpage-style2 .product-page {
  padding: 0px;
}

/* Стилі для розміщення кількості товарів */
.woocommerce div.product.prodpage-style2 form.cart div.quantity,
.woocommerce div.product form.cart .single_variation_wrap .variations_button div.quantity,
.woocommerce div.product form.cart div.quantity,
.mobile-cart-version div.quantity {
  margin-right: 3%;
  position: relative;
  display: flex;
  width: 17%;
  flex-direction: column;
}

/* Стилі для кошика */
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity div.quantity {
  position: relative;
  display: flex;
  width: 95px;
  justify-content: center;
  margin: 0 auto;
}

/* Додаткові налаштування для стилів кнопок +/- */
.woocommerce div.product form.cart .single_variation_wrap .variations_button div.quantity .minus,
.woocommerce div.product form.cart .single_variation_wrap .variations_button div.quantity .plus,
.woocommerce div.product.prodpage-style2 form.cart div.quantity .minus,
.woocommerce div.product.prodpage-style2 form.cart div.quantity .plus,
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity div.quantity .minus,
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity div.quantity .plus {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 15px;
  position: absolute;
  bottom: 0;
  height: 50px;
  display: flex;
  align-items: center;
}

.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity input.qty {
  width: 95px;
  height: 50px;
}

/* Приховування спін-бутонів для числових інпутів */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

/* Зміна кольору іконок +/- */
.minus svg path,
.plus svg path {
  fill: black !important;
}

.page-title.kl-blog-page-title {
  font-weight: 400;
  font-family: Montserrat;
  text-transform: uppercase;
  text-align: center;
  font-size: 30px;
  line-height: 30px;
  margin-bottom: 0px;
  padding-bottom: 10px;
}
.checkout.woocommerce-checkout h3 {
  text-transform: uppercase;
  font-size: 18px;
}
/**Акордеон**/
/* 1. Скидання стандартних стилів для кращої уніфікації */
.panel-group {
    border: none;
}

/* =====================================================================
   YWF ACCORDION (single product tabs → accordion)
   ===================================================================== */
#accordion.ywf-accordion {
  margin-top: 40px;
  margin-bottom: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
}

#accordion .ywf-accordion__item {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #E4E4E4;
  overflow: hidden;
}
#accordion .ywf-accordion__item:first-child {
  border-top: 1px solid #E4E4E4;
}

/* Heading row */
#accordion .ywf-accordion__heading {
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
}
#accordion .panel-title {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
}

/* Trigger (a tag) */
#accordion .ywf-accordion__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  height: 48px;
  padding: 0 0 0 4px;
  margin: 0;
  background: #fff;
  border: 0;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s ease;
}
#accordion .ywf-accordion__trigger:hover,
#accordion .ywf-accordion__trigger:focus {
  text-decoration: none;
  background: #fff;
  outline: none;
}

#accordion .ywf-accordion__title {
  flex: 1 1 auto;
  color: var(--292929, #292929);
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%; /* 19.6px */
  letter-spacing: 0;
  text-transform: uppercase;
}

/* Icon container 40x40 з 8px padding (іконка 24x24, всередині svg 20x20) */
#accordion .ywf-accordion__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 8px;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}
#accordion .ywf-accordion__icon-svg {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: opacity .15s ease;
}

/* Default: показуємо PLUS, ховаємо MINUS (collapsed = закрито) */
#accordion .ywf-accordion__icon-svg--plus { opacity: 1; }
#accordion .ywf-accordion__icon-svg--minus { opacity: 0; }

/* Open state: trigger БЕЗ .collapsed → показуємо MINUS */
#accordion .ywf-accordion__trigger:not(.collapsed) .ywf-accordion__icon-svg--plus { opacity: 0; }
#accordion .ywf-accordion__trigger:not(.collapsed) .ywf-accordion__icon-svg--minus { opacity: 1; }

/* Body */
#accordion .ywf-accordion__panel {
  border: 0;
}
#accordion .ywf-accordion__body {
  padding: 0 4px 16px 4px;
  background: transparent;
  animation: fadeIn 0.25s ease-in-out;
}

/* Контент-дефолти: всі параграфи/списки в Montserrat 14/500 */
#accordion .ywf-accordion__body,
#accordion .ywf-accordion__body p,
#accordion .ywf-accordion__body li,
#accordion .ywf-accordion__body span {
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%; /* 19.6px */
  color: var(--292929, #292929);
}
#accordion .ywf-accordion__body p {
  margin: 0 0 8px;
}
#accordion .ywf-accordion__body p:last-child {
  margin-bottom: 0;
}
/* Підписи нот ("Верхні ноти", "Ноти серця" тощо) — #909090 */
#accordion .ywf-accordion__body strong,
#accordion .ywf-accordion__body b,
#accordion .ywf-accordion__body .note-label {
  font-weight: 500;
  color: #909090;
  display: inline-block;
}

/* Анімація плавного появи контенту */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Поліпшення стилів для тексту всередині панелей */
.panel-body h2 {
    font-size: 1.5em;
    margin-bottom: 15px;
    color: #333;
}

.panel-body p {
    font-size: 1em;
    line-height: 1.6;
    color: #555;
}

/* Стилізація розділу Відгуків */
.woocommerce-Reviews {
    margin-top: 20px;
}

.woocommerce-Reviews-title {
    font-size: 1.3em;
    margin-bottom: 15px;
    color: #333;
}

.woocommerce-noreviews {
    font-style: italic;
    color: #777;
}

/* Стилізація форми відгуків */
.comment-respond {
    margin-top: 30px;
}

.comment-respond label {
    font-weight: 600;
    color: #333;
}

.comment-form-rating .stars a {
    color: #ccc;
    font-size: 1.2em;
    margin-right: 5px;
    transition: color 0.3s;
    text-decoration: none;
}

.comment-form-rating .stars a:hover,
.comment-form-rating .stars a.active {
    color: #f39c12;
}

.comment-form textarea.form-control {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    resize: vertical;
    font-family: inherit;
}

.comment-form .submit {
    background-color: #0073aa;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.comment-form .submit:hover {
    background-color: #005177;
}


.after_custom {
  margin-top: 10px;
  margin-bottom: 5px;
  font-family: Montserrat;
  font-size: 14px;
  font-weight: 400;
  color: black;
  text-transform: uppercase;
}




.related.products.related-products-mobile, .up-sells.upsells.products-mobile {
  display: none;
}
.related.products.related-products-desktop-normal {
  margin-top: 30px;
}
.up-sells.upsells.products-normal ul.products {
  margin: 0 0px;
}
.up-sells.upsells.products-normal-mobile {
  display: none;
}

/* Адаптивність для мобільних пристроїв */
@media (max-width: 768px) {
.related.products.related-products-mobile, .up-sells.upsells.products-mobile {
  display: block;
}    
   .up-sells.upsells.products-normal-mobile {
  display: block;
} 
.related.products.related-products-desktop-normal, .up-sells.upsells.products-normal {
    display:none;
} 
.up-sells.upsells.products-mobile ul.products {
  margin: 0 0px;
}


.up-sells.upsells.products-normal-mobile ul.products {
  margin: 0 0px;
}
.up-sells.upsells.products-mobile li.product, .related.products.related-products-mobile li.product {
  width: 100% !important;
}    
.related.products.related-products-mobile    
    .panel-title {
        font-size: 1em;
    }

    .panel-body {
        padding: 15px;
    }

    .comment-form .submit {
        width: 100%;
        text-align: center;
    }
}
.panel-title a {
  text-transform: uppercase;
}
.woocommerce div.product form.cart .single_variation_wrap {
  border-left: 0px solid rgba(0,0,0,0.1);
  padding-left: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}
.woocommerce table.shop_attributes th {
  text-transform: uppercase;
}
.woocommerce ul.products li.product .button {
  display: inline-block;
  margin-top: 0em;
}
.woocommerce table.shop_attributes td {
  text-transform: uppercase;
}
#product-desc-collapse {
  font-family: Montserrat;
  font-size: 14px;
}

.single_add_to_cart_button.button.alt {
  width: 40%;
}
.awooc-custom-order-button {
  margin-left: 3% !important;
  width: 37%;
}

.single_add_to_cart_button.button.alt, .awooc-custom-order-button {
  font-family: Montserrat;
  text-transform: uppercase;
  font-weight: 400 !important;
  font-size: 13px;
  height: 50px;
  padding: 15px 20px !important;
}
.kw-details-desc * {
  font-family: Montserrat;
  font-size: 14px;
  color: black;
  text-transform: none;
}
.panel-body {
  text-transform: none !important;
}
.woocommerce-Price-amount.amount {
  margin: 0px !important;
}

.woocommerce div.product .product_title {
  line-height: 1;
  font-family: Montserrat;
  font-size: 24px;
  font-weight: 400;
  color: black;
}
.summary.entry-summary .product_title.entry-title {
  padding-top: 10%;
}
.product_title.entry-title {
  margin-bottom: 0px;
}
.additional-product-block {
 margin-bottom:5%;
}
.summary.entry-summary .price {
  margin-bottom: 0;
}
.woocommerce div.product form.cart, .woocommerce.single-product div.product .kw-details-desc {
  margin-bottom: 20px;
}
.woocommerce .product_meta {
  margin-bottom: 0px;
  margin-top: 2.5%;
}
.sku {
  color: black;
}

.woocommerce table.shop_attributes {
  border: 0;
  border-top: 0px dotted rgba(0,0,0,.1);
  margin-bottom: 0px;

}
.woocommerce table.shop_attributes th {
  width: max-content;
  font-weight: 500;
  padding: 5px;
  border-top: 0;
  margin: 0;
  line-height: 1.5;
  font-family: Montserrat;
  color:black;
}
.woocommerce table.shop_attributes td {
  font-style: normal;
  padding: 0;
  border-top: 0;
  border-bottom: 0px dotted rgba(0,0,0,.1);
  margin: 0;
  line-height: 1.5;
  font-family: Montserrat;
  font-weight: 400;
}

.more_color, .related_div {
  font-family: "Montserrat", Helvetica, Arial, sans-serif;
  font-size: 18px;
  line-height: 21px;
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
  color:black;
  margin-bottom:10px;
  width: 100% !important;
  display: inline-block;
}
.product-type {
  font-family: Montserrat;
  text-transform: lowercase;
  font-size: 14px;
  color: #6d6d6d;
}
.woocommerce.single-product div.product p.price, .woocommerce.single-product div.product span.price {
  font-size: 18px;
  color: black;
}
.kw-details.clearfix .product-type {
  text-align: center;
  margin-bottom: 0px;
}
.product-brand {
  color: black;
  font-family: Montserrat;
  text-transform: uppercase;
}
.additional-product-block * {
  font-size: 13px;
}
.kw-details.clearfix .additional-product-block {
  text-align: center;
  margin-bottom: 10px !important;
}

.product-label-novinka, .product-label-novinka-cat, .product-label-sale-cat {
    background: #5B0C0C;
    color: white;
  padding: 0px 5px;
  margin-right: 10px;
  display: inline-block;
  font-size:12px;
  letter-spacing:4px;
  font-weight:500;
}


.product-label-top-cat {
      background: #081f2c;
    color: #fff;
  padding: 0px 5px;
  margin-right: 10px;
  display: inline-block;
  text-transform:uppercase;
  font-family:Montserrat;
   font-weight: 500;
  letter-spacing: 4px;
  font-size:12px;
}


.product-label-sale-cat {
     background: #5B0C0C;
    color: white;   
    
    
}

.product_title.entry-title {
  display: inline-block;
  width: 100%;
}
.label-top {
  margin-bottom: 15px;
}
.product-label-rekomenduem, .product-label-rekomenduem-cat {
  background-color: #e4e2db;
  color: black;
  padding: 0px 5px;
  margin-right: 10px;
  display: inline-block;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 4px;
}
.product-label-novinka, .product-label-rekomenduem {
  font-size: 12px;
  font-family: Montserrat;
  font-weight:500;
}
.label-new {
  float: left;
  width: max-content;
  padding-left: 10px;
  background: #5B0C0C;
  padding-right: 10px;
  font-family: Montserrat;
  margin-right: 10px;
  color: white;
  font-size: 12px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: 4px;
  margin-bottom: 15px;
}

.label-top  {
  float: left;
  width: max-content;
  padding-left: 10px;
  background: #081f2c;
  padding-right: 10px;
  font-family: Montserrat;
  margin-right: 10px;
  color: white;
  font-size: 12px;
  line-height: 20px;
  font-weight: 500;
  text-transform:uppercase;
  letter-spacing: 4px;
}
.label-sale  {
  float: left;
  width: max-content;
  padding-left: 10px;
  background: #081f2c;
  padding-right: 10px;
  font-family: Montserrat;
  margin-right: 10px;
  color: white;
  font-size: 12px;
  line-height: 20px;
  font-weight: 500;
  text-transform:uppercase;
  letter-spacing: 4px;
  margin-bottom: 15px;
}


.label-rekomenduem {
  float: left;
  width: max-content;
  padding-left: 10px;
  background: #e4e2db;
  padding-right: 10px;
  font-family: Montserrat;
  margin-right: 10px;
  color: black;
  font-size: 12px;
  line-height: 20px;
  font-weight: 500;
  margin-bottom: 15px;
    letter-spacing: 4px;
}
.zn_badge_container {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
}
.woocommerce .woocommerce-result-count {
  margin: 10px 0;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  color: #6d6d6d;
  font-family: Montserrat;
  font-weight: 500;
}
.woocommerce-ordering {
  margin-bottom: 10px !important;
}
.orderby {
  background: transparent;
  border: 0px !important;
}
.orderby {
  font-family: Montserrat;
  color: #6d6d6d !important;
  text-align: right;
  font-weight: 500 !important;
}
.woocommerce-products-header__title.page-title {
  border: 0px;
  font-family: Montserrat;
  text-transform: uppercase;
  text-align: center;
  font-size: 30px;
  line-height: 30px;
  margin-bottom: 0px;
  padding-bottom: 10px;
}

.product-variations {
    margin-top: 20px;
}





.elm-custommenu * {
  text-transform: uppercase;
}




/* Ваші існуючі стилі */
/* Стилі для варіаційних елементів */
.variation-item {
    display: flex;
    justify-content: space-between;
    padding: 10px 0; /* Початковий відступ */
    cursor: pointer;
    background-color: transparent;
    transition: background-color 0.3s, border 0.3s, padding 0.3s;
}
.custom-variations div {
  border-bottom: 1px solid #6d6d6d;
}
/* Стилі для назви варіації */
.variation-name {
    font-size: 14px;
}

/* Стилі для ціни варіації */
.variation-price {
    font-weight: bold;
    color: #333;
}

/* Приховуємо стандартний випадаючий список варіацій */
.variations_form .variations {
    display: none;
}

/* LEGACY (старий пікер). Лишаємо лише для старих контейнерів,
   новий .ywf-volume-picker має власні стилі нижче в файлі. */
.custom-variations .variation-item:hover,
.custom-variations-popup .variation-item:hover,
.custom-variations-desktop .variation-item:hover {
    background-color: #fff;
    padding: 10px 5px;
}
.custom-variations .variation-item.selected,
.custom-variations-popup .variation-item.selected,
.custom-variations-desktop .variation-item.selected {
  background-color: #e4e2db;
  padding: 10px 5px;
}

/* Стилі для неактивної кнопки "Додати в кошик" */
.single_add_to_cart_button.disabled,
.single_add_to_cart_button:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}
.custom-variations * {
  font-family: Montserrat;
  font-size: 14px;
  font-weight: 500;
  color: black;
}
.variation-price * {
  font-size: 14px;
  font-weight: 500;
  color: black;
}
.variations-head *, .variations-head-pc *{
  font-family: Montserrat;
  color: black;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
 
}
.variations-head-pc * {
  margin-bottom: 0px;
}
.custom-variations {
  margin-bottom: 10px;
}


.widgettitle, .wpc-filter-title {
  color: #6d6d6d;
  line-height: 1.2;
  margin: 10px 0 15px;
  padding-bottom: 20px;
  position: relative;
  font-size: 13px;
  text-transform: uppercase;
  font-family: Montserrat;
  margin-bottom: 0em;
}
.widgettitle::before, .widgettitle::after, .wpc-posts-found{
  display: none !important;
}
.widget-title.wpc-filter-title {
  margin-bottom: 0px !important;
  padding-bottom: 5px;
  font-family: Montserrat;
}
.woocommerce-result-count {
  display: none;
}
/* АЛЕ — наш лічильник у тулбарі завжди видимий, перебиваємо вищі правила */
.ywf-filter-bar .wpc-posts-found,
.ywf-filter-bar .woocommerce-result-count,
.ywf-filter-bar .ywf-result-count-wrap,
.ywf-filter-bar .ywf-result-count-wrap .wpc-posts-found {
  display: inline-block !important;
}
.woocommerce-ordering {
  display: none;
}



/* CART */

/******/
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-remove .remove {
  display: inline-block;
  position: relative;
  margin: 0 auto;
  width: 28px;
  height: 28px;
  line-height: 30px;
  background: #000000;
}

.zn-wc-pages-style2 .checkout.woocommerce-checkout #order_review_heading::before {

  display: none !important;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout #payment::before {
      display: none !important;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout #order_review_heading {
  font-weight: 500;
  color: #000;
  margin: 0px;
  padding-top: 0px;
  position: relative;
}
.checkout.woocommerce-checkout {
  font-family: Montserrat !important;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout .woocommerce-billing-fields h3 {
  font-weight: 500;
  color: #000;
  margin-top: 0;
  margin-bottom: 0px;
  font-family: Montserrat;
}
.afteroder {
  color: black;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout .woocommerce-billing-fields label {
  color: #000;
  font-weight: 400;
  font-family: Montserrat;
  font-size: 12px;
  text-transform:uppercase;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout #payment {
  background: none;
  padding: 0;
    padding-top: 0px;
  padding-top: 0px;
  margin-top: 20px;
  position: relative;
}

.checkout.woocommerce-checkout .zn-wc-pages-style2 input.input-text, .zn-wc-pages-style2 textarea.input-text, .zn-wc-pages-style2 form .form-row input.input-text, .zn-wc-pages-style2 form .form-row textarea, .zn-wc-pages-style2 form .form-row select, .woocommerce-cart.zn-wc-pages-style2 table.cart td.actions .coupon .input-text, .zn-wc-pages-style2 .woocommerce form .form-row .select2-container, .woocommerce div.product.prodpage-style3 form.cart div.quantity .qty, .woocommerce div.product.prodpage-style3 form.cart .single_variation_wrap .variations_button div.quantity .qty {
  height: 42px;
  box-shadow: none;
  border-radius: 0px !important;
}
.zen-ui-select__value {
  height: 42px !important;
  line-height: 21px !important;
}
.wcus-checkout-fields h3 {
  margin-bottom: 10px !important;
}


#order_comments_field label {
  color: black;

    
}

#order_comments {
  min-height: 80px;
  height: max-content !important;
}



.zn-wc-pages-style2 .woocommerce a.button, .zn-wc-pages-style2 .woocommerce button.button, .zn-wc-pages-style2 .woocommerce input.button, .zn-wc-pages-style2 .woocommerce input#button, .zn-wc-pages-style2 .woocommerce #review_form #submit {
  font-weight: 700;
  font-size: 14px;
  padding: 12px 35px;
}


.woocommerce table.shop_table {
  border: 1px solid rgba(0,0,0,.1);
  margin: 0 0px 0px 0;
  text-align: left;
  width: 100%;
  border-collapse: separate;
  border-radius: 0px;
}



.woocommerce .woocommerce-info {
    background-color: black;
    font-family: Montserrat;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout {
  background-color: #fff;
  padding: 0px 0px 45px;
  margin-top: 20px;
}
#place_order {
  width: 100%;
}
.woocommerce .zn-cartpage-style2 table.cart tr::after, .woocommerce .zn-cartpage-style2 table.cart tr::before {
  display: none;
}
.product-price, .product-quantity {
  text-align: center !important;
}

.woocommerce table.shop_table th {
  font-weight: 700;
  padding: 10px 10px;
    padding-top: 10px;
  line-height: 1.5em;
}
.woocommerce .zn-cartpage-style2 table.cart thead th {
  background-color: white;
  color: black;
  font-weight: 500 !important;
  font-size: 14px !important;
  padding-top: 10px;
  height: 50px;
  font-family: Montserrat;
}
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail img {
  width: 90px;
  box-shadow: none;
  border: 0px solid #edefed;
  height: 100% !important;
}
.product-subtotal {
  font-weight: 600 !important;
  color: black;
}
#coupon_code {
  height: 40px !important;
  min-width: 200px !important;
  border-radius: 0px !important;
}
.coupon .button {
  border: 1px solid black !important;
  height: 38px;
  border-radius: 0px !important;
  font-family: Montserrat;
  font-weight:400 !important;
  margin-top:1px !important;
}
.woocommerce-cart #page_wrapper .zn-cartpage-style2 table.cart td.actions {
  height: 50px;
  padding: 5px;
}
.cart_totals {
  margin-top: -30px;
  padding: 25px !important;
}
.checkout-button.button.alt.wc-forward {
  font-weight: 500 !important;
}
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals > h2 {
  font-size: 22px;
  font-weight: 600;
  font-family: Montserrat;
  text-transform: uppercase;
  color: #000;
  margin-top: 0;
  text-align: center;
}
.shop_table.shop_table_responsive {
  font-family: Montserrat;
  font-size: 14px;
  color: black;
}
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals {
  width: 40%;

  border-radius: 0px !important;
}
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals {
  background-color: #e9eaea;
}
#add_payment_method .cart-collaterals .cart_totals tr td, #add_payment_method .cart-collaterals .cart_totals tr th, .woocommerce-cart .cart-collaterals .cart_totals tr td, .woocommerce-cart .cart-collaterals .cart_totals tr th, .woocommerce-checkout .cart-collaterals .cart_totals tr td, .woocommerce-checkout .cart-collaterals .cart_totals tr th {
  border-top: 1px solid #cdcbc5;
}
.checkout-button.button.alt.wc-forward {
  margin-bottom: 0px !important;
}

.product-remove {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
.product-subtotal {
  padding-right: 20px !important;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}
#billing_country_field {
  display: none;
}
.woocommerce-info {
  border-radius: 0px;
}


.checkout_coupon.woocommerce-form-coupon p {
  font-family: Montserrat;
  margin-bottom: 5px;
  text-align: center;
  font-size: 14px;
}
.woocommerce-info {
  font-family: Montserrat !important;
  font-size: 14px;
}

.wcus-checkout-fields h3 {
  margin-top: 15px !important;
}
.woocommerce-additional-fields h3 {
  font-weight: 700;
  color: #000;
  margin-top: 0;
  margin-bottom: 0px;
  font-family: Montserrat;
  margin-top: 15px;
}
#order_review_heading {
  font-family: Montserrat !important;
}
.topnav-drop-panel-inner {
  margin: 4px;
  list-style: none;
  background: #e9eaea;
  padding: 10px 5px;
  margin-top: 5px;
  position: relative;
  box-shadow: 0 0 2px rgba(0,0,0,.4);
  border-radius: 0px;
}
.cart-container .mini_cart_item a:not(.remove) {
  font-size: 14px;
  font-weight: normal;
  padding: 0 17px 0 0;
  font-family: Montserrat !important;
}
.topnav-drop-panel-inner::after {
  border-bottom-color: white !important;
}
.cart-container .cart_list .quantity {
  display: block;
  font-family: Montserrat;
  font-size: 15px;
  color: black;
  font-weight: 500;
}
.cart-container .total {
  border-bottom: 1px solid white !important;
}
.cart-container .cart_list {

  border-bottom: 1px solid white;

}
.woocommerce-mini-cart__total.total {
  font-family: Montserrat;
  font-size: 15px;
  color: black;
}
.cart-container .cart_list .remove {
  font-size: 20px;
  color: black;

}
.woocommerce-mini-cart__buttons.buttons {
  display: flex;
  flex-direction: column;
}
.woocommerce-mini-cart__buttons.buttons a {
  margin-top: 5px;
  margin-left: 0px !important;
  width: 100% !important;
  font-family: Montserrat;
}
.inner.topnav-drop-panel-inner.topnav--cart-panel-inner.cart-container {
  padding: 15px;
}
.woocommerce-order {
  font-family: Montserrat;
  font-size: 16px;
  color: black;
}
.product-availability-p {
  font-family: Montserrat;
}

.woocommerce-message {
  border-radius:0px;
  background: black !important;
  font-family: Montserrat;
  font-size: 14px;
}

.mobile-cart-version {
  display: none;
}

/* Apply a transition to the image for smooth zoom effect */
/* Hover працює тільки там, де реально є hover (desktop) */

.pPanel.topnav-drop-panel.topnav--cart-panel.u-trans-all-2s {
  display: none;
}



.woocommerce-cart .zn-cartpage-style2 table.cart td.product-name {
  font-weight: 300;
}
.woocommerce .zn-cartpage-style2 table.cart .cart_item td {
  font-family: Montserrat;
  font-size: 16px !important;
  font-weight: 300;
}
.product-name {
  font-weight: 500 !important;
}
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-name .variation {
  font-weight: 300 !important;
  font-family: Montserrat;
}
.variation- {
  font-weight: 300 !important;
}
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-quantity input.qty {

  background: transparent;
  border: 0px;
}
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals {
  background-color: transparent;
}
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals .shop_table th {
  font-weight: 400;

}
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals .shop_table td {
  font-weight: 300 !important;
}


.cart__mobile {
    display: none;
}
.woocommerce .zn-cartpage-style2 {
  background-color: transparent;
}
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals {
  width: 30%;
}
.product-name {
  width: 40%;
}
.woocommerce-checkout .cart_item td.product-thumbnail {
  width: 15%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.woocommerce-checkout .product-name {
  width: 60%;
}
.shop_table.woocommerce-checkout-review-order-table > thead > tr > th {
  display: none;
}
.cart_totals .woocommerce-shipping-totals.shipping {
  display: none;
}
/* Приклад для класу .blockUI */
.blockUI.blockOverlay {
    background-color: transparent !important;

}

/* Якщо оверлей має інший клас, наприклад .woocommerce-cart-overlay */
.woocommerce-cart-overlay {
    background-color: transparent !important;

}





/* Checkout */









.zn-wc-pages-style2 .checkout.woocommerce-checkout {
  background-color: transparent;
  padding: 0px 10px 45px;
  margin-top: 20px;
  overflow: hidden; /* Додаємо цю лінію */
}

.woocommerce-additional-fields h3 {
  display: none;
}


#checkoutsection .product-name {
  padding-left: 10px !important;
}
/* Застосування шрифту Montserrat до всіх інпутів, текстових областей та селектів */
input,
textarea,
select {
    font-family: 'Montserrat', sans-serif !important;
}

/* Застосування шрифту Montserrat до placeholder тексту */
::placeholder {
    font-family: 'Montserrat', sans-serif !important;
    /* Опціонально: стилізація placeholder */
    /* color: #999; */
    /* opacity: 1; */ /* За замовчуванням opacity для Chrome  */
}

/* Застосування шрифту Montserrat до тексту всередині інпутів при фокусі */
input:focus,
textarea:focus,
select:focus {
    font-family: 'Montserrat', sans-serif !important;
    /* Опціонально: додаткові стилі при фокусі */
    /* outline: 2px solid #555; */
}
.after_custom {
  margin-top: 10px;
  margin-bottom: 5px;
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 400;
  color: black;
}
.afteroder {
  font-family: Montserrat;
  font-weight: 500;
  font-size: 12px;
}
.woocommerce-additional-fields__field-wrapper {
  margin-top: 10px;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout .woocommerce-billing-fields h3 {
  font-weight: 500;
  color: #000;
  margin-top: 0;
  margin-bottom: 0px;
  font-family: Montserrat;
  margin-bottom: 0px !important;
}
#order_comments_field {
  font-family: Montserrat;
  font-weight: 500 !important;
}
#order_comments_field label {
  color: black;
  font-weight: 500;
}
#checkoutsection .product-quantity {
  text-align: center !important;
  font-weight: 500;
}
.customtfoot * {
  font-family: Montserrat;
  font-weight: 500 !important;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total * {
  background: none;
  font-weight: 600 !important;
}
#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  padding: 1em;
  margin: 1em 0;
  font-size: .92em;
  border-radius: 2px;
  line-height: 1.5;
  background-color: white;
  color: black;
}
#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before {
  content: "";
  display: block;
  border: 1em solid white;
    border-top-color: white;
    border-right-color: white;
    border-left-color: white;
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
  position: absolute;
  top: -.75em;
  left: 0;
  margin: -1em 0 0 2em;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout #payment ul.payment_methods li label {
  text-transform: uppercase;
  color: #000;
  font-weight: 600;
  font-family: Montserrat;
}
#add_payment_method #payment div.form-row, .woocommerce-cart #payment div.form-row, .woocommerce-checkout #payment div.form-row {
  padding: 0em;
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details * {
  font-weight: 400;
  font-family: Montserrat;
}
.woocommerce-table.woocommerce-table--order-details.shop_table.order_details * {
  font-weight: 500 !important;
}





.blockUI.blockMsg.blockMsgAwooc.blockPage {
  width: 425px !important;
}
.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
  display: flex;
  height: 50px;
  padding: 0px 16px;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  border-radius: 4px;
  background: rgba(43, 60, 91, 0.08);
}

.buy1clickname a, .buy1clickphone a {
  color: black;
  font-feature-settings: 'clig' off, 'liga' off;
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 130%;
  text-align: left !important;
  float: left;
  width: 100%;
  text-align: left !important;
}
.awooc-custom-order-wrap.awooc-popup-inner label {
  display: flex;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: bold;
}
.awooc-custom-order-wrap.awooc-popup-inner br {
  display: none;
}
.buy1clickphone {
  margin-top: 15px;
}
.awooc-custom-order-wrap.awooc-popup-inner .wpcf7-form-control.wpcf7-submit {
  background-color: black !important;
  color: #fff;
  box-shadow: 0 1px 1px rgba(0,0,0,.125);
  border-radius: 4px;
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 600;
}
.awooc-custom-order-wrap.awooc-popup-inner h2 {
  font-size: 28px;
  font-weight: 600;
  font-family: Montserrat;
  color: black;
}
.awooc-custom-order-wrap.awooc-popup-inner h5 {
  color: black;
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 130%;
}
.header-search.headsearch--inp {
  width: 300px;
}

.headsearch--inp .gensearch__input {
   font-style: normal; 
}
.kl-cart-icon.xs-icon.svg-cart svg,
.kl-cart-icon.xs-icon.svg-cart .cartimg {
  width: 24px;
  height: 24px;
  display: block;
}
.kl-cart-button .svg-cart.kl-cart-icon::after {
  content: attr(data-count);
  font-size: 9px;
  background-color: black;
  color: #fff;
  width: 18px;
  height: 18px;
  display: block;
  text-align: center;
  line-height: 18px;
  border-radius: 50%;
  position: absolute;
  top: -3px;
  left: 15px;
  font-weight: 600;
  padding-right: 1px;
}
.kl-cart-button .svg-cart.kl-cart-icon {
  position: relative;
  top: -2px;
  margin-right: 7px;
  display: block;
}
.button.wc-forward {
  font-weight: 500 !important;
}
.logo-img.site-logo-img {
  height: 20px !important;
  width: auto !important;
}

@media (max-width: 767px) {
  .logo-img.site-logo-img {
    height: 14px !important;
    width: auto !important;
  }
  a.site-logo-anch {
    height: 14px;
    line-height: 14px;
    display: inline-flex;
    align-items: center;
  }
  #logo {
    line-height: 0px;
  }
  .sh-component.topnav.navLeft.topnav--cart.topnav-no-sc.topnav-no-hdnav {
    padding-top: 0px;
  }
  .headtop2 {
    text-align: center;
    color: white;
    font-family: Montserrat, sans-serif;
    text-transform: uppercase;
    font-size: 10px;
    line-height: 14px;
  }
  .woocommerce ul.products li.product .product-list-item.prod-layout-style2 .kw-details-title {
    min-height: 20px;
    max-height: 20px;
    height: 20px;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .product-list-item .product-brand,
  .product-list-item .product-brand a {
    height: 20px;
    line-height: 20px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .product-list-item .additional-product-block {
    gap: 0px;
  }
}
.added_to_cart.wc-forward {
  display: none !important;
}



.wc-atcp-btn.wc-atcp-btn--secondary {
  background: white;
  color: black;
  border: 1px solid black;
}


.wc-atcp-popup.animate__animated.animate__jackInTheBox {
  width: 520px;
  border-radius: 0px;
}
.wc-atcp-popup-notice span {
  color: black;
  font-size: 16px;
  font-family: Montserrat;
  font-weight: 500;
}
.wc-atcp-product__name {
  margin-top: 20px;
  font-size: 24px;
  font-weight: 400;
  font-family: Montserrat;
  margin-bottom: 20px;
  color: black;
  line-height: 30px;
}
.wc-atcp-product__price {
  font-size: 20px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 0px;
  margin-bottom: 20px;
  font-family: Montserrat;
  color: black;
  font-weight: 500;
}

.wc-atcp-btn.wc-atcp-btn--secondary {
  font-family: Montserrat;
  font-size: 16px;
}
.wc-atcp-btn.wc-atcp-btn--primary {
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 500;
}
.custommes {
  margin-left: 0px !important;
}

.woocommerce .woocommerce-error {
  background-color: #f28080;
}











.animate__jackInTheBox {
  animation-name: none;
}
@media (max-width: 768px) {
    .cart__mobile {
        display: block;
    }
    .woocommerce-checkout .cart_item td.product-thumbnail {
  display:inline-block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.woocommerce-checkout .variation {
  margin-left: 0px;
  font-size: 13px !important;
}
.zn-wc-pages-style2 .checkout.woocommerce-checkout {
  padding: 0px;

}
    .shop_table td::before {
        content: attr(data-title);
        font-weight: bold;
    }
    /* Сховати стандартні колонки на мобільних */
    .product-remove,
    .product-thumbnail,
    .product-subtotal {
        display: none;
    }
  #order_review_heading {
  padding-left: 0px !important;
}  
.animate__jackInTheBox {
  animation-name: none;
}
.cart__mobile .quantity {
    position: relative;
  display: flex;
  width: 95px;
  justify-content: center;
  margin: 0 auto;
}
.cart__mobile .minus {
    background: transparent;
  border: 0;
  border-radius: 0;
  padding: 15px;
  position: absolute;
  bottom: 0;
  height: 50px;
  display: flex;
  align-items: center;
  left: 0;
}
.woocommerce-shipping-totals.shipping td::before {
 display:none !important;   
}
.cart__mobile .plus {
   background: transparent !important;
  border: 0;
  border-radius: 0;
  padding: 15px;
  position: absolute;
  bottom: 0;
  height: 50px;
  display: flex;
  align-items: center; 
  right:0;
}
.cart__mobile input.qty {
  background: transparent;
  border: 0px;
  height:50px;
  color: black;
  text-align: center;
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
}
.cart__mobile {
    display:block;
}

input[name='update_cart'] {

display: none !important;

}

/* OR YOU CAN TRY THIS */

button[name='update_cart'] {

display: none !important;

}
.cart__mobile {
		display: flex;
		justify-content: flex-end;
		align-items: center;
	}
	
	.woocommerce-cart-form__cart-item.cart_item td.product-quantity {
  display: none;
}
	.woocommerce-cart .zn-cartpage-style2 table.cart tr {
		position: relative;
	}
	
	td.product-thumbnail {
		padding: 0 !important;
	}
	
	td.product-thumbnail:before {
		content: '';
		display: none;
	}
	
	table.cart tbody td.product-subtotal,
/* 	table.cart tbody td.product-quantity, */
	table.cart tbody td.product-price {
		display: none !important;
	}
	
	table.cart tbody .product-remove {
		position: absolute;
		top: 10px;
		right: 11px;
		padding: 0 !important;
	}
	
	table.cart tbody td.product-name {
		text-align: left !important;
		width: calc(100% - 91px);
		padding: 15px 15px 15px 13px !important;
	}

	table.cart tbody td.product-name a {
		display: block;
		width: calc(100% - 20px);
	}
	
	table.cart tbody .product-name .variation {
		display: flex;
	}
	
	.woocommerce .quantity .qty,
	.woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail img {
		border: none;
	}
	
	.woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail {
		margin-left: 15px;
	}
	
	.woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail img {
		margin-top: 15px;
	}
	
	.cart-collaterals .cart-subtotal th,
	.cart-collaterals .order-total th {
		display: inline-block !important;
	}
	
	.cart-collaterals .cart-subtotal td,
	.cart-collaterals .order-total td {
		width: 63%;
	}
	
	.woocommerce table.shop_table td {
		border: none;
	}
	.woocommerce .woocommerce-message .button.wc-forward {
    width: max-content !important;
    float: left;
    margin-bottom: 15px;
  }

	
	.woocommerce-cart #page_wrapper .zn-cartpage-style2 table.cart td.actions {
		width: 100%;
	}

.woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail {
  width: 70px;
}
  	.woocommerce table.shop_table_responsive tr td::before, .woocommerce-page table.shop_table_responsive tr td::before {
		content: '';
		display: none;
	}
	
	.woocommerce table.shop_table_responsive tr td, 
	.woocommerce-page table.shop_table_responsive tr td,
	
	.woocommerce-page table.cart .product-thumbnail {
		display: inline-block;
	}
	
	table.cart tbody td.product-subtotal,
/* 	table.cart tbody td.product-quantity, */
	table.cart tbody td.product-price {
		display: none !important;
	}
	
	table.cart tbody td.product-quantity {
/* 		display: block !important; */
		float: left;
		margin-top: -52px;
		margin-left: 89px;
		padding: 15px 0 !important;
		z-index: 9999;
		/* font-variant: proportional-nums; */
		position: relative;
	}
	
	table.cart tbody .product-remove {
		position: absolute;
		top: 10px;
		right: 11px;
		padding: 0 !important;
	}
	
	table.cart tbody .product-name .variation {
		display: flex;
	}
	 table.cart tbody .product-name .variation {
    display: flex;
  }
	
.woocommerce-cart-form__cart-item.cart_item {
  margin-bottom: 30px;
}	
.woocommerce table.shop_table_responsive tr:nth-child(2n) td, .woocommerce-page table.shop_table_responsive tr:nth-child(2n) td {
  background-color: transparent;
}
.woocommerce-cart-form__cart-item.cart_item {
  padding-top: 20px;
}
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail img {
    margin-top: 0px;
  }
 .cart__mobile {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.cart__mobile .product-price {
  width: 100%;
  text-align: right !important;
}
table.cart tbody td.product-name {
    text-align: left !important;
    width: calc(100% - 91px);
    padding: 0px 0px 0px 2px !important;
  }
  .woocommerce .zn-cartpage-style2 > form {

    border: 0px solid #ddd;
  }
  .woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail {
    margin-left: 0px;
  }
  .woocommerce-cart .zn-cartpage-style2 table.cart td.product-thumbnail {
    max-width: 70px;
    height: 100%;
  }
  .woocommerce-cart-form__cart-item.cart_item {
  display: flex !important;
}

.woocommerce-cart-form__cart-item.cart_item .variation {
  margin-bottom: 5px !important;
}
 table.cart tbody td.product-name a {
    display: block;
    width: calc(100% - 32px);
    margin-left: 15px;
  }
  
  
  .variation {
  font-size: 14px;
  margin-left: 15px;
}
.cart_totals {
  padding-left: 0px !important;
  padding-right: 0px !important;
}
    
    
}











.social2 img {
    height: 30px;
}

#s {
  background: #cdcbc5;
}

.gensearch__submit::after {
  display: none;
}

.zn_sidebar {
  padding: 10px 0px;
  border-radius: 0px;
  margin-bottom: 0px;
  background: transparent;
  box-shadow: 0 10px 10px -10px rgba(0,0,0,0);
  margin-top: 90px;
}







.cartimg {
  height: 24px !important;
  width: 24px !important;
}








.wpc-search-field {
  height: 42px;
  width: 100%;
  padding-left: 20px;
  padding-right: 52px;
  outline: none;
  border: 1px solid #ddd;
  background: #cdcbc5;
}
.widget-title.wpc-filter-title {
  margin-top: 0px !important;
}


#product-desc-collapse {
  color: black;
}

#third_section .media-container-pb {

  margin: 0px 10px;
}

.woocommerce ul.products li.product .product-list-item.prod-layout-style2 {
  background: transparent;
}


.gift-card-custom-amount, .gift-card-recipient-name {
  font-family: Montserrat;
  width: 100%;
  font-size: 15px;
  color: black;
  margin-bottom: 20px;
}
.gift-card-custom-amount input, #gift_card_recipient_name {
  border: 1px solid #DADADA;
  background: white;
  color: black;
  text-align: center;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
  width: max-content;
  height: 30px;
  width: 90px;
}
#gift_card_recipient_name {
width:120px;    
    
    
}

@media screen and (max-width: 767px) {
    
    
    
    
    
    
    /*ГОЛОВНА*/
    

    .eluid54afdd8d .zn-section-height--custom_height {
    height: 550px;
}
    
.eluid54afdd8d {
    
    padding-bottom: 0px;
}    
  
    
  .eluid9d80a267 {
    padding-top: 30px;
    padding-bottom: 0px;
}
.eluid8b05f5ea {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 21px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: left;
}  
    
  h3#head_main {
    padding-left: 0px;
}  
 .woocommerce.spp-carousel .spp-list.products .product-list-item.prod-layout-style2 {
    margin: 0 15px 0px 10px;
}   
    
    
    .additional-product-block * {
    font-size: 12px;
    line-height: 18px;
}


a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
    font-size: 12px;
    line-height: 16px;
}

.eluide34f1117 {
    padding-top: 20px;
    padding-bottom: 35px;
}





h3#head_media {
    font-size: 15px;
    line-height: 22px;
    font-weight: 400;
    
}

h3#head_main {
    margin-bottom: 20px;
}

section#third_section .media-container {
    min-height: 210px !important;
    margin-bottom:0px;
}

div#eluid9f950837 {
    margin-bottom: 10px;
}

.eluid8a14dd0e {
    padding-top: 10px;
    padding-bottom: 30px;
}

.eluid2ca6233e {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 21px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: left;
}


.eluidbb55f92a {
    min-height: 250px;
}
    
    
    
    
.eluid854c0017 {
    margin-bottom: 25px;
}


.eluid28c03994 {
    padding-right: 0px;
    padding-left: 0px;
}


.eluid28c03994 {
    min-height: 450px;
}

.eluid9551b499 span {
        font-size: 16px !important;
        
    }
    
    .eluid6279940d.btn {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 12px;
    line-height: 14px;
    font-weight: 500;
}

div#eluid26dcedfe {
    padding-left: 0px;
    padding-right: 0px;
}


section#five_section .media-container-pb {
    width: calc(100% - 50px);
    margin: 40px 20px;
}

a#bttn2 {
    margin-bottom: 20px;
}


.eluid3c4d8241 {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 21px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: left;
}

.eluid9902ba03 {
    padding-top: 35px;
    padding-bottom: 0px;
}

.eluid3c4d8241 {
    margin-bottom: 20px;
}

.eluid714e15b9 {
    padding-top: 30px;
    padding-bottom: 20px;
}

.eluid442fc7b2 {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 14px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: left;
}


.eluid1c061bc1 {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 14px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: left;
}

.eluid74b1dee6 {
    margin-bottom: 15px;
}

.zn_custom_html.eluid943306ab.hidden-zn_dummy_value.hidden-zn_dummy_value.hidden-zn_dummy_value.hidden-zn_dummy_value {
    padding-bottom: 40px;
}


.social2 img {
    height: 25px;
}


.eluid74b1dee6 img.image-boxes-img.img-responsive {
    height: 20px;
}

.eluid854c0017 {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 21px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: center;
}

h3.m_title.m_title_ext.text-custom.latest_posts-title {
    font-size: 14px;
}


section#five_section .zn-bgSource-image {
        background-image: url(https://dev.youwillfeel.com.ua/wp-content/uploads/2024/11/fon_mobile.jpg) !important;
        
    }
    
    
    
    
    
    
    
    
    /*КОНТАКТИ*/
    
    
    
    .eluid55b09157 {
    padding-right: 0px;
    padding-left: 0px;
}

.eluid00360886 {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 26px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: center;
}
    
 .eluid55b09157 {
    min-height: 555px;
}

.eluid00360886 {
    margin-bottom: 40px;
}

section#eluidd5eef0f2 .kl-iconbox__inner .kl-iconbox__title{
        font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 500;
    color: #0a0a0a;
    font-style: normal;
}


section#eluidd5eef0f2 .kl-iconbox {
    margin-bottom: 5px;
}
    .eluid55b09157 {
        min-height: 470px;
    }
    
    div#eluid8236186d {
    margin-top: 20px;
}

.eluid212d9173 {
    padding-right: 0px;
    padding-left: 0px;
}

.eluidf1189415 {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 26px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: left;
}

.eluid212d9173 {
    min-height: 570px;
}

section#eluid770bbb7c {
    padding-top: 30px;
    padding-bottom: 30px;
}

.kl-material-form-label {
    font-size: 14px;
}

div#eluid22e6d091 .media-container-pb.media-container-pb--alg-center {
    padding-bottom: 30px;
}

h3#eluidf1189415 {
    padding-top: 10px;
}

.eluidf1189415 {
    margin-bottom: 20px;
}














    /*ПРО НАС*/

.eluid5128fa55 {
    padding-right: 0px;
    padding-left: 0px;
}


.eluid5128fa55 {
    min-height: 470px;
}

.eluid8411173e {
    margin-bottom: 20px;
}

section#aboutus1 .media-container-pb {
    width: calc(100% - 50px);
    margin: 10px 10px;
}

.eluid607c2a2e {
    min-height: 220px;
}


.eluid8411173e {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 21px;
    font-weight: 400;
    text-transform: uppercase;
    text-align: left;
}

.eluid6acf7de9 {
    padding-right: 0px;
    padding-left: 0px;
}

.eluid5bdc3c2c {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 26px;
    font-weight: 400;
    text-transform: uppercase;
    text-align: left;
}

.eluid5bdc3c2c {
    margin-bottom: 20px;
}


.eluid92249947 {
    min-height: 220px;
}

.eluid8cfd4113 p {
    margin-bottom: 0px;
}



.eluid6acf7de9 {
    min-height: max-content;
    margin-top:20px;
}

div#eluid9a39dcf3 {
    padding-left: 0px;
    padding-right: 0px;
}

/* *header**/
  #header {
    margin-top: 25px;
    position: fixed !important;
    left: 0;
    top: 0;
  }


.sh-component.main-menu-wrapper {
  display: none;
}
.site-logo-anch {

  text-align: left;
}
  #header {
    margin-top: 30px;
    
    left: 0;
    top: 0;
  }
    .header-search {

    z-index: 100;
    width: auto !important;
  }
  
  
/* 1. Базова стилізація кнопки пошуку */
.searchBtn {
    position: relative; /* Для розміщення псевдоелементів відносно кнопки */
    display: inline-block;
    width: 37px; /* Встановлена ширина відповідно до висоти */
    height: 37px; /* Встановлена висота */
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    outline: none;
}

.header-search .header-search-button {
    line-height: 1;
    display: inline-block;
    background: transparent;
    position: relative;
    z-index: 1;
    height: 26px;
    width: 26px;
    text-align: center;
    line-height: 30px;
    font-size: 12px;
    margin: 0;
}

/* 2. Приховати існуючі іконки */
.searchBtn .glyphicon {
    display: none;
}

/* 3. Додавання іконки пошуку за допомогою ::before */
.searchBtn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px; /* Відрегулюйте розмір SVG відповідно до потреб */
    height: 20px;
    background-image: url('/wp-content/uploads/2025/08/Vector2.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translate(-50%, -50%);
    opacity: 1;
}

/* Додаткові стилі для компонента заголовка */
.site-header .sh-component {
    margin: 5px;
}

#search {
    height: 24px;
}
#mycartbtn {
  padding: 0px;
}
/* 4. Додавання іконки хрестика за допомогою ::after */
.searchBtn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 24px;
    background-image: url('https://dev.youwillfeel.com.ua/wp-content/uploads/2024/11/Vector2.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0;
}

/* 5. Зміна видимості іконок при активному стані */
.searchBtn.active::before {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.8);
}

.searchBtn.active::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

/* Видалено анімації для плавності */
/* .searchBtn::before,
.searchBtn::after {
    transition: opacity 0.3s ease, transform 0.3s ease;
} */

.header-search .header-search-button.active {
    background: transparent;
    border-radius: 2px 2px 0 0;
}

.kl-cart-button .svg-cart.kl-cart-icon {
    position: relative;
    top: 0px;
    margin-right: 0px;
    display: inline-block;
}
.fxb-col.fxb.fxb-center-x.fxb-center-y.fxb-basis-auto.fxb-grow-0.site-header-col-center.site-header-main-center {
  width: 50%;
}
.kl-cart-button .svg-cart.kl-cart-icon::after {
    line-height: 18px;
}
/* 1. Приховати існуючі іконки glyphicon */
.gensearch__submit.glyphicon-search::before {
    content: none; /* Приховує псевдоелемент glyphicon */
}

/* 2. Базова стилізація кнопки пошуку */
.gensearch__submit {
    position: relative; /* Для розміщення фонової іконки відносно кнопки */
    display: inline-block;
    width: 37px; /* Встановлена ширина */
    height: 37px; /* Встановлена висота */
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    outline: none;

    /* Додавання SVG-іконки як фонове зображення */
    background-image: url('/wp-content/uploads/2025/08/Vector2.svg');
    background-size: 20px 20px; /* Встановлює розмір іконки */
    background-repeat: no-repeat;
    background-position: center; /* Центрує іконку в кнопці */
}
.sh-component.topnav.navLeft.topnav--cart.topnav-no-sc.topnav-no-hdnav {
  height: 26px !important;
  padding-top: 0px;
}
.headtop2 {
  text-align: center;
  color: white;
  font-family: Montserrat, sans-serif;
  text-transform: uppercase;
  font-size: 11px;
  line-height: 12px;
}
.header__wrapper {
  height: 73px;
}  
 .header-search .gensearch__submit {
    width: 20px;
    height: 20px;

  } 
 .topnav-item, .topnav .menu-item > a {

  opacity: 1;
} 
.search-container.header-search-container.panel-opened {
  background: white;
}
.sh--dark .headsearch--inp .gensearch__input:focus, .sh--gray .headsearch--inp .gensearch__input:focus {
  color: #141414;
  background-color: rgba(0,0,0,.2);
  box-shadow: 0 0 0 2px rgba(0,0,0,0);
  color: black !important;
}
  .header-search .header-search-button:hover {
    background: transparent;
  }
  .header-search .header-search-container {
    padding: 20px;

    box-shadow: 0 3px 7px rgba(0,0,0,0);
  }
#searchform {
    width:100% !important;
}
/*ІНШІ*/


.eluid17872b06 {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 21px;
    line-height: 26px;
    font-weight: 400;
    text-transform: uppercase;
    text-align: left;
}

.eluid28fabcca {
    padding-top: 30px;
    padding-bottom: 0px;
}

.eluid17872b06 {
    margin-bottom: 30px;
}

.site-content {
  margin-top: 60px;
}

body.woocommerce .site-content,
body.woocommerce-page .site-content,
body.archive.post-type-archive-product .site-content,
body.tax-product_cat .site-content,
body.tax-product_tag .site-content {
  position: relative;
  margin-top: 56px;
}

body.single-product .site-content,
.single.single-product .site-content {
  position: relative;
  margin-top: 24px !important;
}


.wpc-filters-open-button-container {
  display: inline-block !important;
  margin-top: 0px !important;
}   
.headertop2__slider > div {
    display: none;
}

.headertop2__slider > div:first-child {
    display: block;
}



.woocommerce-products-header__title.page-title {
  font-size: 21px;
  line-height: 21px;
  text-align: left;
}
.woocommerce-products-header__title.page-title {
  margin-bottom: 60px;
  text-align: center;
}

.woocommerce-products-header__title.page-title {
  margin-top: 7px;
}
.woocommerce div.product div.images {
  margin-bottom: 0em;
}

.woocommerce div.product.prodpage-style2 form.cart div.quantity, .woocommerce div.product form.cart .single_variation_wrap .variations_button div.quantity, .woocommerce div.product form.cart div.quantity, .mobile-cart-version div.quantity {
  margin-right: 2%;
  position: relative;
  display: flex;
  width: 23%;
  flex-direction: column;
}
.single_add_to_cart_button.button.alt {
    width: 75% !important;
  }
.awooc-custom-order-button {
  margin-left: 0% !important;
  width: 100% !important;
}
/* LEGACY: стара стилізація h2 у related/up-sells — обмежили щоб НЕ зачіпала
   нашу .ywf-section-head__title (вона стилізується нижче окремо). */
.related.products h2:not(.ywf-section-head__title),
.up-sells.upsells.products h2:not(.ywf-section-head__title) {
  font-family: "Montserrat", Helvetica, Arial, sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
  color: black;
}
.woocommerce ul.products[class*="columns-"] li.product, .woocommerce-page ul.products[class*="columns-"] li.product {
  width: 50%;
  float: left;
  clear: both;
  margin: 0 0 10px;
}
.wc-atcp-cart__cta a:first-child {
  margin-right: 0px;
}
.blockUI.blockMsg.blockMsgAwooc.blockPage {
  width: 90% !important;
}
.awooc-custom-order-wrap.awooc-popup-inner h2 {
  padding-top: 0px !important;
  margin-top: 0px !important;
}
.wpcf7-form.init p {
  margin-bottom: 0px;
}
.woocommerce-cart #page_wrapper .zn-cartpage-style2 table.cart td.actions .coupon .input-text {
  width: 100% !important;
}
.woocommerce-cart #page_wrapper .zn-cartpage-style2 table.cart td.actions {
  height: auto;
  padding: 0px;
}
.woocommerce .zn-cartpage-style2 table.cart .cart_item td {
  font-family: Montserrat;
  font-size: 14px !important;
  font-weight: 300;
}
.woocommerce-cart .zn-cartpage-style2 table.cart td.product-remove .remove {
  display: inline-block;
  position: relative;
  margin: 0 auto;
  width: 20px;
  height: 20px;
  line-height: 30px;
  background: #000000;
}
  table.cart tbody .product-remove {
    position: absolute;
    top: 20px;
    right: 0px;
    padding: 0 !important;
  }
.woocommerce .zn-cartpage-style2 .cart-collaterals .cart_totals > h2 {

  text-align: left;
}

.page-title.kl-blog-page-title {
    font-weight: 500 !important;
 
  }
.zn-wc-pages-style2 .woocommerce .checkout_coupon {
  background-color: #fff;
  padding: 35px 25px 35px;
  border: 0;
  border-radius: 0;
  margin: 0;
}    
  .page-title.kl-blog-page-title {
    font-weight: 500 !important;
    font-size: 21px !important;
    line-height: 21px;
  }
#responsive-menu-pro-container {
  margin-top: 85px !important;
}



 #responsive-menu-pro-container #responsive-menu-pro > li.responsive-menu-pro-item > a {
    border-top: 1px solid rgba(230, 228, 221, 1);
    text-transform: uppercase;
}
#head_main, #eluid3c4d8241 {
  text-align: center;
}

.elm-custommenu * {
  text-transform: uppercase;
  font-size: 13px;
}
.related.products {
  margin-top: 60px;
}



.site-header .site-logo {
 padding-top: 10px;
    padding-bottom: 10px;
  
}

#header {
  height: 42px !important;
}
#eluidd220aa98 {
  padding: 0px;
}
.eluidcf5135ff {
  padding-top: 0px;
  padding-bottom: 0px;
}
#home_slider_pc .prev, #home_slider_mobile .prev {
  left: 5px;
}
#home_slider_pc .prev svg, #home_slider_mobile .prev svg, #home_slider_pc .next svg, #home_slider_mobile .next svg {
  width: 25px;
}
#home_slider_pc .next, #home_slider_mobile .next {
  right: 5px;
}
.btn-pereyti {
  bottom: 20%;
}

#responsive-menu-pro-container {
  border-top: 1px solid #0000002e !important;
}
 #responsive-menu-pro-container .responsive-menu-pro-search-box {
    background: #ffffff;
    border: 0px solid rgb(0, 0, 0) !important;
    color: rgba(0, 0, 0, 1);
 }
.responsive-menu-pro-search-box {
  height: 45px !important;
}
.single_product_main_image.col-sm-6 {
  padding: 0px !important;
}
.woocommerce div.product div.images .woocommerce-product-gallery__image:first-child {
  margin-left: 0px !important;
  margin-right: 0px !important;
}


.related.products.related-products-mobile-normal {
  display: block;
}
 #responsive-menu-pro-container .responsive-menu-pro-search-box {
    background: #ffffff70 !important;
    border: 2px solid rgba(0, 0, 0, 1);
    color: rgba(0, 0, 0, 1);
  }
  
  
  
  

}








.latest_posts--4.default-style .latest_posts-title {

    text-transform: uppercase;
}

em.post-details.element-scheme__faded.latest_posts-details {
    text-transform: uppercase;
}

span.latest_posts-readon.u-trans-all-2s.text-custom-child.kl-main-bgcolor {
    text-transform: uppercase;
}

.zn_sidebar.sidebar.kl-sidebar--light.element-scheme--light {
    text-transform: uppercase;
}

ul.itemSocialSharing.kl-blog-post-socsharing.clearfix {
    display: none;
}

.post-author.kl-blog-post-author {
    display: none;
}

.slick-dots {
    list-style: none;
    display: flex;
    justify-content: center;
    margin-top: 10px;
    padding: 0;
}

.slick-dots li {
    margin: 0 5px;
}

.slick-dots li button {
    border: none;
    background-color: gray;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    padding: 0;
    cursor: pointer;
}

.slick-dots li.slick-active button {
    background-color: black;
}


/* Стилі для мобільної версії */
@media (max-width: 768px) {
    .variations-head {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px;
    background-color: transparent;
    cursor: pointer;
    box-sizing: border-box;
    margin-bottom: 10px;
  }

    .variations-head p {
        margin: 0;
        font-size: 14px;
        flex-grow: 1;
        display: flex; /* Додаємо Flexbox до тексту для вирівнювання */
        align-items: center; /* Вирівнювання тексту по центру вертикально */
    }

    .variations-icon {
        width: 15px; /* Розмір іконки */
        height: 24px;
        background-image: url('https://dev.youwillfeel.com.ua/wp-content/uploads/2024/11/Vector3.svg');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }


    /* Приховуємо десктопні варіації на мобільних */
    .custom-variations-desktop {
        display: none;
    }

    /* Фон для спливаючого вікна */
    .custom-variations-overlay {
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5); /* Напівпрозорий чорний фон */
        z-index: 9998; /* Нижчий за спливаюче вікно */
    }

    .custom-variations-overlay.active {
        opacity: 1;
        visibility: visible;
    }

    /* Спливаюче вікно */
    .custom-variations-popup {
        opacity: 0;
        visibility: hidden;
        transform: translateY(100%);
        transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        max-height: 80%;
        background: #e4e2db;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.3);
        overflow-y: auto;
        z-index: 10000; /* Встановіть високий z-index */
        padding: 10px;
        box-sizing: border-box;
    }

    .custom-variations-popup.active {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
    .custom-variations-popup.active {
  padding-top: 30px !important;
}
    /* Стилі для кнопки закриття */
     .custom-variations-popup .close-popup {
    position: absolute;
    top: -10px;
    right: 5px;
    font-size: 29px;
    font-weight: bold;
    color: #333;
    cursor: pointer;
  }

    /* Стилі для елементів варіацій у спливаючому вікні */
    .custom-variations-popup .custom-variations {
        display: flex;
        flex-direction: column;
    }

    .custom-variations-popup .variation-item {
        padding: 10px;
        border-bottom: 1px solid #ddd;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .variations-head.active .variations-icon {
        transform: rotate(180deg);
    }
    .custom-variations-popup .variation-item:last-child {
        border-bottom: none;
    }

    .custom-variations-popup .variation-item:hover {
        background-color: #f9f9f9;
    }
    .custom-variations-popup.active {
  border-top: 1px solid black;
}
.variations-head-pc {
  display: none;
}
.variation-price {
  font-size: 16px;
  padding-right: 15px;
}



}

/* Стилі для десктопної версії */
@media (min-width: 769px) {
    .custom-variations-popup,
    .custom-variations-overlay {
        display: none !important;
    }
    .variations-head {
        display:none;
    }
    .custom-variations-desktop {
        display: block;
    }
    .variations-head * {

  margin-bottom:0px;
}

}

/* Кнопка "TOP" */
#totop {
    z-index: 1000; /* Встановіть нижчий z-index, ніж спливаюче вікно */
    position: fixed; /* Переконайтесь, що елемент має позиціонування */
}



@media (max-width: 769px) {
    
.headtop2 {

    height: 32px;

}
.header__wrapper {
  height: 91px;
}
#responsive-menu-pro-container {
    margin-top: 90px !important;
  }
/* Стилі для #header */
  #header {
    margin-top: 38px;
    left: 0;
    top: 0;
    height: 52px !important;
  }
   .site-header .site-logo {
    padding-top: 17px;
    padding-bottom: 17px;
  }
  button#responsive-menu-pro-button {
    top: 39px !important;
  }
   #totop {
  border-radius: 100%;
  font-family: Montserrat;
  font-weight: 300;
  font-size: 10px;
}


#eluid28fabcca {
  margin-top: 30px;
}





    
}

#totop::before {
  position: absolute;
  content: "\e080";
  top: 14px;
  left: 50%;
  margin-left: -6px;
  font-size: 10px;
  display: inline-block;
  font-family: Glyphicons Halflings;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: rotate(-90deg);
}




















body #page_wrapper, body.boxed #page_wrapper {
    background-color: #ffffff !important;
}

.wpc-search-field {

    background: #ffffff;
}

.header__wrapper {
    height: 48px;
}

.summary.entry-summary .product_title.entry-title {
    padding-top: 0%;
}

@media (max-width: 769px) {
     .site-content {
        margin-top: 40px;
    }  
    .woocommerce-products-header__title.page-title {
        margin-bottom: 15px;
        text-align: center;
    }
    .woocommerce-message {
  margin-top: 10px;
}
        .woocommerce ul.products[class*="columns-"] li.product, .woocommerce-page ul.products[class*="columns-"] li.product {
        margin: 28px 0 0px;
    }
    
        .wpc_show_bottom_widget .wpc-filters-open-button-container {
        margin-top: 1em;
        margin-bottom: 0em;
    }
    
        a#bttn2 {
        margin-bottom: 20px;
        border: 1px black solid;
    }
    .custom-variations-popup.active {
    background-color: #e4e2db;
}

       .panel-body {
        padding: 0px;
        padding-top: 10px;
    }
   button.single_add_to_cart_button.button.alt {
   
    background-color: white !important;
    border: 1px solid black !important;
} 

}

button.single_add_to_cart_button.button.alt {
   
    background-color: white !important;
    border: 1px solid black !important;
}
.woocommerce div.product form.cart .button {
    background-color: white !important;
    border: 1px solid black !important;
}


.zn-buttonWrapper .eluid153ab9f7.btn {
    background-color: rgb(228 226 219);
}

.kl-iconbox__el-wrapper.kl-iconbox__desc-wrapper a:hover {
    color: black;
}



.product-brand :hover {
  color: #b1abab;
}
@media screen and (max-width: 767px) {

.slick-slide img {
display: block;
    height: 770px;
    width: 100%;

}

a#bttnwhite {
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
    font-size: 11px;
    line-height: 11px;
    font-weight: 400;
    text-transform: uppercase;
}
div#divbttn {
    padding-right: 20px;
}

    #head_main1 {
        text-align: left;
         
        font-family: "Montserrat", Helvetica, Arial, sans-serif;
        font-size: 18px;
        line-height: 18px;
        font-weight: 500;
        text-transform: uppercase;
        text-align: left;
  
    }
    
    section#eluidd5eef0f2 {
    margin-bottom: 60px;
}

.eluid2cc89c91 {
    padding-top: 30px;
    padding-bottom: 60px;
}
div#eluid14f0debe {
    margin: 10px 25px;
}


    
    
        #h3new {
        font-family: "Montserrat", Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 23px;
        font-weight: 500;
        text-transform: uppercase;
        text-align: left;
    }
    

 section#aboutus1 .media-container-pb {
    width: 100%;
    margin: 0px;
  }
  
  .zn_text_box.eluid8cfd4113.hidden-zn_dummy_value.textnew.zn_text_box-light.element-scheme--light *, .zn_text_box.eluide01ca606.hidden-zn_dummy_value.textnew.zn_text_box-light.element-scheme--light *{
  font-size: 14px !important;
  text-transform: lowercase;
  font-style: italic;
}
    .eluid5128fa55 {
    min-height: max-content !important;
    margin-top: 50px;
    margin-bottom: 25px;
  }
  
    
}






div#divbttn {
    padding-right: 30px;
}
h3#head_main {
    margin-top: 0px;
}
h3#head_main1 {
    margin-top: 0px;
}
h3#head_main1 {
    padding-left: 30px;
}

.gift-card-custom-amount label, .gift-card-recipient-name label {
  font-weight: 300 !important;
  text-transform: uppercase !important;
  font-size:13px;
}
@media screen and (max-width: 767px) {
    h3#head_main1 {
    padding-left: 0px;
}
#gift_card_amount, #gift_card_recipient_name {
  width: 100%;
  height:35px;
}


.woocommerce.single-product div.product p.price, .woocommerce.single-product div.product span.price {
  font-size: 16px;
  color: black;
}
#responsive-menu-pro-wrapper {
  padding-top: 2vh !important;
  padding-bottom: 2vh !important;
}
.woocommerce-products-header__title.page-title {
  margin-top: 40px;
}
 #responsive-menu-pro-container #responsive-menu-pro li.responsive-menu-pro-item a {
    padding: 0 15px !important;
  }
  .product_title.entry-title {
  font-size: 18px !important;
}
  #responsive-menu-pro-container {
  height: max-content !important;
}
div#divbttn {
    padding-right: 20px;
}
    .eluid5128fa55 {
        min-height: 700px;
    }
    
    .eluid55b09157 {
        min-height: 700px;
    }
    div#eluidb2eca1da {
    padding-left: 0px !important;
    padding-right: 0px !important;
}
    
    .eluid55b09157 {
    min-height: auto;
  }
 .eluid212d9173 {
    min-height: auto;
    padding-top: 20px;
  }    
  div#eluid22e6d091 .media-container-pb.media-container-pb--alg-center {
    padding-bottom: 0px;
  }   
    section#eluidd5eef0f2 {
    margin-bottom: 20px;
  } 
  
    section#eluidd5eef0f2 {
    margin-bottom: 0px;
    background: #f4f3f0 !important;
  }
    div#eluid8236186d {
    margin-top: 20px;
    padding-top: 20px;
  }
    
#eluid5d3edee6 {
  display: inline-block !important;
}
    
 .sh-component.topnav.navLeft.topnav--cart.topnav-no-sc.topnav-no-hdnav {
    height: 24px !important;
  }   
    
#eluid93dc92eb .zn-Slider .zn-Slider-itemInner {
  padding: 0 0px;
}    
.eluid212d9173 {
    min-height: auto;
    padding-top: 0px;
  }
 #eluid22e6d091 {
  padding: 0px !important;
} 
#eluid93dc92eb .zn-Slider {
  list-style: none;
  margin: 0 -25px;
  padding: 0;
}  
  #divbttn {
  margin-top: -7px;
}
.sh-component.topnav.navLeft.topnav--cart.topnav-no-sc.topnav-no-hdnav {
  margin-right: 5px !important;
}
.eluid69737c33 .kl-iconbox__inner .kl-iconbox__desc, .eluid8e6f777c .kl-iconbox__inner .kl-iconbox__desc, .eluid552cabba .kl-iconbox__inner .kl-iconbox__desc, .eluidb2bd1902 .kl-iconbox__inner .kl-iconbox__desc {
  font-family: "Montserrat", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 15px;
}
.page-title.kl-blog-page-title {
  margin-top: 40px;
}
#coupon_code {
  margin-bottom: 10px;
}


}
.product-name:hover a {
  color: black !important;
}

/* коли лічильник = 0 — бейдж не показуємо */
.kl-cart-button .svg-cart.kl-cart-icon[data-count="0"]::after {
  content: none !important;
  display: none !important;
}
body .wpc-filters-main-wrap li.wpc-term-item {
  margin-bottom: 16px;
}
body .wpc-filters-main-wrap li.wpc-term-item:last-child {
  margin-bottom: 0;
}

/* "Показати більше / менше" — 10px зверху від списку */
.wpc-see-more-control.wpc-toggle-a,
.wpc-see-less-control.wpc-toggle-a {
  display: inline-block;
  margin-top: 10px;
}

body .wpc-filters-main-wrap .wpc-filters-ul-list,
body .wpc-filters-main-wrap ul.wpc-filters-ul-list,
.wpc-filters-main-wrap ul.wpc-filters-ul-list,
.wpc-filters-widget-content ul.wpc-filters-ul-list,
.ywf-shop-row .wpc-filters-ul-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  margin-left: 0 !important;
  float: none !important;
}

/* Старе правило знешкоджене — стилізація чекбоксу нижче у спеціальному блоці */

/* Search field inside WPC filter (Бренди) */
.wpc-filter-search-wrapper {
  position: relative;
  width: 100%;
  padding: 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--292929, #292929);
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Іконка пошуку — справа всередині поля */
.wpc-filter-search-wrapper::before {
  content: '';
  order: 99;       /* через flex переносимо в кінець (праворуч) */
  flex: 0 0 auto;
  display: inline-block;
  width: 17px;
  height: 17px;
  margin-right: 0;
  margin-left: 8px;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 17 17' fill='none'%3E%3Cpath d='M16.0845 15.2001L12.1727 11.2891C13.3065 9.92798 13.8719 8.18211 13.7512 6.41472C13.6305 4.64733 12.8331 2.9945 11.5249 1.80006C10.2166 0.605618 8.49824 -0.038471 6.7272 0.00177892C4.95615 0.0420288 3.2688 0.763519 2.01616 2.01616C0.763519 3.2688 0.0420288 4.95615 0.00177892 6.7272C-0.038471 8.49824 0.605618 10.2166 1.80006 11.5249C2.9945 12.8331 4.64733 13.6305 6.41472 13.7512C8.18211 13.8719 9.92798 13.3065 11.2891 12.1727L15.2001 16.0845C15.2582 16.1425 15.3271 16.1886 15.403 16.22C15.4788 16.2514 15.5601 16.2676 15.6423 16.2676C15.7244 16.2676 15.8057 16.2514 15.8816 16.22C15.9575 16.1886 16.0264 16.1425 16.0845 16.0845C16.1425 16.0264 16.1886 15.9575 16.22 15.8816C16.2514 15.8057 16.2676 15.7244 16.2676 15.6423C16.2676 15.5601 16.2514 15.4788 16.22 15.403C16.1886 15.3271 16.1425 15.2582 16.0845 15.2001ZM1.26727 6.89227C1.26727 5.77975 1.59717 4.69221 2.21525 3.76719C2.83333 2.84216 3.71184 2.12119 4.73967 1.69545C5.76751 1.2697 6.89851 1.15831 7.98965 1.37535C9.0808 1.59239 10.0831 2.12812 10.8697 2.91479C11.6564 3.70146 12.1921 4.70374 12.4092 5.79489C12.6262 6.88603 12.5148 8.01703 12.0891 9.04486C11.6634 10.0727 10.9424 10.9512 10.0174 11.5693C9.09233 12.1874 8.00479 12.5173 6.89227 12.5173C5.40093 12.5156 3.97115 11.9225 2.91662 10.8679C1.86209 9.81339 1.26892 8.3836 1.26727 6.89227Z' fill='%23292929'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 17px 17px;
}

.wpc-filter-search-wrapper .wpc-filter-search-field {
  flex: 1 1 auto;
  width: 100%;
  height: 40px;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  border-radius: 0 !important;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.56px;
  text-transform: uppercase;
}

.wpc-filter-search-wrapper .wpc-filter-search-field::placeholder {
  color: #909090;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.56px;
  text-transform: uppercase;
  opacity: 1;
}

.wpc-filter-search-wrapper .wpc-search-clear {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  padding: 8px;
  background: url('img/search-icon.svg') center/17px 17px no-repeat;
  border: 0;
  cursor: pointer;
  font-size: 0;
  line-height: 0;
  color: transparent;
}

.wpc-filter-search-wrapper .wpc-search-clear-icon {
  display: none;
}

.wpc-filters-main-wrap li.wpc-term-item a {
  color: var(--292929, #292929);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.56px;
  text-transform: uppercase;
  text-decoration: none;
}

.wpc-filters-main-wrap li.wpc-term-item a:hover {
  color: #403c3c !important;
}


.wd-cat-hero img {
  width: 100%;
  height: auto;
  display: block;
}
@media (min-width: 992px) {
  .wd-cat-hero {
    padding-bottom: 30px;
    padding-left: 5px;
    padding-right: 5px;
  }
}
.footer-title {
  font-family: "Montserrat", Helvetica, Arial, sans-serif;
  font-size: 18px;
  line-height: 22px;
  font-weight: 500;
  text-transform: uppercase;
  text-align: left;
  color: black;
  margin-bottom: 20px;
}
.footer-contacts a:hover {
  color: black;
}
.footer-title2 {
  color: black;
  font-size: 14px;
  font-family: Montserrat;
  text-transform: uppercase;
  margin-top:10px;
}

@media screen and (max-width: 767px) {
.image-boxes.imgbox-simple.eluidfe7d8215.hidden-zn_dummy_value {
  display: none;
}  
.zn_custom_html.eluid0cf65baf.hidden-zn_dummy_value {
  margin-top: 20px;
  padding-bottom: 20px;
}
 .wd-cat-hero img {
  margin-left: 0px;
  margin-right: 0px;
}   
    
   .up-sells.upsells.products {
  display: none;
} 
.variations-head {
  border: 1px solid #ececec;
  padding: 5px;
}
.footer-title {
  font-size: 14px;
}    
}

.box-hint * {
  font-family: Montserrat;
  color: black;
  text-align: justify;
  font-size: 12px;
  text-transform:uppercase;
}
.box-hint p {
  margin-bottom: 5px;
}
/* Hero на сторінці категорії ID=99 */
.wd-cat-hero{margin:0 0 24px}
.wd-hero-img{width:100%;height:auto;display:block}
.wd-hero-img.wd-hero-img--desktop {
  margin-bottom: -60px;
}
/* За замовчуванням: показуємо десктопне, ховаємо мобільне і текст */
.wd-hero-img--mobile{display:none}
.wd-cat-hero-text{display:none;margin-top:12px;font-size:14px;line-height:1.5}
.wd-hero-img.wd-hero-img--mobile {
  display: none;
}


#eluid442fc7b2 {
  padding-left: 10px;
}
.znColumnElement-innerWrapper-eluid36595482.znColumnElement-innerWrapper.znColumnElement-innerWrapper--valign-top.znColumnElement-innerWrapper--halign-left {
  padding-right: 10px;
}

.variations-head {
  border-radius: 4px;
}
/* На мобільних — міняємо зображення і показуємо текст */
@media (max-width: 767.98px){
  .wd-hero-img.wd-hero-img--mobile {
  display: block;
}

#eluid442fc7b2 {
  padding-left: 0px;
}

#eluidcb604b86 .elm-cmlist.elm-cmlist--h1 > li {
  display: inline-block;
  margin: 0 0px;
  width:100%;
}
  .wd-cat-hero-text{    
    display:block; 
  }
  .wd-hero-img.wd-hero-img--desktop {
  display: none;
}
.wd-cat-hero {
  margin-left: -15px;
  margin-right: -15px;
}
.wd-cat-hero-text {
  padding-left: 15px;
  padding-right: 15px;
}
 .wd-cat-hero-text * {
    font-family: Montserrat;
    font-size: 12px;
    color: black;
    text-transform: uppercase;
    text-align: justify;

  }
  
  
  
  /* Переконайтеся, що стара ціна (елемент <del>) закреслена */
.variation-price del {
    /* Додає лінію по центру тексту */
    text-decoration: line-through; 
    /* Робить стару ціну менш помітною */
    opacity: 0.6; 
    /* Додає невеликий відступ справа від закресленої ціни */
    margin-right: 5px; 
    /* Встановлюємо, що колір шрифту повинен бути "звичайним" (якщо тема не перевизначила його) */
    color: inherit; 
    /* Запобігаємо, щоб <del> відображалася як блок, якщо це необхідно для вирівнювання */
    display: inline;
}

/* Стилізація нової ціни (елемент <ins>) */
.variation-price ins {
    /* Робить нову ціну більш помітною, наприклад, червоною або жирною */
    color: #ff0000; /* Приклад червоного кольору. Змініть на колір вашої теми. */
    font-weight: bold;
    /* Прибирає нижнє підкреслення, яке <ins> може мати за замовчуванням */
    text-decoration: none; 
    /* Запобігаємо, щоб <ins> відображалася як блок, якщо це необхідно для вирівнювання */
    display: inline;
}
.wc-atcp-popup.animate__animated.animate__jackInTheBox {
  width: 80%;
  border-radius: 0px;
}
.wc-atcp-product__name {
  margin-top: 20px;
  font-size: 18px;
}
.wc-atcp-product__price {
  font-size: 17px;
}

  .woocommerce .woocommerce-message .button.wc-forward {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }

.button.wc-forward {
  letter-spacing: 0px;
  font-weight: 300 !important;
}

.variations-head {
    border: 1px solid black !important;
    padding: 10px !important;
  }

.media-container.eluidf404040d.hidden-zn_dummy_value.media-container--type-pb.kl-overlay-none {
  padding: 0px !important;
}



}

.out-of-stock-label {
  text-transform: uppercase;
}
.product_meta {
  opacity: 0.5;
}
.tagged_as {
  display: none !important;
}
/* Стиль для відсутніх варіацій (прозорість + не можна клікнути) */
.variation-item.disabled-variation {
    opacity: 0.5;            /* Напівпрозорий */
    pointer-events: none;    /* Блокує клік */
    filter: grayscale(100%); /* (Опціонально) робить чорно-білим, якщо хочеш посилити ефект */
}

/* Текст статусу */
.variation-stock-status {
    font-size: 0.85em;
    margin: 0 10px;
    font-weight: 500;
}

/* Текст "Закінчився" - чорний */
.variation-stock-status.out-of-stock {
    color: #000000; /* Чорний колір */
    /* color: inherit; - або використовуй це, якщо хочеш щоб був такий як основний текст */
}

/* Стиль для хедера (прихований, бо "В наявності" ми більше не показуємо, 
   а "Закінчився" не можна вибрати, тому цей клас фактично не буде використовуватись, 
   але хай буде для безпеки) */
.variation-stock-status-head {
    margin-left: 10px;
    font-size: 0.9em;
    display: none;
}
.out-of-stock-label {
  text-align: center;
}
/* Стилі для цін всередині кнопки варіації */
.variation-item .variation-price {
    display: inline-flex;
    align-items: center;
    gap: 6px; /* Відступ між старою і новою ціною */
}

/* Стара ціна (закреслена) */
.variation-item .variation-price del {
    color: #999;       /* Сірий колір */
    font-size: 0.9em;  /* Трохи менший шрифт */
    opacity: 0.7;
    text-decoration: line-through;
    white-space: nowrap; /* Щоб ціна не переносилась */
}

/* Нова ціна (актуальна) */
.variation-item .variation-price ins {
    text-decoration: none; /* Прибираємо підкреслення, яке дає браузер */
    font-weight: bold;     /* Можна зробити жирним */
    color: inherit;        /* Спадкує основний колір тексту (чорний) або задай свій */
    white-space: nowrap;
}

/* Стиль для відсутніх варіацій (те що робили раніше) */
.variation-item.disabled-variation {
    opacity: 0.5;
    pointer-events: none;
    filter: grayscale(100%);
}

.variation-stock-status.out-of-stock {
    color: #000;
}

.headertop2__slider .slick-slide {
    width: 100% !important;   /* розтягнути слайд на всю ширину */
    white-space: nowrap;      /* щоб 3000&nbsp;грн не переносилося */
    text-align: center;       /* текст по центру */
}
.headertop2__slider .slick-track,
.headertop2__slider .slick-list {
    width: 100% !important;
}
.zn_text_box.eluid8a2388b9.hidden-zn_dummy_value.zn_text_box-light.element-scheme--light, .zn_text_box.eluid8a2388b9.zn_text_box-light.element-scheme--light, .zn_text_box.eluid8a2388b9.zn_text_box-light.element-scheme--light {
  font-weight: 300 !important;
  color:black;
}

.decant-info {
  font-family: Montserrat;
  color: black !important;
  margin-bottom: 15px;
}

.product-trust-block{
    margin-top: 10px;
    display: grid;
    gap: 5px;
}

.product-trust-block .trust-item{
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 5px;
    align-items: start;
}

.product-trust-block .trust-icon{
    width: 22px;
    height: 22px;
    color: #000; /* ЧОРНІ іконки */

}

.product-trust-block .trust-icon svg{
    width: 22px;
    height: 22px;
    display: block;
}

.product-trust-block .trust-text{
    font-size: 14px;
    line-height: 1.45;
    color: black
}

/* Dots wrapper */
.woocommerce-product-gallery .flex-control-nav.flex-control-paging{
  position: absolute;
  left: 0; right: 0;
  bottom: 12px;
  text-align: center;
  z-index: 5;
  margin: 0 !important;
  padding: 0 !important;
}

/* Each dot item */
.woocommerce-product-gallery .flex-control-nav.flex-control-paging li{
  display: inline-block;
  margin: 0 6px;
}

/* The dot itself (FlexSlider puts 1/2/3 text inside <a>) */
.woocommerce-product-gallery .flex-control-nav.flex-control-paging li a{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: block;

  /* BRAND */
  border: 1px solid #e4e2db;
  background: transparent;

  /* hide numbers */
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

/* Active dot */
.woocommerce-product-gallery .flex-control-nav.flex-control-paging li a.flex-active{
  background: #e4e2db;
}


.mainnav--pointer-dash.main-nav > ul > .menu-item.menu-item-has-children > a::after {
  content: "";
  opacity: 1;
  position: absolute;
  height: 1px;
  width: 7px;
  bottom: 3px;
  bottom: calc(50% - 12px);
  left: 30px;
  background-color: black;
  transition: opacity .2s ease-in-out;

}
.responsive-menu-pro-subarrow {
  color: black !important;
}
.wpc-filter-search-field {
  height: 35px;
  font-family: Montserrat !important;
}

.product-trust-block {
  display: none;
}


.decant-info {
  display: none;
}



/* === Guaven search – force basic styles only === 
.guaven_woos_suggestion 
.guaven_woos_suggestion_list,
.guaven_woos_suggestion 
.guaven_woos_suggestion_unlisted li {
  display: block !important;
  overflow: auto !important;
  min-height: 60px !important;
  margin-bottom: 3px !important;
}

.guaven_woos_suggestion 
.guaven_woos_img {
  width: 60px !important;
  position: absolute !important;
}

.guaven_woos_suggestion 
.guaven_woos_titlediv {
  padding-left: 5px !important;
  margin-left: 70px !important;
  font-size: 13px !important;
  font-family: Montserrat, sans-serif !important;
  color: #000 !important;
}

.guaven_woos_suggestion 
.guaven_woos_titlediv small {
  font-size: 12px !important;
  font-family: Montserrat, sans-serif !important;
  color: #000 !important;
}

/* hover — без білих приколів 
.guaven_woos_suggestion 
.guaven_woos_suggestion_list:hover 
.guaven_woos_titlediv,
.guaven_woos_suggestion 
.guaven_woos_suggestion_list:hover 
.guaven_woos_titlediv * {
  color: #000 !important;
}
.guaven_woos_suggestion{
  z-index: 50 !important;

}


@media (max-width: 767.98px){

.guaven_woos_suggestion {
  margin-top: 15px !important;
}
}
*/


/* Ensure image wrapper is positioning context */
.woocommerce ul.products li.product,
.single-product .woocommerce-product-gallery {
    position: relative;
}

/* Heart badge */
.ywf-heart-badge{
    position: absolute;
    bottom: 8px;
    left: 8px;
    z-index: 20;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none; /* so it doesn't block clicks */
}




.ywf-heart-badge img{
    width: 30px !important;
    height: auto;
    display: block;
}
@media (min-width: 767.98px){
 .ywf-heart-badge img{
    width: 50px !important;
    height: auto;
    display: block;
}  
.ywf-heart-badge{
    position: absolute;
    bottom: 12px;
    left: 12px;

}
    
}


.single_product_main_image.col-sm-6 .ywf-heart-badge {
  position: absolute;
  top: 30px;
  bottom: auto;
  left: 50px;
  bottom:auto;
  
}
.single_product_main_image.col-sm-6 .ywf-heart-badge img{
    width: 90px !important;
  
}

.ywf-cat-intro{
  width: 100%;
  margin: 20px 0 30px;
}
.ywf-cat-intro__inner {
  color: black;
  font-size: 12px;
}
.ywf-cat-intro__inner p {
  text-align: center;
  text-transform: uppercase;
}
.ywf-cat-intro.ywf-cat-intro--promo {
  margin-bottom: -50px;
}
@media (max-width: 767px){
  .ywf-cat-intro__inner{
    font-size: 12px;
  }
  .ywf-cat-intro.ywf-cat-intro--promo {
  margin-bottom: 0px;
}
}
@media (max-width: 767.98px){
.single_product_main_image.col-sm-6 .ywf-heart-badge {
  position: absolute;
  top: 20px;
  bottom: auto;
  left: 20px;
  bottom:auto;
  
}    
    
    
    
}
.ywf-heart-badge {
  display: none !important;
}


/* На touch-пристроях прибираємо "липкий hover" */
@media (hover: none) and (pointer: coarse) {
  .text-custom-parent-hov:hover,
  .text-custom-parent-hov:active,
  .text-custom-parent-hov:focus {
    transform: none !important;
    box-shadow: none !important;
  }

  /* Декоративні шари не мають ловити тап */
  .woocommerce ul.products li.product .zn_badge_container,
  .woocommerce ul.products li.product .kw-prodimage:before,
  .woocommerce ul.products li.product .kw-prodimage:after,
  .woocommerce ul.products li.product .product-list-item:before,
  .woocommerce ul.products li.product .product-list-item:after {
    pointer-events: none !important;
  }
  
  .kw-prodimage:before,
  .kw-prodimage:after,
  .product-list-item:before,
  .product-list-item:after,
  .zn_badge_container,
  .ywf-heart-badge,
  .ywf-heart-badge * {
    pointer-events: none !important;
  }
  
  .ywf-heart-badge,
.ywf-heart-badge * {
  pointer-events: none !important;
}
  
}


.header-fibosearch {
    max-width: max-content;
    width: 24px !important;
    height: auto;
}

.kl-cart-button {
    padding-left: 0px;
}

.header-fibosearch .dgwt-wcas-search-form {
    width: 100%;
}

.header-fibosearch input[type="search"] {
    height: 40px;
}
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp {
  background: transparent;
  border-radius: 10px;
  padding: 0px;
}
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit {
  background: 0 0;
  border-radius: 100%;
  border: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  position: absolute;
  min-height: 33px;
  min-width: 33px;
  height: 33px;
  width: 33px;
  left: 10px;
  top: 10px;
  pointer-events: none;
  transition: none;
}
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit {

  position: absolute;
  min-height: 20px;
  min-width: 20px;
  height: 20px;
  width: 20px;
}
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
  padding: 5px 24px 5px 46px;
  line-height: 24px;
  font-size: 14px;
  border: 2px solid transparent;
  border-radius: 30px;
  height: auto;
  font-family: Roboto,sans-serif;
  background-color: #eee;
  font-family: Montserrat !important;
}
.dgwt-wcas-search-wrapp {
  max-width: max-content;
}

@media (max-width: 767px){
.header-fibosearch{
    max-width: 44px;
    width: 44px;
    flex: 0 0 44px;
  }

  .header-fibosearch .dgwt-wcas-search-form,
  .header-fibosearch .dgwt-wcas-sf-wrapp{
    width: 44px;
    position: relative;
  }

  /* НЕ display:none — інакше не буде overlay */
  .header-fibosearch .dgwt-wcas-search-input{
    position: absolute;
    left: 0;
    top: 0;
    width: 44px;
    height: 44px;
    opacity: 0;
    z-index: 2; /* щоб клік по області давав фокус */
    cursor: pointer;
  }

  .header-fibosearch .dgwt-wcas-search-submit{
    position: relative;
    z-index: 3;
    background: transparent;
    padding: 0;
  } 
    
}


/* Desktop показуємо */
.fibosearch-desktop {
    display: block;
}

.fibosearch-mobile {
    display: none;
}
.woocommerce ul.products li.product .product-list-item .kw-prodimage-img,
.woocommerce ul.products li.product .product-list-item .kw-prodimage-img {
  width: 100%;
}
.woocommerce ul.products li.product .product-list-item:hover .kw-prodimage-img:not(:only-child) {
  opacity: 1;
}
/* Mobile */
@media (max-width: 992px) {

    .fibosearch-desktop {
        display: none;
    }

    .fibosearch-mobile {
  height: 24px;
  align-items: center;
  display: flex;
  padding-top: 3px;
}

    .header-fibosearch {
        flex: 0 0 auto;
    }
    
    

    
}


@media (hover: hover) and (pointer: fine) {

  .kw-prodimage-img {
    transition: transform 0.3s ease-in-out !important;
  }

  .product-list-item:hover .kw-prodimage-img {
    transform: scale(1.15);
  }
  .woocommerce.spp-carousel .spp-list.products .product-list-item.prod-layout-style2:hover {
  box-shadow: 0 10px 20px rgba(0,0,0,0);
}
.woocommerce-privacy-policy-link:hover {
  color: black;
}

#home_slider_pc .prev:hover polyline,
#home_slider_mobile .prev:hover polyline,
#home_slider_pc .next:hover polyline,
#home_slider_mobile .next:hover polyline {
    stroke-width: 35;
}
.trust-text a:hover {
  color: black;
  text-decoration: underline;
}
#eluid28fabcca a:hover {
  color: black;
  text-decoration: underline;
}
.woocommerce .product_meta span a:hover {
  font-weight: normal;
  color: black;
}
.woocommerce-mini-cart__buttons.buttons a:hover {
  background: black !important;
  color: white;
}

  
  
  
  
  
  
  

}
/* Дати лого найвищий пріоритет для кліку */
#logo-container,
#logo-container a,
#logo-container img {
  position: relative;
  z-index: 99999999;
}

/* На випадок, якщо щось накриває хедер (псевдоелементи/оверлеї) */
.site-header-wrapper::before,
.site-header-wrapper::after,
.site-header::before,
.site-header::after {
  pointer-events: none;
}
.topnav--cart-panel {
  display: none !important;
}
#logo-container a.site-logo-anch {
  touch-action: manipulation;
}


/* =============================================
   SHOP ARCHIVE — FULL-WIDTH LAYOUT + FILTER BAR
   ============================================= */

/* 1. Main content takes full width — remove Bootstrap push offset */
.woocommerce .left_sidebar.col-md-9,
.woocommerce-page .left_sidebar.col-md-9 {
  width: 100% !important;
  left: 0 !important;
  margin-left: 0 !important;
  float: none !important;
}

/* 2. Aside stays as overlay — zero layout width */
.woocommerce aside[role="complementary"],
.woocommerce-page aside[role="complementary"] {
  width: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  float: none !important;
}

/* 3. Filter trigger bar */
.wpc-filters-open-button-container.wpc-open-button-243 {
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
}

.wpc-filters-open-button-container.wpc-open-button-243 .wpc-filters-open-widget {
  display: flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: #141414;
}

.wpc-filters-open-button-container.wpc-open-button-243 .wpc-button-inner {
  display: flex;
  align-items: center;
  gap: 6px;
}

/* 4. Replace 3-line icon with filter SVG icon */
.wpc-filters-open-button-container.wpc-open-button-243 .wpc-icon-html-wrapper {
  width: 24px;
  height: 24px;
  display: inline-block;
  background: url('img/filter-icon.svg') center/contain no-repeat;
  flex-shrink: 0;
}

.wpc-filters-open-button-container.wpc-open-button-243 .wpc-icon-line-1,
.wpc-filters-open-button-container.wpc-open-button-243 .wpc-icon-line-2,
.wpc-filters-open-button-container.wpc-open-button-243 .wpc-icon-line-3 {
  display: none !important;
}

/* 5. Filter button text style */
.wpc-filters-open-button-container.wpc-open-button-243 .wpc-filters-button-text {
  color: #141414;
  font-family: Montserrat;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.14px;
  text-transform: uppercase;
}

/* 6. Filter bar row — flex row with separator and count */
.woocommerce-products-header ~ .wpc-filters-open-button-container,
.left_sidebar > .wpc-filters-open-button-container {
  width: max-content;
}

/* 7. Result count inline style */
.woocommerce .woocommerce-result-count {
  display: inline-block;
  color: #909090;
  font-family: Montserrat;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0.14px;
  text-transform: none;
}

/* 8. Page title — left align, big */
.woocommerce-products-header__title.page-title {
  color: var(--141414, #141414) !important;
  font-family: Montserrat !important;
  font-size: 24px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 110% !important;
  letter-spacing: -0.72px !important;
  text-transform: uppercase !important;
  text-align: left !important;
  margin-bottom: 8px !important;
}


/* =====================================================
   SHOP ARCHIVE — CATEGORY NAV + FILTER BAR + LAYOUT
   ===================================================== */

/* 9. Hide WPC filter button on desktop */
@media (min-width: 992px) {
  .wpc-filters-open-button-container.wpc-open-button-243 {
    display: none !important;
  }
}

/* 10. Category nav tabs */
.ywf-shop-cat-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.ywf-shop-cat-nav {
  gap: 20px;
}

/* Ховаємо toolbar (фільтри/категорії) на певних категоріях: 99, 22, 105 */
body.tax-product_cat.term-99 .ywf-shop-cat-nav,
body.tax-product_cat.term-22 .ywf-shop-cat-nav,
body.tax-product_cat.term-105 .ywf-shop-cat-nav,
body.tax-product_cat.term-99 .ywf-filter-bar,
body.tax-product_cat.term-22 .ywf-filter-bar,
body.tax-product_cat.term-105 .ywf-filter-bar {
  display: none !important;
}

.ywf-shop-cat-nav__item {
  display: inline-flex;
  align-items: center;
  padding: 12px 0;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #141414 !important;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.14px;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color 0.2s, color 0.2s;
}

.ywf-shop-cat-nav__item:hover,
.ywf-shop-cat-nav__item:focus,
.ywf-shop-cat-nav__item.is-active {
  background: transparent;
  color: #141414 !important;
  border-bottom-color: #141414;
  text-decoration: none;
}

/* 11. Custom desktop filter button */
.ywf-filter-btn {
  display: none; /* shown only on desktop via media query below */
}

@media (min-width: 992px) {
  .ywf-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #141414;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: -0.14px;
    text-transform: uppercase;
  }

  .ywf-filter-btn__icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    background: url('img/filter-icon.svg') center/contain no-repeat;
  }
}

/* 12. Filter bar row (icon + text + separator + count) */
.ywf-filter-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 0;
  margin-bottom: 16px;
  border-bottom: 0;
  width: 100%;
}

.ywf-filter-bar .woocommerce-result-count,
.ywf-filter-bar .ywf-result-count-wrap,
.ywf-filter-bar .ywf-result-count-wrap .wpc-posts-found {
  margin: 0 !important;
  padding: 0 !important;
  color: #909090;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0.14px;
}
.ywf-filter-bar .ywf-result-count-wrap .wpc-posts-found p,
.ywf-filter-bar .ywf-result-count-wrap .ywf-result-count-label,
.ywf-filter-bar .ywf-result-count-wrap .wpc-posts-found-number {
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  display: inline;
}
.ywf-filter-bar .ywf-result-count-wrap .ywf-result-count-label {
  margin-right: 4px;
}

.ywf-filter-bar__sep {
  width: 1px;
  height: 16px;
  background: #E4E4E4;
  flex-shrink: 0;
}

/* 13. Inline filter panel — aside slides in beside products (DESKTOP ONLY) */
@media (min-width: 992px) {
  .ywf-shop-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 24px;
  }

  .ywf-shop-row > .left_sidebar {
    flex: 1 1 0;
    min-width: 0;
    width: auto !important;
    left: 0 !important;
    margin-left: 0 !important;
    float: none !important;
  }

  .ywf-shop-row > aside[role="complementary"] {
    display: none;
    flex: 0 0 300px;
    width: 300px !important;
    padding: 24px 20px !important;
    overflow: visible !important;
    float: none !important;
    background: #fff;
    border: 1px solid #E4E4E4;
    border-radius: 8px;
    position: static !important;
  }

  .ywf-shop-row.ywf-filter-open > aside[role="complementary"] {
    display: block;
  }
}

/* 14. Force 3 product columns when filter is open */
@media (min-width: 992px) {
  .ywf-filter-open .kallyas-productlist-wrapper ul.products li.product,
  .ywf-filter-open .woocommerce ul.products li.product {
    width: 33.333% !important;
    float: left;
  }
}

/* 15. Filter panel inner typography */
.ywf-shop-row > aside[role="complementary"] .widgettitle,
.ywf-shop-row > aside[role="complementary"] .widget-title {
  color: var(--292929, #292929);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.56px;
  text-transform: uppercase;
  margin-bottom: 12px;
}

/* WPC Filter — кастомний хедер під дизайн YWF.
   Структура (з mu-plugin /mu-plugins/ywf-wpc-overrides.php):
     .wpc-filter-header > .widget-title.wpc-filter-title > button.ywf-wpc-filter-trigger
       > span.wpc-wrap-icons   (label)
       > span.wpc-open-icon    (містить обидва SVG: .wpc-icon-plus + .wpc-icon-minus) */

.wpc-filter-header {
  align-self: stretch;
}

.wpc-filter-collapsible .widget-title.wpc-filter-title {
  margin: 0;
  padding: 0;
}

.wpc-filter-collapsible .ywf-wpc-filter-trigger {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px;
  width: 100%;
  height: 48px;
  padding: 0 !important;
  margin: 0 !important;
  background: var(--background, #FFF) !important;
  background-color: var(--background, #FFF) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: pointer;
  text-align: left;
  /* Лейбл */
  color: rgba(0, 0, 0, 0.20);
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 19.6px; /* 140% */
  text-transform: uppercase;
}

.wpc-filter-collapsible .ywf-wpc-filter-trigger .wpc-wrap-icons {
  flex: 1 1 auto;
  min-width: 0;
  color: inherit;
  font: inherit;
}

/* Icon container 40×40 з padding 8px → svg по центру 20×20.
   ВАЖЛИВО: WPC дефолтно робить .wpc-open-icon квадратиком з border-left+border-top
   і rotate 45° для "стрілки". Все це треба прибити. */
.wpc-filter-collapsible .wpc-filter-title .wpc-open-icon,
.wpc-filter-collapsible.wpc-closed .wpc-filter-title .wpc-open-icon,
.wpc-filter-collapsible.wpc-opened .wpc-filter-title .wpc-open-icon,
.wpc-filter-has-selected .wpc-filter-title .wpc-open-icon,
.wpc-filter-has-selected.wpc-closed .wpc-filter-title .wpc-open-icon,
.wpc-filter-collapsible-reverse.wpc-filter-collapsible .wpc-filter-title .wpc-open-icon,
.wpc-filter-collapsible-reverse.wpc-filter-collapsible.wpc-closed .wpc-filter-title .wpc-open-icon,
.wpc-filter-collapsible .ywf-wpc-filter-trigger .wpc-open-icon {
  flex: 0 0 40px;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative;
  background: none !important;
  border: 0 !important;
  transform: none !important;
  transition: none !important;
  content: normal !important;
}
/* Псевдо-куточки і стрілки від WPC — повністю прибрати */
.wpc-filter-collapsible .wpc-open-icon::before,
.wpc-filter-collapsible .wpc-open-icon::after {
  content: none !important;
  display: none !important;
}

.wpc-filter-collapsible .ywf-wpc-filter-trigger .wpc-icon-plus,
.wpc-filter-collapsible .ywf-wpc-filter-trigger .wpc-icon-minus {
  display: block;
  width: 20px;
  height: 20px;
}

/* Логіка стану WPC collapsible:
   - .wpc-filter-collapsible (БЕЗ -reverse) → дефолт CLOSED, .wpc-opened = OPEN
   - .wpc-filter-collapsible-reverse        → дефолт OPEN,   .wpc-closed = CLOSED
   Іконку показуємо за фактичним станом контенту. */

/* Дефолт: за замовчуванням CLOSED → PLUS */
.wpc-filter-collapsible .ywf-wpc-filter-trigger .wpc-icon-plus  { display: block; }
.wpc-filter-collapsible .ywf-wpc-filter-trigger .wpc-icon-minus { display: none; }

/* Reverse-режим (відкритий за замовчуванням) → MINUS */
.wpc-filter-collapsible.wpc-filter-collapsible-reverse .ywf-wpc-filter-trigger .wpc-icon-plus  { display: none; }
.wpc-filter-collapsible.wpc-filter-collapsible-reverse .ywf-wpc-filter-trigger .wpc-icon-minus { display: block; }

/* Юзер ВІДКРИВ closed-by-default фільтр → MINUS */
.wpc-filter-collapsible.wpc-opened .ywf-wpc-filter-trigger .wpc-icon-plus  { display: none; }
.wpc-filter-collapsible.wpc-opened .ywf-wpc-filter-trigger .wpc-icon-minus { display: block; }

/* Юзер ЗАКРИВ opened-by-default фільтр → PLUS */
.wpc-filter-collapsible.wpc-closed .ywf-wpc-filter-trigger .wpc-icon-plus  { display: block; }
.wpc-filter-collapsible.wpc-closed .ywf-wpc-filter-trigger .wpc-icon-minus { display: none; }

/* Прибираємо WPC-дефолтний margin-bottom між секціями фільтра
   і ставимо border-bottom НА САМУ секцію — щоб лінія була ПІД контентом,
   а не між хедером і списком чекбоксів. */
.wpc-filters-section {
  margin-bottom: 0 !important;
  border-bottom: 1px solid var(--e-4-e-4-e-4, #E4E4E4);
}

/* Відступ знизу всередині вмісту секції (під списком чекбоксів) — на всіх фільтрах
   + 10px праворуч (і на ПК, і на мобайлі) */
.wpc-filters-section .wpc-filter-content {
  padding-bottom: 16px;
  padding-right: 10px;
}
/* У згорнутому стані WPC ховає .wpc-filter-content — padding не зʼявиться */
.wpc-filters-section.wpc-closed .wpc-filter-content {
  padding-bottom: 0;
}

/* Нижній відступ продуктового рядка (4 колонки) */
.kallyas-productlist-wrapper.kallyas-wc-cols--4 {
  padding-bottom: 40px;
}
@media (min-width: 992px) {
  .kallyas-productlist-wrapper.kallyas-wc-cols--4 {
    padding-bottom: 98px;
  }
}


/* =====================================================================
   WPC FILTER — CHECKBOXES
   18×18 чекбокс. Незаповнений = виключно бордер #292929.
   Заповнений = SVG-іконка з дизайну (чорний квадрат з білим чекмарком).
   ===================================================================== */
.wpc-term-item-content-wrapper input[type="checkbox"],
.ywf-shop-row .wpc-filters-main-wrap input[type="checkbox"],
.wpc-filters-widget-content input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  margin: 0 8px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid #292929 !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  position: relative !important;
  display: inline-block !important;
  vertical-align: middle !important;
  box-shadow: none !important;
  outline: none !important;
  transition: background-color .12s ease, border-color .12s ease;
  flex-shrink: 0;
}

.wpc-term-item-content-wrapper input[type="checkbox"]:hover,
.ywf-shop-row .wpc-filters-main-wrap input[type="checkbox"]:hover,
.wpc-filters-widget-content input[type="checkbox"]:hover {
  border-color: #292929 !important;
}

/* CHECKED: фон чорний + білий чекмарк всередині */
.wpc-term-item-content-wrapper input[type="checkbox"]:checked,
.ywf-shop-row .wpc-filters-main-wrap input[type="checkbox"]:checked,
.wpc-filters-widget-content input[type="checkbox"]:checked {
  background-color: #292929 !important;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M3 7.5L5.75 10L11 4.5' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 14px 14px !important;
  border-color: #292929 !important;
}

.wpc-term-item-content-wrapper input[type="checkbox"]:focus-visible,
.ywf-shop-row .wpc-filters-main-wrap input[type="checkbox"]:focus-visible,
.wpc-filters-widget-content input[type="checkbox"]:focus-visible {
  outline: 2px solid #292929 !important;
  outline-offset: 2px !important;
}

/* Білий внутрішній бордер на чекбоксі через ::after */
.wpc-filters-main-wrap input[type="checkbox"]::after {
  border: 2px solid white;
}

/* Текст-лейбл біля чекбокса (бренди / аромати тощо) */
.ywf-shop-row .wpc-filters-main-wrap .wpc-checkbox-item label,
.wpc-filters-widget-content .wpc-checkbox-item label {
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  color: #292929;
  text-transform: none;
  cursor: pointer;
}
.ywf-shop-row .wpc-filters-main-wrap .wpc-checkbox-item label a,
.wpc-filters-widget-content .wpc-checkbox-item label a {
  color: inherit;
  text-decoration: none;
}


/* =====================================================================
   WPC FILTER — CHIPS (обрані фільтри зверху списку)
   ===================================================================== */
.wpc-filter-chips-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

/* Контейнери чіпсів (з widget Selected Filters / inner widget) — без зайвих відступів,
   щоб лінія чіпсів була по лівому краю товарної сітки */
.wpc-filters-widget-top-container,
.wpc-widget-top-inside,
.wpc-inner-widget-chips-wrapper,
.widget_wpc_selected_filters_widget {
  margin: 0 !important;
  padding: 0 !important;
}
/* Дефолт — без зайвих margin (мобайл) */
.wpc-custom-selected-terms {
  margin: 0 !important;
  padding: 0 !important;
}
/* Тільки ПК — зміщуємо чіпси вліво на 10px і додаємо 12px зверху */
@media (min-width: 992px) {
  .wpc-custom-selected-terms {
    margin-top: 12px !important;
    margin-left: -10px !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
  }
}
.wpc-filters-widget-top-container ul.wpc-filter-chips-list,
.wpc-inner-widget-chips-wrapper ul.wpc-filter-chips-list,
.wpc-custom-selected-terms ul.wpc-filter-chips-list {
  margin: 0 0 16px !important;
  padding-left: 0 !important;
}

/* ПК — відступ зверху над лінією чіпсів (між тулбаром і чіпсами) */
@media (min-width: 992px) {
  ul.wpc-filter-chips-list {
    margin-top: 13px !important;
  }
}

.wpc-filter-chip {
  display: inline-flex;
  margin: 0;
  padding: 0;
}

.wpc-filter-chip > a,
.wpc-inner-widget-chips-wrapper .wpc-filter-chip > a,
.ywf-shop-row .wpc-filter-chip > a {
  display: inline-flex;
  align-items: center;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  color: inherit !important;
}
.wpc-filter-chip > a:focus,
.wpc-filter-chip > a:focus-visible,
.wpc-filter-chip > a:hover,
.wpc-filter-chip > a:active {
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

.wpc-filter-chip .wpc-chip-content {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 40px;
  padding: 8px 8px 8px 12px;
  background: var(--BG, #F5F3F0);
  border-radius: 0;
  cursor: pointer;
  transition: background-color .12s ease;
}

/* Мобайл: компактніші чіпси (краще поміщаються) + паддінги навколо */
@media (max-width: 991px) {
  .wpc_show_bottom_widget .wpc-widget-top-inside .wpc-inner-widget-chips-wrapper .wpc-filter-chips-list,
  .wpc-widget-top-inside .wpc-inner-widget-chips-wrapper .wpc-filter-chips-list {
    margin: 0 !important;
    padding: 10px 20px !important;
  }
  .wpc-filter-chip .wpc-chip-content {
    gap: 0;
    height: 32px;
    padding: 7px 8px 8px 12px;
  }
  .wpc-filter-chips-list li,
  body .wpc-filter-chips-list li.wpc-filter-chip,
  li.wpc-filter-chip {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    list-style: none !important;
    font-size: 91%;
  }

  /* Дрібне вирівнювання кнопки "Фільтри" по вертикалі */
  body .wpc-filters-open-button-container a.wpc-filters-open-widget,
  body .wpc-filters-open-button-container a.wpc-open-close-filters-button {
    margin-bottom: -6px;
  }

  /* Хедер мобільного попапу фільтрів: title зліва, X справа */
  .wpc-widget-close-container {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px !important;
    width: 100%;
    box-sizing: border-box;
  }
  .wpc-widget-close-container .wpc-widget-popup-title {
    order: 1;
    text-align: left;
    justify-content: left;
    padding-left: 20px;
    flex: 1 1 auto;
  }
  .wpc-widget-close-container a.wpc-widget-close-icon {
    order: 2;
    margin-left: auto;
    flex: 0 0 auto;
  }
}
.wpc-filter-chip:hover .wpc-chip-content {
  background: #ECE9E4;
}

.wpc-filter-chip .wpc-filter-chip-name {
  color: var(--292929, #292929) !important;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 19.6px; /* 140% */
  text-transform: uppercase;
  word-wrap: break-word;
}

/* Знак "×" замінюємо на 24×24 SVG (як у Figma) */
.wpc-filter-chip .wpc-chip-remove-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  font-size: 0;        /* ховаємо текстовий "×" */
  line-height: 0;
  color: transparent;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.281 18.2194C19.3507 18.2891 19.406 18.3718 19.4437 18.4629C19.4814 18.5539 19.5008 18.6515 19.5008 18.7501C19.5008 18.8486 19.4814 18.9462 19.4437 19.0372C19.406 19.1283 19.3507 19.211 19.281 19.2807C19.2114 19.3504 19.1286 19.4056 19.0376 19.4433C18.9465 19.4811 18.849 19.5005 18.7504 19.5005C18.6519 19.5005 18.5543 19.4811 18.4632 19.4433C18.3722 19.4056 18.2895 19.3504 18.2198 19.2807L12.0004 13.0604L5.78104 19.2807C5.64031 19.4214 5.44944 19.5005 5.25042 19.5005C5.05139 19.5005 4.86052 19.4214 4.71979 19.2807C4.57906 19.1399 4.5 18.9491 4.5 18.7501C4.5 18.551 4.57906 18.3602 4.71979 18.2194L10.9401 12.0001L4.71979 5.78068C4.57906 5.63995 4.5 5.44907 4.5 5.25005C4.5 5.05103 4.57906 4.86016 4.71979 4.71943C4.86052 4.5787 5.05139 4.49963 5.25042 4.49963C5.44944 4.49963 5.64031 4.5787 5.78104 4.71943L12.0004 10.9397L18.2198 4.71943C18.3605 4.5787 18.5514 4.49963 18.7504 4.49963C18.9494 4.49963 19.1403 4.5787 19.281 4.71943C19.4218 4.86016 19.5008 5.05103 19.5008 5.25005C19.5008 5.44907 19.4218 5.63995 19.281 5.78068L13.0607 12.0001L19.281 18.2194Z' fill='%23292929'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 24px 24px;
}

/* "Скинути всі" — лишаємо як інший варіант чіпа, але стилізуємо однаково */
.wpc-filter-chip.wpc-chip-reset-all .wpc-chip-content {
  background: transparent;
  border: 1px solid #E4E4E4;
}
.wpc-filter-chip.wpc-chip-reset-all:hover .wpc-chip-content {
  background: var(--BG, #F5F3F0);
}

/* Мобільні чіпси над тулбаром: ховаємо на ПК */
.ywf-mobile-chips {
  display: none;
}
@media (max-width: 991px) {
  .ywf-mobile-chips {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 !important;
    box-sizing: border-box;
  }
  /* Якщо жоден фільтр не активний (WPC додає клас wpc-empty-chips-container) —
     ховаємо весь блок цілком. */
  .ywf-mobile-chips:has(.wpc-filter-chips-list.wpc-empty-chips-container),
  .ywf-mobile-chips:not(:has(.wpc-filter-chip)) {
    display: none !important;
  }
  /* Внутрішня обгортка WPC від шорткода — на мобайлі один ряд з горизонтальним скролом */
  .ywf-mobile-chips .wpc-custom-selected-terms {
    display: block !important;
    margin-bottom: 30px !important;
  }
  .ywf-mobile-chips .wpc-custom-selected-terms,
  .ywf-mobile-chips .widget_wpc_selected_filters_widget,
  .ywf-mobile-chips ul.wpc-filter-chips-list {
    margin: 0 0 30px !important;
    padding: 0 !important;
  }
  .ywf-mobile-chips ul.wpc-filter-chips-list {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 8px;
    scrollbar-width: none; /* Firefox */
    list-style: none !important;
  }
  .ywf-mobile-chips ul.wpc-filter-chips-list::-webkit-scrollbar { display: none; }
  .ywf-mobile-chips .wpc-filter-chip {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    list-style: none !important;
    display: inline-flex;
    flex: 0 0 auto;
    white-space: nowrap;
  }
  .ywf-mobile-chips .wpc-filter-chip > a {
    display: inline-flex;
    align-items: center;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: inherit !important;
  }
  .ywf-mobile-chips .wpc-chip-content {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 7px 8px 8px 12px;
    background: var(--BG, #F5F3F0);
    white-space: nowrap;
  }
}


/* =====================================================
   SHOP ARCHIVE — LAYOUT v2: header above row, aside inline
   ===================================================== */

/* woocommerce-products-header moved above row — full width, no flex constraint */
.woocommerce-products-header {
  width: 100%;
}

/* ywf-filter-bar moved above row — full width */
.ywf-filter-bar {
  width: 100%;
  box-sizing: border-box;
}

/* Desktop: completely kill aside default display + any WPC fixed/absolute positioning */
@media (min-width: 992px) {
  body.woocommerce aside[role="complementary"],
  body.woocommerce-page aside[role="complementary"] {
    display: none !important;
    position: static !important;
    right: auto !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: 0 !important;
    padding: 0 !important;
  }

  /* Show aside inline to the LEFT when filter is open */
  body.woocommerce .ywf-shop-row.ywf-filter-open > aside[role="complementary"],
  body.woocommerce-page .ywf-shop-row.ywf-filter-open > aside[role="complementary"] {
    display: block !important;
    position: static !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    order: -1;
    flex: 0 0 324px;
    width: 324px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: visible !important;
    max-height: none !important;
    align-self: flex-start;
  }

  /* Force flex on the row so aside + products sit side by side */
  .ywf-shop-row {
    display: flex !important;
    align-items: flex-start;
    gap: 24px;
  }

  .ywf-shop-row > .left_sidebar {
    flex: 1 1 0 !important;
    min-width: 0;
    width: auto !important;
  }

  /* 3 columns when filter is open (aside takes 280px) */
  .ywf-filter-open .woocommerce ul.products li.product,
  .ywf-filter-open ul.products li.product,
  .ywf-filter-open .kallyas-productlist-wrapper ul.products li.product {
    width: 33.333% !important;
  }
}


/* =====================================================
   SHOP ARCHIVE — LAYOUT v3 (toolbar above .row, full width)
   ===================================================== */

/* 1. Toolbar (H1 + tabs + filter bar) lives ABOVE .row — full width */
.ywf-shop-toolbar-wrap {
  margin-top: 0;
  padding-top: 56px;
}

@media (max-width: 991px) {
  .ywf-shop-toolbar-wrap {
    margin-top: 0px;
    padding-top: 32px;
  }
}

.ywf-shop-toolbar {
  width: 100%;
  margin-bottom: 0;
}

.ywf-shop-toolbar .woocommerce-products-header__title.page-title {
  padding-bottom: 0 !important;
  margin-bottom: 12px !important;
}

.ywf-shop-toolbar .ywf-shop-cat-nav {
  margin-bottom: 40px;
}

.ywf-shop-toolbar .ywf-filter-bar {
  margin-bottom: 0;
}

/* 2. Strong fix for col-md-push-3 — element doesn't have .left_sidebar class,
      must target via .col-md-push-3 / .zn_shop_four_columns directly */
@media (min-width: 992px) {
  body.woocommerce .row > .col-md-push-3,
  body.woocommerce-page .row > .col-md-push-3,
  body.woocommerce .row > .zn_shop_four_columns,
  body.woocommerce-page .row > .zn_shop_four_columns,
  .ywf-shop-row > .col-md-push-3,
  .ywf-shop-row > .zn_shop_four_columns {
    left: 0 !important;
    width: 100% !important;
    margin-left: 0 !important;
    float: none !important;
    position: relative !important;
  }

  /* Aside col-md-pull-9 — remove pull offset too */
  body.woocommerce .row > aside[role="complementary"],
  body.woocommerce-page .row > aside[role="complementary"] {
    right: auto !important;
    left: auto !important;
  }
}

/* 3. Hide the (now empty) default WC products header that still renders */
.woocommerce-products-header:empty {
  display: none !important;
}


/* =====================================================
   SHOP ARCHIVE — sidebar tweaks
   ===================================================== */
.zn_sidebar {
  margin-top: 0 !important;
}

@media (min-width: 992px) {
  body.woocommerce .ywf-shop-row.ywf-filter-open > aside[role="complementary"],
  body.woocommerce-page .ywf-shop-row.ywf-filter-open > aside[role="complementary"] {
    overflow: visible !important;
    max-height: none !important;
  }
}


/* =====================================================
   SHOP ARCHIVE — anti-shift fixes
   ===================================================== */

/* 1. Reserve scrollbar gutter — prevents horizontal shift when scrollbar appears */
html {
  scrollbar-gutter: stable;
}

/* 2. Apply flex layout to shop .row from initial server render via :has(),
      so layout is correct before JS adds .ywf-shop-row class (no flicker) */
@media (min-width: 992px) {
  body.woocommerce .row:has(> aside[role="complementary"]),
  body.woocommerce-page .row:has(> aside[role="complementary"]) {
    display: flex !important;
    align-items: flex-start;
    gap: 0;
    margin-left: 0;
    margin-right: 0;
  }

  /* Force product column to fill flex container regardless of class set */
  body.woocommerce .row:has(> aside[role="complementary"]) > .col-md-push-3,
  body.woocommerce-page .row:has(> aside[role="complementary"]) > .col-md-push-3,
  body.woocommerce .row:has(> aside[role="complementary"]) > .zn_shop_four_columns,
  body.woocommerce-page .row:has(> aside[role="complementary"]) > .zn_shop_four_columns {
    flex: 1 1 0 !important;
    min-width: 0;
    box-sizing: border-box;
  }

  /* When filter open: aside reappears as 280px on the left */
  body.woocommerce .row:has(> aside[role="complementary"]).ywf-filter-open,
  body.woocommerce-page .row:has(> aside[role="complementary"]).ywf-filter-open {
    gap: 24px;
  }
}


.woocommerce-result-count {
  display: none !important;
}



/* =====================================================
   SHOP ARCHIVE — MOBILE STYLES (Figma)
   ===================================================== */

/* Desktop: show count in our toolbar filter bar */
@media (min-width: 992px) {
  .ywf-filter-bar .woocommerce-result-count {
    display: inline-block !important;
    margin: 0;
    color: #292929;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    white-space: nowrap;
  }
}

/* Mobile: count goes INSIDE products column (default WC location, before shop loop).
   Hide it from our toolbar filter bar on mobile. */
@media (max-width: 991px) {
  .ywf-filter-bar .woocommerce-result-count {
    display: none !important;
  }

  body.woocommerce .col-md-push-3 > .woocommerce-result-count,
  body.woocommerce .zn_shop_four_columns > .woocommerce-result-count,
  body.woocommerce-page .col-md-push-3 > .woocommerce-result-count,
  body.woocommerce-page .zn_shop_four_columns > .woocommerce-result-count,
  body.woocommerce .ywf-mobile-filter-row > .woocommerce-result-count,
  body.woocommerce-page .ywf-mobile-filter-row > .woocommerce-result-count {
    display: block !important;
    margin: 0 0 16px;
    color: #292929;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
  }
}

@media (max-width: 991px) {
  /* === Category nav: horizontal single row, scrollable === */
  .ywf-shop-cat-nav {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: 20px;
    overflow-x: auto;
    padding: 0;
    margin-bottom: 24px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .ywf-shop-cat-nav::-webkit-scrollbar {
    display: none;
  }

  .ywf-shop-cat-nav__item {
    flex-shrink: 0;
    padding: 12px 0;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: rgba(0, 0, 0, 0.20);
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 140%;
    text-transform: uppercase;
    white-space: nowrap;
    letter-spacing: 0;
  }

  .ywf-shop-cat-nav__item:hover,
  .ywf-shop-cat-nav__item:focus {
    background: transparent;
    color: rgba(0, 0, 0, 0.20);
    border-color: transparent;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: 0;
    text-transform: uppercase;
    text-decoration: none;
  }

  .ywf-shop-cat-nav__item.is-active {
    background: transparent;
    color: rgba(0, 0, 0, 0.20);
    border-bottom-color: #141414;
  }

  /* Hide our toolbar filter bar on mobile — WPC has its own button,
     count moves into the products column */
  .ywf-filter-bar {
    display: none !important;
  }
}


/* =====================================================
   QUICK VARIANT PICKER on shop archive cards
   Панель — оверлей ВНИЗУ картинки.
   JS обгортає image link + панель у .ywf-image-wrap (position: relative).
   "Закрити" — block по центру внизу картки.
   ===================================================== */

.ywf-image-wrap {
  position: relative;
}

/* За замовчуванням панель і "Закрити" приховані */
.ywf-quick-variant,
.ywf-quick-variant__close {
  display: none;
}

/* Коли картка відкрита — панель оверлеєм внизу картинки */
.product-list-item.ywf-quick-open .ywf-quick-variant {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;
  background: transparent;
  margin: 0;
}

/* Коли picker відкритий — та ж кнопка перетворюється на "Закрити":
   прозорий фон, прозорі рамки (зберігаємо геометрію → НЕ стрибає),
   текст підкреслений сірим */
.product-list-item.ywf-quick-open > a.add_to_cart_button.product_type_variable,
.product-list-item.ywf-quick-open > .button.product_type_variable.add_to_cart_button {
  background: transparent !important;
  background-color: transparent !important;
  color: #292929 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

.ywf-quick-variant__volumes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  padding: 1px;
  background: #f5f5f5;
  margin-bottom: 0;
}
/* count % 3 === 1 (4, 7, 10…) → top має 1 елемент (left), 2 порожні клітинки справа */
.ywf-quick-variant__volumes[data-count="4"]::before,
.ywf-quick-variant__volumes[data-count="7"]::before,
.ywf-quick-variant__volumes[data-count="10"]::before {
  content: '';
  grid-column-start: 2;
  grid-row-start: 1;
  background: #fff;
}
.ywf-quick-variant__volumes[data-count="4"]::after,
.ywf-quick-variant__volumes[data-count="7"]::after,
.ywf-quick-variant__volumes[data-count="10"]::after {
  content: '';
  grid-column-start: 3;
  grid-row-start: 1;
  background: #fff;
}
/* count % 3 === 2 (5, 8, 11…) → top має 2 елементи (left), 1 порожня клітинка справа */
.ywf-quick-variant__volumes[data-count="5"]::before,
.ywf-quick-variant__volumes[data-count="8"]::before,
.ywf-quick-variant__volumes[data-count="11"]::before {
  content: '';
  grid-column-start: 3;
  grid-row-start: 1;
  background: #fff;
}

.ywf-quick-variant__volume {
  height: 40px;
  padding: 8px 12px;
  background: #fff;
  border: 0;
  margin: 0;
  position: relative;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.56px;
  text-transform: uppercase;
  color: var(--292929, #292929);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ywf-quick-variant__volume:hover:not([disabled]) {
  background: #F5F3F0;
}

.ywf-quick-variant__volume.is-selected {
  background: var(--BG, #F5F3F0);
  box-shadow: 0 0 0 1px var(--292929, #292929);
  color: var(--292929, #292929);
  position: relative;
  z-index: 1;
}

/* Mobile (≤768px): 2 columns instead of 3 per Figma */
@media (max-width: 768px) {
  .ywf-quick-variant__volumes {
    grid-template-columns: repeat(2, 1fr);
  }
  /* Скидаємо desktop ::before/::after для mod===1 (4,7,10) — на mobile інша логіка */
  .ywf-quick-variant__volumes[data-count="4"]::after,
  .ywf-quick-variant__volumes[data-count="7"]::after,
  .ywf-quick-variant__volumes[data-count="10"]::after {
    content: none;
  }
  /* 2 колонки, непарна кількість → top має 1 елемент (left), 1 порожня клітинка справа */
  .ywf-quick-variant__volumes[data-count="3"]::before,
  .ywf-quick-variant__volumes[data-count="5"]::before,
  .ywf-quick-variant__volumes[data-count="7"]::before,
  .ywf-quick-variant__volumes[data-count="9"]::before,
  .ywf-quick-variant__volumes[data-count="11"]::before {
    content: '';
    grid-column-start: 2;
    grid-row-start: 1;
    background: #fff;
  }
  /* Парна кількість: ховаємо ::before, бо порожніх клітинок нема */
  .ywf-quick-variant__volumes[data-count="4"]::before,
  .ywf-quick-variant__volumes[data-count="8"]::before,
  .ywf-quick-variant__volumes[data-count="10"]::before {
    content: none;
  }
}

.ywf-quick-variant__volume.is-out,
.ywf-quick-variant__volume[disabled] {
  opacity: 1;
  cursor: not-allowed;
  text-decoration: line-through;
  background: #F5F5F5;
}

.ywf-quick-variant__add {
  width: 100%;
  height: 40px;
  padding: 8px 12px;
  background: #292929;
  color: #fff;
  border: 0;
  border-radius: 0;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0;
  text-transform: uppercase;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.ywf-quick-variant__add[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.ywf-quick-variant__add.is-loading {
  opacity: 0.7;
  cursor: wait;
}

.ywf-quick-variant__close {
  background: none;
  border: 0;
  padding: 8px;
  margin: 0 auto;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
}


/* =====================================================
   TOAST notifications — внизу екрану по центру
   ===================================================== */
.ywf-toast-stack {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99999;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 8px;
  pointer-events: none;
  width: max-content;
  max-width: calc(100% - 32px);
}

.ywf-toast {
  background: #141414;
  color: #fff;
  padding: 14px 24px;
  border-radius: 8px;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  text-align: center;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.24);
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.25s, transform 0.25s;
  max-width: 480px;
  pointer-events: auto;
}

.ywf-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.ywf-toast--error {
  background: #C03030;
}

@media (max-width: 768px) {
  .ywf-toast-stack {
    bottom: 16px;
    width: calc(100% - 24px);
    max-width: calc(100% - 24px);
  }
  .ywf-toast {
    max-width: none;
    width: 100%;
  }
}


/* #content margin-top: 0 — лише на архівах WC */
body.archive.woocommerce #content,
body.tax-product_cat #content,
body.tax-product_tag #content,
body.post-type-archive-product #content {
  margin-top: 0 !important;
}


/* =====================================================
   PRODUCT CARD details — typography per Figma
   Order: Title → Brand → Type → Price → Add-to-cart
   ===================================================== */

/* Container — center-aligned column with gaps */
.product-list-item .kw-details {
  text-align: center;
  padding: 16px 4px 0;
}

/* Title (LAMETTA) — Label 14: 14px Montserrat 500 uppercase, lh 140%, ls -0.56px */
.product-list-item .kw-details-title,
.product-list-item .kw-details .kw-details-title {
  text-align: center !important;
  color: var(--292929, #292929) !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 140% !important;
  letter-spacing: -0.56px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Additional block (Brand + Type) — column, 2px gap */
.product-list-item .additional-product-block {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 2px 0 0;
  padding: 0;
}

/* Brand & Type — center, 12px Montserrat 400 */
.product-list-item .product-brand,
.product-list-item .product-brand a,
.product-list-item .product-type {
  text-align: center !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 140% !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block;
}
.product-list-item .product-brand,
.product-list-item .product-brand a {
  color: #292929 !important;
}
/* Ховаємо порожнє перше посилання в .product-brand (часто WC рендерить пусте <a>) */
.product-list-item .product-brand a:first-child {
  display: none !important;
}
.product-list-item .product-type {
  color: var(--909090, #909090) !important;
}

/* Price (від 220 ₴) — center, color #292929, 14px Montserrat 500 */
.product-list-item .kw-details .price,
.product-list-item .kw-details .price .custom-min-price,
.product-list-item .kw-details .price .woocommerce-Price-amount,
.product-list-item .kw-details .price bdi,
.product-list-item .kw-details .price .woocommerce-Price-currencySymbol {
  text-align: center !important;
  color: var(--292929, #292929) !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 140% !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.product-list-item .kw-details .price {
  display: block;
  margin: 31px 0 5px !important;
}

/* "Обрати обʼєм" / "У кошик" button — text-only style:
   #292929, 14px Montserrat 500 underlined uppercase, centered */
.product-list-item > a.add_to_cart_button.product_type_variable,
.product-list-item > .button.product_type_variable.add_to_cart_button,
.product-list-item > a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart,
.product-list-item > .button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
  display: block;
  width: 100%;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 4px !important;
  margin: 0 !important;
  text-align: center !important;
  color: var(--292929, #292929) !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 140% !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}


.wpc-icon-html-wrapper {
  margin-right: 0px;
}


/* Mobile only: tighter gap inside WPC filter button */
@media (max-width: 991px) {
  .wpc-filters-open-button-container.wpc-open-button-243 .wpc-button-inner {
    display: flex;
    align-items: center;
    gap: 4px;
  }
}


/* WPC filter "Фільтри" button */
body .wpc-filters-open-button-container a.wpc-filters-open-widget,
body .wpc-filters-open-button-container a.wpc-open-close-filters-button {
  display: inline-block !important;
  text-align: left !important;
  border: 0px solid #2c2d33 !important;
  border-radius: 2px !important;
  line-height: 1.5 !important;
  padding: 7px 8px !important;
  padding-left: 8px !important;
  background-color: transparent !important;
  color: #2c2d33 !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  font-weight: 400 !important;
  transition: none !important;
  position: relative !important;
}

@media (max-width: 991px) {
  .wpc-icon-html-wrapper {
    position: relative;
    margin-right: 0px !important;
    top: 0px !important;
  }
}

body .wpc-filters-open-button-container a.wpc-filters-open-widget .wpc-filters-button-text {
  color: #141414 !important;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
}


.wpc-filters-open-widget {
  padding-left: 0px !important;
}


/* Mobile: filter button + separator + result count in single row */
@media (max-width: 991px) {
  .ywf-mobile-filter-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 -20px;
    width: 100%;
  }

  .ywf-mobile-filter-row .wpc-filters-open-button-container {
    margin: 0 !important;
    flex: 0 0 auto;
  }

  .ywf-mobile-filter-row .ywf-mobile-sep {
    color: #E4E4E4;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: 0.14px;
    flex: 0 0 auto;
  }

  .ywf-mobile-filter-row .woocommerce-result-count {
    margin: 0 !important;
    color: #909090 !important;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    flex: 0 0 auto;
  }
}


/* =====================================================
   FILTER BAR — desktop button vs mobile WPC clone
   Все рендериться server-side, без JS-переміщень
   ===================================================== */

/* WPC clone: за замовчуванням приховано */
.ywf-filter-bar__wpc {
  display: none;
}

@media (min-width: 992px) {
  /* На десктопі — лишається моя кнопка #ywf-filter-toggle, WPC clone прихований */
  .ywf-filter-bar__wpc {
    display: none !important;
  }
}

@media (max-width: 991px) {
  /* На мобайлі — показуємо .ywf-filter-bar (раніше display:none) */
  .ywf-filter-bar {
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin: 0 0 -20px;
    width: 100%;
    border-bottom: 0;
  }

  /* Сховати свою кастомну кнопку, показати WPC clone */
  .ywf-filter-bar .ywf-filter-btn {
    display: none !important;
  }
  /* Обгортка-сентинель — не повинна впливати на layout/візуал */
  .ywf-wpc-clone-wrap.wpc-filters-main-wrap {
    display: contents !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }
  /* WPC clone — примусово видимий на мобайлі (щоб не зник після AJAX-оновлення
     при застосуванні фільтрів). Сильні правила, бо WPC після AJAX-відповіді
     replaceWith(.wpc-button-inner) може втратити вміст. */
  .ywf-filter-bar .ywf-filter-bar__wpc,
  .ywf-filter-bar .wpc-filters-open-button-container,
  .ywf-filter-bar .wpc-filters-open-button-container.wpc-open-button-243 {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex: 0 0 auto;
    align-items: center;
    margin: 0 !important;
  }
  .ywf-filter-bar .wpc-filters-open-widget {
    display: inline-flex !important;
    visibility: visible !important;
  }
  .ywf-filter-bar .wpc-button-inner {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
  }
  .ywf-filter-bar .wpc-filters-button-text {
    display: inline-block !important;
    visibility: visible !important;
  }
  .ywf-filter-bar .wpc-icon-html-wrapper {
    display: inline-block !important;
  }

  /* Сепаратор */
  .ywf-filter-bar .ywf-filter-bar__sep {
    width: auto;
    height: auto;
    background: transparent;
    color: #E4E4E4;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: 0.14px;
    flex: 0 0 auto;
  }
  .ywf-filter-bar .ywf-filter-bar__sep::before {
    content: '|';
  }

  /* Лічильник */
  .ywf-filter-bar .woocommerce-result-count {
    display: inline-block !important;
    margin: 0 !important;
    color: #909090 !important;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    flex: 0 0 auto;
  }

  /* Прибрати ВСІ оригінальні WPC-кнопки (aside, bottom-widget тощо),
     лишаємо тільки клон у моєму toolbar (.ywf-filter-bar__wpc) */
  .wpc-filters-open-button-container.wpc-open-button-243:not(.ywf-filter-bar__wpc) {
    display: none !important;
  }

  /* На мобайлі padding-left = 0 (іконка прижата до лівого краю) */
  body .wpc-filters-open-button-container a.wpc-filters-open-widget,
  body .wpc-filters-open-button-container a.wpc-open-close-filters-button {
    padding-left: 0 !important;
  }

  /* Прибрати дефолтний WC-лічильник у колонці товарів — у нас є в toolbar */
  body.woocommerce .col-md-push-3 > .woocommerce-result-count,
  body.woocommerce .zn_shop_four_columns > .woocommerce-result-count,
  body.woocommerce-page .col-md-push-3 > .woocommerce-result-count,
  body.woocommerce-page .zn_shop_four_columns > .woocommerce-result-count {
    display: none !important;
  }
}


/* =====================================================
   FOOTER — custom layout (desktop + mobile)
   Background #F5F3F0, Montserrat typography, accordions on mobile
   ===================================================== */
.ywf-footer {
  background: #FFFFFF;
  font-family: Montserrat, sans-serif;
}

.ywf-footer a {
  text-decoration: none;
  color: inherit;
}

.ywf-footer ul {
  list-style: none;
  margin: 0;
  margin-bottom: 0px;
  padding-left: 15px;
  color: #292929;
}

.znpb-footer-smart-area {
  border-top: 1px solid #292929;
}

/* Show/hide desktop vs mobile */
.ywf-footer .ywf-footer__mobile { display: none !important; }
.ywf-footer .ywf-footer__desktop { display: block !important; }

@media (max-width: 991px) {
  .ywf-footer .ywf-footer__desktop { display: none !important; }
  .ywf-footer .ywf-footer__mobile { display: flex !important; }
}

/* ========== DESKTOP ========== */
.ywf-footer__desktop {
  padding: 32px 0px 24px;
  display: flex;
  flex-direction: column;
  gap: 96px;
}

.ywf-footer__top {
  display: flex;
  align-items: flex-start;
  gap: 245px;
  flex-wrap: wrap;
}

.ywf-footer__contacts {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex: 0 0 auto;
}

.ywf-footer__photo {
  width: 140px;
  height: 179px;
  object-fit: cover;
  flex-shrink: 0;
  display: block;
}

.ywf-footer__contact-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  min-width: 0;
}

.ywf-footer__contact-row {
  display: flex;
  flex-direction: column;
  gap: 0;
  text-transform: uppercase;
}

.ywf-footer__contact-info span {
  display: none;
}

.ywf-footer__label {
  color: #909090;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0.14px;
}

.ywf-footer__contact-value {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.ywf-footer__link {
  color: #292929;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0.14px;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.ywf-footer__link:hover {
  color: #292929;
}

.ywf-footer__copy {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  color: #909090;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
}

.ywf-footer__copy:hover {
  color: #292929;
}

.ywf-footer__menus {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex: 1 1 auto;
}

.ywf-footer__menu-col {
  display: flex;
  flex-direction: column;
  gap: 40px;
  min-width: 213px;
}

.ywf-footer__menu-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ywf-footer__menu-col li a,
.ywf-footer__menu-col--legal li a {
  color: #292929;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
}

.ywf-footer__menu-col li a:hover,
.ywf-footer__menu-col--legal li a:hover {
  color: #292929;
}

.ywf-footer__menu-col--legal {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 337px;
}

.ywf-footer__socials {
  margin-top: 72px;
  display: flex;
  gap: 8px;
  align-items: center;
}
.ywf-footer__socials .ywf-footer__social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}
.ywf-footer__socials .ywf-footer__social svg {
  width: 32px;
  height: 32px;
  display: block;
}

.ywf-footer__brand {
  width: 100%;
  margin-top: 32px;
}

.ywf-footer__brand img {
  width: 100%;
  height: auto;
  display: block;
}

/* ========== MOBILE — new simplified design ========== */
.ywf-footer__mobile {
  padding: 0px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  background: #FFFFFF;
}

/* Contacts: phone + email */
.ywf-footer__mobile-contacts {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.ywf-footer__mobile-phone,
.ywf-footer__mobile-email {
  display: block;
  text-align: center;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 19.6px;
  text-decoration: none;
}
.ywf-footer__mobile-phone {
  text-transform: uppercase;
}
.ywf-footer__mobile-email {
  letter-spacing: 0.14px;
}

/* Menu list: vertical, left-aligned, uppercase */
.ywf-footer__mobile-menu {
  align-self: stretch;
  list-style: none;
  margin: 0;
  padding-left: 0px !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ywf-footer__mobile-menu li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.ywf-footer__mobile-menu a {
  display: block;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 19.6px;
  text-transform: uppercase;
  text-decoration: none;
}

/* Socials block */
.ywf-footer__mobile-socials {
  display: flex;
  gap: 8px;
  align-items: center;
}
.ywf-footer__mobile-socials .ywf-footer__social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}
.ywf-footer__mobile-socials .ywf-footer__social svg {
  display: block;
}

/* Accordion */
.ywf-footer__accordion {
  display: flex;
  flex-direction: column;
}

.ywf-footer__acc-item,
.ywf-footer__simple-link {
  border-bottom: 1px solid #E4E4E4;
  display: block;
}

.ywf-footer__accordion > .ywf-footer__acc-item:first-child {
  border-top: 1px solid #E4E4E4;
}

.ywf-footer__acc-item summary,
.ywf-footer__simple-link {
  list-style: none;
  height: 48px;
  padding: 0 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #292929;
  font-size: 16px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
  cursor: pointer;
}

.ywf-footer__acc-item summary::-webkit-details-marker { display: none; }
.ywf-footer__acc-item summary::marker { display: none; }

.ywf-footer__acc-icon {
  width: 40px;
  height: 40px;
  position: relative;
  flex-shrink: 0;
}

.ywf-footer__acc-icon::before,
.ywf-footer__acc-icon::after {
  content: '';
  position: absolute;
  background: #292929;
  top: 50%;
  left: 50%;
  transition: transform 0.2s, opacity 0.2s;
}

.ywf-footer__acc-icon::before {
  width: 15px;
  height: 1.5px;
  transform: translate(-50%, -50%);
}

.ywf-footer__acc-icon::after {
  width: 1.5px;
  height: 15px;
  transform: translate(-50%, -50%);
}

/* When open: hide vertical line → "+" becomes "−" */
.ywf-footer__acc-item[open] .ywf-footer__acc-icon::after {
  opacity: 0;
}

.ywf-footer__acc-body {
  padding: 0px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ywf-footer__acc-body li a {
  color: #292929;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
}

.ywf-footer__simple-link {
  text-decoration: none;
}

.ywf-footer__mobile .ywf-footer__socials,
.ywf-footer__mobile-socials {
  margin-top: 0px;
}
.ywf-footer__mobile-brand {
  align-self: stretch;
  width: 100%;
  margin-top: 0px;
}

/* Mobile footer — фіксуємо чорний колір на hover/focus/active (без білого з теми) */
.ywf-footer__mobile a,
.ywf-footer__mobile a:hover,
.ywf-footer__mobile a:focus,
.ywf-footer__mobile a:active,
.ywf-footer__mobile a:visited,
.ywf-footer__mobile-phone,
.ywf-footer__mobile-phone:hover,
.ywf-footer__mobile-phone:focus,
.ywf-footer__mobile-email,
.ywf-footer__mobile-email:hover,
.ywf-footer__mobile-email:focus,
.ywf-footer__mobile-menu a,
.ywf-footer__mobile-menu a:hover,
.ywf-footer__mobile-menu a:focus,
.ywf-footer__mobile-menu a:active {
  color: #292929 !important;
  text-decoration: none !important;
}
.ywf-footer__mobile-socials .ywf-footer__social,
.ywf-footer__mobile-socials .ywf-footer__social:hover,
.ywf-footer__mobile-socials .ywf-footer__social:focus {
  color: #292929 !important;
}
.ywf-footer__mobile-socials .ywf-footer__social svg path {
  stroke: #292929 !important;
}

.ywf-footer__mobile-brand img {
  width: 100%;
  height: auto;
  display: block;
}


/* =====================================================
   SINGLE PRODUCT — labels на фото + summary типографіка
   Order: Brand (4) → Title (5) → Type (6) → Price (10+)
   ===================================================== */

/* Position labels container on the product gallery image (top-left) */
.woocommerce-product-gallery,
.product .images,
.product .summary ~ .images {
  position: relative;
}

.ywf-product-labels,
.zn_badge_container {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.ywf-product-labels .label-new,
.ywf-product-labels .label-rekomenduem,
.ywf-product-labels .label-top {
  display: inline-block;
  padding: 6px 12px;
  background: #fff;
  outline: 1px solid #E4E4E4;
  outline-offset: -1px;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0;
  text-transform: uppercase;
  float: none;
  margin: 0;
  pointer-events: auto;
}

/* === Single product summary typography === */
.single-product .summary .product-brand {
  margin: 0 0 8px;
}

.single-product .summary .product-brand a,
.single-product .summary .product-brand {
  color: var(--292929, #292929);
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.56px;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.single-product .summary .product_title.entry-title {
  color: var(--141414, #141414);
  font-family: Montserrat, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -1.28px;
  text-transform: uppercase;
  margin: 0 0 8px;
  padding: 0;
}

@media (max-width: 991px) {
  .single-product .summary .product_title.entry-title {
    font-size: 24px;
    line-height: 110%;
    letter-spacing: -0.72px;
  }
}

.single-product .summary .product-type {
  color: #909090;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0;
  text-transform: none;
  margin: 0 0 8px;
}

/* Price area */
.single-product .summary .price,
.single-product .summary .price .custom-min-price,
.single-product .summary .price .ywf-price-from,
.single-product .summary .price .woocommerce-Price-amount,
.single-product .summary .price bdi,
.single-product .summary .price .woocommerce-Price-currencySymbol {
  color: var(--292929, #292929);
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0;
  text-transform: uppercase;
}

/* "від" — маленькими */
.single-product .summary .price .ywf-price-from {
  text-transform: lowercase;
}

.single-product .summary .price {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}


/* (decant) wrap — схований за замовчуванням, показ тільки коли вибрано 2/3/5-ml */
.ywf-decant-wrap {
  display: none !important;
}
.ywf-decant-wrap.is-visible {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

/* (decant) label + info icon next to price */
.ywf-decant-label {
  color: #909090;
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 140%;
  text-transform: lowercase;
}

.ywf-decant-info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  cursor: help;
  vertical-align: middle;
}

.ywf-decant-info svg {
  display: block;
}


/* Single product layout — desktop spacing between image and summary */
@media (min-width: 992px) {
  .main-data.col-sm-6 {
    padding-left: 131px;
  }
}

/* Responsive padding-right for .main-data на пк */
@media (min-width: 1200px) and (max-width: 1253.98px) {
  .main-data.col-sm-6 {
    padding-right: 30px;
  }
}
@media (min-width: 1254px) and (max-width: 1367.98px) {
  .main-data.col-sm-6 {
    padding-right: 65px;
  }
}
@media (min-width: 1368px) {
  .main-data.col-sm-6 {
    padding-right: 122px;
  }
}


/* Decant info icon + hover tooltip */
.ywf-decant-info {
  position: relative;
  cursor: help;
}

.ywf-decant-tooltip {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  width: 320px;
  max-width: 90vw;
  padding: 12px 32px 12px 16px; /* 32px справа — місце під X */
  background: #fff;
  border: 1px solid #E4E4E4;
  border-radius: 4px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0;
  text-transform: none;
  text-align: left;
  white-space: normal;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s, visibility 0.15s;
  z-index: 100;
  pointer-events: none;
}

.ywf-decant-tooltip strong {
  color: #141414;
  font-weight: 600;
}

/* Кнопка закриття всередині тултіпу (правий-верхній кут) */
.ywf-decant-tooltip__close {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  pointer-events: auto;
  transition: background-color .15s ease;
}
.ywf-decant-tooltip__close:hover,
.ywf-decant-tooltip__close:focus {
  background: #F5F3F0;
}

/* Hover/focus-within на ПК — показ тултіпу */
@media (hover: hover) and (pointer: fine) {
  .ywf-decant-info:hover .ywf-decant-tooltip,
  .ywf-decant-info:focus .ywf-decant-tooltip,
  .ywf-decant-info:focus-within .ywf-decant-tooltip {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}

/* Клас .is-open — показ тултіпу через JS (мобайл, тапи) */
.ywf-decant-info.is-open .ywf-decant-tooltip,
.ywf-decant-tooltip.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

@media (max-width: 768px) {
  /* На мобайлі тултіп з'являється над іконкою, центрований по екрану,
     з відступами по 16px по краях */
  .ywf-decant-tooltip {
    position: fixed;
    top: auto;
    bottom: auto;
    left: 16px;
    right: 16px;
    width: auto;
    max-width: none;
    transform: none;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
    /* JS виставить top динамічно через --ywf-tooltip-top */
    top: var(--ywf-tooltip-top, auto);
  }
  .ywf-decant-tooltip__close {
    width: 32px;
    height: 32px;
    top: 4px;
    right: 4px;
  }
}


/* Hide standalone .decant-info block — info is now in .ywf-decant-tooltip on hover */
.single-product .summary .decant-info {
  display: none !important;
}

/* Spacing between price and short description */
.woocommerce-product-details__short-description {
  margin-top: 24px;
}

/* Ensure tooltip <span> displays as block when shown */
.ywf-decant-tooltip {
  display: block;
}

body.single-product.woocommerce div.product div.images .woocommerce-product-gallery__image:first-child,
body .woocommerce div.product div.images .woocommerce-product-gallery__image:first-child,
.woocommerce div.product div.images .woocommerce-product-gallery__image:first-child {
  margin-left: 0px !important;
  margin-right: 0px !important;
}


/* =====================================================
   AIO SEO Breadcrumbs — typography per Figma
   ===================================================== */
.ywf-breadcrumbs {
  width: 100%;
  background: #fff;
  overflow: hidden;
  padding: 0;
  margin-bottom: 11px;
}

.ywf-breadcrumbs .aioseo-breadcrumbs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: 0;
  text-transform: uppercase;
}

/* Regular breadcrumb items */
.ywf-breadcrumbs .aioseo-breadcrumb,
.ywf-breadcrumbs .aioseo-breadcrumb a {
  color: #292929 !important;
  text-decoration: none;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
  white-space: nowrap;
}

.ywf-breadcrumbs .aioseo-breadcrumb a:hover {
  color: #141414;
}

/* Last breadcrumb (current page) — no link inside */
.ywf-breadcrumbs .aioseo-breadcrumb:last-child,
.ywf-breadcrumbs .aioseo-breadcrumb:last-child a {
  color: var(--909090, #909090) !important;
}

/* Separator | */
.ywf-breadcrumbs .aioseo-breadcrumb-separator {
  color: #E4E4E4;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
  user-select: none;
}

/* Ховаємо пункт "Магазин" і його роздільник у breadcrumb */
.ywf-breadcrumbs .aioseo-breadcrumb:has(a[href$="/shop/"]),
.ywf-breadcrumbs .aioseo-breadcrumb:has(a[href$="/shop/"]) + .aioseo-breadcrumb-separator {
  display: none !important;
}

/* Mobile — single line with horizontal scroll, hide scrollbar */
@media (max-width: 991px) {
  .ywf-breadcrumbs {
    padding: 12px 8px 12px 16px;
  }

  .ywf-breadcrumbs .aioseo-breadcrumbs {
    flex-wrap: nowrap;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .ywf-breadcrumbs .aioseo-breadcrumbs::-webkit-scrollbar {
    display: none;
  }
}


.site-content {
  position: relative;
  margin-top: 24px;
}


/* =====================================================================
   YWF VOLUME PICKER (single product) — new design
   ===================================================================== */
.single-product .summary .ywf-volume-picker {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  margin: 0 0 16px;
  padding: 0;
}

.single-product .summary .ywf-volume-picker__label {
  align-self: stretch;
  color: var(--292929, #292929);
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%; /* 19.6px */
  letter-spacing: -0.56px;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
}

.single-product .summary .ywf-volume-picker__grid {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* --- Option (default) --- */
.single-product .summary .ywf-volume-option {
  position: relative;
  box-sizing: border-box;
  width: 96px;
  padding: 12px 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: transparent;
  border: 1px solid var(--e-4-e-4-e-4, #E4E4E4);
  outline: none;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.single-product .summary .ywf-volume-option__label {
  color: var(--292929, #292929);
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%; /* 19.6px */
  letter-spacing: -0.56px;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
}

/* Хова прибираємо прихований span з ціною та статусом — щоб не зʼїдали layout */
.single-product .summary .ywf-volume-option .variation-price,
.single-product .summary .ywf-volume-option .variation-stock-status {
  display: none !important;
}

/* --- Hover (тільки для in-stock) --- */
.single-product .summary .ywf-volume-option:not(.disabled-variation):not(.is-out-of-stock):hover {
  border-color: var(--292929, #292929);
}

.single-product .summary .ywf-volume-option:not(.disabled-variation):not(.is-out-of-stock):focus-visible {
  border-color: var(--292929, #292929);
}

/* --- Selected (натиснуто) --- */
.single-product .summary .ywf-volume-option.selected,
.single-product .summary .ywf-volume-option.active {
  border-color: var(--292929, #292929);
  background: var(--BG, #F5F3F0);
}
.single-product .summary .ywf-volume-option.selected .ywf-volume-option__label,
.single-product .summary .ywf-volume-option.active  .ywf-volume-option__label {
  color: var(--292929, #292929);
}

/* --- Не в наявності --- */
.single-product .summary .ywf-volume-option.disabled-variation,
.single-product .summary .ywf-volume-option.is-out-of-stock {
  border-color: var(--e-4-e-4-e-4, #E4E4E4);
  background: var(--f-5-f-5-f-5, #F5F5F5);
  cursor: not-allowed;
  pointer-events: none;
  /* Прибираємо легасі ефекти */
  opacity: 1 !important;
  filter: none !important;
}
.single-product .summary .ywf-volume-option.disabled-variation .ywf-volume-option__label,
.single-product .summary .ywf-volume-option.is-out-of-stock .ywf-volume-option__label {
  color: var(--909090, #909090);
}

/* Прибираємо стандартний WC select / table.variations — користуємось пікером */
.single-product .summary form.variations_form table.variations,
.single-product .summary form.variations_form .single_variation_wrap .woocommerce-variation {
  display: none !important;
}

/* На мобайлі ширина option-а трохи гнучкіша, але візуально такий самий грід */
@media (max-width: 480px) {
  .single-product .summary .ywf-volume-option {
    width: calc((100% - 16px) / 3); /* 3 у ряд з 8px gap */
    min-width: 96px;
  }
}


/* =====================================================================
   YWF PACK PREVIEW THUMBS (під .box-hint, перед quantity/add-to-cart)
   ===================================================================== */
.ywf-pack-thumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 16px;
  padding: 0;
}

.ywf-pack-thumb {
  position: relative;
  display: block;
  width: 120px;
  height: 120px;
  margin: 0;
  padding: 0;
  border: 0;
  background: #F5F3F0;
  overflow: hidden;
  cursor: default;
  -webkit-tap-highlight-color: transparent;
}

.ywf-pack-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Кнопки-превʼю (з відео або картинкою) */
button.ywf-pack-thumb {
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  transition: transform .2s ease;
}
button.ywf-pack-thumb:focus-visible {
  outline: 2px solid #141414;
  outline-offset: 2px;
}
button.ywf-pack-thumb--video:hover .ywf-pack-play__icon,
button.ywf-pack-thumb--video:focus-visible .ywf-pack-play__icon {
  transform: scale(1.08);
}
button.ywf-pack-thumb--image img {
  transition: transform .25s ease;
}
button.ywf-pack-thumb--image:hover img,
button.ywf-pack-thumb--image:focus-visible img {
  transform: scale(1.04);
}

.ywf-pack-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.ywf-pack-play__icon {
  display: block;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.18));
  transition: transform .2s ease;
}


/* =====================================================================
   YWF QUANTITY (custom dropdown) + ADD-TO-CART (single product)
   ===================================================================== */

/* Контейнер форми додавання в кошик (тільки .main-data на single product). */
.main-data form.cart .woocommerce-variation-add-to-cart,
.main-data form.cart {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  margin-top: 0 !important;
}
/* 16px між блоком кількості і кнопкою */
.main-data form.cart .ywf-qty {
  margin-bottom: 16px;
}

/* Ховаємо стандартний WC quantity (з +/- buttons) — рендеримо власний UI */
.main-data form.cart .quantity {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Кастомний quantity — повна ширина, контент по лівому краю */
.main-data .ywf-qty {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
}
.ywf-qty__label {
  color: var(--292929, #292929);
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%; /* 19.6px */
  letter-spacing: 0;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
}
/* Поле з тригером + дропдауном — окремий positioning context */
.ywf-qty__field {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.ywf-qty__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  width: 56px;
  height: 22px;
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
}
.ywf-qty__trigger:focus-visible {
  outline: 2px solid #292929;
  outline-offset: 2px;
}
.ywf-qty__value {
  min-width: 12px;
  text-align: center;
  color: var(--292929, #292929);
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 140%; /* 22.4px */
  letter-spacing: 0;
  text-transform: uppercase;
}
.ywf-qty__chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.ywf-qty__chevron svg {
  display: block;
  transition: transform .15s ease;
}
.ywf-qty.is-open .ywf-qty__chevron svg {
  transform: rotate(180deg);
}

/* Випадаюче меню кількості — позиціонується відносно .ywf-qty__field */
.ywf-qty__menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  margin: 0;
  padding: 4px 0;
  list-style: none;
  background: #fff;
  border: 1px solid #E4E4E4;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  z-index: 20;
  min-width: 64px;
  max-height: 220px;
  overflow-y: auto;
}
.ywf-qty__menu[hidden] { display: none; }

.ywf-qty__option {
  padding: 8px 16px;
  cursor: pointer;
  text-align: center;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 140%;
  text-transform: uppercase;
  user-select: none;
}
.ywf-qty__option:hover,
.ywf-qty__option.is-active {
  background: #F5F3F0;
}

/* ---- Add to cart button (тільки в .main-data, single product) ----
   Перебиваємо Kallyas (.zn-wc-pages-classic #page_wrapper button.button.alt … #cccccc)
   через #page_wrapper + body.single-product + !important. */
body.single-product #page_wrapper .main-data form.cart button.single_add_to_cart_button,
body.single-product #page_wrapper .main-data form.cart input.single_add_to_cart_button,
body.single-product #page_wrapper .main-data form.cart .single_add_to_cart_button.button,
body.single-product #page_wrapper .main-data form.cart .single_add_to_cart_button.button.alt,
body.single-product .main-data form.cart button.single_add_to_cart_button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 16px 72px !important;
  background: #292929 !important;
  background-color: #292929 !important;
  background-image: none !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 140% !important; /* 19.6px */
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background-color .15s ease, opacity .15s ease !important;
}

body.single-product #page_wrapper .main-data form.cart button.single_add_to_cart_button:hover,
body.single-product #page_wrapper .main-data form.cart .single_add_to_cart_button.button.alt:hover,
body.single-product #page_wrapper .main-data form.cart button.single_add_to_cart_button:focus,
body.single-product #page_wrapper .main-data form.cart .single_add_to_cart_button.button.alt:focus {
  background: #141414 !important;
  background-color: #141414 !important;
  color: #fff !important;
}

/* Disabled / неактивна */
body.single-product #page_wrapper .main-data form.cart button.single_add_to_cart_button.disabled,
body.single-product #page_wrapper .main-data form.cart button.single_add_to_cart_button:disabled,
body.single-product #page_wrapper .main-data form.cart .single_add_to_cart_button.button.alt.disabled,
body.single-product #page_wrapper .main-data form.cart .single_add_to_cart_button.button.alt:disabled,
body.single-product #page_wrapper .main-data form.cart .woocommerce-variation-add-to-cart-disabled .single_add_to_cart_button {
  background: rgba(68, 68, 68, 1) !important;
  background-color: rgba(68, 68, 68, 1) !important;
  background-image: none !important;
  color: #fff !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
/* Hover для disabled — фон не змінюється */
body.single-product #page_wrapper .main-data form.cart button.single_add_to_cart_button.disabled:hover,
body.single-product #page_wrapper .main-data form.cart button.single_add_to_cart_button:disabled:hover,
body.single-product #page_wrapper .main-data form.cart .single_add_to_cart_button.button.alt.disabled:hover {
  background: rgba(68, 68, 68, 1) !important;
  background-color: rgba(68, 68, 68, 1) !important;
}


/* =====================================================================
   YWF VIDEO MODAL (YouTube)
   ===================================================================== */
.ywf-video-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  box-sizing: border-box;
}
.ywf-video-modal.is-open {
  display: flex;
}
.ywf-video-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(20, 20, 20, 0.78);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  cursor: pointer;
}
.ywf-video-modal__dialog {
  position: relative;
  width: 100%;
  max-width: 960px;
  background: #000;
  border-radius: 4px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
  animation: ywfVideoIn .2s ease-out both;
}
@keyframes ywfVideoIn {
  from { opacity: 0; transform: translateY(8px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.ywf-video-modal__close {
  position: absolute;
  top: -44px;
  right: 0;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  transition: transform .15s ease;
}
.ywf-video-modal__close:hover {
  transform: scale(1.05);
}
.ywf-video-modal__close svg {
  display: block;
}
.ywf-video-modal__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
  overflow: hidden;
  border-radius: 4px;
}
.ywf-video-modal__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Image mode (lightbox) — діалог підлаштовується під розмір картинки */
.ywf-video-modal.is-image-mode .ywf-video-modal__dialog {
  background: transparent;
  box-shadow: none;
  width: auto;
  max-width: min(90vw, 1200px);
  display: inline-block; /* shrink-to-content */
  position: relative;
}
.ywf-video-modal.is-image-mode .ywf-video-modal__frame {
  aspect-ratio: auto;
  background: transparent;
  border-radius: 0;
  display: block;
  width: auto;
  height: auto;
  cursor: zoom-out; /* по фону модалки клік закриває */
  position: static;
}
.ywf-video-modal.is-image-mode .ywf-video-modal__frame img {
  display: block;
  max-width: min(90vw, 1200px);
  max-height: 80vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
  cursor: default;
}

/* Кнопка закриття — у куті КАРТИНКИ (бо dialog тепер по розміру img) */
.ywf-video-modal.is-image-mode .ywf-video-modal__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 2;
}
.ywf-video-modal.is-image-mode .ywf-video-modal__close:hover {
  background: #fff;
  transform: scale(1.05);
}
@media (max-width: 600px) {
  .ywf-video-modal.is-image-mode .ywf-video-modal__close {
    top: 6px;
    right: 6px;
    width: 32px;
    height: 32px;
  }
}

/* Закриваємо скрол body коли модалка відкрита */
body.ywf-video-modal-open {
  overflow: hidden;
}

@media (max-width: 600px) {
  .ywf-video-modal {
    padding: 16px;
  }
  .ywf-video-modal__close {
    top: -40px;
    width: 32px;
    height: 32px;
  }
}

/* Desktop header height */
@media (min-width: 992px) {
  .header__wrapper {
    height: 80px;
  }
}

/* Mobile: header / breadcrumbs / product labels / gallery */
@media (max-width: 991px) {
  .header__wrapper {
    height: 80px;
  }
  .ywf-breadcrumbs {
    padding: 12px 0;
    margin-bottom: 0;
  }
  .aioseo-breadcrumbs {
    padding-bottom: 0;
  }
  /* На мобайлі прибираємо margin-top на single product */
  body.single-product .site-content,
  .single.single-product .site-content {
    position: relative;
    margin-top: 0 !important;
  }
  .ywf-product-labels,
  .zn_badge_container {
    position: absolute;
    top: 16px;
    left: 0;
  }
  .woocommerce div.product div.images .woocommerce-product-gallery__image {
    margin-bottom: 0;
  }
  .main-data.col-sm-6 {
    padding: 24px 16px;
  }
}


/* =====================================================================
   YWF SECTION HEAD (upsells / related products)
   ===================================================================== */
.ywf-section-head {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  margin: 0 0 40px !important;
}

@media (min-width: 992px) {
  .ywf-section-head {
    margin-left: 5px !important;
  }
}

.ywf-section-head__titles {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
}

/* Заголовок — h2 (тому селектор підсилений, щоб перебити Kallyas:
   .woocommerce div.product .woocommerce-tabs h2, .upsells.products h2, .related.products h2). */
h2.ywf-section-head__title,
.ywf-section-head .ywf-section-head__title,
.up-sells .ywf-section-head__title,
.up-sells.upsells.products h2.ywf-section-head__title,
.upsells.products h2.ywf-section-head__title,
.related.products .ywf-section-head__title,
.related.products h2.ywf-section-head__title,
.woocommerce div.product .woocommerce-tabs h2.ywf-section-head__title,
.woocommerce div.product .ywf-section-head__title,
body .related.products h2.ywf-section-head__title,
body .up-sells.upsells.products h2.ywf-section-head__title {
  margin: 0 !important;
  padding: 0 !important;
  color: #141414 !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 24px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-align: left !important;
  word-wrap: break-word;
}

.ywf-section-head .ywf-section-head__count,
.up-sells .ywf-section-head__count,
.related.products .ywf-section-head__count {
  color: #909090 !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 19.6px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  word-wrap: break-word;
}

.ywf-section-head__nav {
  display: inline-flex;
  align-items: center;
  gap: 0;
  flex: 0 0 auto;
}

.ywf-section-head__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 8px;
  margin: 0;
  background: transparent;
  border: 0;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  transition: opacity .15s ease;
}
.ywf-section-head__btn:hover { opacity: 0.7; }
.ywf-section-head__btn:focus-visible {
  outline: 2px solid #141414;
  outline-offset: 2px;
}
.ywf-section-head__btn svg { display: block; }
/* Swiper-disabled state */
.ywf-section-head__btn.swiper-button-disabled,
.ywf-section-head__btn[disabled] {
  opacity: 0.3;
  cursor: not-allowed;
}

/* Ховаємо стандартні Swiper-стрілки (сині дефолтні), бо ми використовуємо
   свої в .ywf-section-head__nav через navigation: { prevEl, nextEl }. */
.up-sells .swiper-button-prev,
.up-sells .swiper-button-next,
.related.products .swiper-button-prev,
.related.products .swiper-button-next {
  display: none !important;
}

/* Слайд не має нав'язувати свою висоту/ширину — це справа Swiper */
.up-sells .swiper-slide,
.related.products .swiper-slide {
  height: auto;
  box-sizing: border-box;
}

/* Тільки для блоку Related — товари 100% ширини всередині слайда */
.related.products ul.products[class*="columns-"] li.product,
.woocommerce-page .related.products ul.products[class*="columns-"] li.product {
  width: 100%;
  float: left;
  clear: both;
  margin: 0 0 10px;
}

/* Сам ul.products у слайдері — без flex/grid обмежень */
.up-sells .swiper-wrapper ul.products,
.up-sells .swiper-wrapper.products,
.related.products .swiper-wrapper ul.products,
.related.products .swiper-wrapper.products {
  display: flex !important;
  flex-wrap: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* 96px між блоком апселов і релейтед, та 96px під related (ПК) */
.related.products,
section.related.products {
  margin-top: 96px;
  margin-bottom: 96px;
}

/* Мобайл: section head + spacing */
@media (max-width: 767px) {
  .related.products,
  section.related.products {
    margin-top: 64px;
  }
  .ywf-section-head {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 0 5px 24px 0 !important;
    margin-left: 0 !important;
  }
  /* Title 20px на мобайлі — мусимо повторити селектори і !important,
     бо десктопний блок встановив 24px з !important */
  h2.ywf-section-head__title,
  .ywf-section-head .ywf-section-head__title,
  .up-sells .ywf-section-head__title,
  .up-sells.upsells.products h2.ywf-section-head__title,
  .upsells.products h2.ywf-section-head__title,
  .related.products .ywf-section-head__title,
  .related.products h2.ywf-section-head__title,
  .woocommerce div.product .woocommerce-tabs h2.ywf-section-head__title,
  .woocommerce div.product .ywf-section-head__title,
  body .related.products h2.ywf-section-head__title,
  body .up-sells.upsells.products h2.ywf-section-head__title {
    font-size: 20px !important;
    line-height: 22px !important;
  }
  /* Кнопки навігації — без верхнього і правого паддінгу */
  .ywf-section-head__nav > button {
    padding-top: 0 !important;
    padding-right: 0 !important;
  }
}

/* Банер ПІД related products + Showroom-блок — тільки на мобайлі */
.ywf-after-related-banner,
.ywf-showroom {
  display: none;
}
.ywf-after-related-banner img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
}

@media (max-width: 767px) {
  .ywf-after-related-banner {
    display: block;
    margin-top: 48px;
    /* Виходимо за padding 16px батьківського контейнера, щоб картинка
       займала весь екран по ширині */
    margin-left: -16px;
    margin-right: -16px;
    width: calc(100% + 32px);
    max-width: calc(100% + 32px);
  }
  .ywf-after-related-banner img {
    width: 100%;
    max-width: 100%;
  }

  /* Showroom block (адреса + рейтинг + Google відгуки) */
  .ywf-showroom {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 40px;
    width: 100%;
    background: #fff;
    padding: 24px 16px 72px;
    box-sizing: border-box;
  }

  /* --- Адреса --- */
  .ywf-showroom__address {
    align-self: stretch;
    margin: 0;
    padding: 0;
    text-align: center;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 19.6px;
    word-wrap: break-word;
  }
  .ywf-showroom__address-label {
    color: #909090;
  }
  .ywf-showroom__address-value {
    color: #292929;
  }

  /* --- Рейтинг (цифра + зірки + посилання) --- */
  .ywf-showroom__rating {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
  }

  .ywf-showroom__rating-value {
    color: #292929;
    font-family: Montserrat, sans-serif;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    text-transform: uppercase;
    word-wrap: break-word;
    margin: 0;
  }

  /* Цифра + зірки притиснуті (8px між ними) — через окремий під-блок */
  .ywf-showroom__rating > .ywf-showroom__rating-value + .ywf-showroom__stars {
    margin-top: -8px; /* parent gap 16px - 8px = ефективні 8px */
  }

  .ywf-showroom__stars {
    display: inline-flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px;
  }
  .ywf-showroom__stars svg {
    display: block;
  }

  /* --- Google відгуки лінк --- */
  .ywf-showroom__reviews-link {
    display: inline-block;
    color: #292929;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 19.6px;
    text-decoration: underline;
    text-align: center;
    word-wrap: break-word;
  }
  .ywf-showroom__reviews-link:hover,
  .ywf-showroom__reviews-link:focus {
    color: #141414;
    text-decoration: underline;
  }
}


/* =====================================================
   ADDED-TO-CART MODAL (popup після AJAX add-to-cart)
   ===================================================== */
.ywf-cart-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0s linear 0.2s;
  font-family: Montserrat, sans-serif;
}
.ywf-cart-modal[hidden] {
  display: none;
}
.ywf-cart-modal.is-open {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.2s ease, visibility 0s linear 0s;
}

.ywf-cart-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(20, 20, 20, 0.55);
  cursor: pointer;
}

.ywf-cart-modal__dialog {
  position: relative;
  z-index: 1;
  background: #fff;
  width: 100%;
  max-width: 460px;
  margin: 16px;
  padding: 28px 28px 24px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.18);
  transform: translateY(12px) scale(0.98);
  transition: transform 0.25s cubic-bezier(.2,.7,.2,1);
}
.ywf-cart-modal.is-open .ywf-cart-modal__dialog {
  transform: translateY(0) scale(1);
}

.ywf-cart-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  background: transparent;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background 0.15s ease;
}
.ywf-cart-modal__close:hover {
  background: #f4f4f4;
}

.ywf-cart-modal__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  padding-right: 28px;
}
.ywf-cart-modal__check {
  display: inline-flex;
  flex: 0 0 auto;
}
.ywf-cart-modal__title {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.3;
  color: #141414;
  font-family: Montserrat, sans-serif;
  text-transform: uppercase;
}

.ywf-cart-modal__product {
  display: flex;
  gap: 14px;
  padding: 14px;
  background: #f7f7f7;
  margin-bottom: 16px;
}
.ywf-cart-modal__thumb {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  overflow: hidden;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ywf-cart-modal__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.ywf-cart-modal__info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}
.ywf-cart-modal__name {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: #141414;
  word-wrap: break-word;
}
.ywf-cart-modal__variation {
  font-size: 13px;
  color: #6a6a6a;
  line-height: 1.35;
}
.ywf-cart-modal__qty-price {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin-top: 4px;
  font-size: 13px;
  color: #141414;
}
.ywf-cart-modal__qty {
  color: #6a6a6a;
}
.ywf-cart-modal__price {
  font-weight: 600;
  font-size: 14px;
  color: #141414;
}
.ywf-cart-modal__price .woocommerce-Price-amount {
  font-weight: 600;
  color: #141414;
}

.ywf-cart-modal__totals {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 4px 18px;
  border-top: 1px solid #ececec;
  margin-top: 4px;
  font-size: 13px;
  color: #6a6a6a;
}
.ywf-cart-modal__totals-value {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  color: #141414;
}
.ywf-cart-modal__count {
  font-weight: 500;
}
.ywf-cart-modal__sep {
  color: #c6c6c6;
}
.ywf-cart-modal__total {
  font-weight: 700;
  font-size: 14px;
}
.ywf-cart-modal__total .woocommerce-Price-amount {
  font-weight: 700;
}

.ywf-cart-modal__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ywf-cart-modal__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 14px;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  border: 1px solid #292929;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  text-decoration: none;
}
.ywf-cart-modal__btn--ghost {
  background: #fff;
  color: #292929;
}
.ywf-cart-modal__btn--ghost:hover,
.ywf-cart-modal__btn--ghost:focus {
  background: #f4f4f4;
  color: #292929;
}
.ywf-cart-modal__btn--primary {
  background: #292929;
  color: #fff;
}
.ywf-cart-modal__btn--primary:hover,
.ywf-cart-modal__btn--primary:focus {
  background: #141414;
  border-color: #141414;
  color: #fff;
}

body.ywf-cart-modal-open {
  overflow: hidden;
}

@media (max-width: 560px) {
  .ywf-cart-modal {
    align-items: flex-end;
  }
  .ywf-cart-modal__dialog {
    margin: 0;
    max-width: 100%;
    padding: 22px 18px 18px;
    transform: translateY(24px);
  }
  .ywf-cart-modal.is-open .ywf-cart-modal__dialog {
    transform: translateY(0);
  }
  .ywf-cart-modal__title {
    font-size: 16px;
  }
  .ywf-cart-modal__actions {
    grid-template-columns: 1fr;
  }
  .ywf-cart-modal__btn--ghost {
    order: 2;
  }
  .ywf-cart-modal__btn--primary {
    order: 1;
  }
}


/* =====================================================
   HEADER SEARCH — FiboSearch icon layout
   Користуємось вбудованим [fibosearch layout="icon"] —
   FiboSearch сам відкриває overlay/inline-інпут при кліку.
   Тут лише підганяємо колір/розмір іконки під дизайн.
   ===================================================== */
.header-fibosearch .js-dgwt-wcas-enable-mobile-form,
.header-fibosearch .js-dgwt-wcas-search-icon,
.header-fibosearch .dgwt-wcas-search-icon {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
}
/* Замінюємо вбудовану іконку FiboSearch на наш SVG */
.header-fibosearch .js-dgwt-wcas-enable-mobile-form svg,
.header-fibosearch .js-dgwt-wcas-search-icon svg,
.header-fibosearch .dgwt-wcas-search-icon svg,
.header-fibosearch .js-dgwt-wcas-enable-mobile-form img,
.header-fibosearch .js-dgwt-wcas-search-icon img {
  display: none !important;
}
.header-fibosearch .js-dgwt-wcas-enable-mobile-form::before,
.header-fibosearch .js-dgwt-wcas-search-icon::before,
.header-fibosearch .dgwt-wcas-search-icon::before {
  content: '';
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M21.5299 20.4693L16.8358 15.7762C18.1963 14.1428 18.8748 12.0478 18.73 9.92691C18.5852 7.80604 17.6283 5.82265 16.0584 4.38932C14.4885 2.95599 12.4264 2.18308 10.3012 2.23138C8.1759 2.27968 6.15108 3.14547 4.64791 4.64864C3.14474 6.15181 2.27895 8.17663 2.23065 10.3019C2.18235 12.4271 2.95526 14.4892 4.38859 16.0591C5.82191 17.629 7.80531 18.5859 9.92618 18.7307C12.047 18.8755 14.1421 18.1971 15.7755 16.8365L20.4686 21.5306C20.5383 21.6003 20.621 21.6556 20.7121 21.6933C20.8031 21.731 20.9007 21.7504 20.9992 21.7504C21.0978 21.7504 21.1954 21.731 21.2864 21.6933C21.3775 21.6556 21.4602 21.6003 21.5299 21.5306C21.5995 21.4609 21.6548 21.3782 21.6925 21.2871C21.7302 21.1961 21.7497 21.0985 21.7497 21C21.7497 20.9014 21.7302 20.8038 21.6925 20.7128C21.6548 20.6218 21.5995 20.539 21.5299 20.4693ZM3.74924 10.5C3.74924 9.16495 4.14512 7.8599 4.88682 6.74987C5.62852 5.63984 6.68272 4.77467 7.91612 4.26378C9.14953 3.75289 10.5067 3.61922 11.8161 3.87967C13.1255 4.14012 14.3282 4.78299 15.2722 5.727C16.2162 6.671 16.8591 7.87374 17.1195 9.18311C17.38 10.4925 17.2463 11.8497 16.7354 13.0831C16.2245 14.3165 15.3594 15.3707 14.2493 16.1124C13.1393 16.8541 11.8343 17.25 10.4992 17.25C8.70964 17.248 6.9939 16.5362 5.72846 15.2708C4.46302 14.0053 3.75122 12.2896 3.74924 10.5Z' fill='%23292929'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px 24px;
  transition: opacity 0.15s ease;
}
.header-fibosearch .js-dgwt-wcas-enable-mobile-form:hover::before,
.header-fibosearch .js-dgwt-wcas-search-icon:hover::before,
.header-fibosearch .dgwt-wcas-search-icon:hover::before {
  opacity: 0.7;
}

.dgwt-wcas-ico-magnifier,
.dgwt-wcas-ico-magnifier-handler,
html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon {
  max-width: 24px;
}


/* =====================================================
   YWF — Inline header menu (праворуч від лого, перед пошуком)
   ===================================================== */
.ywf-right-menu-wrapper {
  display: inline-flex;
  align-items: center;
  margin-right: 24px;
}
.sh-component.main-menu-wrapper.ywf-right-menu-wrapper {
  margin-left: 0px;
  margin-right: 0px;
}
.ywf-right-menu-wrapper .zn-res-menuwrapper {
  display: none !important;
}
.ywf-right-menu-wrapper .ywf-right-menu {
  display: block;
}
.ywf-right-menu-wrapper .main-menu {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 24px;
}
.ywf-right-menu-wrapper .main-menu > li {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
}
.ywf-right-menu-wrapper .main-menu > li > a {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  color: #292929;
  text-decoration: none;
  text-transform: none;
  letter-spacing: 0;
  background: transparent;
  border: 0;
  transition: opacity 0.15s ease;
}
.ywf-right-menu-wrapper .main-menu > li > a:hover,
.ywf-right-menu-wrapper .main-menu > li.current-menu-item > a {
  opacity: 0.7;
  color: #292929;
}

/* Підменю — dropdown */
.ywf-right-menu-wrapper .main-menu .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;
  margin: 0;
  padding: 12px 0;
  list-style: none;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  border: 1px solid #ececec;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0s linear 0.15s;
  z-index: 200;
}
.ywf-right-menu-wrapper .main-menu > li:hover > .sub-menu,
.ywf-right-menu-wrapper .main-menu > li:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0s linear 0s;
}
.ywf-right-menu-wrapper .main-menu .sub-menu li {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ywf-right-menu-wrapper .main-menu .sub-menu a {
  display: block;
  padding: 8px 16px;
  font-family: Montserrat, sans-serif;
  font-size: 13px;
  color: #292929;
  text-decoration: none;
  line-height: 1.4;
  transition: background 0.15s ease;
}
.ywf-right-menu-wrapper .main-menu .sub-menu a:hover {
  background: #f4f4f4;
}

/* На мобайл — ховаємо повністю (там використовується бургер головного меню) */
@media (max-width: 991px) {
  .ywf-right-menu-wrapper {
    display: none !important;
  }
}


/* =====================================================
   YWF — Mobile burger button + drawer
   ===================================================== */
.ywf-mobile-burger {
  display: none;
  width: 24px;
  height: 24px;
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  cursor: pointer;
  align-items: center;
  justify-content: center;
}
.ywf-mobile-burger svg {
  display: block;
  width: 24px;
  height: 24px;
}

@media (max-width: 991px) {
  .ywf-mobile-burger {
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    z-index: 6;
  }
  /* Ховаємо стандартний Kallyas-бургер у меню */
  .zn-res-menuwrapper {
    display: none !important;
  }
}

/* Drawer ----------------------------------------------- */
.ywf-mobile-drawer {
  position: fixed;
  inset: 0;
  z-index: 100001;
  display: block;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.25s ease, visibility 0s linear 0.25s;
  font-family: Montserrat, sans-serif;
}
.ywf-mobile-drawer[hidden] {
  display: none;
}
.ywf-mobile-drawer.is-open {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.25s ease, visibility 0s linear 0s;
}
.ywf-mobile-drawer__overlay {
  position: absolute;
  inset: 0;
  background: rgba(20, 20, 20, 0.45);
  cursor: pointer;
}
.ywf-mobile-drawer__panel {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  max-width: 320px;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transform: translateX(-100%);
  transition: transform 0.3s cubic-bezier(.2,.7,.2,1);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.ywf-mobile-drawer.is-open .ywf-mobile-drawer__panel {
  transform: translateX(0);
}

.ywf-mobile-drawer__top {
  height: 56px;
  padding: 0 8px 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
}
.ywf-mobile-drawer__logo {
  display: inline-flex;
  align-items: center;
  height: 14px;
  text-decoration: none;
}
.ywf-mobile-drawer__logo img {
  height: 14px;
  width: auto;
  display: block;
}
.ywf-mobile-drawer__close {
  width: 40px;
  height: 40px;
  padding: 8px;
  background: transparent;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ywf-mobile-drawer__close svg {
  display: block;
  width: 24px;
  height: 24px;
}

.ywf-mobile-drawer__nav {
  flex: 1 1 auto;
  padding: 96px 16px 16px;
}
.ywf-mobile-drawer__menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ywf-mobile-drawer__menu li {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ywf-mobile-drawer__menu a {
  display: flex;
  align-items: center;
  height: 48px;
  padding: 0 4px;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 22.4px;
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 0;
}
.ywf-mobile-drawer__menu a:hover,
.ywf-mobile-drawer__menu .current-menu-item > a {
  color: #292929;
  opacity: 0.7;
}
.ywf-mobile-drawer__menu a span {
  display: inline;
}

.ywf-mobile-drawer__footer {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 0 0 auto;
}
.ywf-mobile-drawer__footer a {
  display: inline-block;
  color: #292929;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 16.8px;
  text-transform: uppercase;
  text-decoration: none;
}
.ywf-mobile-drawer__footer a:hover {
  opacity: 0.7;
}

body.ywf-drawer-open {
  overflow: hidden;
}

/* Mobile: іконка 24×24, переносимо ліворуч (поверх лівої колонки хедера) */
@media (max-width: 767px) {
  .site-header-main {
    position: relative;
  }
  .header-fibosearch {
    position: absolute !important;
    left: 40px;
    top: 25px;
    transform: translateY(-50%);
    width: auto !important;
    max-width: 24px;
    flex: 0 0 auto !important;
    z-index: 5;
  }
  .header-fibosearch .js-dgwt-wcas-enable-mobile-form,
  .header-fibosearch .js-dgwt-wcas-search-icon,
  .header-fibosearch .dgwt-wcas-search-icon {
    width: 24px;
    height: 24px;
  }
  .header-fibosearch .js-dgwt-wcas-enable-mobile-form::before,
  .header-fibosearch .js-dgwt-wcas-search-icon::before,
  .header-fibosearch .dgwt-wcas-search-icon::before {
    width: 24px;
    height: 24px;
    background-size: 24px 24px;
  }
}