/* --------------------------------------------------------------------------
   Chat-Fenster auf der Website – sitzt unten links. Eigene Datei, damit style.css unberuehrt
   bleibt. Farben und Rundungen folgen dem Rest der Seite.
   -------------------------------------------------------------------------- */
.bsv-chat, .bsv-chat * { box-sizing: border-box; }

.bsv-launcher {
  position: fixed; left: 1.1rem; bottom: 1.1rem; z-index: 60;
  width: 3.4rem; height: 3.4rem; border-radius: 50%;
  background: #22e0ff; color: #04121a; border: none; cursor: pointer;
  display: grid; place-items: center;
  box-shadow: 0 10px 30px rgba(0,0,0,.45), 0 0 0 1px rgba(34,224,255,.25);
  transition: transform .18s ease, opacity .18s ease;
}
.bsv-launcher:hover { transform: translateY(-2px); }
.bsv-launcher svg { width: 1.55rem; height: 1.55rem; fill: none; stroke: currentColor; stroke-width: 1.9; }
.bsv-launcher .bsv-zahl {
  position: absolute; top: -.15rem; right: -.15rem;
  background: #ff6b81; color: #fff; border-radius: 999px;
  font-size: .68rem; font-weight: 700; min-width: 1.25rem; padding: .1rem .3rem;
  border: 2px solid #05070d;
}
.bsv-chat[data-offen="1"] .bsv-launcher { opacity: 0; pointer-events: none; }

.bsv-fenster {
  position: fixed; left: 1.1rem; bottom: 1.1rem; z-index: 61;
  width: min(23rem, calc(100vw - 2rem));
  height: min(31rem, calc(100dvh - 2rem));
  display: none; flex-direction: column;
  background: #0c1324; border: 1px solid #1b2a45; border-radius: 16px;
  overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.55);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  color: #e6f0fb;
}
.bsv-chat[data-offen="1"] .bsv-fenster { display: flex; }
@media (max-width: 30rem) {
  .bsv-fenster { left: 0; bottom: 0; width: 100vw; height: 100dvh; border-radius: 0; border: none; }
}

.bsv-kopf {
  display: flex; align-items: center; gap: .7rem;
  padding: .85rem 1rem; background: #070b16; border-bottom: 1px solid #1b2a45;
}
.bsv-kopf .bsv-titel { font-weight: 700; font-size: .95rem; }
.bsv-kopf .bsv-titel em { color: #22e0ff; font-style: normal; }
.bsv-kopf .bsv-status { font-size: .74rem; color: #8299b8; margin-top: .1rem; }
.bsv-zu {
  margin-left: auto; background: none; border: none; color: #8299b8;
  cursor: pointer; padding: .25rem; line-height: 0;
}
.bsv-zu svg { width: 1.15rem; height: 1.15rem; fill: none; stroke: currentColor; stroke-width: 2; }

.bsv-koerper { flex: 1; overflow-y: auto; padding: 1rem; }
.bsv-verlauf { display: flex; flex-direction: column; gap: .5rem; }

.bsv-blase {
  max-width: 85%; padding: .55rem .75rem; border-radius: 13px;
  font-size: .88rem; line-height: 1.5; white-space: pre-wrap; word-wrap: break-word;
}
.bsv-blase.user   { align-self: flex-end; background: #22e0ff; color: #04121a; }
.bsv-blase.ai,
.bsv-blase.admin  { align-self: flex-start; background: #122536; border: 1px solid #1b2a45; }
.bsv-blase.system { align-self: center; color: #8299b8; font-size: .76rem; background: none; }
.bsv-wer { font-size: .66rem; opacity: .8; margin-bottom: .15rem; }

.bsv-tippt { align-self: flex-start; display: flex; gap: .25rem; padding: .6rem .75rem; }
.bsv-tippt span {
  width: .38rem; height: .38rem; border-radius: 50%; background: #8299b8;
  animation: bsvhuepf 1.2s infinite;
}
.bsv-tippt span:nth-child(2) { animation-delay: .15s; }
.bsv-tippt span:nth-child(3) { animation-delay: .3s; }
@keyframes bsvhuepf { 0%,60%,100% { opacity: .25; } 30% { opacity: 1; } }

.bsv-start { display: flex; flex-direction: column; gap: .7rem; }
.bsv-start p { margin: 0; font-size: .85rem; color: #8299b8; line-height: 1.6; }
.bsv-start label { font-size: .75rem; color: #8299b8; display: block; margin-bottom: .25rem; }
.bsv-chat input, .bsv-chat textarea {
  width: 100%; background: #05070d; color: #e6f0fb; border: 1px solid #1b2a45;
  border-radius: 10px; padding: .6rem .7rem; font: inherit; font-size: .88rem;
}
.bsv-chat input:focus, .bsv-chat textarea:focus { outline: 2px solid #22e0ff; outline-offset: 1px; }
.bsv-knopf {
  background: #22e0ff; color: #04121a; border: none; border-radius: 10px;
  padding: .6rem 1rem; font: inherit; font-weight: 600; cursor: pointer;
}
.bsv-knopf:disabled { opacity: .5; cursor: default; }
.bsv-fehler { color: #ff6b81; font-size: .8rem; margin: 0; }
.bsv-fuss {
  display: flex; gap: .5rem; padding: .7rem; border-top: 1px solid #1b2a45; background: #070b16;
}
.bsv-fuss textarea { resize: none; min-height: 2.5rem; max-height: 7rem; }
.bsv-klein { font-size: .72rem; color: #8299b8; }
.bsv-klein a { color: #22e0ff; }
.bsv-honig { position: absolute; left: -9999px; width: 1px; height: 1px; }

/* Solange die Cookie-Leiste offen ist, haelt sich der Chat zurueck. Sonst
   liegen zwei Elemente in derselben Ecke und die Leiste schluckt die Klicks. */
#cookiebar:not([hidden]) ~ .bsv-chat { display: none; }
