/* ===== LSV2 REV12: fixes after REV11 break (361-560 only) ===== */
@media (min-width:361px) and (max-width:560px){

  /* Stories: keep circles aligned even with 2-line labels */
  html.ls-v2 .ls-stories__list{ align-items:flex-start !important; }
  html.ls-v2 .ls-stories__item{ display:flex; flex-direction:column; align-items:center; }
  html.ls-v2 .ls-stories__label{
    min-height:28px;
    line-height:14px;
    display:flex;
    justify-content:center;
    text-align:center;
  }

  /* Help button: 125px, no wrap, icon 17.42 */
  html.ls-v2 .ls-helpchoose-btn{
    width:125px !important;
    height:40px !important;
    white-space:nowrap !important;
    flex-wrap:nowrap !important;
    gap:8px !important;
    padding:0 10px !important;
  }
  html.ls-v2 .ls-helpchoose-btn__icon,
  html.ls-v2 .ls-helpchoose-btn__icon svg{
    width:17.42px !important;
    height:17.42px !important;
    flex:0 0 17.42px !important;
  }

  /* Logo: centered 80x40, hide extra text */
  html.ls-v2 .logo-title.mobile{ display:none !important; }
  html.ls-v2 header.header > .container-fluid{ position:relative; }
  html.ls-v2 header.header .header__logo{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:80px !important;
    height:40px !important;
    margin:0 !important;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  html.ls-v2 header.header .header__logo img{
    width:80px !important;
    height:40px !important;
    object-fit:contain;
    display:block;
  }

  /* Menu: padding 20 and gap 20 */
  html.ls-v2 .ls-menu560{
    padding:0 20px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:20px !important;
  }

  /* Search: button inside input */
  html.ls-v2 .ls-menu560__search-control{ position:relative !important; height:50px !important; }
  html.ls-v2 .ls-menu560__search-input{
    height:50px !important;
    width:100% !important;
    padding-right:110px !important;
  }
  html.ls-v2 .ls-menu560__search-btn{
    position:absolute !important;
    top:6px !important;
    right:6px !important;
    height:38px !important;
    margin:0 !important;
  }

  /* Catalog button: 50px height, full width */
  html.ls-v2 .ls-menu560__catalog{
    text-decoration:none !important;
    width:100% !important;
    height:50px !important;
  }

  /* Replace search icon in menu icons row (search handled by input) */
  html.ls-v2 .header__nav-acc-btn.js-search-trigger{ display:none !important; }

  /* Make cart in menu icons row look like capsule */
  html.ls-v2 .header__nav-cart-btn{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    padding:0 12px !important;
    min-height:44px !important;
    border:1px solid rgba(0,0,0,.08) !important;
    border-radius:6px !important;
    background:#fff !important;
    text-decoration:none !important;
  }
  html.ls-v2 .header__nav-cart-btn .header__nav-cart-total{
    display:flex;
    flex-direction:column;
    gap:2px;
    font-size:12px;
    line-height:14px;
    font-weight:500;
    color:#0F596D;
  }
}

/* ===========================
   LSV2 REV13 (UI polish)
   Only v2 + <=560
=========================== */
@media (max-width:560px){

  /* Лого: как ты нашёл в консоли */
  html.ls-v2 .header__logo img,
  html.ls-v2 .header__logo svg{
    max-height: calc(100% - 0.5rem) !important;
  }
  /* Скрыть подпись у лого (та самая строка справа) */
  html.ls-v2 .logo-title.mobile{
    display:none !important;
  }

  /* Кнопка "Поможем выбрать": 125px ширина, 2 строки, иконка 17.42 */
  html.ls-v2 .ls-helpchoose-btn{
    width:125px !important;
    height:40px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    padding:0 10px !important;
    text-align:center !important;
  }
  html.ls-v2 .ls-helpchoose-btn span{
    white-space:normal !important;
    line-height:14px !important;
    font-size:12px !important;
    font-weight:500 !important;
  }
  html.ls-v2 .ls-helpchoose-btn svg,
  html.ls-v2 .ls-helpchoose-btn img{
    width:17.42px !important;
    height:17.42px !important;
    flex:0 0 17.42px !important;
  }

  /* Stories: чтобы кружки НЕ прыгали из-за 2 строк */
  html.ls-v2 .ls-stories__list{
    align-items:flex-start !important;
  }
  html.ls-v2 .ls-stories__label{
    min-height:28px !important;
    line-height:14px !important;
    display:flex;
    justify-content:center;
    text-align:center;
  }

  /* ====== Меню (верхний блок) ====== */

  /* Убираем глобальные паддинги/бордеры у группы кнопок */
  html.ls-v2 .header__nav-group--acc_action_cart{
    padding:0 !important;
    border-bottom:0 !important;
  }

  /* Делаем action-кнопки такими же, как acc-кнопка */
  html.ls-v2 .header__nav-action{
    display:flex !important;
    gap:10px !important;
    border:0 !important;
  }
  html.ls-v2 .header__nav-action-btn{
    width:40px !important;
    height:40px !important;
    border-radius:6px !important;
    border:1px solid #e8eaf3 !important;
    background:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
  }
  html.ls-v2 .header__nav-acc-btn{
    width:40px !important;
    height:40px !important;
    border-radius:6px !important;
    border:1px solid #e8eaf3 !important;
    background:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
  }

  /* Наша корзина вместо лупы (115x40) */
  html.ls-v2 .ls-v2-cart-btn{
    width:115px !important;
    height:40px !important;
    border-radius:6px !important;
    border:1px solid #e8eaf3 !important;
    background:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    padding:0 10px !important;
    text-decoration:none !important;
    color:#0F596D !important;
    font-size:12px !important;
    font-weight:500 !important;
    white-space:nowrap !important;
  }
  html.ls-v2 .ls-v2-cart-btn img{
    width:20px !important;
    height:20px !important;
    display:block;
  }

  /* Блок ls-menu560 — без левых/правых марджинов, всё выравниваем паддингом 20 */
  html.ls-v2 .ls-menu560{
    padding:0 20px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:20px !important;
  }

  /* Поиск: кнопка ВНУТРИ инпута */
  html.ls-v2 .ls-menu560__search{
    margin:0 0 0 0 !important;
  }
  html.ls-v2 .ls-menu560__search-wrap{
    position:relative !important;
    width:100% !important;
    height:50px !important;
  }
  html.ls-v2 .ls-menu560__search-input{
    width:100% !important;
    height:50px !important;
    border-radius:6px !important;
    border:1px solid rgba(0,0,0,.12) !important;
    padding:0 118px 0 14px !important; /* место под кнопку 100 */
    font-size:14px !important;
  }
  html.ls-v2 .ls-menu560__search-btn{
    position:absolute !important;
    right:6px !important;
    top:6px !important;
    width:100px !important;
    height:37px !important;
    border-radius:6px !important;
    background:#0F596D !important;
    color:#fff !important;
    border:none !important;
    font-weight:500 !important;
    font-size:14px !important;
    line-height:14px !important;
  }

  /* Кнопка Каталог — без марджинов (ты просил) */
  html.ls-v2 .ls-menu560__catalog{
    text-decoration:none !important;
    margin:0 !important;
    width:100% !important;
    height:50px !important;
    border-radius:6px !important;
    background:#99FFB9 !important;
    color:#0F596D !important;
    border:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    font-weight:500 !important;
    font-size:16px !important;
  }
}

/* ===========================
   LSV2 REV14 FIX (menu/help/stories)
   only v2 + <=560
=========================== */
@media (max-width:560px){

  /* --- STORIES: восстановить вид (98/86 + кольца) --- */
  html.ls-v2 .ls-stories{ padding:40px 15px !important; }
  html.ls-v2 .ls-stories__list{
    display:flex !important;
    gap:20px !important;
    overflow:auto !important;
    padding:0 !important;
    margin:0 !important;
    align-items:flex-start !important; /* кружки на одной линии */
    -webkit-overflow-scrolling:touch;
  }
  html.ls-v2 .ls-stories__item{
    width:98px !important;
    flex:0 0 98px !important;
    display:flex;
    flex-direction:column;
    align-items:center;
  }
  html.ls-v2 .ls-stories__ring{
    width:98px !important;
    height:98px !important;
    border-radius:50% !important;
    padding:3px !important; /* толщина кольца */
    background: linear-gradient(225deg, #8A3BEE 1.92%, #F200B7 47.12%, #FE9402 82.69%) !important;
    box-sizing:border-box;
  }
  /* просмотрено */
  html.ls-v2 .ls-stories__item.is-viewed .ls-stories__ring,
  html.ls-v2 .ls-stories__item[data-viewed="1"] .ls-stories__ring{
    background:#C6C6C6 !important;
  }
  html.ls-v2 .ls-stories__inner{
    width:100% !important;
    height:100% !important;
    border-radius:50% !important;
    background:#fff !important; /* белое кольцо */
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  html.ls-v2 .ls-stories__img{
    width:86px !important;
    height:86px !important;
    border-radius:50% !important;
    object-fit:cover !important;
    display:block;
  }
  html.ls-v2 .ls-stories__label{
    margin-top:8px !important;
    font-family:Roboto, Arial, sans-serif !important;
    font-weight:500 !important;
    font-size:12px !important;
    line-height:14px !important;
    color:#0F596D !important;
    text-align:center !important;
    min-height:28px !important; /* 2 строки */
    display:flex;
    justify-content:center;
  }

  /* --- Help button: текст в 2 строки, иконка НЕ трогаем --- */
  html.ls-v2 .ls-helpchoose-btn{
    width:125px !important;
    height:40px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    padding:0 10px !important;
  }
  html.ls-v2 .ls-helpchoose-btn__text{
    line-height:14px !important;
    font-size:12px !important;
    font-weight:500 !important;
    color:#0F596D !important;
    white-space:normal !important;
    text-align:left !important;
  }
  html.ls-v2 .ls-helpchoose-btn svg,
  html.ls-v2 .ls-helpchoose-btn img{
    width:17.42px !important;
    height:17.42px !important;
    flex:0 0 17.42px !important;
  }

  /* --- MENU FIXES --- */

  /* убрать padding у search (у тебя был 0 15px 12px) */
  html.ls-v2 .ls-menu560__search{
    padding:0 0 12px !important;
  }

  /* убрать пустой отступ от .ls-menu560__search-control */
  html.ls-v2 .ls-menu560__search-control{
    height:0 !important;
    padding:0 !important;
    margin:0 !important;
    overflow:hidden !important;
  }

  /* скрыть разделитель линии */
  html.ls-v2 .header__nav-action-line{
    display:none !important;
  }

  /* gap в row action кнопок */
  html.ls-v2 .header__nav-action{
    gap:5px !important;
  }

  /* убрать padding/border-bottom у группы */
  html.ls-v2 .header__nav-group--acc_action_cart{
    padding:0 !important;
    border-bottom:0 !important;
  }

  /* корзина: как в макете */
  html.ls-v2 .ls-v2-cart-btn{
    margin-left:-3px !important;
    padding:10px !important;      /* внутренние отступы 10 */
    gap:7px !important;           /* расстояние иконка-текст */
    align-items:center !important;
  }
  html.ls-v2 .ls-v2-cart-text{ display:flex; flex-direction:column; line-height:16px; }
  html.ls-v2 .ls-v2-cart-top{
    font-family:Roboto, Arial, sans-serif !important;
    font-weight:400 !important;
    font-size:14px !important;
    color:rgba(0,0,0,.4) !important;
  }
  html.ls-v2 .ls-v2-cart-sum{
    font-family:Roboto, Arial, sans-serif !important;
    font-weight:400 !important;
    font-size:14px !important;
    color:#000 !important;
  }
}

/* ========================================================================== */
/* LSV2 REV17 — Stories ring + remove extra wrapper + Contacts modal fullscreen */
/* ========================================================================== */
@media (max-width:560px){
  /* menu container spacing */
  html.ls-v2 .ls-menu560{ margin-bottom:20px !important; }

  /* ------------------ STORIES (instagram-like ring) ------------------ */
  html.ls-v2 .ls-stories{
    margin:0 !important;
    padding:40px 15px !important;
  }
  /* лишняя обёртка: не должна давать отступы/фон */
  html.ls-v2 .ls-stories__inner{
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    display: contents;
  }
  html.ls-v2 .ls-stories__list{
    padding:0 !important;
    margin:0 !important;
    display:flex !important;
    gap:20px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    align-items:flex-start !important;
  }
  html.ls-v2 .ls-stories__list::-webkit-scrollbar{ display:none; }
  html.ls-v2 .ls-stories__item{
    min-width:98px !important;
    max-width:98px !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
  }

  /* круг 98: градиент/серый + паддинг 3 (кольцо). Внутри img 86 + белая рамка 3 */
  html.ls-v2 .ls-stories__circle{
    width:98px !important;
    height:98px !important;
    border-radius:50% !important;
    padding:3px !important;
    box-sizing:border-box !important;
    background: linear-gradient(225deg, #8A3BEE 1.92%, #F200B7 47.12%, #FE9402 82.69%) !important;
    box-shadow:none !important;
    overflow:visible !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  html.ls-v2 .ls-stories__item.is-viewed .ls-stories__circle,
  html.ls-v2 .ls-stories__item[data-viewed="1"] .ls-stories__circle{
    background:#C6C6C6 !important;
  }
  html.ls-v2 .ls-stories__circle img,
  html.ls-v2 .ls-stories__circle > span{
    width: clamp(86px, calc(90px - (4 * (100vw - 360px) / 200)), 90px) !important;
    height: clamp(86px, calc(90px - (4 * (100vw - 360px) / 200)), 90px) !important;
    border-radius:50% !important;
    display:block !important;
    object-fit:cover !important;
    border:3px solid #fff !important;
    border-width: clamp(2px, calc(2px + (1 * (100vw - 360px) / 200)), 3px) !important;
    box-sizing:border-box !important;
    overflow:hidden;
    background:#e8eaf3;
  }

  html.ls-v2 .ls-stories__label{
    margin-top:8px !important;
    font-family: Roboto, Arial, sans-serif !important;
    font-weight:500 !important;
    font-size:12px !important;
    line-height:14px !important;
    color:#0F596D !important;
    text-align:center !important;
    min-height:28px !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
  }

  /* ------------------ CONTACTS (Поможем выбрать) — fullscreen sheet ------------------ */
  html.ls-v2 .header__call-offcanvas{
    background:#fff !important;            /* убрать тёмный фон */
    padding:0 !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
  }
  html.ls-v2 .header__call-offcanvas-in{
    width:100% !important;
    max-width:none !important;
    height:100% !important;
    border-radius:0 !important;
    padding:0 !important;
    background:#fff !important;
  }
  /* наш хедер (JS добавит) */
  html.ls-v2 .ls-call560{
    height:100% !important;
    display:flex !important;
    flex-direction:column !important;
  }
  html.ls-v2 .ls-call560__head{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding:20px 20px 12px !important;
    border-bottom:1px solid rgba(0,0,0,.08) !important;
  }
  html.ls-v2 .ls-call560__title{
    font-family: Roboto, Arial, sans-serif !important;
    font-weight:500 !important;
    font-size:18px !important;
    line-height:22px !important;
    color:#0F596D !important;
  }
  html.ls-v2 .ls-call560__close{
    width:40px !important;
    height:40px !important;
    border:0 !important;
    background:transparent !important;
    color:#0F596D !important;
    font-size:28px !important;
    line-height:40px !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  html.ls-v2 .ls-call560__body{
    padding:16px 20px 20px !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch;
    flex:1 1 auto;
  }

  html.ls-v2 .header__call-menu{
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
  }
  html.ls-v2 .header__call-menu li{ margin:0 !important; }

  /* скрыть старую кнопку Закрыть внизу списка */
  html.ls-v2 .header__call-menu button.header__call-link.js-call-trigger{
    display:none !important;
  }

  html.ls-v2 .header__call-link{
    padding:14px 12px !important;
    border-radius:10px !important;
    border:1px solid rgba(0,0,0,.10) !important;
    background:#fff !important;
    color:#0F596D !important;
    text-decoration:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
  }
  html.ls-v2 .header__call-link svg{ width:18px !important; height:18px !important; flex:0 0 18px !important; }
}

/* ========================================================================== */
/* ===========================
   LSV2 REV18 HOTFIX
   <=560, only v2
=========================== */

@media (max-width:1199px){
html.ls-v2 .header__catalog-menu1 .header__catalog-link.catalog-main{
  display:none !important;
}
html.ls-v2 .header__catalog-menu1 .header__catalog-link.catalog-main *{
  pointer-events:none !important;
}
html.ls-v2 .header__catalog-menu231 {
  display:none !important;

}
}
@media (max-width:560px){

  /* 1) убрать лишний пункт Каталог в списке (тот что ты показал) */
  html.ls-v2 .header__catalog-menu1 .header__catalog-link.catalog-main{
    display:none !important;
  }
  html.ls-v2 .header__catalog-menu1 .header__catalog-link.catalog-main *{
    pointer-events:none !important;
  }

  /* 2) Stories: убрать “лишний родитель” визуально */
  html.ls-v2 .ls-stories__inner{
    display: contents !important; /* wrapper не влияет на layout */
  }

  /* 3) Stories: обводка тоньше
     (делаем градиент тоньше, белую рамку чуть толще, чтобы сохранить 86px картинку) */
  html.ls-v2 .ls-stories__ring{
    padding:2px !important; /* было толще */
  }
  html.ls-v2 .ls-stories__inner-ring,
  html.ls-v2 .ls-stories__ring2,
  html.ls-v2 .ls-stories__inner2,
  html.ls-v2 .ls-stories__inner{
    /* белая подложка вокруг картинки */
    background:#fff !important;
  }
  /* если есть отдельный inner wrapper вокруг img — делаем его с 4px */
  html.ls-v2 .ls-stories__ring > *{
    padding:4px !important;
    border-radius:50% !important;
    box-sizing:border-box !important;
  }
  html.ls-v2 .ls-stories__img{
    width:86px !important;
    height:86px !important;
    border-radius:50% !important;
    object-fit:cover !important;
    display:block;
  }

  /* 4) Меню: родитель задаёт gap — значит у детей убираем собственные марджины */
  html.ls-v2 .ls-menu560{
    margin-bottom:20px !important;
  }
  html.ls-v2 .ls-menu560__search,
  html.ls-v2 .ls-v2-cart-btn{
    margin:0 !important;     /* главное */
  }
  html.ls-v2 .ls-menu560__search{
    padding:0 !important;    /* убрать 0 15px 12px */
  }

  /* 5) Модалка: внешний вид как на макете “Закрыть ×” справа */
  html.ls-v2 .ls-callv2{ padding: 10px 0 20px !important; }
  html.ls-v2 .ls-callv2__head{
    display:flex; justify-content:flex-end; padding: 0 20px 10px;
  }
  html.ls-v2 .ls-callv2__close{
    background:transparent; border:0; padding:8px 0;
    display:flex; align-items:center; gap:10px;
    font-weight:500; font-size:16px;
  }
  html.ls-v2 .ls-callv2__list{ padding: 0 20px; display:flex; flex-direction:column; gap:10px; }
  html.ls-v2 .ls-callv2__item{
    height:50px;
    border:1px solid rgba(0,0,0,.08);
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 14px;
    text-decoration:none;
    color:#0F596D;
    background:#fff;
    font-size:14px;
  }
  html.ls-v2 .ls-callv2__left{ display:flex; align-items:center; gap:10px; min-width:0; }
  html.ls-v2 .ls-callv2__ico{ width:20px; height:20px; display:block; }
  html.ls-v2 .ls-callv2__txt{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  html.ls-v2 .ls-callv2__copy{ border:0; width:100%; }
}

/* ===== LSV2 REV25: 360 header + hero widths ===== */
@media (max-width: 360px){

  /* Hero/carousel width 300 (v2 only) */
  html.ls-v2 .intro.ls-intro-home > .container-fluid{
    padding-left:30px !important;
    padding-right:30px !important;
  }
  html.ls-v2 .intro.ls-intro-home .intro__swiper{
    max-width:300px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  html.ls-v2 .ls-hero560{
    max-width:300px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  html.ls-v2 .ls-hero560__actions{
    width:300px !important;
    max-width:100% !important;
  }
  html.ls-v2 .ls-hero560__btn{
    width:300px !important;
    max-width:100% !important;
    font-size:14px !important;
    line-height:17px !important;
    white-space:nowrap !important;
  }

  /* Helpchoose: 90px width and 9px text (override REV13) */
  html.ls-v2 .ls-helpchoose-btn{
    width:90px !important;
    min-width:90px !important;
  }
  html.ls-v2 .ls-helpchoose-btn span{
    font-size:9px !important;
    line-height:11px !important;
  }

  /* Header top: keep exact 53px gap between logo and helpchoose (90 + 53 = 143) */
  html.ls-v2 .header__top{
    position:relative !important;
    min-height:40px !important;
  }
  html.ls-v2 .header__mobile-btns{
    position:absolute !important;
    right:0 !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    z-index:5 !important;
  }
  html.ls-v2 .header__logo{
    position:absolute !important;
    right:143px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    z-index:4 !important;
    margin:0 !important;
  }
}

/* ===== LSV2 REV26: <360 fixes (stories ring thinner + call offcanvas) ===== */
@media (max-width: 360px){

  /* 1) FIX: position:fixed offcanvas breaks if any ancestor has transform.
        In REV25 we used translateY() on .header__mobile-btns to center it,
        but .header__call-offcanvas lives inside .header__mobile-btns.
        Remove transforms and center via flex stretching. */
  html.ls-v2 .header__mobile-btns{
    top: 0 !important;
    bottom: 0 !important;
    height: auto !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
  }
  html.ls-v2 .header__logo{
    top: 0 !important;
    bottom: 0 !important;
    height: auto !important;
    transform: none !important; /* safe */
    display: flex !important;
    align-items: center !important;
  }

  /* 2) STORIES: circle 75x75, thinner ring */
  html.ls-v2 .ls-stories__item{
    min-width: 75px !important;
    max-width: 75px !important;
  }
  html.ls-v2 .ls-stories__ring{
    width: 75px !important;
    height: 75px !important;
    padding: 2px !important; /* thinner than default */
  }
  /* previously we used inner padding on ring children — disable on <=360 */
  html.ls-v2 .ls-stories__ring > *{
    padding: 0 !important;
  }
  html.ls-v2 .ls-stories__inner{
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    background: #fff !important;
    overflow: hidden !important;
  }
  html.ls-v2 .ls-stories__img{
    width: 100% !important;  /* fill inner, remove extra white ring */
    height: 100% !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    display: block !important;
  }
  html.ls-v2 .ls-stories__label{
    font-size: 9px !important;
    line-height: 11px !important;
  }
}

/* ===== LSV2 REV27: <360 stories ring + contacts icons/email box ===== */
@media (max-width: 360px){

  /* STORIES: correct selectors (circle), thinner ring, keep spacing */
  html.ls-v2 .ls-stories__list{
    gap: 0 !important; /* avoid inconsistent flex-gap behaviour */
  }
  html.ls-v2 .ls-stories__item{
    min-width: 75px !important;
    max-width: 75px !important;
    margin-right: 16px !important; /* spacing between circles */
  }
  html.ls-v2 .ls-stories__item:last-child{ margin-right: 0 !important; }

  html.ls-v2 .ls-stories__circle{
    width: 75px !important;
    height: 75px !important;
    padding: 2px !important; /* gradient ring thickness */
    box-sizing: border-box !important;
  }
  html.ls-v2 .ls-stories__circle img,
  html.ls-v2 .ls-stories__circle > span{
    width: 100% !important;
    height: 100% !important;
    border: 2px solid #fff !important; /* white ring thickness */
    box-sizing: border-box !important;
  }

  /* CONTACTS: ensure icons visible on <=360 (supports both <img> and bg spans) */
  html.ls-v2 .ls-callv2__ico,
  html.ls-v2 .ls-callv2__icoimg{
    width: 15px !important;
    height: 15px !important;
    flex: 0 0 15px !important;
    display: block !important;
  }
  html.ls-v2 .ls-callv2__icoimg{
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
  }

  /* Email row must look like other items (border + background) */
  html.ls-v2 .ls-callv2__item.ls-callv2__copy{
    border: 1px solid rgba(0,0,0,.08) !important;
    background: #fff !important;
  }
}

@media (max-width: 560px){
  /* REV27: keep email row boxed even if earlier rules set border:0 */
  html.ls-v2 .ls-callv2__item.ls-callv2__copy{
    border: 1px solid rgba(0,0,0,.08) !important;
    background: #fff !important;
  }
  /* REV27: if icons are implemented as bg-spans in JS, ensure they render */
  html.ls-v2 .ls-callv2__icoimg{
    display: block !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
  }
}


/* ===== LSV2 REV28: modal icons & email layout (<=360) ===== */
/* icon sprites from макет (SVG files you upload to /image/ls/icons/) */
html.ls-v2 .header__call-offcanvas .ls-callv2__icoimg{
  display:inline-block;
  width:18px;
  height:18px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  flex:0 0 auto;
}
html.ls-v2 .header__call-offcanvas .ls-ico-phone{ background-image:url('../image/ls/icons/phone.svg'); }
html.ls-v2 .header__call-offcanvas .ls-ico-callback{ background-image:url('../image/ls/icons/callback.svg'); }
html.ls-v2 .header__call-offcanvas .ls-ico-email{ background-image:url('../image/ls/icons/email.svg'); }
html.ls-v2 .header__call-offcanvas .ls-ico-copy{ background-image:url('../image/ls/icons/copy.svg'); }
html.ls-v2 .header__call-offcanvas .ls-ico-whatsapp{ background-image:url('../image/ls/icons/whatsapp.svg'); }
html.ls-v2 .header__call-offcanvas .ls-ico-telegram{ background-image:url('../image/ls/icons/telegram.svg'); }
html.ls-v2 .header__call-offcanvas .ls-ico-vk{ background-image:url('../image/ls/icons/vk.svg'); }
html.ls-v2 .header__call-offcanvas .ls-ico-max{ background-image:url('../image/ls/icons/max.svg'); }

@media (max-width: 360px){
  html.ls-v2 .header__call-offcanvas .ls-callv2__icoimg{ width:15px; height:15px; }

  /* ensure vertical centering everywhere */
  html.ls-v2 .header__call-offcanvas .ls-callv2__item{ display:flex; align-items:center; }
  html.ls-v2 .header__call-offcanvas .ls-callv2__left{ display:flex; align-items:center; gap:10px; width:100%; min-width:0; }

  /* email row should look like other items and copy icon should sit near text */
  html.ls-v2 .header__call-offcanvas .ls-callv2__copy{
    border:1px solid rgba(0,0,0,.08) !important;
    background:#fff;
  }
  html.ls-v2 .header__call-offcanvas .ls-callv2__email{
    display:flex;
    align-items:center;
    gap:6px;
    min-width:0;
  }
  html.ls-v2 .header__call-offcanvas .ls-callv2__email .ls-callv2__txt{
    display:inline-block;
    line-height:21px;
    color:#000;
  }
  html.ls-v2 .header__call-offcanvas .ls-callv2__email .ls-ico-copy{
    margin-left:0;
  }
}

/* ===== LSV2 REV29: modal text color (mobile) ===== */
@media (max-width: 560px){
  html.ls-v2 .header__call-offcanvas .ls-callv2__item,
  html.ls-v2 .header__call-offcanvas .ls-callv2__item a,
  html.ls-v2 .header__call-offcanvas .ls-callv2__item button,
  html.ls-v2 .header__call-offcanvas .ls-callv2__txt{
    color:#000 !important;
  }
}

/* ===== LSV2 REV32: header button visibility + duplicate menu list (<=560) ===== */
@media (max-width:560px){
  /* В v2 оставляем только широкую кнопку и корзину (чтобы не уезжало/не обрезалось) */
  html.ls-v2 .header__mobile-btns .ls-call-btn,
  html.ls-v2 .header__mobile-btns .ls-wa-btn{
    display:none !important;
  }

  /* На всякий случай: делаем кнопку видимой, даже если у темы есть ограничения */
  html.ls-v2 .header__mobile-btns .ls-helpchoose-btn{
    display:flex !important;
    flex:0 0 auto !important;
    max-width:100% !important;
  }

  /* Убираем дублирующий корневой список меню (оставляем тот, где есть .header__catalog-menu) */
  html.ls-v2 ul.header__catalog-menu1:not(.header__catalog-menu){
    display:none !important;
  }
}


/* ===== LSV2 REV34: keep helpchoose visible even if theme hides js-call-trigger buttons ===== */
@media (max-width: 560px) {
  /* new_style.css hides all button.header__sticky-btn.js-call-trigger; our helpchoose uses the same class. */
  html.ls-v2 .header__mobile-btns > button.header__sticky-btn.js-call-trigger.ls-helpchoose-btn {
    display: flex !important;
  }
}

/* ===== LSV2 REV35: helpchoose flex-direction row + email inline row (<=560) ===== */
@media (max-width: 560px) {
  /* Ensure icon + text are in a row (theme may set column) */
  html.ls-v2 .ls-helpchoose-btn {
    flex-direction: row !important;
  }

  /* Email text + copy icon should be in one line */
  html.ls-v2 .header__call-offcanvas .ls-callv2__email {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 7px !important;
    min-width: 0;
  }
}

/* ===== LSV2 REV36: hide duplicate account block in opened menu (<360) ===== */
@media (max-width: 359px) {
  html.ls-v2 .header__nav-offcanvas .header__nav-acc.ls-v2-dup {
    display: none !important;
  }
}

/* ========================================================================== */
/* LSV2 REV37 — fluid sizes (clamp) between 560 and 360                        */
/* ========================================================================== */
@media (max-width: 560px) {
  /* Helpchoose: keep exact at 560px, smoothly shrink down to 360px */
  /* html.ls-v2 .header__mobile-btns > button.header__sticky-btn.js-call-trigger.ls-helpchoose-btn {
    width: clamp(90px, calc(90px + 35 * ((100vw - 360px) / 200)), 125px) !important;
    min-width: clamp(90px, calc(90px + 35 * ((100vw - 360px) / 200)), 125px) !important;
  } */
  html.ls-v2 .header__mobile-btns > button.header__sticky-btn.js-call-trigger.ls-helpchoose-btn .ls-helpchoose-btn__text {
    font-size: clamp(9px, calc(9px + 3 * ((100vw - 360px) / 200)), 12px) !important;
    line-height: clamp(11px, calc(11px + 3 * ((100vw - 360px) / 200)), 14px) !important;
  }
}


/* ===== LSV2 REV40: 361–386 fixes (hero buttons column + 4 stories preview) ===== */
@media (min-width:361px) and (max-width:386px){
  /* Hero buttons near carousel: stack like <=360 */
  html.ls-v2 .ls-hero560__actions{
    flex-direction:column !important;
    width:300px !important;
    max-width:100% !important;
  }
  html.ls-v2 .ls-hero560__btn{
    width:300px !important;
    max-width:100% !important;
  }

  /* Stories: show 4 with the 4th partially clipped */
  html.ls-v2 .ls-stories__list{ gap:0 !important; }
  html.ls-v2 .ls-stories__item{
    min-width:75px !important;
    max-width:75px !important;
    flex:0 0 75px !important;
    margin-right:16px !important;
  }
  html.ls-v2 .ls-stories__item:last-child{ margin-right:0 !important; }

  html.ls-v2 .ls-stories__circle{
    width:75px !important;
    height:75px !important;
    padding:2px !important;
    border-radius:50% !important;
    box-sizing:border-box !important;
  }
  html.ls-v2 .ls-stories__circle img,
  html.ls-v2 .ls-stories__circle > span{
    width:100% !important;
    height:100% !important;
    border:2px solid #fff !important;
    border-radius:50% !important;
    box-sizing:border-box !important;
  }
  html.ls-v2 .ls-stories__label{
    font-size:9px !important;
    line-height:11px !important;
    min-height:22px !important;
  }
}

/* ===== LSV2 REV40: contacts email copy feedback ===== */
@media (max-width:560px){
  html.ls-v2 .ls-callv2__item.ls-callv2__copy.is-copied{
    border-color:#99FFB9 !important;
    box-shadow:0 0 0 2px rgba(153,255,185,.35) !important;
  }
  html.ls-v2 .ls-callv2__item.ls-callv2__copy.is-copied .ls-callv2__txt::after{
    content:"  •  Скопировано";
    font-weight:400;
    font-size:12px;
    opacity:.75;
  }
}
