:root {
	--wd-hb-opt-h: 70px;
	--wd-text-font: "Rubik", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: #777777;
	--wd-text-font-size: 15px;
	--wd-title-font: "Rubik", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 700;
	--wd-title-color: #242424;
	--wd-entities-title-font: "Rubik", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 600;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Rubik", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 700;
	--wd-widget-title-transform: capitalize;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Rubik", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 600;
	--wd-header-el-transform: capitalize;
	--wd-header-el-font-size: 14px;
	--wd-brd-radius: 10px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(240,101,167);
	--wd-alternative-color: #fbbc34;
	--btn-default-bgcolor: #f7f7f7;
	--btn-default-bgcolor-hover: #efefef;
	--btn-accented-bgcolor: rgb(140,188,103);
	--btn-accented-bgcolor-hover: rgb(128,171,94);
	--btn-transform: capitalize;
	--wd-form-brd-width: 1px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: #333333;
	--wd-link-color-hover: rgb(240,101,167);
	--wd-sticky-btn-height: 95px;
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: #111111;
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
.wd-hb {
	background-color: rgba(80,170,68,0.28);
	background-image: none;
	background-repeat: repeat-x;
	background-size: cover;
	background-attachment: inherit;
	background-position: left top;
}
:is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg, :is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg :is(.wd-product,.wd-cat) {
	--wd-prod-bg:rgb(255,255,255);
	--wd-bordered-bg:rgb(255,255,255);
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 622px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(80,86,88);
	background-image: none;
}
html .widget_price_filter [class*="price_slider_amount"] .button {
	color: rgb(255,255,255);
	background: rgb(140,188,103);
}
html .widget_price_filter [class*="price_slider_amount"] .button:hover {
	color: rgb(255,255,255);
	background: rgb(128,171,94);
}
body, [class*=color-scheme-light], [class*=color-scheme-dark], .wd-search-form[class*="wd-header-search-form"] form.searchform, .wd-el-search .searchform {
	--wd-form-bg: rgb(255,255,255);
}
.wd-nav-arrows.wd-pos-sep:not(:where(.wd-custom-style)) {
	--wd-arrow-size: 40px;
	--wd-arrow-icon-size: 16px;
	--wd-arrow-offset-h: 20px;
	--wd-arrow-color: rgb(51,51,51);
	--wd-arrow-color-hover: rgb(255,255,255);
	--wd-arrow-color-dis: rgba(51,51,51,0.8);
	--wd-arrow-bg: rgb(255,255,255);
	--wd-arrow-bg-hover: rgb(240,101,167);
	--wd-arrow-bg-dis: rgb(230,90,147);
	--wd-arrow-radius: 10px;
	--wd-arrow-shadow: 0px 0px 0px 0px rgba(255,255,255,0);
}
.wd-nav-scroll {
	--wd-nscroll-height: 3px;
	--wd-nscroll-drag-bg: rgb(240,101,167);
	--wd-nscroll-drag-bg-hover: rgb(240,101,167);
}
.wd .product-label.new {
	background-color: rgb(140,188,103);
	color: rgb(255,255,255);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}

@media (max-width: 1024px) {
	:root {
		--wd-hb-opt-h: 70px;
	--wd-sticky-btn-height: 95px;
	}
	[class*="thumbs-grid-bottom"] .woocommerce-product-gallery__wrapper.wd-grid {
		--wd-col: 1;
	}

}

@media (max-width: 768.98px) {
	:root {
		--wd-hb-opt-h: 80px;
	--wd-sticky-btn-height: 42px;
	}
	[class*="thumbs-grid-bottom"] .woocommerce-product-gallery__wrapper.wd-grid {
		--wd-col: 1;
	}

}
:root{
--wd-form-brd-radius: 5px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 5px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-brd-radius: 5px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
}



.wd-page-title {
background-color: rgb(250,248,245);
}

/* breadcrumb */
:is(.breadcrumbs,.yoast-breadcrumb) :is(a,span) {
    font-size: 16px;
}
.woocommerce-breadcrumb a, .yoast-breadcrumb a:hover {
	color: var(--wd-primary-color);
				}
.yoast-breadcrumb .home-icon {
    width: auto; /* або інший розмір за потреби */
    height: 12px;
    filter: invert(0); /* змініть значення для налаштування кольору */
    transition: filter 0.3s ease;
}

.yoast-breadcrumb a:hover .home-icon {
    filter: invert(0.5); /* змініть значення для ефекту при наведенні */
	color: var(--wd-primary-color);
}


/* viewed product title page product */
.wd-product :where(.elementor-10579 .product-wrapper,.product-element-bottom) {
    display: inline-grid;
     justify-items: center;
}

/* viewed product page category */
.wd-product :where(.elementor-9033 .product-wrapper,.product-element-bottom) {
    display: inline-grid;
     justify-items: center;
}
/* height header mega menu */
.widget_nav_mega_menu>.widget-title {
    margin-bottom: 0;
    padding: 10px;
    height: 40px;
}	

/* social icons begin */
.wd-social-icons{font-size:0;}.wd-social-icons .wd-label{display:block;margin-bottom:5px;color:var(--color-gray-800);font-weight:600;font-size:var(--wd-text-font-size)}.wd-social-icons .wd-social-icon{display:inline-block;margin:4px;vertical-align:middle;text-align:center;font-size:0}.wd-social-icons .wd-icon{display:inline-block;vertical-align:middle;font-family:"woodmart-font";}.wd-social-icons p{display:inline-block;margin:0}.social-facebook{--social-color: #365493}.social-facebook .wd-icon:before{content:"\f180"}.social-twitter{--social-color: #000}.social-twitter .wd-icon:before{content:"\f154"}.social-instagram{--social-color: #774430;}.social-instagram .wd-icon:before{content:"\f163"}.social-email{--social-color: #F89A1E}.social-email .wd-icon:before{content:"\f157"}.social-pinterest{--social-color: #CB2027}.social-pinterest .wd-icon:before{content:"\f156"}.social-youtube{--social-color: #CB2027}.social-youtube .wd-icon:before{content:"\f162"}.social-tumblr{--social-color: #36465D}.social-tumblr .wd-icon:before{content:"\f165"}.social-linkedin{--social-color: #0274B3}.social-linkedin .wd-icon:before{content:"\f158"}.social-vimeo{--social-color: #1AB7EA}.social-vimeo .wd-icon:before{content:"\f177"}.social-flickr{--social-color: #FE0072}.social-flickr .wd-icon:before{content:"\f164"}.social-github{--social-color: #171515}.social-github .wd-icon:before{content:"\f155"}.social-dribbble{--social-color: #EC5E95}.social-dribbble .wd-icon:before{content:"\f166"}.social-behance{--social-color: #1F6FFC}.social-behance .wd-icon:before{content:"\f170"}.social-soundcloud{--social-color: #F9490D}.social-soundcloud .wd-icon:before{content:"\f172"}.social-spotify{--social-color: #2EBD59}.social-spotify .wd-icon:before{content:"\f171"}.social-skype{--social-color: #00AFF0}.social-skype .wd-icon:before{content:"\f167"}.social-ok{--social-color: #EE8208}.social-ok .wd-icon:before{content:"\f176"}.social-whatsapp{--social-color: #1EBEA5}.social-whatsapp .wd-icon:before{content:"\f175"}.social-vk{--social-color: #4C75A3}.social-vk .wd-icon:before{content:"\f168"}.social-snapchat{--social-color: #FFFC00}.social-snapchat .wd-icon:before{content:"\f178"}.social-tg{--social-color: #37AEE2}.social-tg .wd-icon:before{content:"\f179"}.social-viber{--social-color: #834995}.social-viber .wd-icon:before{content:"\f181"}.social-tiktok{--social-color: #010101}.social-tiktok .wd-icon:before{content:"\f133"}.social-discord{--social-color: #5562EA}.social-discord .wd-icon:before{content:"\f184"}.wd-social-icons.wd-layout-justify{display:flex;align-items:center;flex-wrap:wrap}.wd-social-icons.wd-layout-justify .wd-label{flex:1 1 auto;margin-bottom:0;text-align:start}.wd-social-icons.wd-layout-inline .wd-label{display:inline-block;margin-inline-end:5px;margin-bottom:0;vertical-align:middle}.icons-design-default .wd-social-icon{margin:0 !important;padding:6px;width:auto !important;height:auto !important;color:rgba(0,0,0,0.6) !important}.icons-design-default .wd-social-icon .wd-icon{line-height:1 !important}.icons-design-default .wd-social-icon:hover{color:rgba(0,0,0,0.8) !important}.icons-design-default.color-scheme-light .wd-social-icon,[class*="color-scheme-light"] .icons-design-default .wd-social-icon{color:#fff !important}.icons-design-default.color-scheme-light .wd-social-icon:hover,[class*="color-scheme-light"] .icons-design-default .wd-social-icon:hover{color:rgba(255,255,255,0.6) !important}.icons-design-simple .wd-social-icon{background-color:#F2F2F2;color:rgba(0,0,0,0.4) !important}.icons-design-simple .wd-social-icon:hover{background-color:var(--wd-primary-color);color:#fff !important}.icons-design-simple.color-scheme-light .wd-social-icon,.color-scheme-light .icons-design-simple .wd-social-icon{background-color:rgba(255,255,255,0.3);color:#fff !important}.icons-design-colored-alt .wd-social-icon{background-color:#EFEFEF;color:rgba(0,0,0,0.4) !important;}.icons-design-colored-alt.color-scheme-light .wd-social-icon,.color-scheme-light .icons-design-colored-alt .wd-social-icon{background-color:rgba(255,255,255,0.3);color:#fff !important}.icons-design-bordered .wd-social-icon{border:2px solid #CCC;background-color:transparent;color:rgba(0,0,0,0.4) !important}.icons-design-bordered .wd-social-icon .wd-icon{margin-top:-2px}.icons-design-bordered.color-scheme-light .wd-social-icon,.color-scheme-light .icons-design-bordered .wd-social-icon{border:2px solid rgba(255,255,255,0.4);color:#fff !important}.icons-design-colored .wd-social-icon{background-color:var(--social-color);color:#fff !important}.icons-design-colored .wd-social-icon:hover{box-shadow:inset 0 0 200px rgba(0,0,0,0.15);color:#fff !important}:is(.icons-design-colored-alt,.icons-design-bordered) .wd-social-icon:hover{border-color:var(--social-color);background-color:var(--social-color);color:#fff !important}.icons-design-primary .wd-social-icon{border:2px solid var(--wd-primary-color);color:var(--wd-primary-color)}.icons-design-primary .wd-social-icon .wd-icon{margin-top:-2px}.icons-design-primary .wd-social-icon:hover{background-color:var(--wd-primary-color);color:#fff}:is(.icons-size-small,.icons-size-) .wd-social-icon{width:30px;height:30px;}.wd-social-icons:is(.icons-size-small,.icons-size-) .wd-icon{font-size:14px;line-height:30px;}.icons-size-default .wd-social-icon{width:40px;height:40px}.wd-social-icons.icons-size-default .wd-icon{font-size:18px;line-height:40px}.icons-size-large .wd-social-icon{width:60px;height:60px}.wd-social-icons.icons-size-large .wd-icon{font-size:22px;line-height:60px}.social-form-circle .wd-social-icon{border-radius:50%;}.social-form-rounded .wd-social-icon{border-radius:5px}@media (min-width: 1025px){.wd-social-icons .whatsapp-mobile{display:none !important}}@media (max-width: 1024px){.wd-social-icons .whatsapp-desktop{display:none !important}}


/* social icons end */


/* стиль дати відправки для шорткода [shipping_date] код в function*/
.shipping-date-widget {
    display: inline-block;
    background: #f0faf5;
    border: 1px solid #1D9E75;
    border-radius: 6px;
    padding: 6px 14px;
    font-size: 15px;
    color: #085041;
}




/*Каруселі в 2 рядки профільних категорій */
/*
 * SST v3 — Anti-flash + два рядки
 * Вставити у: Woodmart → Custom CSS
 * ═══════════════════════════════════════════════════════════
 */
/*
 * SST v3 — Anti-flash + два рядки
 * Вставити у: Woodmart → Custom CSS
 * ═══════════════════════════════════════════════════════════
 */

/* ── АНТИФЛЕШ ─────────────────────────────────────────────
   Поки JS не відпрацював — ховаємо всі слайди каруселі.
   JS додає клас sst-ready після фільтрації → все з'являється.
   ──────────────────────────────────────────────────────── */
.sst-carousel:not(.sst-ready) .wd-carousel-item,
.sst-carousel:not(.sst-ready) .swiper-slide {
  visibility: hidden;
  opacity: 0;
}

/* Коли JS готовий — плавна поява */
.sst-carousel.sst-ready .wd-carousel-item,
.sst-carousel.sst-ready .swiper-slide {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.15s ease;
}

/* Повністю прибираємо сховані слайди (без пустого місця) */
.sst-carousel .wd-carousel-item.sst-hidden,
.sst-carousel .swiper-slide.sst-hidden {
  display: none !important;
}

/* ── ДВА РЯДКИ ────────────────────────────────────────────
   JS додає .sst-two-rows коли видимих категорій > 5 (desktop)
   або > 3 (mobile)
   ──────────────────────────────────────────────────────── */
.sst-carousel.sst-two-rows .swiper-wrapper {
  flex-wrap: wrap !important;
  height: auto !important;
}

/* Десктоп: 5 у рядку */
@media (min-width: 768px) {
  .sst-carousel.sst-two-rows .swiper-slide {
    width: 20% !important;
  }
}

/* Мобільний: 3 у рядку */
@media (max-width: 767px) {
  .sst-carousel.sst-two-rows .swiper-slide {
    width: 33.333% !important;
  }
}

/* Ховаємо стрілки у режимі 2 рядки */
.sst-carousel.sst-two-rows .swiper-button-next,
.sst-carousel.sst-two-rows .swiper-button-prev {
  display: none !important;
}@media (min-width: 1025px) {
	.website-wrapper {
       box-shadow: 0 0px 18px rgba(0,0,0,.3);
	border-radius: 10px;
		}

/* будуємо ширину header та ставимо по центру. додано width та margin */
.website-wrapper {
    position: relative;
    background-color: var(--wd-main-bgcolor);
    width: 1480px;
    margin: auto;
	  }
/* --- БЕЗПЕЧНИЙ ФІКС ШИРИНИ ЛИПКОГО ХЕДЕРА --- */
/* 1. ВИМИКАЄМО СТАРУ ТІНЬ/ЛІНІЮ НА ВЕСЬ ЕКРАН (те, що ви знайшли) */
.whb-sticky-shadow.whb-sticked .whb-main-header {
    box-shadow: none !important;
}

/* 2. ГОЛОВНИЙ КОНТЕЙНЕР (HEADER) - РОБИМО ПРОЗОРИМ */
header.whb-sticked {
    background-color: transparent !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

/* 3. ВНУТРІШНІЙ РЯДОК - ЗАДАЄМО ШИРИНУ, ЦЕНТРУВАННЯ ТА НОВУ ТІНЬ */
.whb-sticked .whb-row {
    width: 1480px !important;
    max-width: 1480px !important;
    margin: 0 auto !important; /* Центрування */
    
    /* Прибираємо радіус */
    border-radius: 0 !important;
    
    /* Прибираємо зайві лінії */
    border-bottom: none !important;
    
    /* ДОДАЄМО ТІНЬ ТІЛЬКИ ПІД БЛОКОМ 1480px */
    box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important; 
    
    box-sizing: border-box;
}

/* кнопка каталог у header */

.wd-header-cats.wd-style-1 .menu-opener {
    min-width: 160px;
	border-radius: var(--wd-brd-radius);
	box-shadow: 0 3px 3px rgba(0,0,0,.3);
	}

.wd-header-cats.wd-style-1 .menu-opener:hover {
	background-color: var(--wd-main-bgcolor)
		
	}

/* ===== ВУЗЬКІ PC (1024px - 1499px) ===== */

@media (min-width: 1024px) and (max-width: 1499px) {
    
    /* Основний контейнер */
    .website-wrapper {
        width: calc(100% - 30px) !important;
        max-width: calc(100% - 30px) !important;
        margin: auto;
        padding: 0 15px;
    }
    
    /* Липке меню */
    .whb-sticky-shadow+.whb-clone .whb-row {
        width: calc(100% - 30px) !important;
        max-width: calc(100% - 30px) !important;
        margin: auto;
        padding: 0 15px;
    }
    
    /* Контейнер контенту */
    .wd-content-container {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* ===== ДУЖЕ ВУЗЬКІ PC (1024px - 1200px) ===== */

@media (min-width: 1024px) and (max-width: 1200px) {
    
    .website-wrapper,
    .whb-sticky-shadow+.whb-clone .whb-row {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 10px;
    }
}

/* --- Відступ аотрибутів в товарі for Desktop (Параметри товару) --- */

/* --- Global Styles for Product Attributes (2 columns) --- */

.woocommerce-product-attributes {
    width: 100%;
    border-collapse: collapse; /* Прибирає подвійні лінії, якщо вони є */
}

/* Перша колонка (Назва атрибута) */
.woocommerce-product-attributes-item__label {
    width: 180px; /* Фіксована невелика ширина */
    text-align: left; /* Вирівнювання по лівому краю */
    padding-right: 15px; /* Відступ між назвою та значенням */
    font-weight: bold; /* Робимо жирним для кращого читабельності */
    color: #777; /* Трохи сіріший колір (як на Rozetka) */
    vertical-align: top; /* Вирівнювання тексту по верхньому краю комірки */
}

/* Друга колонка (Значення) */
.woocommerce-product-attributes-item__value {
    text-align: left; /* Значення теж зліва */
    width: auto; /* Займає решту простору */
    color: #333;
}

/* Прибираємо зайві відступи всередині комірок */
.woocommerce-product-attributes-item {
    display: table-row; /* Примусово як рядок таблиці */
    border-bottom: 1px solid #eee; /* Лінія між рядками */
}

.woocommerce-product-attributes-item__label, 
.woocommerce-product-attributes-item__value {
    padding-top: 10px;
    padding-bottom: 10px;
}
}

@media (min-width: 768px) and (max-width: 1024px) {
	/* Head icon menu */
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) .wd-custom-icon {
    max-width: 28px;}
/* footer icon menu */
.wd-toolbar-link .wd-custom-icon img {
    width: auto;
    height: 36px;}

/* header icon cart */
.whb-top-bar .wd-tools-element .wd-tools-icon:before {
    font-size: 28px;}
/* header icon cart - count */
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) {
    --wd-count-size: 19px;}
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7) .wd-tools-count {
    font-size: 14px;
}
.wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) .wd-tools-count {
    position: absolute;
    top: -8px;
    inset-inline-end: -10px;
    background-color: #fff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.17);
    color: var(--wd-primary-color);
    font-size: 11px;
}

/* background color mobile menu Nav top*/
.mobile-nav .wd-heading {
    position: relative;
    z-index: 6;
    background-color: #505658;
}
.wd-heading .wd-action-btn.wd-style-text>a {
    height: 21px;
}
.wd-action-btn.wd-style-text>a {
    position: relative;
    font-weight: 600;
    line-height: 1;
    color: white;
}

/* --- відступ атрибутів Styles for Mobile --- */
@media (max-width: 768px) {
    .woocommerce-product-attributes-item {
        display: flex;
        flex-direction: row; /* В рядок */
        align-items: flex-start; /* ВАЖЛИВО: Вирівнювання по верхньому краю */
        padding: 8px 0;
        border-bottom: 1px solid #eee;
    }

    .woocommerce-product-attributes-item__label {
        width: 40%; /* Ширина назви (трохи зменшив, щоб значенню було більше місця) */
        min-width: 100px;
        text-align: left;
        font-weight: bold;
        color: #333;
        flex-shrink: 0; /* Забороняємо стискати назву */
        padding-right: 10px;
    }

    .woocommerce-product-attributes-item__value {
        width: 60%; /* Решта місця для значення */
        text-align: left; /* Значення зліва */
        flex-grow: 1;
        color: #666;
        word-wrap: break-word; /* Дозволяє переносити довгі слова */
        overflow-wrap: break-word; /* Сучасний аналог */
    }
}

 
/* --- НАЛАШТУВАННЯ ПАНЕЛІ ФІЛЬТРІВ --- */
div[data-id="b448b45"] {
    transition: transform 0.3s ease, opacity 0.3s ease;
    position: -webkit-sticky;
    position: sticky;
    
    /* ЗМІНЮЙТЕ ЦЕЙ ПАРАМЕТР для відступу від головного меню */
    /* Якщо хочете нижче - збільшуйте число (70px, 80px, 90px) */
    top: 60px; 
    
    /* Знижуємо пріоритет шару */
    z-index: 100 !important;
    
    /* РОБИМО НА ВСЮ ШИРИНУ ЕКРАНА */
    width: 100vw;
    left: 0;
    right: 0;
    margin-left: calc(-50vw + 50%); /* Центруємо відносно контейнера */
    
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

div[data-id="b448b45"].hide-on-scroll-down {
    transform: translateY(-150%);
    opacity: 0;
}

/* --- БІЧНА ПАНЕЛЬ (SIDEBAR) - МАЄ БУТИ ЗВЕРХУ --- */
/* Всі можливі класи бічної панелі WoodMart */
.wd-off-canvas-wrapper,
#wd-off-canvas,
.wd-off-canvas,
.wd-sidebar-opened .wd-off-canvas-wrapper,
body.wd-off-canvas-opened .wd-off-canvas-wrapper {
    z-index: 999999 !important;
}

/* Затемнення фону (overlay) */
.wd-off-canvas-overlay {
    z-index: 999998 !important;
}

/* Кнопка закриття бічної панелі */
.wd-close-sidebar {
    z-index: 999999 !important;
}
}

@media (min-width: 577px) and (max-width: 767px) {
	/* Head icon menu */
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) .wd-custom-icon {
    max-width: 28px;}
/* footer icon menu */
.wd-toolbar-link .wd-custom-icon img {
    width: auto;
    height: 36px;}

/* header icon cart */
.whb-top-bar .wd-tools-element .wd-tools-icon:before {
    font-size: 28px;}
/* header icon cart - count */
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) {
    --wd-count-size: 19px;}
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7) .wd-tools-count {
    font-size: 14px;
}
.wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) .wd-tools-count {
    position: absolute;
    top: -8px;
    inset-inline-end: -10px;
    background-color: #fff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.17);
    color: var(--wd-primary-color);
    font-size: 11px;
}

/* background color mobile menu Nav top*/
.mobile-nav .wd-heading {
    position: relative;
    z-index: 6;
    background-color: #505658;
}
.wd-heading .wd-action-btn.wd-style-text>a {
    height: 21px;
}
.wd-action-btn.wd-style-text>a {
    position: relative;
    font-weight: 600;
    line-height: 1;
    color: white;
}

/* --- Global Styles for Product Attributes (2 columns) --- */

.woocommerce-product-attributes {
    width: 100%;
    border-collapse: collapse; /* Прибирає подвійні лінії, якщо вони є */
}

/* Перша колонка (Назва атрибута) */
.woocommerce-product-attributes-item__label {
    width: 180px; /* Фіксована невелика ширина */
    text-align: left; /* Вирівнювання по лівому краю */
    padding-right: 15px; /* Відступ між назвою та значенням */
    font-weight: bold; /* Робимо жирним для кращого читабельності */
    color: #777; /* Трохи сіріший колір (як на Rozetka) */
    vertical-align: top; /* Вирівнювання тексту по верхньому краю комірки */
}

/* Друга колонка (Значення) */
.woocommerce-product-attributes-item__value {
    text-align: left; /* Значення теж зліва */
    width: auto; /* Займає решту простору */
    color: #333;
}

/* Прибираємо зайві відступи всередині комірок */
.woocommerce-product-attributes-item {
    display: table-row; /* Примусово як рядок таблиці */
    border-bottom: 1px solid #eee; /* Лінія між рядками */
}

.woocommerce-product-attributes-item__label, 
.woocommerce-product-attributes-item__value {
    padding-top: 10px;
    padding-bottom: 10px;
}


/* --- НАЛАШТУВАННЯ ПАНЕЛІ ФІЛЬТРІВ --- */
div[data-id="b448b45"] {
    transition: transform 0.3s ease, opacity 0.3s ease;
    position: -webkit-sticky;
    position: sticky;
    
    /* ЗМІНЮЙТЕ ЦЕЙ ПАРАМЕТР для відступу від головного меню */
    /* Якщо хочете нижче - збільшуйте число (70px, 80px, 90px) */
    top: 60px; 
    
    /* Знижуємо пріоритет шару */
    z-index: 100 !important;
    
    /* РОБИМО НА ВСЮ ШИРИНУ ЕКРАНА */
    width: 100vw;
    left: 0;
    right: 0;
    margin-left: calc(-50vw + 50%); /* Центруємо відносно контейнера */
    
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

div[data-id="b448b45"].hide-on-scroll-down {
    transform: translateY(-150%);
    opacity: 0;
}

/* --- БІЧНА ПАНЕЛЬ (SIDEBAR) - МАЄ БУТИ ЗВЕРХУ --- */
/* Всі можливі класи бічної панелі WoodMart */
.wd-off-canvas-wrapper,
#wd-off-canvas,
.wd-off-canvas,
.wd-sidebar-opened .wd-off-canvas-wrapper,
body.wd-off-canvas-opened .wd-off-canvas-wrapper {
    z-index: 999999 !important;
}

/* Затемнення фону (overlay) */
.wd-off-canvas-overlay {
    z-index: 999998 !important;
}

/* Кнопка закриття бічної панелі */
.wd-close-sidebar {
    z-index: 999999 !important;
}
}

@media (max-width: 576px) {
	/* Head icon menu */
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) .wd-custom-icon {
    max-width: 28px;}
/* footer icon menu */
.wd-toolbar-link .wd-custom-icon img {
    width: auto;
    height: 36px;}

/* header icon cart */
.whb-top-bar .wd-tools-element .wd-tools-icon:before {
    font-size: 28px;}
/* header icon cart - count */
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) {
    --wd-count-size: 19px;}
.whb-top-bar .wd-tools-element:is(.wd-design-6,.wd-design-7) .wd-tools-count {
    font-size: 14px;
}
.wd-tools-element:is(.wd-design-6,.wd-design-7,.wd-design-8) .wd-tools-count {
    position: absolute;
    top: -8px;
    inset-inline-end: -10px;
    background-color: #fff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.17);
    color: var(--wd-primary-color);
    font-size: 11px;
}



/* background color mobile menu Nav top*/
.mobile-nav .wd-heading {
    position: relative;
    z-index: 6;
    background-color: #505658;
}
.wd-heading .wd-action-btn.wd-style-text>a {
    height: 21px;
}
.wd-action-btn.wd-style-text>a {
    position: relative;
    font-weight: 600;
    line-height: 1;
    color: white;
}

.logo-nav {
  display: block;  
  margin-left: auto;  
  margin-right: auto;
  margin-bottom: 1px;
	z-index: 200;
}



/* кнопка бічної панелі праворуч*/
div.wd-sidebar-opener {
    inset-inline-end: 0;
    inset-inline-start: auto;
    border-start-end-radius: 0;
    border-end-end-radius: 0;
    border-top-left-radius: var(--wd-brd-radius);
    border-bottom-left-radius: var(--wd-brd-radius);
}


/* компановка атрибутів в карточці товару*/
@media (max-width: 768px) {
    /* Базові налаштування таблиці */
    .woocommerce-product-attributes {
        width: 100% !important;
        table-layout: auto !important;
    }

    /* ЛІВА КОЛОНКА (Назва атрибута) */
    .woocommerce-product-attributes-item__label {
        white-space: nowrap !important; /* ЗАБОРОНЯЄМО перенесення тексту назви */
        width: 40% !important; /* Фіксована ширина для лівої частини */
        vertical-align: top !important; /* Прижимаємо до верхнього краю */
        padding-right: 8px !important; /* Відступ від назви до значення */
        font-weight: bold;
    }

    /* ПРАВА КОЛОНКА (Значення) */
    .woocommerce-product-attributes-item__value {
        word-wrap: break-word !important; /* ДОЗВОЛЯЄМО перенесення довгих слів */
        overflow-wrap: break-word !important;
        vertical-align: top !important; /* Прижимаємо до верхнього краю */
        padding-left: 0 !important;
        text-align: left !important;
    }
}

/* --- НАЛАШТУВАННЯ ПАНЕЛІ ФІЛЬТРІВ --- */
div[data-id="b448b45"] {
    transition: transform 0.3s ease, opacity 0.3s ease;
    position: -webkit-sticky;
    position: sticky;
    
    /* ЗМІНЮЙТЕ ЦЕЙ ПАРАМЕТР для відступу від головного меню */
    /* Якщо хочете нижче - збільшуйте число (70px, 80px, 90px) */
    top: 60px; 
    
    /* Знижуємо пріоритет шару */
    z-index: 100 !important;
    
    /* РОБИМО НА ВСЮ ШИРИНУ ЕКРАНА */
    width: 100vw;
    left: 0;
    right: 0;
    margin-left: calc(-50vw + 50%); /* Центруємо відносно контейнера */
    
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

div[data-id="b448b45"].hide-on-scroll-down {
    transform: translateY(-150%);
    opacity: 0;
}

/* --- БІЧНА ПАНЕЛЬ (SIDEBAR) - МАЄ БУТИ ЗВЕРХУ --- */
/* Всі можливі класи бічної панелі WoodMart */
.wd-off-canvas-wrapper,
#wd-off-canvas,
.wd-off-canvas,
.wd-sidebar-opened .wd-off-canvas-wrapper,
body.wd-off-canvas-opened .wd-off-canvas-wrapper {
    z-index: 999999 !important;
}

/* Затемнення фону (overlay) */
.wd-off-canvas-overlay {
    z-index: 999998 !important;
}

/* Кнопка закриття бічної панелі */
.wd-close-sidebar {
    z-index: 999999 !important;
}


/*перенесення з mobile fix */
/* === Продукт: відступи та кнопка === */
.product-summary .summary {
    padding: 10px;
}
.single-product .cart {
    text-align: center;
}

/* === Вимкнути motion effects === */
.elementor-motion-effects-container > .elementor-motion-effects-layer {
    background: none !important;
}

/* === Body відступи === */
body {
    padding: 0 !important;
}

/* === Хлібні крихти — горизонтальний скрол === */
.woocommerce .yoast-breadcrumb-wrapper {
    position: relative;
    overflow: hidden;
}
.woocommerce .yoast-breadcrumb {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    display: block;
    padding: 10px 15px;
    margin: 0 auto;
    max-width: 100%;
    scroll-behavior: smooth;
    position: relative;
    z-index: 1;
    scrollbar-width: thin;
}
.woocommerce .yoast-breadcrumb::-webkit-scrollbar {
    height: 4px;
}
.woocommerce .yoast-breadcrumb::-webkit-scrollbar-thumb {
    background-color: var(--wd-primary-color);
}
.woocommerce .yoast-breadcrumb::-webkit-scrollbar-track {
    background: transparent;
}

/* === Хлібні крихти — кольори === */
.woocommerce-breadcrumb,
.yoast-breadcrumb {
    color: #555;
}
.woocommerce-breadcrumb a,
.yoast-breadcrumb a {
    color: #555;
    text-decoration: none;
}
.woocommerce-breadcrumb a:hover,
.yoast-breadcrumb a:hover {
    color: var(--wd-primary-color);
    text-decoration: underline;
}
.woocommerce-breadcrumb span:last-child,
.yoast-breadcrumb span:last-child {
    color: var(--wd-primary-color);
    font-weight: 500;
}
.yoast-breadcrumb span.separator,
.yoast-breadcrumb .breadcrumb-separator {
    color: #999 !important;
}

/* === Топбар: шрифтові іконки === */
.whb-top-bar .wd-tools-element .wd-tools-icon:before {
    font-size: 28px !important;
}

/* === Топбар: кастомні іконки img/svg === */
.whb-top-bar .wd-tools-element .wd-custom-icon img,
.whb-top-bar .wd-tools-element .wd-custom-icon svg,
.whb-top-bar .wd-tools-element picture.wd-custom-icon {
    height: 36px !important;
    max-height: 36px !important;
    width: auto !important;
    display: inline-block !important;
}

/* === Топбар: лічильник кошика === */
.whb-top-bar .wd-tools-element .wd-tools-count {
    font-size: 14px !important;
    top: -8px !important;
    right: -10px !important;
}

/* === Mobile header: бургер-меню === */
.wd-header-mobile .wd-tools-element .wd-tools-icon:before {
    font-size: 32px !important;
}
.wd-header-mobile .wd-tools-element img,
.wd-header-mobile .wd-tools-element svg,
.wd-header-mobile .wd-tools-element picture.wd-custom-icon,
.wd-header-mobile .wd-tools-element .wd-custom-icon img {
    height: 32px !important;
    max-height: 32px !important;
    width: auto !important;
    display: inline-block !important;
}

/* === Нижнє sticky меню === */
body .wd-toolbar-link.wd-tools-custom-icon .wd-custom-icon img,
body .wd-toolbar-link.wd-tools-custom-icon picture.wd-custom-icon,
body .wd-toolbar-link.wd-tools-custom-icon svg {
    height: 28px !important;
    max-height: 28px !important;
    width: auto !important;
    display: inline-block !important;
}

/*==кінець mobile fix ====*/


/* === MOBILE: кнопка "Додати в кошик" — тільки іконка === */
.wd-add-btn-replace > a {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    padding: 0 !important;
    border-radius: 8px;
}

.wd-add-btn-replace > a:before {
    transform: translateY(0) translateZ(0) !important;
    opacity: 1 !important;
}

.wd-add-btn-replace > a span {
    transform: translateY(-100%) translateZ(0);
    opacity: 0;
}

.wd-add-btn-replace > a:hover:before {
    transform: translateY(0) translateZ(0);
}

.wd-add-btn-replace > a:hover span {
    transform: translateY(-100%) translateZ(0);
}

.wd-add-btn-replace > a.added:before {
    transform: translateY(0) translateZ(0);
    opacity: 1;
}

/* === MOBILE: пошук щоб не стрибав=== */
/* Фіксуємо пошукове вікно — без виходу за межі екрану */
.wd-search-full-screen-2 {
    width: 100vw !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.wd-search-full-screen-2 .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
}

/* Поле пошуку на верху під хедером */
.wd-search-full-screen-2 .wd-scroll {
    padding-top: 0 !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
}

/* Форма пошуку — повна ширина */
.wd-search-full-screen-2 .searchform,
.wd-search-full-screen-2 form.searchform {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* Інпут — 16px щоб не було зуму iOS */
.wd-search-full-screen-2 input.wd-search-inited,
.wd-search-full-screen-2 input[type="text"] {
    font-size: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
}

