/* ============================================================
 * Wevo Chatbot widget
 * Neutral, modern, fully theme-able via --wevo-brand / --wevo-accent
 * (set inline by the script from the admin colour settings).
 * ============================================================ */

#wevo-chatbot-root{
  --wevo-brand:#2563eb;
  --wevo-accent:#0f172a;
  --wevo-bg:#ffffff;
  --wevo-muted:#64748b;
  --wevo-line:#e6e9f0;
  --wevo-user:#eef4ff;
  --wevo-radius:18px;
  --wevo-shadow:0 18px 50px -12px rgba(15,23,42,.28);
  position:fixed;
  bottom:22px;
  z-index:2147483000;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
#wevo-chatbot-root.wevo-pos-right{ right:22px; }
#wevo-chatbot-root.wevo-pos-left{ left:22px; }
#wevo-chatbot-root *{ box-sizing:border-box; }

/* ---------- Launcher ---------- */
.wevo-launcher{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:13px 18px;
  border:none;
  border-radius:100px;
  background:var(--wevo-brand);
  color:#fff;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  box-shadow:var(--wevo-shadow);
  transition:transform .18s ease, filter .18s ease;
}
.wevo-launcher:hover{ transform:translateY(-2px); filter:brightness(1.05); }
.wevo-launcher svg{ width:20px; height:20px; }
.wevo-launcher.wevo-hide{ display:none; }

/* ---------- Panel ---------- */
.wevo-panel{
  position:absolute;
  bottom:0;
  width:380px;
  max-width:calc(100vw - 32px);
  height:580px;
  max-height:calc(100vh - 48px);
  background:var(--wevo-bg);
  border-radius:var(--wevo-radius);
  box-shadow:var(--wevo-shadow);
  display:none;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--wevo-line);
  animation:wevo-pop .22s ease;
}
#wevo-chatbot-root.wevo-pos-right .wevo-panel{ right:0; }
#wevo-chatbot-root.wevo-pos-left .wevo-panel{ left:0; }
.wevo-panel.wevo-open{ display:flex; }
@keyframes wevo-pop{ from{ opacity:0; transform:translateY(12px) scale(.98); } to{ opacity:1; transform:none; } }

.wevo-head{
  display:flex;
  align-items:center;
  gap:10px;
  padding:16px 18px;
  background:var(--wevo-brand);
  color:#fff;
}
.wevo-head .wevo-avatar{
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.2);
  display:flex; align-items:center; justify-content:center;
}
.wevo-head .wevo-avatar svg{ width:18px; height:18px; }
.wevo-head .wevo-title{ font-weight:700; font-size:15px; line-height:1.2; }
.wevo-head .wevo-sub{ font-size:12px; opacity:.85; }
.wevo-head .wevo-close{
  margin-left:auto; background:transparent; border:none; color:#fff;
  cursor:pointer; padding:6px; border-radius:8px; line-height:0;
}
.wevo-head .wevo-close:hover{ background:rgba(255,255,255,.15); }

.wevo-body{
  flex:1; overflow-y:auto; padding:16px;
  background:linear-gradient(180deg,#fafbfe 0%,#fff 100%);
  display:flex; flex-direction:column; gap:10px;
}
.wevo-msg{ max-width:86%; padding:10px 13px; border-radius:14px; font-size:14px; line-height:1.45; white-space:pre-wrap; word-wrap:break-word; }
.wevo-msg.bot{ align-self:flex-start; background:#fff; border:1px solid var(--wevo-line); color:var(--wevo-accent); border-bottom-left-radius:4px; }
.wevo-msg.user{ align-self:flex-end; background:var(--wevo-user); color:var(--wevo-accent); border-bottom-right-radius:4px; }
.wevo-msg a{ color:var(--wevo-brand); }

.wevo-typing{ align-self:flex-start; display:flex; gap:4px; padding:12px 14px; }
.wevo-typing span{ width:7px; height:7px; border-radius:50%; background:var(--wevo-muted); opacity:.5; animation:wevo-blink 1.2s infinite; }
.wevo-typing span:nth-child(2){ animation-delay:.2s; }
.wevo-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes wevo-blink{ 0%,60%,100%{ opacity:.25; transform:translateY(0); } 30%{ opacity:.9; transform:translateY(-3px); } }

/* Quick replies + action buttons */
.wevo-chips{ display:flex; flex-wrap:wrap; gap:8px; padding:0 16px 8px; }
.wevo-chip{
  border:1px solid var(--wevo-line); background:#fff; color:var(--wevo-accent);
  border-radius:100px; padding:8px 13px; font-size:13px; cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.wevo-chip:hover{ border-color:var(--wevo-brand); background:var(--wevo-user); }
.wevo-actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.wevo-action{
  display:inline-flex; align-items:center; gap:6px;
  border-radius:100px; padding:8px 14px; font-size:13px; font-weight:600;
  text-decoration:none; cursor:pointer; border:1.5px solid var(--wevo-brand);
}
.wevo-action.solid{ background:var(--wevo-brand); color:#fff; }
.wevo-action.ghost{ background:transparent; color:var(--wevo-brand); }

/* Lead form */
.wevo-lead{ align-self:stretch; background:#fff; border:1px solid var(--wevo-line); border-radius:14px; padding:14px; display:flex; flex-direction:column; gap:8px; }
.wevo-lead p{ margin:0 0 2px; font-size:13px; color:var(--wevo-muted); }
.wevo-lead input{ width:100%; padding:10px 12px; border:1px solid var(--wevo-line); border-radius:10px; font-size:14px; }
.wevo-lead input:focus{ outline:none; border-color:var(--wevo-brand); }
.wevo-lead .wevo-hp{ position:absolute; left:-9999px; }
.wevo-lead button{ background:var(--wevo-brand); color:#fff; border:none; border-radius:10px; padding:11px; font-size:14px; font-weight:600; cursor:pointer; }
.wevo-lead-row{ display:flex; gap:8px; align-items:center; }
.wevo-lead-row button{ flex:1; }
.wevo-lead .wevo-skip{ background:transparent; color:var(--wevo-muted); border:1px solid var(--wevo-line); flex:0 0 auto; padding:11px 14px; font-weight:500; }
.wevo-lead-err{ color:#b3261e; font-size:12px; margin:0; }
.wevo-embed{ align-self:stretch; background:#fff; border:1px solid var(--wevo-line); border-radius:14px; padding:8px; }
.wevo-embed iframe{ width:100%; border:0; min-height:420px; }

.wevo-foot{ border-top:1px solid var(--wevo-line); padding:10px; display:flex; gap:8px; align-items:flex-end; background:#fff; }
.wevo-foot textarea{
  flex:1; resize:none; border:1px solid var(--wevo-line); border-radius:12px;
  padding:10px 12px; font-size:14px; max-height:96px; font-family:inherit;
}
.wevo-foot textarea:focus{ outline:none; border-color:var(--wevo-brand); }
.wevo-foot .wevo-send{
  background:var(--wevo-brand); color:#fff; border:none; border-radius:12px;
  width:42px; height:42px; cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center;
}
.wevo-foot .wevo-send:disabled{ opacity:.5; cursor:default; }
.wevo-foot .wevo-send svg{ width:18px; height:18px; }

.wevo-consent{ padding:0 14px 10px; font-size:11px; color:var(--wevo-muted); text-align:center; background:#fff; }
.wevo-credit{ padding:6px; font-size:10px; color:var(--wevo-muted); text-align:center; }

@media (max-width:480px){
  #wevo-chatbot-root{ bottom:14px; }
  #wevo-chatbot-root.wevo-pos-right{ right:14px; }
  #wevo-chatbot-root.wevo-pos-left{ left:14px; }
  .wevo-panel{ width:calc(100vw - 28px); height:calc(100vh - 90px); }
}
@media (prefers-reduced-motion:reduce){
  .wevo-launcher,.wevo-panel,.wevo-typing span{ animation:none; transition:none; }
}

/* Proactive teaser */
.wevo-teaser{
  position:absolute; bottom:64px; max-width:260px;
  background:#fff; color:var(--wevo-accent); border:1px solid var(--wevo-line);
  border-radius:14px; padding:12px 30px 12px 14px; font-size:14px; line-height:1.4;
  box-shadow:var(--wevo-shadow); cursor:pointer; animation:wevo-pop .25s ease;
}
#wevo-chatbot-root.wevo-pos-right .wevo-teaser{ right:0; }
#wevo-chatbot-root.wevo-pos-left .wevo-teaser{ left:0; }
.wevo-teaser-x{
  position:absolute; top:6px; right:8px; border:none; background:transparent;
  font-size:16px; line-height:1; color:var(--wevo-muted); cursor:pointer;
}

/* ============================================================
 * Launcher styles + clearer close behaviour (v2.16)
 * ============================================================ */

/* Make the header close button an obvious tap target. */
.wevo-head .wevo-close{
  margin-left:auto; width:30px; height:30px; padding:0; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.16); color:#fff;
}
.wevo-head .wevo-close svg{ width:18px; height:18px; }
.wevo-head .wevo-close:hover{ background:rgba(255,255,255,.32); }

/* When open, the panel rises to leave room for the launcher-turned-close button. */
.wevo-panel.wevo-open{ bottom:74px; }

.wevo-launcher span{ white-space:nowrap; }

/* Icon-only variants: circle/square, label hidden. */
.wevo-launcher--round,
.wevo-launcher--round_pulse,
.wevo-launcher--round_lg,
.wevo-launcher--square,
.wevo-launcher--avatar,
.wevo-launcher--gradient{
  width:60px; height:60px; padding:0; gap:0; border-radius:50%; justify-content:center;
}
.wevo-launcher--round span,
.wevo-launcher--round_pulse span,
.wevo-launcher--round_lg span,
.wevo-launcher--square span,
.wevo-launcher--avatar span,
.wevo-launcher--gradient span{ display:none; }
.wevo-launcher--round svg,
.wevo-launcher--round_pulse svg,
.wevo-launcher--round_lg svg,
.wevo-launcher--square svg,
.wevo-launcher--avatar svg,
.wevo-launcher--gradient svg{ width:26px; height:26px; }

.wevo-launcher--round_lg{ width:68px; height:68px; }
.wevo-launcher--square{ border-radius:18px; }

/* Pulsing ring. */
.wevo-launcher--round_pulse{ position:relative; }
.wevo-launcher--round_pulse::after{
  content:""; position:absolute; inset:0; border-radius:50%; pointer-events:none;
  animation:wevo-pulse 2s infinite;
}
@keyframes wevo-pulse{
  0%{ box-shadow:0 0 0 0 rgba(37,99,235,.45); }
  70%{ box-shadow:0 0 0 16px rgba(37,99,235,0); }
  100%{ box-shadow:0 0 0 0 rgba(37,99,235,0); }
}

/* Pill with an online dot. */
.wevo-launcher--pill_dot::before{
  content:""; width:9px; height:9px; border-radius:50%; background:#22c55e;
  box-shadow:0 0 0 3px rgba(34,197,94,.25); flex:0 0 auto;
}

/* Minimal outline. */
.wevo-launcher--minimal{
  background:#fff; color:var(--wevo-brand); border:1.5px solid var(--wevo-brand);
  box-shadow:0 6px 18px -10px rgba(15,23,42,.3);
}
.wevo-launcher--minimal:hover{ background:var(--wevo-user); }

/* Avatar bubble — soft white ring. */
.wevo-launcher--avatar{ box-shadow:0 0 0 4px rgba(255,255,255,.6), var(--wevo-shadow); }

/* Gradient round. */
.wevo-launcher--gradient{ background:linear-gradient(135deg, var(--wevo-brand), var(--wevo-accent)); }

/* Side tab — squared top corners, sits flush at the edge. */
.wevo-launcher--tab{ border-radius:14px 14px 0 0; padding:11px 18px; }

/* Open state — always a clear round close button, whatever the preset. */
.wevo-launcher.wevo-launcher--open{
  width:56px; height:56px; padding:0; gap:0; border-radius:50%; justify-content:center;
  background:var(--wevo-brand); color:#fff; border:none;
}
.wevo-launcher.wevo-launcher--open::before,
.wevo-launcher.wevo-launcher--open::after{ content:none; animation:none; box-shadow:none; }
.wevo-launcher.wevo-launcher--open svg{ width:24px; height:24px; }

@media (prefers-reduced-motion:reduce){
  .wevo-launcher--round_pulse::after{ animation:none; }
}