/* Site search page (T42): Compact header with the search box, grouped text-only result cards, Show all and paging.
   Tokens only, phones first. The result card styles (.search-card) are shared with the header overlay
   (css/site/searchOverlay.css adds the overlay's row sizes). */

/* The Compact header runs under the floating header pill, as on other Compact hero pages (it has no content area,
   so the header adds its spacer; the hero already makes that room). */
body:has(.search-hero) .site-nav-spacer { display: none; }

/* ── Search box ───────────────────────────────────────────────────────── */
.search-form { margin-top: var(--space-8); max-width: 780px; }
.search-form__label {
  display: block;
  margin-bottom: var(--space-2);
  font-size: var(--fs-body-sm);
  font-weight: var(--fw-bold);
  line-height: var(--lh-label);
  color: var(--color-heading);
}
.search-form__row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-4);
}
.search-form__input {
  flex: 1 1 260px;
  min-width: 0;
  min-height: 56px;
  padding: var(--space-2) 0;
  border: 0;
  border-bottom: var(--border-width-heavy) solid var(--color-heading);
  border-radius: 0;
  background: transparent;
  font: inherit;
  font-size: clamp(22px, 3vw, 32px);
  font-weight: var(--fw-light);
  letter-spacing: var(--ls-heading);
  color: var(--color-heading);
  -webkit-appearance: none;
  appearance: none;
}
.search-form__input::placeholder { color: var(--color-muted); opacity: 1; }
/* The browser's own clear button is dark on every theme ground; the box is cleared with the keyboard. */
.search-form__input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.search-form__input:focus-visible { outline-offset: var(--space-1); }
.search-form__submit { flex: none; }

/* ── Results ──────────────────────────────────────────────────────────── */
.search-results {
  padding-top: var(--space-10);
  padding-bottom: var(--section-space);
}
.search-results__summary {
  margin: 0 0 var(--space-8);
  font-size: var(--fs-body-md);
  color: var(--color-muted);
}
.search-results__back { margin: 0 0 var(--space-6); }

.search-group + .search-group { margin-top: var(--space-12); }
.search-group__heading {
  margin: 0 0 var(--space-2);
  font-size: var(--fs-body-sm);
  font-weight: var(--fw-bold);
  line-height: var(--lh-label);
  letter-spacing: 0;
  color: var(--color-eyebrow);
}
.search-group .search-results__summary { margin-bottom: var(--space-4); }
.search-group__list,
.search-fragment__list {
  margin: 0;
  padding: 0;
  list-style: none;
  max-width: var(--container-text);
}
.search-group__all { margin: var(--space-4) 0 0; }

/* ── Result card: title link, one line, type label ────────────────────── */
.search-card {
  position: relative;
  padding: var(--space-4) 0;
  border-bottom: var(--border-width) solid var(--color-hairline);
}
.search-card__title {
  margin: 0;
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  line-height: var(--lh-heading);
  letter-spacing: 0;
}
.search-card__link {
  color: var(--color-heading);
  text-decoration: none;
}
/* The whole card is the link's tap area; the focus ring goes round the card. */
.search-card__link::after { content: ""; position: absolute; inset: 0; }
.search-card__link:hover { color: var(--color-link-hover); text-decoration: underline; text-underline-offset: 3px; }
.search-card__link:focus-visible { outline: none; }
.search-card:has(.search-card__link:focus-visible) {
  outline: var(--focus-width) solid var(--color-focus);
  outline-offset: var(--focus-offset);
}
.search-card__file { color: var(--color-muted); }
.search-card__line {
  margin: var(--space-1) 0 0;
  font-size: var(--fs-body);
  line-height: var(--lh-body-tight);
  color: var(--color-text);
}
.search-card__type {
  margin: var(--space-2) 0 0;
  font-size: var(--fs-body-sm);
  line-height: var(--lh-label);
  color: var(--color-muted);
}

/* ── Paging ───────────────────────────────────────────────────────────── */
.search-paging { margin-top: var(--space-8); }
.search-paging__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}
.search-paging__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--tap-min);
  min-height: var(--tap-min);
  padding: 0 var(--space-3);
  border: var(--border-width) solid var(--c-grey-600);
  border-radius: var(--radius-pill);
  color: var(--color-heading);
  text-decoration: none;
}
.search-paging__link:hover { border-color: var(--color-link-hover); color: var(--color-link-hover); }
.search-paging__link[aria-current="page"] {
  border-color: var(--color-heading);
  background: var(--color-heading);
  color: var(--c-white);
  font-weight: var(--fw-bold);
}

/* ── No results ───────────────────────────────────────────────────────── */
.search-empty { max-width: var(--container-text); }
.search-empty__heading {
  margin: 0;
  font-size: var(--fs-h2);
  font-weight: var(--fw-light);
  line-height: var(--lh-heading);
  overflow-wrap: anywhere;
}
.search-empty__text { margin: var(--space-4) 0 0; font-size: var(--fs-body-md); }
.search-empty__links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin: var(--space-6) 0 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 768px) {
  .search-results { padding-top: var(--space-12); }
}