/* ============================================================
   YPONTON.RU — брендовый редизайн страницы КАТЕГОРИИ товаров
   (архивы product_cat / product_tag / магазин). Префикс scope:
   body.woocommerce-page.archive. CSS-first, шаблоны/плагин WCPFA
   не трогаем — только оформление. Карточки .shop-item уже
   брендированы в shop.css — здесь их не касаемся.
   Токены: navy #11233f, orange #f78e1f, border #e6eaf0,
   muted #6a7588, bg #f4f6fa, шрифт Onest.
   ============================================================ */

/* ---------- Общий шрифт для контентной части архива ---------- */
body.woocommerce-page.archive .content-area,
body.woocommerce-page.archive .widget-area {
  font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: #11233f;
}

/* ---------- Хлебные крошки ---------- */
body.woocommerce-page.archive .woocommerce-breadcrumb,
body.woocommerce-page.archive .breadcrumbs {
  font-size: 14px; color: #8a93a2; margin-bottom: 14px;
}
body.woocommerce-page.archive .woocommerce-breadcrumb a,
body.woocommerce-page.archive .breadcrumbs a { color: #f78e1f; text-decoration: none; }
body.woocommerce-page.archive .woocommerce-breadcrumb a:hover { text-decoration: underline; }

/* ---------- Заголовок категории ---------- */
body.woocommerce-page.archive .woocommerce-products-header__title,
body.woocommerce-page.archive .page-title {
  font-family: 'Onest', system-ui, sans-serif;
  font-size: 34px; font-weight: 800; line-height: 1.15; color: #11233f;
  margin: 0 0 18px;
}

/* ---------- Чипы подкатегорий (ul > li > a над списком) ---------- */
body.woocommerce-page.archive .term-description + ul,
body.woocommerce-page.archive .woocommerce-products-header + ul,
body.woocommerce-page.archive .site-main > ul:not(.products):not(.wcpfa):not([class]),
body.woocommerce-page.archive .site-main ul.subcategory-chips {
  list-style: none; display: flex; flex-wrap: wrap; gap: 12px;
  margin: 0 0 22px; padding: 0;
}
/* сами пилюли — по <a> внутри такого ul */
body.woocommerce-page.archive .site-main > ul:not(.products) > li > a,
body.woocommerce-page.archive ul.subcategory-chips > li > a {
  display: inline-flex; align-items: center;
  padding: 11px 20px; border: 1.5px solid #e1e5ec; border-radius: 12px;
  font-size: 14.5px; font-weight: 600; color: #11233f; text-decoration: none;
  background: #fff; transition: border-color .18s, color .18s, box-shadow .18s;
}
body.woocommerce-page.archive .site-main > ul:not(.products) > li > a:hover,
body.woocommerce-page.archive ul.subcategory-chips > li > a:hover {
  border-color: #f78e1f; color: #f78e1f; box-shadow: 0 6px 16px rgba(247,142,31,.12);
}
/* Реальная разметка чипов подкатегорий у темы: div.term-list > ul > li > a
   (у <a> нет классов) — селекторы выше её не ловят, тема красит их navy-
   прямоугольниками с квадратными углами. Брендируем в пилюли (десктоп + мобилка). */
body.woocommerce-page.archive .term-list ul {
  list-style: none; display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 22px; padding: 0;
}
body.woocommerce-page.archive .term-list ul li { margin: 0 !important; }
body.woocommerce-page.archive .term-list ul li a {
  display: inline-flex !important; align-items: center;
  padding: 11px 20px !important; border: 1.5px solid #e1e5ec !important; border-radius: 12px !important;
  font-size: 14.5px; font-weight: 600; color: #11233f !important; text-decoration: none;
  background: #fff; transition: border-color .18s, color .18s, box-shadow .18s;
}
body.woocommerce-page.archive .term-list ul li a:hover {
  border-color: #f78e1f !important; color: #f78e1f !important; box-shadow: 0 6px 16px rgba(247,142,31,.12);
}

/* ---------- Тулбар: счётчик + сортировка ---------- */
body.woocommerce-page.archive .shop-sorting {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin: 0 0 22px;
}
body.woocommerce-page.archive .shop-sorting .woocommerce-result-count {
  margin: 0; font-size: 14px; color: #8a93a2;
}
body.woocommerce-page.archive .woocommerce-ordering { margin: 0; position: relative; }
body.woocommerce-page.archive .woocommerce-ordering select.orderby {
  appearance: none; -webkit-appearance: none;
  font-family: 'Onest', sans-serif; font-size: 14.5px; font-weight: 600; color: #11233f;
  background: #fff; border: 1.5px solid #e1e5ec; border-radius: 12px;
  padding: 11px 42px 11px 18px; cursor: pointer; line-height: 1.2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2311233f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 15px center;
  transition: border-color .18s, box-shadow .18s;
}
body.woocommerce-page.archive .woocommerce-ordering select.orderby:hover { border-color: #f78e1f; }
body.woocommerce-page.archive .woocommerce-ordering select.orderby:focus {
  outline: none; border-color: #f78e1f; box-shadow: 0 0 0 3px rgba(247,142,31,.15);
}

/* ============================================================
   САЙДБАР ФИЛЬТРОВ
   ============================================================ */
body.woocommerce-page.archive .widget-area .sticky-sidebar { display: flex; flex-direction: column; gap: 16px; }

/* nav-пилюли родительских категорий */
body.woocommerce-page.archive .widget-area .small-nav {
  display: flex; flex-direction: column; gap: 8px; margin: 0 0 2px;
}
body.woocommerce-page.archive .widget-area .small-nav br { display: none; }
body.woocommerce-page.archive .widget-area .small-nav a {
  display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
  padding: 9px 16px; border: 1.5px solid #e1e5ec; border-radius: 10px;
  font-size: 14px; font-weight: 600; color: #11233f; text-decoration: none;
  background: #fff; transition: border-color .18s, color .18s;
}
body.woocommerce-page.archive .widget-area .small-nav a::before {
  content: ""; width: 7px; height: 7px; border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor; transform: rotate(45deg); opacity: .7;
}
body.woocommerce-page.archive .widget-area .small-nav a:hover { border-color: #f78e1f; color: #f78e1f; }

/* Виджет-панель (общая карточка для price-filter и wcpfa) */
body.woocommerce-page.archive .widget-area .widget {
  background: #fff; border: 1px solid #e6eaf0; border-radius: 16px;
  padding: 20px 20px 22px; margin: 0;
}
body.woocommerce-page.archive .widget-area .widget + .widget { margin-top: 0; }

/* Заголовки групп */
body.woocommerce-page.archive .widget-area .widget-header,
body.woocommerce-page.archive .widget-area .wcpfa-title {
  font-family: 'Onest', sans-serif; font-size: 16px; font-weight: 700; color: #11233f;
  margin: 0 0 14px; padding: 0;
}
/* внутри одной wcpfa-формы несколько групп — отбивка сверху */
body.woocommerce-page.archive form.wcpfa .wcpfa-title { margin-top: 22px; }
body.woocommerce-page.archive form.wcpfa .wcpfa-title:first-of-type { margin-top: 0; }
body.woocommerce-page.archive form.wcpfa > .wcpfa-title + .attr-column-flex,
body.woocommerce-page.archive form.wcpfa .attr-column-flex { margin-bottom: 4px; }

/* ---------- Кастомные чекбоксы фильтров ---------- */
body.woocommerce-page.archive form.wcpfa .attr-column-flex {
  display: flex; flex-direction: column; gap: 10px;
}
body.woocommerce-page.archive form.wcpfa label {
  display: flex; align-items: center; gap: 11px; cursor: pointer;
  font-size: 14.5px; color: #3a4453; line-height: 1.3; margin: 0;
  transition: color .15s;
}
body.woocommerce-page.archive form.wcpfa label:hover { color: #11233f; }
body.woocommerce-page.archive form.wcpfa label input[type="checkbox"] {
  appearance: none; -webkit-appearance: none;
  flex: none; width: 20px; height: 20px; margin: 0;
  border: 1.6px solid #cfd6e2; border-radius: 6px; background: #fff;
  cursor: pointer; transition: background .15s, border-color .15s;
}
body.woocommerce-page.archive form.wcpfa label input[type="checkbox"]:hover { border-color: #f78e1f; }
body.woocommerce-page.archive form.wcpfa label input[type="checkbox"]:checked {
  background-color: #f78e1f; border-color: #f78e1f;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12l5 5L20 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 14px;
}
body.woocommerce-page.archive form.wcpfa label span { flex: 1; }
/* скрытые (свёрнутые) пункты */
body.woocommerce-page.archive form.wcpfa label.wcpfa-hidden { display: none; }
body.woocommerce-page.archive form.wcpfa .attr-column-flex.wcpfa-expanded label.wcpfa-hidden { display: flex; }

/* «Развернуть / Свернуть» */
body.woocommerce-page.archive form.wcpfa a.wcpfa-show {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 4px;
  font-size: 13.5px; font-weight: 600; color: #f78e1f; text-decoration: none;
}
body.woocommerce-page.archive form.wcpfa a.wcpfa-show:hover { text-decoration: underline; }

/* Кнопки Применить / Сбросить (низ wcpfa-формы) */
body.woocommerce-page.archive .wcpfa-filter-wrapper { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
body.woocommerce-page.archive .wcpfa-filter-submit,
body.woocommerce-page.archive form.wcpfa button[type="submit"] {
  flex: 1 1 auto; min-width: 120px;
  background: #f78e1f; color: #fff; border: none; border-radius: 11px;
  padding: 12px 18px; font-family: 'Onest', sans-serif; font-size: 14.5px; font-weight: 700;
  cursor: pointer; transition: background .18s, box-shadow .18s;
}
body.woocommerce-page.archive .wcpfa-filter-submit:hover,
body.woocommerce-page.archive form.wcpfa button[type="submit"]:hover {
  background: #e87d0a;
}
body.woocommerce-page.archive .wcpfa-filter-reset {
  flex: 0 0 auto; background: #fff; color: #6a7588; text-decoration: none;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid #e1e5ec; border-radius: 11px; padding: 12px 18px;
  font-family: 'Onest', sans-serif; font-size: 14.5px; font-weight: 600; cursor: pointer;
  transition: border-color .18s, color .18s;
}
body.woocommerce-page.archive .wcpfa-filter-reset:hover { border-color: #f78e1f; color: #f78e1f; }

/* ---------- Слайдер цены ----------
   Оставлен в ОРИГИНАЛЬНОМ виде темы (толстый оранжевый бар с пилюлями-ручками) —
   по просьбе клиента наши переопределения .price_slider* сняты. Только лёгкая
   отбивка враппера, не затрагивающая внешний вид самого слайдера. */
body.woocommerce-page.archive .widget_price_filter .price_slider_wrapper { margin-bottom: 14px; }

/* ---------- SEO-описание категории (низ) ---------- */
body.woocommerce-page.archive .term-description {
  margin-top: 40px; padding-top: 28px; border-top: 1px solid #e6eaf0;
  font-size: 15px; line-height: 1.7; color: #4a5568;
}
body.woocommerce-page.archive .term-description h2,
body.woocommerce-page.archive .term-description h3 {
  font-family: 'Onest', sans-serif; font-weight: 700; color: #11233f; margin: 26px 0 12px;
}

/* ============================================================
   ЛИПКИЙ САЙДБАР ФИЛЬТРОВ (десктоп ≥1025). Панель следует за
   скроллом и всегда видна. Тема ставит .site{overflow:hidden} —
   это ломает position:sticky, поэтому на архивах снимаем overflow
   с цепочки предков (шапка НЕ липкая → top небольшой).
   ============================================================ */
@media (min-width: 1025px) {
  body.woocommerce-page.archive .site,
  body.woocommerce-page.archive .site-content,
  body.woocommerce-page.archive .site-content-inner,
  body.woocommerce-page.archive .content-area,
  body.woocommerce-page.archive #primary { overflow: visible; }

  body.woocommerce-page.archive .widget-area {
    position: -webkit-sticky; position: sticky; top: 20px;
    align-self: flex-start;
    max-height: calc(100vh - 40px); overflow-y: auto;
    /* тонкий скролл, если фильтров много */
    scrollbar-width: thin; scrollbar-color: #cfd6e2 transparent;
  }
  body.woocommerce-page.archive .widget-area::-webkit-scrollbar { width: 6px; }
  body.woocommerce-page.archive .widget-area::-webkit-scrollbar-thumb {
    background: #cfd6e2; border-radius: 6px;
  }
}

/* ============================================================
   МОБИЛЬНАЯ ПАНЕЛЬ ФИЛЬТРОВ (off-canvas). Кнопка + оверлей —
   инжектит category.js. По умолчанию скрыто (десктоп).
   ============================================================ */
.yp-filters-btn { display: none; }
.yp-filters-overlay { display: none; }
body.woocommerce-page.archive .yp-filters-close { display: none; }

@media (max-width: 1024px) {
  /* Кнопка «Фильтры» в тулбаре */
  body.woocommerce-page.archive .yp-filters-btn {
    display: inline-flex; align-items: center; gap: 8px; order: -1;
    background: #11233f; color: #fff; border: none; border-radius: 12px;
    padding: 11px 20px; font-family: 'Onest', sans-serif; font-size: 14.5px; font-weight: 700;
    cursor: pointer; transition: background .18s;
  }
  body.woocommerce-page.archive .yp-filters-btn:hover { background: #1c3457; }
  body.woocommerce-page.archive .yp-filters-btn svg { width: 18px; height: 18px; }

  /* Сайдбар → выдвижная панель слева (тема прячет .widget-area--desktop на
     мобилке display:none — форсируем показ как выдвижной панели) */
  body.woocommerce-page.archive .widget-area {
    display: block; position: fixed; top: 0; left: 0; bottom: 0; z-index: 100000;
    width: min(360px, 88vw); max-width: 88vw; margin: 0; padding: 64px 18px 24px;
    background: #f4f6fa; box-shadow: 0 0 40px rgba(17,35,63,.25);
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    transform: translateX(-100%); transition: transform .28s ease;
    flex: none !important;
  }
  body.woocommerce-page.archive.yp-filters-open .widget-area { transform: translateX(0); }
  body.woocommerce-page.archive .widget-area .sticky-sidebar {
    position: static !important; top: auto !important;
  }

  /* Оверлей */
  body.woocommerce-page.archive .yp-filters-overlay {
    display: block; position: fixed; inset: 0; z-index: 99999;
    background: rgba(13,28,51,.5); opacity: 0; visibility: hidden;
    transition: opacity .28s, visibility .28s;
  }
  body.woocommerce-page.archive.yp-filters-open .yp-filters-overlay { opacity: 1; visibility: visible; }

  /* Кнопка закрытия внутри панели */
  body.woocommerce-page.archive .yp-filters-close {
    display: flex; align-items: center; justify-content: center;
    position: absolute; top: 14px; right: 14px; z-index: 2;
    width: 38px; height: 38px; border: none; border-radius: 10px;
    background: #fff; color: #11233f; font-size: 22px; line-height: 1; cursor: pointer;
  }
  body.woocommerce-page.archive .yp-filters-close:hover { color: #f78e1f; }
}

@media (max-width: 600px) {
  body.woocommerce-page.archive .woocommerce-products-header__title,
  body.woocommerce-page.archive .page-title { font-size: 26px; }
  body.woocommerce-page.archive .shop-sorting { gap: 12px; }
}
