/* =========================================================================
   Bia — Chatbot de captação (HubSoft)  ·  estilos do front-end
   Substitui assets/css/bia-chatbot.css do plugin. Mantém o visual:
   header azul, cantos arredondados, foto da Bia, teaser e bolão.
   ========================================================================= */
#bia-chatbot-root{
  --bia-header: linear-gradient(135deg,#2f50dc 0%,#3d63f0 100%);
  --bia-accent:#3d63f0; --bia-soft:#e1e8ff; --bia-user:linear-gradient(135deg,#3d63f0,#4f74ff);
  --bia-fab: linear-gradient(135deg,#2f50dc,#3d63f0);
  --bia-win:24px; --bia-msg:18px; --bia-fabr:50%; --bia-input:26px; --bia-btn:13px;
  --bia-shadow:0 28px 70px -18px rgba(20,22,46,.42),0 6px 20px -10px rgba(20,22,46,.25);
  --bia-ink:#232838; --bia-ink-soft:#6b7385;
  all:initial;
  position:fixed; right:26px; bottom:26px; z-index:2147483000;
  font-family:"Montserrat","Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  display:flex; flex-direction:column; align-items:flex-end; gap:16px;
}
#bia-chatbot-root,
#bia-chatbot-root *,
#bia-chatbot-root *::before,
#bia-chatbot-root *::after{ box-sizing:border-box; }

/* Isola o widget de estilos globais de temas, Elementor e plugins do WordPress. */
#bia-chatbot-root *{
  letter-spacing:0;
  text-transform:none;
}
#bia-chatbot-root button,
#bia-chatbot-root input{
  -webkit-appearance:none;
  appearance:none;
  font:inherit;
  margin:0;
  min-width:0;
  max-width:none;
  box-shadow:none;
  text-shadow:none;
}
#bia-chatbot-root img,
#bia-chatbot-root svg{
  display:block;
  max-width:none;
}
.bia-hidden{ display:none !important; }

/* ---- Bolão flutuante ---- */
.bia-fab{
  width:64px; height:64px; border-radius:var(--bia-fabr); background:var(--bia-fab); color:#fff;
  border:none; cursor:pointer; display:grid; place-items:center; position:relative;
  box-shadow:0 14px 30px -8px rgba(20,30,70,.42),0 4px 10px -4px rgba(0,0,0,.2);
  transition:transform .22s cubic-bezier(.34,1.56,.64,1); animation:bia-fab-in .5s cubic-bezier(.34,1.56,.64,1) both;
}
.bia-fab:hover{ transform:scale(1.07) rotate(-3deg); } .bia-fab:active{ transform:scale(.95); }
.bia-fab svg{ width:28px; height:28px; }
.bia-fab-ping{ position:absolute; inset:0; border-radius:inherit; box-shadow:0 0 0 0 rgba(61,99,240,.5); animation:bia-ping 2.4s infinite; }
@keyframes bia-ping{ 0%{box-shadow:0 0 0 0 rgba(61,99,240,.45);} 70%{box-shadow:0 0 0 16px rgba(61,99,240,0);} 100%{box-shadow:0 0 0 0 rgba(61,99,240,0);} }
@keyframes bia-fab-in{ from{ transform:scale(0) translateY(20px); opacity:0; } }

/* ---- Teaser ---- */
.bia-teaser{
  position:relative; width:290px; background:#fff; color:var(--bia-ink); border-radius:20px;
  padding:30px 18px 18px; margin-right:6px; box-shadow:var(--bia-shadow); text-align:center;
  cursor:pointer; animation:bia-tin .45s cubic-bezier(.34,1.4,.64,1) both;
}
.bia-teaser-avatar{ position:absolute; top:-22px; left:50%; transform:translateX(-50%); width:52px; height:52px; }
.bia-teaser-avatar img{ width:52px; height:52px; border-radius:50%; object-fit:cover; object-position:center 18%; box-shadow:0 0 0 3px rgba(255,255,255,.7); background:#e9ebf3; }
.bia-teaser-avatar .bia-online-dot{ position:absolute; right:0; bottom:0; width:13px; height:13px; background:#27c46b; border-radius:50%; border:2.5px solid #fff; }
.bia-teaser-text{ margin:16px 0 0; font-size:14.5px; line-height:1.5; color:#2a3040; }
.bia-teaser-close{ position:absolute; top:10px; right:10px; width:26px; height:26px; border-radius:50%; border:none; background:#f0f1f5; color:#8a909c; cursor:pointer; font-size:17px; line-height:1; }
.bia-teaser-close:hover{ background:#e6e8ee; }
@keyframes bia-tin{ from{ transform:translateY(16px) scale(.96); opacity:0; } }

/* ---- Janela ---- */
.bia-window{
  width:384px; height:min(620px,calc(100vh - 52px)); background:#fff; border-radius:var(--bia-win);
  overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--bia-shadow);
  animation:bia-win-in .34s cubic-bezier(.4,0,.2,1) both; transform-origin:bottom right;
}
@keyframes bia-win-in{ from{ transform:translateY(22px) scale(.94); opacity:0; } }

/* ---- Header ---- */
.bia-header{ background:var(--bia-header); color:#fff; padding:16px; display:flex; align-items:center; gap:12px; flex:0 0 auto; }
.bia-h-avatar{ position:relative; width:44px; height:44px; flex:0 0 auto; }
.bia-h-avatar img{ width:44px; height:44px; border-radius:50%; object-fit:cover; object-position:center 18%; box-shadow:0 0 0 3px rgba(255,255,255,.55); background:#e9ebf3; }
.bia-h-avatar::after{ content:""; position:absolute; right:0; bottom:0; width:11px; height:11px; background:#4ade80; border-radius:50%; border:2.5px solid #2f50dc; }
.bia-h-info{ display:flex; flex-direction:column; align-items:flex-start; gap:5px; line-height:1.1; flex:1 1 auto; }
.bia-h-info strong{ font-size:16px; font-weight:800; letter-spacing:-.02em; line-height:1; }
.bia-h-info span{ font-size:11px; opacity:.82; display:flex; align-items:center; gap:5px; font-weight:500; }
.bia-h-info span::before{ content:""; width:7px; height:7px; border-radius:50%; background:#4ade80; }
.bia-head-actions{ display:flex; align-items:center; gap:6px; flex:0 0 auto; }
.bia-head-btn{ width:34px; height:34px; flex:0 0 auto; border-radius:var(--bia-btn); border:none; cursor:pointer; background:rgba(255,255,255,.16); color:#fff; display:grid; place-items:center; transition:background .15s,transform .15s; padding:0; }
.bia-head-btn:hover{ background:rgba(255,255,255,.28); } .bia-head-btn:active{ transform:scale(.92); }
.bia-head-btn svg{ width:17px; height:17px; }
.bia-close{ font-size:21px; line-height:1; }

/* ---- Barra de progresso ---- */
.bia-progress{ height:3px; background:#eef0f4; flex:0 0 auto; }
.bia-progress-bar{ height:100%; width:0; background:var(--bia-accent); border-radius:0 3px 3px 0; transition:width .4s cubic-bezier(.4,0,.2,1); }

/* ---- Corpo ---- */
.bia-body{ flex:1 1 auto; overflow-y:auto; padding:18px 16px 8px; background:#f4f5f8; display:flex; flex-direction:column; gap:10px; }
.bia-body::-webkit-scrollbar{ width:7px; } .bia-body::-webkit-scrollbar-thumb{ background:#d7dae3; border-radius:4px; }

.bia-row{ display:flex; align-items:flex-end; gap:8px; animation:bia-min .32s ease both; }
.bia-row.bia-bot{ justify-content:flex-start; }
.bia-row.bia-user{ justify-content:flex-end; }
@keyframes bia-min{ from{ transform:translateY(8px); opacity:0; } }
.bia-msg-avatar{ width:28px; height:28px; border-radius:50%; object-fit:cover; object-position:center 18%; flex:0 0 auto; background:#e9ebf3; align-self:flex-end; }

.bia-bubble{ max-width:78%; padding:11px 14px; border-radius:var(--bia-msg); font-size:14px; line-height:1.5; }
.bia-row.bia-bot .bia-bubble{ background:#fff; color:var(--bia-ink); border:1px solid #ebedf2; border-bottom-left-radius:6px; box-shadow:0 1px 2px rgba(20,22,40,.04); }
.bia-row.bia-user .bia-bubble{ background:var(--bia-user); color:#fff; border-bottom-right-radius:6px; }
.bia-bubble.bia-error{ background:#fff3f3; color:#c0364a; border-color:#ffd9de; }

/* digitando */
.bia-typing{ display:flex; gap:4px; padding:2px 0; }
.bia-typing span{ width:7px; height:7px; border-radius:50%; background:#b6bcc9; animation:bia-bounce 1.3s infinite; }
.bia-typing span:nth-child(2){ animation-delay:.18s; } .bia-typing span:nth-child(3){ animation-delay:.36s; }
@keyframes bia-bounce{ 0%,60%,100%{ transform:translateY(0); opacity:.5; } 30%{ transform:translateY(-5px); opacity:1; } }

/* resumo */
.bia-summary{ display:flex; flex-direction:column; gap:0; padding:6px 4px; max-width:84%; }
.bia-sum-item{ display:flex; justify-content:space-between; gap:12px; padding:8px 10px; border-bottom:1px solid #eef0f4; }
.bia-sum-item:last-child{ border-bottom:none; }
.bia-sum-label{ font-size:12px; font-weight:700; color:var(--bia-ink-soft); text-transform:uppercase; letter-spacing:.03em; }
.bia-sum-value{ font-size:13.5px; color:var(--bia-ink); font-weight:600; text-align:right; }
.bia-sum-value em{ color:#aab0bb; font-weight:500; }

/* sucesso */
.bia-bubble.bia-success{ background:#eafaf1; color:#15824f; border-color:#bdeccd; display:flex; align-items:center; gap:8px; font-weight:600; }
.bia-check{ display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#22b873; color:#fff; font-size:13px; flex:0 0 auto; }

/* ---- Chips de resposta rápida ---- */
.bia-skip-wrap{ flex:0 0 auto; padding:0 16px; background:#f4f5f8; }
.bia-chips{ display:flex; flex-wrap:wrap; gap:8px; padding:0 0 12px; }
.bia-chip{ background:#fff; color:var(--bia-accent); border:1.5px solid var(--bia-soft); cursor:pointer; font-family:inherit; font-weight:600; font-size:13px; padding:9px 15px; border-radius:11px; transition:background .15s,transform .12s; }
.bia-chip:hover{ background:var(--bia-soft); transform:translateY(-1px); }
.bia-chip-primary{ background:var(--bia-accent); color:#fff; border-color:var(--bia-accent); }
.bia-chip-primary:hover{ filter:brightness(1.06); }
.bia-skip{ background:none; border:none; cursor:pointer; font-family:inherit; font-size:12.5px; color:#9aa1b8; font-weight:600; padding:0 0 12px; text-decoration:underline; }
.bia-skip:hover{ color:var(--bia-accent); }

/* ---- Input ---- */
.bia-input-area{ flex:0 0 auto; display:flex; align-items:center; gap:10px; padding:12px 14px; background:#fff; border-top:1px solid #eef0f4; }
.bia-input{ flex:1 1 auto; border:1.5px solid #e7e9f0; background:#f7f8fb; border-radius:var(--bia-input); padding:12px 16px; font-family:inherit; font-size:14px; color:var(--bia-ink); outline:none; transition:border-color .15s,background .15s; }
.bia-input:focus{ border-color:var(--bia-accent); background:#fff; }
.bia-input::placeholder{ color:#a3a9b6; }
.bia-input:disabled{ background:#f0f1f4; color:#aab0bb; }
.bia-send{ width:44px; height:44px; flex:0 0 auto; border:none; cursor:pointer; border-radius:var(--bia-btn); background:var(--bia-soft); color:var(--bia-accent); display:grid; place-items:center; transition:transform .14s,background .15s,color .15s; }
.bia-send svg{ width:20px; height:20px; }
.bia-send:not(:disabled):hover{ background:var(--bia-accent); color:#fff; }
.bia-send:not(:disabled):active{ transform:scale(.9); }
.bia-send:disabled{ opacity:.5; cursor:default; }

/* ---- Rodapé ---- */
.bia-footer{ flex:0 0 auto; text-align:center; padding:8px 16px 12px; background:#fff; font-size:11.5px; color:#aab0bb; }

/* ---- Protecoes contra CSS global do WordPress ---- */
#bia-chatbot-root .bia-window{
  width:384px !important; height:min(620px,calc(100vh - 52px)) !important; max-width:none !important;
  background:#fff !important; border-radius:var(--bia-win) !important; overflow:hidden !important;
  display:flex !important; flex-direction:column !important;
}
#bia-chatbot-root .bia-header{
  display:flex !important; align-items:center !important; gap:12px !important;
  padding:16px !important; min-height:0 !important; background:var(--bia-header) !important; color:#fff !important;
}
#bia-chatbot-root .bia-h-avatar,
#bia-chatbot-root .bia-h-avatar img{
  width:44px !important; height:44px !important; min-width:44px !important; max-width:44px !important;
  border-radius:50% !important;
}
#bia-chatbot-root .bia-msg-avatar{
  width:28px !important; height:28px !important; min-width:28px !important; max-width:28px !important;
  border-radius:50% !important;
}
#bia-chatbot-root .bia-teaser-avatar,
#bia-chatbot-root .bia-teaser-avatar img{
  width:52px !important; height:52px !important; min-width:52px !important; max-width:52px !important;
  border-radius:50% !important;
}
#bia-chatbot-root .bia-h-avatar img,
#bia-chatbot-root .bia-msg-avatar,
#bia-chatbot-root .bia-teaser-avatar img{
  object-fit:cover !important; object-position:center 18% !important;
}
#bia-chatbot-root .bia-fab,
#bia-chatbot-root .bia-head-btn,
#bia-chatbot-root .bia-teaser-close,
#bia-chatbot-root .bia-send,
#bia-chatbot-root .bia-chip,
#bia-chatbot-root .bia-skip{
  -webkit-appearance:none !important; appearance:none !important;
  font-family:inherit !important; text-decoration:none !important; box-shadow:none !important; text-shadow:none !important;
  min-width:0 !important; min-height:0 !important; max-width:none !important; max-height:none !important;
}
#bia-chatbot-root .bia-fab{
  width:64px !important; height:64px !important; padding:0 !important; border:0 !important;
  border-radius:var(--bia-fabr) !important; background:var(--bia-fab) !important; color:#fff !important;
  display:grid !important; place-items:center !important; line-height:1 !important;
}
#bia-chatbot-root .bia-head-btn{
  width:34px !important; height:34px !important; padding:0 !important; border:0 !important;
  border-radius:var(--bia-btn) !important; background:rgba(255,255,255,.16) !important; color:#fff !important;
  display:grid !important; place-items:center !important; line-height:1 !important;
}
#bia-chatbot-root .bia-head-btn:hover{ background:rgba(255,255,255,.28) !important; }
#bia-chatbot-root .bia-close{ font-size:21px !important; line-height:1 !important; }
#bia-chatbot-root .bia-teaser-close{
  width:26px !important; height:26px !important; padding:0 !important; border:0 !important;
  border-radius:50% !important; background:#f0f1f5 !important; color:#8a909c !important;
  display:grid !important; place-items:center !important; font-size:17px !important; line-height:1 !important;
}
#bia-chatbot-root .bia-teaser-close:hover{ background:#e6e8ee !important; }
#bia-chatbot-root .bia-send{
  width:44px !important; height:44px !important; padding:0 !important; border:0 !important;
  border-radius:var(--bia-btn) !important; background:var(--bia-soft) !important; color:var(--bia-accent) !important;
  display:grid !important; place-items:center !important; line-height:1 !important;
}
#bia-chatbot-root .bia-send:not(:disabled):hover{ background:var(--bia-accent) !important; color:#fff !important; }
#bia-chatbot-root .bia-input-area{
  display:flex !important; align-items:center !important; gap:10px !important;
  padding:12px 14px !important; background:#fff !important; border-top:1px solid #eef0f4 !important;
}
#bia-chatbot-root .bia-input{
  flex:1 1 auto !important; width:auto !important; min-width:0 !important; max-width:none !important;
  height:auto !important; min-height:44px !important; margin:0 !important; padding:12px 16px !important;
  border:1.5px solid #e7e9f0 !important; border-radius:var(--bia-input) !important;
  background:#f7f8fb !important; color:var(--bia-ink) !important; outline:0 !important;
  font-family:inherit !important; font-size:14px !important; font-weight:400 !important; line-height:1.4 !important;
}
#bia-chatbot-root .bia-input:focus{
  border-color:var(--bia-accent) !important; background:#fff !important; box-shadow:none !important;
}
#bia-chatbot-root .bia-input::placeholder{ color:#a3a9b6 !important; opacity:1 !important; }
#bia-chatbot-root .bia-bubble{
  max-width:78% !important; padding:11px 14px !important;
  border-radius:var(--bia-msg) !important; font-size:14px !important; line-height:1.5 !important;
}
#bia-chatbot-root .bia-chip{
  padding:9px 15px !important; border-radius:11px !important; border:1.5px solid var(--bia-soft) !important;
  background:#fff !important; color:var(--bia-accent) !important; font-size:13px !important; font-weight:600 !important; line-height:1.2 !important;
}
#bia-chatbot-root .bia-chip:hover{ background:var(--bia-soft) !important; }
#bia-chatbot-root .bia-chip-primary{ background:var(--bia-accent) !important; color:#fff !important; border-color:var(--bia-accent) !important; }
#bia-chatbot-root .bia-chip-primary:hover{ background:var(--bia-accent) !important; color:#fff !important; filter:brightness(1.06) !important; }
#bia-chatbot-root .bia-skip{
  padding:0 0 12px !important; border:0 !important; background:none !important; color:#9aa1b8 !important;
  font-size:12.5px !important; font-weight:600 !important; line-height:1.2 !important; text-decoration:underline !important;
}
#bia-chatbot-root .bia-skip:hover{ color:var(--bia-accent) !important; }

/* ---- Mobile ---- */
@media (max-width:480px){
  #bia-chatbot-root{ right:14px; bottom:14px; }
  .bia-window{ width:calc(100vw - 28px); }
  #bia-chatbot-root .bia-window{ width:calc(100vw - 28px) !important; }
  .bia-teaser{ width:calc(100vw - 40px); }
}
@media (prefers-reduced-motion: reduce){
  .bia-fab,.bia-window,.bia-teaser,.bia-row{ animation:none !important; }
  .bia-fab-ping{ animation:none !important; }
}

/* Deve ficar por ultimo: vence as regras com display !important usadas na blindagem. */
#bia-chatbot-root .bia-hidden,
#bia-chatbot-root [hidden],
#bia-chatbot-root .bia-fab.bia-hidden,
#bia-chatbot-root .bia-window.bia-hidden,
#bia-chatbot-root .bia-teaser.bia-hidden{
  display:none !important;
}
