/* Website-Generator – Chat für Kunden */
.wg-chat { --c-a: #2f6fe0; --c-a2: #1f55b8; --c-rand: #e1e6ee; --c-text: #1b2330; --c-leise: #64748b; font-family: inherit; }
.wg-chat--blase { position: fixed; inset-inline-end: 20px; bottom: 20px; z-index: 1000; }
.wg-chat-knopf { position: relative; display: grid; place-items: center; width: 58px; height: 58px; border: 0; border-radius: 50%; cursor: pointer; color: #fff;
  background: linear-gradient(135deg, #4f8dff, var(--c-a) 55%, #5b3df5); box-shadow: 0 10px 28px rgba(47,111,224,.45); transition: transform .15s, box-shadow .15s; }
.wg-chat-knopf:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 14px 34px rgba(47,111,224,.5); }
.wg-chat-knopf:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.wg-chat--offen .wg-chat-knopf { transform: scale(.92); }
.wg-chat-punkt { position: absolute; top: 3px; inset-inline-end: 3px; width: 14px; height: 14px; border-radius: 50%; background: #ef4444; border: 2px solid #fff; }
.wg-chat--blase .wg-chat-panel { position: absolute; inset-inline-end: 0; bottom: 72px; width: min(380px, calc(100vw - 32px)); height: min(560px, calc(100vh - 120px)); }
.wg-chat-panel { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid var(--c-rand); border-radius: 18px; box-shadow: 0 24px 60px rgba(15,23,42,.22); color: var(--c-text); }
.wg-chat-panel[hidden] { display: none; }
.wg-chat--blase .wg-chat-panel:not([hidden]) { animation: wg-chat-auf .18s ease-out; }
@keyframes wg-chat-auf { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.wg-chat-kopf { display: flex; align-items: center; gap: 11px; padding: 14px 12px 14px 16px; color: #fff; background: linear-gradient(135deg, #1e3a8a, var(--c-a) 70%, #4f8dff); }
.wg-chat-avatar { position: relative; flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.18); font-weight: 800; }
.wg-chat-status { position: absolute; bottom: 0; inset-inline-end: 0; width: 11px; height: 11px; border-radius: 50%; background: #94a3b8; border: 2px solid #2f5fcf; }
.wg-chat--online .wg-chat-status { background: #22c55e; }
.wg-chat-kopf-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.wg-chat-kopf-text strong { font-size: .98rem; }
.wg-chat-kopf-text small { opacity: .85; font-size: .8rem; }
.wg-chat-kopfknopf { display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 9px; background: transparent; color: #fff; cursor: pointer; opacity: .85; }
.wg-chat-kopfknopf:hover { background: rgba(255,255,255,.15); opacity: 1; }
.wg-chat-kopfknopf[hidden] { display: none; }
.wg-chat-liste { flex: 1; overflow-y: auto; padding: 16px 14px 8px; display: flex; flex-direction: column; gap: 10px; background: #f6f8fc; overscroll-behavior: contain; }
.wg-chat-msg { display: flex; flex-direction: column; max-width: 84%; }
.wg-chat-msg--kunde { align-self: flex-end; align-items: flex-end; }
.wg-chat-msg--admin { align-self: flex-start; }
.wg-chat-blase { padding: 10px 13px; border-radius: 16px; font-size: .94rem; line-height: 1.45; overflow-wrap: anywhere; }
.wg-chat-msg--admin .wg-chat-blase { background: #fff; border: 1px solid var(--c-rand); border-end-start-radius: 5px; }
.wg-chat-msg--kunde .wg-chat-blase { background: var(--c-a); color: #fff; border-end-end-radius: 5px; }
.wg-chat-msg--kunde .wg-chat-blase a { color: #fff; }
.wg-chat-info { margin-top: 3px; font-size: .72rem; color: var(--c-leise); }
.wg-chat-gelesen { color: var(--c-a); }
.wg-chat-datei { display: block; margin-top: 6px; }
.wg-chat-datei img { display: block; max-width: 100%; max-height: 220px; border-radius: 10px; }
.wg-chat-msg--kunde .wg-chat-datei { color: #fff; }
.wg-chat-form { padding: 10px 12px 12px; border-top: 1px solid var(--c-rand); background: #fff; display: flex; flex-direction: column; gap: 8px; }
.wg-chat-gast { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.wg-chat-gast[hidden], .wg-chat-datei-info[hidden] { display: none; }
.wg-chat-gast input { min-width: 0; padding: 9px 11px; border: 1px solid var(--c-rand); border-radius: 10px; font: inherit; font-size: .9rem; }
.wg-chat-zeile { display: flex; align-items: flex-end; gap: 6px; }
.wg-chat-zeile textarea { flex: 1; min-width: 0; resize: none; max-height: 140px; padding: 10px 12px; border: 1px solid var(--c-rand); border-radius: 14px; font: inherit; font-size: .94rem; line-height: 1.4; background: #f8fafc; }
.wg-chat-zeile textarea:focus, .wg-chat-gast input:focus { outline: none; border-color: var(--c-a); background: #fff; box-shadow: 0 0 0 3px rgba(47,111,224,.14); }
.wg-chat-anhang { flex: none; display: grid; place-items: center; width: 40px; height: 42px; border-radius: 12px; color: var(--c-leise); cursor: pointer; }
.wg-chat-anhang:hover { background: #eef2f8; color: var(--c-a); }
.wg-chat-senden { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 12px; background: var(--c-a); color: #fff; cursor: pointer; }
.wg-chat-senden:hover { background: var(--c-a2); }
.wg-chat--sendet .wg-chat-senden { opacity: .55; cursor: progress; }
.wg-chat-datei-info { font-size: .82rem; color: var(--c-leise); display: flex; align-items: center; gap: 6px; }
.wg-chat-datei-weg { border: 0; background: #eef2f8; border-radius: 50%; width: 20px; height: 20px; cursor: pointer; line-height: 1; }
.wg-chat-hinweis { margin: 0; font-size: .74rem; color: var(--c-leise); }
.wg-chat-hinweis:empty { display: none; }
.wg-chat-fehler { color: #c92a2a; }
.wg-chat-falle { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
/* Ganze Seite (nachrichten.php) */
.wg-chat--voll .wg-chat-panel { height: min(720px, calc(100vh - 180px)); min-height: 420px; }
/* Nicht mit dem Cookie-Hinweis kollidieren */
body:has(#g-cookie:not([hidden])) .wg-chat--blase { bottom: 96px; }
@media (max-width: 640px) {
  .wg-chat--blase { inset-inline-end: 14px; bottom: 14px; }
  body:has(#g-cookie:not([hidden])) .wg-chat--blase { bottom: 150px; }
  .wg-chat--blase.wg-chat--offen { inset: 0; }
  .wg-chat--blase.wg-chat--offen .wg-chat-knopf { display: none; }
  .wg-chat--blase .wg-chat-panel { position: fixed; inset: 0; width: auto; height: auto; border-radius: 0; border: 0; }
}
@media print { .wg-chat--blase { display: none; } }
@media (prefers-reduced-motion: reduce) { .wg-chat-knopf, .wg-chat-panel { transition: none; animation: none !important; } }
