/* ja_nexora — Smart Search (com_finder) per-page overlay.
   Loaded via addCustomTag from html/com_finder/search/default.php so the T4 optimize
   bundle never absorbs/reorders it. Scoped to the finder view markup only.

   SRCH1 [DEAD-CONTROL → real link]: the type-filter pills were hardcoded aria-static
   <span>s (cursor:default). They are now REAL <a> taxonomy-filter links — restore link
   affordance (pointer + no underline) and add a hover/focus state the <span> never had.
   The base pill look (radius/border/surface/active) stays in shared scss; this only
   adjusts the interactive affordances that changed when <span> became <a>. */

/* SRCH2 [SCOPE-HOOK-WRONG]: the shared scss styles the search chrome under
   body.item-424 — but NO menu item with id 424 exists; the real Smart-Search
   pages are item-307 (/product/search) and item-323 (/developers/dev-search).
   So the design's pill chrome never applied on the live pages (nav rendered as
   plain inline blue links). Re-assert the pill look here, scoped to .com-finder
   so it works on every finder search page regardless of the broken item hook.
   (Root cause is in shared scss — reported for an scss recompile.) */
.com-finder .search-filters {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  width: 880px;
  max-width: 100%;
  margin: 0 auto;
}
.com-finder .search-filters .search-filter-btn {
  border-radius: 100px;
  padding: 8px 16px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-muted);
  font-family: var(--font-sans);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.2;
}
.com-finder .search-filters .search-filter-btn.is-active {
  background: var(--color-primary);
  border-color: transparent;
  color: #fff;
  font-weight: 600;
}

.com-finder .search-filters a.search-filter-btn {
  cursor: pointer;
  text-decoration: none;
  transition: border-color .15s ease, color .15s ease, background-color .15s ease;
}

/* Inactive pill hover: brighten border + text (no box move — bg/border/color only). */
.com-finder .search-filters a.search-filter-btn:not(.is-active):hover {
  border-color: var(--color-primary, #2563EB);
  color: var(--color-text);
}

/* Active pill hover keeps its filled look (slightly darker handled by primary token). */
.com-finder .search-filters a.search-filter-btn.is-active:hover {
  color: #fff;
  text-decoration: none;
}

/* Keyboard focus ring for the now-focusable links. */
.com-finder .search-filters a.search-filter-btn:focus-visible {
  outline: 2px solid var(--color-primary, #2563EB);
  outline-offset: 2px;
}
