/* Assistent-Fenster: schwebend, verschiebbar, in alle Richtungen vergroesserbar */
.chat-knopf {
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 0;
  background: var(--akzent);
  color: #1a1200;
  cursor: pointer;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 50;
}
.chat-knopf:hover { transform: translateY(-1px); }

.chat {
  position: fixed;
  left: 0; top: 0;
  width: 400px;
  height: 560px;
  display: flex;
  flex-direction: column;
  background: #fff;
  color: var(--text);
  border-radius: 14px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.45);
  z-index: 60;
  overflow: hidden;
  font-size: 0.92rem;
}
.chat.ablage { outline: 3px dashed var(--akzent); outline-offset: -3px; }

/* Griffe zum Vergroessern */
.chat-rand { position: absolute; z-index: 5; touch-action: none; }
.chat-rand[data-r="n"], .chat-rand[data-r="s"] { left: 10px; right: 10px; height: 7px; cursor: ns-resize; }
.chat-rand[data-r="n"] { top: -2px; } .chat-rand[data-r="s"] { bottom: -2px; }
.chat-rand[data-r="e"], .chat-rand[data-r="w"] { top: 10px; bottom: 10px; width: 7px; cursor: ew-resize; }
.chat-rand[data-r="e"] { right: -2px; } .chat-rand[data-r="w"] { left: -2px; }
.chat-rand[data-r="ne"], .chat-rand[data-r="nw"], .chat-rand[data-r="se"], .chat-rand[data-r="sw"] { width: 14px; height: 14px; }
.chat-rand[data-r="ne"] { top: -2px; right: -2px; cursor: nesw-resize; }
.chat-rand[data-r="sw"] { bottom: -2px; left: -2px; cursor: nesw-resize; }
.chat-rand[data-r="nw"] { top: -2px; left: -2px; cursor: nwse-resize; }
.chat-rand[data-r="se"] { bottom: -2px; right: -2px; cursor: nwse-resize; }

.chat-kopf {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: var(--tinte);
  color: #fff;
  cursor: move;
  user-select: none;
  touch-action: none;
}
.chat-kopf-status { flex: 1; font-size: 0.78rem; color: rgba(255, 255, 255, 0.7); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-kopf-rechts { display: flex; gap: 4px; }
.chat-ik {
  font: inherit;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  border-radius: 8px;
  padding: 4px 8px;
  line-height: 1;
}
.chat-ik:hover { background: rgba(0, 0, 0, 0.12); }
.chat-kopf .chat-ik:hover { background: rgba(255, 255, 255, 0.15); }
.chat-ik.aktiv { background: #e53935; color: #fff; animation: puls 1.2s infinite; }
@keyframes puls { 50% { opacity: 0.6; } }
.chat-ik:disabled { opacity: 0.4; cursor: default; }

/* Tor */
.chat-tor { flex: 1; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--papier); }
.chat-tor form { width: 100%; max-width: 300px; display: flex; flex-direction: column; gap: 10px; }
.tor-titel { margin: 0 0 4px; font-weight: 600; }
.chat-tor input {
  font: inherit;
  padding: 10px 12px;
  border: 1px solid #c9d1de;
  border-radius: 10px;
  letter-spacing: 0.1em;
}
.tor-hinweis { margin: 0; min-height: 1.2em; color: #b3261e; font-size: 0.85rem; }

/* Verlauf */
.chat-verlauf { flex: 1; overflow: auto; padding: 12px; background: var(--papier); display: flex; flex-direction: column; gap: 10px; }
.chat-nachricht { max-width: 92%; padding: 9px 12px; border-radius: 12px; white-space: pre-wrap; word-wrap: break-word; position: relative; }
.chat-nachricht.nutzer { align-self: flex-end; background: var(--tinte); color: #fff; border-bottom-right-radius: 4px; }
.chat-nachricht.assistent { align-self: flex-start; background: #fff; border: 1px solid #e3e8f0; border-bottom-left-radius: 4px; white-space: normal; }
.chat-nachricht.fehler { align-self: stretch; background: #fdecea; color: #8a1c14; border: 1px solid #f5c2bd; }
.chat-nachricht.system { align-self: center; background: #fff5df; color: #6b4a00; font-size: 0.82rem; }
.chat-nachricht .zeit { display: block; margin-top: 4px; font-size: 0.7rem; opacity: 0.6; }
.chat-nachricht .anhang { display: inline-block; margin-top: 4px; margin-right: 6px; font-size: 0.78rem; opacity: 0.85; }
.chat-nachricht p { margin: 0 0 8px; } .chat-nachricht p:last-child { margin-bottom: 0; }
.chat-nachricht pre { background: #0e1a2e; color: #e6edf7; padding: 8px 10px; border-radius: 8px; overflow: auto; font-size: 0.82rem; }
.chat-nachricht code { background: #eef1f6; padding: 1px 4px; border-radius: 4px; font-size: 0.85em; }
.chat-nachricht pre code { background: transparent; padding: 0; }
.chat-nachricht ul, .chat-nachricht ol { margin: 4px 0 8px 18px; padding: 0; }
.chat-nachricht table { border-collapse: collapse; margin: 6px 0; font-size: 0.85rem; }
.chat-nachricht th, .chat-nachricht td { border: 1px solid #dfe5ee; padding: 3px 6px; text-align: left; }
.chat-denkt { align-self: flex-start; color: var(--grau); font-style: italic; }
.chat-arbeit { padding: 4px 12px; font-size: 0.78rem; color: var(--grau); background: #eef1f6; border-top: 1px solid #e3e8f0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Anhaenge */
.chat-anhaenge { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 12px; background: #fff; }
.chat-anhaenge:not(:empty) { padding-top: 8px; }
.chat-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 6px 3px 8px; border-radius: 999px; background: #eef1f6; font-size: 0.8rem; }
.chat-chip img { width: 22px; height: 22px; object-fit: cover; border-radius: 4px; }
.chat-chip button { border: 0; background: transparent; cursor: pointer; font-size: 1rem; line-height: 1; }

/* Eingabe */
.chat-eingabe { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; background: #fff; border-top: 1px solid #e3e8f0; }
.chat-eingabe textarea { font: inherit; resize: none; border: 1px solid #c9d1de; border-radius: 10px; padding: 8px 10px; min-height: 52px; }
.chat-eingabe-knoepfe { display: flex; align-items: center; gap: 6px; }
.chat-eingabe-knoepfe .knopf { margin-left: auto; padding: 7px 14px; }
.chat-eingabe .chat-ik { font-size: 1.05rem; }

@media (max-width: 640px) {
  .chat { left: 0 !important; top: 0 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; border-radius: 0; }
  .chat-rand { display: none; }
  .chat-kopf { cursor: default; }
}