/* Rückfragen vor dem Speichern – die Leiste über dem Formular.

   Arbeitet mit den Tokens aus styles.css (--surface-1, --border, --radius,
   --dur-normal, --easing) und bringt keine eigenen Farben mit. Das ist
   Absicht: Die Leiste fragt nach, sie warnt nicht. Gelb oder Rot würden aus
   einer Nachfrage einen Fehler machen, und einen Fehler hat niemand gemacht –
   der Rapport ist gültig, auch wenn er unbeantwortet gespeichert wird.

   Das einzige Zugeständnis an Sichtbarkeit ist ein dünner Akzentstrich links.
   Er reicht, weil die Leiste ohnehin genau dann erscheint, wenn der Nutzer
   hinschaut: unmittelbar nach dem Klick auf Speichern.

   Bewusst kein Schatten und keine erhöhte Fläche: Beides liesse die Leiste
   über dem Formular schweben und damit wie einen Dialog aussehen. Sie steht
   im Fluss, auf derselben Ebene wie das Formular darunter. */

.hinweis-leiste {
  margin: 0 0 16px;
  padding: 12px 14px;
  background: var(--surface-1);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius);
  animation: hinweis-rein var(--dur-normal) var(--easing) both;
}

@keyframes hinweis-rein {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: none; }
}

/* Vier Pixel Bewegung sind für die einen ein sanfter Auftritt und für die
   anderen Übelkeit. Wer Bewegung abbestellt hat, bekommt die Leiste sofort –
   sichtbar bleibt sie in beiden Fällen. */
@media (prefers-reduced-motion: reduce) {
  .hinweis-leiste { animation: none; }
}

.hinweis-leiste > b {
  display: block;
  font-weight: 650;
  color: var(--text-primary);
}

.hinweis-satz {
  margin: 3px 0 0;
  font-size: .85rem;
  line-height: 1.5;
  color: var(--text-secondary);
}

.hinweis-fragen {
  margin: 10px 0 0;
  /* Der Einzug trägt die Aufzählungspunkte. Ohne ihn hängen sie ausserhalb der
     Leiste und werden vom Akzentstrich abgeschnitten. */
  padding-left: 21px;
  display: grid;
  gap: 5px;
  font-size: .92rem;
  line-height: 1.45;
  color: var(--text-primary);
}

.hinweis-knoepfe {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}

/* Beide Knöpfe sind gleich gewichtet. "Trotzdem speichern" ist zwar
   vorfokussiert, bekommt aber keine Signalfarbe: Ein hervorgehobener Knopf
   neben drei offenen Fragen liest sich wie eine Empfehlung, sie zu übergehen.
   Welcher Knopf gemeint ist, zeigt der Fokusrahmen deutlich genug. */
@media (max-width: 720px) {
  .hinweis-knoepfe .btn {
    flex: 1;
    min-width: 0;
    justify-content: center;
  }
}