/* ============================================================
   suche.css — Eine Suche über alles (Note 1, 09.11.2026, Bausitzung A)
   Treffer nach Art gruppiert (Seiten, Aufgaben, Einstellungen, Personen, Geräte, Handbuch, Lernvideos).
   Am Handy seit W3 ein ganzes Blatt mit dem Feld oben (über der Tastatur); hier auch Schleier, Stapel und Deckkraft.
   ============================================================ */
.ss-gruppe { padding: 12px 12px 4px; font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-leise); }
.ss-gruppe:first-child { padding-top: 4px; }
.ss-treffer.gesperrt .ss-text b { font-weight: 600; color: var(--text-leise); }
.ss-leer { line-height: 1.45; }
/* Jede Zeile so hoch wie ihr Treffer — sonst drückt die feste Blatthöhe zweizeilige Treffer in die nächste Gruppe */
.ss-liste { grid-auto-rows: max-content; align-content: start; }

/* W3-Suchanzeige (09.11.2026, Befund der GF: „die Ergebnisse verschwinden im Hintergrund“):
   Die Liste liegt über allem (nur Meldungen darüber), auf einer deckenden Kartenfläche; die Seite dahinter tritt unter
   einem dichteren, weichgezeichneten Schleier zurück und scrollt nicht mit. Kontrast der Treffer ≥ 4,5 : 1. */
#schnellsuche { z-index: 950; background: color-mix(in srgb, var(--abdunkeln-basis) 88%, transparent);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
#schnellsuche .ss-box { background: var(--flach-hoch); opacity: 1; border: 1px solid var(--rand);
  box-shadow: 0 24px 64px color-mix(in srgb, var(--schatten) 60%, transparent), var(--karte-schatten); isolation: isolate; }
#schnellsuche .ss-liste { background: var(--flach-hoch); overscroll-behavior: contain; }
html.ss-offen, html.ss-offen body { overflow: hidden; }
.ss-leer { color: var(--text); }
.ss-leer p { margin: 0 0 10px; }
.ss-hinweis { padding: 8px 12px 2px; color: var(--text); font-weight: 600; }
.ss-vorschlaege { display: flex; flex-wrap: wrap; gap: 8px; }
.ss-vorschlag { min-height: 44px; padding: 0 16px; border-radius: 22px; border: 1px solid var(--rand); background: var(--flach-hoch);
  color: var(--akzent-text, var(--text)); font: inherit; font-weight: 600; cursor: pointer; }
.ss-vorschlag:hover, .ss-vorschlag:focus-visible { border-color: var(--akzent); }
.ss-seite-knopf { margin-top: 8px; }

@media (max-width: 720px) {
  /* Am Handy: ein ganzes deckendes Blatt, Feld oben, Treffer darunter. Es ist genau so hoch wie der sichtbare Teil
     über der Tastatur (--ss-hoehe aus visualViewport, app-suche.js) — vorher saß das Blatt unten und die Tastatur
     legte sich über die Treffer. */
  #schnellsuche { padding: 0; align-items: stretch; top: var(--ss-oben, 0px); bottom: auto; height: var(--ss-hoehe, 100dvh);
    background: var(--flach-hoch); -webkit-backdrop-filter: none; backdrop-filter: none; }
  #schnellsuche .ss-box { width: 100%; height: 100%; max-height: none; min-height: 0; border: 0; border-radius: 0; box-shadow: none;
    padding: env(safe-area-inset-top) 0 0; }
  #schnellsuche .ss-liste { flex: 1; min-height: 0; padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
  .ss-treffer { min-height: 52px; }
}