:root {
  --vchat-blue: #2189e8;
  --vchat-blue-2: #4cabff;
  --vchat-bg: #0a0f16;
  --vchat-panel: rgba(13, 20, 29, .985);
  --vchat-panel-2: #111a25;
  --vchat-border: rgba(122, 181, 236, .18);
  --vchat-text: #f4f8fc;
  --vchat-muted: #9eacbb;
}

.vchat, .vchat * { box-sizing: border-box; }
.vchat { position: fixed; right: 26px; bottom: 24px; z-index: 10050; font-family: inherit; }

.vchat-launcher {
  position: relative; isolation: isolate; min-width: 190px; height: 62px; border: 1px solid rgba(83,171,255,.34);
  border-radius: 18px; padding: 0 18px 0 12px; display: flex; align-items: center; gap: 11px; color: #fff;
  background: linear-gradient(145deg, rgba(18,28,40,.97), rgba(8,14,21,.99));
  box-shadow: 0 18px 46px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.025) inset;
  cursor: pointer; overflow: hidden; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.vchat-launcher:hover { transform: translateY(-3px); border-color: rgba(89,181,255,.7); box-shadow: 0 22px 55px rgba(0,0,0,.48), 0 0 26px rgba(33,137,232,.16); }
.vchat-launcher-glow { position:absolute; inset:auto -20px -40px auto; width:100px; height:100px; border-radius:50%; background:rgba(33,137,232,.22); filter:blur(25px); z-index:-1; }
.vchat-launcher-icon { width: 39px; height: 39px; border-radius: 13px; display:grid; place-items:center; flex:0 0 auto; background: linear-gradient(145deg, #2799ff, #0d66bb); box-shadow: 0 8px 22px rgba(33,137,232,.35); }
.vchat-launcher-icon svg { width:25px; height:25px; fill:none; stroke:#fff; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.vchat-launcher-icon .vchat-spark { fill:#fff; stroke:none; }
.vchat-launcher-text { display:flex; flex-direction:column; align-items:flex-start; line-height:1.1; }
.vchat-launcher-text strong { font-size:14px; letter-spacing:.02em; }
.vchat-launcher-text small { margin-top:5px; font-size:11px; color:#a9b9c9; font-weight:500; }
.vchat-online-dot { width:8px; height:8px; border-radius:50%; margin-left:auto; background:#45d483; box-shadow:0 0 0 4px rgba(69,212,131,.09), 0 0 12px rgba(69,212,131,.45); }

.vchat-panel {
  position: absolute; right: 0; bottom: 76px; width: min(410px, calc(100vw - 32px)); height: min(650px, calc(100vh - 125px));
  display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--vchat-border); border-radius:24px;
  color:var(--vchat-text); background:linear-gradient(180deg, rgba(17,26,37,.995), rgba(8,13,20,.995));
  box-shadow:0 30px 90px rgba(0,0,0,.58), 0 0 0 1px rgba(255,255,255,.025) inset, 0 0 42px rgba(33,137,232,.09);
  transform-origin:bottom right; opacity:0; transform:translateY(18px) scale(.965); pointer-events:none;
  transition:opacity .22s ease, transform .28s cubic-bezier(.2,.8,.2,1);
}
.vchat.is-open .vchat-panel { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.vchat.is-open .vchat-launcher { opacity:0; transform:scale(.9); pointer-events:none; }

.vchat-header { position:relative; min-height:76px; padding:16px 16px 14px; display:flex; align-items:center; gap:12px; border-bottom:1px solid rgba(255,255,255,.07); background:radial-gradient(circle at 22% -40%,rgba(33,137,232,.22),transparent 55%); }
.vchat-brandmark { width:45px; height:45px; border-radius:50%; display:grid; place-items:center; flex:0 0 45px; background:linear-gradient(145deg,#258fe9,#0b5da5); box-shadow:0 9px 25px rgba(33,137,232,.28); overflow:hidden; }
.vchat-brandmark img { width:34px; height:34px; object-fit:contain; display:block; }
.vchat-heading { min-width:0; display:flex; flex-direction:column; }
.vchat-title-logo { display:block; width:auto; height:28px; max-width:220px; object-fit:contain; }
.vchat-status { margin-top:4px; display:flex; align-items:center; gap:6px; color:var(--vchat-muted); font-size:11px; }
.vchat-status i { width:7px; height:7px; border-radius:50%; background:#45d483; box-shadow:0 0 9px rgba(69,212,131,.55); }
.vchat-close { margin-left:auto; width:36px; height:36px; border:0; border-radius:11px; display:grid; place-items:center; color:#b8c4d0; background:rgba(255,255,255,.045); cursor:pointer; transition:.2s ease; }
.vchat-close:hover { color:#fff; background:rgba(255,255,255,.09); }
.vchat-close svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }

.vchat-devbar { padding:7px 14px; font-size:10px; color:#7f91a4; background:rgba(7,12,18,.72); border-bottom:1px solid rgba(255,255,255,.055); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vchat-devbar span { display:inline-block; padding:2px 5px; margin-right:5px; border-radius:5px; background:rgba(33,137,232,.14); color:#62b4ff; font-weight:800; letter-spacing:.08em; }
.vchat-devbar code { color:#a9bdd0; }

.vchat-messages { flex:1; min-height:0; overflow-y:auto; padding:19px 16px 10px; scroll-behavior:smooth; scrollbar-width:thin; scrollbar-color:rgba(85,150,207,.3) transparent; }
.vchat-message { display:flex; align-items:flex-end; gap:9px; margin:0 0 14px; animation:vchatIn .28s ease both; }
.vchat-message.user { justify-content:flex-end; }
.vchat-avatar { width:27px; height:27px; flex:0 0 27px; border-radius:9px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,#238fe9,#0b5a9f); font-size:12px; font-style:italic; font-weight:800; box-shadow:0 5px 12px rgba(33,137,232,.18); }
.vchat-bubble { max-width:83%; padding:11px 13px; border-radius:16px 16px 16px 5px; background:#15202d; border:1px solid rgba(255,255,255,.055); color:#dfe8f1; font-size:13px; line-height:1.52; box-shadow:0 8px 20px rgba(0,0,0,.10); }
.vchat-bubble strong { color:#fff; font-size:13.5px; }
.vchat-bubble p { margin:6px 0 0; color:#bdc9d5; }
.vchat-message.user .vchat-bubble { border:1px solid rgba(81,170,248,.24); border-radius:16px 16px 5px 16px; background:linear-gradient(145deg, rgba(31,130,215,.96), rgba(20,102,172,.96)); color:#fff; }
.vchat-message.bot + .vchat-message.bot { margin-top:-4px; }

.vchat-suggestions { display:flex; flex-wrap:wrap; gap:7px; padding:3px 0 10px 36px; }
.vchat-suggestions button { border:1px solid rgba(75,159,234,.22); border-radius:999px; padding:8px 10px; color:#acd5fa; background:rgba(33,137,232,.07); font:inherit; font-size:11px; cursor:pointer; transition:.2s ease; }
.vchat-suggestions button:hover { color:#fff; border-color:rgba(86,174,251,.5); background:rgba(33,137,232,.15); transform:translateY(-1px); }

.vchat-typing { height:24px; padding:3px 0 3px 53px; display:flex; align-items:center; gap:4px; }
.vchat-typing[hidden] { display:none; }
.vchat-typing span { width:5px; height:5px; border-radius:50%; background:#6d90ad; animation:vchatDot 1s infinite ease-in-out; }
.vchat-typing span:nth-child(2){animation-delay:.14s}.vchat-typing span:nth-child(3){animation-delay:.28s}

.vchat-inputbar { margin:8px 12px 0; min-height:54px; padding:7px 7px 7px 13px; display:flex; align-items:flex-end; gap:8px; border:1px solid rgba(125,173,216,.17); border-radius:17px; background:rgba(19,29,41,.9); box-shadow:0 8px 24px rgba(0,0,0,.16) inset; transition:border-color .2s ease, box-shadow .2s ease; }
.vchat-inputbar:focus-within { border-color:rgba(66,160,243,.52); box-shadow:0 0 0 3px rgba(33,137,232,.08); }
.vchat-inputbar textarea { width:100%; max-height:112px; min-height:34px; resize:none; overflow-y:auto; border:0; outline:0; padding:8px 0 4px; color:#f1f6fb; background:transparent; font:inherit; font-size:13px; line-height:1.45; }
.vchat-inputbar textarea::placeholder { color:#78899a; }
.vchat-send { width:39px; height:39px; flex:0 0 39px; border:0; border-radius:12px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,#2698f8,#1268b1); box-shadow:0 7px 17px rgba(33,137,232,.25); cursor:pointer; transition:.2s ease; }
.vchat-send:hover { transform:translateY(-1px); filter:brightness(1.08); }
.vchat-send svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linejoin:round; stroke-linecap:round; }
.vchat-footnote { padding:8px 12px 12px; text-align:center; color:#65788a; font-size:9.5px; }

@keyframes vchatIn { from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none} }
@keyframes vchatDot { 0%,70%,100%{transform:translateY(0);opacity:.45}35%{transform:translateY(-4px);opacity:1} }

html[data-theme="light"] .vchat-launcher { background:linear-gradient(145deg,#ffffff,#edf5fc); color:#142231; border-color:rgba(33,137,232,.24); box-shadow:0 16px 42px rgba(26,76,112,.17); }
html[data-theme="light"] .vchat-launcher-text small { color:#607387; }
html[data-theme="light"] .vchat-panel { color:#132233; background:linear-gradient(180deg,#fbfdff,#edf4fa); border-color:rgba(28,111,184,.19); box-shadow:0 28px 75px rgba(33,74,108,.25); }
html[data-theme="light"] .vchat-header { border-bottom-color:rgba(31,77,116,.10); }
html[data-theme="light"] .vchat-title { color:#102236; }
html[data-theme="light"] .vchat-devbar { background:#eef5fb; color:#72869a; border-color:rgba(31,77,116,.08); }
html[data-theme="light"] .vchat-bubble { background:#fff; border-color:rgba(26,78,121,.10); color:#263c50; box-shadow:0 8px 21px rgba(41,74,103,.08); }
html[data-theme="light"] .vchat-bubble strong { color:#102236; }
html[data-theme="light"] .vchat-bubble p { color:#4e6478; }
html[data-theme="light"] .vchat-inputbar { background:#fff; border-color:rgba(26,78,121,.14); }
html[data-theme="light"] .vchat-inputbar textarea { color:#172b3e; }

@media (max-width: 640px) {
  .vchat { right:14px; bottom:14px; }
  .vchat-launcher { min-width:0; width:58px; height:58px; border-radius:18px; padding:0; justify-content:center; }
  .vchat-launcher-icon { width:40px; height:40px; }
  .vchat-launcher-text, .vchat-online-dot { display:none; }
  .vchat-panel { position:fixed; right:8px; left:8px; bottom:8px; width:auto; height:min(720px, calc(100dvh - 16px)); border-radius:22px; transform-origin:bottom center; }
  .vchat-devbar { font-size:9px; }
  .vchat-messages { padding-left:13px; padding-right:13px; }
}

@media (prefers-reduced-motion: reduce) {
  .vchat *, .vchat *::before, .vchat *::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* V2: Datenschutz + Status */
.vchat-privacy {
  margin: 10px 12px 0; padding: 10px 12px; border: 1px solid rgba(91,169,239,.16); border-radius: 13px;
  background: rgba(33,137,232,.055); color: #9fb0c1; font-size: 10.5px; line-height: 1.45;
}
.vchat-privacy strong { color: #dce9f5; margin-right: 4px; }
.vchat-privacy a { color: #5bb3ff; text-decoration: none; white-space: nowrap; }
.vchat-privacy a:hover { text-decoration: underline; }
.vchat-send:disabled, .vchat-inputbar textarea:disabled { opacity: .55; cursor: wait; }
html[data-theme="light"] .vchat-privacy { background: rgba(33,137,232,.06); color: #5f7387; border-color: rgba(28,111,184,.14); }
html[data-theme="light"] .vchat-privacy strong { color: #17324c; }


/* Venalisa Markdown-Ausgabe */
.vchat-bubble .vchat-md-line { margin:0; }
.vchat-bubble .vchat-md-gap { height:9px; }
.vchat-bubble .vchat-md-list { margin:6px 0 3px 18px; padding:0; }
.vchat-bubble .vchat-md-list li { margin:3px 0; padding-left:2px; }
.vchat-bubble em { font-style:italic; }
.vchat-bubble a { color:#58b7ff; text-decoration:none; }
.vchat-bubble a:hover { text-decoration:underline; }


/* V6.1 Entwickler-Feedback bei unbeantworteten Fragen */
.vchat-feedback { margin:-4px 0 14px 36px; max-width:83%; padding:10px 11px; border:1px solid rgba(91,169,239,.18); border-radius:13px; background:rgba(33,137,232,.055); color:#aebdcc; font-size:11px; line-height:1.4; }
.vchat-feedback-text { margin-bottom:8px; }
.vchat-feedback-actions { display:flex; gap:7px; flex-wrap:wrap; }
.vchat-feedback button { border:1px solid rgba(91,169,239,.28); border-radius:999px; padding:6px 10px; color:#bfe1ff; background:rgba(33,137,232,.10); font:inherit; font-size:10.5px; cursor:pointer; }
.vchat-feedback button:hover { color:#fff; background:rgba(33,137,232,.18); }
.vchat-feedback button:disabled { opacity:.5; cursor:wait; }
.vchat-feedback-result { color:#9fb6ca; }
html[data-theme="light"] .vchat-feedback { background:rgba(33,137,232,.06); color:#5f7387; border-color:rgba(28,111,184,.14); }
html[data-theme="light"] .vchat-feedback button { color:#1767a9; background:rgba(33,137,232,.06); }

/* V6.3 Screenshot-Upload */
.vchat-attach {
  width:39px; height:39px; flex:0 0 39px; border:0; border-radius:12px; display:grid; place-items:center;
  color:#9fc8eb; background:rgba(33,137,232,.08); cursor:pointer; transition:.2s ease;
}
.vchat-attach:hover { color:#fff; background:rgba(33,137,232,.16); transform:translateY(-1px); }
.vchat-attach:disabled { opacity:.45; cursor:wait; transform:none; }
.vchat-attach svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.vchat-upload-preview { margin:8px 12px -1px; }
.vchat-upload-preview[hidden] { display:none; }
.vchat-upload-chip {
  display:flex; align-items:center; gap:7px; max-width:100%; padding:7px 9px; border:1px solid rgba(91,169,239,.18);
  border-radius:11px; background:rgba(33,137,232,.06); color:#bdd0e1; font-size:10.5px;
}
.vchat-upload-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vchat-upload-size { margin-left:auto; color:#71879a; white-space:nowrap; }
.vchat-upload-chip button { border:0; background:transparent; color:#91a6b9; font-size:18px; line-height:1; cursor:pointer; padding:0 2px; }
.vchat-upload-chip button:hover { color:#fff; }
html[data-theme="light"] .vchat-attach { color:#3979ad; background:rgba(33,137,232,.07); }
html[data-theme="light"] .vchat-upload-chip { background:rgba(33,137,232,.055); color:#425d73; border-color:rgba(28,111,184,.14); }
html[data-theme="light"] .vchat-upload-size { color:#7a8fa2; }


/* V7: Live-Header mit Venalisa-Logo */
html[data-theme="light"] .vchat-brandmark { box-shadow:0 9px 22px rgba(33,137,232,.22); }
html[data-theme="light"] .vchat-title-logo { filter:none; }

@media (max-width: 640px) {
  .vchat-title-logo { height:24px; max-width:180px; }
  .vchat-brandmark { width:42px; height:42px; flex-basis:42px; }
  .vchat-brandmark img { width:31px; height:31px; }
}
