/*
 * Pubquiz Saal-Notfall: Verbindungsstreifen [data-pq-offline] und gesperrter Buzzer-Knopf.
 * Spec: docs/superpowers/specs/2026-10-17-pubquiz-abend-e1-design.md, Abschnitt 3 E.
 * Gerüst (E1, Aufgabe 1): nur der Kopfkommentar. Aufgabe 9 füllt diese Datei, damit keine gemeinsame Datei von mehreren Aufgaben angefasst wird.
 * Animiert wird nur `transform` und `opacity`; reduzierte Bewegung und der Schalter „Avatare und Animationen“ aus zeigen den Endzustand ohne Bewegung.
 */

/* Verbindungsstreifen unter der Kopfzeile des Teamrahmens (nur Fokusmodus, erst nach 1 s ohne offene Verbindung). Genau 28 px hoch,
 * der Text ändert sich während eines Ausfalls nicht: Die Antwortknöpfe bleiben an ihrem Platz. Der Kopf des Rahmens
 * (sticky) wächst um die 28 px, die Antworten rutschen entsprechend nach unten, bleiben aber im Rahmen. Kein Blinken, keine Bewegung. */
.pq-frame-head > [data-pq-offline] {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  height: 28px;
  min-height: 28px;
  /* Breite 0 mit min-width 100%: Der lange Text darf die Breite des Rahmens nicht bestimmen (sonst wüchse das Raster der Antworten). */
  width: 0;
  min-width: 100%;
  padding: 0 10px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  /* Dunkle Schrift auf hellem Gelb (Kontrast > 7:1); der rote Punkt am Menü bleibt zusätzlich. */
  background: #fff1c2;
  color: #4a2b00;
  border-bottom: 1px solid #e0b84a;
}

/* Buzzer ohne Verbindung: gesperrter Knopf, der Grund steht gut lesbar darunter. */
.pq-buzz-status--offline {
  color: #7a1a2c;
  font-weight: 800;
}
:root[data-theme="dark"] .pq-buzz-status--offline {
  color: #ffb3c0;
}