/* Search & what's new. */

/* Search form. */
.search-nodes { min-height: 8em; }
.search-refine > summary { cursor: pointer; list-style: none; }
.search-refine > summary::-webkit-details-marker { display: none; }
.search-refine > summary::after { content: " ▾"; font-weight: 400; }
.search-refine[open] > summary::after { content: " ▴"; }
.search-refine:not([open]) > summary { border-bottom: 0; }
.search-query { font-style: italic; }

/* Results. */
.search-results { list-style: none; margin: 0; padding: 0; }
.search-result { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 16px 20px; border-bottom: 1px solid var(--border-soft); transition: background-color var(--dur-fast); }
.search-result:hover { background: var(--accent-softer); }
.search-result:last-child { border-bottom: 0; }
.search-result-main { min-width: 0; }
.search-result-title { font-size: 1.05em; font-weight: 600; margin: 0 0 4px; overflow-wrap: anywhere; }
.search-result-re { color: var(--text-muted); font-weight: 400; }
.search-result-snippet { color: var(--text); font-size: 0.93em; line-height: 1.5; overflow-wrap: anywhere; }
.search-result-meta { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2px 0; font-size: 0.85em; color: var(--text-muted); }
.search-result-meta li:not(:last-child)::after { content: "·"; margin: 0 7px; }
.search-result mark, .search-query mark {
  background: color-mix(in srgb, var(--accent) 22%, transparent); color: inherit; padding: 0 2px; border-radius: 4px;
}

/* What's new filter tabs (segmented control). */
.whats-new-filter { display: inline-flex; padding: 3px; gap: 2px; border-radius: 11px; background: var(--muted); }
.whats-new-filter a { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 8px; font-size: 0.82rem; font-weight: 500; color: var(--muted-foreground); }
.whats-new-filter a:hover { color: var(--foreground); text-decoration: none; }
.whats-new-filter a.is-active { background: var(--card); color: var(--foreground); box-shadow: var(--shadow); }

@media (max-width: 650px) {
  .search-result { grid-template-columns: 1fr; }
  .search-result-avatar { display: none; }
}