/* AEZ-SHOP.RU — страница категории.
   Префикс "azcat-" проверен на отсутствие коллизий с CSS темы profline. */

#product-category{
  --yellow:#fed501; --yellow-deep:#e0bd00;
  --dark:#252525; --light:#f6f6f6; --white:#ffffff; --line:#e2e2e2;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}

/* --- Название товара: тег h4 заменён на h2 (иерархия H1→H4 ломалась).
       Размер зафиксирован по замерам, чтобы визуал не изменился. --- */
#product-category .azct-product-name{
  font-size:14px; font-weight:400; line-height:1.4;
  margin:0; padding:0;
}
#product-category .azct-product-name a{ color:inherit; text-decoration:none; }

/* --- Меню по заголовкам описания категории.
       По умолчанию скрыто (лежит в сайдбаре под категориями).
       Класс .is-pinned ставится скриптом, когда пользователь долистал
       до блока описания — тогда меню фиксируется на экране. --- */
.azcat-toc{
  display:none;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:6px;
  padding:16px;
  box-shadow:0 4px 18px rgba(0,0,0,.10);
}
.azcat-toc.is-pinned{
  display:block;
  position:fixed;
  top:16px;
  z-index:300;
  max-height:calc(100vh - 32px);
  overflow-y:auto;
  animation:azcat-fade .18s ease-out;
}
.azcat-toc.is-static{
  display:block;
  position:static;
  margin-top:16px;
  box-shadow:none;
}
@keyframes azcat-fade{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:translateY(0); }
}
.azcat-toc-title{
  font-family:var(--mono);
  font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  color:#8a8a8a;
  margin:0 0 10px; padding-bottom:8px;
  border-bottom:2px solid var(--yellow);
}
.azcat-toc ul{ list-style:none; margin:0; padding:0; }
.azcat-toc li{ margin:0; }
.azcat-toc a{
  display:block;
  font-size:13.5px; line-height:1.45;
  color:var(--dark); text-decoration:none;
  padding:7px 9px; border-radius:4px;
  border-left:3px solid transparent;
  cursor:pointer;
  transition:background .15s ease-out, border-left-color .15s ease-out;
}
.azcat-toc a:hover{ background:var(--light); border-left-color:var(--yellow-deep); }
.azcat-toc a.is-active{
  background:var(--light);
  border-left-color:var(--yellow);
  font-weight:700;
}
.azcat-toc .azcat-toc-sub a{ padding-left:20px; font-size:13px; color:#555; }

/* --- Заголовки внутри описания категории: единый стиль с другими
       страницами (жёлтая чёрточка слева) --- */
#product-category .category-description h2{
  font-size:19px; font-weight:700; color:#000;
  display:flex; align-items:center; gap:10px;
  margin:22px 0 14px; line-height:1.3;
  scroll-margin-top:16px;
}
#product-category .category-description h2::before{
  content:""; width:6px; height:22px; background:var(--yellow);
  border-radius:2px; display:inline-block; flex:none;
}
#product-category .category-description h3{
  font-size:16.5px; font-weight:700; color:#000;
  display:flex; align-items:center; gap:9px;
  margin:20px 0 12px; line-height:1.3;
  scroll-margin-top:16px;
}
#product-category .category-description h3::before{
  content:""; width:4px; height:18px; background:var(--yellow-deep);
  border-radius:2px; display:inline-block; flex:none;
}
#product-category .category-description{
  font-size:14.5px; line-height:1.6; color:var(--dark);
}
#product-category .category-description p{ margin:0 0 12px; }
#product-category .category-description ul,
#product-category .category-description ol{ padding-left:22px; margin:0 0 12px; }
#product-category .category-description li{ margin-bottom:7px; }
#product-category .category-description li::marker{ color:var(--yellow-deep); }

/* --- Листинг товаров: карточки были на float:left с разной высотой
       (474 / 493 px), из-за чего сетка «спотыкалась» и появлялись
       дыры между рядами. Переводим на flex — ряды выравниваются. --- */
#product-category .product-layout{ float:none !important; }
#product-category article.product-layout{ display:flex; }
#product-category article.product-layout > .product-thumb{
  display:flex; flex-direction:column; width:100%;
}
#product-category article.product-layout .caption{ flex:1 1 auto; }
#product-category article.product-layout .button-group{ margin-top:auto; }

#product-category #content > .row:has(article.product-layout){
  display:flex; flex-wrap:wrap; align-items:stretch;
}

/* запасной вариант для браузеров без :has() */
@supports not selector(:has(*)){
  #product-category .product-layout{ display:inline-flex; vertical-align:top; }
}

/* --- Меню по заголовкам на мобильных: сайдбар там скрыт, поэтому
       скрипт переносит меню перед описанием. Делаем его обычным
       раскрывающимся блоком. --- */
@media (max-width:991px){
  .azcat-toc.is-static{
    display:block; position:static;
    margin:0 0 16px; box-shadow:none;
  }
}

/* --- Служебные теги микроразметки не должны занимать место.
       (На карточке товара мы уже ловили баг, когда широкий селектор
       темы делал невидимый <meta> видимым блоком.) --- */
#product-category meta,
#product-category link{ display:none !important; }

/* ======================================================================
   Сайдбар категорий (модуль «Категории», .list-group в #column-left)
   Подкатегории помечены дефисом в тексте — скрипт проставляет им
   класс .azcat-sub и убирает дефис, здесь только оформление.
   ====================================================================== */
#column-left .list-group{
  background:var(--white, #fff);
  border:1px solid var(--line, #e2e2e2);
  border-radius:8px;
  padding:6px;
  overflow:hidden;
}
#column-left .list-group-item{
  display:block;
  position:relative;
  font-size:13.5px;
  line-height:1.4;
  color:var(--dark, #252525);
  background:transparent;
  border:none;
  border-radius:5px;
  padding:10px 12px;
  margin:0 0 2px;
  text-decoration:none;
  transition:background .15s ease-out, color .15s ease-out, padding-left .15s ease-out;
}
#column-left .list-group-item:last-child{ margin-bottom:0; }

#column-left .list-group-item:hover{
  background:var(--light, #f6f6f6);
  color:#000;
  padding-left:16px;
}

/* активная категория */
#column-left .list-group-item.active,
#column-left .list-group-item.active:hover{
  background:var(--yellow, #fed501);
  color:#000;
  font-weight:700;
  padding-left:12px;
}

/* подкатегории: отступ + маркер вместо дефиса */
#column-left .list-group-item.azcat-sub{
  padding-left:26px;
  font-size:13px;
  color:#555;
}
#column-left .list-group-item.azcat-sub::before{
  content:"";
  position:absolute;
  left:13px; top:50%;
  width:5px; height:5px;
  margin-top:-2.5px;
  border-radius:50%;
  background:var(--yellow-deep, #e0bd00);
  transition:transform .15s ease-out;
}
#column-left .list-group-item.azcat-sub:hover{
  padding-left:30px;
  color:#000;
}
#column-left .list-group-item.azcat-sub:hover::before{ transform:scale(1.4); }
#column-left .list-group-item.azcat-sub.active::before{ background:#000; }
