/* Hinweise auf die Kollegen-Umfrage (betreusoft.de/umfrage) und Einwilligungstext der Warteliste.
   Eigene Präfixe (bs-uh-), damit nichts mit den Seiten-Styles kollidiert.
   Farben wie die Startseite: Teal #0E9384 / #096056, Tinte #1A2530. */
:root {
  --bs-uh-teal: #0E9384;
  --bs-uh-teal-deep: #096056;
  --bs-uh-teal-soft: #DDEDE9;
  --bs-uh-ink: #1A2530;
  --bs-uh-ink-3: #5C6876;
  --bs-uh-surface: #FFFFFF;
  --bs-uh-rule: #E4DFD4;
  --bs-uh-gold: #C9974D;
}

/* Kasten im Seitenfluss (Startseite unter der Warteliste, Ende der Ratgeber) */
.bs-uh-band { padding: 8px 20px 56px; }
.bs-uh-box {
  max-width: 880px; margin: 0 auto; box-sizing: border-box;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 28px; align-items: center;
  background: var(--bs-uh-surface); border: 1px solid var(--bs-uh-rule); border-left: 5px solid var(--bs-uh-teal);
  border-radius: 14px; padding: 24px 28px; color: var(--bs-uh-ink);
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.bs-uh-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bs-uh-teal-deep); margin: 0 0 6px; }
.bs-uh-titel { font-family: "Plus Jakarta Sans", "Inter", sans-serif; font-size: 22px; line-height: 1.25; font-weight: 700; margin: 0 0 8px; padding: 0; color: var(--bs-uh-ink); letter-spacing: normal; text-transform: none; text-align: left; }
.bs-uh-text { font-size: 16px; line-height: 1.55; color: var(--bs-uh-ink-3); margin: 0; max-width: 60ch; }
.bs-uh-knopf {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  background: var(--bs-uh-teal); color: #FFFFFF; text-decoration: none; font-weight: 700; font-size: 16px;
  padding: 14px 22px; border-radius: 10px; border: 0; cursor: pointer;
}
.bs-uh-knopf:hover { background: var(--bs-uh-teal-deep); }
.bs-uh-knopf:focus-visible, .bs-uh-zu:focus-visible, .bs-uh-link:focus-visible { outline: 3px solid var(--bs-uh-gold); outline-offset: 2px; }
@media (max-width: 640px) {
  .bs-uh-box { grid-template-columns: minmax(0, 1fr); padding: 20px; }
  .bs-uh-knopf { justify-content: center; }
}

/* Textlink (nach dem VBVG-Rechner, nach der Wartelisten-Anmeldung) */
.bs-uh-link { display: inline-block; margin-top: 14px; font-weight: 600; color: var(--bs-uh-teal-deep); text-decoration: underline; text-underline-offset: 3px; }

/* Einblendung nach einigen Sekunden: klein, unten, jederzeit schließbar (kein Vollbild-Pop-up) */
.bs-uh-slide {
  position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 900;
  width: 360px; max-width: calc(100vw - 32px); box-sizing: border-box;
  background: var(--bs-uh-surface); color: var(--bs-uh-ink);
  border: 1px solid var(--bs-uh-rule); border-top: 4px solid var(--bs-uh-teal); border-radius: 14px;
  box-shadow: 0 18px 40px -16px rgba(26, 37, 48, 0.35);
  padding: 18px 18px 16px; font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  transform: translateY(16px); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease;
}
.bs-uh-slide.offen { transform: none; opacity: 1; }
.bs-uh-slide .bs-uh-titel { font-size: 19px; padding-right: 32px; }
.bs-uh-slide .bs-uh-text { font-size: 15px; }
.bs-uh-slide .bs-uh-knoepfe { display: flex; gap: 12px; align-items: center; margin-top: 14px; flex-wrap: wrap; }
.bs-uh-slide .bs-uh-knopf { padding: 11px 18px; font-size: 15px; }
.bs-uh-spaeter { background: none; border: 0; padding: 8px 4px; font: inherit; font-size: 15px; color: var(--bs-uh-ink-3); text-decoration: underline; cursor: pointer; }
.bs-uh-zu {
  position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border-radius: 50%;
  background: none; border: 0; cursor: pointer; color: var(--bs-uh-ink-3); font-size: 24px; line-height: 1;
}
.bs-uh-zu:hover { background: var(--bs-uh-teal-soft); color: var(--bs-uh-ink); }
@media (max-width: 600px) {
  .bs-uh-slide { left: 12px; right: 12px; width: auto; max-width: none; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); padding: 14px 14px 12px; }
  .bs-uh-slide .bs-uh-text { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .bs-uh-slide { transition: none; }
}
@media print { .bs-uh-slide, .bs-uh-band { display: none; } }

/* Einwilligungstext unter dem Wartelisten-Formular: lesbar, nicht Kleingedrucktes */
.form p.bs-uh-einwilligung, p.bs-uh-einwilligung { font-size: 13.5px; line-height: 1.5; color: #5C6876; margin: 10px 0 0; text-align: left; }
.bs-uh-einwilligung a { color: var(--bs-uh-teal-deep); text-decoration: underline; }
