/* Estado do ramal e pausa: cabecalho permanente da Abertura. */
.ab-telefonia .ab-telefonia-desligar { color: #ffffff; background: #dc2626; border-color: #dc2626; }
.ab-telefonia .ab-telefonia-desligar:hover:not(:disabled) { background: #b91c1c; border-color: #b91c1c; }
.ab-receptiva-aviso-slot { flex: 0 0 auto; margin: 12px 20px 0; }
.ab-receptiva-aviso-slot[hidden] { display: none; }
.ab-receptiva-sem-dados { display: flex; align-items: flex-start; gap: 16px; padding: 12px 16px; border: 1px solid var(--border); border-left: 3px solid #2563eb; border-radius: 8px; background: var(--bg-card); color: var(--text-primary); }
.ab-receptiva-sem-dados-texto { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.ab-receptiva-sem-dados-titulo { margin-bottom: 4px; font-size: 13px; font-weight: 700; }
.ab-receptiva-sem-dados-msg { font-size: 12px; line-height: 1.5; color: var(--text-secondary); }
.ab-receptiva-sem-dados > button { flex: 0 0 auto; }
@media (max-width: 640px) {
  .ab-receptiva-aviso-slot { margin: 8px 12px 0; }
  .ab-receptiva-sem-dados { flex-wrap: wrap; gap: 8px; padding: 12px; }
  .ab-receptiva-sem-dados-texto { flex-basis: 100%; }
  .ab-receptiva-sem-dados > button { margin-left: auto; }
}
.ab-telefonia { position: relative; display: flex; align-items: center; gap: 8px; flex: 0 1 390px; min-width: 0; padding: 7px 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); color: var(--text-primary); font-size: 12px; }
.ab-telefonia[hidden], .ab-telefonia [hidden] { display: none; }
.ab-telefonia::before { content: ''; flex: 0 0 8px; height: 8px; border-radius: 50%; background: #d97706; }
.ab-telefonia.is-disponivel::before { background: #16a34a; }
.ab-telefonia.is-ligacao::before { background: #2563eb; }
.ab-telefonia.is-perdido::before { background: #dc2626; }
.ab-telefonia-texto { min-width: 0; flex: 1; overflow-wrap: anywhere; }
.ab-telefonia-tempo { white-space: nowrap; color: var(--text-secondary); }
.ab-telefonia-btn, .ab-telefonia-opcao { font: inherit; color: inherit; cursor: pointer; }
.ab-telefonia-btn { flex: 0 0 auto; padding: 6px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); }
.ab-telefonia-btn:disabled { opacity: .55; cursor: default; }
.ab-telefonia-btn:focus-visible, .ab-telefonia-opcao:focus-visible { outline: 2px solid var(--blue-bright, #2563eb); outline-offset: 2px; }
.ab-telefonia-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 150; width: 280px; max-width: calc(100vw - 40px); max-height: 280px; overflow-y: auto; padding: 6px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); box-shadow: 0 8px 24px rgba(15,23,42,.18); }
.ab-telefonia-opcao { display: block; width: 100%; padding: 9px; border: 0; border-radius: 6px; background: transparent; text-align: left; }
.ab-telefonia-opcao:hover { background: var(--bg-input); }
.ab-telefonia-aviso { padding: 9px; color: var(--text-secondary); }
.ab-main > .ab-telefonia { flex: 0 0 auto; align-self: flex-end; width: calc(100% - 40px); max-width: 390px; margin: 10px 20px 0; box-sizing: border-box; }
@media (max-width: 640px) {
  .ab-main > .ab-telefonia { max-width: none; }
}
#abLigacaoModal.ab-ramal-no-modal > .ab-ligacao-telefonia-slot { flex-shrink: 0; padding: 12px 20px 4px; background-color: #f1f5f9; border-bottom: 0; }
#abLigacaoBar { flex-shrink: 0; gap: 12px; flex-wrap: wrap; }
#abLigacaoBar .ab-callbar-left { flex: 0 1 auto; min-width: 0; gap: 12px; flex-wrap: wrap; }
#abLigacaoBar .ab-discar-status { color: #475569; font-size: 13px; }
#abLigacaoBar .ab-discar-status.ok { color: #166534; }
#abLigacaoBar .ab-discar-status.erro { color: #b91c1c; }
#abLigacaoBar .ab-callbar-cnpj { max-width: 100%; box-sizing: border-box; }
#abLigacaoBar [hidden] { display: none; }

/* A mesma ficha do Relacionamento, com atendimento na barra do telefone.
   Os hosts sao movidos, nunca copiados: pausa e chamada continuam com um unico dono. */
#abLigacaoModal.ab-atendimento-integrado { width: min(1060px, calc(100vw - 40px)); max-width: 1060px; height: min(800px, calc(100dvh - 40px)); max-height: calc(100dvh - 40px); display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto auto minmax(0, 1fr); overflow: hidden; }
.ab-atendimento-integrado > .call-modal-header { grid-column: 1 / -1; }
.ab-atendimento-integrado > .ab-ligacao-telefonia-slot { grid-column: 1 / -1; padding: 12px 20px 4px; background-color: #f1f5f9; border-bottom: 0; }
.ab-ligacao-telefonia-slot .ab-telefonia { max-width: none; border: 0; padding: 0; border-radius: 0; background-color: transparent; font-size: 13px; }
.ab-ligacao-telefonia-slot .ab-telefonia-menu { z-index: 5; }
.ab-atendimento-integrado > .ab-lig-tabs { grid-column: 1; grid-row: 4; }
.ab-atendimento-integrado > .call-bar { grid-column: 1 / -1; grid-row: 3; }
.ab-atendimento-integrado > .call-modal-body { grid-column: 1; grid-row: 5; min-height: 0; overflow: auto; }
.ab-atendimento-integrado > .ab-lig-timeline-pane { grid-column: 1; grid-row: 5; min-height: 0; overflow: auto; }
#abLigacaoBar .ab-ligacao-recepcao-slot { flex: 1 1 320px; min-width: 0; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) { position: static; max-width: none; width: 100%; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; border: 0; border-radius: 0; box-shadow: none; padding: 0; background: transparent; color: #0f172a; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-titulo,
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-numero,
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-campanha { display: none; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-estado { margin: 0; font-size: 13px; font-weight: 600; color: #475569; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-em_atendimento .fw-recepcao-estado { display: flex; align-items: center; gap: 8px; color: #166534; }
#abLigacaoBar .fw-recepcao-em_atendimento .fw-recepcao-estado::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #16a34a; }
#abLigacaoBar .fw-recepcao-em_atendimento .fw-recepcao-detalhe { display: none; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-duracao { margin: 0; white-space: nowrap; font-size: 13px; font-weight: 600; color: #0f172a; font-variant-numeric: tabular-nums; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-detalhe { margin: 0; font-size: 13px; color: #475569; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-erro { flex-basis: 100%; margin: 0; font-size: 12px; color: #b91c1c; }
#abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-acoes { display: flex; gap: 8px; margin: 0 0 0 auto; }
#abLigacaoBar .fw-recepcao-btn.call-bar-hangup { height: 32px; min-height: 32px; padding: 0 16px; border: 0; border-radius: 8px; background-color: #dc2626; color: #fff; font-size: 13px; font-weight: 600; box-shadow: none; }
#abLigacaoBar .fw-recepcao-btn.call-bar-hangup:hover:not(:disabled) { background-color: #b91c1c; }
#abLigacaoBar .fw-recepcao-btn.call-bar-hangup:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
#abLigacaoBar .fw-recepcao-btn.call-bar-hangup:disabled { opacity: .55; cursor: default; }
.fw-recepcao-btn-confirmar { background: #2563eb; color: #fff; width: 100%; }
/* Tabulacao humana com o mesmo componente central do Relacionamento. O rodape
   fica fora da grade rolavel para a confirmacao nunca desaparecer no celular. */
.fw-recepcao-host.ab-tabulacao-overlay { position: fixed; inset: 0; z-index: 100000; width: auto; max-width: none; padding: 20px; box-sizing: border-box; }
.ab-tabulacao-overlay .ab-tabulacao-card { display: flex; flex-direction: column; width: 100%; max-width: 520px; max-height: calc(100dvh - 40px); box-sizing: border-box; overflow: hidden; padding: 24px; border: 1px solid var(--border); border-radius: 12px; background-color: var(--bg-card); box-shadow: 0 24px 60px rgba(15,23,42,.24); }
.ab-tabulacao-card > * { flex-shrink: 0; }
/* Ramal desconectado com o cartao do CRM aberto (07/10/2026): a camada da tabulacao cobria a barra e
   o Reconectar ficava inalcancavel. So no estado desconectado a barra sobe acima da camada. */
#abLigacaoModal .ab-telefonia.is-perdido { position: relative; z-index: 100001; }
.ab-tabulacao-card .fw-recepcao-titulo { font-size: 18px; color: var(--text-primary); }
.ab-tabulacao-card .tab-sub { font-size: 13px; color: var(--text-secondary); margin: 4px 0 16px; }
.ab-tabulacao-card .fw-recepcao-estado { align-self: flex-start; font-size: 12px; color: var(--text-secondary); margin: 0 0 12px; padding: 4px 8px; background-color: var(--bg-input); border-radius: 8px; }
.ab-tabulacao-card .fw-recepcao-numero, .ab-tabulacao-card .fw-recepcao-duracao, .ab-tabulacao-card .fw-recepcao-campanha, .ab-tabulacao-card .fw-recepcao-detalhe { font-size: 12px; color: var(--text-secondary); }
.ab-tabulacao-card .fw-recepcao-detalhe { margin-bottom: 0; }
/* De quem e a ligacao (05/11/2026): empresa e CNPJ acima do telefone, para saber o que se tabula. */
.ab-tabulacao-card .fw-recepcao-empresa { display: flex; flex-direction: column; gap: 2px; margin: 0 0 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background-color: var(--bg-input); }
.ab-tabulacao-card .fw-recepcao-empresa-nome { font-size: 14px; font-weight: 600; color: var(--text-primary); overflow-wrap: anywhere; }
.ab-tabulacao-card .fw-recepcao-empresa-cnpj { font-size: 12px; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.ab-tabulacao-card .ab-tabulacao-opcoes { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 16px; padding: 4px; }
/* Categorias da gestao como titulos (09/10/2026): cada grupo ocupa a linha inteira da grade. */
/* Categoria primeiro, resultado depois (09/10/2026). */
.ab-tabulacao-card .ab-tab-passo { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; margin: 0 0 2px 2px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.ab-tabulacao-card .ab-tab-voltar { min-height: 32px; padding: 4px 10px; border: 1px solid var(--border); border-radius: 8px; font-size: 12px; font-weight: 600; color: #2563eb; background-color: var(--bg-card); cursor: pointer; }
.ab-tabulacao-card .ab-tab-voltar:hover:not(:disabled) { border-color: #2563eb; }
.ab-tabulacao-card .ab-tab-voltar:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ab-tabulacao-card .ab-tab-cat-nome { color: var(--text-primary); }
.ab-tabulacao-card .ab-tab-grupo { grid-column: 1 / -1; }
.ab-tabulacao-card .ab-tab-grupo + .ab-tab-grupo { margin-top: 4px; }
.ab-tabulacao-card .ab-tab-grupo-tit { margin: 0 0 6px 2px; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text-secondary); }
.ab-tabulacao-card .ab-tab-grupo-bts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ab-tabulacao-card .tab-btn { min-height: 48px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; font-size: 13px; font-weight: 600; text-align: center; color: var(--text-primary); background-color: var(--bg-input); }
.ab-tabulacao-card .tab-btn:hover:not(:disabled), .ab-tabulacao-card .tab-btn[aria-pressed="true"] { border-color: #2563eb; color: #2563eb; background-color: var(--bg-card); }
.ab-tabulacao-card .tab-btn:active:not(:disabled) { transform: translateY(1px); }
.ab-tabulacao-card .tab-btn:focus-visible, .ab-tabulacao-card .fw-recepcao-btn-confirmar:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ab-tabulacao-card .ab-tabulacao-rodape { padding-top: 16px; margin-top: 12px; border-top: 1px solid var(--border); }
.ab-tabulacao-card .fw-recepcao-btn-confirmar { min-height: 48px; padding: 12px; border-radius: 12px; font-size: 13px; font-weight: 600; background-color: #2563eb; color: #fff; }
.ab-tabulacao-card .fw-recepcao-btn-confirmar:hover:not(:disabled) { filter: brightness(.92); }
.ab-tabulacao-card .fw-recepcao-btn-confirmar:active:not(:disabled) { transform: translateY(1px); }
.ab-tabulacao-card button:disabled { opacity: .55; cursor: default; }
@media (max-width: 420px) {
  .fw-recepcao-host.ab-tabulacao-overlay { padding: 12px; }
  .ab-tabulacao-overlay .ab-tabulacao-card { padding: 16px; max-height: calc(100dvh - 24px); }
  .ab-tabulacao-card .ab-tabulacao-opcoes, .ab-tabulacao-card .ab-tab-grupo-bts { grid-template-columns: 1fr; }
}
.ab-ligacao-telefonia-slot[hidden], .ab-ligacao-recepcao-slot[hidden] { display: none; }
.fw-recepcao-controles { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; flex-basis: 100%; }
.fw-recepcao-volume { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.fw-recepcao-volume-range { width: 110px; accent-color: #2563eb; }
.fw-recepcao-teclado { display: grid; grid-template-columns: repeat(3, 40px); gap: 6px; }
.fw-recepcao-destinos { max-width: 180px; border: 1px solid #cbd5e1; border-radius: 8px; padding: 8px; background: #fff; color: #0f172a; }
@media (max-width: 800px) {
  #abLigacaoModal.ab-atendimento-integrado { width: calc(100vw - 16px); min-width: 0; height: calc(100dvh - 16px); max-height: none; display: flex; flex-direction: column; overflow-y: auto; overflow-x: hidden; }
  .ab-atendimento-integrado > .call-modal-body { flex: 0 0 auto; flex-direction: column; overflow: visible; min-width: 0; }
  .ab-atendimento-integrado .call-modal-left, .ab-atendimento-integrado .call-modal-right { flex: 0 0 auto; width: auto; min-width: 0; overflow: visible; }
  .ab-atendimento-integrado > .call-modal-header, .ab-atendimento-integrado > .ab-lig-tabs, .ab-atendimento-integrado > .ab-ligacao-telefonia-slot { flex-shrink: 0; }
  .ab-atendimento-integrado .call-modal-title { min-width: 0; overflow-wrap: anywhere; }
  #abLigacaoBar .ab-ligacao-recepcao-slot { flex-basis: 100%; }
  #abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao { gap: 8px; }
  #abLigacaoBar .fw-recepcao-host:not(.ab-tabulacao-overlay) .fw-recepcao-duracao { font-size: 12px; }
  .ab-ligacao-telefonia-slot .ab-telefonia-menu { max-width: calc(100vw - 60px); }
}

/* -- MODAL DE LIGACAO: estrutura e identidade (Etapa 1, 01/10/2026) --------------------------
   Tudo preso a #abLigacaoModal: _calls.css e features/_abertura*.css sao compartilhados com
   index/c6pay e nao mudam. Fundo neutro (sem a barra preta), um bloco so de telefonia (slot
   do ramal + #abLigacaoBar), botoes de 32 px com a mesma tipografia, azul so na acao
   principal, vermelho so no encerrar. Cores da R3/R5 do docs/DESIGN.md, sem rgba em texto. */
#abLigacaoModal .call-modal-header { gap: 12px; padding: 12px 20px; background-color: var(--bg-card); border-bottom: 1px solid #e2e8f0; }
#abLigacaoModal .call-modal-title { min-width: 0; align-items: flex-start; gap: 12px; color: #0f172a; }
#abLigacaoModal .call-modal-title > svg { flex-shrink: 0; margin-top: 2px; color: #475569; }
#abLigacaoModal .ab-lig-titulo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
#abLigacaoModal .ab-lig-titulo-linha { font-size: 14px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-cnpj-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 12px; font-weight: 400; color: #475569; font-variant-numeric: tabular-nums; cursor: text; user-select: text; -webkit-user-select: text; }
#abLigacaoModal .ab-lig-cnpj-head[hidden] { display: none; }
#abLigacaoModal .ab-lig-cnpj-copy { padding: 2px 6px; border: 1px solid #dbe3ef; border-radius: 5px; background: transparent; color: #2563eb; font: inherit; cursor: pointer; user-select: none; }
#abLigacaoModal .ab-lig-cnpj-copy:hover { background: #eff6ff; }
#abLigacaoModal .ab-lig-cnpj-copy:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
#abLigacaoModal .ab-lig-razao-copy { margin-left: 8px; font-size: 12px; font-weight: 500; vertical-align: middle; }
#abLigacaoModal .ab-lig-razao-copy[hidden] { display: none; }
.ab-lig-copy-fallback { position: fixed; top: 0; left: 0; opacity: 0; pointer-events: none; }
#abLigacaoModal .call-modal-actions { flex-shrink: 0; gap: 8px; }
#abLigacaoModal .ab-btn-ghost-x { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 1px solid transparent; border-radius: 8px; color: #475569; font-size: 20px; }
#abLigacaoModal .ab-btn-ghost-x:hover { background-color: #f1f5f9; color: #0f172a; }
#abLigacaoModal .ab-btn-ghost-x:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
/* Ver card do cliente / Voltar à ligação (09/10/2026). */
#abLigacaoModal .ab-lig-ver-card svg { width: 16px; height: 16px; }
.ab-lig-voltar { position: fixed; left: 50%; bottom: 24px; z-index: 299; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 20px; border: 0; border-radius: 999px; background-color: #16a34a; color: #ffffff; font-family: inherit; font-size: 14px; font-weight: 600; cursor: pointer; box-shadow: 0 10px 30px rgba(22,163,74,.35); }
.ab-lig-voltar svg { width: 16px; height: 16px; }
.ab-lig-voltar:hover { background-color: #15803d; }
.ab-lig-voltar:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ab-lig-voltar[hidden] { display: none; }

/* Bloco de telefonia: ramal em cima, telefone/estado/duracao/acao embaixo, mesmo fundo. */
#abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia-btn { height: 32px; padding: 0 12px; border: 1px solid #e2e8f0; border-radius: 8px; background-color: #ffffff; color: #0f172a; font-size: 13px; font-weight: 600; }
#abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia-btn:hover:not(:disabled) { border-color: #2563eb; color: #2563eb; }
#abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia-btn:active:not(:disabled) { transform: translateY(1px); }
#abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia-tempo { color: #475569; }
#abLigacaoModal #abLigacaoBar { align-items: center; padding: 8px 20px 12px; background-color: #f1f5f9; border-bottom: 1px solid #e2e8f0; }
#abLigacaoModal:not(.ab-ramal-no-modal) #abLigacaoBar { padding-top: 12px; }
#abLigacaoModal #abLigacaoBar .ab-callbar-label { color: #475569; font-size: 13px; font-weight: 600; }
#abLigacaoModal #abLigacaoBar .ab-callbar-cnpj { width: 200px; height: 32px; padding: 0 12px; border: 1px solid #e2e8f0; border-radius: 8px; background-color: #ffffff; color: #0f172a; font-family: inherit; font-size: 13px; letter-spacing: normal; font-variant-numeric: tabular-nums; }
#abLigacaoModal #abLigacaoBar .ab-callbar-cnpj:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px #bfdbfe; }
#abLigacaoModal #abLigacaoBar .ab-callbar-cnpj::placeholder { color: #667085; }
#abLigacaoModal #abLigacaoBar .call-bar-timer { color: #0f172a; font-size: 13px; font-weight: 600; }
#abLigacaoModal #abLigacaoBar .ab-discar-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 32px; margin-left: auto; padding: 0 16px; border: 0; border-radius: 8px; background-color: #2563eb; color: #ffffff; font-size: 13px; font-weight: 600; line-height: 1; }
#abLigacaoModal #abLigacaoBar .ab-discar-btn:hover:not(:disabled) { background-color: #1d4ed8; }
#abLigacaoModal #abLigacaoBar .ab-discar-btn.desligar { background-color: #dc2626; }
#abLigacaoModal #abLigacaoBar .ab-discar-btn.desligar:hover:not(:disabled) { background-color: #b91c1c; }
#abLigacaoModal #abLigacaoBar .ab-discar-btn:active:not(:disabled) { transform: translateY(1px); }
#abLigacaoModal #abLigacaoBar .ab-discar-btn:disabled { opacity: .55; cursor: default; }
#abLigacaoModal #abLigacaoBar .ab-discar-btn:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }

/* Abas neutras (eram a faixa escura #11151d de pages/abertura.css). */
#abLigacaoModal .ab-lig-tabs { gap: 4px; padding: 0 20px; background-color: var(--bg-card); border-bottom: 1px solid #e2e8f0; }
#abLigacaoModal .ab-lig-tab { padding: 12px; color: #475569; font-size: 13px; font-weight: 600; }
#abLigacaoModal .ab-lig-tab:hover { color: #0f172a; }
#abLigacaoModal .ab-lig-tab.active { color: #2563eb; border-bottom-color: #2563eb; }
#abLigacaoModal .ab-lig-tab:focus-visible { outline: 2px solid #2563eb; outline-offset: -2px; border-radius: 8px 8px 0 0; }

/* Coluna esquerda: Cliente (resumo + dados completos), depois os conteineres do historico. */
#abLigacaoModal .call-modal-left { padding: 16px 20px; border-right-color: #e2e8f0; }
#abLigacaoModal .call-modal-section-title { margin-bottom: 8px; color: #667085; font-size: 11px; font-weight: 600; letter-spacing: .06em; }
#abLigacaoModal .ab-lig-sec { margin-bottom: 16px; }
#abLigacaoModal .ab-lig-sec[hidden] { display: none; }
#abLigacaoModal .ab-lig-sec ~ .ab-lig-sec { padding-top: 16px; border-top: 1px solid #e2e8f0; }
/* Socios abrem a coluna (21/10/2026): enquanto ocultos (sem quadro ou carregando), o Cliente e o primeiro visivel e fica sem a linha de cima. */
#abLigacaoModal #abLigacaoSocios[hidden] + .ab-lig-sec { padding-top: 0; border-top: 0; }
#abLigacaoModal .ab-lig-resumo[hidden] { display: none; }
#abLigacaoModal .ab-lig-resumo-razao { color: #0f172a; font-size: 14px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
/* Faixa etaria do dono ao lado da razao social (08/10/2026): selo azul da marca, em destaque. */
#abLigacaoModal .ab-lig-resumo-topo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
#abLigacaoModal .ab-lig-resumo-idade { flex: 0 0 auto; padding: 2px 10px; border-radius: 999px; background-color: #2563eb; color: #ffffff; font-size: 12px; font-weight: 700; line-height: 1.5; white-space: nowrap; }
#abLigacaoModal .ab-lig-resumo-idade[hidden] { display: none; }
#abLigacaoModal .ab-lig-resumo-meta { margin-top: 4px; color: #475569; font-size: 13px; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-resumo-sit { font-weight: 600; }
#abLigacaoModal .ab-lig-resumo-sit.is-ativa { color: #166534; }
#abLigacaoModal .ab-lig-resumo-sit.is-inativa { color: #b91c1c; }
#abLigacaoModal .ab-lig-dados { margin-top: 8px; }
#abLigacaoModal .ab-lig-dados > .call-modal-info-grid { margin-top: 8px; }
#abLigacaoModal .call-modal-info-label { color: #667085; font-size: 11px; font-weight: 600; }
#abLigacaoModal .call-modal-info-value { overflow-wrap: anywhere; }

/* Coluna direita: o formulario nao muda; o rodape de salvar fica preso ao pe da rolagem,
   com um respiro do mesmo fundo para nunca encostar (nem cobrir) o ultimo campo. */
#abLigacaoModal .call-modal-right { padding: 16px 20px 0; }
#abLigacaoModal .call-modal-right > .call-btn-finalizar { bottom: 16px; height: 40px; margin: 16px 0; border-radius: 8px; background-color: #2563eb; font-size: 13px; font-weight: 600; box-shadow: 0 16px 0 0 var(--bg-card), 0 -12px 0 0 var(--bg-card); }
#abLigacaoModal .call-modal-right > .call-btn-finalizar:hover:not(:disabled) { opacity: 1; background-color: #1d4ed8; }
#abLigacaoModal .call-modal-right > .call-btn-finalizar:active:not(:disabled) { transform: translateY(1px); }
#abLigacaoModal .call-modal-right > .call-btn-finalizar:disabled { opacity: .55; cursor: default; }
#abLigacaoModal .call-modal-right > .call-btn-finalizar:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
#abLigacaoModal .ab-toggle-btn:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
#abLigacaoModal .call-input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px #bfdbfe; }
/* Foco por teclado (Etapa 4, passo zero): o navegador rola ate o elemento focado, mas sem saber
   do Salvar preso ao pe. scroll-padding-bottom tira do "visivel" a faixa do Salvar (40 px + 16 de
   distancia do pe + o respiro de 12 do box-shadow) com folga, no conteiner que rola: a coluna
   direita no desktop (o corpo, quando e ele quem rola) e o proprio modal ate 800 px. */
#abLigacaoModal .call-modal-right, #abLigacaoModal > .call-modal-body { scroll-padding-bottom: 80px; }

/* Ate 800 px: uma coluna so, o modal rola inteiro e nada passa da largura da tela. */
@media (max-width: 800px) {
  #abLigacaoModal { width: calc(100vw - 16px); max-width: none; min-width: 0; height: calc(100dvh - 16px); max-height: none; overflow-x: hidden; overflow-y: auto; }
  #abLigacaoModal > * { flex-shrink: 0; }
  #abLigacaoModal .call-modal-header { padding: 12px 16px; }
  #abLigacaoModal.ab-ramal-no-modal > .ab-ligacao-telefonia-slot, #abLigacaoModal.ab-atendimento-integrado > .ab-ligacao-telefonia-slot { padding: 12px 16px 4px; }
  #abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia { flex-wrap: wrap; }
  #abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia-texto { flex: 1 1 calc(100% - 16px); }
  #abLigacaoModal #abLigacaoBar { padding: 8px 16px 12px; }
  #abLigacaoModal #abLigacaoBar .ab-callbar-left { flex: 1 1 100%; }
  #abLigacaoModal #abLigacaoBar .ab-callbar-cnpj { flex: 1 1 160px; width: auto; }
  #abLigacaoModal .ab-lig-tabs { padding: 0 16px; }
  #abLigacaoModal > .call-modal-body { flex: 0 0 auto; flex-direction: column; overflow: visible; min-width: 0; }
  #abLigacaoModal .call-modal-left, #abLigacaoModal .call-modal-right { flex: 0 0 auto; width: auto; min-width: 0; overflow: visible; padding-left: 16px; padding-right: 16px; }
  #abLigacaoModal .call-modal-left { border-right: 0; border-bottom: 1px solid #e2e8f0; }
  #abLigacaoModal .call-modal-info-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

/* -- BARRA COMPACTA E ESTADOS DA TELEFONIA (Etapa 2, 01/10/2026) -----------------------------
   "Detalhes" do ramal: rotulo curto na linha, explicacao completa so quando a pessoa abre.
   Fica fora de #abLigacaoModal de proposito: o MESMO no (#abTelefoniaStatus) vive no cabecalho
   da pagina quando o modal esta fechado, e este arquivo so e carregado pelo abertura.html. */
.ab-telefonia-texto { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; row-gap: 4px; }
.ab-telefonia-rotulo { min-width: 0; overflow-wrap: anywhere; }
.ab-telefonia-detalhes[hidden] { display: none; }
.ab-telefonia-detalhes[open] { flex-basis: 100%; }
.ab-telefonia-detalhes-sum { display: inline-block; padding: 0 4px; border-radius: 8px; color: #2563eb; font-size: 12px; font-weight: 600; cursor: pointer; list-style: none; }
.ab-telefonia-detalhes-sum::-webkit-details-marker { display: none; }
.ab-telefonia-detalhes-sum:hover { text-decoration: underline; }
.ab-telefonia-detalhes-sum:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ab-telefonia-explica { display: block; margin-top: 4px; color: #475569; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }

/* RAMAL NO MODAL SO COM A BOLINHA (09/10/2026): "Ramal 1095 · Disponível para chamadas" /
   "· Ligação em andamento" saem da linha — a cor da bolinha ja diz o estado e o texto vai para o
   title (telefonia-status.js). Aviso e falha (bolinha ambar/vermelha) mantem o texto: ali ele
   diz o que fazer. O estado da LIGACAO aparece uma vez so, na barra do telefone ("Chamando o
   cliente…", "Em ligação."), que e aria-live. */
#abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia:is(.is-disponivel, .is-ligacao) .ab-telefonia-rotulo { display: none; }
#abLigacaoModal .ab-ligacao-telefonia-slot .ab-telefonia:is(.is-disponivel, .is-ligacao) .ab-telefonia-texto { flex: 0 0 auto; }
/* Nunca dois Desligar nem dois cronometros: com a tela de chamada RECEBIDA mostrando o dela
   (na barra ou fora do modal), o Desligar e a duracao da SAIDA saem da tela. O estado deles
   nao muda; so a apresentacao. */
body:has(#fwRecepcaoHost:not([hidden]) .fw-recepcao-btn-desligar) #abLigacaoModal #abDiscarBtn,
body:has(#fwRecepcaoHost:not([hidden]) .fw-recepcao-duracao) #abLigacaoModal #abDiscarDuracao { display: none; }
/* Desktop: ramal (bolinha + Pausar) e barra do telefone numa linha so, em qualquer estado do
   ramal (09/10/2026; antes so em ligacao). O modal vira grade de duas colunas; o resto ocupa a
   largura toda. Ate 800 px continua empilhado. */
@media (min-width: 801px) {
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto auto minmax(0, 1fr); }
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) > * { grid-column: 1 / -1; min-height: 0; }
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) > .call-modal-header { grid-row: 1; }
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) > #abLigacaoTelefoniaSlot { grid-column: 1; grid-row: 2; display: flex; align-items: center; padding: 12px 0 12px 20px; border-bottom: 1px solid #e2e8f0; }
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) > #abLigacaoBar { grid-column: 2; grid-row: 2; padding: 12px 20px 12px 16px; }
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) > .ab-lig-tabs { grid-row: 3; }
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) > .call-modal-body,
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) > .ab-lig-timeline-pane { grid-row: 4; overflow: auto; }
  #abLigacaoModal:has(> #abLigacaoTelefoniaSlot:not([hidden]) > .ab-telefonia:not([hidden])) .ab-telefonia-rotulo { white-space: nowrap; }
}
/* Encerrada: "Ligação encerrada · Duração 00:00" lidos juntos. */
#abLigacaoModal #abLigacaoBar #abDiscarStatus[data-fase="encerrada"] { color: #475569; font-weight: 600; }
#abLigacaoModal #abLigacaoBar #abDiscarStatus[data-fase="encerrada"]:not(:empty) + #abDiscarDuracao:not([hidden])::before { content: "· "; margin-left: -8px; color: #667085; font-weight: 400; }
/* "Detalhes" aberto quebra a linha: o ponto de estado acompanha a primeira linha, nao o meio. */
.ab-telefonia:has(.ab-telefonia-detalhes[open])::before { align-self: flex-start; margin-top: 5px; }

/* -- ULTIMAS LIGACOES (Etapa 3, 01/10/2026) ----------------------------------------------------
   Coluna esquerda do modal: data/hora e consultor; tabulacao e duracao; "Ouvir" so quando o
   servidor autoriza. As linhas usam .ab-lead-lig (o abLigOuvir acha o player por ela); o
   desenho de pagina dessa classe (pages/_abertura-padrao.css) e reposto aqui so dentro do modal. */
#abLigacaoModal .ab-lig-ult-aviso { margin: 0; color: #475569; font-size: 13px; }
#abLigacaoModal .ab-lig-ult-aviso.is-erro { color: #b91c1c; }
#abLigacaoModal .ab-lig-ult-lista { margin: 0; padding: 0; list-style: none; }
#abLigacaoModal .ab-lig-ult-item { margin: 0; padding: 4px 0 4px 12px; border-left: 2px solid #e2e8f0; }
#abLigacaoModal .ab-lig-ult-item + .ab-lig-ult-item { margin-top: 12px; }
#abLigacaoModal .ab-lig-ult-item[hidden] { display: none; }
#abLigacaoModal .ab-lig-ult-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
#abLigacaoModal .ab-lig-ult-quando { color: #475569; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
#abLigacaoModal .ab-lig-ult-quem { min-width: 0; color: #0f172a; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-ult-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; color: #475569; font-size: 12px; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-ult-meta > span { min-width: 0; }
#abLigacaoModal .ab-lig-ult-item .ab-lead-lig-acoes { margin-top: 8px; }
#abLigacaoModal .ab-lig-ult-item .ml-ouvir { height: 28px; padding: 0 12px; border: 1px solid #e2e8f0; border-radius: 8px; background-color: #ffffff; color: #2563eb; font-size: 12px; font-weight: 600; }
#abLigacaoModal .ab-lig-ult-item .ml-ouvir:hover:not(:disabled) { border-color: #2563eb; background-color: #ffffff; }
#abLigacaoModal .ab-lig-ult-item .ml-ouvir:active:not(:disabled) { transform: translateY(1px); }
#abLigacaoModal .ab-lig-ult-item .ml-ouvir:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
#abLigacaoModal .ab-lig-ult-item .ml-ouvir:disabled { opacity: .55; cursor: default; }
#abLigacaoModal .ab-lig-ult-item .ab-lead-lig-player:not(:empty) { margin-top: 8px; }
/* Linha clicavel (09/10/2026, so no bloco "Ultima ligacao" — a lista da aba Timeline nao leva
   esta classe): clicar em qualquer ponto toca/para, sem precisar acertar o botao "Ouvir". */
#abLigacaoModal .ab-lig-ult-item.ab-lig-ult-clicavel { cursor: pointer; border-radius: 6px; }
#abLigacaoModal .ab-lig-ult-item.ab-lig-ult-clicavel:hover { background-color: #f8fafc; }
#abLigacaoModal .ab-lig-ult-item.ab-lig-ult-clicavel:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
/* Aba Timeline (08/10/2026): Atividades (desenho da janela Historico de Status) e todas as ligacoes. */
#abLigacaoModal .ab-lig-tl-titulo { margin: 0 0 8px; color: #667085; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
#abLigacaoModal .ab-lig-tl-ativ + .ab-lig-tl-titulo, #abLigacaoModal .ab-note-11 + .ab-lig-tl-titulo { margin-top: 20px; padding-top: 12px; border-top: 1px solid #e2e8f0; }
#abLigacaoModal .ab-lig-timeline-pane .ab-note-11 { margin: 4px 0; color: #475569; font-size: 13px; }
#abLigacaoModal .ab-lig-timeline-pane .ab-note-11.is-erro { color: #b91c1c; }
#abLigacaoModal .ab-lig-ult-resumo { margin-top: 6px; color: #0f172a; font-size: 13px; line-height: 1.5; }
#abLigacaoModal .ab-lig-ult-item details { margin-top: 4px; font-size: 12px; }
#abLigacaoModal .ab-lig-ult-item summary { color: #2563eb; font-weight: 600; cursor: pointer; }
#abLigacaoModal .ab-lig-ult-txt { margin-top: 4px; color: #475569; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 300px; overflow-y: auto; }
/* Ate 800 px o modal rola inteiro numa coluna so, e a coluna esquerda (agora com as ultimas
   ligacoes) empurra o formulario para baixo da dobra: o Salvar grudado no pe da coluna direita
   sumia na abertura. Ele passa a ficar preso ao pe da tela do modal (o overlay e fixo e do
   tamanho da tela), com o mesmo respiro, e a coluna direita ganha folga embaixo para o ultimo
   campo nunca ficar sob ele. */
@media (max-width: 800px) {
  #abLigacaoModal .call-modal-right { padding-bottom: 80px; }
  #abLigacaoModal .call-modal-right > .call-btn-finalizar { position: fixed; left: 24px; right: 24px; bottom: 24px; z-index: 2; width: auto; margin: 0; }
  /* Aqui quem rola e o modal; o Salvar fixo ocupa os ultimos 56 px dele (+ respiro). */
  #abLigacaoModal { scroll-padding-bottom: 88px; }
}

/* -- ATIVIDADES RECENTES e COMENTARIOS (Etapa 4, 01/10/2026) ----------------------------------
   Coluna esquerda do modal, no mesmo desenho das Ultimas ligacoes: linha com borda a esquerda,
   rotulo/autor em 13/600, data e quem em 12, texto escrito pela pessoa em 13. Acoes como link
   azul ("Ver historico completo", "Ver todos", "Apagar") e "Comentar" como botao secundario:
   o azul cheio fica so no "Salvar e abrir lead", a acao principal do modal. */
#abLigacaoModal .ab-lig-aviso { margin: 0; color: #475569; font-size: 13px; }
#abLigacaoModal .ab-lig-aviso.is-erro { color: #b91c1c; }
/* Comentarios no formulario (08/10/2026): a lista fica entre o rotulo e o campo. */
#abLigacaoModal .ab-lig-com-sec { margin-bottom: 8px; }
/* Quadro societario do modal (08/10/2026): nome, qualificacao e entrada, como no card da pagina. */
#abLigacaoModal .ab-lig-socio-item { margin: 0; padding: 4px 0 4px 12px; border-left: 2px solid #e2e8f0; }
#abLigacaoModal .ab-lig-socio-item + .ab-lig-socio-item { margin-top: 8px; }
#abLigacaoModal .ab-lig-socio-nome { color: #0f172a; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-socio-meta { margin-top: 2px; color: #475569; font-size: 12px; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-com-itens { margin: 0; padding: 0; list-style: none; }
/* Regiao e Fachada empilhadas (09/10/2026; a coluna tem ~300px): mapas do Google embutidos. */
#abLigacaoModal .ab-lig-mapas { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-bottom: 16px; padding-top: 16px; border-top: 1px solid #e2e8f0; }
#abLigacaoModal .ab-lig-mapas[hidden] { display: none; }
#abLigacaoModal .ab-lig-mapas > .ab-lig-sec { margin: 0; padding: 0; border: 0; min-width: 0; }
#abLigacaoModal .ab-lig-mapa-txt { margin-bottom: 6px; line-height: 1.4; color: #475569; font-size: 12px; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-mapa-txt strong { color: #0f172a; font-weight: 600; }
#abLigacaoModal .ab-lig-mapa-frame { display: block; width: 100%; height: 150px; border: 1px solid #e2e8f0; border-radius: 8px; background: #f1f5f9; }
#abLigacaoModal .ab-lig-mapa-link { display: inline-block; margin-top: 6px; color: #1d4ed8; font-size: 12px; font-weight: 600; text-decoration: none; }
#abLigacaoModal .ab-lig-mapa-link:hover { text-decoration: underline; }
#abLigacaoModal .ab-lig-mapa-link:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; border-radius: 4px; }
/* Socios: faixa etaria do dono e quantos socios, em destaque antes da lista. */
#abLigacaoModal .ab-lig-socios-dest { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
#abLigacaoModal .ab-lig-socios-dest-item { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 8px; background: #eff6ff; }
#abLigacaoModal .ab-lig-socios-dest-rot { color: #475569; font-size: 11px; font-weight: 600; letter-spacing: .02em; }
#abLigacaoModal .ab-lig-socios-dest-val { color: #0f172a; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
#abLigacaoModal .ab-lig-rede { margin-top: 14px; }
#abLigacaoModal .ab-lig-rede[hidden] { display: none; }
#abLigacaoModal .ab-lig-rede-tit { margin-bottom: 6px; color: #0f172a; font-size: 12px; font-weight: 600; }
/* Dados da Receita em segundo plano: por ultimo e com texto menor. */
#abLigacaoModal .ab-lig-sec--receita .call-modal-info-grid { font-size: 12px; opacity: .92; }
#abLigacaoModal .ab-lig-com-item { margin: 0; padding: 4px 0 4px 12px; border-left: 2px solid #e2e8f0; }
#abLigacaoModal .ab-lig-com-item + .ab-lig-com-item { margin-top: 12px; }
#abLigacaoModal .ab-lig-com-item[hidden] { display: none; }
#abLigacaoModal .ab-lig-com-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
#abLigacaoModal .ab-lig-com-autor { min-width: 0; color: #0f172a; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-com-quando { color: #475569; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
#abLigacaoModal .ab-lig-com-texto { margin: 4px 0 0; color: #0f172a; font-size: 13px; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; }
#abLigacaoModal .ab-lig-link, #abLigacaoModal .ab-lig-com-apagar { padding: 4px 0; border: 0; border-radius: 8px; background-color: transparent; color: #2563eb; font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
#abLigacaoModal .ab-lig-link { margin-top: 12px; }
#abLigacaoModal .ab-lig-com-apagar { margin-top: 4px; font-size: 12px; }
#abLigacaoModal .ab-lig-link:hover, #abLigacaoModal .ab-lig-com-apagar:hover { text-decoration: underline; }
#abLigacaoModal .ab-lig-link:active, #abLigacaoModal .ab-lig-com-apagar:active { transform: translateY(1px); }
#abLigacaoModal .ab-lig-link:focus-visible, #abLigacaoModal .ab-lig-com-apagar:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
/* Erro da liberacao em uma linha (13/10/2026): mensagem + "Tentar de novo", sem titulo nem telefone. */
.fw-recepcao.fw-recepcao-compacto { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 8px 12px; border-left: 3px solid #dc2626; }
.fw-recepcao-compacto .fw-recepcao-erro { margin: 0; font-size: 13px; color: #b91c1c; }