/**
 * Mobile overrides — мобильный UX каталога/архива (<1024px).
 * Слой B: грузится после bike-main, busting по filemtime, без сборки Vite.
 * Цель: товары сразу под чипами; фильтры/сортировка — в липком баре + bottom-sheet;
 * дерево категорий уезжает под товары; тач-таргеты ≥44px.
 * @package 4Bike
 */

/* Анти-люфт по горизонтали (совет GPT): clip (НЕ hidden) режет любой остаточный document-overflow
   и не ломает position:fixed/sticky в современном Chrome; overscroll-behavior-x гасит горизонтальный
   overscroll и краевой жест «Назад» (ColorOS/OnePlus), из-за которого страница «гуляет» вбок даже без
   реального переполнения. Вложенные overflow-x:auto скроллеры (чипсы главной) этим НЕ ломаются. */
html { overflow-x: clip; overscroll-behavior-x: none; }
body { overflow-x: clip; }

/* ====================== MOBILE (<1024px) ====================== */
@media (max-width: 1023.98px) {

  /* 1. Порядок: товары+фильтры ВЫШЕ дерева категорий */
  .bike-archive-layout { display: flex; flex-direction: column; gap: 6px; }
  .bike-archive-main    { order: 1; min-width: 0; }
  .bike-archive-sidebar { order: 2; position: static !important; max-height: none !important; overflow: visible !important; }
  /* рекомендации сайдбара на мобиле прячем (длинно), дерево категорий оставляем внизу */
  .bike-archive-sidebar .bike-sidebar-recommendations { display: none; }

  /* 2. Липкий бар: Сортировка | Фильтры (тулбар) */
  .bike-archive-controls { position: relative; }
  .bike-archive-toolbar {
    position: sticky; top: 56px; z-index: 30;
    display: flex; gap: 6px; align-items: stretch;
    background: #FCFCFD; padding: 6px 0;
  }
  .bike-archive-toolbar__filter-btn {
    order: 1; flex: 1 1 50%;
    display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
    min-height: 46px; padding: .5rem 1rem;
    border: 1px solid #CFCFD2; border-radius: 12px; background: #fff;
    font-weight: 600; color: #1F2023; cursor: pointer;
  }
  .bike-archive-toolbar__filter-btn:active { background: #F5F5F7; }
  .bike-archive-toolbar__sort-form { order: 2; flex: 1 1 50%; display: flex; }
  .bike-archive-toolbar__sort-form .bike-hfilters__group { width: 100%; }
  .bike-archive-toolbar__sort-form .bike-hfilters__btn {
    width: 100%; min-height: 46px; justify-content: space-between;
    border: 1px solid #CFCFD2; border-radius: 12px; background: #fff; padding: .5rem 1rem;
  }
  /* бейдж количества активных фильтров на кнопке */
  .bike-archive-toolbar__filter-btn .bike-mf-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 20px; height: 20px; padding: 0 6px; margin-left: .15rem;
    background: #E22A1C; color: #fff; border-radius: 9999px; font-size: .75rem; font-weight: 700;
  }

  /* 3. hfilters скрыт, открывается как bottom-sheet */
  .bike-hfilters { display: none; }
  .bike-mf-backdrop { position: fixed; inset: 0; z-index: 55; background: rgba(11,13,18,.45); }
  .bike-archive-controls.mf-open .bike-hfilters {
    /* T10 (2026-06-23): flex-колонка → форма скроллится внутри, футер «сбросить/применить» в потоке внизу
       (раньше footer был position:fixed, а transform-анимация шторки ломала fixed → кнопки уезжали за экран) */
    display: flex; flex-direction: column; position: fixed; left: 0; right: 0; bottom: 0; top: 8vh; z-index: 60;
    background: #fff; border-radius: 18px 18px 0 0; box-shadow: 0 -10px 34px rgba(11,13,18,.20);
    overflow: hidden; -webkit-overflow-scrolling: touch;
    animation: bike-sheet-up .28s cubic-bezier(0.16,1,0.3,1);
  }
  /* drag-handle — аффорданс «потяни/закрой» */
  .bike-archive-controls.mf-open .bike-hfilters::before {
    content: ''; display: block; width: 40px; height: 4px; border-radius: 2px;
    background: #CFCFD2; margin: 8px auto 0;
  }
  @keyframes bike-sheet-up { from { transform: translateY(100%); } to { transform: translateY(0); } }

  /* шапка шторки */
  .bike-hfilters__sheet-head {
    position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1rem .75rem; background: #fff; border-bottom: 1px solid #EAEBEC;
  }
  .bike-hfilters__sheet-title { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.05rem; color: #0B0D12; }
  .bike-hfilters__close {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border: 0; background: #F5F5F7; border-radius: 9999px; cursor: pointer; color: #1F2023;
  }

  /* содержимое формы: группы аккордеоном (popover'ы раскрыты инлайн) */
  .bike-hfilters__form { display: block !important; flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: .5rem 1rem 1rem; }
  /* десктопная инлайн-ссылка «Сбросить» на мобиле не нужна — есть кнопка в футере (убираем дубль) */
  .bike-archive-controls.mf-open .bike-hfilters__reset { display: none; }
  /* пер-групповые кнопки «Применить» в раскрытых группах на мобиле не нужны — применяет единый футер */
  .bike-archive-controls.mf-open .bike-hfilters__popover .bike-hfilters__apply { display: none; }
  .bike-archive-controls.mf-open .bike-hfilters__group { display: block; border-bottom: 1px solid #EAEBEC; padding: .35rem 0; }
  .bike-archive-controls.mf-open .bike-hfilters__btn {
    width: 100%; min-height: 48px; justify-content: space-between; border: 0; background: transparent;
    font-weight: 600; font-size: 1rem; padding: .5rem 0;
  }
  .bike-archive-controls.mf-open .bike-hfilters__popover {
    display: block !important; position: static !important; box-shadow: none !important;
    border: 0 !important; padding: 0 0 .5rem !important; transform: none !important; opacity: 1 !important;
    max-height: none !important; min-width: 0 !important; width: auto !important;
  }
  .bike-archive-controls.mf-open .bike-hfilters__toggle { min-height: 48px; }

  /* липкий футер шторки «Показать товары» — прямой flex-сосед формы, ВСЕГДА снизу и НИЖЕ списка фильтров.
     align-self:stretch сбрасывает унаследованный от десктопного .bike-hfilters align-items:center,
     иначе футер сжимался по контенту и «Показать товары» был узким (~136px, текст впритык). */
  .bike-hfilters__sheet-foot {
    position: static; flex-shrink: 0; z-index: 61; align-self: stretch; box-sizing: border-box;
    display: flex; gap: .6rem; padding: .8rem 1rem calc(.8rem + env(safe-area-inset-bottom));
    background: #fff; border-top: 1px solid #EAEBEC;
  }
  .bike-hfilters__apply-reset {
    /* <a>-ссылка (не button) → текст сам НЕ центрируется по вертикали, при min-height прижимался к верху.
       inline-flex + center выравнивают как у соседней кнопки. */
    flex: 0 0 auto; min-height: 56px; padding: 0 1.15rem; border: 1px solid #CFCFD2; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center; text-decoration: none;
    background: #fff; color: #1F2023; font-weight: 600; font-size: 1rem; cursor: pointer;
  }
  .bike-hfilters__apply-btn {
    flex: 1; min-height: 56px; border: 0; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #E22A1C; color: #fff; font-weight: 700; font-size: 1.05rem; cursor: pointer;
  }
  .bike-hfilters__apply-btn:active { background: #C2200E; }

  /* 4. Сетка 2 колонки + плотность */
  .bike-archive-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; }

  /* 5. Тач-таргеты: ссылки дерева/чипы крупнее */
  .bike-sidebar-tree a, .bike-subcat-chip, .bike-active-filter-chip { min-height: 40px; }
  .bike-archive-breadcrumbs { white-space: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Тулбар каталога ≤768: симметричные половины «Фильтры» | «Сортировка».
   Кнопка «Фильтры» лежит в обёртке .__left (без flex → жалась по контенту); даём обёртке 50%,
   кнопке — на всю ширину с контентом слева, и треугольник-вниз справа (как у «Сортировки»). */
@media (max-width: 768px) {
  .bike-archive-toolbar__left { flex: 1 1 50%; display: flex; min-width: 0; }
  .bike-archive-toolbar__filter-btn { width: 100%; justify-content: flex-start; }
  .bike-archive-toolbar__filter-btn > span:not(.bike-mf-badge) { margin-right: .1rem; }
  .bike-archive-toolbar__filter-chevron { margin-left: auto; flex-shrink: 0; color: #6c6d72; }
}

/* Планшет (вкл. iPad-портрет 768) + широкий ландшафт-телефон (768–1023): «Фильтры» и «Сортировка»
   50/50 на всю ширину, как на телефоне-портрете (раньше сидели слева, не 50/50). Заказчик 2026-07-13. */
@media (min-width: 768px) and (max-width: 1023px) {
  .bike-archive-controls .bike-archive-toolbar { flex: 1 1 auto !important; width: 100%; gap: 8px; }
  .bike-archive-toolbar__left { flex: 1 1 50%; min-width: 0; display: flex; }
  .bike-archive-toolbar__sort-form { flex: 1 1 50%; min-width: 0; display: flex; }
  .bike-archive-toolbar__filter-btn { width: 100%; justify-content: flex-start; min-height: 42px; }
  .bike-archive-toolbar__filter-btn .bike-archive-toolbar__filter-chevron { margin-left: auto; flex-shrink: 0; }
  .bike-archive-toolbar__sort-form .bike-hfilters__group { width: 100%; }
  .bike-archive-toolbar__sort-form .bike-hfilters__btn { width: 100%; min-height: 42px; justify-content: space-between; }
}

/* Телефон в ЛАНДШАФТЕ: шторка фильтров на всю высоту ВИДИМОГО вьюпорта (dvh),
   чтобы липкий футер с «Показать товары» ВСЕГДА оставался на виду и не уезжал
   под адресную строку/панель браузера. height:100dvh перебивает top:8vh; старые
   браузеры без dvh откатываются на top:0/bottom:0 (полная высота). */
@media (orientation: landscape) and (max-height: 500px) {
  .bike-archive-controls.mf-open .bike-hfilters {
    top: 72px;                      /* ниже фикс-шапки сайта (z-1000, 72px) — заголовок шторки не перекрыт */
    bottom: 0;
    height: calc(100dvh - 72px);    /* низ = видимый край вьюпорта → футер «Показать товары» всегда на виду */
    border-radius: 0;
  }
  .bike-hfilters__sheet-head { padding-top: .55rem; padding-bottom: .55rem; }
  .bike-hfilters__sheet-foot { padding-top: .6rem; padding-bottom: calc(.6rem + env(safe-area-inset-bottom)); }
}

/* ====================== КАРТОЧКА ТОВАРА (mobile) ====================== */
.bike-sticky-atc { display: none; }
@media (max-width: 1023.98px) {
  .bike-breadcrumbs { white-space: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  .bike-sticky-atc {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    display: flex; align-items: center; gap: .75rem;
    padding: .6rem 1rem calc(.6rem + env(safe-area-inset-bottom));
    background: #fff; border-top: 1px solid #EAEBEC; box-shadow: 0 -6px 20px rgba(11,13,18,.10);
  }
  .bike-sticky-atc__price { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.15rem; color: #0B0D12; white-space: nowrap; }
  .bike-sticky-atc__price del { font-weight: 400; font-size: .8rem; color: #9A99A6; margin-right: .25rem; }
  .bike-sticky-atc__price ins { text-decoration: none; }
  .bike-sticky-atc__btn { flex: 1; min-height: 50px; border: 0; border-radius: 12px; background: #E22A1C; color: #fff; font-weight: 700; font-size: 1rem; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
  .bike-sticky-atc__btn:active { background: #C2200E; }
  .bike-sticky-atc__btn.is-disabled { background: #EAEBEC; color: #9A99A6; }
  body.single-product { padding-bottom: 84px; }

  /* галерея на мобиле во всю ширину, миниатюры скрыты (уже hidden lg:flex) */
  .bike-product-layout { display: block; }
}

/* ============ ВЕРХНЕЕ МЕНЮ: каталог▾/меню + поиск + партнёры + корзина (нав-оверхол 2026-06-22) ============ */
.bike-mega-header-inner { justify-content: flex-start; }

/* Правый кластер прижимается вправо. ≥1025: центр-меню (flex:1) толкает кластер; ≤1024 меню скрыто →
   margin-left:auto ставим на ПЕРВЫЙ видимый элемент кластера для каждого брейкпоинта. */
@media (min-width: 1280px) { .bike-mega-header__cta { margin-left: auto; } }
@media (min-width: 768px) and (max-width: 1279px) { .bike-mega-search { margin-left: auto; } }
@media (min-width: 360px) and (max-width: 767px)  { .bike-mega-search-toggle { margin-left: auto; } }
@media (max-width: 359px) { .bike-mega-cart-btn { margin-left: auto; } }

/* Зелёная прямоугольная кнопка «Корзина» */
.bike-mega-cart-btn {
  position: relative; display: inline-flex; align-items: center; gap: .5rem;
  height: 40px; padding: 0 16px 0 14px; flex-shrink: 0;
  background: #16A34A; color: #fff; border-radius: 10px; text-decoration: none; white-space: nowrap;
  font-family: 'Onest', sans-serif; font-weight: 700; font-size: 14px;
  box-shadow: 0 2px 8px rgba(22,163,74,.28);
  transition: background-color .15s ease, transform .12s ease, box-shadow .15s ease;
}
.bike-mega-cart-btn:hover  { background: #15803D; color: #fff; box-shadow: 0 4px 14px rgba(22,163,74,.38); }
.bike-mega-cart-btn:active { transform: translateY(1px); }
.bike-mega-cart-btn svg { flex: 0 0 auto; }
.bike-mega-cart-btn__count {
  display: grid; place-items: center;
  min-width: 22px; height: 20px; padding: 0 7px; box-sizing: border-box;
  background: #fff; color: #15803D; border-radius: 9999px; font-size: 12px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums;
}
.bike-mega-cart-btn__count.is-empty { display: none; }

/* Поиск (десктоп/планшет) — компактный, сжимается на узких ноутбуках */
.bike-mega-search { width: 200px; flex-shrink: 1; min-width: 150px; }
/* Кнопка «Стать партнёром» — компактная */
.bike-mega-header__cta { flex-shrink: 0; padding: 0 16px; font-size: 13px; }

/* ── ПЛАНШЕТ 768–1024: поиск как на мониторе + «Стать партнёром» (раньше были скрыты) ── */
@media (min-width: 768px) and (max-width: 1279px) {
  .bike-mega-search      { display: flex !important; width: 240px; min-width: 180px; }   /* шире — «Поиск по каталогу» влезает целиком (задача 8) */
  .bike-mega-header__cta { display: inline-flex !important; }
  .bike-mega-cart-btn    { height: 38px; padding: 0 12px; font-size: 13px; }
}

/* ── МОБИЛА ≤767: инлайн-поиск/партнёры/каталог-плашка скрыты; корзина = только иконка; кнопка поиска ── */
/* Карточка товара: таблица «Характеристики» почти во всю ширину блока — 2px от краёв карточки.
   Карточка --tabs имеет padding 1.5rem (24px) на мобиле → вытягиваем сайдбар со спеками на 22px в каждую
   сторону (24 − 22 = 2px зазор). Заголовок и рамка-разделитель уходят к краям вместе с таблицей. */
@media (max-width: 767px) {
  .bike-tab-editorial__aside { margin-left: -22px; margin-right: -22px; }
}

@media (max-width: 767px) {
  .bike-mega-header-inner { gap: 6px; padding-left: 9px; }       /* плотнее правый кластер + лого 9px слева на каталоге/внутренних (главная = 5px в home.css) */
  .bike-mega-logo { margin-left: 0; }
  .bike-mega-search { display: none; }
  .bike-mega-cart-btn { height: 38px; padding: 0 10px; gap: .3rem; }
  .bike-mega-cart-btn__label { display: none; }
  .bike-mega-search-toggle { display: inline-flex; }
}
@media (max-width: 359px) {
  .bike-mega-search-toggle { display: none; }   /* совсем узко — без кнопки поиска */
  .bike-mega-cart-btn { padding: 0 10px; }
}

/* Каталог-плашка (десктоп-дропдаун) скрыта ≤1024 — категории в бургере */
@media (max-width: 1279px) { .bike-mega-catalog-item { display: none; } }
.bike-topbar-catalog { display: none !important; }

/* Правый кластер: бургер 6px от края, единый зазор между элементами кластера (планшет+мобила ≤1279) */
@media (max-width: 1279px) {
  .bike-mega-header-inner { gap: 8px; padding-right: 6px; }
}

/* ====================== ГЛАВНАЯ (mobile-first) ====================== */
.bike-home { display: block; background: #FCFCFD; }
.bike-home-hero { background: linear-gradient(135deg, #232427 0%, #0B0D12 55%, #3a1410 100%); color: #fff; padding: 2.25rem 1rem 2.5rem; }
.bike-home-hero__inner { max-width: 720px; margin: 0 auto; }
.bike-home-hero__eyebrow { font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; color: #FCA89F; margin: 0 0 .5rem; font-weight: 600; }
.bike-home-hero__title { font-family: 'Onest', sans-serif; font-weight: 800; font-size: 1.6rem; line-height: 1.15; margin: 0 0 .6rem; }
.bike-home-hero__sub { font-size: .95rem; line-height: 1.5; color: #D7D8DC; margin: 0 0 1.25rem; }
.bike-home-hero__cta { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 1.6rem; background: #E22A1C; color: #fff; font-weight: 700; border-radius: 12px; text-decoration: none; }
.bike-home-hero__cta:active { background: #C2200E; }

.bike-home-section { max-width: 1440px; margin: 0 auto; padding: 1.5rem 0 .5rem; }
.bike-home-section__head { display: flex; align-items: baseline; justify-content: space-between; padding: 0 1rem; margin-bottom: .85rem; }
.bike-home-section__title { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.25rem; color: #0B0D12; margin: 0; }
.bike-home-section__more { font-size: .875rem; color: #E22A1C; font-weight: 600; text-decoration: none; }

.bike-home-cats { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; padding: 0 1rem; }
.bike-home-cat { display: flex; flex-direction: column; background: #fff; border: 1px solid #EAEBEC; border-radius: 14px; overflow: hidden; text-decoration: none; min-height: 44px; transition: box-shadow .15s ease, transform .15s ease; }
.bike-home-cat:active { transform: scale(.99); }
.bike-home-cat__media { display: block; height: 96px; background: #F5F5F7 center/cover no-repeat; }
.bike-home-cat__name { padding: .6rem .75rem 0; font-weight: 600; color: #1F2023; font-size: .95rem; }
.bike-home-cat__count { padding: .1rem .75rem .7rem; font-size: .8rem; color: #9A99A6; }

.bike-home-rail { display: flex; gap: .6rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 1rem .5rem; -webkit-overflow-scrolling: touch; }
.bike-home-rail__item { flex: 0 0 46%; scroll-snap-align: start; }
.bike-home-rail__item > .product, .bike-home-rail__item > li.product { width: 100% !important; margin: 0 !important; float: none !important; }

.bike-home-trust { display: grid; grid-template-columns: repeat(2, 1fr); gap: .6rem; max-width: 1440px; margin: 1rem auto 2rem; padding: 0 1rem; }
.bike-home-trust__item { display: flex; align-items: center; gap: .6rem; background: #fff; border: 1px solid #EAEBEC; border-radius: 12px; padding: .85rem; font-size: .9rem; color: #1F2023; font-weight: 500; }
.bike-home-trust__item svg { color: #E22A1C; flex: 0 0 auto; }

@media (min-width: 768px) {
  .bike-home-hero { padding: 3.5rem 1.5rem; }
  .bike-home-hero__title { font-size: 2.4rem; }
  .bike-home-cats { grid-template-columns: repeat(4, minmax(0,1fr)); gap: .85rem; padding: 0 1.5rem; }
  .bike-home-cat__media { height: 130px; }
  .bike-home-rail__item { flex-basis: 24%; }
  .bike-home-trust { grid-template-columns: repeat(4, 1fr); padding: 0 1.5rem; }
  .bike-home-section__head { padding: 0 1.5rem; }
  .bike-home-rail { padding: 0 1.5rem .5rem; }
}
@media (min-width: 1024px) {
  /* на десктопе хиты — обычной сеткой без горизонт. скролла */
  .bike-home-rail { display: grid; grid-template-columns: repeat(5, 1fr); overflow: visible; }
  .bike-home-rail__item { flex: initial; }
}

/* ====================== ТАЧ-ТАРГЕТЫ ≥44px (mobile) ====================== */
@media (max-width: 1023.98px) {
  /* кнопки действий в карточке товара (в корзину / избранное) */
  .product .button, .product a.add_to_cart_button, .product .add_to_cart_button,
  .bike-product-card a.button, .bike-product-card button,
  [class*="wishlist"] button, [class*="wishlist"] a,
  .bike-card__cart, .bike-card__fav { min-height: 40px; min-width: 40px; }
  /* пагинация / «показать ещё» */
  .woocommerce-pagination a, .woocommerce-pagination .page-numbers, .bike-load-more { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: center; }
  /* ссылки футера крупнее для пальца */
  .site-footer a, footer a { display: inline-block; min-height: 36px; line-height: 2; }
}

/* На десктопе мобильные элементы шторки/бара не показываем.
   ВАЖНО: скрываем именно футер-контейнер .bike-hfilters__sheet-foot, а НЕ .bike-hfilters__apply —
   иначе прятались бы и submit-кнопки «Применить» внутри выпадашек (коллизия классов, была скрыта на десктопе). */
@media (min-width: 1024px) {
  .bike-hfilters__sheet-head, .bike-hfilters__close, .bike-hfilters__sheet-foot, .bike-mf-backdrop { display: none !important; }
  .bike-sticky-atc { display: none !important; }
}

/* ============ MINI-CART FLYOUT (выезжает справа при добавлении товара) ============ */
.bike-cart-flyout {
  position: fixed; top: 84px; right: 16px; z-index: 80;
  width: 360px; max-width: calc(100vw - 24px); max-height: calc(100vh - 104px);
  display: flex; flex-direction: column; overflow: hidden;
  background: #fff; border: 1px solid #EAEBEC; border-radius: 16px;
  box-shadow: 0 18px 50px rgba(11,13,18,.20);
  /* ⚠ ЗАКРЫТОЕ состояние НЕ уводим за правый край (было translateX(100%+32px)). position:fixed НЕ режется
     ни overflow:clip родителя, ни html — на РЕАЛЬНОЙ мобиле такой off-screen слой делал страницу
     пан-скроллящейся вбок («гуляет») и уводил бургер за экран. Прячем opacity+visibility, без гориз. сдвига. */
  transform: translateY(-8px); opacity: 0; visibility: hidden; pointer-events: none;
  transition: transform .32s cubic-bezier(.16,1,.3,1), opacity .25s ease, visibility 0s linear .28s;
}
.bike-cart-flyout.is-open { transform: translateY(0); opacity: 1; visibility: visible; pointer-events: auto; transition: transform .32s cubic-bezier(.16,1,.3,1), opacity .25s ease, visibility 0s; }
.bike-cart-flyout__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 14px 16px; border-bottom: 1px solid #F0F0F2; }
.bike-cart-flyout__title { display: inline-flex; align-items: center; gap: .5rem; font-family: 'Onest', sans-serif; font-weight: 700; font-size: .95rem; color: #0B0D12; }
.bike-cart-flyout__close { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 0; background: #F5F5F7; border-radius: 9px; color: #1F2023; cursor: pointer; flex: 0 0 auto; }
.bike-cart-flyout__close:hover { background: #EAEBEC; color: #E22A1C; }
.bike-cart-flyout__body { overflow-y: auto; padding: 12px 18px 18px; -webkit-overflow-scrolling: touch; }

/* WC-мини-корзина внутри панели */
.bike-cart-flyout .woocommerce-mini-cart { list-style: none; margin: 0; padding: 0; }
.bike-cart-flyout .woocommerce-mini-cart__empty-message { padding: 14px 0; color: #6b7280; }
/* картинка ВНУТРИ ссылки-названия (WC) → абсолютно слева, текст с отступом.
   Селектор с .woocommerce-mini-cart — чтобы перебить WC-виджет CSS (float:right; width:32px). */
.bike-cart-flyout .woocommerce-mini-cart li.mini_cart_item {
  display: block; position: relative;
  padding: 14px 26px 14px 62px;   /* слева 62 = картинка 50 + зазор 12; справа 26 под крестик */
  border-bottom: 1px solid #F0F0F2; font-size: .9rem; line-height: 1.4;
}
.bike-cart-flyout .woocommerce-mini-cart li.mini_cart_item img {
  position: absolute; left: 0; top: 14px; float: none; margin: 0;
  width: 50px; height: 50px; object-fit: contain; border: 1px solid #EEE; border-radius: 8px;
}
/* название: максимум 2 строки → дальше обрезка многоточием */
.bike-cart-flyout .woocommerce-mini-cart li.mini_cart_item a:not(.remove) {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  color: #1F2023; text-decoration: none; font-weight: 600;
}
/* «3 × 1 478 ₽»: количество — ЗЕЛЁНОЕ, множитель × — КРАСНЫЙ, сумма — ЧЁРНАЯ */
.bike-cart-flyout .woocommerce-mini-cart li.mini_cart_item .quantity { display: block; margin-top: 3px; white-space: nowrap; color: #16A34A; font-weight: 700; }
.bike-cart-flyout .woocommerce-mini-cart li.mini_cart_item .bike-cart-x { color: #E22A1C; font-weight: 700; }
.bike-cart-flyout .woocommerce-mini-cart li.mini_cart_item .woocommerce-Price-amount { white-space: nowrap; color: #0B0D12; }
/* кнопка удаления товара — КРАСНАЯ (по просьбе 2026-06-23) */
.bike-cart-flyout li.mini_cart_item a.remove { position: absolute; top: 10px; right: 0; width: 20px; height: 20px; line-height: 18px; text-align: center; border-radius: 50%; background: #F5F5F7; color: #E22A1C !important; font-size: 14px; text-decoration: none; }
.bike-cart-flyout li.mini_cart_item a.remove:hover { background: #FDE7E4; color: #E22A1C !important; }
.bike-cart-flyout .woocommerce-mini-cart__total { display: flex; align-items: center; justify-content: space-between; padding: 14px 2px; font-weight: 700; color: #0B0D12; border-bottom: 1px solid #F0F0F2; margin-bottom: 14px; }
.bike-cart-flyout .woocommerce-mini-cart__buttons { display: flex; flex-direction: column; gap: .6rem; margin: 4px 0 0; padding: 0; }
.bike-cart-flyout .woocommerce-mini-cart__buttons a { width: 100%; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 16px; border-radius: 11px; font-weight: 700; font-size: .92rem; white-space: nowrap; text-decoration: none; }
.bike-cart-flyout .woocommerce-mini-cart__buttons a:first-child { background: #F5F5F7; color: #1F2023; }
.bike-cart-flyout .woocommerce-mini-cart__buttons a.checkout { background: #16A34A; color: #fff; }
.bike-cart-flyout .woocommerce-mini-cart__buttons a.checkout:hover { background: #15803D; }
@media (max-width: 640px) {
  .bike-cart-flyout { top: 62px; right: 8px; left: 8px; width: auto; max-width: none; }
}

/* ============ Кнопка «в корзину» в карточке: бейдж количества вместо «Просмотр корзины» ============ */
.added_to_cart { display: none !important; }            /* убрать WC-ссылку «Просмотр корзины» после добавления */
.bike-product-card__cart { position: relative; }
.bike-product-card__cart-qty {
  position: absolute; top: -7px; right: -7px;
  min-width: 20px; height: 20px; padding: 0 5px;
  display: none; align-items: center; justify-content: center;
  background: #16A34A; color: #fff; border: 2px solid #fff;
  border-radius: 9999px; font-size: 11px; font-weight: 800; line-height: 1;
  box-shadow: 0 1px 4px rgba(11,13,18,.25);
}
.bike-product-card__cart.in-cart .bike-product-card__cart-qty { display: inline-flex; }

/* Состояние «нет в наличии» (out of stock): красноватый бейдж вместо зелёного «В наличии»
   + неактивная серая кнопка корзины (не ведёт на страницу товара). Грузится на всех страницах. */
.bike-product-card__stock--out { background: #FBE9E7; color: #B42318; }
.bike-product-card__cart--off {
  background: #ECEEF1; color: #9A99A6;
  border: 1px solid #E0E1E5; cursor: not-allowed;
}
.bike-product-card__cart--off:hover { background: #ECEEF1; color: #9A99A6; }

/* ============ ТЕСТ (2026-06-30): цена + корзина в рамке (референс 4bike-mockup) ============
   Футер карточки = бледная обводка, скруглённый прямоугольник. Кнопка/зелёный бейдж
   количества (.bike-product-card__cart-qty) НЕ трогаются — поведение «в корзину» прежнее.
   «В наличии» + рейтинг — по центру. На всех экранах. */
.bike-product-card__footer {
  padding: 9px 6px 9px 10px;   /* кнопка корзины — 6px от рамки справа */
  border: 1px solid #EAEBEC;
  border-radius: 14px;
  background: #fff;
}
.bike-product-card__meta { justify-content: center; gap: 37px; }   /* «4,7 (7)» ↔ «В наличии» (подобрано тюнером) */
/* Позиция кнопки — через padding футера выше (6px от рамки).
   Сдвиг цены +33px (из тюнера) УБРАН: на узких карточках (4 кол) он толкал цену под
   кнопку и она обрезалась. Цена снова в своей нормальной позиции слева. */

/* Кнопка «В корзину» — широкая красная пилюля с классической иконкой + текстом
   (референс 4bike-mockup). Только in-stock (<a>); неактивная (<button>) остаётся
   компактной квадратной. Зелёный бейдж .bike-product-card__cart-qty не трогаем. */
.bike-product-card a.bike-product-card__cart {
  width: auto;
  height: 42px;
  padding: 0 18px;
  gap: 8px;
  border-radius: 14px;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  flex: 0 0 auto;
}
.bike-product-card a.bike-product-card__cart > svg { flex: 0 0 auto; }
.bike-product-card__cart-label { white-space: nowrap; }
.bike-product-card__cart--off .bike-product-card__cart-label { display: none; }
.bike-product-card__footer { min-width: 0; }
.bike-product-card__price { min-width: 0; }

/* ============================================================
   МОБИЛЬНЫЙ ЭТАЛОН КАТЕГОРИИ — Шаг 1: цена без переноса
   (кнопки «Сравнить» и «В избранное» убраны в content-product.php →
    в футере остаётся цена + корзина, цене хватает места)
   ============================================================ */
/* сумма не ломается на разделителе тысяч: 1 290 / 12 990 / 124 990 ₽ */
.bike-product-card__price .woocommerce-Price-amount,
.bike-product-card__price ins,
.bike-product-card__price del { white-space: nowrap; }
/* визуальные правки карточки — только мобила/планшет (десктоп-эталон не трогаем) */
@media (max-width: 1024px) {
  .bike-product-card__price { min-width: 0; word-spacing: -0.12em; }   /* цифры цены ближе друг к другу */
  .bike-product-card__footer { gap: 0.5rem; }
  /* корзина: ширина как есть (~44), высота площе — перебиваем тап-таргет min-height:40 именно для этой кнопки */
  .bike-product-card a.bike-product-card__cart,
  .bike-product-card button.bike-product-card__cart {
    width: auto; min-width: 44px; height: 36px; min-height: 36px; padding-inline: 14px;
  }
  .bike-product-card__rating-count { display: none; }                  /* убрать число отзывов (9) */
  .bike-product-card__meta { flex-wrap: nowrap; column-gap: 14px; justify-content: center; padding-inline: 1.5px; }  /* рейтинг + наличие в ОДИН ряд, ПО ЦЕНТРУ с отступом между ними (как десктоп), не по краям (заказчик 2026-07-13) */
}
/* очень узкие телефоны (≤360): уменьшаем зазор рейтинг↔наличие, чтобы «Нет в наличии» не вылезало за карточку */
@media (max-width: 360px) {
  .bike-product-card__meta { column-gap: 6px; }
}

/* ============================================================
   МОБИЛЬНЫЙ ЭТАЛОН КАТЕГОРИИ — Шаг 2: меньше отступы
   ============================================================ */
/* боковые поля страницы на телефоне: у КОНТЕНТНЫХ/текстовых страниц (партнёры, инфо, контакты,
   бренд, дилеры, статьи) 10px — текст не должен упираться в край; у каталога/магазина/карточки
   товара/корзины/чекаута (блоки-карточки, body.woocommerce-page) остаётся 6px. (2026-07-13) */
@media (max-width: 767px) {
  .container.mx-auto { padding-left: 10px; padding-right: 10px; }
  body.woocommerce-page .container.mx-auto { padding-left: 6px; padding-right: 6px; }
}
/* Вертикальные отступы контентных/текстовых страниц (контакты/партнёры/дилеры/инфо/бренд/статьи,
   НЕ магазин body.woocommerce) на мобиле и планшете — вдвое: py-bike-section 4rem→2rem
   (расстояние от меню до контента и от контента до футера, заказчик 2026-07-13). */
@media (max-width: 1279px) {
  body:not(.woocommerce) .py-bike-section { padding-top: 2rem; padding-bottom: 2rem; }
}
/* Задача 2 (2026-06-22): на ПЛАНШЕТЕ боковые поля каталога/категорий = 6px, как на мобиле
   (по умолчанию там Tailwind md:px-6 = 24px). Только каталожные архивы — product/инфо-страницы не трогаем. */
@media (min-width: 768px) and (max-width: 1024px) {
  body.tax-product_cat .container.mx-auto,
  body.post-type-archive-product .container.mx-auto,
  body.woocommerce-shop .container.mx-auto { padding-left: 6px; padding-right: 6px; }
}
/* внутренние отступы карточки = 6px */
@media (max-width: 1024px) {
  .bike-product-card__body { padding: 6px; }
}

/* ТЕСТ (2026-06-30): ширина кнопки зависит от РЕАЛЬНОЙ ширины карточки (container query),
   а не от вьюпорта. На узкой карточке (≤290px: телефон 2 кол; планшет/десктоп 4 кол на
   мониторах ~1024-1600 — карточки 150-280px) широкая кнопка с текстом не влезает и режет
   цену → кнопка становится компактной иконкой-квадратом, текст «В корзину» скрыт.
   На широкой карточке (>290px) — кнопка с текстом. Классическая иконка остаётся всегда. */
.bike-product-card { container-type: inline-size; }
@container (max-width: 290px) {
  .bike-product-card__cart-label { display: none; }
  /* Все кнопки корзины на узкой карточке — форма старой «нет в наличии»: ~48×36, radius 12 (bike-md).
     Цвет по базе: «В корзину» красная, «нет в наличии» серая (заказчик 2026-07-13, мобила). */
  .bike-product-card a.bike-product-card__cart,
  .bike-product-card button.bike-product-card__cart {
    width: auto; min-width: 44px; height: 36px; padding: 0 14px; gap: 0; border-radius: 12px;
  }
}

/* ============================================================
   МОБИЛЬНЫЙ ЭТАЛОН КАТЕГОРИИ — Шаги 3–6
   ============================================================ */
@media (max-width: 1024px) {

  /* --- Шаг 3: баннер-шапка категории компактнее, отступы 6px --- */
  /* margin-bottom 0 — тулбар фильтра ровно по центру между баннером и товарами (зазор держат паддинги) */
  .bike-archive-hero { min-height: auto; margin-bottom: 0; border-radius: 12px; }
  .bike-archive-hero__content { min-height: auto; padding: 6px; }
  .bike-archive-hero .bike-archive-breadcrumbs { margin: 0 0 6px; }
  .bike-archive-hero .bike-archive-header__text { max-width: 100%; }
  .bike-archive-header__title { font-size: 1.45rem; line-height: 1.15; margin: 0; }
  .bike-archive-header__subtitle { margin: 6px 0 0; font-size: .85rem; line-height: 1.35; }
  .bike-archive-header__count { margin: 6px 0 0; font-size: .8rem; }

  /* --- Шаг 4: чипсы подкатегорий — горизонтальный скролл (1 строка) + скрыть текущую --- */
  .bike-archive-hero .bike-archive-chips,
  .bike-archive-chips {
    margin: 6px 0 0; min-width: 0;
    flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;
    scrollbar-width: none; padding-bottom: 2px; border-bottom: 0;
  }
  .bike-archive-chips::-webkit-scrollbar { display: none; }
  .bike-archive-chips .bike-chip { flex: 0 0 auto; white-space: nowrap; }
  .bike-archive-chips .bike-chip--active { display: none; }   /* текущая категория не показывается */

  /* дубль дерева категорий снизу страницы убираем — его заменяет drawer (ниже) */
  .bike-archive-sidebar { display: none !important; }

  /* отступ между товарами 6px */
  .bike-archive-grid { gap: 6px; }

  /* отступ под фильтром/контролами = 6px (перебиваем archive-misc 25px !important) */
  .bike-archive-controls { margin-bottom: 6px !important; }
  .bike-active-filters { margin: 0 0 6px 0 !important; }
  .bike-archive-main { gap: 0 !important; }

  /* сортировка не уходит за край: подпись кнопки обрезается, выпадашка в пределах экрана */
  .bike-archive-toolbar__sort-form,
  .bike-archive-toolbar__sort-form .bike-hfilters__group,
  .bike-archive-toolbar__sort-form .bike-hfilters__btn { min-width: 0; }
  .bike-archive-toolbar__sort-form .bike-hfilters__btn > span:first-child {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
  }
  .bike-archive-toolbar__sort-form .bike-hfilters__popover {
    min-width: 200px; max-width: calc(100vw - 12px);
  }
}

/* --- Шаг 6: планшетная сетка (телефон ≤767 остаётся 2 кол) --- */
@media (min-width: 768px) and (max-width: 959px) {
  .bike-archive-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 960px) and (max-width: 1024px) {
  .bike-archive-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* --- Шаг 5: плавающая кнопка-меню + выезжающий слева drawer категорий (≤1023) --- */
.bike-catnav { display: none; }
@media (max-width: 1024px) {
  .bike-catnav { display: block; }
  .bike-catnav__fab {
    /* Вертикально по ЦЕНТРУ видимого вьюпорта → всегда на виду при прокрутке и НЕ падает
       за нижний край в ландшафте (там высота 360–430px). Было top:360px — жёсткий пиксель,
       на коротких экранах ронял таб за низ («западал»). left учитывает вырез (safe-area)
       в ландшафте, иначе центрированный таб сядет под чёлку. (2026-07-11) */
    position: fixed; left: max(0px, env(safe-area-inset-left)); top: 50%; transform: translateY(-50%); z-index: 45;
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; min-height: 58px; padding: 10px 6px; border-radius: 0 12px 12px 0;
    background: #E22A1C; color: #fff; border: 0; cursor: pointer;
    border-radius: 0 12px 12px 0; box-shadow: 0 6px 18px rgba(11,13,18,.30);
  }
  .bike-catnav__fab:active { background: #C2200E; }
  /* «Меню» обычными буквами, повёрнуто вертикально (узкая плашка) */
  .bike-catnav__fab-label {
    writing-mode: vertical-rl;
    font-size: 12px; font-weight: 800; letter-spacing: .5px; line-height: 1;
  }
  /* при открытом drawer прячем липкий хедер/бургер (он в своём stacking-context, z-index не пробивается) */
  .bike-catnav__backdrop { position: fixed; inset: 0; z-index: 10000; background: rgba(11,13,18,.48); }
  .bike-catnav__panel {
    position: fixed; left: 0; top: 0; bottom: 0; z-index: 10001;
    width: 84%; max-width: 340px; background: #fff;
    box-shadow: 0 0 40px rgba(11,13,18,.35);
    transform: translateX(-100%); transition: transform .28s cubic-bezier(0.16,1,0.3,1);
    display: flex; flex-direction: column; overscroll-behavior: contain;
  }
  .bike-catnav__panel.is-open { transform: translateX(0); }
  .bike-catnav__head {
    flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
    padding: 14px 14px 12px; border-bottom: 1px solid #EAEBEC;
  }
  .bike-catnav__title { font-family: 'Onest', sans-serif; font-weight: 700; font-size: 1.05rem; color: #0B0D12; }
  .bike-catnav__close {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border: 0; background: #F5F5F7; border-radius: 9999px; cursor: pointer; color: #1F2023;
  }
  .bike-catnav__body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 10px 12px 24px; }
  .bike-catnav__body .bike-cat-card { position: static !important; margin-bottom: 10px; max-height: none !important; }
  /* открыт drawer → прячем хедер/бургер (перекрыть z-index'ом не выходит — свой контекст) */
  html.bike-catnav-open .bike-mega-header,
  html.bike-catnav-open .bike-catnav__fab { visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  .bike-catnav__panel { transition: none; }
}

/* Таб «Товары» на ПЛАНШЕТАХ в 1.5 раза крупнее. min-height:600 отсекает телефоны
   в ландшафте (они тоже шире 768, но низкие) → их не трогаем. max-width:1024 = там,
   где таб вообще виден. JS-центрирование читает offsetHeight на лету, править не нужно. */
@media (min-width: 768px) and (max-width: 1024px) and (min-height: 600px) {
  .bike-catnav__fab { width: 36px; min-height: 87px; padding: 15px 5px; border-radius: 0 18px 18px 0; }
  .bike-catnav__fab-label { font-size: 18px; }
}

/* ============================================================
   ЕДИНЫЙ ОТСТУП 6px В МОБИЛЕ (2026-06-16) — перебиваем накопленные
   !important из hero-overrides (padding-left:1.25rem, chips padding 20/12)
   и archive-misc (toolbar 8px 12px). Грузится последним → побеждает.
   ============================================================ */
@media (max-width: 1024px) {
  .bike-archive-hero__content { padding: 6px !important; }
  .bike-archive-hero .bike-archive-chips {
    margin: 6px 0 0 !important; padding-top: 0 !important; padding-bottom: 0 !important;
  }
  .bike-archive-controls .bike-archive-toolbar { padding: 6px 0 !important; }

  /* цена по центру между левым краем карточки и кнопкой корзины */
  .bike-product-card__footer .bike-product-card__price { flex: 1 1 auto; text-align: center; }

  /* фильтр+сортировка = 2 самостоятельные кнопки, без общей обёртки-карточки
     (убираем рамку/радиус/тень у .bike-archive-toolbar; фон оставляем под цвет
     страницы — невидим, но прикрывает товары при липком скролле) */
  .bike-archive-controls .bike-archive-toolbar,
  .bike-archive-controls .bike-archive-toolbar:hover {
    border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  }
}

/* ============================================================
   КАРТОЧКА ТОВАРА — адаптив, 2026-06-16
   P2 табы-пилюли (≤1024 — помещаются и на планшете)
   P3 заголовок + P1 преимущества-скролл — ТОЛЬКО телефон ≤767
   (планшету 768–1024 хватает места: крупный заголовок + 3 колонки)
   ============================================================ */
@media (max-width: 1024px) {
  /* P2 — табы Описание/Отзывы/Доставка → пилюли с горизонтальным скроллом */
  .bike-tabs-editorial__nav {
    flex-wrap: nowrap; overflow-x: auto; gap: 6px;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    border-bottom: 0; margin-bottom: 12px;
    margin-inline: -6px; padding: 0 6px 2px;
  }
  .bike-tabs-editorial__nav::-webkit-scrollbar { display: none; }
  .bike-tabs-editorial__btn {
    flex: 0 0 auto; white-space: nowrap;
    padding: 9px 11px; font-size: .875rem; font-weight: 600;
    background: #F5F5F7; color: #1F2023; border-radius: 9999px;
  }
  .bike-tabs-editorial__btn.is-active { background: #E22A1C; color: #fff; }
  .bike-tabs-editorial__btn.is-active::after { display: none; }
}

@media (max-width: 767px) {
  /* P3 — заголовок товара меньше (на телефоне занимал много места) */
  body.single-product h1.text-bike-h1,
  body.single-product .text-bike-h1 {
    font-size: 1.3rem; line-height: 1.22; letter-spacing: -0.01em;
  }

  /* P1 — три блока преимуществ: горизонтальный скролл, 1 целый + 2-й до половины, 3-й скрыт */
  .bike-features-row {
    display: flex; grid-template-columns: none;
    gap: 6px; overflow-x: auto; scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    /* 2026-07-10 (по просьбе юзера): первый блок ровняем по ЛЕВОМУ краю карточки summary
       (x=6, край страницы), а не по её контенту — был padding-left 24 => отступ больше верхнего блока. */
    margin-left: 0; margin-right: -6px; padding: 2px 0 2px 0; scroll-padding-left: 0;
  }
  .bike-features-row::-webkit-scrollbar { display: none; }
  .bike-features-row > .bike-product-section--feature {
    flex: 0 0 66%; scroll-snap-align: start; margin-bottom: 0;
  }
}

/* ============================================================
   КАРТОЧКА ТОВАРА — адаптив, часть 2 (≤1024), 2026-06-16
   P4 мета-строка · P7 похожие · P6 sticky-количество
   ============================================================ */
@media (max-width: 1024px) {

  /* P7 — похожие товары: сетка как в каталоге (gap 6px); карточки уже .bike-product-card */
  .bike-related { padding: 12px; }
  .bike-related__grid { gap: 6px; }

  /* A3 — мета: на мобиле колонки равной ширины с зазором (раньше 165px 165px впритык, без зазора) */
  .bike-meta-grid { grid-template-columns: 1fr 1fr; column-gap: 16px; }
  /* P4 — если штрихкода нет, последняя ячейка («Купить в городе») одна в нечётной позиции →
     растягиваем на всю ширину и ровняем по левому краю (как «Категория» сверху), без переноса строк */
  .bike-meta-grid > .bike-meta-cell:last-child:nth-child(odd) {
    grid-column: 1 / -1; justify-content: flex-start; border-left: 0; padding-left: 0;
  }
  .bike-meta-grid > .bike-meta-cell:last-child:nth-child(odd) .text-bike-caption,
  .bike-meta-grid > .bike-meta-cell:last-child:nth-child(odd) a { white-space: nowrap; }

  /* P6 — убрать телесную кнопку «в корзину» + количество + сердечко (вся cta-row);
     покупка идёт через sticky-бар снизу (форма скрыта, но сабмит работает) */
  .bike-single-product .bike-cta-row { display: none !important; }

  /* дубль цены: верхнюю (в summary) на мобиле прячем — цену несёт sticky-бар снизу */
  .bike-single-product .bike-inflow-price { display: none !important; }

  /* P6 — sticky-бар: количество слева от цены [−│n│+] */
  .bike-sticky-atc__qty {
    display: inline-flex; align-items: center; flex: 0 0 auto;
    height: 44px; border: 1px solid #EAEBEC; border-radius: 12px; background: #fff; overflow: hidden;
  }
  .bike-sticky-atc__qty button {
    width: 34px; height: 100%; border: 0; background: transparent; color: #1F2023;
    font-size: 18px; font-weight: 700; line-height: 1; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .bike-sticky-atc__qty button:active { background: #F5F5F7; }
  .bike-sticky-atc__qty span {
    min-width: 24px; text-align: center; font-weight: 700; font-size: 1rem;
    color: #0B0D12; font-variant-numeric: tabular-nums;
  }
}

/* 2026-06-22: дубли кнопки «Каталог» (топбар/тулбар) убраны. Каталог категорий на ≤1024 —
   только через левый красный FAB «Меню» (.bike-catnav__fab, рендер в inc/woocommerce.php). */
.bike-archive-toolbar__left { display: flex; align-items: center; gap: 8px; }
.bike-archive-toolbar__catalog-btn { display: none !important; }

/* ============================================================
   D — рейтинг = кликабельный якорь к табу «Отзывы» (все ширины). 2026-06-20
   ============================================================ */
.bike-rating-link {
  background: transparent; border: 0; padding: 0; margin: 0;
  text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.bike-rating-link:disabled { cursor: default; }
.bike-rating-link:not(:disabled):hover .text-bike-text-muted { color: #E22A1C; text-decoration: underline; text-underline-offset: 2px; }
/* отступ под липкий хедер при scrollIntoView к табам */
.bike-tabs-editorial { scroll-margin-top: 90px; }

/* ============================================================
   2026-06-23 батч: T19 стрелки лайтбокса
   ============================================================ */
/* ⛔ T14 trust-полоса под ценой («Только оригинал / Возврат / Доставка») УДАЛЕНА ПОЛНОСТЬЮ по просьбе юзера (2026-07-12).
   Блок вырезан из summary.php, правило-скрытие снято за ненадобностью. НЕ ВОЗВРАЩАТЬ. */
/* T19: стрелки лайтбокса видимы везде (тёмный круг + белая стрелка) — раньше сливались на светлом фото */
.bike-lightbox__nav { background-color: rgba(18,18,20,.55) !important; color: #fff !important; border-color: rgba(255,255,255,.35) !important; }
.bike-lightbox__nav:hover { background-color: rgba(18,18,20,.78) !important; }
.bike-lightbox__nav svg { color: #fff !important; }

/* T11 (2026-06-23): сетка товаров каталога — плавная прогрессия по планшету: 2 / 3 / 4.
   Портрет (768–1023) = 2 столбца; iPad-ЛАНДШАФТ (1024–1279) = 3 столбца (2 кол на широком экране = слишком крупные карточки);
   десктоп (≥1280) = 4 (база). Юзер: «делай правильно». Раньше ≤1023 → на ландшафте выскакивало 4 столбца. */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .bike-archive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (min-width: 1024px) and (max-width: 1279.98px) {
  .bike-archive-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* T3 (2026-06-23): на мониторах (≥1280) цена/корзина были по центру (space-evenly).
   2026-06-30: с рамкой + широкой кнопкой «В корзину» space-evenly отрывал кнопку от
   правого края (зазор рос до 15-22px на широких экранах). Вернул space-between —
   кнопка прижата к рамке (6px) одинаково на 2/3/4 колонках. */
@media (min-width: 1280px) {
  .bike-product-card__footer { justify-content: space-between !important; gap: 8px; }
}

/* ============================================================
   ГАЛЕРЕЯ ТОВАРА — T13 (планшет) + T12 (мобила). 2026-06-23
   ============================================================ */

/* ── T13: ПЛАНШЕТ 768–1023.98 — чиним пропавшее главное фото + миниатюры слева ──
   Баг: на ≤1023 layout = display:block (см. выше), а main.css на ≥768 даёт
   .bike-gallery__main { aspect-ratio:auto; height:100% } → в блочном потоке высота
   схлопывается в 0, фото невидимо. Фикс: 2-колоночный grid [миниатюры | фото],
   summary под ним во всю ширину, и возвращаем фото реальную высоту (aspect-ratio). */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .bike-product-layout {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr);
    column-gap: 16px;
    row-gap: 20px;
    align-items: start;
  }
  .bike-product-layout .bike-thumbs-col {
    display: flex !important;        /* перебиваем Tailwind .hidden */
    grid-column: 1;
    grid-row: 1;
    align-self: stretch;
  }
  .bike-product-layout .bike-product-section--main {
    grid-column: 2;
    grid-row: 1;
  }
  /* одно фото → колонки миниатюр нет (PHP) → фото на всю ширину */
  .bike-product-layout .bike-product-section--main.bike-product-section--solo {
    grid-column: 1 / -1;
  }
  .bike-product-layout .bike-product-right-col {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  /* вернуть главному фото высоту (источник убран в main.css на ≥768) */
  .bike-product-section--main .bike-gallery__main {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    max-height: 70vh;
  }
}

/* ── T12: МОБИЛА ≤767 — миниатюры ГОРИЗОНТАЛЬНОЙ лентой ПОД главным фото ──
   (если фото одно — колонка миниатюр в PHP не выводится → пустоты нет). */
@media (max-width: 767px) {
  .bike-product-layout {
    display: flex !important;
    flex-direction: column;
    gap: 12px;
  }
  .bike-product-layout .bike-product-section--main { order: 1; }
  .bike-product-layout .bike-product-right-col      { order: 3; }
  .bike-product-layout .bike-thumbs-col {
    display: flex !important;        /* перебиваем Tailwind .hidden */
    order: 2;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 0;
  }
  /* вертикальные стрелки не нужны на горизонтальной ленте — свайп/драг свободный */
  .bike-thumbs-col .bike-thumb-nav-btn { display: none; }
  .bike-thumbs-col .bike-gallery__thumbs-swiper {
    max-height: none;
    width: 100%;
    height: auto;
  }
  .bike-thumbs-col .swiper-slide { width: 64px; height: 64px; }
  .bike-thumbs-col .bike-gallery__thumb { width: 64px; height: 64px; aspect-ratio: auto; }
}

/* 2026-07-10 (по просьбе юзера): на мобиле активная миниатюра — тонкая рамка 0.5px (было 2px).
   Скоплено ≤767 — десктопную колонку миниатюр (крупнее) не трогаем. */
@media (max-width: 767px) {
  .bike-gallery__thumb { border-width: 0.5px; }
}

/* ============================================================
   T16 (2026-06-23): мета-сетка на ТЕЛЕФОНЕ — горизонтальная лента
   с прокруткой, порядок: Категория → Дилеры → остальное (штрихкод, артикул).
   ============================================================ */
@media (max-width: 767px) {
  .bike-meta-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    column-gap: 0 !important;
    row-gap: 0 !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }
  .bike-meta-grid::-webkit-scrollbar { display: none; }
  .bike-meta-grid > .bike-meta-cell {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 150px;
    grid-column: auto !important;     /* нейтрализуем P4 grid-column:1/-1 */
    scroll-snap-align: start;
    /* !important — desktop main.css задаёт nth-child(2n+1) padding-left:0 и nth-child(2n)
       padding-right:0 со специфичностью 0,3,0 и на мобиле убивал одну сторону паддинга
       у КАЖДОЙ ячейки (контент липнул к разделителю). Симметричные 16px по обе стороны
       hairline'а дают ровные отступы между блоками. */
    padding: 0 16px !important;
    border-left: 1px solid #C9CBD1;   /* разделитель между ячейками, видимый (было #EAEBEC ~ невидимый) */
  }
  /* Порядок: Категория(1) → Дилеры(2) → Штрихкод(3) → Артикул(4) */
  .bike-meta-grid > .bike-meta-cell.bike-meta-cell--category {
    order: 1; border-left: 0; padding-left: 0 !important;   /* первая ячейка ровняется по левому краю колонки (как h1) */
  }
  /* !important — перебиваем P4 (:last-child:nth-child(odd)), который на мобиле гасил
     разделитель+паддинг у «Купить» (dealers — последний в DOM). Без этого нет линии между Категорией и Купить. */
  .bike-meta-grid > .bike-meta-cell.bike-meta-cell--dealers  { order: 2; border-left: 1px solid #C9CBD1 !important; padding-left: 16px !important; }
  .bike-meta-grid > .bike-meta-cell.bike-meta-cell--barcode  { order: 3; border-left: 1px solid #C9CBD1 !important; }
  /* sku — 2-й ребёнок в DOM => main.css .bike-meta-cell:nth-child(2n) (0,3,0) даёт ему светлый #EAEBEC;
     перебиваем !important на видимый цвет */
  .bike-meta-grid > .bike-meta-cell.bike-meta-cell--sku      { order: 4; border-left: 1px solid #C9CBD1 !important; }
  /* «Адреса дилеров» не переносим */
  .bike-meta-cell--dealers a,
  .bike-meta-cell--dealers .text-bike-caption { white-space: nowrap; }
}

/* ============================================================
   T17a (2026-06-23): мобила — описание под градиент-обрезку + «Читать всё».
   На десктопе текст полный, кнопка скрыта.
   ============================================================ */
.bike-tab-editorial__readmore-btn { display: none; }     /* десктоп: скрыта */
@media (max-width: 767px) {
  .bike-tab-editorial__readmore .bike-tab-editorial__body {
    max-height: 200px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, #000 60%, transparent 100%);
            mask-image: linear-gradient(to bottom, #000 60%, transparent 100%);
  }
  .bike-tab-editorial__readmore.is-open .bike-tab-editorial__body {
    max-height: none;
    -webkit-mask-image: none;
            mask-image: none;
  }
  .bike-tab-editorial__readmore-btn {
    display: inline-flex; align-items: center; gap: .3rem;
    margin-top: .85rem; padding: .55rem 1.1rem;
    border: 1px solid #EAEBEC; border-radius: 9999px; background: #fff;
    color: #E22A1C; font-weight: 600; font-size: .92rem; line-height: 1; cursor: pointer;
  }
  .bike-tab-editorial__readmore-btn:active { background: #F5F5F7; }
  .bike-tab-editorial__readmore.is-open .bike-tab-editorial__readmore-btn { display: none; }
}

/* ============================================================
   T17c (2026-06-23): блок «С этим товаром покупают» получил стиль «Похожих».
   T (2026-07-10, по просьбе юзера): «Похожие товары» тоже приведены к 6 карточкам
   в ряд на десктопе (>=1024), как «С этим товаром покупают». Поэтому правило теперь
   на ВСЕ .bike-related__grid (а не только под .bike-bought-together).
   При 6 колонках карточка становится уже 290px и кнопка сама переходит на иконку
   (container-query в карточке). На планшете/мобиле наследуют base related (3/2 колонки).
   ============================================================ */
.bike-bought-together { margin-top: 1.5rem; }
@media (min-width: 1024px) {
  .bike-related__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

/* ============================================================
   2026-07-10 (по просьбе юзера): на мобиле+планшете (<=1023) блоки «Похожие товары»
   и «С этим товаром покупают» на СТРАНИЦЕ ТОВАРА показываем как витрину главной —
   товары во всю ширину на сером фоне, БЕЗ белой обёртки-карточки и её паддинга
   (был padding 12px + фон/тень/радиус = слишком большие отступы по бокам).
   Корзинный кросс-селл (.bike-cart-crosssell) НЕ трогаем — он вне .bike-single-product.
   ============================================================ */
@media (max-width: 1023px) {
  .bike-single-product .bike-related {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
  }
}
/* планшет: гэп грида как на главной (8px) */
@media (min-width: 768px) and (max-width: 1023px) {
  .bike-single-product .bike-related__grid { gap: 8px; }
}

/* ============================================================
   2026-07-10 (по просьбе юзера): фото в «Похожих»/«С этим товаром» — как в КАТАЛОГЕ.
   Было .bike-related override: медиа 4:3 + padding 1rem + img height:100%/width:auto =>
   фото мелкое, «обрезанное» по высоте. Возвращаем базовый вид карточки каталога:
   квадрат 1/1, фото заполняет медиа целиком (object-fit:contain остаётся из базы).
   Применяется на всех экранах и во всех .bike-related (вкл. кросс-селл корзины).
   ============================================================ */
.bike-related .bike-product-card__media {
  display: block;
  aspect-ratio: 1 / 1;
  padding: 0;
}
.bike-related .bike-product-card__img {
  width: 100%;
  height: 100%;
}

/* ============================================================
   T9 (2026-06-23): на десктопе чипсы подкатегорий распределяются по высоте —
   группа «крошки + H1 + счётчик» сверху, чипсы прижаты к низу баннера
   (между счётчиком и чипсами появляется воздух). Контент тянется на всю высоту hero.
   ============================================================ */
@media (min-width: 1024px) {
  .bike-archive-hero { display: flex; flex-direction: column; min-height: 320px; }
  .bike-archive-hero__content { flex: 1 1 auto; }
  .bike-archive-hero .bike-archive-chips { margin-top: auto !important; }
}

/* ============================================================
   T21 (2026-06-23): на десктопе (≥1024) фильтры + сортировка — центрированной
   группой посередине строки (раньше фильтры слева, сортировка прижата вправо).
   ============================================================ */
@media (min-width: 1024px) {
  .bike-archive-controls { justify-content: center; }
  .bike-archive-controls .bike-hfilters { flex: 0 1 auto; }
  .bike-archive-toolbar { justify-content: center; }
}

/* ============================================================
   2026-07-14: карточка товара, МОБАЙЛ (до 767px). Текст и заголовки
   всех текстовых секций (summary, табы, FAQ) с ровным боковым
   отступом 12px. Структурные блоки (галерея, фичи, «Похожие» и
   «С этим покупают», мета лента, пилюли табов) не трогаем.
   ============================================================ */
@media (max-width: 767px) {
  .bike-single-product .bike-product-section--summary,
  .bike-single-product .bike-product-section--tabs,
  .bike-single-product .bike-product-section--editorial-faq {
    padding-left: 12px;
    padding-right: 12px;
  }
  /* Характеристики-aside: убрать вытяжку -22px, выровнять в 12px-гаттер. */
  .bike-single-product .bike-tab-editorial__aside {
    margin-left: 0;
    margin-right: 0;
  }
  /* Заголовки секций «Похожие товары» и «С этим товаром покупают» (лежат вне
     .bike-single-product, целим по body.single-product). Сетка карточек товара
     под ними остаётся во всю ширину (блок не трогаем). */
  .single-product .bike-related__title {
    padding-left: 12px;
    padding-right: 12px;
  }
}