/* 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; }
.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; }
.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; }
.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; overflow-y: auto; }
.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: 1fr 1fr; gap: 10px; margin: 12px 0 8px; }
.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; }
  .menu-itens { flex-direction: row; }
  .menu-rodape { margin: 0 0 0 auto; }
  .conteudo { padding: 12px 16px 40px; }
  .detalhe { max-width: none; position: relative; top: 0; order: -1; }
  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; }
.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-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; }