/* page-search.css
   Page-scoped snapshot migrated from split CSS sources.
   Baseline parity pass: preserves existing look while enabling isolated edits.
*/

body[data-page="search"] {
  overflow-x: hidden;
  overflow-x: clip;
}

body[data-page="search"] .main-content,
body[data-page="search"] .content-body {
  min-width: 0;
  overflow-x: hidden;
  overflow-x: clip;
}

/* === from base.css === */
@media print {
.topbar, .sidebar, .bottom-nav, .reading-progress,
  .mark-done, .next-topic, .quick-check__reveal,
  .deep-dive__toggle, .reading-controls,
  .course-banner, .subnav, .onpage-nav, .topic-nav,
  .related-topics, .share-btn, .section-share-btn,
  .pagefind-ui { display: none !important; }
}

/* === from layout.css === */
@media (max-width: 768px) {
#search-modal-btn .topbar__menu-label {
    display: inline;
  }
}

/* === from components.css === */
.search-container {
  width: min(100%, 80ch);
  margin-inline: auto;
  margin-top: var(--space-4);
  min-width: 0;
}

.pagefind-ui__search-input {
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.02) 100%) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  border-radius: var(--radius-lg) !important;
  color: var(--text-primary) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3) inset, 0 1px 0 rgba(255,255,255,0.05) !important;
  font-size: var(--text-base) !important;
  padding: var(--space-3) var(--space-4) !important;
}

.pagefind-ui__search-input:focus {
  border-color: rgba(124,106,247,0.5) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3) inset, 0 0 0 3px rgba(124,106,247,0.12) !important;
}

.pagefind-ui__search-clear {
  color: var(--text-muted) !important;
  background: none !important;
}

.pagefind-ui__result {
  background: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.02) 100%) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05) inset, 0 4px 12px rgba(0,0,0,0.2) !important;
  padding: var(--space-4) !important;
  transition: transform 180ms var(--ease-out), box-shadow 180ms var(--ease-out) !important;
}

.pagefind-ui__result:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(124,106,247,0.2) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 8px 20px rgba(0,0,0,0.28) !important;
}

.pagefind-ui__result-link {
  color: var(--text-primary) !important;
  font-weight: var(--weight-semibold) !important;
}

.pagefind-ui__result-link:hover {
  color: var(--accent) !important;
}

.pagefind-ui__result-excerpt {
  color: var(--text-secondary) !important;
  font-size: var(--text-sm) !important;
  line-height: 1.7 !important;
}

.pagefind-ui__result-tag {
  background: rgba(124,106,247,0.12) !important;
  color: var(--accent) !important;
  border: 1px solid rgba(124,106,247,0.2) !important;
  border-radius: var(--radius-full) !important;
  font-size: 12px !important;
}

.pagefind-ui__button {
  background: linear-gradient(180deg, var(--accent) 0%, #3d2fa8 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(124,106,247,0.5) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 3px 0 rgba(61,47,168,0.8) !important;
  font-weight: var(--weight-semibold) !important;
}

.pagefind-ui__button:hover {
  background: linear-gradient(180deg, var(--accent-hover) 0%, #3d2fa8 100%) !important;
}

.pagefind-ui__button:focus-visible,
.pagefind-ui__search-clear:focus-visible {
  outline: 2px solid var(--accent) !important;
  outline-offset: 2px !important;
}

.pagefind-ui__message {
  color: var(--text-muted) !important;
  font-size: var(--text-sm) !important;
}

.search-suggestions {
  margin-top: var(--space-10);
  text-align: center;
}

.search-suggestions__label {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin-bottom: var(--space-4);
}

.search-suggestions__grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  justify-content: center;
}

.search-suggestions__chip {
  display: inline-flex;
  align-items: center;
  padding: var(--space-2) var(--space-4);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--text-secondary);
  background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-full);
  text-decoration: none;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05) inset, 0 2px 6px rgba(0,0,0,0.2);
  transition: transform 120ms var(--ease-out), border-color 120ms, color 120ms, box-shadow 120ms;
  min-height: 44px;
}

.search-suggestions__chip:hover {
  color: var(--accent);
  border-color: rgba(124,106,247,0.25);
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 4px 12px rgba(0,0,0,0.25);
  text-decoration: none;
}

.search-suggestions__chip:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

@media (max-width: 768px) {
  .search-container {
    width: min(100%, 72ch);
  }
}

@media (max-width: 480px) {
  .pagefind-ui__search-input {
    font-size: var(--text-sm) !important;
    padding-inline: var(--space-3) !important;
  }

  .search-suggestions__grid {
    gap: var(--space-2);
    justify-content: flex-start;
  }

  .search-suggestions__chip {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}
