/* ═══════════════════════════════════════════
   WV Search — Searchanise results-page overrides
   ───────────────────────────────────────────
   Scoped to the /search-results/ page (slug auto-created by the
   Searchanise plugin). Body class `searchanise-search-results-page`
   is added by the plugin; we use that as the safety scope so these
   rules can't accidentally apply elsewhere.

   The Snize DOM is SaaS-injected and we can't modify the markup —
   these rules skin specific Snize elements to inherit the existing
   WV recipes (shop category pill, ATC button) so the results page
   visually aligns with the rest of the site without rebuilding.

   First pass — 2026-06-04:
     - Drop Categories tab
     - Style Products + Pages tabs to match .wv-shop-cats__pill
     - Hide inline tab count numbers (label-only per mockup)
     - Style "View product" button to match .wv-card__atc

   Everything else (header search line, filter/sort, card layout,
   grid behavior, infinite scroll) intentionally untouched — current
   Snize default is shippable per direction 2026-06-04.
   ═══════════════════════════════════════════ */


/* ── Constrain results to the page content width ─────────────────
   #snize_results is injected into .wv-main, which has no max-width,
   so the SaaS results span full-bleed. Cap to the tight content tier
   (1024) and center, with the standard responsive page gutter
   (--wv-page-gutter: 16/40/48) — matching every other constrained
   content page. */
.searchanise-search-results-page #snize_results {
  max-width: var(--wv-page-content-tight);
  margin-inline: auto;
  padding-inline: var(--wv-page-gutter);
}


/* ── Drop the filter sidebar; let results reclaim the width ──────
   Snize's full-page results render facets (left) + a product grid
   (right). We don't surface filters here. Attribute matches
   (`[class*=…]`) guard against class-name drift in the SaaS-injected
   DOM — the exact names can't be read from the codebase (CDN widget).
   Body-class scope gives enough specificity to win without
   !important; if a future Snize build inlines display on these,
   revisit. */
.searchanise-search-results-page [class*="snize-filters"],
.searchanise-search-results-page [class*="snize-left-panel"],
.searchanise-search-results-page [class*="snize-sidebar"] {
  display: none;
}

.searchanise-search-results-page [class*="snize-products"],
.searchanise-search-results-page [class*="snize-product-list"],
.searchanise-search-results-page [class*="snize-results-content"] {
  width: 100%;
  margin-left: 0;
  float: none;
}


/* ── Center result images so the grid isn't ragged ──────────────
   Featured images vary in aspect ratio. Frame each in a consistent
   square, centered, never cropped (contain) on white — same recipe
   as the PDP gallery (wv-pdp-hero-generic.css). */
.searchanise-search-results-page [class*="snize-product-image"] {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--wv-color-card-bg);
}

.searchanise-search-results-page [class*="snize-product-image"] img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}


/* ── Drop Categories tab ─────────────────────────────────────────
   The plugin emits three tabs (Products / Categories / Pages).
   Categories isn't surfaced — hide the entire <li> wrapper so the
   adjacent tabs sit flush. :has() supported in all modern browsers
   (Chrome/FF/Safari 2023+); zero usage of legacy browsers here. */
.searchanise-search-results-page li:has(> .snize-main-panel-controls-categories) {
  display: none;
}


/* ── Tab pills — mirrors .wv-shop-cats__pill exactly ─────────────
   Mobile-first base + tablet+ override restores the desktop sizing.
   Hover state matches active state (dark fill + inverse text). */
.searchanise-search-results-page .snize-main-panel-controls-products,
.searchanise-search-results-page .snize-main-panel-controls-pages {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 40px;
  padding: 0 20px;
  border: 1px solid var(--wv-color-text-primary);
  border-radius: var(--wv-radius-sm);
  background: transparent;
  font-family: var(--wv-font-primary);
  font-weight: 600;
  font-size: 13px;
  line-height: 1;
  letter-spacing: 0;
  color: var(--wv-color-text-primary);
  text-transform: uppercase;
  white-space: nowrap;
  text-decoration: none;
  transition: var(--wv-transition-color);
}

.searchanise-search-results-page .snize-main-panel-controls-products:hover,
.searchanise-search-results-page .snize-main-panel-controls-pages:hover,
.searchanise-search-results-page .snize-main-panel-controls-products.active,
.searchanise-search-results-page .snize-main-panel-controls-pages.active {
  background: var(--wv-color-text-primary);
  color: var(--wv-color-text-inverse);
}

@media (min-width: 768px) {
  .searchanise-search-results-page .snize-main-panel-controls-products,
  .searchanise-search-results-page .snize-main-panel-controls-pages {
    height: 55px;
    padding: 0 48px 2px;
    font-size: 15px;
  }
}


/* ── Hide inline tab count badges ────────────────────────────────
   Plugin emits "Products23" / "Pages29" with the count inline.
   Per 2026-06-04 mockup the labels stand alone. */
.searchanise-search-results-page .snize-products-tab-total,
.searchanise-search-results-page .snize-pages-tab-total,
.searchanise-search-results-page .snize-categories-tab-total {
  display: none;
}


/* ── View Product button — mirrors .wv-card__atc ─────────────────
   Same olive fill, same pill shape, same uppercase 12px label.
   Hover darkens to --wv-color-olive-dark (same as wv-card pattern). */
.searchanise-search-results-page .snize-view-product-button {
  width: 112px;
  height: 44px;
  border-radius: 72.154px;
  background: var(--wv-color-accent);
  color: var(--wv-color-text-inverse);
  border: 0;
  font-family: var(--wv-font-primary);
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background var(--wv-transition-fast);
}

.searchanise-search-results-page .snize-view-product-button:hover {
  background: var(--wv-color-olive-dark);
}