/* Painel Capta+ — identidade: azul royal #1C32B0, azul escuro #14248A, Montserrat + Inter */
:root {
  --azul: #1C32B0;
  --azul-escuro: #14248A;
  --azul-claro: #EEF1FC;
  --fundo: #F4F5F9;
  --cartao: #FFFFFF;
  --borda: #E3E6EF;
  --borda-forte: #C9CEDD;
  --texto: #14161F;
  --suave: #555B6B;
  --ok: #1E7A46; --ok-fundo: #E8F5EE;
  --alerta: #A33A06; --alerta-fundo: #FDF1EA;
  --pausa: #8A2E07; --pausa-fundo: #FCE7DC;
  --neutro: #4A5060; --neutro-fundo: #EEF0F4;
  --erro: #8F1D1D; --erro-fundo: #FDECEC;
  --campo: #FFFFFF;          /* fundo de campos, botões, chips */
  --linha: #EEF0F5;          /* divisória das tabelas */
  --hover: #F8F9FD;          /* linha da tabela sob o mouse */
  --lista: #F7F8FB;          /* itens das listas da visão geral */
  --titulo: var(--azul-escuro);
  --destaque: var(--azul);   /* links e números em azul */
  --msg-clinica: #FFFFFF; --msg-lead: #DCE6FF; --msg-sistema: #E9EBF2;
  --ultima: #3A3F4D;
  --barra-fundo: #E6E9F4;
  --borda-alerta: #F2C6AE; --fundo-alerta: #FFF9F5; --faq-vazia: #FFFBF8;
  --placeholder: #9AA0AE;
  --menu: var(--azul-escuro);
  --raio: 14px;
  font-size: 15px;
  color-scheme: light;
}
/* Modo escuro (o switch no topo grava a escolha; sem escolha, segue o sistema) */
[data-tema="escuro"] {
  --azul: #4A63E8;
  --azul-escuro: #C3CDFF;
  --azul-claro: #1F2A55;
  --fundo: #0E1120;
  --cartao: #161A2C;
  --borda: #262C44;
  --borda-forte: #363E5C;
  --texto: #E7E9F2;
  --suave: #9CA3B8;
  --ok: #5BD08F; --ok-fundo: #12301F;
  --alerta: #FF9F6B; --alerta-fundo: #3A2014;
  --pausa: #FFA27A; --pausa-fundo: #3B1D10;
  --neutro: #B5BBCB; --neutro-fundo: #232838;
  --erro: #FF9B9B; --erro-fundo: #3A1616;
  --campo: #1B2034;
  --linha: #21263A;
  --hover: #1C2135;
  --lista: #1B2034;
  --titulo: #DCE2FF;
  --destaque: #8FA0FF;
  --msg-clinica: #1E2338; --msg-lead: #263466; --msg-sistema: #232838;
  --ultima: #C5CADB;
  --barra-fundo: #262C44;
  --borda-alerta: #6B3A22; --fundo-alerta: #22170F; --faq-vazia: #221A14;
  --placeholder: #6E768C;
  --menu: #0A0D19;
  color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fundo); color: var(--texto); font-family: Inter, system-ui, sans-serif; line-height: 1.45; }
a { color: var(--destaque); }
a:hover { color: var(--azul-escuro); }
[data-tema="escuro"] a:hover { color: #fff; }
h1, h2 { font-family: Montserrat, sans-serif; color: var(--titulo); margin: 0; }
h1 { font-weight: 800; font-size: 28px; }
h2 { font-weight: 700; font-size: 17px; }
:focus-visible { outline: 3px solid #7C8CF0; outline-offset: 2px; }

/* Estrutura */
.app { display: flex; min-height: 100vh; }
.menu { flex: 0 0 232px; background: var(--menu); color: #fff; padding: 26px 18px; display: flex; flex-direction: column; gap: 28px; position: sticky; top: 0; height: 100vh; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; }
.marca, .marca-login { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 26px; letter-spacing: .5px; color: #fff; text-decoration: none; }
.marca span, .marca-login span { color: #8FA0FF; }
.marca:hover { color: #fff; }
.menu-itens { display: flex; flex-direction: column; gap: 6px; }
.menu-itens a { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 10px; color: #DCE1FA; text-decoration: none; font-weight: 500; }
.menu-itens a:hover { background: rgba(255,255,255,.08); color: #fff; }
.menu-itens a.ativo { background: var(--azul); color: #fff; font-weight: 600; }
.menu-rodape { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; color: #C9D0F5; }
.link-sair { background: none; border: 0; color: #C9D0F5; font: inherit; text-decoration: underline; cursor: pointer; min-height: 36px; }
.conteudo { flex: 1; min-width: 0; padding: 18px 36px 48px; display: flex; flex-direction: column; gap: 12px; }
.pagina { display: flex; flex-direction: column; gap: 22px; }

/* Barra do topo: atualização e modo escuro */
.barra-topo { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-height: 40px; }
.barra-topo-login { position: fixed; top: 14px; right: 18px; }
.atualizado { font-size: 12px; color: var(--suave); }
.botao-icone { width: 36px; height: 36px; border-radius: 10px; border: 1px solid var(--borda-forte); background: var(--campo); color: var(--texto); font-size: 18px; line-height: 1; cursor: pointer; }
.botao-icone:hover { border-color: var(--azul); color: var(--destaque); }
.botao-icone.girando { animation: girar .8s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }
.switch-tema { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 12px 0 8px; border-radius: 20px; border: 1px solid var(--borda-forte); background: var(--campo); color: var(--texto); font: 500 13px Inter, sans-serif; cursor: pointer; }
.switch-tema:hover { border-color: var(--azul); }
.switch-trilho { position: relative; width: 34px; height: 20px; border-radius: 10px; background: var(--borda-forte); transition: background .2s; flex: none; }
.switch-bolinha { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .2s; }
.switch-tema[aria-checked="true"] .switch-trilho { background: var(--azul); }
.switch-tema[aria-checked="true"] .switch-bolinha { transform: translateX(14px); }
.tela-login .switch-tema { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.3); color: #fff; }

.topo { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; }
.sub { margin: 4px 0 0; color: var(--suave); font-size: 14px; }
.filtros, .form-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.form-inline label { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--suave); }
input, select { min-height: 42px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--borda-forte); background: var(--campo); font: 400 14px Inter, sans-serif; color: var(--texto); }
input[type=search] { width: 210px; }

.grupo-botoes, .chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border-radius: 20px; border: 1px solid var(--borda-forte); background: var(--campo); color: var(--texto); text-decoration: none; font-size: 13px; font-weight: 500; }
.chip:hover { border-color: var(--azul); color: var(--destaque); }
.chip-ativo, .chip-ativo:hover { background: var(--azul); border-color: var(--azul); color: #fff; font-weight: 600; }

.botao { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 10px; border: 1px solid var(--borda-forte); background: var(--campo); color: var(--texto); font: 600 14px Inter, sans-serif; cursor: pointer; width: 100%; }
.form-inline .botao { width: auto; }
.botao:hover { border-color: var(--azul); }
.botao-primario { background: var(--azul); border-color: var(--azul); color: #fff; }
[data-tema="escuro"] .botao-primario:hover { background: #3B53D4; }
.botao-primario:hover { background: var(--azul-escuro); }
.botao-ok { color: var(--ok); }
.botao-alerta { color: var(--alerta); }
.botao[disabled] { opacity: .6; cursor: wait; }

/* Cartões e grade */
.grade { display: flex; flex-wrap: wrap; gap: 22px; align-items: flex-start; }
/* Duas colunas lado a lado quando a tela tem largura (monitor); uma embaixo da outra no celular */
.par { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 22px; align-items: start; }
.par-igual { align-items: stretch; }
.cartao { background: var(--cartao); border: 1px solid var(--borda); border-radius: var(--raio); padding: 22px; flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.cartao-largo { flex: 2 1 560px; }
.vazio { color: var(--suave); margin: 0; }
.dica { color: var(--suave); font-size: 13px; margin: 0; }
.forte { font-weight: 600; }
.suave { color: var(--suave); font-size: 13px; }
.bloco { display: block; }
.tel { white-space: nowrap; }
.tabela-leads td:first-child { min-width: 150px; }
.sem-quebra { white-space: nowrap; }

/* Indicadores */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 16px; }
.kpi { background: var(--cartao); border: 1px solid var(--borda); border-radius: var(--raio); padding: 18px 20px; display: flex; flex-direction: column; gap: 4px; }
.kpi-rotulo { font-size: 13px; color: var(--suave); font-weight: 500; }
.kpi-valor { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 34px; color: var(--titulo); line-height: 1.1; }
.kpi-azul .kpi-valor { color: var(--destaque); }
.kpi-alerta { border-color: var(--borda-alerta); background: var(--fundo-alerta); }
.kpi-alerta .kpi-valor { color: var(--alerta); }
.kpi-detalhe { font-size: 13px; color: var(--suave); }

/* Tabelas */
.tabela-rolagem { overflow-x: auto; margin: 0 -6px; }
.tabela { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabela th { text-align: left; color: var(--suave); font-weight: 600; padding: 10px 8px; border-bottom: 1px solid var(--borda); white-space: nowrap; }
.tabela td { padding: 11px 8px; border-bottom: 1px solid var(--linha); vertical-align: top; }
.tabela .num { text-align: right; font-variant-numeric: tabular-nums; }
.tabela-leads { min-width: 780px; }
.prox { min-width: 150px; }
.prox-aguarda { font-weight: 600; color: var(--azul-escuro); }
.prox-pausa { font-weight: 600; color: var(--pausa); }
.prox-neutro { color: var(--suave); }
.tabela-leads tbody tr { cursor: pointer; }
.tabela-leads tbody tr:hover { background: var(--hover); }
.tabela-leads tr.selecionado { background: var(--azul-claro); }
.tabela-leads td a { text-decoration: none; color: var(--texto); }
.ultima { max-width: 280px; color: var(--ultima); }
.barra-linha { display: flex; align-items: center; gap: 10px; min-width: 150px; }
.barra { flex: 1; height: 8px; min-width: 80px; }
.barra-fundo { fill: var(--barra-fundo); }
.barra-valor { fill: var(--azul); }

/* Selos */
.selo { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.selo-ok { color: var(--ok); background: var(--ok-fundo); }
.selo-aguarda { color: var(--azul-escuro); background: var(--azul-claro); }
.selo-alerta { color: var(--alerta); background: var(--alerta-fundo); }
.selo-pausa { color: var(--pausa); background: var(--pausa-fundo); }
.selo-neutro { color: var(--neutro); background: var(--neutro-fundo); }
.selos { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }

/* Listas da visão geral */
.lista-alertas, .lista-hoje { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.lista-alertas a, .lista-hoje a { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border-radius: 10px; background: var(--lista); text-decoration: none; color: var(--texto); }
.lista-alertas a:hover, .lista-hoje a:hover { background: var(--azul-claro); }
.lista-hoje a { align-items: center; }
.alerta-corpo { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.hora { font-family: Montserrat, sans-serif; font-weight: 700; color: var(--azul-escuro); min-width: 52px; }

/* Avisos */
.aviso { margin: 0; padding: 10px 12px; border-radius: 10px; font-size: 14px; }
.aviso-erro { background: var(--erro-fundo); color: var(--erro); }
.aviso-ok { background: var(--ok-fundo); color: var(--ok); }
.aviso-pausa { background: var(--pausa-fundo); color: var(--pausa); }

/* Leads: detalhe e conversa */
.grade-leads > .cartao-largo { padding: 10px 18px 16px; }
.detalhe { flex: 1 1 360px; max-width: 460px; position: sticky; top: 20px; max-height: calc(100vh - 40px); overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; } /* painel fixo do lead: rola sozinho quando é mais alto que a tela */
.detalhe-vazio { min-height: 160px; justify-content: center; text-align: center; }
.detalhe-topo { display: flex; flex-direction: column; gap: 2px; padding-right: 28px; }
.fechar { position: absolute; top: 12px; right: 14px; font-size: 24px; line-height: 1; text-decoration: none; color: var(--suave); padding: 4px 8px; }
.conversa { display: flex; flex-direction: column; gap: 8px; background: var(--fundo); border-radius: 12px; padding: 12px; max-height: 420px; flex-shrink: 0; overflow-y: auto; } /* não espreme quando o painel tem muitos botões */
.msg { max-width: 86%; border-radius: 10px; padding: 7px 10px; font-size: 13.5px; display: flex; flex-direction: column; gap: 2px; white-space: pre-wrap; word-wrap: break-word; }
.msg-clinica { align-self: flex-start; background: var(--msg-clinica); }
.msg-lead { align-self: flex-end; background: var(--msg-lead); }
.msg-auto { opacity: .7; font-style: italic; }
.msg-sistema { align-self: center; font-size: 12px; color: var(--suave); background: var(--msg-sistema); border-radius: 10px; padding: 3px 10px; text-align: center; }
.msg-autor { font-size: 11px; color: var(--suave); font-weight: 600; font-style: normal; }
.acoes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.acoes form { margin: 0; }
.remarcar { border: 1px solid var(--borda); border-radius: 10px; padding: 10px 12px; }
.remarcar summary { cursor: pointer; font-weight: 600; min-height: 28px; }
.form-remarcar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 12px 0 8px; }
.form-remarcar label { min-width: 0; }
.form-remarcar input, .form-remarcar select { width: 100%; min-width: 0; } /* campo de data/hora não estoura a caixa */
.form-remarcar label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--suave); }
.form-remarcar .botao { grid-column: 1 / -1; }

/* Login */
.tela-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--menu); padding: 20px; }
.caixa-login { background: var(--cartao); border-radius: 18px; padding: 34px 30px; width: 100%; max-width: 400px; display: flex; flex-direction: column; gap: 16px; }
.marca-login { color: var(--titulo); font-size: 30px; }
.marca-login span { color: var(--destaque); }
.caixa-login h1 { font-size: 20px; }
.form { display: flex; flex-direction: column; gap: 14px; }
.form label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; }

/* Celular */
@media (max-width: 820px) {
  .app { flex-direction: column; }
  .menu { position: static; height: auto; flex: none; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 12px 16px; gap: 12px; overflow: visible; }
  .menu-itens { flex-direction: row; width: 100%; overflow-x: auto; scrollbar-width: none; } /* faixa que rola de lado, sem alargar a página */
  .menu-itens a { flex: none; white-space: nowrap; }
  .menu-rodape { margin: 0 0 0 auto; }
  .conteudo { padding: 12px 16px 40px; }
  .detalhe { max-width: none; position: relative; top: 0; order: -1; max-height: none; overflow: visible; }
  input[type=search] { width: 160px; }
}

.prox-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-top: 4px; }
.prox-linha p { margin: 0; }
.prox-linha form { margin: 0; }
.botao-pequeno { width: auto; min-height: 36px; padding: 0 12px; font-size: 13px; border-color: var(--azul); color: var(--destaque); }

/* Clínicas */
.botao-auto { width: auto; }
a.botao { text-decoration: none; }
a.botao-primario, a.botao-primario:hover { color: #fff; }
.voltar { font-size: 13px; text-decoration: none; display: inline-block; margin-bottom: 6px; }
.tabela-clinicas { min-width: 760px; }
.tabela-clinicas tbody tr { cursor: pointer; }
.tabela-clinicas tbody tr:hover { background: var(--hover); }
.tabela-clinicas td a { text-decoration: none; color: var(--texto); }
.form-clinica { display: flex; flex-direction: column; gap: 18px; }
.form-clinica label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; }
.form-clinica input:not([type=checkbox]), .form-clinica textarea { width: 100%; }
textarea { padding: 10px 12px; border-radius: 10px; border: 1px solid var(--borda-forte); background: var(--campo); font: 400 14px/1.5 Inter, sans-serif; color: var(--texto); resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--azul); outline-offset: 1px; }
.obrig { color: var(--alerta); }
.form-clinica .marcar { flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 400; cursor: pointer; }
.marcar input { width: 20px; height: 20px; min-height: 0; margin: 2px 0 0; accent-color: var(--azul); flex: none; }
.barra-salvar { display: flex; justify-content: flex-end; }
.pagina > .cartao { flex: none; }
.barra-salvar .botao { min-width: 220px; }

/* WhatsApp da clínica */
h3 { font-family: Montserrat, sans-serif; font-weight: 700; font-size: 15px; color: var(--titulo); margin: 0; }
.linha-botoes { display: flex; flex-wrap: wrap; gap: 10px; }
.linha-botoes form { margin: 0; }
.opcoes-conexao { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.opcao { border: 1px solid var(--borda); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.opcao form { margin: 0; }
.opcao .form-inline label { flex-wrap: wrap; }
.avancado { border: 1px dashed var(--borda-forte); border-radius: 10px; padding: 10px 14px; }
.avancado summary { cursor: pointer; font-size: 14px; color: var(--suave); min-height: 28px; }
.avancado label { margin-top: 10px; }
.cartao-conectar { align-items: center; text-align: center; max-width: 560px; }
.qr { width: 280px; height: 280px; image-rendering: pixelated; border: 1px solid var(--borda); border-radius: 12px; padding: 8px; background: #fff; }
.codigo-pareamento { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 40px; letter-spacing: 6px; color: var(--titulo); margin: 8px 0; }
.passos { text-align: left; margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }

/* FAQ estruturado */
.faq-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.faq-contador { font-size: 13px; font-weight: 700; padding: 4px 12px; border-radius: 14px; color: var(--alerta); background: var(--alerta-fundo); }
.faq-contador.completo { color: var(--ok); background: var(--ok-fundo); }
.faq-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 14px 22px; }
.faq-item label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.faq-item textarea { width: 100%; min-height: 64px; }
.faq-vazia textarea, .faq-vazia .pilulas { border-color: var(--borda-alerta); background: var(--faq-vazia); }
.faq-item textarea::placeholder, textarea::placeholder, input::placeholder { color: var(--placeholder); }
@media (max-width: 820px) { .faq-lista { grid-template-columns: 1fr; } }

textarea[data-auto-altura] { overflow-y: hidden; field-sizing: content; min-height: 64px; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { padding: 0; margin-bottom: 6px; font-size: 14px; }
.simnao { display: flex; flex-direction: column; gap: 8px; }
.pilulas { display: flex; flex-wrap: wrap; gap: 8px; border: 1px solid transparent; border-radius: 12px; padding: 2px; align-self: flex-start; }
.opcao-pilula { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border: 1px solid var(--borda-forte); border-radius: 20px; background: var(--campo); cursor: pointer; font-size: 14px; font-weight: 500; }
.opcao-pilula input { width: 18px; height: 18px; min-height: 0; margin: 0; accent-color: var(--azul); }
.opcao-pilula:has(input:checked) { border-color: var(--azul); background: var(--azul-claro); color: var(--azul-escuro); font-weight: 700; }
.simnao textarea { width: 100%; }
.gestores { display: flex; flex-direction: column; gap: 8px; }
.gestores legend { font-weight: 500; }
.gestores input { width: 100%; }
.gestores .botao-pequeno { align-self: flex-start; }
.grupos-atuais { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.tabela-grupos { min-width: 520px; }
.tabela-grupos .centro, .tabela-grupos th.centro { text-align: center; width: 130px; }
.tabela-grupos input[type=radio] { width: 20px; height: 20px; min-height: 0; accent-color: var(--azul); cursor: pointer; }
.tabela-grupos tbody tr:hover { background: var(--hover); }
.linha-nenhum td { background: var(--lista); }
.form-grupos { display: flex; flex-direction: column; gap: 12px; }
.form-clinica .opcao-pilula { flex-direction: row; align-items: center; gap: 8px; }

/* Vídeo e fotos de como chegar */
.midia-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.midia-item { border: 1px solid var(--borda); border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; background: var(--cartao); }
.midia-previa { width: 100%; height: 180px; object-fit: cover; background: #0E1430; display: block; }
.midia-externa { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; font-size: 36px; background: var(--fundo); }
.midia-info { padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.midia-info form { margin: 0; }
.form-midia { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.arquivo { display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.arquivo input[type=file] { min-height: 0; padding: 8px; border: 1px dashed var(--borda-forte); border-radius: 10px; background: var(--campo); max-width: 100%; }
.botao-pequeno.botao-alerta { color: var(--alerta); border-color: var(--borda-alerta); }
.barra-salvar { gap: 10px; }
.cartao > .botao-auto, .cartao > a.botao { align-self: flex-start; }

/* Indicadores clicáveis (visão geral → lista de leads) */
a.kpi-link { text-decoration: none; color: inherit; transition: border-color .15s, transform .15s; }
a.kpi-link:hover { border-color: var(--azul); transform: translateY(-1px); }
a.kpi-link:hover .kpi-rotulo::after { content: ' → ver lista'; color: var(--destaque); }
.num-link { color: var(--destaque); font-weight: 600; text-decoration: none; padding: 2px 6px; border-radius: 6px; }
.num-link:hover { background: var(--azul-claro); text-decoration: underline; }
.chip-limpar { margin-left: 8px; color: #fff; text-decoration: none; font-size: 16px; line-height: 1; }
.chip-limpar:hover { color: #fff; opacity: .8; }

/* Aprendizados da IA (v32) */
.ensinar { border: 1px solid var(--borda); border-radius: 10px; padding: 10px 12px; }
.ensinar summary { cursor: pointer; font-weight: 600; min-height: 28px; }
.form-ensinar { display: flex; flex-direction: column; gap: 10px; margin: 10px 0 6px; }
.form-ensinar label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--suave); }
.form-ensinar textarea { width: 100%; }
.cartao .form-ensinar .botao { align-self: flex-start; }
.apr-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.apr-item { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 10px; background: var(--lista); }
.apr-item form { margin: 0; align-self: flex-start; }
.apr-texto { font-weight: 500; }

/* ---------- Multiusuário, Kanban e conversas ---------- */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.menu-conta { color: #DCE1FA; text-decoration: none; font-weight: 600; line-height: 1.3; }
.menu-conta .suave { color: #AEB7E6; font-weight: 400; font-size: 12px; }
.menu-conta:hover, .menu-conta.ativo { color: #fff; }
.marca-propria { display: flex; align-items: center; gap: 10px; font-size: 19px; line-height: 1.15; word-break: break-word; }
.marca-logo { max-width: 56px; max-height: 44px; border-radius: 8px; background: #fff; padding: 3px; object-fit: contain; flex: none; }
.coluna { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.coluna > .cartao { flex: none; } /* cada cartão da coluna só com a altura do conteúdo */
.lista-dados { display: grid; grid-template-columns: max-content 1fr; gap: 8px 16px; margin: 0; }
.lista-dados dt { color: var(--suave); }
.lista-dados dd { margin: 0; }
.lista-perfis { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; }
.lista-auditoria { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.cartao-senha { border-color: var(--azul); }
.senha-prov { font-size: 17px; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .5px; }
.perfis, .clinicas-usuario { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.clinicas-usuario { max-height: 320px; overflow-y: auto; }
.logo-campo { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.logo-previa { max-width: 120px; max-height: 80px; border: 1px solid var(--borda); border-radius: 10px; padding: 4px; background: #fff; object-fit: contain; }
.campo-leitura { display: flex; flex-direction: column; gap: 4px; }
.campo-leitura > span:first-child { font-weight: 600; }
fieldset.so-leitura, fieldset.sem-borda { border: 0; padding: 0; margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
fieldset.so-leitura > legend { margin-bottom: 6px; }
fieldset[disabled] input, fieldset[disabled] textarea, fieldset[disabled] select { opacity: .85; cursor: default; }
.form-mensagem { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.form-mensagem textarea { flex: 1 1 240px; }
.form-mensagem .dica { flex-basis: 100%; margin: 0; }
.form-nota { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.form-nota textarea { flex: 1 1 220px; }

/* Kanban */
.kb-quadro { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 12px; align-items: flex-start; scroll-snap-type: x proximity; }
.kb-coluna { flex: 0 0 270px; background: var(--lista); border: 1px solid var(--borda); border-top: 4px solid var(--kb-cor, var(--azul)); border-radius: var(--raio); padding: 12px; display: flex; flex-direction: column; gap: 10px; max-height: calc(100vh - 210px); scroll-snap-align: start; }
.kb-coluna-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kb-coluna-topo h2 { font-size: 14px; margin: 0; }
.kb-qtd { font-size: 12px; font-weight: 700; color: var(--suave); background: var(--campo); border: 1px solid var(--borda); border-radius: 10px; padding: 1px 8px; }
.kb-lista { list-style: none; margin: 0; padding: 2px; display: flex; flex-direction: column; gap: 8px; min-height: 60px; overflow-y: auto; border-radius: 10px; transition: background .15s; }
.kb-lista.kb-alvo { background: var(--azul-claro); }
.kb-card { background: var(--cartao); border: 1px solid var(--borda); border-radius: 10px; box-shadow: 0 1px 2px rgba(20,22,31,.06); cursor: grab; }
.kb-card:hover { border-color: var(--azul); }
.kb-card.kb-arrastando { opacity: .45; }
.kb-card-link { display: flex; flex-direction: column; gap: 3px; padding: 10px 12px; color: var(--texto); text-decoration: none; font-size: 13px; }
.kb-card-nome { font-weight: 700; font-size: 14px; color: var(--titulo); }
.kb-card-rodape { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.kb-resp { font-size: 11px; color: var(--suave); }
.kb-dias { margin-left: auto; font-size: 11px; color: var(--suave); }
.kb-parado { color: var(--alerta); font-weight: 700; }
.kb-novo { font-size: 13px; color: var(--destaque); text-decoration: none; padding: 4px 2px; }
.kb-status { min-height: 18px; margin: 0; }
.kb-resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 10px; }
.kb-resumo > div { display: flex; flex-direction: column; background: var(--lista); border-radius: 10px; padding: 10px; }
.kb-resumo .num-grande { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 24px; color: var(--destaque); }
.kb-eventos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; max-height: 420px; overflow-y: auto; }
.kb-eventos li { display: flex; flex-direction: column; gap: 2px; font-size: 13px; border-left: 3px solid var(--borda); padding-left: 10px; }
.kb-azul { --kb-cor: #1C32B0; } .kb-roxo { --kb-cor: #6B3FC9; } .kb-ciano { --kb-cor: #0E8A9E; } .kb-verde { --kb-cor: #1E7A46; }
.kb-amarelo { --kb-cor: #C99A06; } .kb-laranja { --kb-cor: #D2600F; } .kb-vermelho { --kb-cor: #B42318; } .kb-cinza { --kb-cor: #6B7280; }
.fases-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.fases-lista > li { border: 1px solid var(--borda); border-left: 5px solid var(--kb-cor, var(--azul)); border-radius: 10px; padding: 12px; display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; justify-content: space-between; }
.nova-fase { margin-top: 10px; }

/* Conversas novas */
.form-nova-conversa { display: flex; flex-direction: column; gap: 10px; padding: 8px 0 16px; border-bottom: 1px solid var(--linha); }
.form-nova-conversa h2, .conv-titulo { margin: 4px 0 0; }
.conv-blocos { display: flex; flex-direction: column; gap: 10px; }
.conv-lado { gap: 36px; }
.conv-lado > .form-nova-conversa { border-bottom: 0; }
.conv-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.conv-lista a { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 10px; background: var(--lista); color: var(--texto); text-decoration: none; font-size: 13px; }
.conv-lista a:hover, .conv-lista li.selecionado a { background: var(--azul-claro); }
.conv-ultima { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 820px) {
  .kb-coluna { flex-basis: 82vw; max-height: none; }
}
.form-usuario { display: flex; flex-direction: column; gap: 18px; }
.form-usuario label:not(.marcar):not(.arquivo), .form-nova-conversa label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; }
.form-usuario input:not([type=checkbox]):not([type=radio]):not([type=file]), .form-nova-conversa input, .form-nova-conversa textarea, .form-nova-conversa select { width: 100%; }
.form-usuario .cartao { gap: 14px; }

/* Clínicas em blocos */
.cl-grade { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 18px; }
.cl-bloco { background: var(--cartao); border: 1px solid var(--borda); border-radius: var(--raio); transition: border-color .15s, box-shadow .15s, transform .15s; }
.cl-bloco:hover { border-color: var(--azul); box-shadow: 0 6px 18px rgba(20, 36, 138, .10); transform: translateY(-2px); }
.cl-link { display: flex; flex-direction: column; gap: 14px; height: 100%; padding: 18px; color: var(--texto); text-decoration: none; }
.cl-topo { display: flex; align-items: center; gap: 14px; }
.cl-avatar { position: relative; flex: none; width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: linear-gradient(135deg, #1C32B0, #14248A); display: grid; place-items: center; box-shadow: 0 0 0 3px var(--azul-claro); }
.cl-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cl-iniciais { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 22px; color: #fff; letter-spacing: .5px; }
.cl-titulo { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cl-nome { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 16px; color: var(--titulo); line-height: 1.25; }
.cl-whats { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cl-numeros { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; background: var(--lista); border-radius: 10px; font-size: 13px; }
.cl-numeros > span { display: inline-flex; align-items: baseline; gap: 6px; min-width: 0; }
.cl-num { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 20px; color: var(--destaque); }
.cl-ok { color: var(--ok); }
.cl-rodape { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; }
.cl-conteudo { display: flex; flex-wrap: wrap; gap: 6px; }
.cl-tag { font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 10px; color: var(--suave); background: var(--neutro-fundo); }
.cl-tag-ok { color: var(--ok); background: var(--ok-fundo); }
.cl-desativada { opacity: .6; }
.cl-desativada .cl-avatar { filter: grayscale(1); }
/* Blocos mais compactos (cabem mais por tela) */
.cl-grade { grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); gap: 14px; }
.cl-link { gap: 10px; padding: 14px; }
.cl-topo { gap: 11px; }
.cl-avatar { width: 48px; height: 48px; box-shadow: 0 0 0 2px var(--azul-claro); }
.cl-iniciais { font-size: 17px; }
.cl-nome { font-size: 14.5px; }
.cl-titulo .suave { font-size: 12.5px; }
.cl-numeros { padding: 7px 10px; gap: 6px 10px; font-size: 12px; }
.cl-num { font-size: 17px; }
.cl-tag { font-size: 10.5px; padding: 2px 7px; }
.cl-whats .selo { font-size: 11.5px; }
.cartao-perigo { border-color: var(--borda-alerta); }
.remover-opcoes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.remover-opcoes .opcao { display: flex; flex-direction: column; gap: 8px; }
.form-excluir { display: flex; flex-direction: column; gap: 8px; }
.form-excluir label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; }

/* Lista × blocos */
.barra-vis { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.barra-vis .chips { margin: 0; }
.alternar-vis { display: inline-flex; margin-left: auto; border: 1px solid var(--borda); border-radius: 10px; overflow: hidden; background: var(--cartao); }
.alternar-vis button { border: 0; background: transparent; color: var(--suave); font: inherit; font-size: 13px; font-weight: 600; padding: 7px 12px; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.alternar-vis button + button { border-left: 1px solid var(--borda); }
.alternar-vis button:hover { color: var(--destaque); }
html[data-vis-leads="blocos"] [data-vis-alvo="leads"][data-vis="blocos"],
html[data-vis-leads="lista"] [data-vis-alvo="leads"][data-vis="lista"],
html[data-vis-clinicas="blocos"] [data-vis-alvo="clinicas"][data-vis="blocos"],
html[data-vis-clinicas="lista"] [data-vis-alvo="clinicas"][data-vis="lista"] { background: var(--azul); color: #fff; }
/* a escolha dos leads não pode valer na página de clínicas (cada uma tem a sua) */
html[data-vis-leads="blocos"] [data-pagina] :not(.cl-pagina) > .vis-lista, html[data-vis-leads="lista"] [data-pagina] :not(.cl-pagina) > .vis-blocos { display: none; }
html[data-vis-clinicas="blocos"] .cl-pagina .vis-lista, html[data-vis-clinicas="lista"] .cl-pagina .vis-blocos { display: none; }

/* Leads em blocos */
.ld-grade { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)); gap: 12px; }
.ld-bloco { background: var(--lista); border: 1px solid var(--borda); border-left: 4px solid var(--borda); border-radius: 12px; transition: border-color .15s, box-shadow .15s; }
.ld-bloco:hover { border-color: var(--azul); box-shadow: 0 4px 14px rgba(20, 36, 138, .08); }
.ld-bloco.selecionado { border-color: var(--azul); background: var(--azul-claro); }
.ld-bloco.ld-pausado { border-left-color: var(--alerta); }
.ld-link { display: flex; flex-direction: column; gap: 5px; padding: 12px 13px; color: var(--texto); text-decoration: none; font-size: 13px; height: 100%; }
.ld-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.ld-nome { font-weight: 700; font-size: 14.5px; color: var(--titulo); line-height: 1.25; }
.ld-topo .selo { flex: none; font-size: 11px; }
.ld-avaliacao { font-weight: 600; }
.ld-ultima { color: var(--suave); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-style: italic; }
.ld-quando { font-size: 11.5px; margin-top: auto; }
.ld-link > span { min-width: 0; overflow-wrap: anywhere; }
.ld-grade { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }

/* Pacientes */
.pc-resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; margin-bottom: 18px; }
.pc-kpi { background: var(--cartao); border: 1px solid var(--borda); border-radius: var(--raio); padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.pc-kpi-val { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 22px; color: var(--destaque); }
.pc-procs { font-size: 12px; color: var(--texto); }
.grade-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.form-paciente label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; }
.procs { display: flex; flex-direction: column; gap: 8px; }
.proc-linha { display: grid; grid-template-columns: 1fr 140px; gap: 8px; }
.menu-secundario { margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.14); }
.menu-secundario + .menu-rodape { margin-top: 0; }
.menu-grupo { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #9FA9DE; padding: 0 14px 2px; }
.menu-secundario a { min-height: 38px; font-size: 14px; }
@media (max-width: 820px) { .menu-secundario { margin-top: 0; padding-top: 0; border-top: 0; } .menu-grupo { display: none; } }
.pc-manual { display: inline-block; padding: 0 6px; border-radius: 6px; font-size: 11px; font-weight: 600; background: var(--fundo-suave, #EEF1FB); color: var(--texto-suave, #5B6478); }
.pc-excluir { margin-top: 18px; }
/* Ciclos do plano e período na aba Pacientes */
.ciclos { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ciclo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: var(--raio); }
.ciclo-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1 1 auto; }
.ciclo-form input[type=date] { width: auto; }
.ciclo-novo { padding: 10px 12px; background: var(--fundo); border-radius: var(--raio); }
.botao-link { background: none; border: 0; color: var(--alerta, #B42318); text-decoration: underline; padding: 6px; }
.pc-barra-periodo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-bottom: 14px; }
.pc-barra-periodo .dica { margin: 0; flex: 1 1 320px; }
.pc-datas { display: inline-flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; }
.pc-datas[hidden] { display: none; }
.pc-anterior { background: #FFF4E5; color: #8A4B00; }
.pc-comparar { margin-bottom: 18px; }
.pc-comparar summary { cursor: pointer; font-weight: 700; }
.lista-avisos { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
/* Segurança de acesso */
.form-seguranca { display: flex; flex-direction: column; gap: 10px; margin-bottom: 8px; }
.campo-curto select { width: auto; min-width: 90px; }
.aparelhos { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 8px; }
.aparelho { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: var(--raio); }
.aparelho-pendente { border-color: #F5B54A; background: #FFF8EC; }
.resumo-acessos { margin: 4px 0 10px; }
#seguranca h3 { margin: 20px 0 8px; font-size: 15px; }

/* Apagar lead (só administrador) */
.apagar-lead { border: 1px solid var(--borda-alerta); border-radius: 10px; padding: 10px 12px; }
.apagar-lead summary { cursor: pointer; font-weight: 600; min-height: 28px; color: var(--alerta); }
.apagar-lead form { margin: 10px 0 6px; }

/* Saúde e avisos v32.9 */
.faixa { border-radius: var(--raio); padding: 14px 18px; border: 1px solid var(--borda); }
.faixa ul { margin: 8px 0 0 18px; }
.faixa-ok { background: var(--ok-fundo); color: var(--ok); }
.faixa-alerta { background: var(--alerta-fundo); color: var(--alerta); }
.faixa-neutra { background: var(--neutro-fundo); color: var(--neutro); }
.tabela-saude th[scope=row] { font-weight: 600; white-space: nowrap; }
.tabela-saude td { vertical-align: top; }
.pequeno { font-size: 12px; margin-top: 3px; }
.ocorrencias { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow-y: auto; }
.ocorrencias li { border-left: 3px solid var(--alerta); padding: 2px 0 2px 10px; }
.ocorrencias li.oc-volta { border-left-color: var(--ok); }
.ocorrencias .pre { white-space: pre-wrap; font-size: 13px; margin: 6px 0 0; }

/* Editar nome do lead */
.editar-nome summary { cursor: pointer; font-size: 13px; color: var(--suave); width: fit-content; }
.editar-nome form { margin-top: 6px; }
.editar-nome input[name=nome] { flex: 1; min-width: 0; }
.editar-nome .dica { margin-top: 4px; }
.editar-nome .botao-pequeno.botao-primario { color: #fff; }

/* Conversas novas: mensagem pronta */
.conv-pronta { display: flex; flex-direction: column; gap: 8px; border: 1px dashed var(--borda); border-radius: 12px; padding: 10px 12px; }
.conv-campos { display: grid; grid-template-columns: 1fr 2fr; gap: 8px; }
@media (max-width: 700px) { .conv-campos { grid-template-columns: 1fr; } }
.conv-pronta .botao-link { color: var(--azul, #1C32B0); padding: 0 2px; font-size: inherit; cursor: pointer; }

/* Agenda da clínica */
.ag-opcao { display: flex; flex-direction: column; gap: 14px; margin-top: 14px; }
.ag-opcao label, .form-agenda label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; }
.ag-opcao .grade > label, .form-agenda .grade > label { flex: 1 1 260px; }
.ag-colunas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 18px 36px; align-items: start; }
.ag-coluna { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.ag-opcao input:not([type=checkbox]):not([type=radio]), .ag-opcao select, .form-agenda input:not([type=checkbox]):not([type=radio]):not([type=time]), .form-agenda select { width: 100%; }
.form-agenda .marcar { flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 400; cursor: pointer; }
.ag-opcao .botao, .form-agenda .barra-salvar .botao { align-self: flex-start; }
.ag-opcao[hidden] { display: none; }
.ag-conta p { margin: 0 0 4px; }
.ag-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 16px; }
.form-agenda { display: flex; flex-direction: column; gap: 18px; }
.ag-autonomia, .ag-grade { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.ag-autonomia .marcar { align-items: flex-start; }
.tabela-grade { width: auto; }
.tabela-grade td { white-space: nowrap; }
.tabela-grade input[type=time] { width: auto; min-width: 104px; }
[data-limite-outro][hidden] { display: none; }

/* Página Agenda (horários livres dos próximos dias) */
.ag-cabeca { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ag-cabeca h2 { margin: 0 0 4px; }
.ag-vagas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; }
.ag-vaga { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 14px; background: var(--ok-fundo); color: var(--ok); font-weight: 600; font-size: 13px; white-space: nowrap; }
.ag-cartao-quadro { padding: 14px; }
.ag-quadro { border-collapse: separate; border-spacing: 3px; width: 100%; font-size: 13px; }
.ag-quadro th { font-weight: 600; text-align: left; padding: 4px 6px; white-space: nowrap; vertical-align: bottom; }
.ag-quadro thead th { font-size: 12.5px; }
.ag-quadro tbody th { color: var(--suave); width: 1%; }
.ag-quadro td { padding: 5px 8px; border-radius: 6px; vertical-align: top; min-width: 92px; }
.ag-quadro .ag-col-fechada { min-width: 0; width: 1%; }
.ag-qtd { display: inline-block; margin-top: 3px; font-size: 11.5px; font-weight: 700; padding: 1px 8px; border-radius: 10px; color: var(--ok); background: var(--ok-fundo); white-space: nowrap; }
.ag-qtd-zero { color: var(--suave); background: var(--lista); }
.ag-vazio { background: transparent; }
td.ag-col-fechada.ag-vazio { background: var(--lista); }
.ag-passou { color: var(--suave); text-align: center; }
.ag-nomes { display: block; font-size: 11.5px; opacity: .85; overflow-wrap: anywhere; }
.ag-fora td { font-size: 12px; color: var(--suave); }
.ag-livre { background: var(--ok-fundo); color: var(--ok); }
.ag-com-leads { background: var(--azul-claro); color: var(--destaque); }
.ag-cheio { background: var(--alerta-fundo); color: var(--alerta); }
.ag-ocupado { background: var(--lista); color: var(--suave); }
.ag-auto { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 10px 12px; border-radius: 10px; background: var(--lista); }
.ag-auto-ligado { background: var(--ok-fundo); }
.selos-pequenos { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.ag-eventos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.ag-eventos li { display: grid; grid-template-columns: 96px auto 1fr; gap: 10px; align-items: baseline; padding: 6px 10px; border-radius: 8px; background: var(--lista); }
@media (max-width: 700px) { .ag-eventos li { grid-template-columns: 1fr; gap: 2px; } }

/* ---------- Aba Operação (operadoras × campanhas) ---------- */
.op-acoes { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start; position: relative; }
.op-nova-op > summary { list-style: none; }
.op-nova-op > summary::-webkit-details-marker { display: none; }
.op-pop { position: absolute; right: 0; top: 52px; z-index: 5; width: min(340px, 90vw); box-shadow: 0 8px 24px rgba(20,22,31,.18); }
.op-inativas { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.op-quadro { margin-top: 4px; }
.op-coluna { flex-basis: 280px; }
.op-coluna-fila { --kb-cor: var(--pausa); background: var(--cartao); }
.op-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.op-topo h2 { font-size: 15px; margin: 0 0 4px; }
.op-nome { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
.op-topo .botao-icone { width: 40px; height: 40px; }
.op-topo .botao-icone[disabled] { opacity: .4; cursor: default; }
.op-pag { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12px; }
.op-qtd { margin-left: auto; }
.op-pagar { align-self: stretch; }
.op-obs { font-size: 12px; }
.op-form { gap: 10px; }
.op-total { margin: 0; text-align: right; font-size: 14px; color: var(--suave); }
.op-total strong { color: var(--titulo); font-size: 16px; }
.op-alca { cursor: grab; }
.op-alca:active { cursor: grabbing; }
.op-coluna.kb-arrastando { opacity: .5; }
.op-mover { display: flex; gap: 8px; margin-top: 10px; }
/* Card da Operação: nome (link), etapa (lista que salva ao escolher), clínica/observação */
.op-card { display: flex; flex-direction: column; }
.op-card-nome { padding-bottom: 4px; }
.op-card-etapa { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 0 12px 10px; }
.op-etapa { min-height: 32px; padding: 0 10px; border-radius: 16px; border: 1px solid transparent; font: 700 12px Inter, sans-serif; cursor: pointer; max-width: 100%; }
.op-etapa:hover, .op-etapa:focus-visible { border-color: currentColor; }
.op-card-info { display: flex; flex-direction: column; gap: 2px; padding: 0 12px 10px; margin-top: -4px; font-size: 13px; }
.op-coluna-arq { --kb-cor: var(--suave); background: var(--cartao); }
.op-coluna-arq .op-card { opacity: .85; }

/* Etiquetas manuais do lead (📌 Follow-up, 🔁 Remarcar, ✔️ Resolvido) */
.etiquetas-lead { display: flex; flex-wrap: wrap; gap: .35rem; margin: .35rem 0; }
.etiquetas-lead form { margin: 0; }
.etiqueta-botao { opacity: .75; }
.etiqueta-botao.etiqueta-ligada { opacity: 1; background: var(--azul-claro); border-color: var(--azul); color: var(--azul-escuro); font-weight: 600; }

/* Seções da lista de clínicas (Capta+ / parcerias) */
.cl-secao { font-size: 1.05rem; margin: 1.25rem 0 .6rem; color: var(--azul-escuro); display: flex; gap: .5rem; align-items: baseline; }
.cl-secao:first-child { margin-top: 0; }
.cl-secao-linha th { text-align: left; background: var(--fundo-suave, #f3f5fb); color: var(--azul-escuro); font-size: .95rem; }
.pilha { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.pilha > .cartao { flex: none; }

/* Identidade das parcerias (login no subdomínio, menu com ícone) */
.logo-login { display: block; width: 100%; max-width: 300px; max-height: 170px; object-fit: contain; align-self: center; border-radius: 12px; }
.marca-icone { width: 44px; height: 44px; max-width: none; padding: 0; object-fit: cover; }
.form-marca .campo-imagem { display: flex; flex-direction: column; gap: 6px; }
.form-marca .previa-icone { width: 64px; height: 64px; object-fit: cover; }
.par-cores { display: flex; flex-wrap: wrap; gap: 18px; }
.par-cores input[type=color] { width: 72px; height: 40px; padding: 2px; cursor: pointer; }
.acoes-topo { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }