/* SEARCH UI Base CSS */
* { box-sizing:border-box; }

html, body { margin:0; padding:0; }

body {
  font-family: var(--fv-font-stack);
  color: var(--fv-text-primary);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden; -webkit-tap-highlight-color:transparent;
}

.search-main-layout {
  display:block; max-width:var(--fv-container-md);
  margin:24px auto; padding:0 16px; overflow-anchor:none;
}

#cat-spacer { height:0; overflow:hidden; }
#searchResults { padding:0; margin:0; }

/* ── Placeholder: fills remaining viewport below sticky header ── */
.search-result-here {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--fv-text-muted);
  font-size: 1.08rem;
  padding: 40px 28px;
  letter-spacing: 0.2px;
  margin-top: 0;
  margin-bottom: 150px;
  box-sizing: border-box;
  /* --placeholder-h is set by JS (_syncPlaceholderHeight) to
     window.innerHeight minus the actual sticky header height.
     Falls back to 60vh when JS hasn't run yet. */
  min-height: var(--placeholder-h, 60svh);
}

.vs-container { position:relative; min-height:2px; contain:layout style paint; }
.vs-item      { position:absolute; left:0; right:0; contain:layout style paint; }

.search-overlay-backdrop, .search-overlay { backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }

#copyToast { position:fixed; top:24px; right:24px; z-index:var(--fv-z-toast); display:flex; flex-direction:column; gap:10px; }

.search-footer {
  width:100%; background:var(--fv-surface-page); color:var(--fv-brand-teal);
  padding:24px 16px; text-align:center; margin-top:64px;
  font-size:0.97rem; font-weight:550;
  border-top:1px solid #E3E8EE;
  border-top-left-radius:48px; border-top-right-radius:48px;
  box-shadow:0 -2px 12px rgba(13,186,146,0.04); letter-spacing:0.2px;
}
.footer-content { max-width:1300px; margin:0 auto; }

@media (max-width:1024px) { .search-main-layout{padding:0 12px;margin:20px auto;} }
@media (max-width:768px)  { .search-main-layout{padding:10px 10px 0;margin:10px auto 0;} .search-footer{margin-top:44px;padding:16px 11px;border-top-left-radius:40px;border-top-right-radius:40px;} #copyToast{top:14px;right:14px;} }
@media (max-width:480px)  { .search-main-layout{padding:9px 9px 0;margin:8px auto 0;} .search-footer{margin-top:36px;padding:12px 9px;border-top-left-radius:32px;border-top-right-radius:32px;} #copyToast{top:11px;right:11px;gap:7px;} }

@media (prefers-reduced-motion:reduce) { *{animation:none!important;transition:none!important;transform:none!important;} }
@media print { #search-sticky,.search-filters-panel,#copyToast,.search-footer{display:none;} .search-main-layout{margin:0;padding:0;} }

@supports not (contain:strict) { .search-overlay-scrollable-content,.vs-container{contain:none;} }

.search-suggestions-fullscreen { contain:layout style paint; }
.suggestion-item     { contain:layout style paint; }
.copy-toast-message  { contain:layout style paint; }
.search-overlay-scrollable-content { transform:translateZ(0); }