/* =========================================================
   catalog-v2.css — стили специфичные для каталога /shop
   Подключается ПОСЛЕ common-v2.css
   Заменяет старый main.min.css для каталога
   ========================================================= */

/* ====== BASE RESET ====== */
.catalog-layout, .catalog-layout * {
  box-sizing: border-box;
}
.products-area ul,
.products-area ol,
.sidebar__filter ul,
.sidebar__filter ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ============================================================
   PRODUCT GRID
   ============================================================ */
.goods__list,
.get-more__content {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  width: 100%;
  align-items: start;
}
@media (max-width: 850px) {
  .goods__list,
  .get-more__content {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}
@media (max-width: 480px) {
  .goods__list,
  .get-more__content { gap: 8px; }
}

/* ============================================================
   SORT BAR — v2 макет (breadcrumbs слева, сортировка справа)
   ============================================================ */
.goods__sort,
.sort-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--c-border);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  gap: 12px;
  flex-wrap: wrap;
}
.sort-bar__left {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 auto;
  min-width: 0;
}
.sort-bar__left .gltit,
.sort-bar__left h1 {
  font-size: 18px;
  font-weight: 600;
  color: var(--c-text);
  margin: 0;
  line-height: 1.3;
}
/* Счётчик «Найдено N товаров» (заполняется JS-ом в goods_list.php) */
.sort-bar__count {
  font-size: 13px;
  color: var(--c-text-secondary);
  white-space: nowrap;
}
.sort-bar__count:empty { display: none; }

/* ====== Нумерованная пагинация каталога ====== */
.catalog-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 20px 0 8px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.catalog-pagination__item {
  min-width: 38px;
  height: 38px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  background: #fff;
  color: var(--c-text);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: border-color var(--transition), color var(--transition);
}
.catalog-pagination__item:hover {
  border-color: var(--c-coral);
  color: var(--c-coral);
}
.catalog-pagination__item.is-current {
  background: var(--c-coral);
  border-color: var(--c-coral);
  color: #fff;
  cursor: default;
}
.catalog-pagination__dots {
  color: var(--c-text-muted);
  padding: 0 2px;
}
.sort-bar__right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.sort-bar__label {
  font-size: 13px;
  color: var(--c-text-secondary);
  white-space: nowrap;
  font-weight: 500;
}
.sort-bar__select {
  padding: 7px 28px 7px 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  font-size: 13px;
  background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>") no-repeat right 8px center;
  outline: none;
  cursor: pointer;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--c-text);
  font-weight: 500;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color 0.2s;
}
.sort-bar__select:hover,
.sort-bar__select:focus {
  border-color: var(--c-slate);
}
/* Breadcrumbs внутри sort-bar (у макета .breadcrumbs) */
.sort-bar__left .breadcrumbs,
.sort-bar__left > nav {
  margin-bottom: 0;
  font-size: 13px;
}
/* Цвет ссылки крошек: перебиваем .goods__sort a (#6b7280) той же специфичности,
   которое идёт позже в каскаде. Держим единый #999 как на /contacts. */
.sort-bar__left .breadcrumbs a { color: #999; }
.sort-bar__left .breadcrumbs a:hover { color: #ea5b71; }

@media (max-width: 850px) {
  /* «Найдено N товаров» и сортировка — в ОДНУ строку (заголовок h1 — своей
     строкой выше). Лейбл «Сортировка:» на мобиле прячем — селект («По
     популярности») говорит сам за себя, иначе строка не влезает в 375px. */
  .sort-bar,
  .goods__sort {
    align-items: center;
    gap: 8px 12px;
  }
  .sort-bar__left { flex-wrap: wrap; }
  .sort-bar__left .gltit,
  .sort-bar__left h1 { flex: 1 1 100%; }
  .sort-bar__label { display: none; }
  .sort-bar__right { justify-content: flex-end; flex: 0 0 auto; }
  .sort-bar__select { max-width: 190px; }
}

/* Крошки в каталоге используют единый .breadcrumbs (common-v2.css).
   JS (shop_index.tpl) переносит <nav.breadcrumbs> в .sort-bar__left. */
.products-area > nav:empty { display: none; }

/* ============================================================
   SIDEBAR FILTERS — по макету (секции с chevron, кастомные чекбоксы)
   ============================================================ */
.filters,
.sidebar__filter {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Скрыть дублирующие заголовки CMS */
.sidebar__filter #head_filter,
.sidebar__filter .name_filter {
  display: none;
}

/* Секция фильтра (рамка убрана — как в макете) */
.sidebar__filter .filter__item {
  margin-bottom: 0;
  padding: 16px 0;
  border: none;
  border-bottom: 1px solid var(--c-border);
  background: none;
  width: 100%;
  box-sizing: border-box;
}
.sidebar__filter .filter__item:first-child { padding-top: 0; }
.sidebar__filter .filter__item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

/* Заголовок секции — с chevron справа */
.sidebar__filter .filter__item-title,
.sidebar__filter .filter__color-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-text);
  margin: 0 0 12px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  user-select: none;
}
.sidebar__filter .filter__item-title::after,
.sidebar__filter .filter__color-title::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: 1.5px solid var(--c-text-muted);
  border-bottom: 1.5px solid var(--c-text-muted);
  transform: rotate(45deg);
  margin-left: auto;
  margin-top: -3px;
  transition: transform 0.2s;
}
.sidebar__filter .filter__item-title.collapsed::after,
.sidebar__filter .filter__color-title.collapsed::after {
  transform: rotate(-45deg);
  margin-top: 3px;
}

/* Скрыть иконки fa-sort-desc в заголовках */
.sidebar__filter .filter__item-title .fa,
.sidebar__filter .filter__item-title .fa-sort-desc,
.sidebar__filter .filter__color-title .fa,
.sidebar__filter .filter__color-title .fa-sort-desc {
  display: none;
}

/* Обёртка content секции */
.sidebar__filter .filter__block-slide {
  padding: 0;
  margin: 0;
  border: none;
  background: none;
}

/* Пункт фильтра (чекбокс + текст) */
.sidebar__filter .filter__item-block,
.sidebar__filter .filter__item .filter__item-block,
.sidebar__filter .filter__type-item,
.sidebar__filter .filter__material-item,
.sidebar__filter .filter__additionally-item {
  margin: 0 0 2px !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}
.sidebar__filter .filters_label,
.sidebar__filter .filter__item .filters_label,
.sidebar__filter label.filters_label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 2px 0 !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  color: var(--c-text-secondary);
  cursor: pointer;
  transition: color 0.2s;
  font-weight: 500;
  margin: 0 !important;
}
.sidebar__filter .filters_label:hover { color: var(--c-text); }

/* Кастомный чекбокс (прячем native, отрисовываем span) */
.sidebar__filter .filters_label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--c-border);
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  transition: all 0.2s;
  margin: 0;
}
.sidebar__filter .filters_label input[type="checkbox"]:hover {
  border-color: var(--c-slate);
}
.sidebar__filter .filters_label input[type="checkbox"]:checked {
  background: var(--c-coral);
  border-color: var(--c-coral);
}
.sidebar__filter .filters_label input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.sidebar__filter .filters_label.checked,
.sidebar__filter .filter__item-block.checked .filters_label {
  color: var(--c-text);
}

/* Disabled пункт */
.sidebar__filter .filter__item-block.disabled,
.sidebar__filter .filter__type-item.disabled,
.sidebar__filter .filter__material-item.disabled,
.sidebar__filter .filter__additionally-item.disabled {
  opacity: 0.35;
  pointer-events: none;
}

/* Размеры (шир/выс/дно inputs) */
.sidebar__filter .filter__item .filter__block-slide input[type="text"],
.sidebar__filter .filter__item .filter__block-slide input[type="number"],
.sidebar__filter .filter__sizing-input,
.sidebar__filter .filter__input-price {
  padding: 6px 8px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  font-size: 12px;
  outline: none;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  transition: border-color 0.2s;
  background: #fff;
  box-sizing: border-box;
  width: 100%;
}

/* Размеры — в одну строку (только секция где есть .filter__sizing-input) */
.sidebar__filter .filter__item:has(.filter__sizing-input) .filter__block-slide {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
}
.sidebar__filter .filter__sizing-input,
.sidebar__filter .filter__width,
.sidebar__filter .filter__height,
.sidebar__filter .filter__width_bottom {
  flex: 1 1 0;
  min-width: 0;
  width: 100%;
  padding: 6px 4px;
  text-align: center;
  font-size: 12px;
}
.sidebar__filter .filter__item:has(.filter__sizing-input) .filter__block-slide > label {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}
/* Крестик между size inputs — из main.js генерируется как текст "×" */
.sidebar__filter .filter__item:has(.filter__sizing-input) .filter__block-slide > *:not(input):not(label) {
  flex: 0 0 auto;
  font-size: 14px;
  color: var(--c-text-muted);
  padding: 0 2px;
}
/* Ценовой блок — в одну строку (input + значок рубля) */
.sidebar__filter .filter__item.price .filter__block-slide,
.sidebar__filter .filter__item.price .filter__block-slide[style] {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: 100% !important;
}
.sidebar__filter .filter__input-price,
.sidebar__filter .filter__price_limit,
.sidebar__filter input[name="price_limit"] {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  padding: 6px 8px !important;
  font-size: 12px !important;
}
.sidebar__filter .filter__item.price .fa-rub {
  font-family: FontAwesome !important;
  font-style: normal !important;
  font-size: 14px !important;
  color: var(--c-text-secondary) !important;
  flex: 0 0 auto !important;
}
.sidebar__filter input[type="text"]:focus,
.sidebar__filter input[type="number"]:focus {
  border-color: var(--c-coral);
}

/* Кнопки submit/reset.
   Слиты дубли с L632/L637 ниже — там были margin-top/padding-top overrides,
   которые перебивали padding/margin без эффекта (одни и те же ширина gap'а
   достигалась разными значениями). Использован вариант из второго блока. */
.sidebar__filter .filter__item-buttons {
  display: flex;
  flex-direction: column;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
}
.sidebar__filter .filter__item-btn {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sidebar__filter .filter__item-submit,
.sidebar__filter input[type="submit"],
.sidebar__filter button[type="submit"] {
  width: 100%;
  padding: 12px;
  background: var(--c-coral);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.sidebar__filter .filter__item-submit:hover,
.sidebar__filter button[type="submit"]:hover {
  background: var(--c-coral-hover);
}
.sidebar__filter .filter__item-reset,
.sidebar__filter a[href*="reset"] {
  display: block;
  width: 100%;
  text-align: center;
  padding: 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-text-secondary);
  background: transparent;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s;
}
.sidebar__filter .filter__item-reset:hover,
.sidebar__filter a[href*="reset"]:hover {
  border-color: var(--c-slate);
  color: var(--c-text);
}

/* Цветовые круги фильтра.
   order: 1 перенесён из дубля ниже (L653) — расставляет блок в flex-row
   внутри collapsible-обёртки .filter__block-slide. */
.sidebar__filter .filter__item-colors {
  display: none;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 0 0 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  order: 1;
}
.sidebar__filter .colors__list-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
  position: relative;
}
.sidebar__filter .colors__list-item.disabled {
  opacity: 0.3;
  pointer-events: none;
}
.sidebar__filter .filters_label-color {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  margin: 0;
  width: 26px;
  height: 26px;
}
.sidebar__filter .filters_label-color input[type="checkbox"],
.sidebar__filter .filter__item-block-color,
.sidebar__filter .filter__item-block-box-custom-color {
  display: none;
}
.sidebar__filter .colors__block {
  display: inline-block;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px var(--c-border);
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
  padding: 0;
  margin: 0;
  flex-shrink: 0;
  box-sizing: border-box;
}

/* ============================================================
   Плавающая кнопка "Показать (N)" (#watching_button)
   ============================================================ */
/* aside.filters — контекст позиционирования для плавающей кнопки (она теперь вне формы) */
aside.filters,
aside.filters.sidebar,
.filters.sidebar,
#sidebarPanel {
  position: relative !important;
}
form#filters {
  position: static !important;
}
#watching_button,
.filter__item-submit#watching_button,
.filter__item-buttons #watching_button {
  position: absolute !important;
  top: 0; /* без !important чтобы JS мог переопределить inline */
  left: calc(100% + 14px) !important;
  right: auto !important;
  bottom: auto !important;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(0) !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  min-width: 140px !important;
  max-width: 180px !important;
  padding: 9px 16px !important;
  background: var(--c-coral) !important;
  color: #fff !important;
  border: 1px solid var(--c-coral) !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1px !important;
  line-height: 1.2 !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  box-shadow: 0 6px 16px rgba(234, 91, 113, 0.25), 0 2px 4px rgba(234, 91, 113, 0.15) !important;
  white-space: nowrap !important;
  z-index: 100 !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
  text-align: center !important;
}
/* Видимое состояние — добавляется JS через класс */
#watching_button.v2-visible {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* [v2] Замок на форме фильтра пока летит count-запрос —
   блокирует повторные клики, чтобы не сбросить промежуточный выбор.
   Сами кнопки "Показать"/"Сбросить" остаются кликабельными. */
#filters.v2-filter-busy .sidebar__switch-list > .sidebar__switch-item-content > .filter__item {
  pointer-events: none;
  cursor: progress;
}
#filters.v2-filter-busy .filter__item-buttons,
#filters.v2-filter-busy .filter__item-submit-mobile,
#filters.v2-filter-busy #filter_crash {
  pointer-events: auto;
}
#watching_button:hover,
.filter__item-submit#watching_button:hover {
  background: var(--c-coral-hover) !important;
  border-color: var(--c-coral-hover) !important;
  box-shadow: 0 8px 20px rgba(234, 91, 113, 0.32), 0 3px 6px rgba(234, 91, 113, 0.18) !important;
  transform: translateY(-1px) !important;
}
#watching_button:active,
.filter__item-submit#watching_button:active {
  transform: translateY(0) !important;
  box-shadow: 0 4px 12px rgba(234, 91, 113, 0.25) !important;
}
/* Треугольник-хвостик слева, указывающий на пункт фильтра */
#watching_button::before {
  content: '' !important;
  position: absolute !important;
  left: -7px !important;
  top: 50% !important;
  transform: translateY(-50%) rotate(45deg) !important;
  width: 12px !important;
  height: 12px !important;
  background: var(--c-coral) !important;
  border-left: 1px solid var(--c-coral) !important;
  border-bottom: 1px solid var(--c-coral) !important;
  z-index: -1 !important;
  border-radius: 2px !important;
}
.filter__item-total {
  margin-left: 6px;
  opacity: 0.9;
  font-weight: 500;
}
/* Вторая кнопка "Показать" — статичная, внизу фильтра над "Сбросить" */
.filter__item-submit-mobile {
  all: unset !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 12px 16px !important;
  background: var(--c-coral) !important;
  color: #fff !important;
  border: 1px solid var(--c-coral) !important;
  border-radius: var(--radius) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  text-align: center !important;
  transition: background 0.15s, box-shadow 0.15s, transform 0.1s !important;
  box-shadow: 0 2px 6px rgba(234, 91, 113, 0.18) !important;
}
.filter__item-submit-mobile:hover {
  background: var(--c-coral-hover) !important;
  border-color: var(--c-coral-hover) !important;
  box-shadow: 0 4px 12px rgba(234, 91, 113, 0.25) !important;
}
.filter__item-submit-mobile:active {
  transform: translateY(1px) !important;
  box-shadow: 0 1px 3px rgba(234, 91, 113, 0.2) !important;
}
.filter__item-submit-mobile .filter__item-total {
  margin-left: 4px;
  opacity: 0.92;
  font-weight: 500;
}
/* .filter__item-buttons / .filter__item-btn — слиты в одно определение
   выше (L389/L397). Эти дубли удалены. */

/* Колор-фильтр — wrap делаем flex column для внешнего контейнера,
   чтобы блоки цветов + сообщение + кнопка шли вертикально */
.sidebar__filter .filter__item .filter__block-slide:has(.filter__item-colors) {
  display: flex;
  flex-direction: column;
  gap: 0;
}
/* Сообщение о похожих цветах и блок Показать/Очистить в цветах — скрыть (заменено плавающей кнопкой) */
#message_similar,
#message_similar.v2-visible,
.colors__options,
.filter__item-submit-color,
.colors__clear-all,
.colors__checked-all {
  display: none !important;
}
/* Скрыть старые кнопки "Показать все / Скрыть" в цветах */
.sidebar__filter .filter-color-link,
.sidebar__filter .filter-color-link__hide_colors,
.sidebar__filter .filter-color-link__show_colors,
.sidebar__filter a.filter-color-link__hide_colors,
.sidebar__filter a.filter-color-link__show_colors,
.filter-color-link {
  display: none !important;
}
.filter__item-submit-color {
  width: 100%;
  padding: 10px;
  background: var(--c-coral);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  transition: background 0.2s;
}
.filter__item-submit-color:hover {
  background: var(--c-coral-hover);
}
.colors__clear-all {
  text-align: center;
  font-size: 12px;
  color: var(--c-text-secondary);
  text-decoration: none;
  padding: 4px;
  transition: color 0.2s;
}
.colors__clear-all:hover { color: var(--c-text); }

/* Sidebar filters — relative для absolute позиционирования кнопки */
.sidebar__filter,
.filters form#filters {
  position: relative;
}

/* На мобильных: открытый слой фильтров = fixed slide-in, кнопка «Показать» внизу.
   1) Базовое `#sidebarPanel { position: relative !important }` (контекст плавающей
      кнопки на десктопе) перебивало position:fixed из common-v2.css — панель
      оставалась в потоке, её низ был недостижим при заблокированном body-скролле.
      #id.class + !important возвращает fixed.
   2) Селектор `#watching_button` (1-0-0) проигрывал десктопной группе
      `.filter__item-submit#watching_button` (1-1-0 !important) — кнопка оставалась
      absolute за правым краем панели. Дублируем группу селекторов: тот же вес,
      позже в файле — мобильные правила выигрывают каскад. */
@media (max-width: 850px) {
  #sidebarPanel.mobile-open,
  aside.filters.mobile-open,
  .filters.sidebar.mobile-open {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    overflow-x: hidden;
    /* поверх cookie-баннера (.cookies-info, z-index 999999) — иначе он
       перехватывает тапы по кнопке у нижнего края */
    z-index: 1000000;
    /* запас снизу — фикс-кнопка не перекрывает «Показать»/«Сбросить» формы */
    padding-bottom: 96px;
  }
  #watching_button,
  .filter__item-submit#watching_button,
  .filter__item-buttons #watching_button {
    position: fixed !important;
    left: 16px !important;
    /* ширина = панель (300px) минус поля: right:16px растягивал кнопку
       на весь вьюпорт — хвост торчал за панелью и «срезался» бэкдропом */
    right: auto !important;
    width: 268px !important;
    bottom: 16px !important;
    top: auto !important;
    transform: none !important;
    min-width: 0 !important;
    max-width: calc(100vw - 32px) !important;
    padding: 14px !important;
    font-size: 14px !important;
    /* поверх контента панели: у кастомных чекбоксов (.filters_label) свой
       z-index — без него тап по кнопке попадал в label под ней */
    z-index: 20 !important;
  }
  #watching_button::before { display: none !important; }
}
.sidebar__filter .filters_label-color:hover .colors__block {
  transform: scale(1.15);
  box-shadow: 0 0 0 1.5px var(--c-slate);
}

/* Мгновенный tooltip с названием цвета */
.sidebar__filter .colors__list-item[title] {
  position: relative;
}
.sidebar__filter .colors__list-item[data-title]:hover::after {
  content: attr(data-title);
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--c-dark);
  color: #fff;
  font-size: 11px;
  font-weight: 500;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;
  z-index: 1000;
  pointer-events: none;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  box-shadow: var(--shadow-md);
}
.sidebar__filter .colors__list-item[data-title]:hover::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid var(--c-dark);
  z-index: 1000;
  pointer-events: none;
}
.sidebar__filter .colors__list-item[data-title] {
  cursor: pointer;
}
.sidebar__filter .colors__list-item.selected .colors__block,
.sidebar__filter .colors__list-item:has(input:checked) .colors__block {
  box-shadow: 0 0 0 2px var(--c-coral);
  transform: scale(1.1);
}
.sidebar__filter .filter__item-block-label-color,
.sidebar__filter .filter__color-label {
  display: none;
}

/* Скрыть блок настроек switch */
.sidebar__filter .sidebar__switch {
  display: none;
}

/* Кнопка "Смотреть коллекции" — как в макете (коралловая, наверху sidebar) */
.sidebar__productline,
.filters .sidebar__productline,
.sidebar__filter .sidebar__productline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px;
  background: var(--c-coral);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
  margin-bottom: 20px;
  text-decoration: none;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.sidebar__productline:hover { background: var(--c-coral-hover); }
.sidebar__productline img {
  width: 18px;
  height: 18px;
}

/* ============================================================
   LOAD MORE BUTTON
   ============================================================ */
.get-more {
  text-align: center;
  margin-top: 32px;
}
.get-more button,
.get-more #getMore {
  padding: 14px 28px;
  background: transparent;
  color: var(--c-text);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.get-more button:hover,
.get-more #getMore:hover {
  border-color: var(--c-slate);
  background: var(--c-bg-light);
}
.get-more__preload .fa-spinner { color: var(--c-coral); }

/* ============================================================
   PAGINATION
   ============================================================ */
.num-pages,
.goods__num-pages {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 40px;
  list-style: none;
  padding: 0;
}
.goods__num-pages-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 0 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  background: #fff;
  color: var(--c-text-secondary);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s;
}
.goods__num-pages-link:hover {
  border-color: var(--c-slate);
  color: var(--c-text);
}
.selected_page {
  background: var(--c-coral);
  border-color: var(--c-coral);
  color: #fff;
}

/* ============================================================
   WARNING MODAL
   ============================================================ */
.goods__smallSkladInfo-modal {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 28px;
  z-index: 10000;
  max-width: 440px;
  width: 90%;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.goods__smallSkladInfo-modal .warning__header h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 12px;
}
.goods__smallSkladInfo-modal .warning__content {
  font-size: 14px;
  line-height: 1.6;
  color: var(--c-text-secondary);
  margin-bottom: 16px;
}

/* ============================================================
   H1/H2 в каталоге
   ============================================================ */
.products-area h1,
.products-area .gltit {
  font-size: 24px;
  font-weight: 700;
  margin: 0 0 16px;
  color: var(--c-text);
  line-height: 1.3;
}

/* ============================================================
   Tooltip (WzTtDiV)
   ============================================================ */
#WzTtDiV {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 12px !important;
}

/* ============================================================
   Редактируемое количество в корзине (input вместо span)
   ============================================================ */
input.cart-slidein__qty-val {
  width: 44px;
  padding: 4px 6px;
  border: 1px solid var(--c-border);
  border-radius: 4px;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  outline: none;
  transition: border-color 0.2s;
  background: #fff;
  -moz-appearance: textfield;
}
input.cart-slidein__qty-val:focus {
  border-color: var(--c-coral);
}
input.cart-slidein__qty-val::-webkit-outer-spin-button,
input.cart-slidein__qty-val::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}