/* Каталог: кнопка в шапке + мега-меню (desktop) + offcanvas (mobile) — extension/vmenu 1.1.0 */
.vmenu-searchbar { display: flex; align-items: flex-start; gap: .5rem; }
.vmenu-search { flex: 1 1 auto; min-width: 0; }
.vmenu-catalog-btn { flex: 0 0 auto; display: inline-flex; align-items: center; gap: .5rem; margin-bottom: 1rem; font-weight: 600; white-space: nowrap; }
.vmenu-catalog-btn .fa-bars { transition: transform .2s ease; }
.vmenu-catalog-btn.is-open .fa-bars { transform: rotate(90deg); }
#top { position: relative; z-index: 1026; }
header { position: relative; z-index: 1025; }
main { position: relative; }
.vmenu-mega-wrap { position: relative; height: 0; z-index: 1030; }
.vmenu-mega { position: absolute; top: 0; left: calc(var(--bs-gutter-x, 1.5rem) * .5); right: calc(var(--bs-gutter-x, 1.5rem) * .5); display: flex; height: min(74vh, 640px); background: var(--bs-body-bg, #fff); border-radius: 0 0 .75rem .75rem; box-shadow: 0 12px 32px rgba(0, 0, 0, .18); overflow: hidden; }
.vmenu-mega[hidden] { display: none; }
.vmenu-backdrop { position: fixed; inset: 0; z-index: 1020; background: rgba(0, 0, 0, .35); }
.vmenu-backdrop[hidden] { display: none; }
.vmenu-mega-left { flex: 0 0 290px; margin: 0; padding: .5rem 0; list-style: none; overflow-y: auto; background: var(--bs-tertiary-bg, #f6f7f9); border-right: 1px solid var(--bs-border-color, #dee2e6); }
.vmenu-mega-top { display: flex; align-items: center; padding: 0 .75rem 0 0; cursor: pointer; }
.vmenu-mega-top > a { flex: 1 1 auto; min-width: 0; padding: .55rem .5rem .55rem 1rem; color: var(--bs-body-color, #212529); text-decoration: none; line-height: 1.25; }
.vmenu-mega-top > i { font-size: .7em; color: var(--bs-secondary-color, #6c757d); }
.vmenu-mega-top.is-active { background: var(--bs-body-bg, #fff); }
.vmenu-mega-top.is-active > a, .vmenu-mega-top.is-active > i { color: var(--bs-primary); }
.vmenu-mega-top.is-branch > a { font-weight: 600; }
.vmenu-mega-right { flex: 1 1 auto; min-width: 0; overflow-y: auto; padding: 1rem 1.5rem 1.5rem; overscroll-behavior: contain; }
.vmenu-mega-left { overscroll-behavior: contain; }
.vmenu-pane[hidden] { display: none; }
.vmenu-pane-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .6rem; margin-bottom: 1rem; padding-bottom: .6rem; border-bottom: 1px solid var(--bs-border-color, #dee2e6); }
.vmenu-pane-head > a:first-child { font-size: 1.35rem; font-weight: 700; color: var(--bs-body-color, #212529); text-decoration: none; }
.vmenu-pane-head > a:first-child:hover { color: var(--bs-primary); }
.vmenu-pane-all { margin-left: auto; font-size: .9rem; text-decoration: none; }
.vmenu-pane-cols { column-count: 3; column-gap: 2rem; }
@media (min-width: 1400px) { .vmenu-pane-cols { column-count: 4; } }
.vmenu-group { break-inside: avoid; margin-bottom: 1rem; }
.vmenu-group-title { display: block; font-weight: 700; color: var(--bs-body-color, #212529); text-decoration: none; line-height: 1.25; margin-bottom: .3rem; }
.vmenu-group ul { list-style: none; margin: 0; padding: 0; }
.vmenu-group li a { display: block; padding: .15rem 0; color: var(--bs-secondary-color, #555); text-decoration: none; font-size: .92rem; line-height: 1.3; }
.vmenu-group a:hover, .vmenu-group a.is-active { color: var(--bs-primary); }
.vmenu-mega .vmenu-count, .vmenu-offcanvas .vmenu-count { color: var(--bs-secondary-color, #8a9199); font-weight: 400; font-size: .8em; white-space: nowrap; }
.vmenu-mega .vmenu-count::before, .vmenu-offcanvas .vmenu-count::before { content: "\00a0"; }
/* Offcanvas accordion (mobile) */
.vmenu-offcanvas { --bs-offcanvas-width: min(92vw, 420px); }
.vmenu-offcanvas .offcanvas-title .fa-bars { margin-right: .35rem; color: var(--bs-primary); }
.vmenu-offcanvas .vmenu-list, .vmenu-offcanvas .vmenu-sub { list-style: none; margin: 0; padding: 0; }
.vmenu-offcanvas .vmenu-row { display: flex; align-items: stretch; border-top: 1px solid var(--bs-border-color-translucent, rgba(0, 0, 0, .1)); }
.vmenu-offcanvas .vmenu-link { flex: 1 1 auto; min-width: 0; padding: .7rem 1rem; color: var(--bs-body-color, #212529); text-decoration: none; line-height: 1.3; overflow-wrap: anywhere; }
.vmenu-offcanvas .vmenu-l1 > .vmenu-row > .vmenu-link { font-weight: 600; }
.vmenu-offcanvas .vmenu-l2 > .vmenu-row > .vmenu-link { padding-left: 1.75rem; }
.vmenu-offcanvas .vmenu-l3 > .vmenu-row > .vmenu-link { padding-left: 2.5rem; font-size: .95em; }
.vmenu-offcanvas .vmenu-l4 > .vmenu-row > .vmenu-link, .vmenu-offcanvas .vmenu-l5 > .vmenu-row > .vmenu-link { padding-left: 3.2rem; font-size: .92em; }
.vmenu-offcanvas .vmenu-sub { background: var(--bs-tertiary-bg, #f8f9fa); }
.vmenu-offcanvas .vmenu-toggle { flex: 0 0 3.25rem; display: flex; align-items: center; justify-content: center; padding: 0; border: 0; border-left: 1px solid rgba(0, 0, 0, .06); background: transparent; color: var(--bs-secondary-color, #6c757d); }
.vmenu-offcanvas .vmenu-toggle i { transition: transform .2s ease; font-size: .85em; }
.vmenu-offcanvas .vmenu-toggle.collapsed i { transform: rotate(-90deg); }
.vmenu-offcanvas .vmenu-item.is-active > .vmenu-row > .vmenu-link { color: var(--bs-primary); }
.vmenu-offcanvas .vmenu-item.is-current > .vmenu-row { background: var(--bs-primary); }
.vmenu-offcanvas .vmenu-item.is-current > .vmenu-row > * , .vmenu-offcanvas .vmenu-item.is-current .vmenu-row .vmenu-count { color: #fff; }
@media (max-width: 991.98px) { .vmenu-mega, .vmenu-backdrop { display: none !important; } }
@media (max-width: 359.98px) { .vmenu-catalog-btn span { display: none; } .vmenu-catalog-btn { padding-left: .9rem; padding-right: .9rem; } }
/* Товары как на Ozon: 4 в ряд на >=1200, 3 на >=992, 2 на планшете/телефоне (только режим «Сетка») */
#product-list.row:not(.product-list) > *, #content .row.row-cols-md-3.row-cols-xl-4 > * { flex: 0 0 auto; width: 50%; }
@media (min-width: 992px) { #product-list.row:not(.product-list) > *, #content .row.row-cols-md-3.row-cols-xl-4 > * { width: 33.33333333%; } }
@media (min-width: 1200px) { #product-list.row:not(.product-list) > *, #content .row.row-cols-md-3.row-cols-xl-4 > * { width: 25%; } }
@media (max-width: 575.98px) {
  #product-list.row:not(.product-list), #content .row.row-cols-md-3.row-cols-xl-4 { --bs-gutter-x: .75rem; }
  #product-list.row:not(.product-list) .product-thumb h4, #content .row.row-cols-md-3.row-cols-xl-4 .product-thumb h4 { font-size: .95rem; }
}