/* WIDGET · ai_chat.css — chat de IA com departamentos (usa --bs-primary do tema; dark via prefers-color-scheme) */
.wcai{
    --wcai-accent: var(--bs-primary, #6576ff);
    --wcai-accent-contrast:#fff;
    --wcai-bg:#ffffff;
    --wcai-fg:#1c2b46;
    --wcai-log:#f5f6fa;
    --wcai-bot:#ffffff;
    --wcai-border:#e7e9f2;
    --wcai-muted:#6b7280;
    position:fixed; right:22px; bottom:22px; z-index:99990; font-family:inherit;
}
@media (prefers-color-scheme: dark){
    .wcai{ --wcai-bg:#16181d; --wcai-fg:#e7e9f2; --wcai-log:#0f1115; --wcai-bot:#1f2329; --wcai-border:#2a2f39; --wcai-muted:#9aa3bf; }
}
.wcai *{ box-sizing:border-box; }

/* ---- launcher + teaser ---- */
.wcai-launcher{
    width:58px; height:58px; border-radius:50%; border:0; cursor:pointer;
    background:var(--wcai-accent); color:var(--wcai-accent-contrast);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 24px rgba(0,0,0,.22); transition:transform .15s ease, box-shadow .15s ease;
}
.wcai-launcher:hover{ transform:translateY(-2px) scale(1.04); box-shadow:0 12px 30px rgba(0,0,0,.28); }
.wcai.is-open .wcai-launcher{ display:none; }
.wcai-teaser{
    position:absolute; right:0; bottom:70px; max-width:220px; cursor:pointer;
    background:var(--wcai-bg); color:var(--wcai-fg); border:1px solid var(--wcai-border);
    padding:10px 14px; border-radius:14px 14px 4px 14px; font-size:13.5px; line-height:1.35;
    box-shadow:0 10px 30px rgba(0,0,0,.18); animation:wcaiIn .2s ease;
}

/* ---- painel ---- */
.wcai-panel{
    position:absolute; right:0; bottom:0; width:384px; max-width:calc(100vw - 32px);
    height:600px; max-height:calc(100vh - 48px);
    background:var(--wcai-bg); color:var(--wcai-fg); border-radius:18px; overflow:hidden;
    display:flex; flex-direction:column; box-shadow:0 18px 50px rgba(0,0,0,.32); animation:wcaiIn .18s ease;
}
@keyframes wcaiIn{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }

/* ---- cabeçalho ---- */
.wcai-head{
    background:var(--wcai-accent); color:var(--wcai-accent-contrast);
    display:flex; align-items:center; gap:9px; padding:12px 14px; flex:0 0 auto;
}
.wcai-head button{ background:transparent; border:0; color:inherit; cursor:pointer; opacity:.9; display:flex; align-items:center; }
.wcai-head button:hover{ opacity:1; }
.wcai-back{ font-size:26px; line-height:1; margin-left:-4px; }
.wcai-close{ font-size:26px; line-height:1; }
.wcai-avatar{ width:34px; height:34px; border-radius:50%; flex:0 0 auto; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.22); overflow:hidden; }
.wcai-avatar.has-img{ background:transparent; }
.wcai-avatar img{ width:100%; height:100%; object-fit:cover; }
.wcai-headtxt{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; line-height:1.2; }
.wcai-title{ font-weight:600; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wcai-sub{ font-size:11.5px; opacity:.85; display:flex; align-items:center; gap:5px; }
.wcai-sub::before{ content:""; width:7px; height:7px; border-radius:50%; background:#48d38a; box-shadow:0 0 0 3px rgba(72,211,138,.3); flex:0 0 auto; }

/* ---- corpo ---- */
.wcai-body{ flex:1 1 auto; min-height:0; overflow:hidden; display:flex; flex-direction:column; background:var(--wcai-log); }
.wcai-log{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px; }

/* ---- home de departamentos ---- */
.wcai-home{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:18px 16px; }
.wcai-home-hi{ margin:0 0 6px; font-size:15px; color:var(--wcai-fg); }
.wcai-home-q{ font-size:12.5px; color:var(--wcai-muted); margin-bottom:12px; }
.wcai-depts{ display:flex; flex-direction:column; gap:9px; }
.wcai-dept{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; cursor:pointer;
    background:var(--wcai-bot); border:1px solid var(--wcai-border); border-radius:13px; padding:11px 13px; color:var(--wcai-fg);
    transition:border-color .15s ease, transform .1s ease, box-shadow .15s ease; }
.wcai-dept:hover{ border-color:var(--wcai-accent); transform:translateY(-1px); box-shadow:0 6px 18px rgba(0,0,0,.08); }
.wcai-dept-ic{ width:40px; height:40px; border-radius:11px; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
    background:var(--wcai-accent); color:var(--wcai-accent-contrast); font-size:19px; }
.wcai-dept-tx{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.wcai-dept-lb{ font-weight:600; font-size:14px; }
.wcai-dept-bl{ font-size:12px; color:var(--wcai-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wcai-dept-go{ font-size:22px; color:var(--wcai-muted); flex:0 0 auto; }

/* ---- linhas/bolhas ---- */
.wcai-row{ display:flex; align-items:flex-end; gap:8px; }
.wcai-row.user{ justify-content:flex-end; }
.wcai-av{ width:28px; height:28px; border-radius:50%; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
    background:var(--wcai-accent); color:var(--wcai-accent-contrast); overflow:hidden; }
.wcai-av img{ width:100%; height:100%; object-fit:cover; }
.wcai-msg{ flex:0 1 auto; max-width:85%; min-width:0; padding:9px 13px; border-radius:14px; font-size:14px; line-height:1.45; word-wrap:break-word; overflow-wrap:anywhere; }
.wcai-msg.user{ background:var(--wcai-accent); color:var(--wcai-accent-contrast); border-bottom-right-radius:4px; white-space:pre-wrap; }
.wcai-msg.bot{ background:var(--wcai-bot); color:var(--wcai-fg); border:1px solid var(--wcai-border); border-bottom-left-radius:4px; white-space:normal; }
.wcai-msg.bot a{ color:var(--wcai-accent); text-decoration:underline; }
.wcai-meta{ font-size:11.5px; opacity:.7; margin-top:6px; display:block; word-break:break-word; }

/* ---- chips de sugestão ---- */
.wcai-chips{ display:flex; flex-wrap:wrap; gap:7px; padding-left:36px; }
.wcai-chip{ cursor:pointer; border:1px solid var(--wcai-accent); color:var(--wcai-accent); background:transparent;
    border-radius:16px; padding:6px 12px; font-size:12.5px; line-height:1.2; transition:background .15s ease, color .15s ease; }
.wcai-chip:hover{ background:var(--wcai-accent); color:var(--wcai-accent-contrast); }
.wcai-chip-lead{ border-style:dashed; }

/* ---- formulário de lead ---- */
.wcai-lead-tt{ font-weight:600; margin-bottom:7px; font-size:13.5px; }
.wcai-leadform{ display:flex; flex-direction:column; gap:7px; }
.wcai-leadform input, .wcai-leadform textarea{ border:1px solid var(--wcai-border); background:var(--wcai-bg); color:var(--wcai-fg);
    border-radius:9px; padding:8px 11px; font-size:13px; outline:none; width:100%; font-family:inherit; }
.wcai-leadform input:focus, .wcai-leadform textarea:focus{ border-color:var(--wcai-accent); }
.wcai-leadform button{ align-self:flex-start; border:0; cursor:pointer; background:var(--wcai-accent); color:var(--wcai-accent-contrast);
    border-radius:9px; padding:8px 16px; font-size:13px; font-weight:600; }
.wcai-leadform button:disabled{ opacity:.6; cursor:default; }

/* ---- conteúdo rico das respostas ---- */
.wcai-msg.bot > :first-child{ margin-top:0; } .wcai-msg.bot > :last-child{ margin-bottom:0; }
.wcai-msg.bot p{ margin:0 0 .5em; }
.wcai-msg.bot ul, .wcai-msg.bot ol{ margin:.25em 0 .5em; padding-left:1.25em; }
.wcai-msg.bot li{ margin:.1em 0; } .wcai-msg.bot li > p{ margin:0; }
.wcai-msg.bot h1, .wcai-msg.bot h2, .wcai-msg.bot h3, .wcai-msg.bot h4, .wcai-msg.bot h5, .wcai-msg.bot h6{ font-size:1em; font-weight:700; line-height:1.3; margin:.5em 0 .3em; }
.wcai-msg.bot h1{ font-size:1.18em; } .wcai-msg.bot h2{ font-size:1.1em; }
.wcai-msg.bot blockquote{ border-left:3px solid rgba(130,130,150,.4); margin:.35em 0; padding:.1em .7em; opacity:.9; }
.wcai-msg.bot hr{ margin:.55em 0; border:0; border-top:1px solid rgba(130,130,150,.3); }
.wcai-msg.bot code{ background:rgba(130,130,150,.18); padding:.06em .35em; border-radius:4px; font-size:.86em; }
.wcai-msg.bot pre{ margin:.4em 0 .55em; border-radius:8px; overflow:auto; max-width:100%; }
.wcai-msg.bot pre code{ display:block; padding:.65em .8em; border-radius:8px; background:#f6f8fa; color:#24292e; font-size:.82em; line-height:1.5; overflow-x:auto; }
.wcai-msg.bot table{ display:block; overflow-x:auto; border-collapse:collapse; margin:.45em 0 .6em; font-size:.92em; max-width:100%; }
.wcai-msg.bot th, .wcai-msg.bot td{ border:1px solid rgba(130,130,150,.4); padding:.3em .55em; }
.wcai-msg.bot thead th{ background:rgba(130,130,150,.14); font-weight:600; }
.wcai-msg.bot tbody tr:nth-child(even){ background:rgba(130,130,150,.06); }
.wcai-msg.bot svg{ max-width:100%; height:auto; }
.wcai-msg.bot img{ max-width:100%; height:auto; border-radius:6px; }
.wcai-typing{ display:inline-flex; gap:4px; }
.wcai-typing i{ width:6px; height:6px; border-radius:50%; background:var(--wcai-muted); animation:wcaiBlink 1s infinite; }
.wcai-typing i:nth-child(2){ animation-delay:.2s; } .wcai-typing i:nth-child(3){ animation-delay:.4s; }
@keyframes wcaiBlink{ 0%,60%,100%{ opacity:.25; } 30%{ opacity:1; } }

/* ---- composer ---- */
.wcai-form{ flex:0 0 auto; display:flex; align-items:flex-end; gap:8px; padding:12px; border-top:1px solid var(--wcai-border); background:var(--wcai-bg); }
.wcai-input{ flex:1 1 auto; border:1px solid var(--wcai-border); background:var(--wcai-bg); color:var(--wcai-fg);
    border-radius:18px; padding:9px 15px; font-size:14px; outline:none; resize:none; max-height:96px; line-height:1.4; font-family:inherit; }
.wcai-input:focus{ border-color:var(--wcai-accent); }
.wcai-send{ flex:0 0 auto; width:42px; height:42px; border-radius:50%; border:0; cursor:pointer; background:var(--wcai-accent); color:var(--wcai-accent-contrast); display:flex; align-items:center; justify-content:center; }
.wcai-send:disabled{ opacity:.5; cursor:default; }

/* ---- mobile ---- */
@media (max-width:480px){
    .wcai{ right:14px; bottom:14px; }
    .wcai-panel{ width:100vw; height:100dvh; max-height:none; right:-14px; bottom:-14px; border-radius:0;
        padding-bottom:env(safe-area-inset-bottom); }
    .wcai-teaser{ bottom:74px; }
    /* Tela cheia: bolhas mais largas p/ dados estruturados (nome/e-mail/telefone) não
       quebrarem no meio da palavra; listas com menos recuo devolvem espaço ao conteúdo. */
    .wcai-msg{ max-width:92%; }
    .wcai-msg.bot ul, .wcai-msg.bot ol{ padding-left:1.1em; }
}