/* =====================================================================
   ISA COMMERCE CORE — CATALOG (Shop · Product Category · Promo · Koleksi)
   Sumber: PROTOTYPE/isa-hijab/css/catalog.css (visual tidak diubah).
   Markup WordPress: templates/archive-product.html, taxonomy-product_cat.html,
   catalog-promo.html, catalog-collection.html + patterns/catalog-*.php.
   Pemetaan block WooCommerce:
     .breadcrumb          ← woocommerce/breadcrumbs (.woocommerce-breadcrumb)
     .catalog-hero        ← core/cover (gambar editable) / fallback token (kategori tanpa gambar)
     .cat-nav             ← woocommerce/product-categories (hasImage, hasCount) → chips
     .catalog__sidebar    ← woocommerce/product-filters (+ product-filter-*) — mobile: bottom sheet (CSS + JS)
     .toolbar             ← woocommerce/product-results-count + woocommerce/catalog-sorting
     .catalog__grid       ← woocommerce/product-collection (inherit) + Product Template = Product Card
     .empty               ← woocommerce/product-collection-no-results
     .pagination          ← core/query-pagination (di dalam Product Collection)
   Dimuat hanya pada halaman katalog (inc/assets.php).
   ===================================================================== */

/* ---------- 0. Reset spacing block (spesifisitas 0) ---------- */
:where(.catalog-intro, .catalog, .catalog-hero, .cat-nav, .catalog__sidebar, .catalog__results) :where(.wp-block-group, .wp-block-heading, .wp-block-image, .wp-block-buttons, .wp-block-cover, figure, p, h1, h2, h3) { margin: 0; }

/* ---------- 1. Page intro (breadcrumb + judul + deskripsi) ---------- */
.catalog-intro { padding-block: 1.25rem 0; }
.breadcrumb, .catalog-intro .woocommerce-breadcrumb, .catalog-intro .wp-block-woocommerce-breadcrumbs { display: flex; flex-wrap: wrap; gap: .5rem; font-size: var(--isa-text-caption); color: var(--isa-color-text-muted); list-style: none; margin: 0; padding: 0; line-height: 1.6; }
.breadcrumb a:hover, .woocommerce-breadcrumb a:hover { color: var(--isa-color-primary); }
.breadcrumb li + li::before { content: "/"; margin-right: .5rem; opacity: .5; }
/* Woo Breadcrumbs block: pemisah "/" bawaan diberi jarak seperti prototype */
.catalog-intro .woocommerce-breadcrumb { gap: 0; }
.catalog-intro .woocommerce-breadcrumb a { margin-right: .5rem; }
.catalog-intro .woocommerce-breadcrumb a + a::before, .catalog-intro .woocommerce-breadcrumb span::before { opacity: .5; }
.catalog-intro__head { display: flex; flex-direction: column; gap: .75rem; margin-top: 1.25rem; }
.catalog-intro__title { display: flex; align-items: baseline; gap: .75rem; flex-wrap: wrap; }
.catalog-intro__title h1 { font-size: var(--isa-text-h1); }
.catalog-intro__count { font-size: var(--isa-text-small); color: var(--isa-color-text-muted); font-variant-numeric: tabular-nums; }
.catalog-intro__desc { color: var(--isa-color-text-muted); max-width: 40rem; }
@media (min-width: 1024px) { .catalog-intro { padding-top: 1.75rem; } }

/* ---------- Archive hero (reusable): Shop · Kategori · Koleksi · Promo (slider) ----------
   Cover block = 1 slide (.catalog-hero__slide). Overlay diatur --hero-overlay (0–1) per slide.
   Tanpa gambar (kategori sebelum term meta hero tersedia) → fallback token: espresso + ornamen emas. */
.catalog-hero { position: relative; border-radius: var(--isa-radius-card); overflow: hidden; margin-top: 1.25rem; background: var(--isa-color-primary); color: var(--isa-color-text-inverse); }
.catalog-hero__track { display: flex; align-items: stretch; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.catalog-hero__track::-webkit-scrollbar { display: none; }
.catalog-hero--single .catalog-hero__track { overflow-x: hidden; }
.catalog-hero__slide, .catalog-hero .wp-block-cover.catalog-hero__slide {
  --hero-overlay: .55; position: relative; flex: 0 0 100%; width: 100%; min-height: 0; aspect-ratio: 4 / 3;
  display: grid; align-content: end; align-items: end; justify-content: stretch; scroll-snap-align: start; scroll-snap-stop: always; padding: 0; color: inherit;
}
.catalog-hero__slide picture, .catalog-hero__slide img, .catalog-hero__slide .wp-block-cover__image-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 22%; margin: 0; z-index: 0; }
/* overlay Cover core diganti gradien prototype */
.catalog-hero__slide .wp-block-cover__background { display: none; }
.catalog-hero__slide::after { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(to top, rgba(43,29,26,calc(var(--hero-overlay) + .35)) 0%, rgba(43,29,26,var(--hero-overlay)) 45%, rgba(43,29,26,calc(var(--hero-overlay) * .25)) 100%); }
.catalog-hero__text { position: relative; z-index: 1; width: 100%; padding: clamp(1.25rem, 3vw, 2.5rem); }
/* inner container Cover dibuat static agar Image mobile (absolute) mengacu ke slide; isi teks diangkat di atas overlay */
.catalog-hero__slide .wp-block-cover__inner-container { position: static; width: 100%; max-width: none; padding: clamp(1.25rem, 3vw, 2.5rem); color: inherit; }
.catalog-hero__text > *, .catalog-hero__slide .wp-block-cover__inner-container > * { margin: 0; }
.catalog-hero__slide .wp-block-cover__inner-container > :not(.img--mobile):not(.catalog-hero__ornament) { position: relative; z-index: 1; }
.catalog-hero__text h1, .catalog-hero__text h2, .catalog-hero__slide .wp-block-cover__inner-container :is(h1, h2) { color: var(--isa-color-text-inverse); margin-top: .5rem; text-wrap: balance; font-size: var(--isa-text-h1); font-family: var(--isa-font-display); font-weight: 500; line-height: var(--isa-leading-tight); letter-spacing: -.01em; }
.catalog-hero__text p:not(.is-style-eyebrow):not(.catalog-hero__badge), .catalog-hero__slide .wp-block-cover__inner-container p:not(.is-style-eyebrow):not(.catalog-hero__badge) { margin-top: .5rem; max-width: 34rem; color: rgba(251,247,241,.82); font-size: var(--isa-text-small); }
.catalog-hero__slide .is-style-eyebrow, .catalog-hero__slide .is-style-eyebrow-center, .catalog-hero__slide .eyebrow { color: var(--isa-color-accent); }
.catalog-hero__badge, .catalog-hero__slide p.catalog-hero__badge { display: inline-block; width: max-content; margin: 0 0 .6rem; padding: .3rem .6rem; border-radius: var(--isa-radius-pill); background: var(--isa-color-error); color: #fff; font-size: .65rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.catalog-hero__cta, .catalog-hero__slide .wp-block-buttons { margin-top: 1rem; display: flex; gap: .6rem; flex-wrap: wrap; }
.catalog-hero__slide .wp-block-button__link { min-height: 2.5rem; padding: 0 1.25rem; font-size: var(--isa-text-caption); }
.catalog-hero__slide--center .wp-block-cover__inner-container, .catalog-hero__slide--center .catalog-hero__text { text-align: center; }
.catalog-hero__slide--center .wp-block-cover__inner-container p { margin-inline: auto; }
.catalog-hero__slide--center .wp-block-buttons { justify-content: center; }
.catalog-hero__slide--center .is-style-eyebrow { justify-content: center; display: flex; }
.catalog-hero__slide--center .is-style-eyebrow::after { content: ""; width: 2rem; height: 1px; background: currentColor; }
/* Gambar mobile opsional (Image block .img--mobile di dalam slide): tampil <768, menutup gambar Cover */
.catalog-hero__slide .img--mobile { position: absolute; inset: 0; z-index: 0; margin: 0; }
.catalog-hero__slide .img--mobile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 22%; }
@media (min-width: 768px) { .catalog-hero__slide .img--mobile { display: none; } }
.catalog-hero__ornament { display: none; }
/* Fallback tanpa gambar */
.catalog-hero__slide--fallback { background: linear-gradient(135deg, var(--isa-color-primary) 0%, color-mix(in srgb, var(--isa-color-primary) 82%, var(--isa-color-secondary)) 100%); }
.catalog-hero__slide--fallback::after { background: none; }
.catalog-hero__slide:not(:has(img)) { background: linear-gradient(135deg, var(--isa-color-primary) 0%, color-mix(in srgb, var(--isa-color-primary) 82%, var(--isa-color-secondary)) 100%); }
.catalog-hero__slide:not(:has(img))::after { background: none; }
.catalog-hero__slide:not(:has(img)) .catalog-hero__ornament { display: block; position: absolute; right: -6rem; top: -8rem; width: 22rem; height: 22rem; border: 1px solid rgba(201,162,77,.35); border-radius: 50%; pointer-events: none; }
.catalog-hero--single:has(.catalog-hero__slide:not(:has(img))) .catalog-hero__slide { aspect-ratio: auto; min-height: 14rem; }
.catalog-hero__slide .wp-block-post-excerpt__excerpt { margin-top: .5rem; max-width: 34rem; color: rgba(251,247,241,.82); font-size: var(--isa-text-small); }
.catalog-hero__slide .wp-block-post-excerpt__more-text, .catalog-hero__slide .wp-block-post-excerpt__more-link { display: none; }
.catalog-hero__slide--fallback .catalog-hero__ornament { display: block; position: absolute; right: -6rem; top: -8rem; width: 22rem; height: 22rem; border: 1px solid rgba(201,162,77,.35); border-radius: 50%; pointer-events: none; }
.catalog-hero__slide--fallback .catalog-hero__ornament::after { content: ""; position: absolute; inset: 2.5rem; border: 1px solid rgba(201,162,77,.2); border-radius: 50%; }
.catalog-hero--fallback .catalog-hero__slide { aspect-ratio: auto; min-height: 14rem; }
.catalog-hero--fallback .catalog-hero__text, .catalog-hero--fallback .wp-block-cover__inner-container { padding-top: clamp(2.5rem, 6vw, 4rem); }
/* Navigasi slideshow (hanya bila >1 slide) */
.catalog-hero__nav { display: none; }
.catalog-hero__dots { position: absolute; z-index: 2; left: 0; right: 0; bottom: .7rem; display: flex; justify-content: center; gap: .4rem; pointer-events: none; }
.catalog-hero__dots button { pointer-events: auto; width: .5rem; height: .5rem; padding: 0; border-radius: 50%; border: 0; background: rgba(251,247,241,.45); cursor: pointer; transition: width var(--isa-motion-fast), background var(--isa-motion-fast); }
.catalog-hero__dots button[aria-current="true"] { width: 1.4rem; border-radius: var(--isa-radius-pill); background: var(--isa-color-accent); }
.catalog-hero__dots button:focus-visible { outline: 2px solid var(--isa-color-accent); outline-offset: 2px; }
.catalog-hero--slider .wp-block-cover__inner-container, .catalog-hero--slider .catalog-hero__text { padding-bottom: calc(clamp(1.25rem, 3vw, 2.5rem) + 1rem); }
@media (min-width: 768px) {
  .catalog-hero__slide, .catalog-hero .wp-block-cover.catalog-hero__slide { aspect-ratio: 16 / 7; }
  .catalog-hero__slide::after { background: linear-gradient(to right, rgba(43,29,26,calc(var(--hero-overlay) + .25)) 0%, rgba(43,29,26,calc(var(--hero-overlay) * .2)) 65%, rgba(43,29,26,calc(var(--hero-overlay) * .1)) 100%); }
  .catalog-hero__slide--center::after { background: linear-gradient(to top, rgba(43,29,26,calc(var(--hero-overlay) + .3)) 0%, rgba(43,29,26,calc(var(--hero-overlay) * .4)) 55%, rgba(43,29,26,calc(var(--hero-overlay) * .1)) 100%); }
  .catalog-hero--fallback .catalog-hero__slide { min-height: 16rem; }
  .catalog-hero__slide--fallback .catalog-hero__ornament { right: -4rem; top: -10rem; width: 30rem; height: 30rem; }
  .catalog-hero--slider .catalog-hero__nav { display: flex; position: absolute; z-index: 2; right: clamp(1.25rem, 3vw, 2.5rem); bottom: clamp(1.25rem, 3vw, 2.5rem); gap: .4rem; }
  .catalog-hero__nav button { width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(251,247,241,.5); background: rgba(43,29,26,.35); color: var(--isa-color-text-inverse); cursor: pointer; backdrop-filter: blur(4px); transition: background var(--isa-motion-fast), border-color var(--isa-motion-fast); }
  .catalog-hero__nav button:hover { background: var(--isa-color-accent); border-color: var(--isa-color-accent); color: var(--isa-color-primary); }
  .catalog-hero__nav button .icon { width: 1.1rem; height: 1.1rem; }
  .catalog-hero--slider .catalog-hero__dots { justify-content: flex-start; left: clamp(1.25rem, 3vw, 2.5rem); bottom: clamp(1.25rem, 3vw, 2.5rem); align-items: center; height: 2.5rem; }
  .catalog-hero--slider .wp-block-cover__inner-container, .catalog-hero--slider .catalog-hero__text { padding-bottom: calc(clamp(1.25rem, 3vw, 2.5rem) + 3.25rem); padding-right: 9rem; }
}
@media (min-width: 1024px) { .catalog-hero__slide, .catalog-hero .wp-block-cover.catalog-hero__slide { aspect-ratio: 16 / 6; } }
/* Slide tanpa gambar (Cover tanpa featured image / kategori tanpa cover): tinggi mengikuti teks */
.catalog-hero .catalog-hero__slide:not(:has(img)), .catalog-hero .wp-block-cover.catalog-hero__slide:not(:has(img)) { aspect-ratio: auto; min-height: 14rem; }
@media (min-width: 768px) { .catalog-hero .catalog-hero__slide:not(:has(img)), .catalog-hero .wp-block-cover.catalog-hero__slide:not(:has(img)) { min-height: 16rem; } }
@media (prefers-reduced-motion: reduce) { .catalog-hero__track { scroll-behavior: auto; } }
.catalog-hero[hidden] { display: none; }

/* ---------- 2. Category navigation (chips) ← Woo Product Categories block ---------- */
/* .cat-nav (Group nav) = baris scroll; chip "Semua" (HTML) + Product Categories block (ul → display:contents) satu baris */
.cat-nav, .cat-nav__list { display: flex; gap: .5rem; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; padding-inline: var(--isa-page-padding); margin-inline: calc(-1 * var(--isa-page-padding)); padding-bottom: .25rem; list-style: none; }
.cat-nav { margin-top: 1.5rem; }
.cat-nav::-webkit-scrollbar, .cat-nav__list::-webkit-scrollbar { display: none; }
.cat-nav .wc-block-product-categories, .cat-nav .wc-block-product-categories-list { display: contents; font-size: inherit; }
.cat-nav .wc-block-product-categories-list-item { display: flex; flex: none; margin: 0; padding: 0; }
.cat-chip, .cat-nav .wc-block-product-categories-list-item > a {
  flex: none; scroll-snap-align: start; display: inline-flex; align-items: center; gap: .6rem;
  min-height: 2.75rem; padding: .3rem 1rem .3rem .3rem;
  border: 1px solid var(--isa-color-border); border-radius: var(--isa-radius-pill); background: var(--isa-color-surface);
  font-size: var(--isa-text-small); font-weight: 500; color: var(--isa-color-primary); white-space: nowrap; text-decoration: none;
  transition: border-color var(--isa-motion-fast), background var(--isa-motion-fast), color var(--isa-motion-fast);
}
.cat-chip img, .cat-nav .wc-block-product-categories-list-item__image, .cat-nav .wc-block-product-categories-list-item__image img { width: 2.1rem; height: 2.1rem; border-radius: 50%; object-fit: cover; object-position: top; margin: 0; }
.cat-nav .wc-block-product-categories-list-item__image { display: block; overflow: hidden; }
.cat-chip--all { padding-left: 1rem; }
.cat-chip span small { display: block; font-size: .65rem; color: var(--isa-color-text-muted); letter-spacing: .04em; margin-top: -.1rem; }
/* jumlah produk (Woo): ditampilkan kecil di bawah nama seperti prototype */
.cat-nav .wc-block-product-categories-list-item > a { flex-wrap: wrap; column-gap: .6rem; row-gap: 0; }
.cat-nav .wc-block-product-categories-list-item-count { order: 3; width: 100%; padding-left: calc(2.1rem + .6rem); margin-top: -.35rem; font-size: .65rem; color: var(--isa-color-text-muted); letter-spacing: .04em; }
.cat-nav .wc-block-product-categories-list-item-count::before, .cat-nav .wc-block-product-categories-list-item-count::after { content: none; }
.cat-nav .wc-block-product-categories-list-item > a:has(.wc-block-product-categories-list-item-count) { display: grid; grid-template-columns: auto 1fr; align-items: center; padding-right: 1rem; }
.cat-nav .wc-block-product-categories-list-item > a:has(.wc-block-product-categories-list-item-count) .wc-block-product-categories-list-item__image { grid-row: 1 / span 2; }
.cat-nav .wc-block-product-categories-list-item > a:has(.wc-block-product-categories-list-item-count) .wc-block-product-categories-list-item-count { grid-column: 2; width: auto; padding-left: 0; margin-top: -.15rem; order: 0; }
.cat-chip:hover, .cat-nav .wc-block-product-categories-list-item > a:hover { border-color: var(--isa-color-primary); }
.cat-chip[aria-current="page"], .cat-nav .wc-block-product-categories-list-item.is-current > a, .cat-nav .current-cat > a { background: var(--isa-color-primary); color: var(--isa-color-text-inverse); border-color: var(--isa-color-primary); }
.cat-chip[aria-current="page"] small, .cat-nav .is-current .wc-block-product-categories-list-item-count { color: rgba(251,247,241,.65); }
.cat-nav .wc-block-product-categories-list--has-images { padding: 0; }
@media (min-width: 1024px) { .cat-nav, .cat-nav__list { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding: 0; } }

/* ---------- 3. Layout: sidebar (desktop) + hasil ---------- */
.catalog { display: grid; gap: 1.5rem; margin-top: 1.5rem; padding-bottom: var(--isa-section-space); }
@media (min-width: 1024px) {
  .catalog { grid-template-columns: 17rem minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem); margin-top: 2rem; align-items: start; }
}
.catalog__results { min-width: 0; }

/* ---------- 4. Toolbar (jumlah · chip aktif · sort) ← Results Count + Catalog Sorting ---------- */
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--isa-color-border); }
.toolbar__count, .toolbar .wc-block-product-results-count, .toolbar .woocommerce-result-count { font-size: var(--isa-text-small); color: var(--isa-color-text-muted); font-variant-numeric: tabular-nums; margin: 0 auto 0 0; }
.toolbar__count strong { color: var(--isa-color-primary); font-weight: 600; }
.sort, .toolbar .wc-block-catalog-sorting, .toolbar .woocommerce-ordering { position: relative; display: inline-flex; align-items: center; gap: .5rem; margin: 0; }
.sort label, .toolbar .wc-block-catalog-sorting label, .toolbar .woocommerce-ordering label { font-size: var(--isa-text-caption); letter-spacing: .08em; text-transform: uppercase; color: var(--isa-color-text-muted); }
.sort select, .toolbar .woocommerce-ordering select, .sort-sheet select {
  appearance: none; -webkit-appearance: none; min-height: 2.75rem; padding: 0 2.25rem 0 1rem; font: inherit; font-size: var(--isa-text-small); font-weight: 500;
  color: var(--isa-color-primary); background: var(--isa-color-surface) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>") right .8rem center / 1rem no-repeat;
  border: 1px solid var(--isa-color-border); border-radius: var(--isa-radius-pill); cursor: pointer;
}
.sort select:focus-visible, .toolbar .woocommerce-ordering select:focus-visible { outline: 2px solid var(--isa-color-accent); outline-offset: 2px; }
/* Mobile toolbar: [FILTER] [SORT] sticky di bawah header */
.mtoolbar { position: sticky; top: var(--isa-header-h); z-index: 40; display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; padding: .6rem 0; background: var(--isa-color-background); }
.mtoolbar .btn { min-height: 2.9rem; gap: .5rem; padding-inline: .75rem; min-width: 0; font-size: var(--isa-text-caption); }
.mtoolbar .btn .count { display: inline-grid; place-items: center; min-width: 1.25rem; height: 1.25rem; padding: 0 .3rem; border-radius: var(--isa-radius-pill); background: var(--isa-color-accent); color: var(--isa-color-primary); font-size: .65rem; }
.mtoolbar .btn .count:empty { display: none; }
@media (min-width: 1024px) { .mtoolbar { display: none; } }
.toolbar--desktop { display: none; }
@media (min-width: 1024px) { .toolbar--desktop { display: flex; } }

/* Chip filter aktif ← Woo Product Filter: Active (removable chips) */
.active-filters, .catalog__results .wc-block-product-filter-active { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; padding-block: .75rem; }
.active-filters:empty { display: none; }
.chip, .catalog__results .wc-block-product-filter-removable-chips__item, .catalog__results .wc-block-product-filter-chips__item, .catalog__results .wc-block-product-filter-active__chip { display: inline-flex; align-items: center; gap: .4rem; min-height: 2rem; padding: 0 .4rem 0 .75rem; border-radius: var(--isa-radius-pill); background: var(--isa-color-surface-alt); border: 1px solid var(--isa-color-border); font-size: var(--isa-text-caption); font-weight: 500; color: var(--isa-color-primary); }
.chip button, .catalog__results .wc-block-product-filter-removable-chips__remove, .catalog__results .wc-block-product-filter-active__chip button { display: grid; place-items: center; width: 1.4rem; height: 1.4rem; border-radius: 50%; color: var(--isa-color-text-muted); background: none; border: 0; padding: 0; }
.chip button:hover { background: var(--isa-color-primary); color: #fff; }
.chip .icon { width: .8rem; height: .8rem; }
.chip .swatch { width: .7rem; height: .7rem; }
.active-filters__clear, .catalog__results .wc-block-product-filter-clear-button, .catalog__sidebar .wc-block-product-filter-clear-button { font-size: var(--isa-text-caption); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--isa-color-secondary); text-decoration: underline; text-underline-offset: 3px; margin-left: .25rem; background: none; border: 0; padding: 0; cursor: pointer; }

/* ---------- 5. Filter panel ← Woo Product Filters (sidebar desktop = sheet mobile, DOM sama) ---------- */
.filters, .catalog__sidebar .wc-block-product-filters, .catalog__sidebar .wp-block-woocommerce-product-filters { display: grid; gap: 0; }
.filter-group, .catalog__sidebar .wc-block-product-filter, .catalog__sidebar [class*="wp-block-woocommerce-product-filter-"]:not(.wp-block-woocommerce-product-filters) { border-top: 1px solid var(--isa-color-border); padding: 0; margin: 0; }
.filter-group:first-child, .catalog__sidebar .wc-block-product-filter:first-child { border-top: 0; }
.filter-group__head, .catalog__sidebar .wc-block-product-filter > .wp-block-heading, .catalog__sidebar .wc-block-product-filter__heading, .catalog__sidebar [class*="wp-block-woocommerce-product-filter-"] > h3 { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 1rem 0; margin: 0; font-family: var(--isa-font-body); font-size: var(--isa-text-caption); font-weight: 700; letter-spacing: var(--isa-tracking-wider); text-transform: uppercase; color: var(--isa-color-primary); text-align: left; list-style: none; cursor: pointer; }
.filter-group__head .icon { color: var(--isa-color-accent); transition: transform var(--isa-motion-normal); }
.filter-group[open] .filter-group__head .icon { transform: rotate(180deg); }
.filter-group__head::-webkit-details-marker { display: none; }
.filter-group__body { padding: 0 0 1.25rem; }
.catalog__sidebar .wc-block-product-filter > *:not(.wp-block-heading):last-child { padding-bottom: 1.25rem; }
.filter-group__count { font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--isa-color-text-muted); margin-left: .5rem; }

/* Daftar checkbox (kategori, koleksi, ketersediaan, atribut) */
.opt-list, .catalog__sidebar .wc-block-product-filter-checkbox-list__list { display: grid; gap: .35rem; list-style: none; margin: 0; padding: 0; }
.opt, .catalog__sidebar .wc-block-product-filter-checkbox-list__item, .catalog__sidebar .wc-block-product-filter-checkbox-list__label { display: flex; align-items: center; gap: .6rem; min-height: 2.25rem; font-size: var(--isa-text-small); color: var(--isa-color-text); cursor: pointer; margin: 0; }
.opt input { position: absolute; opacity: 0; width: 0; height: 0; }
.opt__box, .catalog__sidebar .wc-block-product-filter-checkbox-list__input-wrapper { flex: none; width: 1.1rem; height: 1.1rem; border: 1px solid var(--isa-color-border); border-radius: 3px; display: grid; place-items: center; background: var(--isa-color-surface); position: relative; transition: background var(--isa-motion-fast), border-color var(--isa-motion-fast); }
.opt__box .icon { width: .75rem; height: .75rem; color: #fff; opacity: 0; stroke-width: 2.4; }
.opt input:checked + .opt__box { background: var(--isa-color-primary); border-color: var(--isa-color-primary); }
.opt input:checked + .opt__box .icon { opacity: 1; }
.opt input:focus-visible + .opt__box { outline: 2px solid var(--isa-color-accent); outline-offset: 2px; }
.catalog__sidebar .wc-block-product-filter-checkbox-list__input { appearance: none; -webkit-appearance: none; position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border: 0; background: none; cursor: pointer; }
.catalog__sidebar .wc-block-product-filter-checkbox-list__mark { display: block; width: .75rem; height: .75rem; opacity: 0; color: #fff; }
.catalog__sidebar .wc-block-product-filter-checkbox-list__input-wrapper:has(:checked) { background: var(--isa-color-primary); border-color: var(--isa-color-primary); }
.catalog__sidebar .wc-block-product-filter-checkbox-list__input-wrapper:has(:checked) .wc-block-product-filter-checkbox-list__mark { opacity: 1; }
.catalog__sidebar .wc-block-product-filter-checkbox-list__input-wrapper:has(:focus-visible) { outline: 2px solid var(--isa-color-accent); outline-offset: 2px; }
.opt--radio .opt__box { border-radius: 50%; }
.opt--radio .opt__box::after { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: #fff; opacity: 0; }
.opt--radio input:checked + .opt__box::after { opacity: 1; }
.opt__count, .catalog__sidebar .wc-block-product-filter-checkbox-list__text .wc-block-product-filter-checkbox-list__count, .catalog__sidebar .wc-block-product-filter-checkbox-list__item .wc-block-product-filter-checkbox-list__count { margin-left: auto; font-size: var(--isa-text-caption); color: var(--isa-color-text-muted); font-variant-numeric: tabular-nums; }
.catalog__sidebar .wc-block-product-filter-checkbox-list__text { display: flex; flex: 1; align-items: center; gap: .5rem; }
.catalog__sidebar .wc-block-product-filter-checkbox-list__label { flex: 1; }
.opt.is-disabled { opacity: .4; pointer-events: none; }

/* Chips atribut (Ukuran) ← Product Filter: Chips */
.size-grid, .catalog__sidebar .wc-block-product-filter-chips__items { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: 0; padding: 0; }
.size-opt { position: relative; }
.size-opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.size-opt span, .catalog__sidebar .wc-block-product-filter-chips__item { display: inline-flex; align-items: center; justify-content: center; min-width: 2.75rem; height: 2.75rem; padding: 0 .75rem; border: 1px solid var(--isa-color-border); border-radius: var(--isa-radius); background: var(--isa-color-surface); font-size: var(--isa-text-small); font-weight: 500; color: var(--isa-color-primary); cursor: pointer; transition: all var(--isa-motion-fast); }
.size-opt input:checked + span, .catalog__sidebar .wc-block-product-filter-chips__item[aria-checked="true"], .catalog__sidebar .wc-block-product-filter-chips__item.is-selected { background: var(--isa-color-primary); color: var(--isa-color-text-inverse); border-color: var(--isa-color-primary); }
.size-opt input:focus-visible + span, .catalog__sidebar .wc-block-product-filter-chips__item:focus-visible { outline: 2px solid var(--isa-color-accent); outline-offset: 2px; }
.size-opt input:disabled + span { opacity: .35; text-decoration: line-through; }

/* Swatch warna (pa_color) — Woo belum menyediakan swatch native di Product Filters; chips warna diberi bulatan
   berbasis kelas warna (plugin ISA Commerce Core menambah data-color pada opsi). Fallback = chips teks. */
.color-grid { display: flex; flex-wrap: wrap; gap: .5rem; }
.color-opt { position: relative; }
.color-opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.color-opt span { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--isa-color-border); background: var(--isa-color-surface); transition: border-color var(--isa-motion-fast), transform var(--isa-motion-fast); }
.color-opt i { display: block; width: 1.5rem; height: 1.5rem; border-radius: 50%; border: 1px solid rgba(0,0,0,.1); }
.color-opt input:checked + span { border: 2px solid var(--isa-color-primary); }
.color-opt input:focus-visible + span { outline: 2px solid var(--isa-color-accent); outline-offset: 2px; }
.color-opt:hover span { transform: scale(1.05); }
.color-opt input:disabled + span { opacity: .3; }
.catalog__sidebar [data-color] .wc-block-product-filter-checkbox-list__text::before, .catalog__sidebar .wc-block-product-filter-chips__item[data-color]::before { content: ""; width: 1rem; height: 1rem; border-radius: 50%; border: 1px solid rgba(0,0,0,.1); background: attr(data-color); flex: none; }

/* Harga ← Product Filter: Price (slider + input) */
.price-inputs, .catalog__sidebar .wc-block-product-filter-price-slider__content, .catalog__sidebar .wc-block-product-filter-price__content { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .5rem; margin-top: .75rem; }
.price-inputs input, .catalog__sidebar .wc-block-product-filter-price-slider__content input, .catalog__sidebar .wc-block-product-filter-price__content input[type="text"], .catalog__sidebar .wc-block-product-filter-price__content input[type="number"] { width: 100%; min-height: 2.6rem; padding: 0 .75rem; font: inherit; font-size: var(--isa-text-small); border: 1px solid var(--isa-color-border); border-radius: var(--isa-radius); background: var(--isa-color-surface); }
.price-inputs input:focus, .catalog__sidebar .wc-block-product-filter-price-slider__content input:focus { outline: none; border-color: var(--isa-color-accent); }
.price-inputs span { color: var(--isa-color-text-muted); }
.catalog__sidebar .wc-block-product-filter-price-slider__range { grid-column: 1 / -1; order: -1; --range-color: var(--isa-color-primary); }
.catalog__sidebar input[type="range"] { accent-color: var(--isa-color-primary); width: 100%; }

/* Sidebar desktop */
.catalog__sidebar-head { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; padding-bottom: .75rem; margin-bottom: .25rem; border-bottom: 1px solid var(--isa-color-primary); }
.catalog__sidebar-head h2 { font-family: var(--isa-font-display); font-size: 1.5rem; font-weight: 500; color: var(--isa-color-primary); margin: 0; }
.catalog__sidebar-head .icon-btn { display: none; }
.catalog__sidebar-foot { display: none; }
.catalog__sidebar .wc-block-product-filters__overlay-button, .catalog__sidebar .wc-block-product-filters__open-overlay { display: none; }
@media (min-width: 1024px) {
  .catalog__sidebar { display: block; position: sticky; top: 6.5rem; max-height: calc(100vh - 7.5rem); overflow-y: auto; scrollbar-width: thin; padding-right: .5rem; }
}

/* ---------- 6. Mobile: sidebar filter menjadi bottom sheet (DOM sama, tanpa duplikasi block Woo) ---------- */
@media (max-width: 1023px) {
  .catalog__sidebar { position: fixed; inset: 0; z-index: var(--isa-z-drawer); visibility: hidden; pointer-events: none; }
  .catalog__sidebar.is-open { visibility: visible; pointer-events: auto; }
  .catalog__sidebar::before { content: ""; position: absolute; inset: 0; background: var(--isa-color-overlay); opacity: 0; transition: opacity var(--isa-motion-normal); }
  .catalog__sidebar.is-open::before { opacity: 1; }
  .catalog__sidebar-panel {
    position: absolute; left: 0; right: 0; bottom: 0; max-height: 88dvh; display: flex; flex-direction: column;
    background: var(--isa-color-background); border-radius: 16px 16px 0 0; box-shadow: var(--isa-shadow-lg);
    transform: translateY(100%); transition: transform var(--isa-motion-normal) var(--isa-ease-out);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .catalog__sidebar-panel::before { content: ""; width: 2.5rem; height: .25rem; border-radius: 999px; background: var(--isa-color-border); margin: .6rem auto 0; }
  .catalog__sidebar.is-open .catalog__sidebar-panel { transform: none; }
  .catalog__sidebar-head { padding: .75rem var(--isa-mobile-padding); margin: 0; border-bottom: 1px solid var(--isa-color-border); align-items: center; }
  .catalog__sidebar-head .icon-btn { display: inline-grid; }
  .catalog__sidebar-body { overflow-y: auto; padding: 0 var(--isa-mobile-padding); -webkit-overflow-scrolling: touch; }
  .catalog__sidebar-foot { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .75rem; padding: .75rem var(--isa-mobile-padding) 1rem; border-top: 1px solid var(--isa-color-border); background: var(--isa-color-background); }
  .catalog__sidebar-foot .btn, .catalog__sidebar-foot .wp-block-button__link { min-height: 3.25rem; padding-inline: 1rem; min-width: 0; }
}
/* Sheet urutkan (mobile) — daftar radio dibangun JS dari Catalog Sorting select */
.sheet { position: fixed; inset: 0; z-index: var(--isa-z-drawer); visibility: hidden; pointer-events: none; }
.sheet.is-open { visibility: visible; pointer-events: auto; }
.sheet__backdrop { position: absolute; inset: 0; background: var(--isa-color-overlay); opacity: 0; transition: opacity var(--isa-motion-normal); }
.sheet.is-open .sheet__backdrop { opacity: 1; }
.sheet__panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: 70dvh; display: flex; flex-direction: column; background: var(--isa-color-background); border-radius: 16px 16px 0 0; box-shadow: var(--isa-shadow-lg); transform: translateY(100%); transition: transform var(--isa-motion-normal) var(--isa-ease-out); padding-bottom: env(safe-area-inset-bottom); }
.sheet.is-open .sheet__panel { transform: none; }
.sheet__grip { width: 2.5rem; height: .25rem; border-radius: 999px; background: var(--isa-color-border); margin: .6rem auto 0; }
.sheet__head { display: flex; align-items: center; justify-content: space-between; padding: .75rem var(--isa-mobile-padding); border-bottom: 1px solid var(--isa-color-border); }
.sheet__head h2 { font-family: var(--isa-font-display); font-size: 1.5rem; font-weight: 500; color: var(--isa-color-primary); margin: 0; }
.sheet__body { overflow-y: auto; padding: 0 var(--isa-mobile-padding); -webkit-overflow-scrolling: touch; }
.sort-list { display: grid; padding-block: .5rem; }
.sort-list .opt { min-height: 3.25rem; border-bottom: 1px solid var(--isa-color-border); font-size: var(--isa-text-body); position: relative; }
.sort-list .opt:last-child { border-bottom: 0; }
@media (min-width: 1024px) { .sheet { display: none; } }

/* ---------- 7. Grid, pagination ---------- */
.catalog__grid { margin-top: 1.5rem; }
.catalog__grid.product-grid .wc-block-product-template, .catalog__grid.product-grid { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 768px) { .catalog__grid.product-grid .wc-block-product-template, .catalog__grid.product-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1440px) { .catalog__grid.product-grid .wc-block-product-template, .catalog__grid.product-grid { grid-template-columns: repeat(4, 1fr); } }
.catalog__grid.is-loading { opacity: .55; pointer-events: none; transition: opacity var(--isa-motion-fast); }

.pagination, .catalog__grid .wp-block-query-pagination { display: flex; flex-direction: column; align-items: center; gap: 1rem; margin-top: clamp(2rem, 4vw, 3rem); }
.pagination__meter { width: min(100%, 14rem); height: 2px; background: var(--isa-color-border); position: relative; }
.pagination__meter i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--isa-color-primary); transition: width var(--isa-motion-slow) var(--isa-ease); }
.pagination__info { font-size: var(--isa-text-caption); color: var(--isa-color-text-muted); font-variant-numeric: tabular-nums; }
.pagination__pages, .catalog__grid .wp-block-query-pagination-numbers { display: flex; gap: .35rem; }
.pagination__page, .catalog__grid .wp-block-query-pagination-numbers .page-numbers { min-width: 2.5rem; height: 2.5rem; display: grid; place-items: center; padding: 0; border-radius: 50%; font-size: var(--isa-text-small); font-weight: 500; border: 1px solid transparent; text-decoration: none; transition: all var(--isa-motion-fast); }
.pagination__page:hover, .catalog__grid .wp-block-query-pagination-numbers a.page-numbers:hover { border-color: var(--isa-color-border); }
.pagination__page[aria-current="page"], .catalog__grid .wp-block-query-pagination-numbers .page-numbers.current { background: var(--isa-color-primary); color: var(--isa-color-text-inverse); }
.catalog__grid .wp-block-query-pagination-previous, .catalog__grid .wp-block-query-pagination-next { display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0 1rem; border: 1px solid var(--isa-color-border); border-radius: var(--isa-radius-pill); font-size: var(--isa-text-caption); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.catalog__grid .wp-block-query-pagination.is-layout-flex { flex-direction: row; flex-wrap: wrap; justify-content: center; }
.pagination[hidden] { display: none; }

/* ---------- 8. Empty state ← Product Collection: No Results ---------- */
.catalog__grid .wc-block-product-collection-no-results, .catalog__grid .wp-block-woocommerce-product-collection-no-results { grid-column: 1 / -1; }
.empty { grid-column: 1 / -1; text-align: center; padding: clamp(3rem, 8vw, 6rem) 1rem; border: 1px dashed var(--isa-color-border); border-radius: var(--isa-radius-card); }
.empty > * { margin: 0; }
.empty__icon { width: 3.5rem; height: 3.5rem; margin: 0 auto 1.25rem; display: grid; place-items: center; border-radius: 50%; background: var(--isa-color-surface-alt); color: var(--isa-color-accent); }
.empty__icon::before { content: ""; width: 1.5rem; height: 1.5rem; background: currentColor; -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><path d='M20 20l-3.4-3.4'/></svg>") center / contain no-repeat; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><path d='M20 20l-3.4-3.4'/></svg>") center / contain no-repeat; }
.empty h2, .empty .t-h3 { max-width: 22ch; margin-inline: auto; font-size: var(--isa-text-h3); }
.empty p { margin-top: .5rem; color: var(--isa-color-text-muted); max-width: 32rem; margin-inline: auto; font-size: var(--isa-text-small); }
.empty__actions, .empty .wp-block-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-top: 1.5rem; }
.empty__suggest { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: 1.5rem; }
.empty[hidden] { display: none; }

/* Product Card (quick add, kategori, stok) → components.css (dipakai homepage & katalog) */

/* CTA kembali ke Shop (halaman koleksi) */
.catalog-back { text-align: center; margin-top: clamp(2rem, 4vw, 3rem); }
.catalog-back .wp-block-buttons { justify-content: center; }