/* Search dialog styled to sit with the doks theme (zinc grays, accent color). */
.search-modal[hidden] { display: none; }
.search-modal { position: fixed; inset: 0; z-index: 60; display: flex; justify-content: center; align-items: flex-start; padding: 10vh 16px 16px; }
.search-modal__backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / .2); backdrop-filter: blur(4px); }
.search-modal__panel {
  position: relative; width: 100%; max-width: 42rem; max-height: 78vh; display: flex; flex-direction: column;
  background: #fff; border-radius: .75rem; box-shadow: 0 20px 50px rgb(0 0 0 / .18); overflow: hidden;
}
.search-modal__bar { display: flex; align-items: center; gap: .625rem; padding: .875rem 1rem; border-bottom: 1px solid rgb(24 24 27 / .08); }
.search-modal__icon { flex: none; color: #a1a1aa; }
.search-modal__bar input { flex: 1 1 auto; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 1rem; color: #18181b; }
.search-modal__bar input::-webkit-search-cancel-button { display: none; }
.search-modal__close { flex: none; font-size: .75rem; color: #71717a; border: 1px solid rgb(24 24 27 / .12); border-radius: 6px; padding: 2px 8px; }
.search-modal__status { margin: 0; padding: .625rem 1rem 0; font-size: .8125rem; color: #71717a; }
.search-modal__status:empty { display: none; }
.search-modal__results { list-style: none; margin: 0; padding: .5rem; overflow-y: auto; }
.search-modal__result a { display: block; padding: .625rem .75rem; border-radius: .5rem; text-decoration: none; }
.search-modal__result a:hover, .search-modal__result a:focus { background: #f4f4f5; outline: none; }
.search-modal__result.is-weak { opacity: .7; }
.search-modal__section { display: block; font-size: .75rem; font-weight: 500; color: var(--ghost-accent-color, #0966C3); }
.search-modal__rtitle { display: block; font-weight: 600; color: #18181b; line-height: 1.4; }
.search-modal__excerpt { display: block; margin-top: .25rem; font-size: .875rem; line-height: 1.55; color: #52525b; }
.search-modal mark { background: rgb(9 102 195 / .14); color: inherit; padding: 0 1px; border-radius: 2px; }
html.dark .search-modal__panel { background: #27272a; }
html.dark .search-modal__bar { border-color: rgb(250 250 250 / .08); }
html.dark .search-modal__bar input, html.dark .search-modal__rtitle { color: #f4f4f5; }
html.dark .search-modal__excerpt { color: #a1a1aa; }
html.dark .search-modal__result a:hover, html.dark .search-modal__result a:focus { background: #3f3f46; }
html.dark .search-modal mark { background: rgb(96 165 250 / .25); }
@media (max-width: 640px) { .search-modal { padding: 0; } .search-modal__panel { max-width: none; max-height: none; height: 100%; border-radius: 0; } }