/**
 * Layout for the parts the docs section adds on top of the captured sheet:
 * the search dialog and the scroll container behaviour. The captured Tailwind
 * build has no arbitrary-value utilities (`pt-[12vh]`, `max-h-[52vh]`), so the
 * geometry is written here rather than borrowed from a class that would not exist.
 */

#docs-search {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgb(0 0 0 / 0.5);
  padding-top: 12vh;
}

#docs-search.is-open {
  display: flex;
}

#docs-search.hidden {
  display: none;
}

#docs-search > div {
  width: 100%;
  max-width: 36rem;
}

#docs-search [data-search-results] {
  max-height: 52vh;
}

#docs-search [data-search-input]::placeholder {
  color: var(--muted-foreground, #71717a);
}

/* the article pane scrolls to headings via JS; keep anchors from hiding under it */
#docs-search [data-search-item] {
  text-decoration: none;
}

main h2[id],
main h3[id] {
  scroll-margin-top: 1rem;
}