/* Barra da conversa reorganizada (app/barra-conversa.js) */
.drawer.tzbc .drawer-toolbar { overflow: hidden; }
.drawer.tzbc .drawer-toolbar [data-tool="history"],
.drawer.tzbc .drawer-toolbar .tzx-fav,
.drawer.tzbc .drawer-toolbar .tzcl-conv,
.drawer.tzbc .drawer-toolbar .tzq-badge,
.drawer.tzbc .drawer-toolbar .tzcl-wallet,
.drawer.tzbc .drawer-toolbar .tzcl-data { display: none !important; }
/* Ícones em traço no lugar dos símbolos */
.drawer.tzbc .drawer-tool .drawer-tool-icon { font-size: 0; width: 16px; height: 16px; display: inline-block; background: currentColor; -webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat; }
.drawer.tzbc [data-tool="contact"] { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.drawer.tzbc [data-tool="manage"] { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6h10M18 6h2M4 12h4M12 12h8M4 18h12M20 18h0'/%3E%3Ccircle cx='16' cy='6' r='2'/%3E%3Ccircle cx='10' cy='12' r='2'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3C/svg%3E"); }
.drawer.tzbc .tzf-deal-btn { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E"); }
.drawer.tzbc .tzx-schedule { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.drawer.tzbc .tzbc-more { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Ccircle cx='5' cy='12' r='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Ccircle cx='19' cy='12' r='2'/%3E%3C/svg%3E"); }
/* Selos embaixo do nome */
.tzbc-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 4px; }
.tzbc-chip { max-width: 240px; padding: 2px 9px; border: 0; border-radius: 999px; background: var(--blue2); color: var(--blue); font-size: 11.5px; font-weight: 700; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tzbc-chip.ghost { background: transparent; border: 1px dashed var(--line); color: var(--muted); }
.tzbc-star { width: 32px; height: 32px; border: 1px solid var(--tz-outline-container); border-radius: var(--tz-r-md); background: var(--surface); color: var(--muted); font-size: 17px; cursor: pointer; margin-right: 6px; }
.tzbc-star.on { color: #f59e0b; border-color: #fcd34d; }

/* Topo de Conversas (app/topo-conversas.js) */
.tztp .team-label, .tztp .tztp-hidden { display: none !important; }
.content .sla-row { display: none !important; }
.tztp-sla { display: flex; align-items: center; gap: 6px; padding: 6px 10px; font-size: 12.5px; color: var(--ink); white-space: nowrap; }
.tztp-sla input { width: 58px; padding: 4px 6px; border: 1px solid var(--tz-outline-control); border-radius: var(--tz-r-sm); background: var(--surface); color: var(--ink); }
/* Caixa de escrever: ícones em traço */
.composer .quick-reply, .composer .audio-button, .composer > .round:first-child { font-size: 0 !important; display: grid; place-items: center; }
.composer .quick-reply::before, .composer .audio-button::before, .composer > .round:first-child::before { content: ''; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat; }
.composer > .round:first-child { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }
.composer .quick-reply { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7l1-8z'/%3E%3C/svg%3E"); }
.composer .audio-button { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3' width='6' height='12' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E"); }

/* O "×" da barra só fecha o painel de ferramentas: aparece só quando há um painel aberto (antes parecia um 2º "fechar conversa"). */
.drawer-toolbar:not(:has([data-tool].active)) #closeTools { display: none !important; }
/* Janela de 24 h: o selo no cabeçalho substitui a faixa sobre as mensagens */
.drawer.tzbc #customerWindowBannerTomZap { display: none !important; }
.tzbc-win { cursor: default; background: #8a97ad24; color: var(--muted); }
.tzbc-win.warn { background: #f59e0b26; color: #b45309; }
.tzbc-win.danger { background: #ef444426; color: #dc2626; }
.tzbc-win.closed { background: #ef444426; color: #dc2626; cursor: pointer; }
body[data-theme="graphite"] .tzbc-win.warn { color: #fbbf24; }
body[data-theme="graphite"] .tzbc-win.danger, body[data-theme="graphite"] .tzbc-win.closed { color: #f87171; }
/* Celular: as 5 ações não cabem em 375 px; a barra rola de lado em vez de cortar "Agendar" */
@media (max-width: 760px) {
  .drawer.tzbc .drawer-toolbar { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .drawer.tzbc .drawer-toolbar::-webkit-scrollbar { display: none; }
  .drawer.tzbc .drawer-toolbar .drawer-tool { flex: 0 0 auto; white-space: nowrap; }
}
/* Celular em pé (23/10/2026): a barra rolava para o lado sem aviso e o "Mais" (Tarefas, Histórico, Adiar...) ficava
   fora da tela. Agora as 5 ações dividem a largura, com o ícone em cima do nome. */
@media (max-width: 760px) and (orientation: portrait), (orientation: landscape) and (max-height: 500px) {
  .drawer.tzbc .drawer-toolbar { overflow: hidden; gap: 0 !important; padding-left: 4px !important; padding-right: 4px !important; }
  .drawer.tzbc .drawer-toolbar .drawer-tool { flex: 1 1 0 !important; min-width: 0; justify-content: center; padding: 6px 2px !important; font-size: 12px !important; white-space: nowrap; }
  .drawer.tzbc .drawer-tool .drawer-tool-icon { flex-shrink: 0; }
}
@media (max-width: 760px) and (orientation: portrait) {
  .drawer.tzbc .drawer-toolbar .drawer-tool { flex-direction: column; gap: 3px !important; height: auto !important; min-height: 48px; }
  .drawer.tzbc .drawer-tool .drawer-tool-icon { width: 20px !important; height: 20px !important; }
}
