
/* Digitalschatz Chatbot – base layout (colors via CSS variables injected inline) */
#dsChatbot{
  position: fixed;
  z-index: var(--dscb-z, 1200);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  transform: translateX(var(--dscb-nudge-x, 0px));
}

#dsChatbot.dscb-right{ right: var(--dscb-right, 18px); bottom: var(--dscb-bottom, 18px); }
#dsChatbot.dscb-left{ left: var(--dscb-left, 18px); bottom: var(--dscb-bottom, 18px); }

body.woocommerce #dsChatbot,
body.single-product #dsChatbot,
body.archive.woocommerce-page #dsChatbot,
body.post-type-archive-product #dsChatbot{
  bottom: calc(var(--dscb-bottom, 18px) + var(--dscb-woo-extra, 92px));
}

body.dscb-menu-open #dsChatbot{ opacity:0; pointer-events:none; }

.dscb-fab{
  width:56px;height:56px;border-radius:999px;
  border:1px solid var(--dscb-border);
  background: linear-gradient(180deg, rgba(34,197,94,.95), rgba(34,197,94,.78));
  box-shadow: var(--dscb-shadow);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  color:#07110a; font-weight:800;
  user-select:none; transition: opacity .18s ease, transform .15s ease, filter .15s ease;
  font-size:22px; line-height:1;
}
.dscb-fab:hover{ transform: translateY(-1px); filter: brightness(1.02); }

.dscb-teaser{
  position:absolute;
  right:74px; bottom:6px;
  max-width:280px;
  padding:10px 12px;
  border-radius:14px;
  background: rgba(15, 23, 42, .92);
  border:1px solid var(--dscb-border);
  color: var(--dscb-text);
  box-shadow: var(--dscb-shadow);
  opacity:0; transform: translateY(6px);
  pointer-events:none;
  transition: opacity .18s ease, transform .18s ease;
  font-size:13px; line-height:1.25;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.dscb-left .dscb-teaser{ left:74px; right:auto; }
.dscb-teaser::after{
  content:""; position:absolute;
  right:-6px; bottom:14px;
  width:12px; height:12px;
  background: rgba(15, 23, 42, .92);
  border-right:1px solid var(--dscb-border);
  border-bottom:1px solid var(--dscb-border);
  transform: rotate(-45deg);
}
.dscb-left .dscb-teaser::after{
  left:-6px; right:auto;
  border-right:0; border-bottom:1px solid var(--dscb-border);
  border-left:1px solid var(--dscb-border);
  transform: rotate(45deg);
}
.dscb-teaser.is-show{ opacity:1; transform: translateY(0); }
.dscb-teaser.is-typing #dscbTeaserText::after{
  content:"▍"; margin-left:2px; opacity:.9; animation: dscbBlink .8s infinite;
}
@keyframes dscbBlink{ 0%,49%{opacity:0} 50%,100%{opacity:.9} }

.dscb-panel{
  width: min(360px, calc(100vw - 36px));
  /* +10% Höhe (User-Wunsch): mehr Luft nach oben ohne Layout zu sprengen */
  height: 572px;
  max-height: calc(100vh - 96px);
  border-radius: 18px;
  background: radial-gradient(1200px 600px at 20% 0%, rgba(96,165,250,.18), transparent 45%),
              radial-gradient(900px 500px at 100% 40%, rgba(34,197,94,.16), transparent 55%),
              var(--dscb-bg);
  border: 1px solid var(--dscb-border);
  box-shadow: var(--dscb-shadow);
  overflow: hidden;
  display:none;
  margin-bottom:12px;
}

/* Bot Typewriter Cursor (nur während des Tippens) */
.dscb-msg.bot.is-typing::after{
  content:"▍";
  margin-left:2px;
  opacity:.9;
  animation: dscbBlink .8s infinite;
}
.dscb-panel.is-open{ display:flex; flex-direction:column; }

.dscb-header{
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--dscb-border);
  background: rgba(255,255,255,.03);
  backdrop-filter: blur(10px);
}

.dscb-title{ display:flex; gap:10px; align-items:center; color:var(--dscb-text); font-weight:750; letter-spacing:.2px; }
.dscb-badge{
  width:52px;height:52px;border-radius:12px;
  display:grid; place-items:center;
  background: rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.18);
  overflow:hidden; padding:0; box-sizing:border-box;
}
.dscb-badge img{ width:100%; height:100%; object-fit:contain; display:block; }
.dscb-badge .fallback{ color:#111827; font-weight:900; font-size:14px; line-height:1; display:none; }

.dscb-sub{ font-size:12px; color: var(--dscb-muted); margin-top:1px; font-weight:500; }
.dscb-actions{ display:flex; gap:8px; }
.dscb-ico{
  width:34px;height:34px;border-radius:10px;
  border:1px solid var(--dscb-border);
  background: rgba(255,255,255,.03);
  color: var(--dscb-text);
  cursor:pointer;
}
.dscb-ico:hover{ background: rgba(255,255,255,.06); }

.dscb-body{
  padding:12px;
  overflow:auto;
  display:flex; flex-direction:column; gap:10px;
  flex:1;
  /* Forced autoscroll while typing -> keep it stable (no "kaugummi") */
  scroll-behavior:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

.dscb-msg{
  max-width:86%;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--dscb-border);
  color: var(--dscb-text);
  line-height:1.35;
  font-size:14px;
  white-space: pre-line;
}

.dscb-msg.bot{
  background: var(--dscb-sys-bg);
  border-color: var(--dscb-sys-br);
  border-top-left-radius:8px;
  align-self:flex-start;
}
.dscb-msg.bot.ds-q{ background: var(--dscb-q-bg); border-color: var(--dscb-q-br); }
.dscb-msg.bot.ds-a{ background: var(--dscb-a-bg); border-color: var(--dscb-a-br); }

.dscb-msg.user{
  background: rgba(34,197,94,.14);
  border-color: rgba(34,197,94,.26);
  border-top-right-radius:8px;
  align-self:flex-end;
}

.dscb-quickRow{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }

.dscb-btn{
  border-radius:999px;
  padding:8px 10px;
  border:1px solid var(--dscb-border);
  background: rgba(255,255,255,.04);
  color: var(--dscb-text);
  cursor:pointer;
  font-size:13px;
  font-weight:650;
  transition: opacity .18s ease, transform .08s ease, background .12s ease, border-color .12s ease;
}
.dscb-btn:hover{ background: rgba(255,255,255,.07); }
.dscb-btn:active{ transform: translateY(1px); }

.dscb-btn.primary{ background: rgba(34,197,94,.18); border-color: rgba(34,197,94,.28); }
.dscb-btn.link{ background: rgba(255,255,255,.02); border-color: rgba(255,255,255,.12); font-weight:600; opacity:.95; }
.dscb-btn.mini{ padding:6px 10px; font-size:12px; font-weight:750; }

.dscb-btn.selected{
  background: rgba(34,197,94,.28);
  border-color: rgba(34,197,94,.55);
  box-shadow: 0 0 0 2px rgba(34,197,94,.12) inset;
}
.dscb-btn.selected.primary{
  background: rgba(34,197,94,.34);
  border-color: rgba(34,197,94,.62);
}

.dscb-footer{
  padding:10px 12px;
  border-top:1px solid var(--dscb-border);
  display:flex; gap:8px;
  background: rgba(255,255,255,.02);
}
.dscb-input{
  flex:1;
  border-radius:12px;
  padding:10px 12px;
  border:1px solid var(--dscb-border);
  background: rgba(0,0,0,.22);
  color: var(--dscb-text);
  outline:none;
  font-size:14px;
}
.dscb-send{
  border-radius:12px;
  padding:10px 12px;
  border:1px solid rgba(34,197,94,.28);
  background: rgba(34,197,94,.18);
  color: var(--dscb-text);
  cursor:pointer;
  font-weight:750;
}
.dscb-send:hover{ background: rgba(34,197,94,.22); }

.dscb-note{ font-size:11px; color: var(--dscb-muted); padding:0 12px 12px; }



/* Button typing reveal */
.dscb-btn.is-queued{opacity:0; transform: translateY(6px); pointer-events:none;}
.dscb-btn.is-shown{opacity:1; transform: translateY(0); pointer-events:auto;}
