/* ===================================================================
   adaptive.css — независимый адаптивный слой (грузится ПОСЛЕ vs2026.css)
   Не трогает существующие стили; только чинит мобильную/планшетную вёрстку.
   Точки: <=1024 планшет, <=900 мобильное меню, <=600 узкий телефон.
   =================================================================== */

/* ---------- 0. Анти-переполнение (все размеры) ---------- */
/* только ограничение ширины; height НЕ трогаем, чтобы не перебить точечные размеры логотипа и т.п. */
img,svg,video,canvas,iframe,embed,object{max-width:100%;}

/* Залипание шапки: overflow-x:hidden у корневого блока создаёт scroll-контейнер и ЛОМАЕТ position:sticky.
   Меняем на overflow-x:clip — клипает горизонт так же, но НЕ создаёт scroll-контейнер → sticky работает. */
.max-w-full.overflow-x-hidden{overflow-x:clip !important;}
.stickhdr{position:sticky !important;top:0 !important;z-index:1000 !important;}
/* длинные неразрывные строки не распирают контейнер */
.ftr a,.ftr p,.drop__menu a,.prow__d,.p26desc,.crumbs,.breadcrumbs{overflow-wrap:break-word;word-break:break-word;}

/* бургер, шторка и перенесённый адрес по умолчанию скрыты (десктоп) */
.vsburger{display:none;}
.vsdrawer,.vsdrawer-ov{display:none;}
.top__addr{display:none;}   /* виден только на мобильном (<=900), см. ниже */

/* Чат Jivosite (#jvLabelWrap, z-index 2147483647 — максимум) перекрывает открытые модалки/шторку;
   поднять модалку выше нельзя, поэтому прячем лаунчер чата, пока открыт оверлей. Возвращается при закрытии. */
body:has(.vspm-ov.open) #jvLabelWrap,
body:has(.vsdrawer.open) #jvLabelWrap,
body:has(.vscart-ov.open) #jvLabelWrap,
body:has(.modal.open) #jvLabelWrap{opacity:0 !important;pointer-events:none !important;visibility:hidden !important;}

/* ---------- 1. Мобильное меню (шторка) ---------- */
.vsburger{
  flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;flex:0 0 auto;
  border:1.5px solid rgba(255,255,255,.28);border-radius:12px;
  background:transparent;cursor:pointer;padding:0 11px;
}
.vsburger span{display:block;height:2.5px;width:100%;background:#e8edf2;border-radius:2px;transition:.2s;}
.vsburger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.vsburger.open span:nth-child(2){opacity:0;}
.vsburger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

.vsdrawer-ov{position:fixed;inset:0;background:rgba(8,15,25,.55);z-index:99990;opacity:0;visibility:hidden;transition:.25s;}
.vsdrawer-ov.open{opacity:1;visibility:visible;}
.vsdrawer{
  position:fixed;top:0;right:0;height:100%;width:min(87vw,368px);
  background:#fff;z-index:99991;transform:translateX(100%);
  transition:transform .28s ease;display:flex;flex-direction:column;
  box-shadow:-14px 0 44px -22px rgba(0,0,0,.55);
}
.vsdrawer.open{transform:none;}
.vsdrawer__hd{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid #eef1f4;font-family:'Exo 2',sans-serif;font-weight:800;font-size:18px;color:#12202c;flex:0 0 auto;}
.vsdrawer__x{border:0;background:none;font-size:24px;line-height:1;cursor:pointer;color:#5a6672;padding:0 4px;}
.vsdrawer__body{overflow-y:auto;padding:8px 0 40px;-webkit-overflow-scrolling:touch;flex:1 1 auto;}
.vsdrawer__body a{color:#1a2733;text-decoration:none;display:block;}
.vsdrawer__search{padding:12px 18px 6px;}
.vsdrawer__search form{display:flex;gap:6px;}
.vsdrawer__search input{flex:1;min-width:0;padding:11px 13px;border:1.5px solid #dfe4ea;border-radius:11px;font-size:15px;}
.vsdrawer__search button{padding:11px 15px;background:#ff7f00;color:#fff;border:0;border-radius:11px;font-weight:700;cursor:pointer;white-space:nowrap;}
.vsacc{border-bottom:1px solid #f2f4f6;}
.vsacc__t{width:100%;text-align:left;background:none;border:0;padding:14px 18px;font-size:15.5px;font-weight:700;color:#12202c;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px;}
.vsacc__t:after{content:'▾';color:#9aa6b1;transition:.2s;font-size:13px;}
.vsacc.open .vsacc__t:after{transform:rotate(180deg);}
.vsacc__c{display:none;padding:2px 18px 12px;}
.vsacc.open .vsacc__c{display:block;}
.vsacc__c a{padding:9px 0 9px 13px;font-size:14px;border-left:2px solid #eef1f4;color:#33414d;}
.vsacc__c a:hover{color:#ff7f00;}
.vsacc__c a b{font-weight:600;}
.vsdrawer__links{padding:4px 0;border-top:1px solid #f2f4f6;}
.vsdrawer__links a{padding:13px 18px;font-size:15px;font-weight:600;border-bottom:1px solid #f7f8fa;}
.vsdrawer__cta{padding:14px 18px;}
.vsdrawer__cta a{display:block;text-align:center;background:#ff7f00;color:#fff;font-weight:700;padding:13px;border-radius:12px;font-size:15px;}
.vsdrawer__tel{padding:16px 18px;background:#f7f9fb;}
.vsdrawer__tel a{font-family:'Exo 2',sans-serif;font-size:21px;font-weight:800;color:#12202c;}
.vsdrawer__tel span{font-size:12px;color:#7a8894;display:block;margin-top:2px;}
.vsdrawer__soc{display:flex;gap:12px;padding:14px 18px 4px;}
.vsdrawer__soc a{width:38px;height:38px;}
.vsdrawer__soc img{width:100%;height:100%;object-fit:contain;}

/* ---------- 2. Шапка на планшете/мобильном (<=900) ---------- */
@media(max-width:900px){
  /* верхняя плашка: убрать десктоп-навигацию (уходит в шторку), оставить город + адрес */
  .top .drop,.top__links,.top__badges{display:none !important;}
  .top .wrap{padding:7px 14px;justify-content:flex-start;gap:3px 12px;flex-wrap:wrap;align-items:center;}
  .top__city{font-size:13px;}
  /* адрес, перенесённый JS-ом из основного ряда наверх */
  .top__addr{display:inline-flex;flex-wrap:wrap;gap:2px 12px;font-size:12px;color:var(--mut,#9fb0bd);line-height:1.35;}
  .top__addr a{color:inherit;}
  .top__addr a.m{color:#ff9a3d;font-weight:600;}

  /* основной ряд: логотип + телефон + корзина + бургер, поиск и кнопка — своими строками */
  .hd .wrap{display:flex !important;flex-wrap:wrap !important;gap:9px 10px !important;padding:9px 14px !important;align-items:center;}
  .hd .wrap>*{min-width:0;}                     /* КЛЮЧ: разрешаем детям сжиматься, иначе распирают документ */
  .hd__logo{order:1;flex:0 0 auto;max-width:52vw;}
  .hd__logo img{height:34px !important;width:auto !important;max-height:34px;}
  .hd__addr{display:none !important;}            /* адрес уехал в верхнюю плашку */
  .hd__tel{order:2;margin-left:auto;text-align:right;flex:0 1 auto;}
  .hd__tel b{font-size:15.5px;white-space:nowrap;}
  .hd__tel span{font-size:10.5px;}
  .hd__cart{order:3;flex:0 0 auto;}
  .vsburger{display:inline-flex;order:4;}
  .hd__search{order:5;flex:1 1 100% !important;max-width:100% !important;display:flex;}
  .hd__search input{flex:1 1 auto;min-width:0;}
  .hd__btn.js-vs-price{order:6;flex:1 1 100%;text-align:center;}

  /* всплывающие меню города/корзины не должны вылезать за экран */
  .drop__menu,.vsask,.vspm{max-width:calc(100vw - 24px);}
  /* таблицы характеристик — горизонтальный скролл внутри блока (только на мобильном) */
  .p26desc table,.tab-content table,.article table,.content table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  /* компактная липкая шапка при прокрутке: прячем плашку/поиск/кнопку, остаётся логотип+телефон+корзина+бургер */
  body.vs-scrolled .top,
  body.vs-scrolled .hd__search,
  body.vs-scrolled .hd__btn.js-vs-price{display:none !important;}
  .hd .wrap{transition:padding .15s ease;}

  /* сетки: дети не распирают контейнер + треки minmax(0,1fr) вместо auto */
  .ftr__grid>*,.plist>*,.p7grid>*,.prow,.prow__b,.prow__d,.sub-photo>*,.scard{min-width:0;}
  .plist{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .sub-photo{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  .scard__im img,.scard img{width:100%;height:auto;}
  .ftr__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* ---------- 3. Узкий телефон (<=600) ---------- */
@media(max-width:600px){
  .wrap,.wrap2{padding-left:14px;padding-right:14px;}
  /* подвал в одну колонку */
  .ftr__grid{grid-template-columns:1fr !important;gap:22px;}
  .ftr__bottom,.ftr__legal{flex-direction:column;gap:8px;align-items:flex-start;text-align:left;}
  /* листинг: одна колонка карточек, чтобы не были крошечными */
  .plist{grid-template-columns:1fr !important;}
  /* подкатегории: 2 колонки */
  .sub-photo{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  /* заголовки не переполняют */
  h1,.title-h2{font-size:24px;line-height:1.2;word-break:break-word;}
}

/* ---------- 3b. Компактная шапка на телефоне (<=560) ---------- */
@media(max-width:560px){
  /* ряд 1: логотип слева, корзина+бургер справа; телефон/поиск/кнопка — своими строками */
  .hd__logo{order:1;}
  .hd__cart{order:2;margin-left:auto;}
  .vsburger{order:3;margin-left:0;}
  .hd__tel{order:4;margin-left:0 !important;flex:1 1 100%;text-align:left;}
  .hd__tel b{font-size:16px;}
  .hd__search{order:5;}
  .hd__btn.js-vs-price{order:6;}
}

/* ---------- 4. Совсем узко (<=380) ---------- */
@media(max-width:380px){
  .hd__tel b{font-size:14px;}
  .hd__logo img{height:30px;}
}

/* ===================================================================
   ПАКЕТ 2026-07-31 (m6): таблицы в контенте, формы-конфигураторы,
   размеры шрифтов под iOS, тач-цели, нижнее уведомление, плитки
   =================================================================== */

/* --- 5. Таблицы в контенте: горизонтальный скролл вместо обрезки --- */
/* JS оборачивает широкие таблицы в .vs-tblwrap; здесь только оформление */
.vs-tblwrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
@media(max-width:900px){
  .vs-tblwrap{position:relative;margin:0 0 14px;border-radius:10px;}
  .vs-tblwrap table{margin:0 !important;min-width:520px;}
  .vs-tblwrap:after{content:'';position:absolute;top:0;right:0;bottom:0;width:22px;pointer-events:none;
    background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.92));border-radius:0 10px 10px 0;}
  .vs-tblwrap.vs-tblend:after{opacity:0;}
  /* контентные обёртки не должны распираться содержимым */
  /* !important: у SEO-блоков (.vsx) и статей (.vart) свой инлайн <style> в контенте — он идёт после нашего файла */
  .vsx,.vart,.p26desc,.tab-content,.item-page,.vsn-article__body,.article,.content{max-width:100% !important;min-width:0 !important;}
  .vsx>*,.vart>*{max-width:100% !important;}
  .vs-tblwrap{max-width:100% !important;width:100%;}
}

/* --- 6. Формы и конфигураторы --- */
@media(max-width:900px){
  /* iOS зумит страницу при фокусе, если шрифт поля < 16px */
  input[type=text],input[type=tel],input[type=email],input[type=number],input[type=search],
  input:not([type]),select,textarea{font-size:16px !important;}
  select{padding-right:34px !important;background-position:right 12px center;text-overflow:ellipsis;}
  /* чекбоксы опций: подпись в 2 строки больше не наезжает на соседнюю */
  .cfg label.chk,.ppkopts label,.chk{display:flex !important;align-items:flex-start;gap:9px;
    line-height:1.35 !important;padding:7px 0;min-height:auto !important;font-size:13px;}
  .cfg label.chk input,.ppkopts label input,.chk input{flex:0 0 auto;margin:1px 0 0;width:18px;height:18px;}
  .ppkopts{display:block;}
  /* поля конфигуратора на всю ширину, кнопка — крупная тач-цель */
  .cfg .r2,.cfg .r3{grid-template-columns:1fr !important;}
  .cfg .go,.cfg button.go{width:100%;min-height:50px;font-size:15.5px;}
  .cfg .hfile2{min-height:48px;}
  .vs-filelist__item{font-size:13px;padding:9px 11px;}
  .vs-filelist__rm{min-width:30px;min-height:30px;}
}

/* --- 7. Читаемость мелкого текста --- */
@media(max-width:900px){
  .hd__tel span,.top__addr,.prow__badge{font-size:11.5px !important;}
  small,.agree,small.agree,.vs-choice__hint{font-size:12px !important;line-height:1.45;}
  .dpf__lbl{font-size:11.5px !important;}
}

/* --- 8. Тач-цели не меньше ~44px --- */
@media(max-width:900px){
  .vsdrawer__x{width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:26px;margin-right:-8px;}
  .vsdrawer__body a,.vsacc__c a{min-height:40px;display:flex;align-items:center;}
  .top__addr a{display:inline-block;padding:3px 0;}
  .vsn-article__back,.obj-link{display:inline-block;padding:6px 0;}
  .hd__cart{min-width:46px;justify-content:center;}
  .heroDots i{width:12px;height:12px;}
  .heroDots{gap:10px;padding:6px 0;}
}

/* --- 9. Плавающие элементы внизу: cookie + уведомление + чат Jivo лежали друг на друге.
       Раскладываем стопкой: чат (правый нижний угол) → уведомление → cookie. --- */
@media(max-width:900px){
  #vsRecon{left:10px !important;right:92px !important;bottom:10px !important;
    padding:10px 34px 10px 13px !important;font-size:12.5px !important;line-height:1.4 !important;border-radius:12px !important;}
  #vsRecon button,#vsRecon .x,#vsRecon [onclick]{min-width:34px;min-height:34px;}
  #coockie-modal{bottom:112px !important;}
}
@media(max-width:560px){
  #vsRecon{font-size:12px !important;padding:9px 32px 9px 12px !important;}
  #coockie-modal{bottom:104px !important;}
}

/* --- 10. Плитки подкатегорий: ровная сетка, картинки одной высоты --- */
@media(max-width:900px){
  .sub-photo{align-items:stretch;gap:12px;}
  .sub-photo .scard,.scard{display:flex;flex-direction:column;height:100%;}
  .scard__im,.scard .im{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden;}
  .scard__im img,.scard img{width:100%;height:100%;object-fit:contain;}
}

/* --- 11. Мелочи --- */
@media(max-width:900px){
  /* якорные переходы не должны прятать заголовок под липкой шапкой */
  :target,h1,h2,.psec{scroll-margin-top:120px;}
  /* длинные ссылки/коды в описаниях */
  .p26desc a,.vart a,.vsx a{overflow-wrap:anywhere;}
  /* списки в описаниях: текст не заезжает под маркер */
  .p26desc ul,.vart ul,.vsx ul{padding-left:20px;}
  .p26desc li,.vart li,.vsx li{padding-left:2px;}
}

/* --- 12. Пакет 2: блок подбора привода, счётчики, ссылки в шапке --- */
@media(max-width:900px){
  /* «Подбор привода» на категории электроприводов: строка не сжималась и выпирала за экран */
  .vssel,.vssel__row{max-width:100%;min-width:0;}
  .vssel__row{flex-wrap:wrap !important;gap:8px;}
  .vssel__row>*,.vssel label,.vssel select,.vssel input{flex:1 1 100% !important;min-width:0 !important;max-width:100% !important;width:100% !important;box-sizing:border-box;}
  /* счётчики товаров в плитках подкатегорий */
  .scard span,.sub-photo span,.scard__n{font-size:11.5px !important;}
  /* адрес и почта в верхней плашке — нормальная зона нажатия */
  .top__addr a,.hd__mail,.top__addr a.m{display:inline-block;padding:5px 0;min-height:32px;line-height:22px;}
}

/* --- 13. Панель фильтра каталога (#brzFilter): строка «счётчик + сортировка + сброс»
       была nowrap (627px) и распирала блок на телефоне --- */
@media(max-width:900px){
  #brzFilter{max-width:100% !important;min-width:0;overflow:hidden;}
  #brzFilter .bf-head{flex-wrap:wrap !important;gap:8px;}
  #brzFilter .bf-title{flex:1 1 100%;min-width:0;}
  #brzFilter .bf-right{flex:1 1 100% !important;width:100%;max-width:100%;min-width:0;
    flex-wrap:wrap !important;justify-content:flex-start;gap:8px;}
  #brzFilter .bf-right>*{min-width:0;max-width:100%;}
  #brzFilter .bf-sort,#brzFilter select{flex:1 1 auto;min-width:0;max-width:100%;}
  #brzFilter .bf-g{flex-wrap:wrap !important;}
  #brzFilter .bf-l{flex:1 1 100%;min-width:0;}
  #brzFilter .bf-chips{max-width:100%;min-width:0;}
  #brzFilter .bf-chips button,#brzFilter .bf-chips label{min-height:34px;}
}
