/**
 * vt-modern.css — визуальный слой 2026/27 для vt.in.ua
 * Storefront + Volt Tech UX Pro. Классы / id / JS не меняем.
 *
 * Грузится последним в $extra (vtux_output_styles).
 * !important — только против инлайна и правил плагина с !important.
 */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

:root {
  --vt-orange: #f26522;
  --vt-c: #f26522;
  --vt-ink: #111827;
  --vt-text: #374151;
  --vt-muted: #6b7280;
  --vt-line: #e5e7eb;
  --vt-wash: #f3f4f6;
  --vt-soft: #f9fafb;
  --vt-white: #ffffff;
  --vt-sale: #dc2626;
  --vt-r: 12px;
  --vt-r-lg: 16px;
  --vt-header-h: 60px;
  --vt-section-gap: 40px;
  --vt-card-row-gap: 20px;
  --vt-font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

@media (max-width: 959.98px) {
  :root { --vt-section-gap: 28px; }
}

html, body,
button, input, select, textarea,
.site, .woocommerce, .site-header, .site-footer {
  font-family: var(--vt-font);
}

body {
  font-size: 15px;
  line-height: 1.5;
  color: var(--vt-ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--vt-font);
  font-weight: 600;
  color: var(--vt-ink);
  letter-spacing: -0.01em;
}

/* Шапка 2026: не плоский лист, а frosted wash + тонкий янтарь сверху.
   Паттерн иконок по-прежнему выключен. */
#masthead,
header.site-header,
.site-header {
  position: sticky;
  top: 0;
  z-index: 300;
  background: rgba(250, 249, 247, .88) !important;
  background-image: linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(245, 242, 237, .90) 100%) !important;
  box-shadow: inset 0 2px 0 #f26522, 0 1px 0 rgba(17,24,39,.06), 0 12px 32px rgba(17,24,39,.05) !important;
  backdrop-filter: saturate(1.4) blur(16px) !important;
  -webkit-backdrop-filter: saturate(1.4) blur(16px) !important;
  border-bottom: 0 !important;
}

body.admin-bar #masthead,
body.admin-bar header.site-header {
  top: 32px;
}
@media (max-width: 782px) {
  body.admin-bar #masthead,
  body.admin-bar header.site-header { top: 46px; }
}
/* На телефонах (≤600px) адмін-бар WP не фіксований і скролиться разом зі
   сторінкою — липкій шапці відступ під нього не потрібен, інакше під
   баром лишається біла смуга 46px (видно лише залогіненим адмінам). */
@media (max-width: 600px) {
  body.admin-bar #masthead,
  body.admin-bar header.site-header { top: 0 !important; }
}

#masthead::before,
header.site-header::before,
.site-header::before,
#masthead::after,
header.site-header::after,
.site-header::after {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

#masthead .col-full,
.site-header .col-full {
  display: flex !important;
  align-items: center !important;
  gap: 8px 12px !important;
  min-height: var(--vt-header-h) !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

#masthead .site-branding { order: 1; margin: 0 !important; flex: 0 0 auto; }

#masthead .custom-logo-link img,
#masthead img.custom-logo,
.site-header .custom-logo,
.site-branding img {
  height: 40px !important;
  max-height: 40px !important;
  width: auto !important;
  max-width: 160px !important;
  object-fit: contain !important;
  background: transparent !important;
  padding: 0 !important;
}

.site-description,
.site-branding .site-title { display: none !important; }

#vt-search-desktop {
  order: 3;
  flex: 1 1 280px !important;
  min-width: 200px !important;
  max-width: 560px !important;
  height: 44px !important;
  background: #f3f4f6 !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

#vt-search-desktop input,
#vt-search-desktop-input {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  height: 44px !important;
  font-family: var(--vt-font) !important;
  font-size: 15px !important;
  color: #111827 !important;
}

#vt-search-desktop .vt-search-submit,
#vt-search-desktop-submit {
  background: transparent !important;
  color: #374151 !important;
  box-shadow: none !important;
  border: 0 !important;
}

#vt-search-cat-wrap { border-right: 1px solid #e5e7eb !important; }
#vt-search-cat-btn,
.vt-search-cat-btn {
  background: transparent !important;
  border: 0 !important;
  color: #374151 !important;
  font-weight: 500 !important;
}

#vtux-lang-switcher,
#vtux-lang-switcher.vtux-lang-mounted {
  order: 3;
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  flex: 0 0 auto;
}

#vtux-lang-switcher {
  display: inline-flex !important;
  align-items: center;
  gap: 2px !important;
  padding: 3px !important;
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(17,24,39,.08) !important;
  border-radius: 999px !important;
  box-shadow: 0 1px 2px rgba(17,24,39,.04) !important;
}
#vtux-lang-switcher a,
#vtux-lang-switcher button,
#vtux-lang-switcher span,
#vtux-lang-switcher .active,
#vtux-lang-switcher [aria-current] {
  background: transparent !important;
  color: #6b7280 !important;
  border: 0 !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  min-width: 36px;
  height: 28px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#vtux-lang-switcher .active,
#vtux-lang-switcher [aria-current="true"],
#vtux-lang-switcher a.active,
#vtux-lang-switcher button.active {
  background: #111827 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

#vt-account-mini { order: 4; flex: 0 0 auto; }

#vt-account-toggle-desktop,
.vt-account-toggle-desktop {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 12px;
  border-radius: 12px !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  color: #374151 !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

.site-header-cart { order: 5; flex: 0 0 auto; margin: 0 !important; }
.site-header-cart .cart-contents { color: #111827 !important; }

.storefront-primary-navigation {
  order: 8;
  flex: 1 1 100%;
  background: transparent !important;
  border-top: 1px solid #e5e7eb;
  margin: 0 !important;
}
.site-header .main-navigation ul.menu > li > a,
.storefront-primary-navigation ul.menu > li > a {
  color: #374151 !important;
  background: transparent !important;
  font-weight: 500 !important;
}

@media (min-width: 960px) {
  #masthead .site-search,
  .site-header .widget_product_search { display: none !important; }
}

@media (max-width: 959.98px) {
  #masthead .col-full,
  .site-header .col-full { flex-wrap: wrap !important; }

  #vt-search-desktop,
  #vt-search-cat-dropdown { display: none !important; }

  /* Не форсуємо display на незмонтований #vtux-msearch —
     інакше рядок спливе внизу сторінки до JS. */
  #vtux-msearch.vtux-ms-mounted {
    display: block !important;
    width: 100% !important;
    padding: 12px 16px 16px !important;
    margin-top: 4px !important;
    background: transparent !important;
    background-image: none !important;
  }
  #vtux-msearch.vtux-ms-mounted .vtux-msearch-form {
    display: flex !important;
    width: 100% !important;
    background: #f3f4f6 !important;
    border: 1px solid transparent !important;
    border-radius: 16px !important;
    min-height: 48px !important;
    box-shadow: none !important;
    padding: 4px 4px 4px 14px !important;
  }
  #vtux-msearch.vtux-ms-mounted .vtux-msearch-form:focus-within {
    background: #fff !important;
    border-color: #111827 !important;
    box-shadow: 0 0 0 3px rgba(17,24,39,.06) !important;
  }
  .vtux-msearch-go {
    background: #111827 !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    height: 40px !important;
    padding: 0 16px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
  }

  #vtux-msearch input,
  .vtux-msearch-input {
    width: 100% !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-family: var(--vt-font) !important;
    font-size: 15px !important;
  }

  .storefront-primary-navigation,
  #masthead .main-navigation,
  #masthead .menu-toggle { display: none !important; }
}

.dgwt-wcas-search-wrapp,
.dgwt-wcas-sf-wrapp {
  border-radius: 12px !important;
  background: #f3f4f6 !important;
  border: 0 !important;
}

#vtux-trust-strip {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 16px !important;
  background: #f9fafb !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  color: #374151 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}
#vtux-trust-strip::-webkit-scrollbar { display: none; }

#vtux-trust-strip .vtux-ts-item,
#vtux-trust-strip .vtux-ts-sep,
#vtux-trust-strip .vtux-ts-pill,
#vtux-trust-strip .vtux-ts-pill strong {
  color: #374151 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  white-space: nowrap !important;
}
#vtux-trust-strip .vtux-ts-ico { display: none !important; }

@media (max-width: 959.98px) {
  #vtux-trust-strip { justify-content: flex-start !important; }
}

.vtux-pc-title,
.vtux-sb-title,
h2.vtux-pc-title,
.related.products > h2,
.upsells.products > h2 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #111827 !important;
  border: 0 !important;
  background: none !important;
}
.vtux-pc-title::after,
.vtux-pc-title::before,
.vtux-sb-title::after,
.vtux-sb-title::before {
  content: none !important;
  display: none !important;
}

.vtux-pc-swipe-hint,
.vtux-pc-grid + .swiper-button-next,
.vtux-pc-grid + .swiper-button-prev { display: none !important; }

.vtux-popular-cats,
.vtux-store-benefits,
#vthf-wrap,
.vthf-wrap { margin-bottom: var(--vt-section-gap); }

.vtux-pc-card,
a.vtux-pc-card {
  background: #fff !important;
  border-radius: 16px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06) !important;
  border: 0 !important;
  padding: 16px 10px 14px !important;
  transition: box-shadow .2s ease;
}
.vtux-pc-card:hover {
  box-shadow: 0 6px 16px rgba(0, 0, 0, .08) !important;
  transform: none !important;
}

.vtux-pc-icon {
  width: 56px !important;
  height: 56px !important;
  margin: 0 auto 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: #fff4ed !important; /* v5.17.43: єдиний фірмовий стиль — персиковий круг, як у шторці «Каталог» */
  font-size: 0 !important;
  color: transparent !important;
}
.vtux-pc-icon svg,
.vtux-pc-icon .vtux-cat-icon {
  width: 24px !important;
  height: 24px !important;
  stroke: var(--vt-accent, #f26f21) !important; /* v5.17.43: було сіре #374151 */
  color: var(--vt-accent, #f26f21) !important;
}
.vtux-pc-card:hover .vtux-pc-icon svg,
.vtux-pc-card:hover .vtux-pc-icon .vtux-cat-icon {
  stroke: #fff !important;
  color: #fff !important;
}
/* v5.17.44 FIX: біла іконка малювалась на персиковому крузі (фон
   .vtux-pc-icon вище має !important і перебивав hover-заливку без
   !important) — виглядало як «іконка зникла». Тепер при наведенні круг
   гарантовано заливається фірмовим помаранчевим. */
.vtux-pc-card:hover .vtux-pc-icon,
.vtux-pc-card--link:hover .vtux-pc-icon,
.vtux-pc-card.vtux-pc-active .vtux-pc-icon {
  background: var(--vt-accent, #f26f21) !important;
}

.vtux-pc-sub-emoji {
  font-size: 0 !important;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.vtux-pc-sub-emoji svg {
  width: 18px !important;
  height: 18px !important;
  stroke: #374151 !important;
}

.vtux-pc-name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: #111827 !important;
  min-height: 2.6em;
}
.vtux-pc-count {
  font-size: 12px !important;
  color: #6b7280 !important;
  font-weight: 400 !important;
}

.vthf-sort-chip,
.vtf-sort-chip {
  background: #f3f4f6 !important;
  color: #374151 !important;
  border: 1.5px solid transparent !important;
  border-radius: 999px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.vthf-sort-chip:not(.active),
.vthf-sort-chip:not(.active) * {
  color: #374151 !important;
  -webkit-text-fill-color: #374151 !important;
}

.vthf-sort-chip.active,
.vtf-sort-chip.active,
.vthf-sort-chip[aria-pressed="true"],
.vthf-sort-chip.active *,
.vthf-sort-chip[aria-pressed="true"] * {
  background: #fff !important;
  color: #f26522 !important;
  -webkit-text-fill-color: #f26522 !important;
  border-color: #f26522 !important;
  box-shadow: none !important;
}

.vthf-filter-btn,
.vtf-toggle-btn {
  background: #fff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
}

@media (max-width: 959.98px) {
  /* v5.15.28: згорнутий фільтр за замовчуванням.
     Один компактний рядок: [Фільтр ▾] ......... [N товарів].
     Сортування (select) і панель показуються лише після кліку по
     «Фільтр» (клас .vthf-open на обгортці ставить JS; дубль через :has —
     на випадок стороннього перемикання класу open на панелі). */
  #vthf-wrap,
  .vthf-wrap {
    padding: 10px 14px !important;
  }
  #vthf-wrap .vthf-bar,
  .vthf-wrap .vthf-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin-bottom: 0 !important;
  }

  #vthf-filter-btn,
  .vthf-filter-btn {
    width: auto !important;
    height: 40px !important;
    padding: 0 16px !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }
  /* Стрілка-індикатор розгортання на кнопці */
  #vthf-filter-btn::after {
    content: "▾";
    font-size: 12px;
    margin-left: 2px;
    transition: transform .25s ease;
    display: inline-block;
  }
  .vthf-open #vthf-filter-btn::after { transform: rotate(180deg); }

  #vthf-wrap .vthf-sort,
  .vthf-sort,
  #vthf-wrap .vthf-sort-chip,
  .vthf-sort-chip,
  .vtf-sort-chip { display: none !important; }

  /* Сортування приховане, поки фільтр згорнутий */
  #vthf-sort-select,
  #vthf-sort-select[hidden],
  .vthf-sort-select { display: none !important; }

  .vthf-wrap.vthf-open #vthf-sort-select,
  .vthf-wrap.vthf-open .vthf-sort-select,
  .vthf-wrap:has(.vthf-panel.open) #vthf-sort-select {
    display: block !important;
    width: 100% !important;
    height: 40px !important;
    margin-top: 10px !important;
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
    background: #fff !important;
    color: #111827 !important;
    font-family: var(--vt-font) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* v5.15.29: лічильник товарів — ліворуч, акцентним числом.
     У shared стоїть margin-left:auto — він і відсовував лічильник
     упритул до кнопки, лишаючи зліва порожню діру. */
  #vthf-total,
  .vthf-total {
    display: flex !important;
    align-items: baseline !important;
    gap: 5px !important;
    order: -1 !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
    font-size: 14px !important;
    color: #6b7280 !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #vthf-total strong,
  .vthf-total strong {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #111827 !important;
    letter-spacing: -0.02em !important;
    line-height: 1 !important;
  }

  /* Теги активних фільтрів у згорнутому стані не ховаємо — якщo фільтри
     застосовані, користувач має бачити чому список обмежений. Але панель
     та її відступи не займають місця, поки закриті. */
  .vthf-wrap:not(.vthf-open) .vthf-panel:not(.open) { margin: 0 !important; }
}

@media (min-width: 960px) {
  #vthf-sort-select,
  .vthf-sort-select { display: none !important; }
}

.woocommerce ul.products,
ul.products.vtinfs-grid {
  row-gap: 20px;
  column-gap: 16px;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
ul.products li.product {
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  padding: 6px 6px 10px !important;
  transform: none !important;
}
.woocommerce ul.products li.product:hover,
ul.products li.product:hover {
  box-shadow: 0 6px 16px rgba(0, 0, 0, .08) !important;
  transform: none !important;
  border-color: #e5e7eb !important;
}

.woocommerce ul.products li.product a img,
ul.products li.product img.attachment-woocommerce_thumbnail,
ul.products li.product img.wp-post-image,
.related.products li.product img,
.upsells.products li.product img {
  aspect-ratio: 1 / 1;
  object-fit: contain !important;
  background: #fff !important;
  padding: 4px !important;
  border-radius: 10px !important;
  margin: 0 !important;
  transform: none !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2.woocommerce-loop-product__title,
.related.products li.product .woocommerce-loop-product__title {
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  color: #111827 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(14px * 1.35 * 2);
  margin: 6px 4px 0 !important;
}

.woocommerce ul.products li.product .price,
ul.products li.product .price,
.woocommerce ul.products li.product .price .amount,
ul.products li.product .price .woocommerce-Price-amount,
.related.products li.product .price,
.upsells.products li.product .price {
  color: #111827 !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  margin: 8px 6px 10px !important;
  letter-spacing: -0.02em !important;
}

.woocommerce ul.products li.product .price ins { color: #111827 !important; text-decoration: none !important; }
.woocommerce ul.products li.product .price del { color: #6b7280 !important; font-size: 13px !important; font-weight: 400 !important; }



.woocommerce ul.products li.product > a.button,
.woocommerce ul.products li.product > .button,
.woocommerce ul.products li.product a.add_to_cart_button,
.woocommerce ul.products li.product .add_to_cart_button,
.related.products li.product .add_to_cart_button,
.upsells.products li.product .add_to_cart_button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: calc(100% - 8px) !important;
  margin: 0 4px 2px !important;
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 12px !important;
  background: #f26522 !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  letter-spacing: .01em;
  border: 0 !important;
  box-shadow: 0 6px 14px rgba(242, 101, 34, .22) !important;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .15s ease !important;
}

.woocommerce ul.products li.product .add_to_cart_button:hover,
.woocommerce ul.products li.product > a.button:hover {
  background: #111827 !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(17, 24, 39, .18) !important;
}

.woocommerce ul.products li.product .add_to_cart_button:active,
.woocommerce ul.products li.product > a.button:active {
  transform: scale(.98) !important;
}

/* v5.17.48 — ЄДИНИЙ стиль з каруселями: іконка кошика ПЕРЕД текстом,
   «+» після тексту прибрано. Той самий кошик-SVG, що в картках
   рекомендацій, білим штрихом. */
.woocommerce ul.products li.product .add_to_cart_button::before,
.woocommerce-page ul.products li.product .add_to_cart_button::before {
  content: "" !important;
  display: inline-block !important;
  width: 17px !important; height: 17px !important;
  margin-right: 2px !important; flex: none !important;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='21' r='1'/><circle cx='20' cy='21' r='1'/><path d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/></svg>") center/contain no-repeat !important;
}
.woocommerce ul.products li.product .add_to_cart_button::after {
  content: none !important;
  display: none !important;
}

@media (hover: hover) and (pointer: fine) {
  .woocommerce ul.products li.product .add_to_cart_button,
  .woocommerce ul.products li.product > a.button {
    display: flex !important;
    width: auto !important;
    min-width: 132px;
    max-width: calc(100% - 8px);
    padding: 0 20px !important;
    margin: 0 auto 2px !important;
  }
}

@media (hover: hover) and (pointer: fine) {
  .woocommerce ul.products li.product .add_to_cart_button,
  .woocommerce ul.products li.product > a.button {
    opacity: 1 !important;
    pointer-events: auto !important;
    background: #fff !important;
    color: #111827 !important;
    box-shadow: inset 0 0 0 1.5px #e5e7eb !important;
  }
  .woocommerce ul.products li.product .add_to_cart_button::after,
  .woocommerce ul.products li.product > a.button::after {
    color: #111827;
  }
  .woocommerce ul.products li.product:hover .add_to_cart_button,
  .woocommerce ul.products li.product:focus-within .add_to_cart_button,
  .woocommerce ul.products li.product:hover > a.button,
  .woocommerce ul.products li.product:focus-within > a.button {
    background: #f26522 !important;
    color: #fff !important;
    box-shadow: 0 6px 14px rgba(242, 101, 34, .22) !important;
  }
  .woocommerce ul.products li.product:hover .add_to_cart_button::after,
  .woocommerce ul.products li.product:focus-within .add_to_cart_button::after {
    color: #fff;
  }
}

@media (max-width: 959.98px), (hover: none) {
  .woocommerce ul.products li.product .add_to_cart_button,
  .woocommerce ul.products li.product > a.button {
    opacity: 1 !important;
    pointer-events: auto !important;
    background: #f26522 !important;
    color: #fff !important;
    height: 44px !important;
    min-height: 44px !important;
  }
}

.vt-badge-sale-corner,
span.onsale,
.woocommerce ul.products li.product .onsale {
  background: #dc2626 !important;
  color: #fff !important;
  border: 0 !important;
}

li.product .vt-wl-btn,
.vt-icon-btn.vt-wl-btn,
.vtux-wl-fab {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .72) !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #374151 !important;
}

.single-product .product_title {
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}
.single-product p.price,
.single-product .summary .price,
.single-product .summary .price .amount {
  color: #111827 !important;
  font-size: 28px !important;
  font-weight: 700 !important;
}
.single-product .single_add_to_cart_button {
  background: #f26522 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 12px !important;
  min-height: 48px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

/* ═══════════════════════════════════════════════════════════
   ВКЛАДКИ ТОВАРУ (Опис / Додаткова інформація / Відгуки) — v5.15.8
   Було: Storefront на ≥768px кладе ul.tabs у ліву колонку 30% (float),
   і три «пілюлі» стояли стовпчиком на сірому тлі поруч із панеллю.
   Стало: сегментований перемикач на всю ширину над панеллю —
   світла «доріжка», активна вкладка як біла картка з тінню й
   помаранчевим текстом; панель під ним без рамки-колодця.
   Селектори з body.single-product … .wc-tabs — щоб перебити правила
   vtux-page-product.css, який підключається після цього файлу.
   ═══════════════════════════════════════════════════════════ */
body.single-product .woocommerce-tabs,
body.single-product div.product .woocommerce-tabs {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
  margin-top: 24px !important;
  padding: 0 !important;
}
body.single-product .woocommerce-tabs ul.tabs.wc-tabs,
body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 4px !important;
  width: 100% !important;
  float: none !important;
  margin: 0 0 14px !important;
  padding: 4px !important;
  background: #f3f4f6 !important;
  border: 0 !important;
  border-radius: 14px !important;
  overflow-x: auto !important;
  scrollbar-width: none;
  scroll-padding: 0 !important;
  list-style: none !important;
}
body.single-product .woocommerce-tabs ul.tabs.wc-tabs::after,
body.single-product .woocommerce-tabs ul.tabs.wc-tabs::before { content: none !important; display: none !important; }
body.single-product .woocommerce-tabs ul.tabs.wc-tabs::-webkit-scrollbar { display: none; }

body.single-product .woocommerce-tabs ul.tabs.wc-tabs li,
body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs li {
  flex: 1 1 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  position: relative !important;
  display: flex !important;
}
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li::before,
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li::after,
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li.active::after { content: none !important; display: none !important; }

body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a,
body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs li a {
  flex: 1 1 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 40px !important;
  padding: 8px 16px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #6b7280 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease !important;
}
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a:hover,
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a:focus-visible {
  color: #111827 !important;
  background: rgba(255, 255, 255, .6) !important;
}
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li.active,
body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs li.active {
  background: transparent !important;
  border: 0 !important;
}
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li.active a,
body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs li.active a {
  background: #fff !important;
  color: var(--vt-c, #f26f21) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .08), 0 4px 12px rgba(15, 23, 42, .06) !important;
}

/* Панель — на всю ширину, без «колодця» */
body.single-product .woocommerce-tabs .panel,
body.single-product .woocommerce-tabs .woocommerce-Tabs-panel,
body.single-product div.product .woocommerce-tabs .woocommerce-Tabs-panel {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  background: #fff !important;
  border: 1px solid rgba(15, 23, 42, .06) !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 12px rgba(15, 23, 42, .04) !important;
  padding: 20px 18px 22px !important;
}
body.single-product .woocommerce-tabs .woocommerce-Tabs-panel > h2:first-child { display: none !important; }

/* ≥768px: група вкладок компактна, ліворуч, по ширині вмісту (inline-flex не
   може розтягнутись на весь рядок). Розтягування на рівні частини — лише на
   телефоні, де так зручніше влучати пальцем. */
@media (min-width: 768px) {
  body.single-product .woocommerce-tabs ul.tabs.wc-tabs,
  body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs {
    display: inline-flex !important;
    width: auto !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
  }
  body.single-product .woocommerce-tabs ul.tabs.wc-tabs li,
  body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs li { flex: 0 0 auto !important; }
  body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a,
  body.single-product div.product .woocommerce-tabs ul.tabs.wc-tabs li a {
    flex: 0 0 auto !important;
    padding: 9px 22px !important;
    font-size: 14.5px !important;
  }
  body.single-product .woocommerce-tabs .woocommerce-Tabs-panel { padding: 26px 28px 30px !important; }
}
@media (min-width: 1280px) {
  body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a { padding: 10px 26px !important; font-size: 15px !important; min-height: 42px !important; }
}
@media (min-width: 1920px) {
  body.single-product .woocommerce-tabs ul.tabs.wc-tabs { padding: 5px !important; border-radius: 16px !important; }
  body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a { padding: 12px 30px !important; font-size: 16.5px !important; min-height: 48px !important; border-radius: 12px !important; }
  body.single-product .woocommerce-tabs .woocommerce-Tabs-panel { padding: 32px 36px 36px !important; font-size: 17px !important; }
}
html.dark body.single-product .woocommerce-tabs ul.tabs.wc-tabs { background: #1e293b !important; }
html.dark body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a { color: #94a3b8 !important; }
html.dark body.single-product .woocommerce-tabs ul.tabs.wc-tabs li.active a { background: #0f172a !important; }

@media (max-width: 959.98px) {
  .vtux-mobile-buy-fab,
  .vtux-buy-fab {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    border-radius: 12px !important;
    height: 48px !important;
    justify-content: center !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   ФУТЕР — v5.15.8 (мобільний редизайн)
   Одна візуальна мова для обох блоків посилань (сервісні
   посилання + категорії): компактні чіпи, центрування,
   секції розділені тонкою лінією замість порожнього місця,
   низ футера не ховається під панеллю «Купити».
   ═══════════════════════════════════════════════════════════ */
.site-footer,
#colophon.site-footer {
  background: #111827 !important;
  color: #d1d5db !important;
  padding: 4px 0 0 !important;
  margin: 24px 0 0 !important;
}
.site-footer > .col-full,
#colophon.site-footer > .col-full {
  padding: 0 !important;
  margin: 0 auto !important;
  max-width: none !important;
}

/* — Сервісні посилання (Контакти, Доставка, Гарантія…) — v5.22.0 компактно */
.vtux-footer-links,
.site-footer nav.vtux-footer-links {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 14px 14px 10px !important;
  max-width: 680px !important;
  margin: 0 auto !important;
}
.vtux-footer-link,
.site-footer a.vtux-footer-link,
#colophon a.vtux-footer-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  background: rgba(255, 255, 255, .05) !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 8px !important;
  padding: 5px 10px !important;
  color: #e5e7eb !important;
  font-weight: 500 !important;
  font-size: 11.5px !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background .15s ease, border-color .15s ease !important;
}
.vtux-footer-link::before { content: none !important; display: none !important; }
.vtux-footer-link:hover,
#colophon a.vtux-footer-link:hover {
  background: rgba(242, 111, 33, .16) !important;
  border-color: rgba(242, 111, 33, .55) !important;
  color: #fff !important;
  transform: none !important;
}

/* — Популярні категорії — v5.22.0: щільніше, менший заголовок/відступи. */
.vtux-footer-cats-wrap {
  padding: 12px 14px 16px !important;
  margin: 0 auto !important;
  max-width: 680px !important;
  border-top: 1px solid rgba(255, 255, 255, .08) !important;
  text-align: center !important;
}
.vtux-footer-cats-title {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: rgba(255, 255, 255, .6) !important;
  text-align: center !important;
  margin: 0 0 9px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
.vtux-footer-cats,
.site-footer nav.vtux-footer-cats {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 6px 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.vtux-footer-cats a,
.site-footer nav.vtux-footer-cats a,
#colophon nav.vtux-footer-cats a,
#colophon .vtux-footer-cats a {
  display: inline-flex !important;
  align-items: center !important;
  background: rgba(255, 255, 255, .06) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 999px !important;
  padding: 5px 11px !important;
  color: #d1d5db !important;
  font-weight: 400 !important;
  font-size: 11.5px !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  transform: none !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease !important;
}
.vtux-footer-cats a:hover,
.site-footer nav.vtux-footer-cats a:hover,
#colophon .vtux-footer-cats a:hover {
  background: rgba(242, 111, 33, .16) !important;
  border-color: rgba(242, 111, 33, .55) !important;
  color: #fff !important;
  transform: none !important;
}

/* — Копірайт —
   Відступ знизу рахується від фактичної висоти липкої панелі «Купити»
   (--vt-buyfab-h виставляє JS) та safe-area; нижнє меню сайту
   компенсує padding-bottom самого body, тому тут його не додаємо. */
.site-info {
  color: rgba(255, 255, 255, .45) !important;
  background: #0e1013 !important;
  font-size: 12.5px !important;
  line-height: 1.6 !important;
  letter-spacing: .01em !important;
  text-align: center !important;
  border-top: 1px solid rgba(255, 255, 255, .08) !important;
  padding: 16px 16px calc(18px + var(--vt-buyfab-h, 0px) + var(--vt-nav-h-live, 0px) + env(safe-area-inset-bottom, 0px)) !important;
  margin: 0 !important;
  transition: padding-bottom .2s ease;
}
/* Резерв під фіксовані панелі (нижнє меню + «Купити») живе ТІЛЬКИ у
   .site-info (темна зона), а не в padding-bottom body: раніше під
   футером лишалась біла смуга ~120–180px (body.single-product у
   vtux-page-product.css додавав nav-h + 44 + 76px, плюс ще nav-h від
   vtux-core/shared). html body → специфічність вища за body.single-product. */
@media (max-width: 959.98px) {
  html body,
  html body.single-product,
  html body.woocommerce-view-order { padding-bottom: 0 !important; }
}
/* — Порожній стан авто-блоків товару: дружня картка з жартом — */
.vtux-block-empty--fun {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 20px 0 !important;
  padding: 22px 18px !important;
  background: #f8fafc !important;
  border: 1px dashed #d1d5db !important;
  border-radius: 16px !important;
  text-align: center !important;
  color: #374151 !important;
}
.vtux-block-empty__emoji { font-size: 34px; line-height: 1; margin-bottom: 4px; }
.vtux-block-empty__title { font-size: 15px; font-weight: 600; color: #111827; }
.vtux-block-empty__sub   { font-size: 13px; color: #6b7280; max-width: 420px; line-height: 1.45; }
.vtux-block-empty__tech  { margin-top: 8px; font-size: 11px; color: #9ca3af; font-family: ui-monospace, Menlo, Consolas, monospace; }
.vtux-block-empty--fun + .vtux-block-empty--fun { margin-top: -8px !important; }
@media (min-width: 768px) {
  .vtux-block-empty--fun { flex-direction: row !important; text-align: left !important; gap: 4px 14px !important; flex-wrap: wrap !important; }
  .vtux-block-empty__emoji { margin: 0; }
  .vtux-block-empty__title { flex: 1 1 100%; }
  .vtux-block-empty__title + .vtux-block-empty__sub { flex: 1 1 100%; }
}

/* Короткий опис у картці товару прибрано (дублює вкладку «Опис»); CSS —
   страховка, якщо тема/інший плагін виведе його повторно. */
body.single-product .summary > .woocommerce-product-details__short-description,
body.single-product .entry-summary > .woocommerce-product-details__short-description { display: none !important; }

/* Картка «Доставка / Оплата» v2 (v5.15.15): перевізники згруповані,
   умова безкоштовної доставки — банер: сірий для гостя, у кольорі рівня
   для залогіненого покупця; оплата на телефоні
   згорнута в один рядок із міні-плитками (розгортається по тапу). */
body.single-product .vtux-dp-v2 { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; margin: 14px 0 !important; }
body.single-product .vtux-dp-v2 .vtux-dp-col { background: #fff !important; border: 1px solid rgba(15,23,42,.08) !important; border-radius: 16px !important; padding: 12px 14px !important; min-width: 0 !important; }

body.single-product .vtux-dp-v2 .vtux-dp-heading {
  display: flex !important; align-items: center !important; gap: 8px !important; width: 100% !important;
  margin: 0 0 10px !important; padding: 0 !important; border: 0 !important; background: none !important;
  font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important;
  color: #111827 !important; text-align: left !important; box-shadow: none !important; cursor: default !important;
}
body.single-product .vtux-dp-v2 .vtux-dp-heading > svg { color: #6b7280 !important; flex: 0 0 auto !important; }

/* банер */
body.single-product .vtux-dp-banner {
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: 8px 10px !important; border-radius: 10px !important; margin-bottom: 8px !important;
  font-size: 13px !important; font-weight: 600 !important; line-height: 1.3 !important;
}
body.single-product .vtux-dp-banner--ok   { background: #f3f4f6 !important; color: #374151 !important; }
body.single-product .vtux-dp-banner--ok > svg { color: #16a34a !important; }
body.single-product .vtux-dp-banner--hint { background: #f3f4f6 !important; color: #4b5563 !important; font-weight: 500 !important; }
body.single-product .vtux-dp-banner svg { flex: 0 0 auto !important; }
body.single-product .vtux-dp-banner-text { display: flex !important; flex-direction: column !important; gap: 2px !important; min-width: 0 !important; }
body.single-product .vtux-dp-banner-sub { font-size: 12px !important; font-weight: 500 !important; opacity: .9; }
body.single-product .vtux-dp-banner a { color: inherit !important; text-decoration: underline !important; text-underline-offset: 2px !important; text-decoration-thickness: 1px !important; font-weight: 600 !important; }
body.single-product .vtux-dp-banner a:hover { opacity: .8; }
body.single-product .vtux-dp-banner a.vtux-dp-banner-link { display: inline !important; visibility: visible !important; opacity: 1 !important; font-size: inherit !important; width: auto !important; height: auto !important; position: static !important; }
body.single-product .vtux-dp-banner { flex-wrap: wrap !important; }
body.single-product .vtux-dp-banner .vtux-dp-banner-text { flex: 1 1 160px !important; }

/* бейдж рівня — кольори за рівнем (v5.15.18) */
body.single-product .vtux-tier-badge {
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
  padding: 4px 10px !important; border-radius: 999px !important; margin-left: auto !important;
  font-size: 12px !important; font-weight: 700 !important; line-height: 1.2 !important; white-space: nowrap !important;
  text-decoration: none !important; border: 1px solid transparent !important; opacity: 1 !important;
}
body.single-product .vtux-tier-badge svg { flex: 0 0 auto !important; }
body.single-product .vtux-tier--base     { background: #f3f4f6 !important; color: #4b5563 !important; border-color: #e5e7eb !important; }
body.single-product .vtux-tier--silver   { background: #eef2f7 !important; color: #475569 !important; border-color: #cbd5e1 !important; }
body.single-product .vtux-tier--gold     { background: #fef3c7 !important; color: #92400e !important; border-color: #fcd34d !important; }
body.single-product .vtux-tier--platinum { background: #e0e7ff !important; color: #3730a3 !important; border-color: #c7d2fe !important; }
body.single-product .vtux-tier--diamond  { background: #cffafe !important; color: #0e7490 !important; border-color: #a5f3fc !important; }
body.single-product .vtux-dp-banner a.vtux-tier-badge { text-decoration: none !important; }

/* банер у кольорі рівня покупця (тільки коли умова виконана) */
body.single-product .vtux-dp-banner--ok.vtux-dp-banner--tier-base     { background: #f3f4f6 !important; color: #374151 !important; }
body.single-product .vtux-dp-banner--ok.vtux-dp-banner--tier-silver   { background: #eef2f7 !important; color: #334155 !important; }
body.single-product .vtux-dp-banner--ok.vtux-dp-banner--tier-gold     { background: #fef3c7 !important; color: #92400e !important; }
body.single-product .vtux-dp-banner--ok.vtux-dp-banner--tier-platinum { background: #e0e7ff !important; color: #3730a3 !important; }
body.single-product .vtux-dp-banner--ok.vtux-dp-banner--tier-diamond  { background: #cffafe !important; color: #0e7490 !important; }
/* бейдж на однотонному банері — білий, щоб читався */
body.single-product .vtux-dp-banner--ok[class*="vtux-dp-banner--tier-"] .vtux-tier-badge { background: #fff !important; border-color: rgba(0,0,0,.06) !important; }

/* перки та прогрес рівня */
body.single-product .vtux-tier-box { display: flex !important; flex-direction: column !important; gap: 6px !important; padding: 0 2px 10px !important; }
body.single-product .vtux-tier-perks { font-size: 12.5px !important; color: #374151 !important; line-height: 1.4 !important; }
body.single-product .vtux-tier-progress { display: flex !important; align-items: center !important; gap: 10px !important; }
body.single-product .vtux-tier-bar { flex: 1 1 auto !important; height: 6px !important; border-radius: 999px !important; background: #e5e7eb !important; overflow: hidden !important; display: block !important; }
body.single-product .vtux-tier-bar i { display: block !important; height: 100% !important; border-radius: 999px !important; background: #6b7280 !important; }
body.single-product .vtux-tier-box--silver   .vtux-tier-bar i { background: #64748b !important; }
body.single-product .vtux-tier-box--gold     .vtux-tier-bar i { background: #d97706 !important; }
body.single-product .vtux-tier-box--platinum .vtux-tier-bar i { background: #4f46e5 !important; }
body.single-product .vtux-tier-box--diamond  .vtux-tier-bar i { background: #0891b2 !important; }
body.single-product .vtux-tier-progress-text { flex: 0 0 auto !important; font-size: 12px !important; color: #6b7280 !important; white-space: nowrap !important; }

/* перевізники */
body.single-product .vtux-dp-carrier { display: flex !important; align-items: flex-start !important; gap: 10px !important; padding: 9px 0 !important; border-top: 1px solid #f1f5f9 !important; }
body.single-product .vtux-dp-carrier-body { flex: 1 1 auto !important; min-width: 0 !important; }
body.single-product .vtux-dp-carrier-name { font-size: 14px !important; font-weight: 600 !important; color: #111827 !important; line-height: 1.3 !important; }
body.single-product .vtux-dp-carrier-days { font-size: 12px !important; font-weight: 400 !important; color: #6b7280 !important; }
body.single-product .vtux-dp-chips { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 6px !important; }
body.single-product .vtux-dp-chip {
  display: inline-flex !important; align-items: center !important; padding: 3px 9px !important; border-radius: 999px !important;
  background: #f3f4f6 !important; color: #4b5563 !important; border: 1px solid #e5e7eb !important;
  font-size: 12px !important; font-weight: 500 !important; line-height: 1.3 !important; white-space: nowrap !important;
}
body.single-product .vtux-dp-chip--free { background: #dcfce7 !important; color: #15803d !important; border-color: #bbf7d0 !important; font-weight: 600 !important; }

/* плитки */
body.single-product .vtux-dp-v2 .vtux-dp-icon { width: 36px !important; height: 36px !important; flex: 0 0 36px !important; border-radius: 10px !important; display: flex !important; align-items: center !important; justify-content: center !important; }
body.single-product .vtux-dp-v2 .vtux-dp-icon svg { width: 20px !important; height: 20px !important; }
body.single-product .vtux-dp-v2 .vtux-tone-np     { background: #e52620 !important; color: #fff !important; }
body.single-product .vtux-dp-v2 .vtux-tone-up     { background: #ffd100 !important; color: #1a1a1a !important; }
body.single-product .vtux-dp-v2 .vtux-tone-card   { background: #eef2ff !important; color: #2563eb !important; }
body.single-product .vtux-dp-v2 .vtux-tone-crypto { background: #fff7ed !important; color: #ea580c !important; }
body.single-product .vtux-dp-v2 .vtux-tone-cash   { background: #ecfdf5 !important; color: #16a34a !important; }
body.single-product .vtux-dp-v2 .vtux-tone-bank   { background: #f5f3ff !important; color: #7c3aed !important; }

/* оплата */
body.single-product .vtux-dp-pay-list { display: flex !important; flex-direction: column !important; gap: 8px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
body.single-product .vtux-dp-v2 .vtux-dp-row { display: flex !important; align-items: center !important; gap: 10px !important; }
body.single-product .vtux-dp-v2 .vtux-dp-info { display: flex !important; flex-direction: column !important; gap: 1px !important; min-width: 0 !important; }
body.single-product .vtux-dp-v2 .vtux-dp-label { font-size: 13.5px !important; font-weight: 600 !important; color: #111827 !important; white-space: normal !important; line-height: 1.25 !important; }
body.single-product .vtux-dp-v2 .vtux-dp-meta  { font-size: 12px !important; color: #6b7280 !important; line-height: 1.3 !important; }
body.single-product .vtux-dp-minis { display: none !important; margin-left: auto !important; gap: 6px !important; }
body.single-product .vtux-dp-mini  { width: 26px !important; height: 26px !important; border-radius: 8px !important; display: flex !important; align-items: center !important; justify-content: center !important; }
body.single-product .vtux-dp-mini svg { width: 15px !important; height: 15px !important; }
body.single-product .vtux-dp-chevron { display: none !important; color: #9ca3af !important; transition: transform .2s ease !important; }
body.single-product .vtux-dp-pay-summary { display: none !important; font-size: 12px !important; color: #6b7280 !important; margin-top: -4px !important; text-align: center !important; }
body.single-product .vtux-dp-pay-list { width: max-content !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; }

@media (max-width: 767.98px) {
  body.single-product .vtux-dp-v2 { grid-template-columns: 1fr !important; gap: 8px !important; }
  body.single-product .vtux-dp-pay-toggle { cursor: pointer !important; margin-bottom: 6px !important; -webkit-tap-highlight-color: transparent; }
  body.single-product .vtux-dp-minis, body.single-product .vtux-dp-chevron { display: flex !important; }
  body.single-product .vtux-dp-pay-summary { display: block !important; }
  body.single-product .vtux-dp-pay-list { display: none !important; }
  body.single-product .vtux-dp-col--pay.is-open .vtux-dp-pay-list { display: flex !important; margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid #f1f5f9 !important; }
  body.single-product .vtux-dp-col--pay.is-open .vtux-dp-pay-summary { display: none !important; }
  body.single-product .vtux-dp-col--pay.is-open .vtux-dp-chevron { transform: rotate(180deg) !important; }
}

/* Стара ціна (v5.15.26): закреслення малюємо власною лінією рівно по
   центру блоку. text-decoration тут ненадійний: <del> дрібний, а ціна в
   ньому крупна — лінія «злітала» до верху цифр; плюс дубль від WPCode. */
.woocommerce .price del,
.woocommerce ul.products li.product .price del,
.woocommerce div.product .price del,
.vtux-product-card-old,
.vtux-rel-card-old,
.vtux-bundle-old {
  position: relative !important;
  display: inline-block !important;
  text-decoration: none !important;
  color: #94a3b8 !important;
  line-height: 1.15 !important;
}
.woocommerce .price del *,
.woocommerce ul.products li.product .price del *,
.woocommerce div.product .price del *,
.vtux-product-card-old *,
.vtux-rel-card-old *,
.vtux-bundle-old * { text-decoration: none !important; color: inherit !important; }
.woocommerce .price del::before,
.woocommerce ul.products li.product .price del::before,
.woocommerce div.product .price del::before,
.vtux-product-card-old::before,
.vtux-rel-card-old::before,
.vtux-bundle-old::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: -3px !important; right: -3px !important;
  top: 50% !important;
  height: 2px !important;
  margin-top: -1px !important;
  background: #9ca3af !important;
  border-radius: 2px !important;
  pointer-events: none !important;
}
.woocommerce .price del::after,
.woocommerce .price del *::before,
.woocommerce .price del *::after,
.vtux-product-card-old::after,
.vtux-rel-card-old::after,
.vtux-bundle-old::after { content: none !important; display: none !important; }

/* Заголовок «Вам також може сподобатись» — іконка, як в інших блоках (v5.15.27) */
.vtux-related-title { display: flex !important; align-items: center !important; gap: 8px !important; }
.vtux-related-ico { font-size: .95em; line-height: 1; flex: 0 0 auto; }

/* Страховка: якщо тема/кеш все ж віддасть sticky add-to-cart Storefront */
.storefront-sticky-add-to-cart { display: none !important; }
.site-info a[href*="woocommerce.com"],
.site-info a[href*="woocommerce"],
.site-info .sep,
.site-info br { display: none !important; }
@media (min-width: 960px) {
  .site-info { padding-bottom: 22px !important; }
  .vtux-footer-links,
  .site-footer nav.vtux-footer-links { padding: 16px 16px 12px !important; gap: 8px !important; }
  .vtux-footer-cats-wrap { padding: 24px 16px 28px !important; }
  .vtux-footer-cats,
  .site-footer nav.vtux-footer-cats { gap: 8px 10px !important; }
}
@media (max-width: 359.98px) {
  .vtux-footer-link,
  .site-footer a.vtux-footer-link,
  #colophon a.vtux-footer-link { font-size: 11px !important; padding: 5px 9px !important; }
  .vtux-footer-cats a,
  #colophon .vtux-footer-cats a { font-size: 12.5px !important; padding: 6px 11px !important; }
}

#vt-minicart,
#vthf-panel,
#vt-autocomplete,
.dgwt-wcas-suggestions-wrapp,
#vt-account-drawer {
  font-family: var(--vt-font);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 2px solid #f26522;
  outline-offset: 2px;
}


/* ── Desktop header tools (v5.15.0) ─────────────────────────────── */

#vtux-desk-tools {
  display: none;
}

@media (min-width: 960px) {
  #vtux-desk-tools.vtux-desk-mounted {
    display: flex !important;
    align-items: center;
    gap: 8px;
    order: 6;
    flex: 0 0 auto;
    margin-left: auto;
  }

  .vtux-desk-catalog {
    order: 2;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 14px;
    border-radius: 12px;
    border: 1px solid rgba(17,24,39,.10);
    background: #111827 !important;
    color: #fff !important;
    font-family: var(--vt-font);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: none;
  }
  #vtux-desk-tools .vtux-desk-catalog { order: 0; }
  /* catalog is first child — but we want it near logo. Move via JS? 
     Keep in tools group on the right for stability. Catalog left of search
     requires it to live outside tools. JS could prepend catalog to col-full. */

  /* .vtux-desk-phone видалено у v5.17.0 — телефон тепер один компонент
     #vt-phone-block (includes/12-header-contacts.php), який сам показує
     потрібний вигляд на кожному брейкпоінті. */

  .vtux-desk-ico {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 52px;
    height: 44px;
    padding: 0 6px;
    color: #111827 !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    cursor: pointer;
    font-family: var(--vt-font);
  }
  .vtux-desk-ico-l {
    font-size: 10px;
    font-weight: 500;
    color: #6b7280;
    line-height: 1;
  }
  .vtux-desk-badge {
    position: absolute;
    top: 0;
    right: 6px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: #f26522;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    display: none;
  }
  .vtux-desk-badge.show { display: inline-block; }

  #vt-account-mini { order: 7; }
  .site-header-cart { order: 8; }
  #vtux-lang-switcher { order: 9; }
}

@media (max-width: 959.98px) {
  #vtux-desk-tools,
  .vtux-desk-catalog,
  .vtux-desk-ico { display: none !important; }
}

@media (min-width: 960px) and (max-width: 1199.98px) {
  .vtux-desk-ico-l { display: none; }
  .vtux-desk-catalog span { display: none; }
  .vtux-desk-catalog { padding: 0 10px; }
}


/* Рейтинг: окремий рядок під назвою, над ціною */
.woocommerce ul.products li.product .star-rating,
ul.products li.product .star-rating,
ul.products li.product .vt-card-rating {
  display: block !important;
  float: none !important;
  clear: both !important;
  position: static !important;
  margin: 6px 6px 0 !important;
  width: 5.2em !important;
  height: 1em !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

ul.products li.product .woocommerce-loop-product__title::after {
  content: "★★★★★";
  display: block;
  margin-top: 6px;
  color: #d1d5db;
  font-size: 12px;
  letter-spacing: 1px;
  font-weight: 400;
  line-height: 1;
}
ul.products li.product:has(.star-rating) .woocommerce-loop-product__title::after,
ul.products li.product:has(.vt-card-rating) .woocommerce-loop-product__title::after {
  content: none;
}

/* Пошук у каталозі = 1:1 як мобільний пошук на головній
   (#vtux-msearch .vtux-msearch-form у цьому ж файлі вище):
   сіре поле r16, темно-синя кнопка «Знайти». v5.15.28. */
#vt-catalog-drawer .vt-cd-search {
  position: relative !important;
  z-index: 3 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
  background: #f3f4f6 !important;
  border: 1px solid transparent !important;
  border-radius: 16px !important;
  min-height: 48px !important;
  height: auto !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 4px 4px 4px 14px !important;
  margin: 0 16px 12px !important;
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
}
#vt-catalog-drawer .vt-cd-search:focus-within {
  background: #fff !important;
  border-color: #111827 !important;
  box-shadow: 0 0 0 3px rgba(17,24,39,.06) !important;
}
#vt-catalog-drawer .vt-cd-search-icon svg { width: 22px; height: 22px; }
#vt-catalog-drawer .vt-cd-search-icon {
  position: static !important;
  transform: none !important;
  display: flex !important;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  color: #8b93a1;
  background: none !important;
  font-size: 0 !important;
  pointer-events: none;
}
#vt-cd-search-input,
#vt-catalog-drawer #vt-cd-search-input {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 40px !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  font-family: var(--vt-font) !important;
  font-size: 15px !important;
  color: #111827 !important;
}
#vt-cd-search-input:focus,
#vt-cd-search-input:focus-visible,
#vt-catalog-drawer #vt-cd-search-input:focus,
#vt-catalog-drawer #vt-cd-search-input:focus-visible {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}
#vt-catalog-drawer .vt-cd-search-go {
  flex-shrink: 0 !important;
  height: 40px !important;
  padding: 0 16px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #111827 !important;
  color: #fff !important;
  font-family: var(--vt-font) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  cursor: pointer;
  box-shadow: none !important;
  transition: transform .15s, filter .15s;
}
#vt-catalog-drawer .vt-cd-search-go:active { filter: brightness(1.2); transform: scale(.97); }
#vt-catalog-drawer .vt-cd-header-meta,
#vt-catalog-drawer .vt-cd-quicklinks {
  display: none !important;
}

.vt-cd-sidebar-icon,
.vt-cd-sidebar-icon-emoji,
.vt-cd-subcat-emoji {
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 0 !important;
  color: transparent !important;
  overflow: hidden;
}
.vt-cd-sidebar-icon svg,
.vt-cd-subcat-emoji svg,
.vt-cd-no-sub-icon svg {
  width: 24px !important;
  height: 24px !important;
  stroke: #374151 !important;
  display: block !important;
}

/* v5.15.28: кнопки карток — строго один рядок. Раніше при збільшеному
   шрифті (a11y) «+» із ::after переносився на другий рядок і кнопка
   роздувалась удвічі. Зелена «Перейти в кошик» (.vtux-in-cart) — та сама
   геометрія, відрізняється лише кольором. */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.woocommerce-page ul.products li.product .add_to_cart_button,
.woocommerce ul.products li.product .add_to_cart_button.vtux-in-cart,
.woocommerce ul.products li.product .button.vtux-in-cart {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  overflow: hidden !important;
}
/* Фіксована висота — лише мобільний; на десктопі лишаються 54/56px із core */
@media (max-width: 959.98px) {
  .woocommerce ul.products li.product .button,
  .woocommerce ul.products li.product .add_to_cart_button,
  .woocommerce-page ul.products li.product .button,
  .woocommerce-page ul.products li.product .add_to_cart_button {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
  }
}
.woocommerce ul.products li.product .add_to_cart_button::after {
  margin-left: 6px !important;
  flex-shrink: 0 !important;
}
/* Якщо текст усе одно не вміщується (дуже великий a11y-шрифт) —
   ховаємо «+», текст важливіший */
@media (max-width: 379px) {
  .woocommerce ul.products li.product .add_to_cart_button::after { content: none !important; }
}

/* v5.15.28: службова плашка порожнього блоку (лише для менеджерів) —
   один тонкий рядок замість двоекранної заглушки */
.vtux-block-empty--slim{
  padding:8px 14px !important;
  margin:6px 0 !important;
  border:1px dashed #d1d5db !important;
  border-radius:10px !important;
  background:#fafafa !important;
  color:#9ca3af !important;
  font-size:12px !important;
  text-align:center !important;
  line-height:1.4 !important;
}
.vtux-block-empty--slim small{font-size:11px;color:#c2c7cf}

/* v5.15.28: прибираємо зайві вертикальні розриви на мобільному:
   між шапкою/пошуком і першим блоком контенту */
@media (max-width: 959.98px) {
  #vtux-msearch.vtux-ms-mounted { padding-bottom: 8px !important; }
  #vtux-msearch.vtux-ms-mounted + * { margin-top: 0 !important; }
  .vthf-wrap { margin-top: 8px !important; }
}

/* v5.15.28: окрема плашка «Залишилось N шт.» на сторінці товару прихована —
   залишок тепер усередині бейджа «В наявності» (див. vtux_stock_status) */
body.single-product .summary .vtux-urgency-stock,
body.single-product .vtux-product-status-row ~ .vtux-urgency-stock,
body.single-product .entry-summary .vtux-urgency-stock { display: none !important; }

/* v5.15.28: вбудований логотип — адаптивні розміри для всіх пристроїв.
   Пропорція файлу 4.33:1; висота по брейкпоінтах:
   телефон 40px · планшет 44px · ноутбук 50px · десктоп 54px · ТВ 60px.
   Селектори з #masthead — щоб перебити ID-правило критичного inline-CSS. */
img.vtux-bundled-logo,
#masthead img.vtux-bundled-logo,
.site-header img.vtux-bundled-logo,
.site-branding img.vtux-bundled-logo{
  display:block !important;
  height:40px !important; width:auto !important;
  max-height:none !important;
  max-width:200px !important; object-fit:contain !important;
}
/* планшет */
@media (min-width: 768px){
  img.vtux-bundled-logo,
  #masthead img.vtux-bundled-logo,
  .site-header img.vtux-bundled-logo{ height:44px !important; max-width:220px !important; }
}
/* ноутбук */
@media (min-width: 1200px){
  img.vtux-bundled-logo,
  #masthead img.vtux-bundled-logo,
  .site-header img.vtux-bundled-logo{ height:50px !important; max-width:250px !important; }
}
/* великий десктоп */
@media (min-width: 1600px){
  img.vtux-bundled-logo,
  #masthead img.vtux-bundled-logo,
  .site-header img.vtux-bundled-logo{ height:54px !important; max-width:270px !important; }
}
/* ТВ / 4K */
@media (min-width: 1920px){
  img.vtux-bundled-logo,
  #masthead img.vtux-bundled-logo,
  .site-header img.vtux-bundled-logo{ height:60px !important; max-width:300px !important; }
}
html.dark img.vtux-bundled-logo{ filter: brightness(1.08); }

/* v5.15.28: службове посилання WC «Переглянути кошик» на картках приховане
   назавжди — його роль виконує кнопка «✓ Додано» (відкриває міні-кошик) */
.woocommerce ul.products li.product a.added_to_cart,
.woocommerce-page ul.products li.product a.added_to_cart,
ul.products li.product a.added_to_cart.wc-forward {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  pointer-events: none !important;
}