:root{
  --navy:#0d1b35; --navy-2:#16264a; --gold:#c9a050; --cream:#f4efe6;
  --papel:#faf7f0; --borda:#e4dac3; --texto:#41506b; --suave:#8a8170;
  --verde:#5f9160; --amarelo:#c9a050; --vermelho:#b9573f;
  /* uma família só no sistema inteiro: Outfit, sem serifa, cantos suaves.
     --serif continua existindo porque muitos trechos a citam; hoje ela aponta
     para a mesma fonte, e o que era itálico decorativo virou peso. */
  --serif:"Outfit","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --sans:"Outfit","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  /* superfícies do layout */
  --fundo:#f4f5f7; --superficie:#ffffff; --linha:#dfe3e8;
  --menu:#0d1b35; --menu-2:#16264a; --menu-txt:#c2ccdd;
  --rotulo:#5a6b86;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--fundo);font-family:var(--sans);color:var(--texto);font-size:13.5px;line-height:1.5}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--navy)}
.oculto{display:none !important}

.eyebrow{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--suave);font-weight:500}
h1,h2,h3{font-family:var(--serif);color:var(--navy);font-weight:600;margin:0}
h1{font-size:28px} h2{font-size:23px} h3{font-size:18px}
h1 em,h2 em{color:var(--gold);font-style:italic}

/* ---------------- login ---------------- */
#telaLogin{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--navy)}
.cartao-login{background:var(--papel);padding:44px 38px;border-radius:6px;width:100%;max-width:380px}
.cartao-login .regua{width:28px;height:2px;background:var(--gold);margin-bottom:14px}
.cartao-login h1{margin:4px 0 26px}
.cartao-login label{display:block;margin-bottom:16px}
.cartao-login input{width:100%;margin-top:6px}

/* ---------------- barra superior ---------------- */
.barra{
  position:fixed;top:0;left:0;right:0;height:54px;z-index:20;
  background:var(--superficie);border-bottom:1px solid var(--linha);
  display:flex;align-items:center;gap:16px;padding:0 18px;
  box-shadow:0 1px 3px rgba(13,27,53,.06);
}
.barra-menu{display:none;background:none;border:none;font-size:19px;cursor:pointer;color:var(--navy)}
.barra-marca{font-family:var(--serif);font-size:19px;color:var(--navy);cursor:pointer;
  text-decoration:none;white-space:nowrap}
.barra-marca em{color:var(--gold);font-style:italic}
.barra-clinica{display:flex;align-items:center;gap:8px;margin-left:18px;
  padding-left:18px;border-left:1px solid var(--linha)}
.barra-clinica select{border:1px solid var(--linha);border-radius:4px;padding:6px 10px;
  background:var(--fundo);min-width:180px;max-width:260px}
.barra-dir{margin-left:auto;display:flex;align-items:center;gap:14px}
.barra-icone{position:relative;background:none;border:none;font-size:16px;cursor:pointer;
  width:36px;height:36px;border-radius:50%}
.barra-icone:hover{background:var(--fundo)}
.barra-icone b{position:absolute;top:2px;right:0;font-size:10px;color:#fff;
  background:var(--vermelho);border-radius:9px;padding:0 5px;line-height:15px}
.barra-icone b:empty{display:none}
.barra-usuario{text-align:right;line-height:1.25}
.barra-usuario b{display:block;color:var(--navy);font-weight:600;font-size:13px}
.barra-usuario span{font-size:11px;color:var(--suave)}
.barra-sair{background:none;border:1px solid var(--linha);color:var(--rotulo);
  padding:6px 14px;border-radius:4px;cursor:pointer}
.barra-sair:hover{border-color:var(--gold);color:var(--navy)}

/* ---------------- estrutura ---------------- */
.corpo{display:flex;padding-top:54px;min-height:100vh}
.lateral{
  width:248px;flex:0 0 248px;background:var(--menu);color:var(--menu-txt);
  position:fixed;top:54px;bottom:0;left:0;overflow-y:auto;padding-bottom:20px;
  display:flex;flex-direction:column;
}
.area{flex:1;margin-left:248px;padding:22px 26px 60px;min-width:0}

.mod{border-bottom:1px solid #1a2b4f}
.mod-rodape{margin-top:auto;border-top:1px solid #21335a;border-bottom:none}
.mod-cabeca{width:100%;display:flex;align-items:center;gap:10px;background:none;border:none;
  color:#dbe2ee;padding:13px 20px;cursor:pointer;text-align:left;font-weight:600;font-size:13.5px}
.mod-cabeca:hover{background:var(--menu-2)}
.mod-icone{color:var(--gold);font-size:13px;width:14px}
.mod-seta{margin-left:auto;transition:transform .15s;color:#6f7d99}
.mod.aberto .mod-seta{transform:rotate(90deg)}
.mod-corpo{display:none;padding:0 0 10px}
.mod.aberto .mod-corpo{display:block}

.grupo{padding:6px 0}
.grupo-rotulo{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;
  color:#6f7d99;padding:6px 20px 4px;display:flex;align-items:center;gap:6px}
.selo-gh{background:var(--gold);color:var(--navy);border-radius:3px;
  padding:0 5px;font-size:9px;letter-spacing:.5px;font-weight:600}
.lateral .item{display:block;padding:7px 20px 7px 32px;color:#a8b4c8;cursor:pointer;
  font-size:13px;border-left:3px solid transparent}
.lateral .item:hover{background:var(--menu-2);color:#fff}
.lateral .item.ativo{background:var(--menu-2);color:#fff;border-left-color:var(--gold);font-weight:500}

/* ---------------- trilha e título ---------------- */
.trilha{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--suave);margin-bottom:4px}
.trilha i{font-style:normal;color:#b9c2d0}
.trilha b{color:var(--navy);font-weight:500}
.titulo-tela{font-size:25px;margin-bottom:20px;text-transform:uppercase;
  font-family:var(--sans);font-weight:600;letter-spacing:.4px;font-size:19px;color:var(--navy)}

/* ---------------- blocos de formulário ---------------- */
.bloco{background:var(--superficie);border:1px solid var(--linha);border-radius:5px;
  padding:18px 20px 20px;margin-bottom:18px}
.bloco-titulo{font-size:12.5px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;
  color:var(--navy);padding-bottom:9px;margin-bottom:16px;border-bottom:2px solid var(--navy);
  display:flex;align-items:center}
.contador{margin-left:auto;font-weight:400;text-transform:none;letter-spacing:0;
  font-size:12px;color:var(--suave)}

/* bloco que abre e fecha — o concluído fica guardado atrás do título */
details.recolhivel{padding-bottom:9px}
details.recolhivel[open]{padding-bottom:20px}
details.recolhivel>summary{cursor:pointer;list-style:none;margin-bottom:0;
  user-select:none;-webkit-user-select:none}
details.recolhivel>summary::-webkit-details-marker{display:none}
details.recolhivel>summary::marker{content:''}
details.recolhivel>summary:hover .seta,
details.recolhivel>summary:hover .contador{color:var(--gold)}
details.recolhivel>summary .seta{margin-left:10px;font-size:11px;color:var(--suave);
  transition:transform .15s ease;display:inline-block}
details.recolhivel[open]>summary{margin-bottom:16px}
details.recolhivel[open]>summary .seta{transform:rotate(180deg)}
@media print{details.recolhivel>summary .seta{display:none}}

.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px 20px}
.form label{display:flex;flex-direction:column;gap:5px}
.form label>span{font-size:11.5px;color:var(--rotulo);font-weight:500}
.form label>span i{color:var(--vermelho);font-style:normal}
.form label.largo{grid-column:1/-1}
.form label.duplo{grid-column:span 2}
@media(max-width:760px){.form label.duplo{grid-column:1/-1}}
.form .par{display:flex;align-items:center;gap:8px}
.form .par input{flex:1}
.form .ate{color:var(--suave);font-size:12px}
.form label.opcao{flex-direction:row;align-items:center;gap:8px}
.form label.opcao input{width:auto}
.form label.opcao span{font-size:13px;color:var(--texto)}
input,select,textarea{padding:8px 10px;border:1px solid var(--linha);border-radius:4px;
  background:#fff;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--navy);
  box-shadow:0 0 0 2px rgba(13,27,53,.08)}
input:disabled,.calculado{background:#eef0f3;color:var(--rotulo)}
textarea{min-height:80px;resize:vertical}
label.campo{display:block;margin-bottom:14px}
label.campo span{display:block;margin-bottom:5px}

.barra-acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;
  padding-top:16px;border-top:1px solid var(--linha)}
.previa{margin-top:18px;padding-top:16px;border-top:1px solid var(--linha)}

/* ---------------- botões ---------------- */
button.acao{background:var(--navy);color:#fff;border:none;padding:9px 22px;
  border-radius:4px;cursor:pointer;font-weight:500}
button.acao:hover{background:var(--gold);color:var(--navy)}
button.leve{background:#fff;border:1px solid var(--linha);color:var(--rotulo);
  padding:8px 15px;border-radius:4px;cursor:pointer}
button.leve:hover{border-color:var(--navy);color:var(--navy)}
button.risco{border-color:#e4c2b8;color:var(--vermelho)}
button.risco:hover{border-color:var(--vermelho)}

/* ---------------- tabelas ---------------- */
table{width:100%;border-collapse:collapse;background:var(--superficie)}
th{text-align:left;font-size:10.5px;letter-spacing:.9px;text-transform:uppercase;
  color:var(--rotulo);font-weight:600;padding:9px 10px;
  background:#eef0f3;border-bottom:1px solid var(--linha)}
td{padding:9px 10px;border-bottom:1px solid var(--linha);vertical-align:top}
tbody tr:hover{background:#f7f9fb}
tr.total td{background:#eef0f3;font-weight:600;color:var(--navy);border-top:2px solid var(--navy)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
table.mini th,table.mini td{padding:6px 8px;font-size:12.5px}

/* ---------------- componentes ---------------- */
.cartao{background:var(--superficie);border:1px solid var(--linha);border-radius:5px;
  padding:18px 20px;margin-bottom:16px}
.grade{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(165px,1fr))}

.kpi{background:var(--superficie);border:1px solid var(--linha);border-radius:5px;padding:15px 17px}
.kpi b{display:block;font-family:var(--serif);font-style:italic;font-size:28px;
  color:var(--navy);line-height:1.15}

.capa{background:var(--navy);color:var(--cream);border-radius:6px;padding:34px 36px}
.capa-regua{width:28px;height:2px;background:var(--gold);margin-bottom:12px}
.capa .eyebrow{color:#9aa6bd}
.capa h2{color:var(--cream);margin:6px 0 10px}
.capa p{max-width:720px;color:#c8d2e2;margin:0}
.capa-clinica{margin-top:18px;font-size:13px;color:#9aa6bd}
.capa-clinica b{color:var(--gold)}
.informativo{padding:11px 0;border-bottom:1px solid var(--linha)}
.informativo:last-child{border-bottom:none}
.informativo b{color:var(--navy)}
.informativo div{font-size:13px;color:var(--texto);margin-top:3px}

.pilula{display:inline-block;font-size:10px;letter-spacing:.9px;text-transform:uppercase;
  padding:3px 9px;border-radius:3px;border:1px solid var(--linha);background:var(--fundo);color:var(--rotulo)}
.pilula.verde{color:var(--verde);border-color:#bcd0bc;background:#eef4ee}
.pilula.amarelo{color:#8d6d24;border-color:#e6d5ac;background:#f9f2e0}
.pilula.vermelho{color:var(--vermelho);border-color:#e4c2b8;background:#faeee9}
.pilula.navy{color:var(--navy);border-color:var(--navy);background:transparent}

.aviso{padding:10px 14px;border-radius:4px;margin-bottom:14px;font-size:13px}
.aviso.erro{background:#faeee9;border:1px solid #e4c2b8;color:#8c3f2c}
.aviso.ok{background:#eef4ee;border:1px solid #bcd0bc;color:#3f6440}
.vazio{padding:40px 20px;text-align:center;color:var(--suave)}

.fundo{position:fixed;inset:0;background:rgba(13,27,53,.55);display:flex;align-items:flex-start;
  justify-content:center;padding:40px 16px;overflow-y:auto;z-index:60}
.modal{background:var(--superficie);border-radius:6px;padding:26px;width:100%;max-width:640px}
.modal .cabeca{display:flex;align-items:center;margin-bottom:18px}
.modal .cabeca button{margin-left:auto;background:none;border:none;font-size:22px;
  cursor:pointer;color:var(--suave)}

.barras{display:flex;align-items:flex-end;gap:10px;height:170px;padding-top:10px}
.barras .col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;
  align-items:center;gap:5px;min-width:34px}
.barras .haste{width:100%;border-radius:2px 2px 0 0;background:var(--navy);min-height:2px}
.barras .haste.acima{background:var(--verde)}
.barras .haste.abaixo{background:var(--vermelho)}
.barras .haste.na_media{background:var(--gold)}
.barras .rot{font-size:10px;color:var(--suave);white-space:nowrap}
.barras .val{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--navy)}

.etiq{background:#fff;border:1px solid var(--linha);color:var(--rotulo);
  font-size:10px;letter-spacing:.9px;text-transform:uppercase;padding:4px 10px;
  border-radius:3px;cursor:pointer}
.etiq:hover{border-color:var(--gold)}
.etiq.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.etiq.verde.on{background:var(--verde);border-color:var(--verde);color:#fff}
.etiq.amarelo.on{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.etiq.vermelho.on{background:var(--vermelho);border-color:var(--vermelho);color:#fff}

/* ---------------- responsivo ---------------- */
@media(max-width:900px){
  .barra-menu{display:block}
  .barra-clinica{margin-left:8px;padding-left:8px}
  .barra-clinica label{display:none}
  .barra-clinica select{min-width:130px}
  .barra-usuario{display:none}
  .lateral{transform:translateX(-100%);transition:transform .18s;z-index:19;width:260px}
  body.menu-aberto .lateral{transform:translateX(0);box-shadow:4px 0 16px rgba(13,27,53,.2)}
  .area{margin-left:0;padding:16px 14px 50px}
  table{font-size:12.5px}
}
@media print{
  .barra,.lateral,.barra-acoes,.trilha{display:none !important}
  .area{margin:0;padding:0}
  .bloco{border:none;page-break-inside:avoid}
}
/* ============================================================
   CRM — linguagem visual do WhatsApp Web
   ============================================================ */
:root{
  --wa-painel:#f0f2f5;      /* barras e cabeçalhos */
  --wa-lista:#ffffff;       /* fundo da lista de conversas */
  --wa-fundo:#efeae2;       /* fundo da conversa */
  --wa-saida:#d9fdd3;       /* balão enviado */
  --wa-entrada:#ffffff;     /* balão recebido */
  --wa-verde:#00a884;       /* acento */
  --wa-verde-escuro:#008069;
  --wa-txt:#111b21;
  --wa-sec:#667781;
  --wa-linha:#e9edef;
  --wa-hover:#f5f6f6;
  --wa-sel:#f0f2f5;
}

.wa{
  position:relative;display:grid;grid-template-columns:340px 1fr;
  height:min(76vh,700px);min-height:460px;
  border:1px solid var(--wa-linha);border-radius:6px;overflow:hidden;
  font-family:"Segoe UI",system-ui,-apple-system,sans-serif;color:var(--wa-txt);
  box-shadow:0 1px 3px rgba(11,20,26,.08);
}

/* ---------- cabeçalhos ---------- */
.wa-cabeca{
  display:flex;align-items:center;gap:12px;padding:10px 16px;
  background:var(--wa-painel);border-bottom:1px solid var(--wa-linha);flex:0 0 auto;
}
.wa-nome{font-size:15px;font-weight:600;color:var(--wa-txt);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-sub{font-size:12.5px;color:var(--wa-sec);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-acoes{margin-left:auto;display:flex;gap:4px}
.wa-icone{background:none;border:none;color:#54656f;font-size:17px;
  width:36px;height:36px;border-radius:50%;cursor:pointer;line-height:1}
.wa-icone:hover{background:rgba(11,20,26,.06)}

.wa-avatar{
  width:40px;height:40px;border-radius:50%;flex:0 0 auto;
  background:var(--wa-verde);color:#fff;display:flex;align-items:center;
  justify-content:center;font-weight:600;font-size:16px;
}
.wa-avatar.grande{width:88px;height:88px;font-size:34px;margin:16px auto 0}

/* ---------- painel esquerdo ---------- */
.wa-lado{display:flex;flex-direction:column;min-height:0;background:var(--wa-lista);
  border-right:1px solid var(--wa-linha)}
.wa-busca{padding:8px 12px;background:var(--wa-lista);border-bottom:1px solid var(--wa-linha);flex:0 0 auto}
.wa-busca input{width:100%;background:var(--wa-painel);border:none;border-radius:8px;
  padding:8px 14px;font-size:14px;color:var(--wa-txt)}
.wa-busca input:focus{outline:1px solid var(--wa-verde)}

.wa-conversas{flex:1 1 0;min-height:0;overflow-y:auto}
.wa-item{display:flex;gap:12px;padding:10px 14px;cursor:pointer;
  border-bottom:1px solid var(--wa-linha)}
.wa-item:hover{background:var(--wa-hover)}
.wa-item.sel{background:var(--wa-sel)}
.wa-item-corpo{min-width:0;flex:1}
.wa-item-topo{display:flex;align-items:baseline;gap:8px}
.wa-item-nome{font-size:15px;color:var(--wa-txt);flex:1;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-item-hora{font-size:11.5px;color:var(--wa-sec);flex:0 0 auto}
.wa-item-previa{font-size:13.5px;color:var(--wa-sec);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-item-marcas{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}
.wa-etapa{font-size:9.5px;letter-spacing:.8px;text-transform:uppercase;
  color:var(--wa-verde-escuro);background:#d9fdd3;border-radius:3px;padding:2px 7px}
.wa-sem-conversa{padding:40px 20px;text-align:center;color:var(--wa-sec);font-size:14px}

/* ---------- conversa ---------- */
.wa-chat{display:flex;flex-direction:column;min-height:0;min-width:0;
  background:var(--wa-fundo);position:relative}
/* textura discreta no lugar do papel de parede */
.wa-chat::before{content:"";position:absolute;inset:0;opacity:.4;pointer-events:none;
  background-image:radial-gradient(circle at 1px 1px, rgba(11,20,26,.05) 1px, transparent 0);
  background-size:22px 22px}

.wa-vazio{flex:1;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;color:var(--wa-sec);padding:30px;position:relative}
.wa-vazio-marca{font-family:var(--serif);font-size:30px;color:#54656f;margin-bottom:8px}
.wa-vazio p{font-size:14px;max-width:420px}
.wa-alerta{color:var(--vermelho);font-weight:500}

.wa-conversa{flex:1;display:flex;flex-direction:column;min-height:0;position:relative}
.wa-cabeca-chat{background:var(--wa-painel)}

.wa-mensagens{flex:1 1 0;min-height:0;overflow-y:auto;padding:18px 7%;
  display:flex;flex-direction:column;gap:3px}
.wa-dia{align-self:center;background:#ffffffdd;color:var(--wa-sec);font-size:12.5px;
  padding:5px 12px;border-radius:8px;margin:12px 0 6px;
  box-shadow:0 1px 0.5px rgba(11,20,26,.13)}

.wa-linha{display:flex;max-width:100%}
.wa-linha.saida{justify-content:flex-end}
.wa-bolha{
  position:relative;max-width:min(65%,560px);padding:6px 9px 8px 10px;
  border-radius:7.5px;font-size:14.2px;line-height:19px;
  white-space:pre-wrap;overflow-wrap:anywhere;
  box-shadow:0 1px .5px rgba(11,20,26,.13);
}
.wa-linha.entrada .wa-bolha{background:var(--wa-entrada);border-top-left-radius:0}
.wa-linha.saida   .wa-bolha{background:var(--wa-saida);border-top-right-radius:0}
/* bico do balão */
.wa-linha.entrada .wa-bolha::before,
.wa-linha.saida   .wa-bolha::before{
  content:"";position:absolute;top:0;width:8px;height:13px;
}
.wa-linha.entrada .wa-bolha::before{
  left:-8px;background:var(--wa-entrada);
  clip-path:polygon(100% 0, 0 0, 100% 100%);
}
.wa-linha.saida .wa-bolha::before{
  right:-8px;background:var(--wa-saida);
  clip-path:polygon(0 0, 100% 0, 0 100%);
}
.wa-hora{float:right;font-size:11px;color:var(--wa-sec);
  margin:6px -3px -4px 10px;line-height:1;white-space:nowrap}
.wa-tique{color:#53bdeb;margin-left:3px;letter-spacing:-2px}

.wa-compositor{display:flex;align-items:center;gap:10px;padding:10px 16px;
  background:var(--wa-painel);flex:0 0 auto}
.wa-compositor input{flex:1;border:none;border-radius:8px;padding:11px 14px;
  font-size:14.5px;background:#fff;color:var(--wa-txt)}
.wa-compositor input:focus{outline:none}
.wa-compositor input:disabled{background:#e9edef;color:var(--wa-sec)}
.wa-enviar{width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;
  background:var(--wa-verde);color:#fff;font-size:17px;flex:0 0 auto}
.wa-enviar:hover{background:var(--wa-verde-escuro)}
.wa-enviar:disabled{background:#c4ccd1;cursor:not-allowed}

/* ---------- ficha (gaveta à direita) ---------- */
.wa-ficha{
  position:absolute;top:0;right:0;bottom:0;width:340px;max-width:88%;
  background:var(--wa-lista);border-left:1px solid var(--wa-linha);
  transform:translateX(100%);transition:transform .18s ease;
  display:flex;flex-direction:column;z-index:3;
}
.wa-ficha.aberta{transform:translateX(0);box-shadow:-3px 0 12px rgba(11,20,26,.12)}
.wa-ficha-cabeca{display:flex;align-items:center;gap:14px;padding:14px 16px;
  background:var(--wa-painel);border-bottom:1px solid var(--wa-linha);
  font-size:15px;font-weight:600;flex:0 0 auto}
.wa-ficha-corpo{flex:1 1 0;min-height:0;overflow-y:auto;padding:0 18px 20px}
.wa-ficha-corpo .eyebrow{color:var(--wa-sec)}
.wa-ficha-corpo select,.wa-ficha-corpo textarea{border-color:var(--wa-linha)}

@media(max-width:900px){
  .wa{grid-template-columns:1fr;height:auto}
  .wa-lado{max-height:280px}
  .wa-chat{height:480px}
  .wa-bolha{max-width:82%}
  .wa-mensagens{padding:14px 12px}
}

/* ---------- cartão de clínica ---------- */
.cartao-clinica{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.cartao-clinica:hover{border-color:var(--navy);box-shadow:0 2px 8px rgba(13,27,53,.08)}
.cartao-clinica .linhas{display:flex;flex-direction:column;gap:3px;
  font-size:12.5px;color:var(--suave)}

/* ---------- cabeçalho e abas de dentro da clínica ---------- */
.cab-clinica{background:var(--superficie);border:1px solid var(--linha);border-radius:5px;
  padding:14px 18px 0;margin-bottom:18px}
.cab-clinica h3{margin:2px 0 12px}
.abas-clinica{display:flex;gap:2px;flex-wrap:wrap}
.aba-cli{background:none;border:none;border-bottom:2px solid transparent;color:var(--rotulo);
  padding:9px 16px;cursor:pointer;font-size:13px}
.aba-cli:hover{color:var(--navy)}
.aba-cli.ativa{color:var(--navy);border-bottom-color:var(--gold);font-weight:600}

/* ---------- linhas dinâmicas do formulário de relatório ---------- */
.linha-din{display:flex;gap:8px;align-items:center;padding:6px 0;
  border-bottom:1px solid var(--linha)}
.linha-din:last-child{border-bottom:none}
.linha-din input,.linha-din select{flex:1;min-width:0}
.linha-din .calc{font-family:var(--serif);font-style:italic;font-size:15px;
  color:var(--navy);min-width:60px;text-align:right}
.linha-din button{flex:0 0 auto;padding:6px 11px;line-height:1}
@media(max-width:720px){.linha-din{flex-wrap:wrap}.linha-din input,.linha-din select{min-width:120px}}

/* ============ chat flutuante ============ */
.chat-bolha { position: fixed; right: 22px; bottom: 22px; z-index: 900;
  width: 56px; height: 56px; border-radius: 50%; border: none; cursor: pointer;
  background: var(--navy); color: #f4efe6; font-size: 22px; line-height: 1;
  box-shadow: 0 8px 24px rgba(13,27,53,.32); transition: transform .15s ease; }
.chat-bolha:hover { transform: translateY(-2px); }
.chat-bolha.ativa { background: #1b2c4d; }
.chat-bolha b { position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px;
  border-radius: 10px; background: #a63a4e; color: #fff; font-size: 11px; font-weight: 600;
  display: flex; align-items: center; justify-content: center; padding: 0 5px; }

.chat-caixa { position: fixed; right: 22px; bottom: 88px; z-index: 900;
  width: 352px; height: min(540px, calc(100vh - 130px));
  background: #fff; border: 1px solid var(--linha); border-radius: 12px;
  box-shadow: 0 18px 46px rgba(13,27,53,.26); display: flex; flex-direction: column;
  overflow: hidden; }
.chat-cabeca { display: flex; align-items: center; gap: 6px; padding: 11px 12px;
  background: var(--navy); color: #f4efe6; font-size: 14.5px; font-weight: 500; }
.chat-cabeca .chat-estado { display: block; font-size: 11px; font-weight: 400; color: #9aa6bd; }
.chat-icone, .chat-voltar { background: none; border: none; color: #c2ccdd; cursor: pointer;
  font-size: 16px; padding: 2px 5px; border-radius: 4px; }
.chat-icone:hover, .chat-voltar:hover { background: rgba(255,255,255,.12); color: #fff; }
.chat-voltar { font-size: 22px; line-height: 1; }

.chat-lista, .chat-uso { flex: 1; overflow-y: auto; }
.chat-sub { padding: 9px 12px; font-size: 11.5px; color: var(--suave);
  border-bottom: 1px solid var(--borda); }
.chat-alvo { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left;
  padding: 10px 12px; border: none; background: none; cursor: pointer; font: inherit;
  border-bottom: 1px solid var(--borda); }
.chat-alvo:hover { background: var(--superficie); }
.chat-alvo .sinal { width: 9px; height: 9px; border-radius: 50%; background: #c9c3b4; flex: none; }
.chat-alvo .sinal.on { background: #2f8f6b; box-shadow: 0 0 0 3px rgba(47,143,107,.15); }
.chat-alvo .quem { flex: 1; min-width: 0; }
.chat-alvo .nome { display: block; color: var(--navy); font-weight: 500; font-size: 13.5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-alvo .sub { display: block; font-size: 11.5px; color: var(--suave); }
.chat-alvo .qtd { background: #a63a4e; color: #fff; font-size: 11px; border-radius: 10px;
  padding: 1px 7px; flex: none; }

.chat-conversa { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.chat-fluxo { flex: 1; overflow-y: auto; padding: 12px; background: var(--superficie); }
.chat-msg { max-width: 84%; margin-bottom: 10px; }
.chat-msg .balao { background: #fff; border: 1px solid var(--linha); border-radius: 10px;
  padding: 8px 11px; font-size: 13.5px; line-height: 1.5; color: #2f3d55;
  white-space: pre-wrap; word-break: break-word; }
.chat-msg .meta { font-size: 10.5px; color: var(--suave); margin: 3px 2px 0; }
.chat-msg .meta a { color: var(--suave); margin-left: 6px; }
.chat-msg.minha { margin-left: auto; }
.chat-msg.minha .balao { background: var(--navy); border-color: var(--navy); color: #f4efe6; }
.chat-msg.minha .meta { text-align: right; }
.chat-msg.alerta .balao { background: #fdf3f4; border-color: #e6b9c0; color: #7d2033; }
.chat-envio { display: flex; gap: 7px; padding: 9px; border-top: 1px solid var(--linha); }
.chat-envio textarea { flex: 1; min-height: 38px; max-height: 110px; resize: none;
  font-size: 13.5px; padding: 8px 10px; }
.chat-envio .acao { padding: 0 14px; font-size: 16px; }
.chat-chamar { border: none; border-top: 1px solid var(--linha); background: #fdf3f4;
  color: #7d2033; padding: 8px; font-size: 12px; cursor: pointer; width: 100%; }
.chat-chamar:hover { background: #f8e7ea; }

.chat-uso-linha { padding: 11px 12px; border-bottom: 1px solid var(--borda); }
.chat-uso-linha .topo { display: flex; align-items: center; gap: 8px; }
.chat-uso-linha b { color: var(--navy); font-size: 13.5px; flex: 1; }
.chat-uso-linha .sub { font-size: 11.5px; color: var(--suave); margin-top: 3px; }
.chat-uso-linha .barra { height: 6px; background: var(--superficie); border-radius: 3px;
  overflow: hidden; margin: 6px 0 3px; }
.chat-uso-linha .barra div { height: 100%; }
.chat-nivel { font-size: 10px; letter-spacing: .6px; text-transform: uppercase;
  border: 1px solid var(--linha); border-radius: 3px; padding: 1px 6px; white-space: nowrap; }

/* aviso de atenção: cobre a tela toda, em qualquer aba do sistema */
.chat-atencao { position: fixed; inset: 0; z-index: 9999; background: rgba(13,27,53,.92);
  display: flex; align-items: center; justify-content: center; padding: 24px;
  animation: pulsa 1.1s ease-in-out infinite alternate; }
@keyframes pulsa { from { background: rgba(13,27,53,.92); } to { background: rgba(90,20,35,.94); } }
.chat-atencao .caixa { background: #fff; border-radius: 10px; padding: 30px 32px;
  max-width: 460px; width: 100%; text-align: center; }
.chat-atencao h2 { font-family: var(--serif, Georgia, serif); color: var(--navy);
  font-size: 25px; margin-bottom: 8px; }
.chat-atencao p { color: #2f3d55; font-size: 15px; line-height: 1.6; white-space: pre-wrap; }
.chat-atencao .quem { font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--suave); margin-bottom: 14px; }

@media (max-width: 640px) {
  .chat-caixa { right: 10px; left: 10px; width: auto; bottom: 80px;
    height: min(70vh, calc(100vh - 110px)); }
  .chat-bolha { right: 14px; bottom: 14px; }
}

/* ============ WhatsApp da clínica ============ */
.wa-app { display: grid; grid-template-columns: 340px 1fr;
  height: calc(100vh - 250px); min-height: 460px;
  border: 1px solid #d7dbdf; border-radius: 8px; overflow: hidden; background: #fff; }

.wa-lado { display: flex; flex-direction: column; border-right: 1px solid #d7dbdf;
  background: #fff; min-width: 0; }
.wa-lado-topo { display: flex; align-items: center; gap: 8px; padding: 10px 12px;
  background: #f0f2f5; border-bottom: 1px solid #d7dbdf; }
.wa-perfil { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.wa-perfil b { display: block; font-size: 13.5px; color: #111b21; }
.wa-perfil span { font-size: 11.5px; color: #667781; }
.wa-icone { background: none; border: none; color: #54656f; font-size: 17px;
  cursor: pointer; padding: 4px 7px; border-radius: 50%; }
.wa-icone:hover { background: #e3e6e8; }

.wa-avatar { width: 40px; height: 40px; border-radius: 50%; background: #dfe5e7;
  color: #54656f; display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 600; flex: none; }
.wa-avatar.wa-eu { background: #25d366; color: #fff; }

.wa-busca { padding: 7px 10px; background: #fff; border-bottom: 1px solid #f0f2f5; }
.wa-busca input { width: 100%; border: none; background: #f0f2f5; border-radius: 8px;
  padding: 8px 12px; font-size: 13.5px; }
.wa-busca input:focus { outline: 1px solid #d7dbdf; }

.wa-conversas { flex: 1; overflow-y: auto; }
.wa-conversa { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
  padding: 10px 12px; border: none; background: none; cursor: pointer; font: inherit;
  border-bottom: 1px solid #f0f2f5; }
.wa-conversa:hover { background: #f5f6f6; }
.wa-conversa.ativa { background: #f0f2f5; }
.wa-conversa-txt { flex: 1; min-width: 0; }
.wa-linha1 { display: flex; align-items: baseline; gap: 8px; }
.wa-linha1 b { flex: 1; font-size: 14px; color: #111b21; font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-linha1 span { font-size: 11.5px; color: #667781; flex: none; }
.wa-linha2 { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.wa-linha2 span { flex: 1; font-size: 12.5px; color: #667781;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-linha2 i { background: #25d366; color: #fff; font-style: normal; font-size: 11px;
  min-width: 19px; height: 19px; border-radius: 10px; display: flex;
  align-items: center; justify-content: center; padding: 0 5px; }

.wa-painel { display: flex; flex-direction: column; min-width: 0; background: #efeae2; }
.wa-painel-topo { display: flex; align-items: center; gap: 12px; padding: 9px 16px;
  background: #f0f2f5; border-bottom: 1px solid #d7dbdf; }
.wa-painel-topo b { display: block; font-size: 14.5px; color: #111b21; }
.wa-painel-topo span { font-size: 11.5px; color: #667781; }

.wa-fluxo { flex: 1; overflow-y: auto; padding: 18px 7%; }
.wa-msg { display: flex; margin-bottom: 5px; }
.wa-msg.minha { justify-content: flex-end; }
.wa-balao { position: relative; max-width: 65%; background: #fff; border-radius: 8px;
  padding: 6px 54px 7px 9px; font-size: 14.2px; line-height: 1.42; color: #111b21;
  box-shadow: 0 1px .5px rgba(11,20,26,.13); white-space: pre-wrap; word-break: break-word; }
.wa-msg.minha .wa-balao { background: #d9fdd3; }
.wa-hora { position: absolute; right: 9px; bottom: 5px; font-size: 11px; color: #667781; }
.wa-midia { color: #667781; }

.wa-envio { display: flex; align-items: flex-end; gap: 8px; padding: 9px 14px;
  background: #f0f2f5; }
.wa-envio textarea { flex: 1; border: none; border-radius: 8px; padding: 10px 12px;
  font-size: 14px; resize: none; max-height: 110px; font-family: inherit; }
.wa-enviar { border: none; background: #25d366; color: #fff; width: 42px; height: 42px;
  border-radius: 50%; cursor: pointer; font-size: 16px; flex: none; }
.wa-enviar:hover { background: #1fb855; }

.wa-nenhuma { flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 24px; }
.wa-nenhuma-caixa { text-align: center; max-width: 360px; color: #667781; }
.wa-nenhuma-caixa b { display: block; color: #41525d; font-size: 20px;
  font-weight: 400; margin-bottom: 8px; }
.wa-nenhuma-caixa p { font-size: 13.5px; line-height: 1.6; }
.wa-vazio { padding: 30px 16px; text-align: center; color: #667781; font-size: 13px; }

.wa-conexao { display: flex; justify-content: center; padding: 26px 0; }
.wa-conexao-caixa { background: #fff; border: 1px solid var(--linha); border-radius: 10px;
  padding: 32px; max-width: 470px; width: 100%; text-align: center; }
.wa-conexao-caixa h3 { font-family: var(--serif, Georgia, serif); color: var(--navy);
  font-size: 23px; margin: 8px 0 10px; }
.wa-conexao-caixa p { color: var(--suave); font-size: 13.5px; line-height: 1.6; }
.wa-qr { width: 260px; height: 260px; margin: 20px auto 0; display: block;
  border: 1px solid var(--linha); border-radius: 8px; padding: 8px; background: #fff; }
.wa-carregando { margin-top: 18px; color: var(--suave); font-size: 13px; }
.wa-nota { margin-top: 20px; font-size: 11.5px; color: var(--suave);
  border-top: 1px solid var(--linha); padding-top: 14px; }
.wa-aviso { background: #fdf3f4; border: 1px solid #e6b9c0; border-radius: 8px;
  padding: 24px; text-align: center; color: #7d2033; }
.wa-aviso b { display: block; margin-bottom: 6px; }
.wa-aviso p { font-size: 13.5px; margin-bottom: 14px; }

@media (max-width: 900px) {
  .wa-app { grid-template-columns: 1fr; height: auto; }
  .wa-lado { max-height: 260px; }
  .wa-painel { min-height: 420px; }
  .wa-fluxo { padding: 14px; }
  .wa-balao { max-width: 84%; }
}

/* ============ agenda em grade ============ */
.cal { background: #fff; border: 1px solid var(--linha); border-radius: 8px; overflow: hidden; }
.cal-topo { display: flex; align-items: center; gap: 8px; padding: 12px 14px;
  border-bottom: 1px solid var(--linha); flex-wrap: wrap; }
.cal-hoje { background: #fff; border: 1px solid #dadce0; border-radius: 4px;
  padding: 7px 15px; font-size: 13.5px; color: #3c4043; cursor: pointer; }
.cal-hoje:hover { background: #f1f3f4; }
.cal-seta { background: none; border: none; color: #5f6368; font-size: 21px; line-height: 1;
  cursor: pointer; padding: 2px 9px; border-radius: 50%; }
.cal-seta:hover { background: #f1f3f4; }
.cal-titulo { font-size: 19px; color: #3c4043; margin-left: 6px; flex: 1; }
.cal-vistas { display: flex; border: 1px solid #dadce0; border-radius: 4px; overflow: hidden; }
.cal-vista { background: #fff; border: none; padding: 7px 14px; font-size: 13px;
  color: #3c4043; cursor: pointer; border-right: 1px solid #dadce0; }
.cal-vista:last-child { border-right: none; }
.cal-vista:hover { background: #f1f3f4; }
.cal-vista.ativa { background: #e8f0fe; color: #1a73e8; font-weight: 500; }

.cal-cabecalho { display: grid; grid-template-columns: 62px repeat(auto-fit, minmax(0, 1fr));
  border-bottom: 1px solid #dadce0; }
.cal-fuso { font-size: 10px; color: #70757a; padding: 8px 6px; align-self: end; text-align: center; }
.cal-dia-cab { text-align: center; padding: 6px 4px 8px; border-left: 1px solid #e8eaed; }
.cal-dia-nome { display: block; font-size: 10.5px; letter-spacing: .8px; color: #70757a; }
.cal-dia-nome.hoje { color: #1a73e8; }
.cal-dia-num { display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%; font-size: 22px; color: #3c4043; margin-top: 2px; }
.cal-dia-num.hoje { background: #1a73e8; color: #fff; }

.cal-rolagem { max-height: 62vh; overflow-y: auto; }
.cal-grade { display: grid; grid-template-columns: 62px repeat(auto-fit, minmax(0, 1fr));
  position: relative; }
.cal-horas { position: relative; }
.cal-hora { position: relative; border-top: 1px solid #e8eaed; }
.cal-hora span { position: absolute; top: -8px; right: 8px; font-size: 10.5px; color: #70757a;
  background: #fff; padding: 0 2px; }
.cal-hora:first-child span { display: none; }
.cal-coluna { position: relative; border-left: 1px solid #e8eaed; }
.cal-coluna.hoje { background: #f8fbff; }
.cal-celula { border-top: 1px solid #e8eaed; cursor: pointer; }
.cal-celula:hover { background: rgba(26,115,232,.06); }
.cal-agora { position: absolute; left: 0; right: 0; height: 2px; background: #ea4335; z-index: 3; }
.cal-agora::before { content: ''; position: absolute; left: -5px; top: -4px; width: 10px;
  height: 10px; border-radius: 50%; background: #ea4335; }

.cal-evento { position: absolute; z-index: 2; border: none; border-radius: 4px;
  color: #fff; text-align: left; padding: 3px 6px; cursor: pointer; overflow: hidden;
  font: inherit; line-height: 1.25; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.cal-evento:hover { filter: brightness(1.08); }
.cal-evento b { display: block; font-size: 11.5px; font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-evento span { display: block; font-size: 11px; opacity: .9;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-evento.cancelado { text-decoration: line-through; opacity: .75; }

.cal-fora { padding: 12px 14px; border-top: 1px solid var(--linha); font-size: 12px;
  color: var(--suave); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cal-chip { background: var(--superficie); border: 1px solid var(--linha); border-radius: 12px;
  padding: 4px 11px; font-size: 12px; cursor: pointer; color: var(--navy); }
.cal-lista { padding: 14px; }
.cal-lista-cab { font-size: 12.5px; color: var(--suave); margin-bottom: 10px; }

.ficha-linha { display: flex; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--borda);
  font-size: 13.5px; color: #2f3d55; }
.ficha-linha .eyebrow { min-width: 108px; flex: none; }

@media (max-width: 820px) {
  .cal-cabecalho, .cal-grade { grid-template-columns: 46px repeat(auto-fit, minmax(0, 1fr)); }
  .cal-dia-num { width: 30px; height: 30px; font-size: 17px; }
  .cal-titulo { font-size: 16px; width: 100%; order: 9; }
  .cal-rolagem { max-height: 58vh; }
}

/* ============ planilha do relatório diário ============ */
.planilha-caixa { overflow: auto; border: 1px solid var(--linha); border-radius: 6px; max-height: 62vh; }
.planilha { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13.5px; }
.planilha th, .planilha td { padding: 0; border-bottom: 1px solid var(--borda);
  border-right: 1px solid var(--borda); }
.planilha thead th { position: sticky; top: 0; z-index: 3; background: var(--superficie);
  padding: 9px 10px; font-size: 11px; letter-spacing: .6px; text-transform: uppercase;
  color: var(--suave); font-weight: 500; text-align: right; white-space: nowrap; }
.planilha thead th.col-dia { text-align: left; }
.planilha th.conv, .planilha td.conv { background: #fbf8f1; }
.planilha thead th.conv { background: #f6efdf; color: #8a6d1f; }
.planilha .col-dia { position: sticky; left: 0; z-index: 2; background: #fff;
  padding: 7px 10px; white-space: nowrap; color: var(--navy); font-weight: 500; }
.planilha thead .col-dia { z-index: 4; background: var(--superficie); }
.planilha .col-dia span { color: var(--suave); font-weight: 400; font-size: 11px; margin-left: 5px; }
.planilha tbody tr.fds .col-dia { color: var(--suave); }
.planilha tbody tr.fds { background: #fbfbfa; }
.planilha tbody tr.hoje .col-dia { box-shadow: inset 3px 0 0 var(--gold, #c9a050); }
.planilha td.num { text-align: right; }
.planilha td.conv { padding: 7px 10px; color: #8a6d1f; font-weight: 500; }
.planilha input.cel { width: 100%; border: none; background: none; text-align: right;
  padding: 7px 10px; font: inherit; color: #2f3d55; }
.planilha input.cel:focus { outline: 2px solid #1a73e8; outline-offset: -2px; background: #f4f8ff; }
.planilha input.cel.erro { background: #fdf3f4; }
.planilha input.cel::-webkit-outer-spin-button,
.planilha input.cel::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.planilha tfoot td { position: sticky; bottom: 0; background: var(--navy); color: #f4efe6;
  padding: 9px 10px; font-weight: 600; border-bottom: none; }
.planilha tfoot td.col-dia { background: var(--navy); color: #f4efe6; z-index: 3; }
.planilha tfoot td.conv { background: #16294a; color: #e8c87a; }
.planilha-nota { font-size: 12px; color: var(--suave); margin-top: 10px; }
.salvo-ok { color: var(--verde, #2f8f6b); }
.salvo-erro { color: var(--vermelho, #a63a4e); }
.kpi.destaque b { color: #8a6d1f; }

/* janela de preenchimento do relatório diário */
.janela { display: flex; gap: 16px; align-items: center; flex-wrap: wrap;
  border: 1px solid var(--linha); border-radius: 8px; padding: 12px 16px; margin-bottom: 14px; }
.janela.aberto { background: #f2faf6; border-color: #bfe3d0; }
.janela.fechado { background: #faf7f0; border-color: var(--linha); }
.janela-estado { min-width: 240px; }
.janela-estado b { display: block; font-size: 14.5px; color: var(--navy); }
.janela.aberto .janela-estado b { color: #1e7a54; }
.janela-estado span { font-size: 12.5px; color: var(--suave); }
.janela-aviso { flex: 1; min-width: 260px; font-size: 12.5px; color: var(--suave);
  line-height: 1.6; border-left: 1px solid var(--linha); padding-left: 16px; }
.janela-aviso b { color: var(--navy); }
.planilha input.cel[readonly] { color: var(--suave); background: #fbfbfa; cursor: not-allowed; }

/* ============ títulos no molde ERP ============ */
.erp { font-size: 12.5px; color: #333; }
.erp-titulo { font-size: 21px; color: #1f3864; text-transform: uppercase;
  letter-spacing: .4px; margin-bottom: 4px; font-weight: 400; }
.erp-migalha { font-size: 12px; margin-bottom: 14px; display: flex; gap: 10px; }
.erp-migalha a { color: #1f3864; text-decoration: none; }
.erp-migalha a:hover { text-decoration: underline; }
.erp-migalha span { color: #666; border-left: 1px solid #ccc; padding-left: 10px; }

.erp-secao { background: #fff; border: 1px solid #d5d9e0; margin-bottom: 14px; padding: 0 0 12px; }
.erp-secao-cab { font-size: 12.5px; color: #1f3864; text-transform: uppercase;
  letter-spacing: .3px; padding: 10px 14px 8px; border-bottom: 2px solid #1f3864;
  margin: 0 14px 14px; display: flex; align-items: center; gap: 8px; }
.erp-secao-cab.recolhe { cursor: pointer; }
.erp-secao-cab i { font-style: normal; color: #1f3864; font-size: 11px; }
.erp-consistencia { text-align: right; font-size: 12px; color: #666; padding: 10px 16px 0; }
.erp-consistencia b { color: #d98c00; font-weight: 500; }

.erp-form { padding: 0 16px; }
.erp-form.erp-duplo { display: grid; grid-template-columns: 1fr 1fr; column-gap: 26px; }
.erp-linha { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.erp-rot { width: 190px; flex: none; text-align: right; font-size: 12.5px; color: #333; }
.erp-rot i { color: #c00; font-style: normal; }
.erp-campo { flex: 1; display: flex; align-items: center; gap: 6px; min-width: 0; }
.erp-entre { font-size: 12.5px; color: #333; }
.erp-entre i { color: #c00; font-style: normal; }

.erp input, .erp select, .erp textarea { border: 1px solid #7f9db9; border-radius: 0;
  padding: 3px 5px; font-size: 12.5px; font-family: inherit; color: #333; background: #fff;
  height: 24px; }
.erp textarea { height: auto; resize: vertical; }
.erp input:focus, .erp select:focus, .erp textarea:focus { outline: none; border-color: #1f3864;
  background: #f5f9ff; }
.erp input:disabled, .erp select:disabled { background: #e9ecef; color: #555; }
.erp .erp-mini { width: 92px; }
.erp .erp-medio { width: 210px; }
.erp .erp-data { width: 128px; }
.erp .erp-largo { flex: 1; min-width: 0; }
.erp .num { text-align: right; }
.erp-opcoes { padding: 4px 16px 0 198px; display: flex; flex-direction: column; gap: 5px; }
.erp-opcoes label { display: flex; align-items: center; gap: 6px; font-size: 12.5px; }
.erp-opcoes input { height: auto; }

.erp-botoes { display: flex; justify-content: flex-end; gap: 6px; padding: 10px 16px 0; }
.erp-botoes.rodape { padding-bottom: 20px; }
.erp-btn { background: #e9ecef; border: 1px solid #adb5bd; color: #333; padding: 5px 16px;
  font-size: 12px; text-transform: uppercase; letter-spacing: .3px; cursor: pointer; }
.erp-btn:hover { background: #dee2e6; }
.erp-btn.primario { background: #1f3864; border-color: #1f3864; color: #fff; }
.erp-btn.primario:hover { background: #16294a; }
.erp-btn.mini { padding: 2px 8px; }

.erp-grade { width: 100%; border-collapse: collapse; margin: 0 0 0; }
.erp-grade th { background: #fff; border-bottom: 1px solid #c8ccd4; text-align: left;
  padding: 6px 10px; font-size: 11.5px; color: #555; font-weight: 600; }
.erp-grade th.num { text-align: right; }
.erp-grade td { padding: 6px 10px; border-bottom: 1px solid #eceef1; font-size: 12.5px; }
.erp-grade td.num { text-align: right; }
.erp-grade tbody tr[data-abre] { cursor: pointer; }
.erp-grade tbody tr[data-abre]:hover { background: #eef4fd; }
.erp-grade .erp-sub { color: #888; font-size: 11px; margin-left: 6px; }
.erp-grade .erp-lupa { color: #1f3864; font-size: 11.5px; }
.erp-grade .erp-vazio { color: #888; text-align: center; padding: 22px; }
.erp-grade.rateio input { width: 100%; }
.erp-rodape { background: #c9ccd1; padding: 5px 12px; display: flex; align-items: center;
  gap: 16px; font-size: 11.5px; color: #333; }
.erp-rodape span:last-of-type { margin-left: auto; }
.erp-rodape .erp-btn { margin-left: auto; }

@media (max-width: 900px) {
  .erp-rot { width: 120px; font-size: 12px; }
  .erp-form.erp-duplo { grid-template-columns: 1fr; }
  .erp-secao { overflow-x: auto; }
}

/* ============ textos e galeria da clínica ============ */
.textos { display: flex; flex-direction: column; gap: 14px; }
.texto-cartao { border: 1px solid var(--linha); border-radius: 8px; background: #fff;
  display: flex; flex-direction: column; overflow: hidden; }
.texto-cab { display: flex; align-items: center; gap: 6px; padding: 10px 12px;
  border-bottom: 1px solid var(--borda); background: var(--superficie); }
.texto-cab b { flex: 1; color: var(--navy); font-size: 14px; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.texto-cab .leve { padding: 3px 9px; font-size: 11.5px; }
.texto-corpo { padding: 14px 16px; font-size: 13.5px; line-height: 1.7; color: #2f3d55;
  white-space: pre-wrap; max-height: 340px; overflow-y: auto; flex: 1; }
.texto-corpo i { color: var(--suave); }
.texto-pe { padding: 8px 12px; border-top: 1px solid var(--borda); font-size: 11px;
  color: var(--suave); }

.galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(146px, 1fr)); gap: 12px; }
.galeria-item { border: 1px solid var(--linha); border-radius: 8px; overflow: hidden;
  background: #fff; display: flex; flex-direction: column; }
.galeria-titulo { display: flex; align-items: center; gap: 4px; padding: 7px 6px 7px 9px;
  border-bottom: 1px solid var(--borda); background: var(--superficie); }
.galeria-titulo b { flex: 1; min-width: 0; font-size: 12px; color: var(--navy);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.galeria-titulo .leve { padding: 1px 7px; font-size: 12px; flex: none; }
.galeria-item a { display: block; height: 116px; background: var(--superficie); }
.galeria-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.galeria-arquivo { height: 100%; display: flex; align-items: center; justify-content: center;
  font-size: 34px; color: var(--suave); }
.galeria-nome { padding: 7px 9px 3px; font-size: 11.5px; color: var(--navy);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.galeria-pe { display: flex; align-items: center; padding: 0 9px 8px; font-size: 10.5px;
  color: var(--suave); }
.galeria-pe .leve { margin-left: auto; padding: 1px 8px; font-size: 12px; }

/* divisor entre atividades do GH e tarefas da clínica */
.divisor { border-left: 3px solid var(--navy); background: var(--superficie);
  padding: 14px 18px; margin: 22px 0 14px; border-radius: 0 8px 8px 0; }
.divisor.tarefas { border-left-color: var(--gold, #c9a050); margin-top: 32px; }
.divisor-faixa { font-family: var(--serif, Georgia, serif); font-size: 19px;
  color: var(--navy); margin-bottom: 4px; }
.divisor p { font-size: 12.5px; color: var(--suave); line-height: 1.6; max-width: 720px; }
.divisor .acao { margin-top: 12px; }
.planilha .col-fecha { text-align: center; padding: 6px 10px; white-space: nowrap; }
.planilha thead th.col-fecha { text-align: center; }
.planilha tfoot td.col-fecha { text-align: center; }
.planilha tbody tr.fechado { background: #f4faf7; }
.planilha tbody tr.fechado .col-dia { color: #1e7a54; }
.acao.mini { padding: 4px 11px; font-size: 12px; }
.planilha .col-fecha .leve { padding: 2px 8px; margin-left: 4px; }

/* ============ indicadores e perfil ============ */
.ind-perfil { display: flex; align-items: center; gap: 16px; background: #fff;
  border: 1px solid var(--linha); border-radius: 8px; padding: 16px 18px; margin-bottom: 16px;
  flex-wrap: wrap; }
.ind-foto { width: 62px; height: 62px; border-radius: 50%; object-fit: cover; flex: none;
  border: 2px solid var(--linha); }
.ind-foto.vazio { display: flex; align-items: center; justify-content: center;
  background: var(--navy); color: #f4efe6; font-size: 20px; font-weight: 600; border: none; }
.ind-quem { flex: 1; min-width: 220px; }
.ind-quem b { display: block; font-family: var(--serif, Georgia, serif); font-size: 21px;
  color: var(--navy); }
.ind-quem > span { font-size: 12.5px; color: var(--suave); }
.ind-acoes { display: flex; gap: 8px; align-items: center; }
.ind-humor { display: flex; align-items: center; gap: 5px; margin-top: 8px; flex-wrap: wrap; }
.ind-humor-rot { font-size: 11.5px; color: var(--suave); margin-right: 3px; }
.ind-humor-nome { font-size: 12px; color: var(--suave); margin-left: 6px; }
.humor { background: none; border: 1px solid transparent; border-radius: 50%; font-size: 19px;
  cursor: pointer; padding: 3px 5px; line-height: 1; filter: grayscale(1); opacity: .55; }
.humor:hover { filter: none; opacity: 1; }
.humor.ativo { filter: none; opacity: 1; border-color: var(--gold, #c9a050);
  background: #fdf8ee; }

.ind-cartao { background: #fff; border: 1px solid var(--linha); border-radius: 8px;
  padding: 14px 16px; }
.ind-cartao.destaque { border-color: var(--navy); box-shadow: inset 3px 0 0 var(--navy); }
.ind-numeros { display: flex; gap: 18px; margin-top: 10px; flex-wrap: wrap; }
.ind-numeros b { display: block; font-family: var(--serif, Georgia, serif); font-size: 25px;
  color: var(--navy); line-height: 1.1; }
.ind-numeros span { font-size: 11px; color: var(--suave); }
.ind-numeros .conv b { color: #8a6d1f; }
.ind-linha-quem { display: flex; align-items: center; gap: 9px; }
.ind-linha-quem .ind-foto { width: 34px; height: 34px; border-width: 1px; font-size: 12px; }
.ind-linha-quem i { display: block; font-style: normal; font-size: 11.5px; color: var(--suave); }

/* chave liga/desliga */
.chave { display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  vertical-align: middle; }
.chave input { position: absolute; opacity: 0; width: 0; height: 0; }
.chave-trilho { width: 34px; height: 19px; background: #c9c3b4; border-radius: 10px;
  position: relative; transition: background .15s; flex: none; }
.chave-trilho::after { content: ''; position: absolute; top: 2px; left: 2px;
  width: 15px; height: 15px; border-radius: 50%; background: #fff; transition: left .15s; }
.chave input:checked + .chave-trilho { background: #2f8f6b; }
.chave input:checked + .chave-trilho::after { left: 17px; }
.chave-rot { font-size: 12px; color: var(--suave); white-space: nowrap; }

.opcoes-clinicas { display: flex; flex-wrap: wrap; }
.opcoes-clinicas .opcao { font-size: 13px; }

/* ============ barra de formatação de texto ============ */
.barra-fmt { display: flex; align-items: center; gap: 4px; background: var(--superficie);
  border: 1px solid var(--linha); border-bottom: none; border-radius: 6px 6px 0 0;
  padding: 5px 7px; }
.barra-fmt + textarea { border-radius: 0 0 6px 6px; margin-top: 0 !important; }
.fmt-btn { background: #fff; border: 1px solid var(--linha); border-radius: 4px;
  width: 26px; height: 24px; font-size: 13px; color: var(--navy); cursor: pointer;
  display: flex; align-items: center; justify-content: center; padding: 0; }
.fmt-btn:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.fmt-sep { width: 1px; height: 18px; background: var(--linha); margin: 0 3px; }
.fmt-tam { border: 1px solid var(--linha); border-radius: 4px; font-size: 12px;
  padding: 2px 4px; height: 24px; color: var(--navy); background: #fff; }
.fmt-nota { font-size: 11px; color: var(--suave); margin-left: 6px; }
.texto-corpo h3, .texto-corpo h4 { color: var(--navy); margin: 10px 0 6px; }
.texto-corpo h3:first-child, .texto-corpo h4:first-child { margin-top: 0; }
.texto-corpo p { margin-bottom: 10px; }
.texto-corpo p:last-child { margin-bottom: 0; }

/* ============ quadro de cartões ============ */
.quadro-rolagem { overflow-x: auto; padding-bottom: 12px; }
.quadro { display: flex; align-items: flex-start; gap: 12px; min-height: 60vh; }
.q-lista { background: #f1f2f4; border-radius: 10px; width: 286px; flex: none;
  display: flex; flex-direction: column; max-height: 72vh; }
.q-lista-topo { display: flex; align-items: center; gap: 6px; padding: 9px 10px 5px; }
.q-lista-titulo { flex: 1; min-width: 0; border: 1px solid transparent; background: none;
  font-size: 14px; font-weight: 600; color: var(--navy); padding: 3px 6px; border-radius: 4px; }
.q-lista-titulo:hover { background: #e4e6ea; }
.q-lista-titulo:focus { background: #fff; border-color: #1a73e8; outline: none; }
.q-lista-qtd { font-size: 11.5px; color: var(--suave); background: #e4e6ea;
  border-radius: 9px; padding: 1px 7px; flex: none; }
.q-lista-menu { background: none; border: none; color: var(--suave); font-size: 17px;
  cursor: pointer; padding: 0 5px; border-radius: 4px; line-height: 1; }
.q-lista-menu:hover { background: #e4e6ea; color: var(--vermelho, #a63a4e); }

.q-cartoes { flex: 1; overflow-y: auto; padding: 4px 8px; min-height: 12px; }
.q-cartoes.sobre { background: #e0e6ef; border-radius: 6px; }
.q-cartao { background: #fff; border-radius: 8px; box-shadow: 0 1px 1px rgba(9,30,66,.25);
  padding: 8px 10px; margin-bottom: 8px; cursor: pointer; position: relative; }
.q-cartao:hover { background: #f7f8f9; }
.q-cartao.arrastando { opacity: .45; transform: rotate(2deg); }
.q-cartao.feito .q-cartao-titulo { text-decoration: line-through; color: var(--suave); }
.q-etiqueta { display: block; width: 42px; height: 8px; border-radius: 4px; margin-bottom: 6px; }
.q-etiqueta.grande { width: 60px; height: 10px; margin-bottom: 10px; }
.q-cartao-titulo { font-size: 13.5px; line-height: 1.4; color: #172b4d; word-break: break-word; }
.q-cartao-pe { display: flex; align-items: center; gap: 9px; margin-top: 7px;
  font-size: 11.5px; color: var(--suave); flex-wrap: wrap; }
.q-cartao-pe:empty { display: none; }
.q-prazo.venceu { background: #fdecee; color: #a63a4e; border-radius: 4px; padding: 1px 5px; }
.q-itens.completo { color: #2f8f6b; }
.q-add { background: none; border: none; text-align: left; padding: 8px 12px 10px;
  color: var(--suave); font-size: 13px; cursor: pointer; border-radius: 0 0 10px 10px; }
.q-add:hover { background: #e4e6ea; color: var(--navy); }
.quadro-nova { background: rgba(241,242,244,.7); border-radius: 10px; width: 286px;
  flex: none; padding: 9px; }
.quadro-nova input { width: 100%; border: none; background: none; font-size: 13.5px;
  color: var(--navy); padding: 5px 4px; }
.quadro-nova input:focus { background: #fff; border-radius: 5px; outline: 1px solid #1a73e8; }

.q-cores { display: flex; gap: 7px; flex-wrap: wrap; }
.q-cor { width: 42px; height: 26px; border-radius: 5px; border: 2px solid transparent;
  cursor: pointer; background: #e4e6ea; color: var(--suave); font-size: 12px; }
.q-cor.ativa { border-color: var(--navy); box-shadow: 0 0 0 2px #fff inset; }
.q-ficha-meta { font-size: 12.5px; color: var(--suave); margin-bottom: 12px; }
.q-venceu { color: #a63a4e; }
.q-ficha-desc { background: var(--superficie); border: 1px solid var(--linha);
  border-radius: 6px; padding: 12px; font-size: 13.5px; line-height: 1.6;
  white-space: pre-wrap; color: #2f3d55; }
.q-ficha-desc.vazia { color: var(--suave); font-style: italic; }
.q-item { display: flex; align-items: center; gap: 8px; padding: 5px 0;
  font-size: 13.5px; border-bottom: 1px solid var(--borda); }
.q-item span { flex: 1; }
.q-item.feito span { text-decoration: line-through; color: var(--suave); }
.q-item .leve { padding: 1px 8px; }

/* selo de lembrete na página inicial */
.selo-lembrete { display: flex; align-items: center; gap: 11px; width: 100%;
  background: #fdf8ee; border: 1px solid #e8d4a8; border-radius: 8px;
  padding: 9px 14px; margin-bottom: 14px; cursor: pointer; text-align: left; font: inherit; }
.selo-lembrete:hover { background: #fbf2e0; }
.selo-lembrete.pisca { animation: seloPisca 1.6s ease-in-out infinite; }
@keyframes seloPisca {
  0%, 100% { background: #fdf8ee; border-color: #e8d4a8; }
  50% { background: #fdecee; border-color: #e6b9c0; }
}
.selo-sino { font-size: 17px; flex: none; }
.selo-txt { flex: 1; min-width: 0; }
.selo-txt b { display: block; font-size: 13px; color: var(--navy); }
.selo-txt span { display: block; font-size: 12px; color: var(--suave);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.selo-vencidos { background: #a63a4e; color: #fff; font-size: 11px; border-radius: 10px;
  padding: 2px 9px; flex: none; }
.lembrete-linha { display: flex; align-items: center; gap: 12px; padding: 10px 0;
  border-bottom: 1px solid var(--borda); }
.lembrete-linha > div:first-child { flex: 1; min-width: 0; }
.lembrete-linha b { display: block; font-size: 13.5px; color: var(--navy); }
.lembrete-linha span { font-size: 11.5px; color: var(--suave); }
.lembrete-prazo { font-size: 12px; color: var(--suave); white-space: nowrap; }
.lembrete-linha.venceu .lembrete-prazo { color: #a63a4e; font-weight: 500; }

@media (max-width: 820px) {
  .q-lista, .quadro-nova { width: 250px; }
}

/* ---------- relatórios da clínica: meses que abrem e fecham, ações enxutas ---------- */
.rel-mes{border-bottom:1px solid var(--linha)}
.rel-mes>summary{list-style:none;display:flex;align-items:center;gap:10px;padding:12px 2px;cursor:pointer;
  user-select:none}
.rel-mes>summary::-webkit-details-marker{display:none}
.rel-mes>summary::before{content:'›';display:inline-block;width:10px;color:var(--gold);font-size:17px;
  line-height:1;transition:transform .15s}
.rel-mes[open]>summary::before{transform:rotate(90deg)}
.rel-mes>summary:hover .rel-mes-nome{color:var(--navy)}
.rel-mes-nome{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;font-weight:600;color:var(--rotulo)}
.rel-mes-info{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:12px;color:var(--suave)}
.rel-mes[open] .rel-mes-info{opacity:.75}
.rel-mes table{margin:0 0 10px}
td.rel-acoes{text-align:right;white-space:nowrap}
td.rel-acoes a.leve{text-decoration:none;padding:6px 12px}
td.rel-acoes>*+*{margin-left:4px}
.rel-mais{display:inline-block;position:relative;vertical-align:middle}
.rel-mais>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:32px;border:1px solid var(--linha);border-radius:4px;background:#fff;color:var(--rotulo);
  font-size:18px;line-height:1}
.rel-mais>summary::-webkit-details-marker{display:none}
.rel-mais>summary:hover,.rel-mais[open]>summary{border-color:var(--navy);color:var(--navy)}
/* O menu só existe quando aberto. Sem esta linha, o "display:flex" abaixo
   vence o recolhimento do <details> e o menu fica desenhado por cima da tela,
   invisível mas capturando os cliques da página inteira. */
.rel-mais:not([open]) .rel-menu{display:none}
.rel-menu{position:absolute;right:0;top:calc(100% + 4px);z-index:30;min-width:170px;padding:4px;
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--linha);border-radius:6px;
  box-shadow:0 10px 28px rgba(13,27,53,.14);text-align:left}
.rel-menu button{background:none;border:none;border-radius:4px;padding:8px 12px;text-align:left;cursor:pointer;
  font:inherit;font-size:13px;color:var(--texto)}
.rel-menu button:hover{background:#f4f1ea;color:var(--navy)}
.rel-menu button.risco{color:var(--vermelho)}
@media(max-width:760px){td.rel-acoes{white-space:normal}.rel-mes-info .pilula{display:none}}

/* ---------- ficha de leads do relatório ---------- */
.lead-metricas{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:14px 0 18px}
.lead-num{background:var(--superficie);border:1px solid var(--linha);border-radius:8px;padding:10px 12px}
.lead-num b{display:block;font-size:22px;font-weight:600;color:var(--navy);line-height:1.2;
  font-variant-numeric:tabular-nums}
.lead-num span{font-size:10.5px;letter-spacing:1.1px;text-transform:uppercase;color:var(--suave)}
.lead-num.bom b{color:var(--verde)} .lead-num.baixo b{color:var(--vermelho)}

.lead-cartao{border:1px solid var(--linha);border-radius:8px;padding:12px 14px 14px;margin-bottom:10px;
  background:var(--superficie)}
.lead-cartao:hover{border-color:#cfd6df}
.lead-cabeca{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.lead-n{font-size:10.5px;letter-spacing:1.2px;color:var(--suave);font-weight:600}
.lead-rm{margin-left:auto;background:none;border:1px solid var(--linha);border-radius:4px;
  width:28px;height:26px;cursor:pointer;color:var(--suave);font-size:13px;line-height:1}
.lead-rm:hover{border-color:var(--vermelho);color:var(--vermelho)}
.lead-cartao .form{gap:8px 14px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.lead-cartao .form small{font-size:10.5px;color:var(--suave)}
.lead-cartao input,.lead-cartao select{padding:7px 9px}
/* o status é a informação que se lê de relance na lista inteira */
select.lead-status{border-left:3px solid var(--linha)}
select.lead-status.agendou{border-left-color:var(--verde);color:var(--verde)}
select.lead-status.perdido{border-left-color:var(--vermelho);color:var(--vermelho)}
select.lead-status.parou_valores,select.lead-status.parou_saudacao{border-left-color:var(--gold)}
select.lead-status.retorno_futuro{border-left-color:#7d8fa8}

/* ---------- tipografia: Outfit em tudo ---------- */
h1,h2,h3{letter-spacing:-.1px}
.barra-marca{font-weight:500;letter-spacing:.2px}
/* números grandes: sem itálico sintético, que a Outfit não tem */
.kpi b,.barras .val,.linha-din .calc,.assinatura .dir{font-style:normal;font-weight:600;
  font-variant-numeric:tabular-nums}
.kpi b{letter-spacing:-.4px}
.modelo-espiar{display:flex;gap:8px;align-items:center;margin-top:8px;font-size:12.5px}
.modelo-espiar input{width:auto}
input.fm-link{font-size:12px;font-family:ui-monospace,Menlo,Consolas,monospace;padding:6px 8px;
  min-width:220px;background:var(--superficie)}