@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* =========================================================================
   Venno Consultório — folha de estilo (refino 2026)
   Substitui assets/style.css. Usa os MESMOS nomes de classe que as páginas
   .asp já emitem: troque só este arquivo.

   Sistema
   - ação: petróleo #14566f   · marca: #0e3d4f (do logotipo)
   - verde: só em situação "atendido"; vermelho: só em bloqueio/perigo
   - raio: 10px cartões · 7px campos e botões · 999px pílulas de ação
   - grade de 4px; alturas 40px (desktop) e 48px (toque)
   ========================================================================= */

:root{
  --vn-marca:#0e3d4f;      --vn-petroleo:#14566f;     --vn-petroleo-esc:#0e3d4f;
  --vn-tint:#e6eef2;       --vn-tint-bd:#d5e3ea;
  --vn-tinta:#172129;      --vn-neutro:#7d8b96;       --vn-neutro-2:#4f5d69;
  --vn-fraco:#8e9aa4;      --vn-fraco-2:#a2adba;
  --vn-canvas:#eff2f4;     --vn-surface:#ffffff;      --vn-campo:#f5f8f9;
  --vn-linha:#e4eaee;      --vn-linha-2:#f0f4f6;      --vn-linha-3:#f4f7f8;
  --vn-cab:#f8fafb;
  --vn-sucesso:#20674a;    --vn-sucesso-bg:#e7f0ea;   --vn-sucesso-bd:#cfe3d7;
  --vn-atencao:#856016;    --vn-atencao-bg:#f4ecdc;   --vn-atencao-bd:#efe1c8;
  --vn-perigo:#a2483a;     --vn-perigo-bg:#f8ecea;    --vn-perigo-bd:#eeddd9;
  --vn-roxo:#574a86;       --vn-roxo-bg:#eceaf3;
  --vn-cinza-bg:#eef1f3;   --vn-cinza-tx:#5d6b77;
  --vn-raio:10px;          --vn-raio-sm:7px;          --vn-raio-pill:999px;
  --vn-sombra:0 1px 2px rgba(20,40,60,.03);
  --vn-lateral:252px;      --vn-topo:64px;
  /* compat. com nomes antigos usados em algumas páginas */
  --creme:var(--vn-canvas); --papel:var(--vn-surface); --tinta:var(--vn-tinta);
  --suave:var(--vn-neutro); --azul:var(--vn-petroleo); --azul-esc:var(--vn-petroleo-esc);
  --linha:var(--vn-linha); --erro:var(--vn-perigo);
  --vn-btn:var(--vn-petroleo); --vn-btn-esc:var(--vn-petroleo-esc);
}

*{box-sizing:border-box}
body{margin:0;font-family:'IBM Plex Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--vn-tinta);background:var(--vn-canvas);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--vn-petroleo);text-decoration:none}
a:hover{color:var(--vn-petroleo-esc);text-decoration:none}
::selection{background:#d5e3ea}
h1{font-size:26px;font-weight:600;letter-spacing:-.5px;margin:0 0 4px}
h2{font-weight:600}
img{max-width:100%}

/* números, códigos e horas em mono */
.tabela .ficha,.ag-hora,.v-data,.fila-tempo,.mc-dia a,.slot-livre,.slot-bloq,
.kpi-num,.p-hora,.fat-dt,.contatos-tabela .ct-fones a{font-family:'IBM Plex Mono',monospace}

/* marca (login) */
.marca{display:flex;align-items:center;gap:11px;font-size:18px;font-weight:600;color:var(--vn-tinta);letter-spacing:-.2px}
.marca .logo{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;
  background:var(--vn-marca);color:#fff;font-weight:700;font-size:18px}
.marca small{font-size:11px;color:var(--vn-neutro);font-weight:600;letter-spacing:.12em;text-transform:uppercase}

/* =========================================================================
   LOGIN
   ========================================================================= */
.tela-login{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--vn-canvas)}
.cartao-login{background:var(--vn-surface);padding:36px 34px;border-radius:12px;width:100%;max-width:380px;
  box-shadow:0 20px 50px rgba(20,48,64,.10);border:1px solid var(--vn-linha)}
.cartao-login .marca{justify-content:center;margin-bottom:4px}
.cartao-login h1{margin:.2rem 0 28px;text-align:center;font-size:10.5px;color:var(--vn-neutro);
  font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.cartao-login label{display:block;font-size:12px;font-weight:600;color:var(--vn-neutro-2);margin-bottom:16px}
.cartao-login input{width:100%;margin-top:6px;height:46px;padding:0 14px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);font:inherit;font-size:14.5px;background:var(--vn-campo);color:var(--vn-tinta)}
.cartao-login input:focus{outline:none;border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.cartao-login button{margin-top:6px;width:100%;height:48px;font-size:14.5px}
.erro{background:var(--vn-perigo-bg);color:var(--vn-perigo);padding:.6rem .8rem;border-radius:var(--vn-raio-sm);
  font-size:.88rem;margin:0 0 1rem;border:1px solid var(--vn-perigo-bd)}

/* =========================================================================
   LAYOUT: barra lateral fixa + topo fixo + conteúdo
   ========================================================================= */
.vn-side{position:fixed;top:0;left:0;bottom:0;width:var(--vn-lateral);background:var(--vn-surface);
  border-right:1px solid var(--vn-linha);display:flex;flex-direction:column;overflow-y:auto;z-index:20}
.vn-brand{display:flex;align-items:center;gap:11px;padding:26px 24px 22px;border-bottom:1px solid var(--vn-linha-2)}
.vn-brand .logo{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;
  background:var(--vn-marca);color:#fff;font-weight:700;font-size:18px;flex:none}
.vn-brand .vn-brand-nome{display:block;font-weight:600;font-size:16px;letter-spacing:-.2px;line-height:1.2}
.vn-brand .vn-brand-sub{display:block;font-size:10.5px;color:var(--vn-neutro);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.vn-navtit{padding:0;font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--vn-fraco);margin:24px 24px 8px}
.vn-nav{display:flex;flex-direction:column;gap:1px;padding:0 12px}
.vn-nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--vn-raio-sm);
  font-size:13.5px;font-weight:500;color:var(--vn-neutro-2);cursor:pointer;transition:background .12s,color .12s}
.vn-nav a svg{flex:none}
.vn-nav a:hover{background:var(--vn-linha-2);color:var(--vn-tinta)}
.vn-nav a.ativo{background:var(--vn-tint);color:var(--vn-marca);font-weight:600}
.vn-nav a .conta{margin-left:auto}
.vn-foot{margin-top:auto;padding:16px 20px;border-top:1px solid var(--vn-linha-2)}
.vn-user{display:flex;align-items:center;gap:12px}
.vn-user .ini{width:32px;height:32px;border-radius:50%;background:var(--vn-tint);color:var(--vn-marca);
  display:grid;place-items:center;font-weight:600;font-size:12.5px;flex:none}
.vn-user .vn-user-nome{display:block;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vn-user .vn-user-sub{display:block;font-size:11.5px;color:var(--vn-neutro);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vn-user .vn-user-info{min-width:0;flex:1;line-height:1.3;overflow:hidden}
.vn-sair{width:28px;height:28px;flex:none;border:0;background:transparent;border-radius:6px;cursor:pointer;
  color:var(--vn-fraco);display:grid;place-items:center}
.vn-sair:hover{background:var(--vn-linha-2);color:var(--vn-perigo)}

.vn-top{position:fixed;top:0;left:var(--vn-lateral);right:0;height:var(--vn-topo);z-index:15;
  background:var(--vn-surface);border-bottom:1px solid var(--vn-linha);
  display:flex;align-items:center;gap:24px;padding:0 40px}
.vn-top .vn-top-tit{font-size:16px;font-weight:600;letter-spacing:-.2px}
.vn-top .vn-spring{flex:1}
.vn-top .vn-search{position:relative;width:420px;max-width:38vw}
.vn-top .vn-search input{width:100%;height:40px;border:1px solid var(--vn-linha);background:var(--vn-campo);
  border-radius:var(--vn-raio-sm);padding:0 12px 0 36px;font:inherit;font-size:13.5px;outline:none;color:var(--vn-tinta)}
.vn-top .vn-search input:focus{border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.vn-top .vn-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--vn-fraco)}
.bip-toggle{background:transparent;border:0;font-size:17px;cursor:pointer;padding:.2rem .4rem;width:auto;
  line-height:1;border-radius:var(--vn-raio-sm);color:var(--vn-neutro)}
.bip-toggle:hover{background:var(--vn-linha-2)}
.bip-toggle.on{filter:none;color:var(--vn-petroleo)}

.conteudo{margin-left:var(--vn-lateral);max-width:none;padding:calc(var(--vn-topo) + 32px) 40px 48px}

/* =========================================================================
   BOTÕES
   ========================================================================= */
button{font-family:inherit}
.btn,button[type=submit]{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:var(--vn-petroleo);color:#fff;border:0;border-radius:var(--vn-raio-sm);padding:0 16px;height:40px;
  font-weight:600;font-size:13.5px;cursor:pointer;box-shadow:none;text-decoration:none}
.btn:hover,button[type=submit]:hover{background:var(--vn-petroleo-esc);color:#fff;text-decoration:none}
.btn-sec{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--vn-surface);
  color:#3f4d59;border:1px solid #dde5e9;border-radius:var(--vn-raio-sm);padding:0 16px;height:40px;
  font-weight:600;font-size:13.5px;cursor:pointer;text-decoration:none}
.btn-sec:hover{background:var(--vn-campo);color:#3f4d59;text-decoration:none}
.btn-perigo{width:auto;background:var(--vn-perigo-bg);color:var(--vn-perigo);border:1px solid var(--vn-perigo-bd);box-shadow:none}
.btn-perigo:hover{background:#f3ded9;color:var(--vn-perigo)}
/* "atender" e "chegou": pílula suave, não botão cheio */
.btn-atend,.bt-atender{display:inline-flex;align-items:center;justify-content:center;height:30px;padding:0 15px;
  background:var(--vn-tint);border:1px solid var(--vn-tint-bd);color:var(--vn-petroleo);border-radius:var(--vn-raio-pill);
  font-size:12.5px;font-weight:600;text-decoration:none;white-space:nowrap;box-shadow:none;cursor:pointer}
.btn-atend:hover,.bt-atender:hover{background:#dae7ee;color:var(--vn-petroleo-esc);text-decoration:none}

/* =========================================================================
   CABEÇALHO DE PÁGINA / BUSCA
   ========================================================================= */
.cabecalho-pagina{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:20px}
.cabecalho-pagina h1{margin:0}
.contador{font-size:13px;color:var(--vn-neutro);font-weight:500;background:transparent;padding:0 0 0 .5rem;border-radius:0}
.acoes-topo{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.busca{display:flex;gap:.5rem;align-items:center}
.busca input{height:44px;padding:0 14px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  min-width:320px;font:inherit;font-size:14px;background:var(--vn-surface);color:var(--vn-tinta)}
.busca input:focus{outline:none;border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.busca button{width:auto;height:44px}
.busca .limpar{color:var(--vn-neutro);font-size:.85rem}
.sub-h1{color:var(--vn-neutro-2);margin:-.2rem 0 1.2rem;font-size:14px}

/* =========================================================================
   TABELA
   ========================================================================= */
.tabela{width:100%;border-collapse:separate;border-spacing:0;background:var(--vn-surface);border-radius:var(--vn-raio);
  overflow:hidden;box-shadow:var(--vn-sombra);border:1px solid var(--vn-linha)}
.tabela th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--vn-fraco);
  font-weight:600;padding:11px 20px;background:var(--vn-cab);border-bottom:1px solid #eef2f4}
.tabela td{padding:12px 20px;border-bottom:1px solid var(--vn-linha-3);font-size:13.5px;vertical-align:middle}
.tabela tbody tr{cursor:pointer}
.tabela tbody tr:hover{background:#fafcfd}
.tabela tr:last-child td{border-bottom:0}
.tabela .ficha{color:var(--vn-fraco);font-size:13px}
.tabela .nome{font-weight:600;font-size:14px}
.tabela .nome a{color:var(--vn-tinta)}
.tabela .nome a:hover{color:var(--vn-petroleo)}
.tabela .cel-nome{display:flex;align-items:center;gap:12px;min-width:0}
.tabela .cel-nome .p-ini{width:32px;height:32px;border-radius:50%;background:var(--vn-tint);color:var(--vn-marca);
  display:grid;place-items:center;font-size:11.5px;font-weight:600;flex:none}
.tabela .cel-nome .p-ini.neutro{background:var(--vn-linha-2);color:var(--vn-neutro)}
.tabela .cel-nome .cel-txt{min-width:0}
.tabela .cel-nome .ct-prim{font-weight:600}
.vazio{margin:0;color:var(--vn-neutro);padding:2.4rem;text-align:center;background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio)}
.paginacao{display:flex;align-items:center;justify-content:center;gap:1.4rem;margin-top:1rem;
  color:var(--vn-neutro);font-size:13px}
.paginacao a{font-weight:600}

/* =========================================================================
   INÍCIO
   ========================================================================= */
.boas-vindas h1{font-size:26px;margin:0 0 4px}
.data-hoje{color:var(--vn-neutro-2);margin:0 0 24px;text-transform:capitalize;font-size:14px}
.busca-rapida{display:flex;gap:.5rem;max-width:560px;margin:0 0 28px}
.busca-rapida input{flex:1;height:44px;padding:0 14px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  font:inherit;font-size:14px;background:var(--vn-surface)}
.busca-rapida input:focus{outline:none;border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.busca-rapida button,.busca-rapida .btn{width:auto;height:44px;padding:0 20px;display:inline-flex;
  align-items:center;justify-content:center;white-space:nowrap}

.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.tile{display:block;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);padding:18px 20px;box-shadow:var(--vn-sombra);transition:border-color .14s,box-shadow .14s}
a.tile:hover{border-color:#cddbe4;box-shadow:0 6px 18px rgba(20,50,80,.06);text-decoration:none}
.tile .ic{width:36px;height:36px;border-radius:8px;background:var(--vn-tint);color:var(--vn-marca);
  display:grid;place-items:center;font-size:18px;line-height:1}
.tile h2{font-size:14.5px;margin:14px 0 2px;color:var(--vn-tinta);font-weight:600}
.tile p{margin:0;color:var(--vn-neutro);font-size:13px}
.tile.em-breve{opacity:.5}
.tile .badge{font-size:.62rem;font-weight:600;background:var(--vn-linha-2);color:var(--vn-neutro);
  padding:.1rem .45rem;border-radius:20px;text-transform:uppercase;letter-spacing:.03em}
.tile-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--vn-petroleo);
  vertical-align:middle;margin-left:.35rem}

/* painel do médico: indicadores em faixa única */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);overflow:hidden;margin:0 0 28px;box-shadow:var(--vn-sombra)}
.kpi{padding:20px 24px;border-right:1px solid var(--vn-linha-2)}
.kpi:last-child{border-right:0}
.kpi-topo{display:flex;align-items:center;justify-content:space-between}
.kpi-rot{font-size:11.5px;color:var(--vn-neutro);font-weight:500}
.kpi-dot{display:none}
.kpi-num{font-size:30px;font-weight:600;letter-spacing:-1px;line-height:1;margin:10px 0 0;color:var(--vn-petroleo)}
.kpi-hint{font-size:12.5px;color:var(--vn-fraco);margin-top:4px}

.painel-duo{display:grid;grid-template-columns:1.6fr 1fr;gap:24px;align-items:start}
.painel-card{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);overflow:hidden}
.painel-cab{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--vn-linha-2)}
.painel-cab h2{margin:0;font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--vn-marca)}
.painel-cab a{font-size:12.5px;font-weight:500}
.pc-links{display:flex;gap:14px;align-items:center}
.p-item{display:flex;align-items:center;gap:16px;padding:14px 20px;border-bottom:1px solid var(--vn-linha-3);
  text-decoration:none;color:inherit}
.p-item:last-child{border-bottom:0}
.p-item:hover{background:#fafcfd;text-decoration:none}
.p-hora{font-size:14px;font-weight:600;color:var(--vn-tinta);width:46px;flex:none}
.p-info{flex:1;min-width:0}
.p-nome{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-sub{display:block;font-size:12.5px;color:var(--vn-neutro)}
.p-item .badge-st{flex:none}
.p-ini{width:34px;height:34px;border-radius:50%;background:var(--vn-tint);color:var(--vn-marca);
  display:grid;place-items:center;font-size:12px;font-weight:600;flex:none}
.p-vazio{padding:22px 20px;color:var(--vn-neutro);font-size:13.5px}

/* resumo das confirmações WhatsApp */
.wpp-resumo{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:14px 18px;margin:0 0 18px}
.wpp-resumo-top{font-size:14px;color:var(--vn-tinta)}
.wpp-tag{font-size:12px;color:var(--vn-petroleo);background:var(--vn-tint);padding:2px 9px;border-radius:20px;font-weight:600}
.wpp-pulados{margin-top:10px;padding-top:10px;border-top:1px solid var(--vn-linha-2);font-size:13px;color:var(--vn-neutro-2);line-height:1.7}
.wpp-pulados b{color:var(--vn-perigo)}

/* =========================================================================
   AGENDA
   ========================================================================= */
.agenda-topo{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:20px}
.agenda-topo h1{margin:0}
.agenda-controles{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px}
.nav-data{display:flex;align-items:center;gap:2px;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);padding:3px}
.nav-data .btn-sec{padding:0;width:32px;height:32px;font-size:16px;line-height:1;border:0;background:transparent;box-shadow:none}
.nav-data .btn-sec:hover{background:var(--vn-linha-2)}
.form-data,.form-medico{margin:0}
.form-data input[type=date]{height:32px;padding:0 .5rem;border:0;background:transparent;font:inherit;
  font-family:'IBM Plex Mono',monospace;font-size:13.5px;font-weight:600;color:var(--vn-tinta)}
.form-data input[type=date]:focus{outline:none}
.form-medico select{height:38px;padding:0 14px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  background:var(--vn-surface);min-width:220px;font:inherit;font-size:13.5px;font-weight:500;color:var(--vn-tinta)}
.hoje-link{margin-left:.2rem;font-size:13px;font-weight:500;color:var(--vn-petroleo)}
.agenda-dia{color:var(--vn-neutro-2);text-transform:none;margin:0 0 16px;font-weight:600;font-size:13.5px;
  display:flex;align-items:center;gap:12px;flex-wrap:wrap}

.agenda-tabela td{vertical-align:middle;padding:13px 20px}
.agenda-tabela .ag-hora{font-weight:600;white-space:nowrap;color:var(--vn-tinta);font-size:13.5px;width:78px}
.agenda-tabela .ag-pac strong{font-weight:600;font-size:14px}
.agenda-tabela .ag-pac small{display:block;color:var(--vn-fraco);font-weight:400;font-family:'IBM Plex Mono',monospace;font-size:12px;margin-top:1px}
.ag-idade{margin-top:.1rem}
.ag-obs{color:var(--vn-neutro);font-size:12.5px;margin-top:.15rem;overflow-wrap:anywhere;word-break:break-word}
.agenda-tabela .ag-pac{overflow-wrap:anywhere;word-break:break-word}
.agenda-tabela .ag-fone{white-space:nowrap;font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--vn-neutro-2)}

/* etiquetas de situação — pílulas suaves */
.badge-st{display:inline-block;font-size:12px;font-weight:600;padding:4px 10px;border-radius:6px;white-space:nowrap;
  background:var(--vn-cinza-bg);color:var(--vn-cinza-tx)}
.st-agendado{background:var(--vn-cinza-bg);color:var(--vn-cinza-tx)}
.st-aguardando{background:var(--vn-roxo-bg);color:var(--vn-roxo)}
.st-nowhapp{background:var(--vn-cinza-bg);color:var(--vn-cinza-tx)}
.st-confirmado{background:#e9f1f4;color:#175873}
.st-em_espera{background:var(--vn-atencao-bg);color:var(--vn-atencao)}
.st-atendido{background:var(--vn-sucesso-bg);color:var(--vn-sucesso)}
.st-faltou{background:var(--vn-perigo-bg);color:var(--vn-perigo)}
.st-remarcado{background:var(--vn-cinza-bg);color:var(--vn-cinza-tx)}
.st-pendente{background:var(--vn-atencao-bg);color:var(--vn-atencao)}
.ag-linha.status-pendente td{box-shadow:inset 3px 0 0 #d9b463}
.ag-linha.status-faltou,.ag-linha.status-desmarcou,.ag-linha.status-remarcado{opacity:.6}

/* situação como <select> em forma de pílula (auto-submete) */
.ag-sit{white-space:nowrap;width:1%}
.st-form{margin:0;display:inline-block}
.st-sel{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;cursor:pointer;
  font:inherit;font-size:12px;font-weight:600;line-height:1.4;padding:4px 26px 4px 10px;border-radius:6px;
  background-color:var(--vn-cinza-bg);color:var(--vn-cinza-tx);
  background-repeat:no-repeat;background-position:right 8px center;background-size:10px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5l3.5 3.5 3.5-3.5' fill='none' stroke='%23667' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")}
.st-sel:hover{filter:brightness(.98)}
.st-sel.st-aguardando{background-color:var(--vn-roxo-bg);color:var(--vn-roxo)}
.st-sel.st-nowhapp,.st-sel.st-remarcado,.st-sel.st-agendado{background-color:var(--vn-cinza-bg);color:var(--vn-cinza-tx)}
.st-sel.st-confirmado{background-color:#e9f1f4;color:#175873}
.st-sel.st-pendente,.st-sel.st-em_espera{background-color:var(--vn-atencao-bg);color:var(--vn-atencao)}
.st-sel.st-faltou{background-color:var(--vn-perigo-bg);color:var(--vn-perigo)}
.st-sel.st-atendido{background-color:var(--vn-sucesso-bg);color:var(--vn-sucesso)}
.st-sel option{background:var(--vn-surface);color:var(--vn-tinta);font-weight:600}

.ag-chegou{white-space:nowrap;text-align:right;width:1%}
.ag-chegou .fbtn{margin:0}
.bt-chegou{display:inline-flex;align-items:center;justify-content:center;height:30px;padding:0 15px;
  background:var(--vn-tint);border:1px solid var(--vn-tint-bd);color:var(--vn-petroleo);border-radius:var(--vn-raio-pill);
  font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap}
.bt-chegou:hover{background:#dae7ee;color:var(--vn-petroleo-esc);text-decoration:none}
.bt-chegou-novo{background:var(--vn-surface);border-color:#dde5e9;color:#3f4d59}
.bt-chegou-novo:hover{background:var(--vn-campo);color:#3f4d59}
.na-fila{color:var(--vn-sucesso);font-size:12.5px;font-weight:600;white-space:nowrap}

.agenda-corpo{display:flex;gap:24px;align-items:flex-start;margin-top:0}
.agenda-main{flex:1 1 auto;min-width:0}
.agenda-lateral{flex:0 0 280px;display:flex;flex-direction:column;gap:16px}

/* horários livres / bloqueados */
.livres-cab{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  margin:26px 0 14px;padding-bottom:10px;border-bottom:1px solid #dfe6ea}
.tit-livres{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--vn-marca);margin:0;font-weight:600}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px}
.slot-livre{display:block;text-align:center;background:var(--vn-surface);border:1px solid #d7e2e8;border-radius:var(--vn-raio-sm);
  padding:8px 0;color:var(--vn-petroleo);font-weight:600;font-size:13px}
.slot-livre:hover{background:var(--vn-petroleo);color:#fff;text-decoration:none;border-color:var(--vn-petroleo)}
.slot-f{display:block;margin:0}
.slots .slot-bloq{width:100%;display:block;text-align:center;background:var(--vn-perigo-bg);border:1px solid var(--vn-perigo-bd);
  border-radius:var(--vn-raio-sm);padding:8px 0;color:var(--vn-perigo);font-weight:600;cursor:pointer;line-height:1.2;
  font-size:13px;box-shadow:none;height:auto}
.slots .slot-bloq:hover{background:#f3ded9}
.form-bloquear{margin:0}
.form-bloquear button{width:auto;height:30px;background:var(--vn-perigo-bg);color:var(--vn-perigo);
  border:1px solid var(--vn-perigo-bd);border-radius:var(--vn-raio-pill);padding:0 13px;font-size:12.5px;
  font-weight:600;cursor:pointer;box-shadow:none}
.form-bloquear button:hover{background:#f3ded9}
.slots-legenda{color:var(--vn-fraco);font-size:12.5px;margin:12px 0 0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.slots-legenda .ex-livre,.slots-legenda .ex-bloq{display:inline-block;width:13px;height:13px;border-radius:4px;vertical-align:-2px}
.slots-legenda .ex-livre{background:var(--vn-surface);border:1px solid #d7e2e8}
.slots-legenda .ex-bloq{background:var(--vn-perigo-bg);border:1px solid var(--vn-perigo-bd)}
.dica-livres{color:var(--vn-neutro);background:var(--vn-surface);padding:1rem 1.2rem;border-radius:var(--vn-raio);
  border:1px solid var(--vn-linha);margin-top:20px}

/* mini calendários */
.mini-cal{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  padding:16px 18px;box-shadow:var(--vn-sombra)}
.mc-tit{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:600;text-transform:capitalize;
  color:var(--vn-tinta);margin-bottom:12px;font-size:13.5px}
.cal-nav{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border-radius:6px;color:var(--vn-fraco);font-size:10px;line-height:1;text-decoration:none;transition:background .15s,color .15s}
.cal-nav:hover{background:var(--vn-linha-2);color:var(--vn-petroleo)}
.mini-cal table{width:100%;border-collapse:collapse;table-layout:fixed}
.mini-cal th{color:var(--vn-fraco-2);font-weight:600;font-size:10.5px;padding:4px 0;text-align:center}
.mini-cal td{text-align:center;padding:1px}
.mc-dia a{display:block;padding:5px 0;border-radius:6px;color:var(--vn-neutro-2);font-size:12.5px;text-decoration:none}
.mc-dia a:hover{background:var(--vn-tint);color:var(--vn-marca)}
.mc-cheio a{background:var(--vn-perigo-bg);color:var(--vn-perigo)}
.mc-cheio a:hover{background:#f3ded9;color:var(--vn-perigo)}
.mc-sel a{background:var(--vn-petroleo);color:#fff;font-weight:600}
.mc-sel a:hover{background:var(--vn-petroleo-esc);color:#fff}
.cal-legenda{color:var(--vn-fraco);font-size:12px;margin:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cal-legenda .ex-cheio{display:inline-block;width:13px;height:13px;border-radius:4px;background:var(--vn-perigo-bg);
  border:1px solid var(--vn-perigo-bd);vertical-align:-2px}

/* feriado */
.feriado-tag{font-size:12px;background:var(--vn-perigo-bg);color:var(--vn-perigo);padding:3px 10px;border-radius:6px;font-weight:600}
.feriado-form{margin:0}
.feriado-btn{background:var(--vn-surface);border:1px solid #dde5e9;box-shadow:none;color:var(--vn-neutro-2);
  font-size:12.5px;font-weight:600;cursor:pointer;padding:0 13px;height:30px;width:auto;border-radius:var(--vn-raio-pill)}
.feriado-btn:hover{background:var(--vn-campo);color:var(--vn-tinta)}

/* =========================================================================
   FICHA DO PACIENTE
   ========================================================================= */
.voltar{display:inline-flex;align-items:center;gap:6px;margin-bottom:14px;color:var(--vn-neutro);font-size:13px}
.voltar:hover{color:var(--vn-petroleo)}

.ficha-cab{display:flex;align-items:flex-start;gap:20px;margin-bottom:16px}
.ficha-cab-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:14px}
.ficha-chip{display:flex;align-items:center;gap:16px;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);padding:18px 20px}
.ficha-chip-ini{width:52px;height:52px;border-radius:50%;background:var(--vn-marca);color:#fff;display:grid;
  place-items:center;font-size:17px;font-weight:600;flex:none}
.ficha-chip-txt{min-width:0}
.ficha-chip-nome{font-size:22px;font-weight:600;letter-spacing:-.4px;line-height:1.2}
.ficha-chip-sub{font-size:13.5px;color:var(--vn-neutro-2);margin-top:2px}
.btn-copia-nome{border:0;background:transparent;color:var(--vn-fraco);cursor:pointer;padding:3px;margin-left:.4rem;
  border-radius:6px;display:inline-flex;align-items:center;vertical-align:middle;line-height:1}
.btn-copia-nome:hover{background:var(--vn-linha-2);color:var(--vn-petroleo)}
.btn-copia-nome.ok{color:var(--vn-sucesso)}
.btn-copia-nome svg{display:block}
.ficha-cab .ficha-acoes{justify-content:flex-start}
.ficha-acoes{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.ficha-acoes .btn,.ficha-acoes .btn-sec,.ficha-acoes .btn-perigo{height:40px}
.ficha-acoes .btn-perigo{margin-left:auto}
.ficha-foto{flex:none;width:132px;height:132px;border-radius:var(--vn-raio);overflow:hidden;background:var(--vn-campo);
  display:grid;place-items:center;border:1px solid var(--vn-linha);position:relative;cursor:pointer;text-decoration:none}
.ficha-foto img{width:100%;height:100%;object-fit:cover}
.ficha-foto-ph{color:#c3ccd3;display:grid;place-items:center}
.ficha-foto-cam{position:absolute;left:0;right:0;bottom:0;background:rgba(23,33,41,.6);color:#fff;font-size:11.5px;
  font-weight:600;text-align:center;padding:5px 4px;opacity:0;transition:opacity .15s}
.ficha-foto:hover .ficha-foto-cam{opacity:1}
.ficha-topo{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}
.ficha-avatar{flex:none;width:64px;height:64px;border-radius:50%;overflow:hidden;background:var(--vn-marca);
  display:grid;place-items:center}
.ficha-avatar img{width:100%;height:100%;object-fit:cover}
.ficha-avatar span{font-size:1.6rem;color:#fff}
.ficha-num{color:var(--vn-neutro)}
.ficha-num strong{color:var(--vn-petroleo);font-size:1.05rem;font-family:'IBM Plex Mono',monospace}

.ficha{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  padding:22px 24px 24px;margin-top:0;box-shadow:var(--vn-sombra)}
.ficha h2{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--vn-marca);
  margin:26px 0 16px;padding-bottom:10px;border-bottom:1px solid #eef2f4;font-weight:600}
.ficha h2:first-child{margin-top:0}
.grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 24px}
.grade .col2{grid-column:span 2}
.grade label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--vn-fraco-2);margin-bottom:3px}
.grade span{display:block;min-height:1.2em;font-size:13.5px;font-weight:500}
.obs{white-space:pre-wrap;background:#f7f9fa;padding:14px 16px;border-radius:var(--vn-raio-sm);
  border:1px solid #eef2f4;color:var(--vn-neutro-2);line-height:1.6}
.rodape-ficha{color:var(--vn-fraco);text-align:center;margin-top:1.5rem;font-size:12.5px}
.acao-inline{display:inline-block;margin:0}
.acao-inline button{width:auto}
.cabecalho-consultas{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  margin:26px 0 12px;padding-bottom:10px;border-bottom:1px solid #dfe6ea}
.cabecalho-consultas h2{margin:0;font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--vn-marca)}
.cabecalho-consultas .btn{height:34px;font-size:12.5px}

/* seleção de paciente */
.paciente-selecionado{display:flex;align-items:center;gap:14px;background:var(--vn-tint);border:1px solid var(--vn-tint-bd);
  border-radius:var(--vn-raio-sm);padding:12px 16px;margin:.4rem 0 1.2rem}
.ps-nome{font-weight:600;font-size:15px}
.ps-nome-link{color:var(--vn-marca);text-decoration:none;border-bottom:1px solid transparent}
.ps-nome-link:hover{border-bottom-color:currentColor}
.ps-ficha{color:#4f6b7a;font-size:12.5px}
.ps-trocar{margin-left:auto;font-size:12.5px;font-weight:600}
.btn-novo-pac{white-space:nowrap}
.paciente-novo{gap:.9rem}
.ps-novo-label{display:flex;flex-direction:column;gap:.3rem;flex:1;font-size:12px;font-weight:600;color:var(--vn-neutro-2)}
.ps-novo-label input{height:42px;padding:0 12px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  font:inherit;font-size:14px;font-weight:400;color:var(--vn-tinta);background:var(--vn-surface)}
.ps-novo-label input:focus{outline:none;border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}

/* observações importantes */
.obs-imp{margin:0 0 16px}
.obs-imp-btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--vn-surface);color:#3f4d59;
  border:1px solid #dde5e9;border-radius:var(--vn-raio-sm);padding:0 16px;height:40px;font:inherit;
  font-size:13.5px;font-weight:600;cursor:pointer;box-shadow:none}
.obs-imp-btn:hover{background:var(--vn-campo)}
.obs-imp-btn.tem{background:#fdf7ec;color:#6d4f11;border-color:var(--vn-atencao-bd)}
.obs-imp-btn.tem:hover{background:#faf0dd}
.obs-imp-caixa,.obs-imp-editor{background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);padding:1rem 1.1rem;margin-top:.6rem}
.obs-imp-texto{white-space:pre-wrap;color:var(--vn-tinta);line-height:1.55}
.obs-imp-editor textarea{width:100%;padding:12px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  background:var(--vn-surface);font:inherit;font-size:14px;resize:vertical}
.obs-imp-editor textarea:focus{outline:none;border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.obs-imp-acoes{display:flex;gap:.6rem;margin-top:.85rem;flex-wrap:wrap}
.obs-imp-acoes.duo,.obs-imp-acoes.tri{grid-template-columns:none}
.obs-imp-acoes>*{margin:0}
.obs-imp-acoes button{width:auto}
.obs-del-form{display:inline-block;margin:0}

/* =========================================================================
   FORMULÁRIOS
   ========================================================================= */
.formulario fieldset{border:1px solid var(--vn-linha);border-radius:var(--vn-raio);padding:22px 24px 24px;
  margin:0 0 16px;background:var(--vn-surface);box-shadow:var(--vn-sombra)}
.formulario legend{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--vn-marca);
  font-weight:600;padding:0 .4rem;margin-left:-.4rem}
.grade-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 20px;margin:.4rem 0 0}
.grade-form label{display:block;font-size:12px;font-weight:600;color:var(--vn-neutro-2)}
.grade-form .col2{grid-column:span 2}
.grade-form .col3{grid-column:span 3}
.grade-form input,.grade-form select,.grade-form textarea{width:100%;margin-top:6px;height:42px;padding:0 12px;
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);font:inherit;font-size:14px;font-weight:400;
  color:var(--vn-tinta);background:var(--vn-surface)}
.grade-form textarea{height:auto;padding:12px;resize:vertical}
.grade-form input:focus,.grade-form select:focus,.grade-form textarea:focus{outline:none;
  border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.grade-form input[readonly]{background:var(--vn-cab);color:var(--vn-neutro);border-color:#eef2f4}
.grade-form legend small,fieldset legend small{text-transform:none;letter-spacing:0;color:var(--vn-neutro);font-weight:400}
.dica{display:block;margin-top:.25rem;font-size:11.5px;color:var(--vn-neutro);font-weight:400}
.grade-form label.chk{display:flex;align-items:center;gap:.5rem;font-size:14px;color:var(--vn-tinta);align-self:end;height:42px}
.grade-form label.chk input{width:auto;height:auto;margin:0}
.acoes-form{display:flex;gap:.6rem;align-items:center;margin-top:1.2rem}
.acoes-form button{width:auto}
.form-visita{max-width:900px}
.form-visita .grade-form{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:22px 24px}
.grade-form .campo{display:flex;flex-direction:column;min-width:0}
.grade-form .campo label{margin-bottom:0}
.grade-form .campo-full{grid-column:1/-1}
.cab-visita{margin:0 0 1rem}
.cab-visita h1{margin:0}
.visita-pac{color:var(--vn-neutro);margin:.2rem 0 0}

/* localizar na agenda */
.form-localizar{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:22px 24px;margin-bottom:1.3rem}
.form-localizar .chk-linha{display:flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:14px;color:var(--vn-tinta)}
.form-localizar .chk-linha input{width:auto;height:auto;margin:0}
.acoes-loc{display:flex;gap:.6rem;margin-top:1.1rem;flex-wrap:wrap}
.acoes-loc .btn,.acoes-loc .btn-sec{width:auto}
.dica-localizar{font-size:12.5px;color:var(--vn-neutro);margin:1rem 0 0;border-top:1px solid var(--vn-linha-2);padding-top:.8rem}
.loc-vazio{color:var(--vn-neutro);padding:.8rem 0}
.loc-count{font-size:13px;color:var(--vn-neutro);margin:0 0 .7rem}

/* anotações do dia */
.nota-topo{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:.6rem}
.nota-dia-rot{font-size:14px;color:var(--vn-tinta);font-weight:600}
.nota-hoje-tag{font-size:11px;background:var(--vn-tint);color:var(--vn-marca);padding:2px 8px;border-radius:6px;font-weight:600}
.nota-salvo{color:var(--vn-sucesso);background:var(--vn-sucesso-bg);border:1px solid var(--vn-sucesso-bd);
  border-radius:var(--vn-raio-sm);padding:.5rem .8rem;font-size:13px;margin:.2rem 0 .9rem;display:inline-block;font-weight:500}
.form-nota{margin-top:.4rem}
.nota-textarea{width:100%;min-height:360px;padding:16px 18px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  background:var(--vn-surface);box-shadow:var(--vn-sombra);font-family:inherit;font-size:14.5px;line-height:1.6;
  color:var(--vn-tinta);resize:vertical}
.nota-textarea:focus{outline:none;border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}

/* área de foto */
.fs-foto .foto-area{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.foto-quadro{width:112px;height:112px;border-radius:var(--vn-raio);overflow:hidden;background:var(--vn-campo);
  display:grid;place-items:center;border:1px solid var(--vn-linha)}
.foto-quadro img,.foto-quadro video{width:100%;height:100%;object-fit:cover}
.foto-vazia{font-size:2.6rem;color:#c3ccd3;opacity:1}
.foto-botoes{display:flex;gap:.5rem;align-items:flex-start;flex-wrap:wrap}
.foto-botoes .btn,.foto-botoes .btn-sec{width:auto;height:38px}
.foto-arquivo{cursor:pointer}

/* =========================================================================
   FILA DE ESPERA
   ========================================================================= */
.fila-tabela td{vertical-align:middle;padding:14px 20px}
.fila-tabela .fila-tempo{color:var(--vn-neutro-2);white-space:nowrap;font-size:15px;font-weight:600}
.fila-linha td:first-child{box-shadow:inset 3px 0 0 var(--vn-linha)}
.fila-linha.st-aguardando td:first-child{box-shadow:inset 3px 0 0 #d9b463}
.fila-linha.st-chamado td:first-child{box-shadow:inset 3px 0 0 var(--vn-petroleo)}
.fila-linha.st-em_atendimento td:first-child{box-shadow:inset 3px 0 0 var(--vn-sucesso)}
.fila-linha.st-chamado,.fila-linha.st-em_atendimento{background:transparent}
.tag-prio{background:var(--vn-atencao-bg);color:var(--vn-atencao);font-size:10.5px;font-weight:700;
  padding:2px 7px;border-radius:20px;text-transform:uppercase;letter-spacing:.04em;vertical-align:1px}
.fila-acoes{white-space:nowrap;display:flex;gap:6px;align-items:center}
.fila-acoes .fbtn{margin:0}
.fila-acoes button{width:auto;height:32px;padding:0 15px;font-size:12.5px;font-weight:600;
  border:1px solid #dde5e9;background:#fff;color:#3f4d59;border-radius:var(--vn-raio-pill);box-shadow:none;cursor:pointer}
.fila-acoes button:hover{background:var(--vn-campo)}
/* ação principal da linha, conforme o status */
.fila-acoes .bt-chamar,.fila-acoes .bt-atender,.fila-acoes .bt-concluir{background:var(--vn-petroleo);color:#fff;border-color:var(--vn-petroleo)}
.fila-acoes .bt-chamar:hover,.fila-acoes .bt-atender:hover,.fila-acoes .bt-concluir:hover{background:var(--vn-petroleo-esc);color:#fff}
.fila-acoes .bt-retirar{width:32px;padding:0;color:var(--vn-fraco);border-radius:50%}
.fila-acoes .bt-retirar:hover{background:var(--vn-perigo-bg);color:var(--vn-perigo);border-color:var(--vn-perigo-bd)}
.fila-acoes .bt-priori{width:32px;padding:0;border-radius:50%;color:#c9a13f}
.fila-acoes .bt-priori:hover{background:var(--vn-atencao-bg);border-color:var(--vn-atencao-bd)}
.fila-busca{margin:0 0 1rem}
.fadd{display:flex;gap:.4rem;align-items:center;margin:0;justify-content:flex-end}
.fadd button{width:auto;height:32px;padding:0 14px;font-size:12.5px;border-radius:var(--vn-raio-pill)}
.chk-prio{font-size:12.5px;color:var(--vn-neutro);display:flex;align-items:center;gap:.3rem}
.chk-prio input{width:auto;margin:0}
.chk-fila{display:inline-flex;align-items:center;gap:.5rem;background:var(--vn-tint);border:1px solid var(--vn-tint-bd);
  border-radius:var(--vn-raio-sm);padding:.6rem .9rem;font-weight:600;color:var(--vn-tinta)}
.nota-fila{font-size:13px;color:#4f6b7a;background:var(--vn-tint);border:1px solid var(--vn-tint-bd);
  border-radius:var(--vn-raio-sm);padding:.6rem .9rem;margin:0 0 1rem}

/* etiquetas da barra lateral */
.nav-badge{background:var(--vn-tint);color:var(--vn-marca);border-radius:6px;font-size:11px;font-weight:600;
  min-width:20px;height:20px;padding:0 5px;display:inline-grid;place-items:center}
.nav-badge-fila{background:var(--vn-tint);color:var(--vn-marca)}
.link-msg .nav-badge{background:var(--vn-perigo-bg);color:var(--vn-perigo)}

/* =========================================================================
   MENSAGENS
   ========================================================================= */
.msg-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px;min-height:calc(100vh - 220px)}
.msg-contatos{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  padding:0;overflow:auto;box-shadow:var(--vn-sombra)}
.contato{display:flex;flex-direction:row;align-items:center;gap:12px;padding:12px 14px;border-radius:0;
  position:relative;border-bottom:1px solid var(--vn-linha-3)}
.contato .p-ini{width:38px;height:38px;border-radius:50%;background:var(--vn-tint);color:var(--vn-marca);
  display:grid;place-items:center;font-size:12.5px;font-weight:600;flex:none}
.contato .ct-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:.05rem}
.contato:hover{background:#fafcfd;text-decoration:none}
.contato.ativo{background:var(--vn-tint)}
.contato.ativo .p-ini{background:var(--vn-marca);color:#fff}
.ct-nome{font-weight:600;color:var(--vn-tinta);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ct-tipo{font-size:12px;color:var(--vn-neutro);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ct-badge{position:absolute;right:.8rem;top:50%;transform:translateY(-50%);background:var(--vn-perigo);color:#fff;
  border-radius:9px;font-size:10.5px;font-weight:700;padding:2px 6px}
.msg-conversa{display:flex;flex-direction:column;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);overflow:hidden;box-shadow:var(--vn-sombra)}
.msg-cab{padding:14px 20px;border-bottom:1px solid var(--vn-linha-2);font-weight:600;font-size:14.5px}
.msg-baloes{flex:1;overflow:auto;padding:20px;display:flex;flex-direction:column;gap:10px;background:var(--vn-campo)}
.balao{max-width:62%;background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:12px 12px 12px 4px;
  padding:10px 14px;align-self:flex-start}
.balao.minha{align-self:flex-end;background:var(--vn-tint);color:#123c4e;border-color:var(--vn-tint-bd);
  border-radius:12px 12px 4px 12px}
.bl-txt{display:block;white-space:pre-wrap;word-break:break-word;font-size:13.5px;line-height:1.5}
.bl-hora{display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--vn-fraco-2);text-align:right;margin-top:3px}
.balao.minha .bl-hora{color:#6c8b9b}
.msg-form{display:flex;gap:10px;padding:14px 16px;border-top:1px solid var(--vn-linha-2)}
.msg-form input{flex:1;height:44px;padding:0 14px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  font:inherit;font-size:14px;background:var(--vn-campo)}
.msg-form input:focus{outline:none;border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.msg-form button{width:auto;height:44px}

/* =========================================================================
   VISITAS / CONTATOS
   ========================================================================= */
.visitas-tabela tbody tr,.contatos-tabela tbody tr{cursor:pointer}
.visitas-tabela tbody tr:hover,.contatos-tabela tbody tr:hover{background:#fafcfd}
.visitas-tabela .v-data{font-weight:600;white-space:nowrap;color:var(--vn-tinta)}
.visitas-tabela .v-atend{font-weight:600}
.tag-imp{font-size:11px;background:var(--vn-cinza-bg);color:var(--vn-cinza-tx);padding:2px 7px;border-radius:6px;vertical-align:1px}
.contatos-tabela .ct-nome{font-weight:600}
.contatos-tabela .ct-contato{font-weight:400;color:var(--vn-neutro);font-size:12.5px;margin-top:.1rem}
.contatos-tabela .ct-fones a{white-space:nowrap}
.contatos-tabela .ct-sep{color:var(--vn-linha);margin:0 .4rem}
.contatos-tabela .ct-mail a{word-break:break-all}

/* =========================================================================
   FATURAS
   ========================================================================= */
.fat-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio);padding:12px 16px;margin:0 0 18px;box-shadow:var(--vn-sombra)}
.fat-modos{display:flex;background:var(--vn-campo);border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);padding:3px;gap:2px}
.fat-modos label{display:flex;align-items:center;height:30px;padding:0 14px;border-radius:5px;font-size:12.5px;
  font-weight:500;color:var(--vn-neutro-2);cursor:pointer}
.fat-modos label:has(input:checked){background:var(--vn-petroleo);color:#fff;font-weight:600}
.fat-modos input{position:absolute;opacity:0;width:0;height:0}
.fat-per{display:flex;align-items:center;gap:2px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);padding:3px}
.fat-per input[type=month],.fat-per input[type=date]{height:30px;border:0;background:transparent;font:inherit;
  font-size:13px;font-weight:600;color:var(--vn-tinta);padding:0 8px}
.fat-per input:focus{outline:none}
.fat-per label{display:flex;align-items:center;gap:4px;font-size:12.5px;color:var(--vn-neutro);padding-left:6px}
.fat-nav{width:30px;height:30px;border-radius:5px;display:grid;place-items:center;color:var(--vn-neutro-2);
  font-size:11px;text-decoration:none}
.fat-nav:hover{background:var(--vn-linha-2)}
.fat-f{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--vn-neutro)}
.fat-f select{height:36px;min-width:150px;padding:0 12px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  background:var(--vn-surface);font:inherit;font-size:13px;font-weight:500;color:var(--vn-tinta)}
.fat-bar button[type=submit]{height:36px;padding:0 16px;font-size:12.5px}

/* total geral em destaque */
.fat-cab{display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--vn-marca);
  border-radius:var(--vn-raio);padding:20px 24px;margin:0 0 14px;color:#fff;flex-wrap:wrap}
.fat-total{display:flex;flex-direction:column}
.fat-total-lb{font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#9dc0cf}
.fat-total-vl{font-family:'IBM Plex Mono',monospace;font-size:32px;font-weight:600;letter-spacing:-1px;margin-top:6px}
.fat-total-sub{font-size:12.5px;color:#9dc0cf;margin-top:4px}
/* ---- Conferência TISS: o que a operadora exige, antes do envio ---- */
.tc-veredito{border-radius:var(--vn-raio-sm);padding:14px 18px;margin:0 0 18px;font-size:13.5px;line-height:1.5}
.tc-veredito-ok{background:var(--vn-tint);border:1px solid var(--vn-linha);color:var(--vn-tinta)}
.tc-bloco{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  padding:18px 22px;margin:0 0 16px;box-shadow:var(--vn-sombra)}
.tc-bloco h2{margin:0 0 12px;font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--vn-marca)}
.tc-bloco h2 small{text-transform:none;letter-spacing:0;font-weight:400;font-size:12px;color:var(--vn-neutro);
  margin-left:8px}
.tc-lista{list-style:none;margin:0;padding:0}
.tc-lista li{display:flex;align-items:baseline;gap:10px;padding:7px 0;border-top:1px solid var(--vn-linha-2);
  font-size:13.5px}
.tc-lista li:first-child{border-top:0}
.tc-grupo{display:block!important;font-weight:600;color:var(--vn-tinta);padding-top:14px!important;
  font-size:13px!important}
.tc-marca{flex:none;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-size:11px;font-weight:700;color:#fff;align-self:center}
.tc-ok .tc-marca{background:var(--vn-sucesso)}
.tc-falta .tc-marca{background:var(--vn-atencao-bd)}
.tc-rot{flex:1;min-width:0;color:var(--vn-tinta);display:flex;flex-direction:column}
.tc-rot small{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--vn-neutro);margin-top:1px}
.tc-val{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--vn-tinta);text-align:right}
.tc-vazio{font-size:12.5px;color:var(--vn-neutro);text-align:right}
.tc-nota{font-size:12.5px;color:var(--vn-neutro);line-height:1.55;margin:10px 0 0}
@media (max-width:640px){
  .tc-lista li{flex-wrap:wrap}
  .tc-val,.tc-vazio{text-align:left;width:100%;padding-left:28px}
}
/* faturas: ação de emitir guias, ao lado do alternador de vista */
.fat-acoes{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.fat-conf{height:36px;padding:0 14px;border-radius:var(--vn-raio-sm);display:flex;align-items:center;
  background:rgba(255,255,255,.10);color:#cfe0e8;font-size:12.5px;font-weight:500;text-decoration:none;
  white-space:nowrap}
.fat-conf:hover{background:rgba(255,255,255,.18);color:#fff}
.fat-guias{height:36px;padding:0 16px;border-radius:var(--vn-raio-sm);display:flex;align-items:center;
  background:#fff;color:var(--vn-marca);font-size:12.5px;font-weight:600;text-decoration:none;white-space:nowrap}
.fat-guias:hover{background:#eef4f8}
.fat-vista{display:flex;background:rgba(255,255,255,.10);border-radius:var(--vn-raio-sm);padding:3px;gap:2px}
.fat-vista a{height:30px;padding:0 14px;border-radius:5px;display:flex;align-items:center;font-size:12.5px;
  font-weight:500;color:#cfe0e8;text-decoration:none}
.fat-vista a.on{background:#fff;color:var(--vn-marca);font-weight:600}
.fat-vista a:hover{color:#fff}
.fat-vista a.on:hover{color:var(--vn-marca)}

.fat-aviso{display:flex;align-items:center;gap:10px;background:#fdf7ec;border:1px solid var(--vn-atencao-bd);
  border-radius:var(--vn-raio-sm);padding:11px 16px;margin:0 0 18px;color:#6d4f11;font-size:13.5px}
.fat-aviso a{color:#6d4f11;font-weight:600;text-decoration:underline}

.fat-grupo{margin:0 0 14px}
.fat-grupo-tit{display:flex;align-items:center;justify-content:space-between;padding:13px 20px;background:var(--vn-cab);
  border:1px solid var(--vn-linha);border-bottom:0;border-radius:var(--vn-raio) var(--vn-raio) 0 0;font-size:14px;font-weight:600}
.fat-tab{border-radius:0 0 var(--vn-raio) var(--vn-raio);border-top:0}
.fat-tab th{background:var(--vn-surface);border-bottom:1px solid var(--vn-linha-3);padding:9px 20px}
.fat-tab td{padding:11px 20px;border-bottom:1px solid var(--vn-linha-3)}
.fat-tab tbody tr{cursor:default}
.fat-dt{color:var(--vn-neutro-2);font-size:13px;white-space:nowrap}
.fat-r{text-align:right;font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums}
.fat-tab tfoot td{background:var(--vn-cab);border-top:1px solid #eef2f4;border-bottom:0;padding:12px 20px;
  font-size:13px;font-weight:600;color:var(--vn-neutro-2)}
.fat-sub{font-size:15px;color:var(--vn-tinta)}
.fat-semv{font-size:12px;font-weight:600;padding:3px 9px;border-radius:6px;background:var(--vn-atencao-bg);color:var(--vn-atencao)}
.fat-geral{display:flex;align-items:center;justify-content:flex-end;gap:20px;background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio);padding:16px 24px;margin-top:6px;
  font-size:15px;font-weight:600}
.fat-geral span:last-child{font-family:'IBM Plex Mono',monospace;font-size:19px;min-width:140px;text-align:right}

/* =========================================================================
   CONVÊNIOS / PROCEDIMENTOS / VALORES
   ========================================================================= */
.conv-off{opacity:.55}
.tag-ok{background:var(--vn-sucesso-bg);color:var(--vn-sucesso);padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600}
.tag-off{background:var(--vn-cinza-bg);color:var(--vn-cinza-tx);padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600}
.acoes-cel{white-space:nowrap;text-align:right}
.acoes-cel .acao-inline{display:inline-block;margin:0}
.acoes-cel .btn-mini,.acoes-cel button[type=submit]{display:inline-flex;align-items:center;justify-content:center;
  box-sizing:border-box;min-width:0;height:30px;padding:0 13px;font:inherit;font-size:12.5px;font-weight:600;
  border-radius:var(--vn-raio-pill);background:var(--vn-surface);color:var(--vn-neutro-2);border:1px solid #dde5e9;
  box-shadow:none;cursor:pointer;text-decoration:none;margin-left:8px}
.acoes-cel .btn-mini:hover,.acoes-cel button[type=submit]:hover{background:var(--vn-campo);color:var(--vn-tinta);text-decoration:none}
.acoes-cel .btn-mini-perigo{color:var(--vn-perigo);border-color:var(--vn-perigo-bd);background:var(--vn-perigo-bg)}
.acoes-cel .btn-mini-perigo:hover{background:#f3ded9;color:var(--vn-perigo)}
.imp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 18px;max-width:980px}
.imp-card{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  background:var(--vn-surface);padding:12px 14px}
.link-horarios{margin:1rem 0 0}
.adicionar-horario{margin-top:1.4rem}
.acao-lin{width:1%;white-space:nowrap;text-align:right}
.acao-lin form{margin:0}
.btn-lixeira{width:32px;height:32px;background:transparent;color:var(--vn-fraco);font-size:1rem;line-height:1;
  padding:0;border:1px solid #dde5e9;border-radius:50%;cursor:pointer;box-shadow:none}
.btn-lixeira:hover{background:var(--vn-perigo-bg);color:var(--vn-perigo);border-color:var(--vn-perigo-bd)}
.tabela tbody tr:has(.acao-lin){cursor:default}

/* =========================================================================
   AVISOS, SELOS E ZONAS
   ========================================================================= */
.aviso-suave{background:#fdf7ec;border:1px solid var(--vn-atencao-bd);color:#6d4f11;border-radius:var(--vn-raio-sm);
  padding:.8rem 1.1rem;margin-bottom:1rem}
.sub{color:var(--vn-neutro);margin:-.4rem 0 1rem}
.selo-admin{display:inline-block;background:var(--vn-tint);color:var(--vn-marca);font-size:10.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:6px;vertical-align:middle;margin-left:4px}
.chk-admin{margin-top:2px}
.zona-perigo{border:1px solid var(--vn-perigo-bd);background:var(--vn-perigo-bg);border-radius:var(--vn-raio);
  padding:18px 22px;margin:24px 0 0;max-width:760px}
.zona-perigo h2{margin:0 0 8px;font-size:15px;color:var(--vn-perigo)}
.zona-perigo p{margin:0 0 12px;font-size:13.5px;line-height:1.55;color:#6b3a33}
.zona-perigo form{margin:0}
.zona-perigo .btn-perigo{cursor:pointer;background:#fff}

/* agendamento online */
.ao-link{border:1px solid var(--vn-tint-bd);border-radius:var(--vn-raio);background:var(--vn-tint);
  padding:14px 16px;margin:0 0 18px;max-width:760px}
.ao-link-tit{display:block;font-size:12.5px;font-weight:600;color:var(--vn-marca);margin-bottom:8px}
.ao-link-row{display:flex;gap:8px;flex-wrap:wrap}
.ao-link-row input{flex:1 1 260px;min-width:0;height:40px;padding:0 12px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);font:inherit;font-size:14px;background:#fff;color:var(--vn-tinta)}
.ao-link-row .btn-sec{flex:0 0 auto;width:auto;height:40px;margin:0}
.ao-link-abrir{display:inline-block;margin-top:9px;font-size:13px;color:var(--vn-marca);font-weight:600}
.ao-link-abrir:hover{text-decoration:underline}

/* =========================================================================
   EDITOR DE MENSAGENS WHATSAPP
   ========================================================================= */
.tw-legenda{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  padding:14px 16px;margin:0 0 20px;font-size:13px;color:var(--vn-neutro);display:flex;flex-wrap:wrap;
  gap:7px 16px;align-items:center;box-shadow:var(--vn-sombra)}
.tw-legenda b{color:var(--vn-tinta);width:100%;font-size:13.5px;margin-bottom:2px}
.tw-legenda code{background:var(--vn-tint);color:var(--vn-marca);padding:2px 6px;border-radius:5px;
  font-family:'IBM Plex Mono',monospace;font-size:.85em}
.tw-card{border:1px solid var(--vn-linha);border-radius:var(--vn-raio);padding:20px 22px;margin:0 0 16px;
  background:var(--vn-surface);box-shadow:var(--vn-sombra)}
.tw-card legend{font-weight:600;color:var(--vn-marca);padding:0 8px;font-size:11.5px;
  text-transform:uppercase;letter-spacing:.1em}
.tw-lb{display:block;margin:14px 0 0;font-size:12px;font-weight:600;color:var(--vn-neutro-2);
  text-transform:uppercase;letter-spacing:.04em}
.tw-lb textarea{display:block;width:100%;margin-top:6px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  padding:12px 14px;font-family:inherit;font-size:14px;line-height:1.55;background:var(--vn-surface);resize:vertical;
  box-sizing:border-box;color:var(--vn-tinta);text-transform:none;font-weight:400}
.tw-lb textarea:focus{outline:none;border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.tw-seletor{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 20px}
.tw-seletor label{font-size:12px;font-weight:600;color:var(--vn-neutro-2);text-transform:uppercase;letter-spacing:.04em}
.tw-seletor select{min-width:260px;height:42px;padding:0 40px 0 14px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);font:inherit;font-size:14.5px;font-weight:600;color:var(--vn-tinta);
  background:var(--vn-surface);cursor:pointer;box-shadow:none;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238e9aa4' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center}
.tw-seletor select:focus{outline:none;border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}
/* separador de seção (parabéns de aniversário: não pertence a nenhum tipo) */
.tw-secao{margin:36px 0 4px;padding-top:24px;border-top:1px solid var(--vn-linha-2);font-size:11.5px;
  font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--vn-marca)}
.tw-secao + .sub-h1{margin:0 0 18px}
.form-msg-wpp .tw-lb-dica code{background:var(--vn-tint);color:var(--vn-marca);padding:1px 5px;
  border-radius:4px;font-family:'IBM Plex Mono',monospace;font-size:.92em}
.form-msg-wpp .ao-geral{margin:0 0 18px}
.form-msg-wpp .tw-lb{margin:0 0 20px}
.form-msg-wpp .tw-lb-dica{display:block;margin-top:3px;font-size:12px;font-weight:400;color:var(--vn-neutro);
  text-transform:none;letter-spacing:0}
.form-tipos-wpp .tabela td input{width:100%;height:38px;padding:0 12px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);font:inherit;font-size:13.5px;background:var(--vn-surface)}
.form-tipos-wpp .tabela td input:focus{outline:none;border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.form-tipos-wpp .tw-tipo{font-weight:600;white-space:nowrap;color:var(--vn-tinta)}
.form-msg-wpp .nota-salvo,.form-tipos-wpp .nota-salvo{color:var(--vn-sucesso);font-weight:600;margin:0 0 14px}

/* =========================================================================
   RESPONSIVO
   Sem alterar o HTML: em telas pequenas a barra lateral vira uma tira
   horizontal no topo, rolável, e o conteúdo passa a ocupar a largura toda.
   ========================================================================= */
@media (max-width:1200px){
  .kpis{grid-template-columns:1fr 1fr}
  .kpi:nth-child(2){border-right:0}
  .kpi:nth-child(1),.kpi:nth-child(2){border-bottom:1px solid var(--vn-linha-2)}
  .painel-duo{grid-template-columns:1fr}
  .agenda-corpo{flex-direction:column}
  .agenda-lateral{flex-basis:auto;width:100%;flex-direction:row;flex-wrap:wrap;gap:16px}
  .mini-cal{flex:1 1 260px}
  .grade{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:900px){
  :root{--vn-lateral:0px}
  .vn-side{position:static;width:auto;flex-direction:column;border-right:0;border-bottom:1px solid var(--vn-linha);overflow:visible}
  .vn-brand{padding:14px 16px;border-bottom:0}
  .vn-navtit{display:none}
  .vn-nav{flex-direction:row;gap:4px;padding:0 12px 10px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .vn-nav a{white-space:nowrap;padding:9px 14px;flex:none}
  .vn-nav a span{font-size:13px}
  .vn-foot{position:absolute;top:10px;right:12px;margin:0;padding:0;border:0}
  .vn-user .vn-user-info{display:none}
  .vn-top{position:static;left:0;height:auto;padding:10px 16px;gap:10px}
  .vn-top .vn-top-tit{display:none}
  .vn-top .vn-search{width:100%;max-width:none}
  .conteudo{margin-left:0;padding:20px 16px 40px}
  h1{font-size:21px}
  .cabecalho-pagina{align-items:stretch;flex-direction:column;gap:12px}
  .busca{width:100%}
  .busca input{min-width:0;flex:1;height:48px}
  .busca button{height:48px}
  .acoes-topo{width:100%}
  .acoes-topo>.btn,.acoes-topo>.btn-sec{width:100%;height:48px}
  .kpis{grid-template-columns:1fr 1fr}
  .tiles{grid-template-columns:1fr}
  .msg-layout{grid-template-columns:1fr;min-height:0}
  .msg-baloes{min-height:50vh}
  .balao{max-width:82%}
  .grade-form{grid-template-columns:1fr}
  .grade-form .col2,.grade-form .col3{grid-column:span 1}
  .grade-form input,.grade-form select,.grade-form textarea{height:48px;font-size:15px}
  .grade{grid-template-columns:1fr}
  .ficha-cab{flex-direction:column-reverse;align-items:stretch}
  .ficha-foto{width:100%;height:180px}
  .ficha-acoes .btn,.ficha-acoes .btn-sec,.ficha-acoes .btn-perigo{flex:1 1 46%;height:48px}
  .ficha-acoes .btn-perigo{margin-left:0}
  .fat-cab{flex-direction:column;align-items:flex-start;gap:14px}
  .imp-grid{grid-template-columns:1fr}
  /* tabelas largas rolam na horizontal em vez de espremer o nome */
  .tabela{display:block;overflow-x:auto;white-space:nowrap}
  .btn,button[type=submit],.btn-sec{height:48px}
}

@media print{
  .vn-side,.vn-top,.acoes-topo,.ficha-acoes,.fat-bar,.fat-vista,.paginacao{display:none!important}
  .conteudo{margin:0;padding:0}
  body{background:#fff}
  .tabela,.ficha,.painel-card{box-shadow:none}
}


/* =========================================================================
   ADIÇÕES PARA A MARCAÇÃO ATUAL DO _topo.asp
   (logotipo, gaveta do menu, barra inferior e tabelas em cartão no celular)
   ========================================================================= */

/* logotipo real na barra lateral */
.vn-brand{flex-direction:column;align-items:flex-start;gap:7px}
.vn-brand-logo{display:block;height:19px;width:auto}
.vn-brand .vn-brand-sub{font-size:10.5px;color:var(--vn-neutro);font-weight:600;letter-spacing:.12em;text-transform:uppercase}

/* botão de menu e fundo escuro da gaveta: só no celular */
.vn-menu-btn{display:none;width:40px;height:40px;margin-left:-8px;border:0;background:transparent;
  border-radius:var(--vn-raio-sm);color:var(--vn-neutro-2);cursor:pointer;align-items:center;justify-content:center}
.vn-menu-btn:hover{background:var(--vn-linha-2)}
.vn-nav-backdrop{display:none}

/* barra inferior de destinos: só no celular */
.vn-tabbar{display:none}

@media (max-width:900px){
  /* a lateral vira gaveta, escondida até tocar no menu */
  .vn-side{position:fixed;top:0;left:0;bottom:0;width:272px;z-index:60;
    transform:translateX(-100%);transition:transform .22s ease;box-shadow:0 0 40px rgba(20,40,60,.18);
    flex-direction:column;border-right:1px solid var(--vn-linha);border-bottom:0;overflow-y:auto}
  body.nav-open .vn-side{transform:translateX(0)}
  .vn-brand{padding:22px 22px 18px;border-bottom:1px solid var(--vn-linha-2)}
  .vn-navtit{display:block;margin:20px 22px 8px}
  .vn-nav{flex-direction:column;gap:1px;padding:0 12px;overflow:visible}
  .vn-nav a{white-space:normal;padding:12px 12px}
  .vn-foot{position:static;margin-top:auto;padding:16px 20px;border-top:1px solid var(--vn-linha-2)}
  .vn-user .vn-user-info{display:block}
  .vn-nav-backdrop{display:block;position:fixed;inset:0;background:rgba(20,33,41,.42);opacity:0;
    pointer-events:none;transition:opacity .22s;z-index:50}
  body.nav-open .vn-nav-backdrop{opacity:1;pointer-events:auto}

  /* topo fixo com o botão de menu */
  .vn-top{position:fixed;top:0;left:0;right:0;height:56px;padding:0 12px;gap:10px;z-index:40}
  .vn-menu-btn{display:inline-flex}
  .vn-top .vn-top-tit{display:block;font-size:16px}
  .vn-top .vn-search{display:none}
  .conteudo{margin-left:0;padding:72px 16px 96px}

  /* barra inferior de cinco destinos */
  .vn-tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;height:68px;z-index:45;
    background:var(--vn-surface);border-top:1px solid var(--vn-linha);align-items:center;padding:0 4px 6px}
  .vn-tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding-top:8px;
    position:relative;font-size:10.5px;font-weight:500;color:var(--vn-neutro);text-decoration:none}
  .vn-tabbar a.ativo{color:var(--vn-marca);font-weight:600}
  .vn-tabbar .tab-badge{position:absolute;top:4px;right:22px;min-width:16px;height:16px;padding:0 4px;
    border-radius:8px;background:var(--vn-petroleo);color:#fff;font-size:10px;font-weight:700;
    display:grid;place-items:center}
  .vn-tabbar .tab-badge-msg{background:var(--vn-perigo);right:20px}

  /* listas viram cartões (o _topo.asp já põe data-label em cada célula) */
  .tabela{display:block;overflow:visible;white-space:normal;border:0;background:transparent;box-shadow:none}
  .tabela thead{display:none}
  .tabela tbody,.tabela tr,.tabela td{display:block;width:auto}
  .tabela tbody tr{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
    margin-bottom:10px;padding:6px 0;box-shadow:var(--vn-sombra)}
  .tabela tbody tr:hover{background:var(--vn-surface)}
  .tabela td{border-bottom:0;padding:7px 16px;display:flex;align-items:baseline;gap:12px;font-size:14px}
  .tabela td:empty{display:none}
  .tabela td::before{content:attr(data-label);flex:none;min-width:88px;font-size:11px;font-weight:600;
    letter-spacing:.05em;text-transform:uppercase;color:var(--vn-fraco-2)}
  .tabela td.nome,.tabela td.ag-pac{padding-top:12px}
  .tabela td.nome::before,.tabela td.ag-pac::before{display:none}
  .tabela .cel-nome{gap:12px}
  .tabela td.fila-acoes,.tabela td.acoes-cel,.tabela td.ag-chegou{padding:10px 16px 12px;justify-content:flex-end}
  .tabela td.fila-acoes::before,.tabela td.acoes-cel::before,.tabela td.ag-chegou::before{display:none}
  .fila-acoes button{height:44px}
  .fila-acoes .bt-retirar,.fila-acoes .bt-priori{width:44px}
  /* a agenda do dia continua tabela: rola na horizontal */
  .agenda-tabela{display:table;background:var(--vn-surface);border:1px solid var(--vn-linha);
    border-radius:var(--vn-raio);box-shadow:var(--vn-sombra)}
  .agenda-main{overflow-x:auto}

  .vn-top .bip-toggle{margin-left:auto}
}

@media (max-width:900px) and (min-width:0px){
  /* espaço para a barra inferior não cobrir o rodapé das telas */
  .acoes-form,.paginacao,.rodape-ficha{margin-bottom:12px}
}


/* =========================================================================
   AJUSTES PARA OS .asp NOVOS (login, fila)
   ========================================================================= */

/* --- login --- */
.marca .marca-logo{display:block;height:22px;width:auto}
.erro{display:flex;align-items:center;gap:8px}
.erro svg{flex:none}
.campo-senha{position:relative;display:block;margin-top:6px}
.campo-senha input{margin-top:0;padding-right:46px}
.ver-senha{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;
  border:0;background:transparent;border-radius:6px;color:var(--vn-fraco);cursor:pointer;
  display:grid;place-items:center;padding:0}
.ver-senha:hover{background:var(--vn-linha-2);color:var(--vn-neutro-2)}
.ver-senha.on{color:var(--vn-petroleo)}
.login-ajuda{margin:20px 0 0;text-align:center;font-size:12.5px;color:var(--vn-fraco)}

/* --- fila: espera em destaque --- */
.fila-tabela .fila-tempo{font-size:16px;font-weight:600;color:var(--vn-neutro-2)}
.fila-tabela .fila-tempo small{font-size:12px;font-weight:400;color:var(--vn-fraco)}
.fila-tabela .fila-tempo-alto{color:var(--vn-atencao)}
.fila-tabela .cel-sub{display:block;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--vn-fraco)}
.fila-acoes .bt-ico{width:32px;padding:0;border-radius:50%;display:inline-grid;place-items:center;color:var(--vn-fraco)}
.fila-acoes .bt-priori.bt-ico{color:#c9a13f}
.fila-acoes .bt-priori.bt-ico:hover{background:var(--vn-atencao-bg);border-color:var(--vn-atencao-bd)}
.fila-acoes .bt-retirar.bt-ico:hover{background:var(--vn-perigo-bg);color:var(--vn-perigo);border-color:var(--vn-perigo-bd)}
.fila-legenda{display:flex;gap:20px;flex-wrap:wrap;margin:14px 0 0;font-size:12.5px;color:var(--vn-fraco)}
.fila-legenda span{display:inline-flex;align-items:center;gap:7px}
.fila-legenda i{display:inline-block;width:3px;height:16px;border-radius:2px}
.fila-legenda .fl-aguardando{background:#d9b463}
.fila-legenda .fl-chamado{background:var(--vn-petroleo)}
.fila-legenda .fl-atend{background:var(--vn-sucesso)}

/* --- fila: painel lateral de adicionar --- */
.fp-backdrop{position:fixed;inset:0;background:rgba(20,33,41,.34);opacity:0;pointer-events:none;
  transition:opacity .2s;z-index:48}
body.fp-open .fp-backdrop{opacity:1;pointer-events:auto}
.fila-painel{position:fixed;top:var(--vn-topo);right:0;bottom:0;width:404px;max-width:92vw;background:var(--vn-surface);
  border-left:1px solid var(--vn-linha);box-shadow:-18px 0 40px rgba(20,40,60,.10);z-index:52;
  display:flex;flex-direction:column;transform:translateX(100%);transition:transform .22s ease}
.fila-painel.aberto{transform:translateX(0)}
.fp-cab{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;
  border-bottom:1px solid var(--vn-linha-2);font-size:16px;font-weight:600}
.fp-fechar{width:32px;height:32px;border:0;background:transparent;border-radius:var(--vn-raio-sm);
  color:var(--vn-fraco);cursor:pointer;display:grid;place-items:center;padding:0}
.fp-fechar:hover{background:var(--vn-linha-2);color:var(--vn-tinta)}
.fp-busca{position:relative;margin:0;padding:20px 24px;border-bottom:1px solid var(--vn-linha-2)}
.fp-busca svg{position:absolute;left:38px;top:50%;transform:translateY(-50%);color:var(--vn-fraco)}
.fp-busca input{width:100%;height:46px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  background:var(--vn-campo);padding:0 14px 0 40px;font:inherit;font-size:14px;color:var(--vn-tinta)}
.fp-busca input:focus{outline:none;border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.fp-lista{flex:1;overflow-y:auto}
.fp-item{display:flex;align-items:center;gap:12px;margin:0;padding:14px 24px;border-bottom:1px solid var(--vn-linha-3)}
.fp-item .p-ini{width:34px;height:34px;font-size:12px}
.fp-txt{flex:1;min-width:0}
.fp-nome{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-sub{display:block;font-size:12.5px;color:var(--vn-neutro);font-family:'IBM Plex Mono',monospace}
.fp-add{flex:none;height:32px;padding:0 14px;background:var(--vn-petroleo);color:#fff;border:0;
  border-radius:var(--vn-raio-pill);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.fp-add:hover{background:var(--vn-petroleo-esc)}
.fp-vazio{padding:24px;color:var(--vn-neutro);font-size:13.5px;text-align:center}
.fp-rodape{margin:0;padding:16px 24px;border-top:1px solid var(--vn-linha-2);font-size:12.5px;color:var(--vn-neutro)}
.fp-rodape b{color:var(--vn-tinta)}

@media (max-width:900px){
  .fila-painel{top:56px;bottom:0;width:100%;max-width:none;border-left:0}
  .fila-tabela .fila-tempo{font-size:18px}
  .fp-add{height:44px;padding:0 18px;font-size:13.5px}
  .fp-item{padding:14px 16px}
  .fp-busca{padding:16px}
  .fp-busca svg{left:30px}
}


/* =========================================================================
   AJUSTES PARA agendamento_editar.asp E atendimento_editar.asp
   ========================================================================= */

/* horários livres ao lado do campo Hora */
.ag-livres{margin-top:2px}
.ag-livres-tit{display:block;font-size:11.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--vn-fraco);margin-bottom:8px}
.ag-livres-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px}
.ag-livres-grade .ag-slot{width:100%;height:auto;padding:8px 0;text-align:center;background:var(--vn-surface);
  border:1px solid #d7e2e8;border-radius:var(--vn-raio-sm);color:var(--vn-petroleo);
  font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13px;cursor:pointer;box-shadow:none}
.ag-livres-grade .ag-slot:hover{background:var(--vn-tint);border-color:#c4d8e2}
.ag-livres-grade .ag-slot.ativo{background:var(--vn-petroleo);border-color:var(--vn-petroleo);color:#fff}

/* coluna de consultas anteriores (atendimento_editar) */
.ae-fila{flex:none;width:236px;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);overflow:hidden;box-shadow:var(--vn-sombra);padding:0}
.ae-fila h2{margin:0;padding:14px 16px;border-bottom:1px solid var(--vn-linha-2);
  font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--vn-marca);
  display:flex;align-items:center;gap:8px}
.ae-cons-qtd{font-family:'IBM Plex Mono',monospace;font-size:11.5px;font-weight:600;color:var(--vn-neutro);
  background:var(--vn-linha-2);border-radius:20px;padding:1px 8px;letter-spacing:0}
.ae-fila .wk-fila-lista{max-height:72vh;overflow-y:auto}
.ae-cons{display:block;padding:11px 16px;border-bottom:1px solid var(--vn-linha-3);
  border-left:3px solid transparent;color:inherit;text-decoration:none}
.ae-cons:hover{background:#fafcfd;text-decoration:none}
.ae-cons .wk-fq-nome{display:block;font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;color:var(--vn-tinta)}
.ae-cons-res{display:block;font-size:12px;color:var(--vn-neutro);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.ae-cons-ativa{background:var(--vn-tint);border-left-color:var(--vn-petroleo)}
.ae-cons-ativa .wk-fq-nome{color:var(--vn-marca)}
.ae-cons-ativa .ae-cons-res{color:#4f6b7a}
.ae-cons-ativa:hover{background:var(--vn-tint)}
.ae-fila .wk-fila-vazia{padding:20px 16px;font-size:13px;color:var(--vn-neutro);margin:0}
/* coluna de escrita com largura de leitura */
.ae-main{max-width:1020px}
/* "Excluir" longe de "Salvar" no rodapé do formulário */
.formulario .acoes-form .btn-perigo{margin-left:auto}

@media (max-width:900px){
  .ae-wrap{flex-direction:column}
  .ae-fila{width:100%}
  .ae-fila .wk-fila-lista{max-height:none;display:flex;gap:8px;overflow-x:auto;padding:12px 16px}
  .ae-cons{flex:none;border:1px solid var(--vn-linha);border-left-width:3px;border-radius:var(--vn-raio-pill);
    padding:8px 14px}
  .ae-cons .ae-cons-res{display:none}
  .ae-main{max-width:none}
  .ag-livres-grade{grid-template-columns:repeat(auto-fill,minmax(74px,1fr))}
  .ag-livres-grade .ag-slot{padding:12px 0}
  .formulario .acoes-form{flex-wrap:wrap}
  .formulario .acoes-form .btn-perigo{margin-left:0;width:100%}
}

.ag-livres-carregando,.ag-livres-vazio{grid-column:1/-1;font-size:12.5px;color:var(--vn-fraco);padding:6px 0}


/* =========================================================================
   AGENDA SEMANAL  (classes .vw-* e .wk-* emitidas pelo agenda.asp)
   Reescritas no sistema novo — mesmos nomes de classe.
   ========================================================================= */
.vw-toggle{display:inline-flex;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);padding:3px;gap:2px}
.vw-toggle a{display:flex;align-items:center;height:32px;padding:0 16px;border-radius:5px;
  font-size:13px;font-weight:500;color:var(--vn-neutro-2);text-decoration:none}
.vw-toggle a:hover{background:var(--vn-linha-2);color:var(--vn-tinta)}
.vw-toggle a.on{background:var(--vn-petroleo);color:#fff;font-weight:600}
.vw-toggle a.on:hover{background:var(--vn-petroleo-esc);color:#fff}
.vw-toggle a+a{border-left:0}
.vw-range{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13.5px;min-width:126px;
  text-align:center;color:var(--vn-tinta)}
.ag-medico-nome{font-weight:400;color:var(--vn-neutro);font-size:16px}

.wk-wrap{display:flex;gap:20px;align-items:flex-start;margin-top:4px}

/* fila de espera ao lado da grade */
.wk-fila{flex:0 0 280px;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);padding:0;box-shadow:var(--vn-sombra);overflow:hidden}
.wk-fila h2{margin:0;padding:16px 18px;border-bottom:1px solid var(--vn-linha-2);
  font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--vn-marca)}
.wk-fila-vazia{color:var(--vn-neutro);font-size:13px;margin:0;padding:18px}
.wk-fila-lista{display:block;margin:0}
.wk-fq{display:block;padding:12px 18px;border-bottom:1px solid var(--vn-linha-3);
  border-left:3px solid var(--vn-linha);background:var(--vn-surface);border-radius:0;text-decoration:none}
.wk-fq:hover{background:#fafcfd;text-decoration:none}
.wk-fq-nome{display:block;font-weight:600;font-size:14px;color:var(--vn-tinta);line-height:1.3}
.wk-fq-meta{display:block;font-size:12.5px;color:var(--vn-neutro);margin-top:1px}
.wk-fq.st-aguardando{border-left-color:#d9b463;background:var(--vn-surface)}
.wk-fq.st-chamado{border-left-color:var(--vn-petroleo);background:var(--vn-surface)}
.wk-fq.st-em_atendimento{border-left-color:var(--vn-sucesso);background:var(--vn-surface)}
.wk-fila-abrir{display:flex;align-items:center;justify-content:center;height:38px;margin:14px 18px 16px;
  border:1px solid #dde5e9;border-radius:var(--vn-raio-sm);font-size:13px;font-weight:600;color:#3f4d59;text-decoration:none}
.wk-fila-abrir:hover{background:var(--vn-campo);color:#3f4d59;text-decoration:none}

/* grade da semana */
.wk-scroll{flex:1 1 auto;min-width:0;overflow-x:auto}
.wk-cal{display:grid;grid-template-columns:64px repeat(7,minmax(0,1fr));grid-template-rows:auto var(--wkh);
  min-width:760px;background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);overflow:hidden}
.wk-hd{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:10px 6px;
  border-left:1px solid #eef2f4;border-bottom:1px solid var(--vn-linha);background:var(--vn-cab);
  font-size:12px;color:var(--vn-neutro);text-align:center;text-decoration:none}
.wk-hd b{color:var(--vn-tinta);font-size:12.5px;font-weight:600}
.wk-hd span{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--vn-neutro)}
.wk-corner{border-left:0;background:var(--vn-cab);border-bottom:1px solid var(--vn-linha)}
a.wk-hd:hover{background:#f2f5f7;text-decoration:none}
.wk-hd.wk-hoje{background:#f2f7f9}
.wk-hd.wk-hoje b,.wk-hd.wk-hoje span{color:var(--vn-marca)}
.wk-dh-off{opacity:1}
.wk-dh-off b,.wk-dh-off span{color:var(--vn-fraco-2)}
.wk-dh-tag{display:block;font-size:9.5px;color:var(--vn-fraco-2);text-transform:uppercase;
  letter-spacing:.08em;font-weight:600;margin-top:2px}

.wk-gut{position:relative;height:var(--wkh);background:var(--vn-surface)}
.wk-hr{position:absolute;right:8px;transform:translateY(-50%);font-family:'IBM Plex Mono',monospace;
  font-size:11.5px;color:var(--vn-fraco);white-space:nowrap}
.wk-col{position:relative;height:var(--wkh);border-left:1px solid #eef2f4;
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 47px,#f2f6f7 47px,#f2f6f7 48px)}
.wk-col.wk-hoje{background-color:#fbfdfe}
.wk-open{position:absolute;left:0;right:0;background:rgba(20,86,111,.045)}
.wk-lunch{position:absolute;left:0;right:0;display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(45deg,#f7f9fa,#f7f9fa 6px,#eff3f5 6px,#eff3f5 12px)}
.wk-lunch span{font-size:11px;color:var(--vn-fraco);letter-spacing:.04em}
.wk-bloq{background-color:#f6f8f9;background-image:none}
.wk-bloqdia{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.wk-bloqdia span{font-size:10.5px;font-weight:600;color:var(--vn-fraco-2);writing-mode:vertical-rl;
  transform:rotate(180deg);letter-spacing:.12em;text-transform:uppercase}

/* blocos de consulta */
.wk-ev{display:block;border-radius:5px;padding:4px 8px;font-size:11.5px;line-height:1.3;font-weight:500;
  border-left:3px solid rgba(0,0,0,.16);box-shadow:none;cursor:pointer;white-space:normal;
  overflow-wrap:anywhere;text-decoration:none}
.wk-ev b{font-family:'IBM Plex Mono',monospace;font-weight:600;margin-right:4px}
.wk-ev:hover{filter:brightness(.97);z-index:5;text-decoration:none}
.wk-agendado{background:var(--vn-cinza-bg);color:var(--vn-cinza-tx);border-left-color:#8e9aa4}
.wk-confirmado{background:#eaf1f5;color:#175873;border-left-color:var(--vn-petroleo)}
.wk-aguardando{background:var(--vn-roxo-bg);color:var(--vn-roxo);border-left-color:#7a68c0}
.wk-nowhapp{background:var(--vn-cinza-bg);color:var(--vn-cinza-tx);border-left-color:#8e9aa4}
.wk-em_espera{background:var(--vn-atencao-bg);color:var(--vn-atencao);border-left-color:#d9b463}
.wk-em_atendimento{background:var(--vn-sucesso-bg);color:var(--vn-sucesso);border-left-color:var(--vn-sucesso)}
.wk-atendido{background:var(--vn-sucesso-bg);color:var(--vn-sucesso);border-left-color:var(--vn-sucesso)}
.wk-faltou{background:var(--vn-perigo-bg);color:var(--vn-perigo);border-left-color:#c58273}
.wk-desmarcou,.wk-remarcado{background:var(--vn-cinza-bg);color:var(--vn-cinza-tx);border-left-color:#a2adba}
.wk-pendente{background:var(--vn-atencao-bg);color:var(--vn-atencao);border-left-color:#d9b463}
.wk-visita{background:#eaf1ec;color:#3f7a5e;border-left-color:#6da88a}

/* variante em tabela da mesma semana */
.wk-tab{width:100%;table-layout:fixed;border-collapse:collapse;background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio);overflow:hidden;min-width:760px;font-size:12.5px}
.wk-tab th,.wk-tab td{border:1px solid #f2f6f7}
.wk-hh{width:64px;background:var(--vn-cab)}
.wk-dh{background:var(--vn-cab);padding:10px 6px;text-align:center;vertical-align:middle;font-weight:500;
  border-bottom:1px solid var(--vn-linha)}
.wk-dh a{display:block;color:var(--vn-tinta);text-decoration:none}
.wk-dh b{display:block;font-size:12.5px;font-weight:600}
.wk-dh span{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--vn-neutro)}
.wk-dh.wk-hoje{background:#f2f7f9}
.wk-dh.wk-hoje b{color:var(--vn-marca)}
.wk-hora{width:64px;text-align:right;padding:5px 10px;color:var(--vn-fraco);font-size:11.5px;
  font-family:'IBM Plex Mono',monospace;white-space:nowrap;vertical-align:top;background:var(--vn-surface)}
.wk-cell{vertical-align:top;padding:2px;height:26px}
.wk-free{background:var(--vn-surface)}
.wk-nowork{background:#fafbfc}
.wk-off{background:#f6f8f9}
.wk-vazio{padding:2rem;text-align:center;color:var(--vn-neutro)}

.wk-legenda{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin:16px 0 0}
.wk-lg{font-size:12px;font-weight:600;padding:4px 10px;border-radius:6px;border-left:3px solid rgba(0,0,0,.14)}

@media (max-width:900px){
  .wk-wrap{flex-direction:column;gap:16px}
  .wk-fila{flex:1 1 auto;width:100%}
  .wk-cal,.wk-tab{min-width:700px}
  .vw-toggle{width:100%}
  .vw-toggle a{flex:1;justify-content:center;height:36px}
  .vw-range{min-width:0;flex:1}
}


/* =========================================================================
   HORÁRIOS DO MÉDICO (medico_horarios.asp) — classes .grp-* e .ch-*
   ========================================================================= */
.grp-dias{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 16px}
.dia-chk{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-pill);padding:8px 14px;cursor:pointer;font-size:13.5px;font-weight:500;
  background:var(--vn-surface);color:var(--vn-neutro-2);user-select:none}
.dia-chk:hover{background:var(--vn-campo)}
.dia-chk input{width:16px;height:16px;accent-color:var(--vn-petroleo);cursor:pointer;margin:0}
.dia-chk:has(input:checked){border-color:var(--vn-tint-bd);background:var(--vn-tint);color:var(--vn-marca);font-weight:600}
.dia-fds span{color:var(--vn-perigo)}
.dia-chk.dia-fds:has(input:checked) span{color:var(--vn-perigo)}
.grp-campos{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px}
.ch-campo{display:flex;flex-direction:column;font-size:12px;font-weight:600;color:var(--vn-neutro-2);
  text-transform:none;letter-spacing:0;gap:6px}
.ch-campo input{height:42px;padding:0 12px;border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);
  font:inherit;font-size:14px;font-weight:400;color:var(--vn-tinta);background:var(--vn-surface);
  text-transform:none;letter-spacing:0}
.ch-campo input[type=time]{width:132px;font-family:'IBM Plex Mono',monospace}
.ch-campo input[type=number]{width:120px;font-family:'IBM Plex Mono',monospace}
.ch-campo input:focus{outline:none;border-color:var(--vn-petroleo);background:#fff;box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.ch-fim{font-size:13.5px;color:var(--vn-neutro);padding-bottom:11px}
.ch-fim b{color:var(--vn-petroleo);font-family:'IBM Plex Mono',monospace}
@media (max-width:640px){
  .grp-campos{gap:12px}
  .ch-campo{flex:1 1 100%}
  .ch-campo input[type=time],.ch-campo input[type=number]{width:100%}
  .ch-fim{flex:1 1 100%;padding-bottom:0}
}

/* =========================================================================
   AGENDA DO DIA NO CELULAR — a tabela vira cartões
   (sobrepõe a regra anterior que a mantinha como tabela rolável)
   ========================================================================= */
@media (max-width:680px){
  .agenda-main{overflow-x:visible}
  .agenda-tabela{display:block;min-width:0;border:0;background:transparent;box-shadow:none}
  .agenda-tabela thead{display:none}
  .agenda-tabela tbody{display:block;width:100%}
  .agenda-tabela tr.ag-linha{display:block;background:var(--vn-surface);border:1px solid var(--vn-linha);
    border-radius:var(--vn-raio);padding:12px 14px;margin-bottom:10px;box-shadow:var(--vn-sombra)}
  .agenda-tabela td{display:block;border:none;padding:1px 0;max-width:none;width:auto;white-space:normal}
  .agenda-tabela .ag-hora{font-size:15px;margin-bottom:2px;width:auto}
  .agenda-tabela .ag-pac strong{font-size:15px}
  .agenda-tabela .ag-fone,.agenda-tabela .ag-conv,.agenda-tabela .ag-tipo{color:var(--vn-neutro);font-size:13px}
  .agenda-tabela .ag-sit{margin-top:10px;width:auto}
  .agenda-tabela .ag-sit .st-form{display:block;width:100%}
  .agenda-tabela .ag-sit .st-sel{width:100%;padding-top:12px;padding-bottom:12px;text-align:center}
  .agenda-tabela .ag-chegou{margin-top:10px;text-align:left;width:auto}
  .agenda-tabela .ag-chegou .bt-atender,.agenda-tabela .ag-chegou .bt-chegou,.agenda-tabela .ag-chegou .na-fila{
    display:flex;align-items:center;justify-content:center;height:48px;width:100%}
}


/* =========================================================================
   CORREÇÕES DA FILA DE ESPERA
   1) as classes de situação ficam nas pílulas, não na linha inteira
   2) a célula de ações volta a ser célula de tabela (flex quebrava a largura)
   ========================================================================= */
tr.fila-linha,
tr.fila-linha.st-aguardando,
tr.fila-linha.st-chamado,
tr.fila-linha.st-em_atendimento{background:var(--vn-surface)}
tr.fila-linha:hover,
tr.fila-linha.st-aguardando:hover,
tr.fila-linha.st-chamado:hover,
tr.fila-linha.st-em_atendimento:hover{background:#fafcfd}
/* a situação da linha aparece só na barra à esquerda */
.fila-linha td:first-child{box-shadow:inset 3px 0 0 var(--vn-linha)}
.fila-linha.st-aguardando td:first-child{box-shadow:inset 3px 0 0 #d9b463}
.fila-linha.st-chamado td:first-child{box-shadow:inset 3px 0 0 var(--vn-petroleo)}
.fila-linha.st-em_atendimento td:first-child{box-shadow:inset 3px 0 0 var(--vn-sucesso)}

/* pílula de situação: garante o fundo mesmo dentro da linha */
.fila-tabela .badge-st{display:inline-block;font-size:12px;font-weight:600;padding:4px 10px;border-radius:6px;white-space:nowrap}
.fila-tabela .badge-st.st-aguardando{background:var(--vn-atencao-bg);color:var(--vn-atencao)}
.fila-tabela .badge-st.st-chamado{background:#e9f1f4;color:#175873}
.fila-tabela .badge-st.st-em_atendimento{background:var(--vn-sucesso-bg);color:var(--vn-sucesso)}

/* ações: célula normal de tabela, botões em linha */
.fila-tabela td.fila-acoes{display:table-cell;white-space:nowrap;text-align:right;width:1%;padding:12px 20px}
.fila-tabela td.fila-acoes .fbtn{display:inline-block;margin:0 0 0 6px;vertical-align:middle}
.fila-tabela td.fila-acoes .fbtn:first-child{margin-left:0}
.fila-tabela td.fila-acoes button{height:32px;padding:0 16px;font-size:12.5px;font-weight:600;
  border:1px solid #dde5e9;background:#fff;color:#3f4d59;border-radius:var(--vn-raio-pill);cursor:pointer;box-shadow:none}
.fila-tabela td.fila-acoes .bt-chamar,
.fila-tabela td.fila-acoes .bt-atender,
.fila-tabela td.fila-acoes .bt-concluir{background:var(--vn-petroleo);color:#fff;border-color:var(--vn-petroleo)}
.fila-tabela td.fila-acoes .bt-chamar:hover,
.fila-tabela td.fila-acoes .bt-atender:hover,
.fila-tabela td.fila-acoes .bt-concluir:hover{background:var(--vn-petroleo-esc);color:#fff}
.fila-tabela td.fila-acoes .bt-ico{width:32px;padding:0;border-radius:50%;display:inline-grid;place-items:center}

/* nome do paciente: número da ficha abaixo, não colado no nome */
.fila-tabela .cel-nome{display:flex;align-items:center;gap:12px}
.fila-tabela .cel-sub{display:block;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--vn-fraco);margin-top:1px}

/* a tabela nunca passa da borda do cartão */
.fila-tabela{table-layout:auto;width:100%}
.fila-tabela td,.fila-tabela th{overflow-wrap:anywhere}
.fila-tabela .nome{overflow-wrap:normal}

@media (max-width:680px){
  .fila-tabela td.fila-acoes{display:block;width:auto;text-align:left;padding:10px 16px 12px}
  .fila-tabela td.fila-acoes .fbtn{margin:0 6px 0 0}
  .fila-tabela td.fila-acoes button{height:44px}
  .fila-tabela td.fila-acoes .bt-ico{width:44px}
}


/* =========================================================================
   VALORES POR PROCEDIMENTO (valores.asp) — classes .val-*
   ========================================================================= */
.form-valores{max-width:760px}
.val-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:0;
  background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);overflow:hidden;margin:0 0 20px}
.val-linha{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 20px;border-bottom:1px solid var(--vn-linha-3)}
.val-linha:last-child{border-bottom:0}
.val-nome{font-size:14px;font-weight:600;color:var(--vn-tinta);margin:0;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.val-in{display:flex;align-items:center;flex:none;width:160px;height:40px;
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);background:var(--vn-surface);
  overflow:hidden;transition:border-color .12s,box-shadow .12s}
.val-in:focus-within{border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.val-in span{flex:none;height:100%;display:flex;align-items:center;padding:0 10px;
  background:var(--vn-campo);border-right:1px solid var(--vn-linha);
  font-size:12.5px;font-weight:600;color:var(--vn-neutro)}
.val-in input{flex:1;min-width:0;width:100%;height:100%;margin:0;border:0;background:transparent;
  padding:0 12px;font:inherit;font-family:'IBM Plex Mono',monospace;font-size:14px;
  text-align:right;color:var(--vn-tinta)}
.val-in input:focus{outline:none;box-shadow:none}
.val-in input::placeholder{color:var(--vn-fraco-2)}

/* seletor de procedimento no topo */
.form-valores .tw-seletor,.tw-seletor{margin:0 0 20px}

@media (max-width:680px){
  .val-lista{grid-template-columns:1fr}
  .val-linha{padding:12px 16px}
  .val-in{width:140px;height:48px}
}


/* =========================================================================
   AGENDA DO DIA — acabamento das colunas
   ========================================================================= */
.agenda-tabela .ag-conv,.agenda-tabela .ag-tipo{font-size:13.5px;color:var(--vn-neutro-2)}
.agenda-tabela .ag-idade small{font-size:12px;color:var(--vn-fraco);font-weight:400}
.agenda-tabela .ag-pac strong{display:block}
.wk-cell.wk-has{background:var(--vn-surface);padding:2px 3px}
.wk-cell.wk-has .wk-ev+.wk-ev{margin-top:2px}
.agenda-topo h1{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.agenda-controles .nav-data .btn-sec{width:32px;height:32px;padding:0;font-size:16px}
.agenda-controles .form-medico select{height:38px}


/* =========================================================================
   AGENDA DO DIA — feriado e densidade das linhas
   (button[type=submit] tem mais peso que .feriado-btn; por isso o seletor
    abaixo é button.feriado-btn)
   ========================================================================= */
button.feriado-btn,
.feriado-form button[type=submit]{display:inline-flex;align-items:center;gap:7px;height:32px;width:auto;
  padding:0 14px;background:var(--vn-surface);border:1px solid #dde5e9;color:var(--vn-neutro-2);
  border-radius:var(--vn-raio-pill);font-size:12.5px;font-weight:600;box-shadow:none;cursor:pointer}
button.feriado-btn:hover,
.feriado-form button[type=submit]:hover{background:var(--vn-campo);color:var(--vn-tinta)}

/* o <form> quebra o <p class="agenda-dia">; então ele vira uma linha logo abaixo */
.agenda-dia{display:block;margin:0 0 8px}
.feriado-form{display:inline-block;margin:0 0 18px}
.feriado-tag{margin-left:8px}

/* linhas mais compactas: ficha, idade e observação em uma coluna estreita */
.agenda-tabela .ag-pac{max-width:520px}
.agenda-tabela .ag-pac strong{display:block;font-size:14px;line-height:1.35}
.agenda-tabela .ag-pac small{display:block;font-family:'IBM Plex Mono',monospace;font-size:12px;
  color:var(--vn-fraco);line-height:1.4;margin-top:1px}
.agenda-tabela .ag-idade{margin-top:0}
.agenda-tabela .ag-idade small{display:block;font-family:'IBM Plex Mono',monospace;font-size:12px;
  color:var(--vn-fraco);line-height:1.4}
.agenda-tabela .ag-obs{margin-top:3px;font-size:12.5px;line-height:1.45;color:var(--vn-neutro)}
.agenda-tabela td{padding:12px 20px}


/* =========================================================================
   AGENDA — cabeçalho como na proposta
   linha 1: título + Dr. + "Novo agendamento" à direita
   linha 2: Dia/Semana e médico à esquerda · data e "hoje" à direita
   linha 3: data por extenso + "marcar feriado" na mesma linha
   ========================================================================= */
.agenda-topo{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin:0 0 20px}
.agenda-topo h1{margin:0;font-size:26px;font-weight:600;letter-spacing:-.5px}
.ag-medico-nome{font-size:16px;font-weight:400;color:var(--vn-neutro);margin-left:8px}
.agenda-topo .btn{height:40px}

.agenda-controles{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px}
.agenda-controles .vw-toggle{order:1}
.agenda-controles .form-medico{order:2}
.agenda-controles .nav-data{order:3;margin-left:auto}
.agenda-controles .hoje-link{order:4}
/* "hoje" fica fora do grupo da data, como na proposta */
.nav-data .hoje-link{margin-left:6px;padding-right:6px}

/* a data e o botão de feriado voltam para a mesma linha
   (o <form> fecha o <p>, então os dois viram irmãos inline-block) */
.agenda-dia{display:inline-block;vertical-align:middle;margin:0 12px 18px 0;
  font-size:13.5px;font-weight:600;color:var(--vn-neutro-2)}
.feriado-form{display:inline-block;vertical-align:middle;margin:0 0 18px}


/* ícone do aviso sonoro no topo (era emoji) */
.bip-toggle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;
  border:0;background:transparent;border-radius:var(--vn-raio-sm);color:var(--vn-neutro);cursor:pointer}
.bip-toggle:hover{background:var(--vn-linha-2);color:var(--vn-tinta)}
.bip-toggle.on{color:var(--vn-petroleo);filter:none}
.bip-toggle svg{display:block}

/* ícones nos rótulos de feriado, bloqueio e "na fila" */
.feriado-tag{display:inline-flex;align-items:center;gap:6px}
.na-fila{display:inline-flex;align-items:center;gap:6px}
.form-bloquear button svg,button.feriado-btn svg{flex:none}


/* =========================================================================
   CORREÇÃO GERAL DE CASCATA
   button[type=submit] (0,1,1) vencia .btn-sec / .btn-perigo (0,1,0).
   Qualquer <button type="submit" class="btn-sec"> saía como botão primário.
   ========================================================================= */
button[type=submit].btn-sec,
input[type=submit].btn-sec{background:var(--vn-surface);color:#3f4d59;border:1px solid #dde5e9;
  box-shadow:none;font-weight:600}
button[type=submit].btn-sec:hover{background:var(--vn-campo);color:#3f4d59}

button[type=submit].btn-perigo,
input[type=submit].btn-perigo{background:var(--vn-perigo-bg);color:var(--vn-perigo);
  border:1px solid var(--vn-perigo-bd);box-shadow:none;font-weight:600}
button[type=submit].btn-perigo:hover{background:#f3ded9;color:var(--vn-perigo)}

button[type=submit].btn-mini{background:var(--vn-surface);color:var(--vn-neutro-2);
  border:1px solid #dde5e9;border-radius:var(--vn-raio-pill);height:30px;padding:0 13px;font-size:12.5px}
button[type=submit].btn-mini:hover{background:var(--vn-campo);color:var(--vn-tinta)}
button[type=submit].btn-mini-perigo{background:var(--vn-perigo-bg);color:var(--vn-perigo);border-color:var(--vn-perigo-bd)}

button[type=submit].btn-lixeira{background:transparent;color:var(--vn-fraco);border:1px solid #dde5e9;
  border-radius:50%;width:32px;height:32px;padding:0}
button[type=submit].btn-lixeira:hover{background:var(--vn-perigo-bg);color:var(--vn-perigo);border-color:var(--vn-perigo-bd)}

button[type=submit].slot-bloq{background:var(--vn-perigo-bg);color:var(--vn-perigo);border:1px solid var(--vn-perigo-bd)}
button[type=submit].bt-chegou{background:var(--vn-tint);color:var(--vn-petroleo);border:1px solid var(--vn-tint-bd);
  border-radius:var(--vn-raio-pill);height:30px;padding:0 15px;font-size:12.5px}

/* botões da ficha do paciente: ícone e texto alinhados, altura igual */
.ficha-acoes .btn,.ficha-acoes .btn-sec,.ficha-acoes .btn-perigo,
.ficha-acoes button[type=submit]{height:40px;display:inline-flex;align-items:center;gap:7px;
  padding:0 16px;border-radius:var(--vn-raio-sm);font-size:13.5px;font-weight:600;white-space:nowrap}
.ficha-acoes svg{flex:none}
.ficha-acoes .acao-inline{display:inline-flex}
/* "Excluir ficha" separado do resto */
.ficha-acoes .acao-inline:last-child{margin-left:auto}


/* =========================================================================
   AGENDA SEMANAL — "confirmado" com mais contraste
   O azul pálido original era quase igual ao cinza de "agendado" numa grade
   pequena. Aqui ele ganha saturação, sem sair da família pálida das outras
   legendas. Nas demais telas a pílula não muda.
   ========================================================================= */
.wk-confirmado,.wk-legenda .wk-confirmado{background:#cfe2f0;color:#0f4964;border-left-color:#14566f}
.wk-confirmado b{color:#0f4964;opacity:.72}


/* =========================================================================
   AGENDAMENTO ONLINE (agendamento_online.asp)
   Classes .ao-* e .grupo-h que a página emite. Faltavam no tema novo —
   por isso as linhas colavam e os <select> saíam sem formatação.
   ========================================================================= */

/* caixa do link público */
.ao-link{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:20px 22px;margin:0 0 20px;max-width:760px}
.ao-link-tit{display:flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--vn-marca);margin-bottom:10px}
.ao-link-row{display:flex;gap:8px;flex-wrap:wrap}
.ao-link-row input{flex:1 1 300px;min-width:0;height:44px;padding:0 14px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);background:var(--vn-campo);font:inherit;font-size:14px;
  font-family:'IBM Plex Mono',monospace;color:var(--vn-tinta);cursor:text}
.ao-link-row input:focus{outline:none;border-color:var(--vn-petroleo);background:var(--vn-surface);
  box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.ao-link-row .btn-sec,.ao-link-row .btn,.ao-link-row button{flex:0 0 auto;width:auto;height:44px;margin:0}
.ao-link-abrir{display:inline-block;margin-top:10px;font-size:13px;font-weight:600}

/* interruptor "agendamento online ativo" */
.ao-geral{display:flex;flex-direction:column;gap:0;background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio);box-shadow:var(--vn-sombra);margin:0 0 20px;max-width:920px;overflow:hidden}
.ao-switch{display:flex;align-items:flex-start;gap:14px;padding:18px 22px;cursor:pointer;margin:0}
.ao-switch input{position:absolute;opacity:0;width:0;height:0}
.ao-slider{flex:none;position:relative;width:42px;height:24px;border-radius:12px;background:#dde5e9;
  transition:background .16s;margin-top:1px}
.ao-slider::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;
  background:var(--vn-surface);box-shadow:0 1px 2px rgba(0,0,0,.18);transition:transform .16s}
.ao-switch input:checked+.ao-slider{background:var(--vn-petroleo)}
.ao-switch input:checked+.ao-slider::after{transform:translateX(18px)}
.ao-switch input:focus-visible+.ao-slider{box-shadow:0 0 0 3px rgba(20,86,111,.18)}
.ao-switch-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.ao-switch-tx b{font-size:14.5px;font-weight:600;color:var(--vn-tinta)}
.ao-switch-tx small{font-size:12.5px;color:var(--vn-neutro);line-height:1.5}

/* modo: todos os horários / um por faixa */
.ao-modo{border-top:1px solid var(--vn-linha-2);padding:18px 22px}
.ao-modo-tit{font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--vn-marca);margin-bottom:12px}
.ao-radio{display:flex;align-items:flex-start;gap:11px;padding:9px 0;cursor:pointer;margin:0;
  font-size:13.5px;line-height:1.55;color:var(--vn-neutro-2)}
.ao-radio+.ao-radio{border-top:1px solid var(--vn-linha-3)}
.ao-radio input{flex:none;width:17px;height:17px;margin:2px 0 0;accent-color:var(--vn-petroleo);cursor:pointer}
.ao-radio span{min-width:0}
.ao-radio b{display:block;font-size:14px;font-weight:600;color:var(--vn-tinta);margin-bottom:1px}

/* seletor de médico (a página reusa .tw-seletor) */
.tw-seletor{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:16px 22px;margin:0 0 20px;max-width:920px;gap:14px}

/* grupos por dia da semana */
fieldset.grupo-h{border:1px solid var(--vn-linha);border-radius:var(--vn-raio);background:var(--vn-surface);
  box-shadow:var(--vn-sombra);padding:8px 22px 18px;margin:0 0 14px;max-width:920px}
fieldset.grupo-h legend{font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--vn-marca);padding:0 8px;margin-left:-8px}

/* uma faixa (manhã/tarde/noite) por linha */
.ao-periodo{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding:14px 0;border-bottom:1px solid var(--vn-linha-3)}
.ao-periodo:last-child{border-bottom:0;padding-bottom:4px}
.ao-per-info{display:flex;align-items:baseline;gap:10px;min-width:0;flex-wrap:wrap}
.ao-per-info b{font-size:14.5px;font-weight:600;color:var(--vn-tinta)}
.ao-per-info small{font-size:12.5px;color:var(--vn-neutro);font-family:'IBM Plex Mono',monospace}
.ao-per-max{display:flex;align-items:center;gap:10px;margin:0;flex:none;
  font-size:12.5px;font-weight:500;color:var(--vn-neutro)}
.ao-per-max select{height:40px;min-width:128px;padding:0 34px 0 12px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);background-color:var(--vn-surface);font:inherit;font-size:13.5px;
  font-weight:600;color:var(--vn-tinta);cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238e9aa4' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center}
.ao-per-max select:hover{border-color:#cdd8df}
.ao-per-max select:focus{outline:none;border-color:var(--vn-petroleo);box-shadow:0 0 0 3px rgba(20,86,111,.12)}

@media (max-width:900px){
  .ao-periodo{flex-direction:column;align-items:stretch;gap:10px}
  .ao-per-max{justify-content:space-between}
  .ao-per-max select{flex:1;height:48px;min-width:0}
  .ao-link-row input,.ao-link-row .btn-sec,.ao-link-row .btn,.ao-link-row button{width:100%;flex:1 1 100%;height:48px}
  fieldset.grupo-h{padding:8px 16px 16px}
  .ao-switch,.ao-modo,.tw-seletor{padding:16px}
}


/* =========================================================================
   BACKUP (backup.asp)
   Estilos que estavam num <style> dentro da página, agora no sistema:
   px no lugar de rem, título de seção em maiúsculas, ícone no lugar do emoji.
   ========================================================================= */
.bkp-box{display:flex;flex-wrap:wrap;align-items:center;gap:18px;background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio);padding:20px 22px;
  box-shadow:var(--vn-sombra);margin:4px 0 20px;max-width:920px}
.bkp-ic{flex:none;width:48px;height:48px;border-radius:12px;background:var(--vn-tint);color:var(--vn-marca);
  display:grid;place-items:center;font-size:22px;line-height:1}
.bkp-ic svg{display:block}
.bkp-txt{flex:1 1 300px;min-width:0}
.bkp-txt b{display:block;font-size:15px;font-weight:600;color:var(--vn-tinta)}
.bkp-txt p{margin:3px 0 0;color:var(--vn-neutro);font-size:13.5px;line-height:1.55}
.bkp-btn{flex:none;white-space:nowrap;height:44px;padding:0 20px;gap:8px}

.bkp-dicas{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:20px 22px 22px;max-width:920px}
.bkp-dicas h2{margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--vn-linha-2);
  font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--vn-marca)}
.bkp-dicas ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.bkp-dicas li{margin:0;padding:12px 0;font-size:13.5px;line-height:1.6;color:var(--vn-neutro-2);
  border-bottom:1px solid var(--vn-linha-3)}
.bkp-dicas li:last-child{border-bottom:0;padding-bottom:2px}
.bkp-dicas li b{color:var(--vn-tinta);font-weight:600}
.bkp-nota{display:flex;align-items:flex-start;gap:10px;margin:16px 0 0;padding-top:14px;
  border-top:1px solid var(--vn-linha-2);color:var(--vn-neutro);font-size:12.5px;line-height:1.55}
.bkp-nota svg{flex:none;margin-top:1px;color:var(--vn-fraco)}

@media (max-width:900px){
  .bkp-box{padding:18px 16px;gap:14px}
  .bkp-btn{width:100%;flex:1 1 100%;height:48px}
  .bkp-dicas{padding:18px 16px}
}


/* =========================================================================
   BACKUP — correções
   1. .bkp-txt b era display:block, então o <b>tudo</b> DENTRO do parágrafo
      também virava bloco e quebrava a frase em três linhas. Agora só o
      título (.bkp-tit) é bloco.
   2. o aviso do último backup não tinha a largura dos cartões.
   ========================================================================= */
.bkp-txt b{display:inline;font-size:inherit;font-weight:600;color:inherit}
.bkp-txt b.bkp-tit{display:block;font-size:15px;color:var(--vn-tinta);margin-bottom:3px}
.bkp-txt p b{color:var(--vn-tinta)}

.bkp-ultimo{display:flex;align-items:center;gap:9px;max-width:920px;margin:4px 0 16px;
  padding:12px 16px;border-radius:var(--vn-raio-sm);font-size:13.5px;line-height:1.5;
  background:var(--vn-tint);border:1px solid var(--vn-tint-bd);color:var(--vn-marca)}
.bkp-ultimo svg{flex:none}
.bkp-ultimo b{font-weight:600}
.bkp-ultimo.bkp-none{background:var(--vn-atencao-bg);border-color:var(--vn-atencao-bd);color:var(--vn-atencao)}


/* =========================================================================
   PAINEL DE CHAMADA — tela de configuração (painel.asp)
   Estilos que estavam num <style> dentro da página, agora no sistema:
   px no lugar de rem, rótulo e passos no padrão, botão de gerar link
   como secundário de verdade.
   ========================================================================= */
.pnc-box{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:20px 22px 22px;max-width:920px}
.pnc-lbl{display:block;font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--vn-marca);margin-bottom:10px}
.pnc-url{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 4px}
.pnc-url input{flex:1 1 320px;min-width:0;height:44px;padding:0 14px;border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm);background:var(--vn-campo);font-family:'IBM Plex Mono',monospace;
  font-size:13.5px;color:var(--vn-tinta);cursor:text}
.pnc-url input:focus{outline:none;border-color:var(--vn-petroleo);background:var(--vn-surface);
  box-shadow:0 0 0 3px rgba(20,86,111,.12)}
.pnc-url .btn,.pnc-url .btn-sec{flex:0 0 auto;width:auto;height:44px;margin:0}

.pnc-passos{margin:20px 0 0;padding:0;list-style:none;counter-reset:pnc;
  display:flex;flex-direction:column}
.pnc-passos li{counter-increment:pnc;position:relative;padding:12px 0 12px 38px;
  border-bottom:1px solid var(--vn-linha-3);font-size:13.5px;line-height:1.6;color:var(--vn-neutro-2)}
.pnc-passos li:last-child{border-bottom:0;padding-bottom:2px}
.pnc-passos li::before{content:counter(pnc);position:absolute;left:0;top:11px;width:24px;height:24px;
  border-radius:50%;background:var(--vn-tint);color:var(--vn-marca);font-family:'IBM Plex Mono',monospace;
  font-size:12px;font-weight:600;display:grid;place-items:center}
.pnc-passos li b{color:var(--vn-tinta);font-weight:600}

.pnc-regen{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:18px 0 0;
  padding-top:16px;border-top:1px solid var(--vn-linha-2)}
.pnc-regen .dica{margin:0;font-size:12.5px;color:var(--vn-neutro)}

.pnc-ok{display:flex;align-items:center;gap:9px;max-width:920px;margin:4px 0 16px;padding:12px 16px;
  border-radius:var(--vn-raio-sm);font-size:13.5px;background:var(--vn-sucesso-bg);
  border:1px solid var(--vn-sucesso-bd);color:var(--vn-sucesso)}
.pnc-ok svg{flex:none}

@media (max-width:900px){
  .pnc-box{padding:18px 16px}
  .pnc-url input,.pnc-url .btn,.pnc-url .btn-sec{width:100%;flex:1 1 100%;height:48px}
  .pnc-regen button{width:100%}
}


/* =========================================================================
   PRIMEIRA CONFIGURAÇÃO (clinichost/inicio.asp, clínica sem médico)
   Substitui .onboard e .tile-lock: um cartão com três passos numerados,
   no lugar de sete atalhos apagados com cadeado.
   ========================================================================= */
.ob-card{background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio);
  box-shadow:var(--vn-sombra);padding:24px 26px 22px;margin:8px 0 20px;max-width:720px}
.ob-head{display:flex;align-items:flex-start;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--vn-linha-2)}
.ob-ic{flex:none;width:44px;height:44px;border-radius:11px;background:var(--vn-tint);color:var(--vn-marca);
  display:grid;place-items:center}
.ob-ic svg{display:block}
.ob-head-tx{min-width:0}
.ob-head-tx h2{margin:0;font-size:19px;font-weight:600;letter-spacing:-.3px;color:var(--vn-tinta);text-transform:none}
.ob-head-tx p{margin:3px 0 0;font-size:13.5px;color:var(--vn-neutro)}

.ob-passos{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.ob-passos li{display:flex;align-items:flex-start;gap:14px;padding:18px 0;
  border-bottom:1px solid var(--vn-linha-3)}
.ob-passos li:last-child{border-bottom:0;padding-bottom:4px}
.ob-n{flex:none;width:26px;height:26px;border-radius:50%;background:var(--vn-linha-2);color:var(--vn-neutro);
  font-family:'IBM Plex Mono',monospace;font-size:12.5px;font-weight:600;display:grid;place-items:center;margin-top:1px}
.ob-tx{min-width:0;display:flex;flex-direction:column}
.ob-tx b{font-size:14.5px;font-weight:600;color:var(--vn-neutro-2)}
.ob-tx small{font-size:13px;color:var(--vn-neutro);line-height:1.55;margin-top:2px}
/* o passo de agora é o único com cor e botão */
.ob-agora .ob-n{background:var(--vn-tint);color:var(--vn-marca)}
.ob-agora .ob-tx b{color:var(--vn-tinta)}
.ob-btn{align-self:flex-start;margin-top:12px;height:44px;padding:0 20px;gap:8px}

.ob-rodape{margin:16px 0 0;padding-top:16px;border-top:1px solid var(--vn-linha-2);
  font-size:12.5px;line-height:1.6;color:var(--vn-neutro)}

@media (max-width:900px){
  .ob-card{padding:20px 16px 18px}
  .ob-btn{width:100%;justify-content:center;height:48px}
}

/* ===== Bloquear por período (bloqueio_periodo.asp) ===== */
/* variantes do aviso: mesma forma do .nota-salvo, outra semântica */
.nota-salvo.nota-erro{color:var(--vn-perigo);background:var(--vn-perigo-bg);border-color:var(--vn-perigo-bd)}
.nota-salvo.nota-atencao{color:var(--vn-atencao);background:var(--vn-atencao-bg);border-color:var(--vn-atencao-bd)}
.dica-inline{font-weight:400;color:var(--vn-fraco);font-size:11.5px;margin-left:6px}
.form-bp{max-width:560px}
.form-bp .grade-form{grid-template-columns:repeat(2,minmax(0,1fr));background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio);box-shadow:var(--vn-sombra);padding:20px}
.bp-atalhos{grid-column:1/-1;display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:-6px}
.bp-atalhos>span{font-size:11.5px;color:var(--vn-fraco);margin-right:2px}
.bp-atalho{background:transparent;border:1px solid var(--vn-linha);color:var(--vn-neutro-2);width:auto;
  border-radius:var(--vn-raio-pill);height:27px;padding:0 12px;font-size:12px;font-weight:600;cursor:pointer}
.bp-atalho:hover{background:var(--vn-tint);border-color:var(--vn-tint-bd);color:var(--vn-petroleo)}
.bp-atalho:focus-visible{outline:2px solid var(--vn-petroleo);outline-offset:1px}
/* resumo do período: conta só os dias em que o médico atende */
.bp-resumo{grid-column:1/-1;background:var(--vn-tint);border:1px solid var(--vn-tint-bd);
  border-radius:var(--vn-raio-sm);padding:13px 15px;min-height:66px;display:flex;
  flex-direction:column;justify-content:center}
.bp-num{display:block;font-size:27px;font-weight:600;color:var(--vn-petroleo);line-height:1.1;
  letter-spacing:-.015em;font-variant-numeric:tabular-nums}
.bp-num em{font-style:normal;font-size:13px;font-weight:500;color:var(--vn-neutro-2);
  margin-left:8px;letter-spacing:0}
.bp-meta{margin:5px 0 0;font-size:12.5px;color:var(--vn-neutro-2);font-variant-numeric:tabular-nums}
.bp-vazio{margin:0;font-size:13px;color:var(--vn-neutro);line-height:1.45}
.bp-nota{max-width:560px;margin:14px 2px 0;font-size:12.5px;color:var(--vn-fraco);line-height:1.55}
@media (max-width:560px){.form-bp .grade-form{grid-template-columns:1fr}}
.livres-acoes{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* ===== Agendamento online: UMA coluna só =====================================
   A página tinha larguras espalhadas (link 760, cartões 920, textos sem limite)
   e as bordas não batiam. A medida passa a ser definida AQUI, uma vez: tudo
   dentro de .pg-col herda a mesma coluna e nada mais pode desalinhar. */
.pg-col{max-width:920px}
.pg-col .ao-link,
.pg-col .ao-geral,
.pg-col .tw-seletor,
.pg-col fieldset.grupo-h{max-width:none}
.pg-col .pnc-box,.pg-col .pnc-ok{max-width:none}
/* "Informações importantes" não é ação do formulário (vale na ficha e no agendamento):
   ganha respiro para não se colar ao grupo Salvar/Cancelar logo acima. */
.obs-imp{margin-top:26px}

/* ===== Anamnese por especialidade (atendimento_editar) =====================
   Abas discretas em sublinhado: os dois painéis vivem no MESMO formulário,
   trocar de aba não perde nada. O pino marca a aba que já tem conteúdo. */
.an-abas{display:flex;gap:2px;margin:18px 0 20px}
.an-aba{display:inline-flex;align-items:center;gap:7px;width:auto;height:auto;
  background:transparent;border:0;border-bottom:2px solid transparent;border-radius:0;
  color:var(--vn-neutro);font:inherit;font-size:13.5px;font-weight:600;
  padding:9px 16px 10px;cursor:pointer;box-shadow:none}
.an-aba:hover{color:var(--vn-tinta)}
.an-aba.ativa{color:var(--vn-petroleo);border-bottom-color:var(--vn-petroleo)}
.an-pino{flex:none;width:6px;height:6px;border-radius:50%;background:var(--vn-petroleo)}
/* campos do módulo */
.an-multi{display:flex;flex-wrap:wrap;gap:7px 16px;margin-top:8px}
/* especificidade: `.grade-form label` (0,1,1) vence `.an-chk` (0,1,0) e impunha
   display:block — por isso o checkbox colava na linha de base. Dois seletores de
   classe (0,2,0) passam na frente e o rótulo volta a ser flex. */
.an-multi .an-chk{display:inline-flex;align-items:center;gap:7px;margin:0;cursor:pointer;
  line-height:1.3;font-size:13px;font-weight:400;color:var(--vn-tinta)}
.an-multi .an-chk input{flex:none;width:16px;height:16px;min-height:0;margin:0;padding:0;
  border:0;border-radius:0;box-shadow:none;background:none;accent-color:var(--vn-petroleo)}
.an-par{display:flex;align-items:center;gap:8px;margin-top:6px}
.an-par>span{flex:none;font-size:11px;font-weight:700;color:var(--vn-fraco-2)}
.an-par select,.an-par input{margin-top:0;min-width:0}
/* classificação do ITB: registro em tom neutro (o especialista já sabe a faixa) */
.an-calc{margin:8px 0 0;font-size:12.5px;color:var(--vn-fraco);font-variant-numeric:tabular-nums}

/* ===== Anexos: exames guardados na consulta ================================
   Seletores com 2 classes de propósito: `.grade-form label` e
   `button[type=submit]` (0,1,1) atropelariam classe simples. */
.anx-bloco{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--vn-linha-2)}
.anx-cab{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.anx-cab h2{margin:0;font-size:11.5px;font-weight:600;text-transform:uppercase;
  letter-spacing:.1em;color:var(--vn-marca)}
.anx-cont{background:var(--vn-tint);color:var(--vn-petroleo);border:1px solid var(--vn-tint-bd);
  border-radius:99px;padding:1px 9px;font-size:11px;font-weight:700}
.anx-vazio{margin:0 0 14px;font-size:13px;color:var(--vn-fraco)}
.anx-lista{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.anx-item{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);padding:10px 14px}
.anx-nome{font-size:14px;font-weight:600;color:var(--vn-tinta);text-decoration:none}
.anx-nome:hover{color:var(--vn-petroleo);text-decoration:underline}
.anx-meta{font-size:12px;color:var(--vn-fraco)}
.anx-acoes{margin-left:auto;display:flex;align-items:center;gap:12px}
.anx-acoes form{margin:0}
.anx-acoes a,.anx-acoes form button{width:auto;height:auto;padding:0;border:0;background:none;
  box-shadow:none;font:inherit;font-size:12px;font-weight:600;color:var(--vn-neutro-2);
  text-decoration:none;cursor:pointer}
.anx-acoes a:hover{color:var(--vn-petroleo)}
.anx-acoes form button:hover{color:var(--vn-perigo)}
/* enviar */
.anx-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.anx-arq{position:relative;display:inline-flex;margin:0}
.anx-arq>span{display:inline-flex;align-items:center;height:40px;padding:0 16px;cursor:pointer;
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);background:var(--vn-campo);
  font-size:13px;font-weight:600;color:var(--vn-neutro-2)}
.anx-arq>span:hover{border-color:var(--vn-petroleo);color:var(--vn-petroleo)}
.anx-arq>input{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0}
.anx-desc{flex:1 1 260px;min-width:0;height:40px;padding:0 12px;font:inherit;font-size:14px;
  color:var(--vn-tinta);background:var(--vn-surface);border:1px solid var(--vn-linha);
  border-radius:var(--vn-raio-sm)}
.anx-form .btn{width:auto;height:40px}
.anx-status{flex-basis:100%;font-size:12px;color:var(--vn-fraco)}
/* marca de exames na lista de consultas */
.anx-tag{display:inline-flex;align-items:center;justify-content:center;min-width:22px;
  border-radius:99px;padding:1px 8px;font-size:11.5px;font-weight:700;
  color:var(--vn-petroleo);background:var(--vn-tint);border:1px solid var(--vn-tint-bd)}

/* seção dedicada de exames — agrupada por dia de armazenamento */
.anxd-filtro{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin:0 0 18px}
.anxd-filtro label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--vn-neutro-2)}
.anxd-filtro input{height:40px;padding:0 12px;font:inherit;font-size:14px;color:var(--vn-tinta);
  background:var(--vn-surface);border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm)}
.anxd-filtro .anxd-busca{flex:1 1 240px;min-width:0}
.anxd-filtro .btn,.anxd-filtro .btn-sec{width:auto;height:40px}
.anxd-total{margin:0 0 10px;font-size:12.5px;color:var(--vn-fraco)}
.anxd-vazio{margin:0;padding:22px;text-align:center;font-size:13px;color:var(--vn-fraco);
  border:1px dashed var(--vn-linha);border-radius:var(--vn-raio)}
.anxd-lista{display:flex;flex-direction:column;gap:16px}
.anxd-data{font-size:11.5px;font-weight:700;letter-spacing:.08em;color:var(--vn-marca);
  margin-bottom:7px;font-variant-numeric:tabular-nums}
.anxd-itens{display:flex;flex-direction:column;gap:6px}
.anxd-item{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--vn-surface);
  border:1px solid var(--vn-linha);border-radius:var(--vn-raio-sm);padding:10px 14px}
.anxd-desc{font-size:14px;font-weight:600;color:var(--vn-tinta);text-decoration:none}
.anxd-desc:hover{color:var(--vn-petroleo);text-decoration:underline}
.anxd-pac{font-size:13px;color:var(--vn-neutro-2);text-decoration:none}
.anxd-pac:hover{text-decoration:underline}
.anxd-meta{font-size:12px;color:var(--vn-fraco)}
.anxd-links{margin-left:auto;display:flex;gap:12px}
.anxd-links a{font-size:12px;font-weight:600;color:var(--vn-neutro-2);text-decoration:none}
.anxd-links a:hover{color:var(--vn-petroleo)}