/* VTUX 5.9.12 — шапка flex, без лишних рядов grid */

#masthead img.custom-logo,
#masthead .custom-logo-link img,
.site-header img.custom-logo,
.site-header .site-branding img,
.site-branding .custom-logo {
  max-height: clamp(38px, 6vw, 48px) !important;
  width: auto !important;
  height: auto !important;
  max-width: 210px !important;
  object-fit: contain !important;
}

@media (max-width: 959.98px) {
  body #masthead .main-navigation,
  body .site-header .main-navigation,
  body .storefront-primary-navigation,
  body #masthead .menu-toggle,
  body .main-navigation ul.menu,
  body #vt-search-desktop,
  body #vt-search-cat-dropdown,
  body #vt-search-cat-wrap {
    display: none !important;
    visibility: hidden !important;
  }
  body #masthead .col-full,
  body .site-header .col-full {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    min-height: 64px !important;
  }
}

@media (min-width: 960px) {
  body #masthead,
  body header.site-header { position: sticky; top: 0; z-index: 1000; background: #fff; contain: paint; transform: translateZ(0); }
  body #masthead .col-full,
  body .site-header .col-full {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 10px 14px !important;
    min-height: 72px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
  body .site-header .site-branding { order: 1; flex: 0 0 auto; margin: 0 !important; }
  body #vt-search-desktop {
    order: 2;
    display: flex !important;
    flex: 1 1 auto !important;
    min-width: 200px !important;
    max-width: 640px !important;
    margin: 0 !important;
    position: relative !important;
    top: auto !important; right: auto !important; left: auto !important;
  }
  body .site-header .main-navigation { order: 3; flex: 0 1 auto; }
  /* v5.17.4 — узгоджено з vt-modern.css (order 7/8/9), інакше
     специфічність "body #selector" в цьому файлі перебивала порядок
     з vt-modern.css і значок кабінету/кошика "стрибав" залежно від
     того, який стиль підвантажився останнім. */
  body #vt-account-mini { order: 7; flex: 0 0 auto; }
  body .site-header-cart { order: 8; flex: 0 0 auto; margin: 0 !important; }
  body #vtux-lang-switcher {
    order: 9;
    flex: 0 0 auto;
    position: relative !important;
    top: auto !important; right: auto !important;
    visibility: visible !important;
    margin: 0 !important;
  }
  body #masthead .menu-toggle,
  body .handheld-navigation { display: none !important; }

  body .site-header .main-navigation ul.menu,
  body .site-header .main-navigation ul.nav-menu {
    display: flex !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
  }
  body .site-header .main-navigation ul.menu > li { float: none !important; margin: 0 !important; }
  body .site-header .main-navigation ul.menu > li > a {
    white-space: nowrap !important;
    padding: 8px 10px !important;
  }
  body .vtux-header-hide { display: none !important; }
  body #vtux-lang-switcher:not(.vtux-lang-mounted) { visibility: hidden !important; }
  body:has(#vtux-lang-switcher) .site-header .wpml-ls,
  body:has(#vtux-lang-switcher) .site-header .widget_polylang {
    display: none !important;
  }

  .vtux-pc-grid {
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    overflow: visible !important;
    gap: 10px !important;
  }
  .vtux-pc-card { min-width: 0 !important; max-width: none !important; }
}
@media (min-width: 1366px) {
  .vtux-pc-grid { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
}
@media (min-width: 1600px) {
  .vtux-pc-grid { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
}