/* ⚠️ 19.08.2026 — ФАЙЛ ВОССТАНОВЛЕН ИЗ ВЕРСИИ ДО 12.08.
   Коммит e7e2d71 («вычищен мёртвый CSS выдачи, 690→322 строки») прогнал файл
   через инструмент, который рвал строки по запятым. В многострочных комментариях
   это уничтожило закрытия и следующие за ними селекторы — сразу в четырёх местах.
   Последствие было тихим: файл отдавался с кодом 200, но браузер сваливал весь
   остаток в незакрытый @media (min-width: 1367px). На десктопе выдача выглядела
   нормально, а на телефоне стилей не было вовсе — чипы разделов рендерились
   синими ссылками темы (замечание #689), не работали сводка, подсказки,
   подсветка совпадений и правило #389.
   Восстановлена рабочая версия до чистки плюс блок переключателя вида, который
   тот коммит добавил по делу. Мёртвый CSS здесь снова есть — чистить его нужно
   заново и вручную, отдельной задачей, с проверкой парсинга после. */

/**
 * JV Search Results Page Styles
 * Based on category page design
 */

/* Hide search form on results page */
#product-search .search-container {
  display: none !important;
}

/* Override mango.css top-header spacing on search page */
#product-search .top-header {
  margin-bottom: 15px !important;
}

#product-search  .product-item__container {
  /* overflow:hidden; */
  /* border-radius: 40px; */
}
 #product-search .product-layout:not(.swiper-slide) {
       overflow: hidden;
    border-radius: 20px;
    margin-bottom: 0px;
    margin-left: 0px;
    background-color: #f2f3f6;
}
#product-search {
  background: #fff;
}

/* Одна левая вертикаль с каталогом (см. jv-category.css): кромку задаёт
   контейнер — max-width 1880, центрирование и 20px внутреннего отступа,
   а padding внешнего .page-wrapper (20px при ≤1890) гасим, чтобы не было
   двойного отступа. Раньше контейнер стоял с padding 0 и опирался на
   .page-wrapper: при ≤1890 выходило те же 20px, а шире (1920: обёртка без
   отступа) выдача начиналась на 20px, тогда как каталог и карточка — на 40. */
.page-wrapper:has(#product-search) {
  padding-left: 0;
  padding-right: 0;
}
.page-wrapper:has(#product-search) .site-footer {
  margin-left: 0;
  margin-right: 0;
}
#product-search .container {
  max-width: 1880px;
  margin: 0 auto;
  padding: 0 20px;
}
/* ≤540: кромку держит .page-wrapper (16px, custom.css), свои 20px контейнера
   гасим — ровно как у #product-category там же. */
@media (max-width: 540px) {
  #product-search .container {
    padding-left: 0;
    padding-right: 0;
  }
}

#product-search .catalog-container .navigation-title {
  margin: 0 20px;
}
.product-item__delay {
    padding: 8px;
    background: #fff;
    border-color: #f0f0f0;
    border-radius: 4px;
    border: none;
}
/* ===== BREADCRUMB ===== */
#product-search .navigation-content .breadcrumb {
  height: auto !important;
  background: transparent !important;
  gap: 0 !important;
  padding: 0px 0 0px !important;
  margin: 0 !important;
  border-radius: 0 !important;
  display: flex;
  align-items: center;
}

#product-search .navigation-content .breadcrumb > li {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center;
}

#product-search .navigation-content .breadcrumb > li:not(:last-child)::after {
  content: '/' !important;
  margin: 0 6px !important;
  color: var(--jv-text-muted) !important;
  font-size: 16px;
}

#product-search .navigation-content {
  padding: 19px 0 0px 0;
}

#product-search .navigation-content .breadcrumb > li > a {
  color: var(--jv-text-muted) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  transition: color 0.15s;
}

#product-search .navigation-content .breadcrumb > li > a:hover {
  color: var(--jv-accent) !important;
}

#product-search .navigation-content .breadcrumb > li:last-child,
#product-search .navigation-content .breadcrumb > li:last-child > span,
#product-search .navigation-content .breadcrumb > li:last-child > a {
  color: var(--jv-accent) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}

/* ===== SEARCH RESULTS TITLE ===== */
#product-search .navigation-title h1 {
  margin: 20px 0 40px;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.1;
  color: var(--jv-text-primary);
}

/* ===== TOOLBAR (sort/limit) ===== */
#product-search .catalog-toolbar__sort {
  margin: 0 20px 20px;
}

#product-search .catalog-toolbar__panel {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 15px 20px;
  background: var(--jv-bg-surface);
  border-radius: 15px;
  box-shadow: var(--jv-shadow-soft);
}

#product-search .toolbar-form__input {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* #571 · размер названия в выдаче: было 32px (legacy-макет) — приводим к каталогу 16px/600 */
#product-search .product-item .product-item__title a span {
    margin: 0;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    color: var(--jv-text-primary);
    min-height: 0;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    opacity: 1;
}
#product-search .product-item__title{
  /* #577: выравниваем заголовок по кромке описания (у него боковые 10px) */
  margin: 17px 10px 5px;
}

#product-search .product-item__title a {
   color: var(--jv-text-primary);
}
#product-search .product-item__description {
    margin: 0 10px 20px 10px;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    color: var(--jv-text-muted);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 28px;
}

#product-search .toolbar-form__input__title {
  font-size: 14px;
  font-weight: 500;
  color: var(--jv-text-primary);
  white-space: nowrap;
}

#product-search .toolbar-form__sort select,
#product-search .toolbar-form__limit select {
  min-width: 180px;
  padding: 8px 12px;
  border: 1.5px solid var(--jv-border);
  border-radius: 8px;
  font-size: 14px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.2s;
}

#product-search .toolbar-form__sort select:hover,
#product-search .toolbar-form__limit select:hover {
  border-color: var(--jv-accent);
}

#product-search .toolbar-form__toggle {
  margin-left: auto;
}

#product-search .toolbar-toggle {
  display: flex;
  gap: 5px;
}

/* ===== PRODUCT GRID ===== */
#product-search .catalog-section {
  margin: 0 20px 40px;
}

#product-search .catalog-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 20px;
}

/* ===== PAGINATION ===== */
#product-search .pagination {
  margin: 30px 20px;
  display: flex;
  justify-content: center;
}

#product-search .pagination > li > a,
#product-search .pagination > li > span {
  padding: 10px 15px;
  margin: 0 3px;
  border: 1.5px solid var(--jv-border);
  border-radius: 8px;
  color: var(--jv-text-primary);
  background: #fff;
  transition: all 0.2s;
}

#product-search .pagination > li.active > span,
#product-search .pagination > li > a:hover {
  background: var(--jv-accent);
  border-color: var(--jv-accent);
  color: #fff;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1600px) {
  #product-search .catalog-grid {
    grid-template-columns: repeat(5, 1fr);
  }
}

@media (max-width: 1366px) {
  #product-search .catalog-grid {
    grid-template-columns: repeat(6, 1fr);
  }
  #product-search .catalog-section {
    margin: 0 0px 0px;
}
      #product-search .product-item__container {
        width: 100%;
        padding: 0px;
        border-radius: 11px;
        }
  #product-search .product-item__image {
        width: 100%;
        height: 184px;
        border-radius: 0.543vw;
        overflow: hidden;
    }
  #product-search .product-item__image .image-wrap img {
    position: absolute;
    left: 50%;
    margin-bottom: 0;
    width: 184px;
    height: 184px;
}
     #product-search .product-item__model {
        right: 0.978vw;
        width: max-content;
        top: 174px;
    }
}

@media (max-width: 991px) {
  #product-search .catalog-grid {
    grid-template-columns: repeat(5, 1fr);
  }
  
  #product-search .navigation-title h1 {
    font-size: 26px;
  }
    #product-search .product-item__image .image-wrap img {
    position: absolute;
    left: 0%;
    margin-bottom: 0;
    width: 184px;
    height: 184px;
}
  #product-search .product-item .product-item__title a span {
    margin: 0;
    font-weight: 600;
    font-size: 15px;
    line-height: 19px;
    color: var(--jv-text-primary);
    min-height: 0;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    opacity: 1;
}
}

@media (max-width: 767px) {
  #product-search .catalog-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  #product-search .catalog-toolbar__panel {
    flex-direction: column;
    align-items: flex-start;
  }
  
  #product-search .toolbar-form__toggle {
    margin-left: 0;
    width: 100%;
  }
  
  #product-search .navigation-title h1 {
    font-size: 22px;
    margin: 15px 0 25px;
  }
}

@media (max-width: 576px) {
  #product-search .catalog-grid {
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    display: grid;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 40px;
    grid-template-columns: repeat(2, 1fr);
  }
  
  #product-search .catalog-section {
    margin: 0 0px 30px;
  }
  
  #product-search .catalog-toolbar__sort {
    margin: 0 15px 15px;
  }
     #product-search .product-item {
        padding: 7px;
        max-width: 100%;
    }
      #product-search .product-item__image .image-wrap img {
        position: absolute;
        left: 0%;
        margin-bottom: 0;
        width: 100%;
        top: 0;
        transform: none;
        height: auto;
        /* width: 85%; */
        /* height: auto; */
        /* max-height: 85%; */
        /* position: absolute; */
        /* top: 50%; */
        /* left: 50%; */
        /* transform: translate(-50%, -50%); */
        /* object-fit: contain; */
        /* border-radius: 10px; */
    }
  #product-search .product-item__image {
    display: block;
    width: 151px;
    height: 151px;
    position: relative;
    border-radius: 9px;
  }
  #product-search .product-item__model {
    right: 0.978vw;
    width: max-content;
    top: 264px;
  }
  #product-search .catalog-section__products {
    margin-top: 20px;
  }
      #product-search .product-item__model {
        right: 0.978vw;
        width: max-content;
        top: 134px;
    }
     #product-search  .product-item span.product-item__text_model {
        font-size: 12px;
        color: #999999;
        font-weight: 500;
        opacity: .6;
    }
}

/* ===== FIX: сломанная сетка результатов поиска =====
   Bootstrap-колонка #content.col-sm-12 в flex-.row без basis схлопывалась (≈20px),
   из-за чего .catalog-grid (1fr…) получал колонки 0px и карточки съезжали.
   Корень — контейнер: делаем .row блочным, #content на всю ширину.
   Колоночные правила грида (6/5/2) не трогаем — они работают, когда контейнер цел. */
#product-search .row { display: block !important; margin-left: 0 !important; margin-right: 0 !important; }
#product-search #content.col-sm-12,
#product-search #content { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
#product-search .catalog-grid > .product-layout { width: auto !important; max-width: none !important; margin: 0 !important; }

/* =====================================================================
   Фидбэк 01.08
   ===================================================================== */

/* #381: контент страницы поиска был вложен на 20px глубже, чем везде на сайте
   (заголовок начинался с 40px, грид 1630 против 1670) — из-за margin:0 20px
   у блоков внутри .container, тогда как сам контейнер уже отступает.
   Выравниваем по общей сетке сайта. */
#product-search .catalog-container .navigation-title,
#product-search .catalog-section,
#product-search .catalog-toolbar__sort,
#product-search .pagination {
  margin-left: 0;
  margin-right: 0;
}

/* #382: «фото выглядывает за край контейнера». Тема задаёт фото карточки
   жёсткие 14.673vw (media ≤1860px) — на 1367–1860px это шире колонки грида
   (при 1710px: 251+20 padding = 271 против 255), карточка распирала ячейку.
   Ниже 1367px это уже лечилось width:100% — распространяем то же правило
   на широкие экраны, фото центрируем внутри квадрата. */
@media (min-width: 1367px) {
  #product-search .product-item__container {
    width: 100%;
  }
  #product-search .product-item__image {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
  }
  /* Центрирование фото. Тема держала его абсолютными vw-отступами от ссылки
     .hover-img-add, у которой высота 0 (все её потомки — absolute). Поэтому
     проценты по вертикали здесь не работают: height:74% и top:50% считаются
     от height:auto родителя и схлопываются в 0 — фото исчезает.
     Растягиваем ссылку на весь квадрат и центрируем флексом, без процентов
     от высоты. */
  #product-search .product-item__image > a {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #product-search .product-item__image .image-wrap {
    position: static;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #product-search .product-item__image .image-wrap img {
    position: static;
    left: auto;
    top: auto;
    transform: none;
    width: 74%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
  }
}

/* #389: «Код заказа» встаёт в поток под описанием. Тема держала этот блок
   абсолютом с vw-координатами (top:13.695vw и три перекрывающих медиазапроса) —
   гасим их разом, без медиа, чтобы правило било по всем ширинам. */
#product-search .product-item__model {
  position: static;
  top: auto;
  right: auto;
  width: auto;
  margin: 10px 0 0;
}

/* ===== Счётчик результатов, подсказки, подсветка (пачка «Поиск») ===== */

/* «По запросу «X» — 42 товара» под заголовком выдачи */
#product-search .jv-search__summary {
  margin: 6px 0 0;
  font-size: 16px;
  line-height: 1.4;
  color: var(--jv-text-muted, #999);
}
#product-search .jv-search__query {
  color: var(--jv-text-primary, #171717);
  font-weight: 600;
}

/* ходовые запросы — в пустых состояниях */
.jv-search__suggest {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 0 26px;
}
.jv-search__suggest-label {
  font-size: 14px;
  color: var(--jv-text-muted, #999);
  margin-right: 2px;
}
.jv-search__suggest-item {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border: 1.5px solid var(--jv-border-light, #E4E5E9);
  border-radius: 999px;
  font-size: 14px;
  line-height: 1;
  color: var(--jv-text-primary, #171717);
  text-decoration: none;
  transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}
.jv-search__suggest-item:hover,
.jv-search__suggest-item:focus-visible {
  color: #fff;
  background: var(--jv-accent, #E94E1B);
  border-color: var(--jv-accent, #E94E1B);
  text-decoration: none;
}

/* подсветка совпадений в названии и коде заказа.
   Фон — бледно-оранжевый: акцент на найденном, но карточка не пестрит. */
#product-search mark.jv-hl {
  background: rgba(233, 78, 27, .14);
  color: inherit;
  padding: 0 1px;
  border-radius: 3px;
}

/* #410: тулбар сортировки снят с выдачи вместе с разметкой. Отступ, который он
   держал между чипами разделов и сеткой, теперь задаёт сама полоса чипов —
   а когда чипов нет (один раздел на всю выдачу), сетка идёт первой и отступ
   нужен ей самой, иначе карточки упираются в счётчик. */
#product-search .catalog-section__container > .catalog-section:first-child {
  padding-top: 18px;
}

@media (max-width: 575px) {
  #product-search .jv-search__summary { font-size: 14px; }
  .jv-search__suggest { gap: 6px; }
  .jv-search__suggest-item { padding: 6px 12px; font-size: 13px; }
}

/* ===== Чипы «сузить поиск» по разделам ===== */
/* Одна прокручиваемая строка, а не перенос: по «светильник» разделов 14, и
   в три ряда они на мобиле выдавливали товары за пределы экрана. */
.jv-search__facets {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  padding: 0 0 6px;
  /* #411: чипы прилипали к счётчику сверху и (после снятия тулбара, #410)
     к сетке снизу — разводим полосу отступами. */
  margin: 18px 0 18px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.jv-search__facets::-webkit-scrollbar { display: none; }
.jv-search__facets > * { flex: none; }
.jv-search__facets-label {
  white-space: nowrap;
  font-size: 15px;
  font-weight: 500;
  color: var(--jv-text-muted, #999);
  margin-right: 2px;
}
.jv-search__facet {
  display: inline-flex;
  white-space: nowrap;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border: 1.5px solid var(--jv-border-light, #E4E5E9);
  border-radius: 999px;
  background: #fff;
  font-size: 14px;
  line-height: 1;
  color: var(--jv-text-primary, #171717);
  text-decoration: none;
  transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}
.jv-search__facet:hover,
.jv-search__facet:focus-visible {
  border-color: var(--jv-accent, #E94E1B);
  color: var(--jv-accent, #E94E1B);
  text-decoration: none;
}
.jv-search__facet.is-active {
  background: var(--jv-accent, #E94E1B);
  border-color: var(--jv-accent, #E94E1B);
  color: #fff;
}
.jv-search__facet-count {
  font-size: 12px;
  color: var(--jv-text-muted, #999);
}
.jv-search__facet.is-active .jv-search__facet-count { color: rgba(255, 255, 255, .8); }
.jv-search__facet:hover .jv-search__facet-count { color: inherit; }

@media (max-width: 575px) {
  .jv-search__facets { padding: 0 0 6px; margin: 12px 0 14px; gap: 6px; }
  .jv-search__facet { padding: 6px 12px; font-size: 13px; }
}


/* ==== #23 · ЕДИНАЯ КАРТОЧКА ТОВАРА — выдача поиска ====
   Приводим к тем же значениям, что в каталоге: радиус карточки 11px (был 20px),
   радиус фото 9px (был 7.8px), название 16px/600 (было 14px/600), описание 12px.
   Артикул и иконка сравнения сняты в шаблоне. */
#product-search .product-layout:not(.swiper-slide) {
  border-radius: 11px;
}
#product-search .product-item__image {
  border-radius: 9px;
}
#product-search .product-item__heading {
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  /* #571: при 16px типовое имя («…PHB UFO 04 50w 4000K 120° IP65 Jazzway»)
     занимает 4 строки — даём четвёртую, иначе хвост с брендом обрезается. */
  -webkit-line-clamp: 4;
  max-height: 80px;
}
#product-search .product-item__description {
  font-size: 12px;
  line-height: 16px;
}
/* бейдж «N модели» на месте убранного артикула */
#product-search .jv-card__models {
  position: absolute;
  right: 9px;
  bottom: 7px;
  z-index: 2;
  padding: 3px 8px;
  border-radius: 8px;
  background: var(--jv-bg-light, #F2F3F6);
  font-size: 11px;
  line-height: 1.3;
  color: #555;
  pointer-events: none;
}

@media (max-width: 575px) {
  /* #576 (мобилка): 13/17 и четыре строки — в узкую колонку влезает
     заметно больше текста; что не поместилось, обрезаем многоточием.
     Боковые отступы 10 → 6px: на 375px каждая пара пикселей под текст на счету
     (в колонке остаётся ~123px), а кромки блоков остаются общими. */
  #product-search .product-item__heading { font-size: 13px; line-height: 17px; max-height: 68px; }
  #product-search .product-item .product-item__title a span { font-size: 13px; line-height: 17px; }
  #product-search .product-item__description { font-size: 11px; line-height: 15px; }
  #product-search .jv-card__models { font-size: 10px; padding: 2px 7px; }
}

/* ==== #573 · строка ключевых отличий в выдаче — как на плитке каталога ====
   Разметка та же (.jv-product-card__specs), но стили каталога привязаны к
   .jv-products-grid, а в выдаче сетка своя (.catalog-grid) — повторяем здесь.
   Боковые отступы берём от заголовка/описания карточки выдачи. */
#product-search .jv-product-card__specs {
  /* #577: боковые 10px — как у описания карточки; заголовок ниже приведён
     к той же кромке, иначе три блока стоят по трём разным линиям. */
  margin: 4px 10px 8px;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  min-height: 18px;
  color: var(--jv-text-secondary, #303131);
  font-variant-numeric: tabular-nums;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* значение не рвём посреди «10 000 лм»; точка приклеена к предыдущему пункту */
#product-search .jv-product-card__specs span { white-space: nowrap; }
#product-search .jv-product-card__specs span:not(:last-child)::after {
  content: '·';
  margin-left: 5px;
  color: var(--jv-text-muted, #999999);
}
@media (max-width: 575px) {
  #product-search .jv-product-card__specs { font-size: 12px; line-height: 16px; min-height: 16px; }
}

/* Строка над сеткой выдачи под переключатель вида: в каталоге он живёт
   в тулбаре сортировки, а с поиска тулбар снят целиком (#410). */
#product-search .jv-search__viewbar {
  display: flex;
  justify-content: flex-end;
  margin: 0 20px 12px;
}

@media (max-width: 767px) {
  #product-search .jv-search__viewbar { display: none; }
}