/* search/index.css — page composition CSS. Mobile-first. */

/* ─── Atoms ────────────────────────────────────────────────────────── */
@import url('../../_components/atoms/page-shell/page-shell.css');
@import url('../../_components/atoms/pill-count/pill-count.css');
@import url('../../_components/atoms/btn-tag/btn-tag.css');
@import url('../../_components/atoms/filter-chip/filter-chip.css');

/* ─── Molecules ────────────────────────────────────────────────────── */
@import url('../../_components/molecules/card-leak/card-leak.css');
@import url('../../_components/molecules/filter-chip-row/filter-chip-row.css');
@import url('../../_components/molecules/pagination-controls/pagination-controls.css');
@import url('../../_components/molecules/search-bar-input/search-bar-input.css');

/* ─── Sections ─────────────────────────────────────────────────────── */
@import url('../../_components/sections/header-full/header-full.css');
@import url('../../_components/sections/footer-full/footer-full.css');
@import url('../../_components/sections/mobile-menu/mobile-menu.css');
@import url('../../_components/sections/age-gate-modal/age-gate-modal.css');
@import url('../../_components/sections/page-glow/page-glow.css');
@import url('../../_components/sections/card-grid/card-grid.css');

/* ─── Page-scoped overrides ─────────────────────────────────────────── */

.page-search .search-main {
  position: relative;
  overflow: hidden;
}

.page-search .search-container {
  max-width: 1232px;
  margin: 0 auto;
  padding: 24px 16px 80px;
  position: relative;
  z-index: 1;
}

/* Search bar — Figma 778:1553 is 1200×64 (full width within container) */
.page-search .search-bar { margin-bottom: 16px; }

/* "356 WINS FOUND" — Figma small caps heading, cyan emphasis */
.page-search .wins-found {
  font-family: 'Nationale', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgb(var(--color-subs));
  margin: 24px 0 0;
}
.page-search .wins-found strong {
  color: rgb(var(--color-main));
  font-weight: 700;
}

/* Pagination spacing */
.page-search .search-pagination-wrap {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

/* Filter row spacing tuned for search */
.page-search .filter-chip-row { margin-top: 8px; }

/* Card grid row gap — Figma row gap 60px (matches leaks pattern). */
.page-search .card-grid {
  gap: 60px 24px;
}
.page-search .search-pagination-wrap .pagination { margin-top: 0; }
.page-search .search-pagination-wrap .pagination-summary { margin: 0; }

@media (min-width: 1024px) {
  .page-search .search-container {
    padding-top: 40px;
    padding-bottom: 120px;
  }
  /* Figma stack at desktop:
     y=136 search bar (h=48) ends 184; margin 40 → chip row 224; chip row (h=44) ends 268;
     gap 48 → wins-found at 316 (h=36); gap 28 → card grid at 380.
     Last card row at y=1400-1620 + 60 gap → pagination at 1728 (y diff from grid-bottom = 108). */
  .page-search .search-bar { margin-bottom: 0; }
  .page-search .filter-chip-row { margin-top: 40px; }
  .page-search .wins-found {
    margin: 48px 0 0;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.48px;
    text-transform: none;
  }
  .page-search .search-pagination-wrap { margin-top: 48px; gap: 16px; }
}