/* ============================================================================
   Bolt ao vivo - a tela de preparo, o painel da call e a janela flutuante.
   Tudo em cima dos tokens: o escuro acompanha sozinho, inclusive na janela
   flutuante (ela copia as folhas de estilo e o data-tema do CRM).
   ========================================================================== */

/* ---------------- preparo ---------------- */
.av-preparo{display:grid;gap:14px;max-width:880px}
.av-hero-tit{display:flex;gap:14px;align-items:flex-start}
.av-hero-tit>svg{width:44px;height:44px;flex:none;padding:10px;border-radius:50%;background:var(--bolt-soft);color:var(--bolt);stroke-width:2}
.av-hero h2{font-size:18px;font-weight:750;margin:0 0 4px;letter-spacing:-.01em}
.av-hero p{margin:0;color:var(--ink-2);line-height:1.55;max-width:640px}
.av-form{display:grid;gap:10px;margin:18px 0 4px}
.av-form label{display:grid;gap:6px;font-size:13px;font-weight:600}
.av-form select{height:38px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);padding:0 10px;max-width:420px}
.av-form .av-check{display:flex;gap:9px;align-items:flex-start;font-weight:500;line-height:1.45;cursor:pointer}
.av-form .av-check input{margin-top:3px;accent-color:var(--brand)}
.av-acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.av-entrar{height:44px;padding:0 20px;font-size:14px}
.av-entrar svg{width:17px;height:17px}
.av-como ol{margin:0 0 12px;padding-left:20px;display:grid;gap:7px;color:var(--ink-2);line-height:1.5}
.av-como p{margin:0;font-size:12.5px}
.av-aviso{margin:10px 0 0;padding:8px 12px;border-radius:var(--r-sm);background:var(--warn-soft);color:var(--warn);font-size:12.5px;font-weight:600;line-height:1.45}
.av-resumo p{margin:6px 0 10px;line-height:1.8}
.av-chip{display:inline-block;padding:1px 9px;border-radius:20px;background:var(--surface-3);border:1px solid var(--line);font-size:12px;font-weight:600;margin-right:4px}

/* ---------------- durante a call, na tela do CRM ---------------- */
.av-tela{display:grid;gap:10px;max-width:760px}
.av-tela-barra{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:12.5px}
.av-tela-painel{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--sombra-2);overflow:hidden}
.av-tela-painel .av-painel{height:min(720px,calc(100vh - 170px))}

/* ---------------- o painel (tela e janela flutuante) ---------------- */
.av-painel{display:flex;flex-direction:column;min-height:0;background:var(--surface)}
.av-topo{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 14px;border-bottom:1px solid var(--line-soft);font-size:12px}
.av-vivo{display:inline-flex;align-items:center;gap:6px;font-weight:800;letter-spacing:.08em;color:var(--bolt);font-size:11px}
.av-vivo i{width:8px;height:8px;border-radius:50%;background:var(--bolt);animation:av-pulso 1.4s ease-in-out infinite}
.av-tempo{font-variant-numeric:tabular-nums;color:var(--ink-2);font-weight:650}
.av-faixas{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.av-faixa{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2)}
.av-faixa b{font-weight:650}
.av-faixa em{font-style:normal;color:var(--warn);font-weight:600}
.av-faixa.av-st-parado em{color:var(--ink-4)}
.av-nivel{display:inline-block;width:42px;height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.av-nivel i{display:block;height:100%;background:var(--ok);border-radius:4px;transition:width 160ms linear}
.av-faixa.falando b{color:var(--ok)}
.av-espaco{flex:1}
.av-sair{height:28px;padding:0 11px;border-radius:var(--r-xs);border:1px solid var(--line);background:var(--surface-2);font-size:12px;font-weight:650;color:var(--ink-2)}
.av-sair:hover{border-color:var(--bolt);color:var(--bolt)}
.av-conta{flex-basis:100%;color:var(--ink-3);font-size:11.5px;margin-top:-4px}
.av-topo .av-aviso{flex-basis:100%;margin:0}

.av-palco{flex:1;min-height:0;overflow-y:auto;padding:14px}
.av-card{border:1px solid var(--line);border-left:4px solid var(--bolt);border-radius:var(--r);padding:14px 16px 12px;background:var(--surface);animation:av-entra 220ms ease-out}
.av-card.av-pergunta{border-left-color:var(--info)}
.av-card.ajustado{animation:av-ajuste 700ms ease-out}
.av-rotulo{font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;font-weight:800;color:var(--bolt)}
.av-pergunta .av-rotulo{color:var(--info)}
.av-titulo{font-size:16px;font-weight:750;margin:2px 0 2px;letter-spacing:-.01em}
.av-gatilho{font-size:12.5px;color:var(--ink-3);font-style:italic;margin-bottom:6px}
.av-sec{font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;font-weight:800;color:var(--ink-3);margin:12px 0 3px}
.av-fale{margin:0;font-size:19px;line-height:1.38;font-weight:650;font-family:Georgia,'Iowan Old Style','Times New Roman',serif;color:var(--ink)}
.av-pergunte{margin:0;font-size:15px;line-height:1.45;font-weight:600;font-family:Georgia,'Iowan Old Style','Times New Roman',serif;color:var(--ink)}
.av-extra{display:grid;gap:6px;margin-top:12px;padding-top:10px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--ink-2);line-height:1.45}
.av-extra b{display:inline-block;margin-right:6px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3)}
.av-nunca b{color:var(--bolt)}
.av-origem{margin-top:10px;font-size:11px;color:var(--ink-4);font-weight:600}
.av-origem.pensando::after{content:'...';display:inline-block;width:14px;animation:av-pontos 1.2s steps(4) infinite;overflow:hidden;vertical-align:bottom}

.av-vazio{height:100%;min-height:180px;display:grid;place-content:center;justify-items:center;text-align:center;gap:6px;color:var(--ink-2);padding:10px}
.av-vazio b{font-size:15px;color:var(--ink)}
.av-vazio p{margin:0;max-width:300px;font-size:13px;line-height:1.5}
.av-onda{display:flex;gap:4px;align-items:center;height:26px;margin-bottom:6px}
.av-onda i{width:5px;height:8px;border-radius:3px;background:var(--ink-4)}
.av-onda.ativa i{background:var(--ok);animation:av-onda 900ms ease-in-out infinite}
.av-onda.ativa i:nth-child(2){animation-delay:.15s}
.av-onda.ativa i:nth-child(3){animation-delay:.3s}
.av-onda.ativa i:nth-child(4){animation-delay:.45s}

.av-antes{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding:0 14px;font-size:11.5px;color:var(--ink-3)}
.av-antes:not(:empty){padding-bottom:10px}
.av-antes button,.av-achados button{height:26px;padding:0 10px;border-radius:20px;border:1px solid var(--line);background:var(--surface-2);font-size:12px;font-weight:600;color:var(--ink-2)}
.av-antes button:hover,.av-achados button:hover{border-color:var(--ink-4);color:var(--ink)}
.av-busca{padding:8px 14px;border-top:1px solid var(--line-soft)}
.av-busca input{width:100%;height:32px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);padding:0 10px;font-size:12.5px}
.av-achados{display:flex;gap:6px;flex-wrap:wrap}
.av-achados:not(:empty){margin-top:8px}
.av-transcricao{max-height:126px;overflow-y:auto;padding:8px 14px 12px;border-top:1px solid var(--line-soft);background:var(--surface-2);font-size:12.5px;line-height:1.45}
.av-transcricao p{margin:0 0 3px;color:var(--ink-2)}
.av-transcricao b{margin-right:6px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3)}
.av-transcricao .av-l-lead b{color:var(--bolt)}
.av-transcricao .av-parcial{opacity:.65}
.av-transcricao .av-l-vazio{color:var(--ink-4)}

/* ---------------- janela flutuante ---------------- */
body.av-pip{margin:0;height:100vh;overflow:hidden;background:var(--surface)}
body.av-pip .av-painel{height:100vh}
body.av-pip .av-fale{font-size:20px}

@keyframes av-pulso{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes av-entra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes av-ajuste{0%{box-shadow:0 0 0 0 var(--brand-line)}40%{box-shadow:0 0 0 5px var(--brand-line)}100%{box-shadow:0 0 0 0 transparent}}
@keyframes av-onda{0%,100%{height:8px}50%{height:24px}}
@keyframes av-pontos{from{width:0}to{width:14px}}
@media (prefers-reduced-motion:reduce){.av-card,.av-card.ajustado,.av-vivo i,.av-onda.ativa i{animation:none}}
@media (max-width:640px){.av-fale{font-size:17px}.av-tela-painel .av-painel{height:calc(100vh - 150px)}}

/* ---------------- segunda leva: abas, sinal, usei, lembrete, resumo, painel ---------------- */
.av-abas{display:flex;gap:6px;margin:0 0 12px}
.av-abas button{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:20px;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);font-weight:650;font-size:13px}
.av-abas button svg{width:15px;height:15px}
.av-abas button.ativo{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.av-card.av-sinal{border-left-color:var(--ok)}
.av-sinal .av-rotulo{color:var(--ok)}
.av-card-pe{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.av-card-pe .av-origem{margin-top:0}
.av-usei{flex:none;height:28px;padding:0 12px;border-radius:20px;border:1px solid var(--line);background:var(--surface-2);font-size:12px;font-weight:700;color:var(--ink-2)}
.av-usei:hover{border-color:var(--ok);color:var(--ok)}
.av-usei.ativo{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.av-fale.escrevendo::after{content:'|';margin-left:2px;color:var(--ink-3);animation:av-pulso 1s steps(2) infinite}
.av-lembrete:not(:empty){padding:10px 14px 0}
.av-lembrete-caixa{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;padding:9px 12px;border-radius:var(--r-sm);background:var(--info-soft);border:1px solid var(--info);font-size:12.5px;line-height:1.45;color:var(--ink)}
.av-lembrete-caixa b{display:block;color:var(--info);font-size:11px;text-transform:uppercase;letter-spacing:.07em}
.av-lembrete-caixa button{flex:none;height:26px;padding:0 10px;border-radius:var(--r-xs);border:1px solid var(--info);background:var(--surface);color:var(--info);font-weight:700;font-size:12px}
.av-salvar{display:grid;gap:10px;margin-top:6px}
.av-salvar label{display:grid;gap:6px;font-size:13px;font-weight:600}
.av-salvar select{height:38px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);padding:0 10px;max-width:420px}
.av-salvar .av-check{display:flex;gap:9px;align-items:flex-start;font-weight:500;line-height:1.45}
.av-salvar .av-check input{margin-top:3px;accent-color:var(--brand)}
.av-chip-objecao{background:var(--bolt-soft);border-color:transparent;color:var(--bolt)}
.av-chip-pergunta{background:var(--info-soft);border-color:transparent;color:var(--info)}
.av-chip-sinal{background:var(--ok-soft);border-color:transparent;color:var(--ok)}
.av-extensao p,.av-robo p{margin:0 0 10px;color:var(--ink-2);line-height:1.5}
.av-uso{display:grid;gap:14px;max-width:880px}
.av-uso-topo{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:13px}
.av-uso-topo input{height:34px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);padding:0 8px;margin-left:6px}
.av-tabela th,.av-tabela td{padding:7px 10px;font-size:13px;text-align:left}
.av-barra-linha{display:grid;grid-template-columns:minmax(120px,1.4fr) 2fr auto auto;gap:10px;align-items:center;font-size:13px;margin:6px 0}
.av-barra-linha i{display:block;height:8px;border-radius:5px;background:linear-gradient(90deg,var(--bolt) var(--p),var(--surface-3) var(--p))}
.av-barra-linha em{font-style:normal;color:var(--ink-3);font-size:12px}
.av-uso-tipos{margin:10px 0 0}
.av-conta-linha{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:6px 0;border-bottom:1px dashed var(--line-soft);font-size:13px}
.av-orfa{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px dashed var(--line-soft);font-size:13px;cursor:pointer}
.av-orfa input{margin-top:3px;accent-color:var(--brand)}
.av-orfa em{font-style:normal;color:var(--ink-3);font-size:12px}
.av-orfa small{display:block;color:var(--ink-2);margin-top:2px}
.av-rascunho{display:grid;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.av-rascunho .campo{display:grid;gap:5px;font-size:12.5px;font-weight:600}
.av-rascunho input,.av-rascunho textarea,.av-rascunho select{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);padding:7px 9px;font-size:13px;font-weight:400}
@media (max-width:640px){.av-barra-linha{grid-template-columns:1fr auto}.av-barra-linha i,.av-barra-linha em{display:none}}
