@import "./tokens.css";

:root{
  /* Aliases locais para os semânticos compartilhados */
  --fundo: var(--fundo-app);
  --papel: var(--superficie);
  --tinta: var(--texto);
  --mudo: var(--texto-muted);
  --linha: var(--borda);
  --verde: var(--cor-primaria);
  --verde-claro: var(--cor-primaria-suave);
  --ambar: var(--alerta);
  --ambar-claro: var(--alerta-chip-fundo);
  --vermelho: var(--erro);
  --vermelho-claro: var(--erro-chip-fundo);
  --neutro: var(--superficie-cinza);
  --raio: var(--raio-xl);
  --fonte: var(--fonte-familia);

  /* Clusters A/B/C e situações — derivados dos semânticos */
  --cluster-a-fundo: var(--cor-primaria);
  --cluster-a-texto: var(--texto-invertido);
  --cluster-b-fundo: var(--cor-primaria-suave);
  --cluster-b-texto: var(--cor-primaria);
  --cluster-c-fundo: var(--superficie-cinza);
  --cluster-c-texto: var(--texto-muted);
  --situ-ok-fundo: var(--sucesso-chip-fundo);
  --situ-ok-texto: var(--sucesso-forte);
  --situ-aviso-fundo: var(--alerta-chip-fundo);
  --situ-aviso-texto: var(--alerta-escuro);
  --situ-alerta-fundo: var(--erro-chip-fundo);
  --situ-alerta-texto: var(--erro-forte);
  --situ-neutro-fundo: var(--superficie-cinza);
  --situ-neutro-texto: var(--texto-muted);
}
*{box-sizing:border-box}
html{font-family:var(--fonte);font-size:var(--fonte-tamanho-base);color:var(--tinta);background:var(--fundo-app)}
body{margin:0;min-height:100dvh;background:var(--fundo-app);padding-bottom:calc(72px + env(safe-area-inset-bottom))}
a{color:var(--cor-primaria);text-decoration:none} a:hover{text-decoration:underline}
h1{font-size:var(--fonte-tamanho-2xl);font-weight:var(--fonte-peso-bold);color:var(--texto-titulo);margin:0 0 var(--espaco-1);letter-spacing:-.01em}
h2{font-size:var(--fonte-tamanho-sm);font-weight:var(--fonte-peso-semibold);color:var(--texto-corpo);margin:var(--espaco-6) 0 var(--espaco-3)}
h3{font-size:var(--fonte-tamanho-sm);font-weight:var(--fonte-peso-semibold);color:var(--texto-corpo);margin:var(--espaco-4) 0 var(--espaco-2)}
p{margin:var(--espaco-1) 0;line-height:1.5}
.mudo{color:var(--texto-muted)} .pequeno{font-size:var(--fonte-tamanho-xs)} .ok{color:var(--sucesso-forte)} .alerta{color:var(--erro-forte)}

/* ============================================================
 * Cabeçalho — anatomia do NavBarInterno do Portal de Pedidos
 * ============================================================ */
.topo{background:var(--superficie);border-bottom:1px solid var(--borda);box-shadow:var(--sombra-sm);position:sticky;top:0;z-index:var(--z-header)}
.topo-interno{max-width:var(--largura-6xl);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--espaco-4);padding:var(--espaco-3) var(--espaco-4)}
.marca{display:flex;align-items:center;gap:var(--espaco-2);color:var(--texto-titulo);flex-shrink:0}
.marca:hover{text-decoration:none}
.marca-simbolo{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--cor-primaria);border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:6px}
.marca-simbolo img{display:block;width:28px;height:28px;object-fit:contain;filter:brightness(0) invert(1)}
.marca-textos{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;line-height:1.2}
.marca-nome{font-weight:var(--fonte-peso-semibold);font-size:var(--fonte-tamanho-sm);color:var(--cor-primaria);white-space:nowrap}
.marca-modulo{font-size:var(--fonte-tamanho-xs);color:var(--texto-muted);white-space:nowrap}
.nav-desk{display:flex;align-items:center;gap:var(--espaco-6)}
.nav-desk a{font-size:var(--fonte-tamanho-sm);font-weight:var(--fonte-peso-medio);color:var(--texto-secundario);transition:var(--transicao-cor);padding:var(--espaco-1) 0}
.nav-desk a:hover{color:var(--cor-primaria);text-decoration:none}
.nav-desk a.on{color:var(--cor-primaria);text-decoration:underline;text-underline-offset:4px}
.topo-usuario{display:flex;align-items:center;gap:var(--espaco-3);flex-shrink:0}
.usuario-info{display:flex;flex-direction:column;align-items:flex-end;line-height:1.3}
.usuario-nome{font-size:var(--fonte-tamanho-sm);font-weight:var(--fonte-peso-medio);color:var(--texto-titulo)}
.usuario-perfil{font-size:var(--fonte-tamanho-xs);color:var(--texto-muted);text-transform:capitalize}
.botao-sair{display:inline-flex;align-items:center;padding:var(--espaco-1-5) var(--espaco-3);border:1px solid var(--borda-forte);border-radius:var(--raio-sm);font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio);color:var(--texto-corpo);background:var(--superficie);transition:var(--transicao-cor)}
.botao-sair:hover{background:var(--superficie-neutra);text-decoration:none;color:var(--texto-titulo)}
.ajuda-topo{display:inline-flex;align-items:center;padding:var(--espaco-1-5) var(--espaco-3);border:1px solid var(--borda-leve);border-radius:var(--raio-sm);font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio);color:var(--cor-primaria);background:var(--superficie);transition:var(--transicao-cor)}
.ajuda-topo:hover{background:var(--cor-primaria-suave);text-decoration:none}
.ajuda-topo[aria-current="page"]{background:var(--cor-primaria);color:var(--texto-invertido);border-color:var(--cor-primaria)}
@media (max-width:760px){.ajuda-topo{display:none}}

.nav-mob{display:none}
.fab{display:none}
@media (max-width:760px){
  .nav-desk{display:none}
  .usuario-info{display:none}
  .marca-modulo{display:none}
  .nav-mob{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--superficie);border-top:1px solid var(--borda);padding:var(--espaco-1-5) 0 calc(var(--espaco-1-5) + env(safe-area-inset-bottom));z-index:var(--z-header);box-shadow:0 -2px 8px rgba(0,0,0,.06)}
  .nav-mob a{flex:1;text-align:center;font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio);color:var(--texto-muted);padding:var(--espaco-1) 0}
  .nav-mob a.on{color:var(--cor-primaria);font-weight:var(--fonte-peso-semibold)}
  .fab{display:inline-flex;align-items:center;position:fixed;right:var(--espaco-4);bottom:calc(76px + env(safe-area-inset-bottom));background:var(--cor-primaria);color:var(--texto-invertido);padding:var(--espaco-3) var(--espaco-4);border-radius:var(--raio-full);font-weight:var(--fonte-peso-semibold);font-size:var(--fonte-tamanho-sm);box-shadow:var(--sombra-lg);z-index:calc(var(--z-header) + 1)}
  .fab:hover{text-decoration:none;background:var(--cor-primaria-escura)}
}

/* ============================================================
 * Layout
 * ============================================================ */
.pagina{max-width:var(--largura-6xl);margin:0 auto;padding:var(--espaco-8) var(--espaco-6) var(--espaco-8)}
@media (max-width:760px){.pagina{padding:var(--espaco-5) var(--espaco-4) var(--espaco-8)}}
.cabeca{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--espaco-4);flex-wrap:wrap;margin-bottom:var(--espaco-4)}
.cabeca h1{margin-bottom:var(--espaco-1)}
.acoes{display:flex;gap:var(--espaco-2);flex-wrap:wrap}
.flash{background:var(--sucesso-fundo);border-left:4px solid var(--sucesso);color:var(--sucesso-forte);padding:var(--espaco-3) var(--espaco-3);border-radius:var(--raio-lg);margin-bottom:var(--espaco-4);font-size:var(--fonte-tamanho-sm)}
.flash.erro{background:var(--erro-fundo);border-color:var(--erro);color:var(--erro-forte)}
.offline{background:var(--alerta-fundo);border-left:4px solid var(--alerta);color:var(--alerta-escuro);padding:var(--espaco-2-5) var(--espaco-3);border-radius:var(--raio-lg);margin-bottom:var(--espaco-4);font-size:var(--fonte-tamanho-sm)}
.vazio{color:var(--texto-muted);background:var(--superficie);border:1px dashed var(--borda);padding:var(--espaco-4);border-radius:var(--raio-xl);font-size:var(--fonte-tamanho-sm)}

/* ============================================================
 * Cards e superfícies (padrão Pedidos: rounded-xl + border-leve + shadow-sm)
 * ============================================================ */
.cartao{background:var(--superficie);border:1px solid var(--borda-leve);border-radius:var(--raio-xl);padding:var(--espaco-5);box-shadow:var(--sombra-sm)}
.cartao h2{margin-top:0}

/* ============================================================
 * KPI cards (padrão MetricCard do dashboard)
 * ============================================================ */
.grade-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--espaco-4);margin-bottom:var(--espaco-3)}
@media (max-width:1024px){.grade-kpi{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grade-kpi{grid-template-columns:1fr}}
.kpi{background:var(--superficie);border:1px solid var(--borda-leve);border-radius:var(--raio-xl);padding:var(--espaco-5);box-shadow:var(--sombra-sm);display:flex;flex-direction:column;gap:var(--espaco-1)}
/* Total sozinho na primeira linha, ocupando toda a largura do grid corrente */
.kpi-destaque{grid-column:1 / -1}
.kpi-rotulo{font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio);text-transform:uppercase;letter-spacing:.05em;color:var(--texto-desativado);margin:0}
.kpi-valor{font-size:var(--fonte-tamanho-2xl);font-weight:var(--fonte-peso-bold);color:var(--texto-titulo);margin:0;line-height:1.1}
.kpi-valor-meta{font-size:var(--fonte-tamanho-base);font-weight:var(--fonte-peso-normal);color:var(--texto-desativado);margin-left:var(--espaco-1)}
.kpi-sub{font-size:var(--fonte-tamanho-xs);color:var(--texto-desativado);margin:0}
.kpi-sub-ok{color:var(--sucesso-forte);font-weight:var(--fonte-peso-semibold)}
.kpi-sub-alerta{color:var(--erro-forte);font-weight:var(--fonte-peso-semibold)}
.legenda-metas{margin:var(--espaco-1) 0 var(--espaco-6)}

/* ============================================================
 * Barra de progresso das metas
 * ============================================================ */
.barra{position:relative;height:6px;background:var(--superficie-cinza);border-radius:var(--raio-full);overflow:visible;margin-top:var(--espaco-1)}
.barra .feito{height:100%;border-radius:var(--raio-full);background:var(--cor-primaria);transition:width .4s ease}
.barra .feito.atras{background:var(--alerta)}
.barra .marca-ritmo{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--texto-titulo);opacity:.7}
@media (prefers-reduced-motion:reduce){.barra .feito{transition:none}}

/* ============================================================
 * Grades utilitárias
 * ============================================================ */
.duas-colunas{display:grid;grid-template-columns:1fr 1fr;gap:var(--espaco-6)}
@media (max-width:760px){.duas-colunas{grid-template-columns:1fr}}
.grade-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--espaco-3) var(--espaco-4)}
.grade-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--espaco-4)}
@media (max-width:760px){.grade-2,.grade-3{grid-template-columns:1fr}}

/* ============================================================
 * Listas de itens (cards clicáveis, ex.: compromissos, últimas visitas)
 * ============================================================ */
.lista{list-style:none;margin:0;padding:0}
.lista li{background:var(--superficie);border:1px solid var(--borda-leve);border-radius:var(--raio-xl);padding:var(--espaco-3) var(--espaco-4);margin-bottom:var(--espaco-2);display:flex;flex-direction:column;gap:var(--espaco-0-5);box-shadow:var(--sombra-sm)}
.lista li.vencido{border-left:3px solid var(--erro)}
.lista small{color:var(--texto-muted);font-size:var(--fonte-tamanho-xs)}
.rotulo-c{color:var(--texto-desativado);font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--espaco-1)}
.destaque{font-size:var(--fonte-tamanho-2xl);font-weight:var(--fonte-peso-bold);color:var(--texto-titulo);margin-bottom:var(--espaco-1-5)}
.mini-tab{width:100%;font-size:var(--fonte-tamanho-sm);border-collapse:collapse}
.mini-tab td{padding:var(--espaco-1) 0;border-bottom:1px solid var(--divisor)}
.mini-tab td:last-child{text-align:right}

/* ============================================================
 * Formulários (padrão dos inputs do Pedidos)
 * ============================================================ */
.form{display:flex;flex-direction:column;gap:var(--espaco-4);max-width:var(--largura-3xl)}
.form.compacto{gap:var(--espaco-3)}
label{display:flex;flex-direction:column;gap:var(--espaco-1);font-size:var(--fonte-tamanho-sm);font-weight:var(--fonte-peso-medio);color:var(--texto-corpo)}
input,select,textarea{
  font:inherit;padding:var(--espaco-2-5) var(--espaco-3);
  border:1px solid var(--borda);border-radius:var(--raio-lg);
  background:var(--superficie);color:var(--texto);width:100%;
  font-size:var(--fonte-tamanho-sm);
  transition:var(--transicao-cor)
}
input:focus,select:focus,textarea:focus{border-color:var(--cor-primaria);outline:none;box-shadow:0 0 0 1px var(--cor-primaria)}
button:focus-visible,a:focus-visible{outline:var(--foco-espessura) solid var(--foco-cor);outline-offset:var(--foco-offset)}
textarea.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--fonte-tamanho-xs)}
fieldset{border:1px solid var(--borda-leve);border-radius:var(--raio-xl);padding:var(--espaco-4) var(--espaco-5);display:flex;flex-direction:column;gap:var(--espaco-3);margin:0;background:var(--superficie);box-shadow:var(--sombra-sm)}
legend{font-weight:var(--fonte-peso-semibold);padding:0 var(--espaco-2);color:var(--texto-corpo);font-size:var(--fonte-tamanho-sm)}
label.check{flex-direction:row;align-items:center;gap:var(--espaco-2);font-weight:var(--fonte-peso-normal)}
label.check input{width:auto}

/* ============================================================
 * Botões (padrão Pedidos: primário sólido rounded-xl / secundário/mini pílula bordada)
 * ============================================================ */
button,.botao{
  font:inherit;font-weight:var(--fonte-peso-semibold);
  background:var(--cor-primaria);color:var(--texto-invertido);
  border:1px solid var(--cor-primaria);
  border-radius:var(--raio-xl);
  padding:var(--espaco-2) var(--espaco-4);
  cursor:pointer;display:inline-block;text-align:center;
  font-size:var(--fonte-tamanho-sm);
  transition:var(--transicao-cor)
}
button:hover,.botao:hover{background:var(--cor-primaria-escura);border-color:var(--cor-primaria-escura);text-decoration:none}
.botao.secundario{background:var(--cor-primaria-suave);color:var(--cor-primaria);border-color:var(--cor-primaria-suave)}
.botao.secundario:hover{background:var(--cor-primaria);color:var(--texto-invertido);border-color:var(--cor-primaria)}
button.mini,.mini.botao{
  background:var(--superficie);color:var(--texto-corpo);
  border:1px solid var(--borda);border-radius:var(--raio-lg);
  padding:var(--espaco-1) var(--espaco-2-5);
  font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio)
}
button.mini:hover,.mini.botao:hover{background:var(--superficie-neutra);border-color:var(--cor-primaria);color:var(--cor-primaria)}
button.mini.ok,.mini.botao.ok{background:var(--sucesso-chip-fundo);border-color:var(--sucesso-chip-fundo);color:var(--sucesso-forte)}
button.mini.ok:hover{background:var(--sucesso-forte);border-color:var(--sucesso-forte);color:var(--texto-invertido)}

/* Form compacto para metas por rep na tela de Gestão */
.form-metas{display:grid;grid-template-columns:repeat(5,minmax(80px,1fr)) auto;gap:var(--espaco-2) var(--espaco-3);align-items:end;margin-top:var(--espaco-2);padding-top:var(--espaco-2);border-top:1px dashed var(--borda-leve)}
.form-metas label{gap:var(--espaco-0-5);font-size:var(--fonte-tamanho-xs)}
.form-metas label[data-grupo="treino"]{border-left:2px solid var(--cor-primaria-suave);padding-left:var(--espaco-2)}
.form-metas input{padding:var(--espaco-1) var(--espaco-2);font-size:var(--fonte-tamanho-sm)}
.form-metas small{color:var(--texto-muted);font-size:10px}
.form-metas .acoes-metas{display:flex;flex-direction:column;gap:var(--espaco-1);align-self:end}
.form-metas .soma-visitas{margin:0}
@media (max-width:1024px){.form-metas{grid-template-columns:repeat(3,1fr)} .form-metas .acoes-metas{grid-column:1/-1;flex-direction:row;align-items:center}}
@media (max-width:640px){.form-metas{grid-template-columns:repeat(2,1fr)} .form-metas .acoes-metas{grid-column:1/-1}}
form.inline{display:inline-flex;gap:var(--espaco-1);margin-top:var(--espaco-1)}

/* ============================================================
 * Pílulas de atalho (padrão dos filtros de período do dashboard)
 * ============================================================ */
.pill{
  display:inline-flex;align-items:center;
  padding:var(--espaco-1-5) var(--espaco-3);
  border:1px solid var(--borda);border-radius:var(--raio-lg);
  background:var(--superficie);color:var(--texto-secundario);
  font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio);
  transition:var(--transicao-cor)
}
.pill:hover{border-color:var(--cor-primaria);color:var(--cor-primaria);text-decoration:none}
.pill.on{background:var(--superficie);color:var(--cor-primaria);border-color:var(--cor-primaria);box-shadow:var(--sombra-sm)}
.atalhos{display:flex;gap:var(--espaco-2);flex-wrap:wrap;margin:var(--espaco-3) 0 var(--espaco-6)}

.linha-form{display:flex;gap:var(--espaco-2);align-items:center;flex-wrap:wrap} .linha-form input,.linha-form select{width:auto}
.filtros{display:flex;gap:var(--espaco-2);flex-wrap:wrap;margin-bottom:var(--espaco-4)} .filtros input{flex:1;min-width:180px} .filtros select{width:auto}
.aviso-dup{background:var(--alerta-fundo);border-left:4px solid var(--alerta);color:var(--alerta-escuro);padding:var(--espaco-2-5) var(--espaco-3);border-radius:var(--raio-lg);display:flex;flex-direction:column;gap:var(--espaco-0-5);font-size:var(--fonte-tamanho-sm)}
.compromisso-ant{background:var(--alerta-chip-fundo);color:var(--alerta-escuro);padding:var(--espaco-1-5) var(--espaco-2-5);border-radius:var(--raio-lg);margin:var(--espaco-1-5) 0;font-size:var(--fonte-tamanho-sm)}
.resumo-prof{display:flex;flex-direction:column;gap:var(--espaco-1);margin-bottom:var(--espaco-4)}

/* ============================================================
 * Tabelas (padrão Pedidos: wrapper com raio + borda leve + sombra; thead cinza suave)
 * ============================================================ */
.tabela-rolagem{overflow:hidden;background:var(--superficie);border:1px solid var(--borda-leve);border-radius:var(--raio-xl);box-shadow:var(--sombra-sm)}
.tabela-rolagem>.tabela{border-radius:0}
.tabela{width:100%;border-collapse:collapse;font-size:var(--fonte-tamanho-sm)}
.tabela th{
  text-align:left;font-weight:var(--fonte-peso-semibold);color:var(--texto-muted);
  padding:var(--espaco-2-5) var(--espaco-4);
  background:var(--superficie-neutra);border-bottom:1px solid var(--borda-leve);
  white-space:nowrap;font-size:var(--fonte-tamanho-xs)
}
.tabela td{padding:var(--espaco-2-5) var(--espaco-4);border-bottom:1px solid var(--divisor-suave);vertical-align:top;color:var(--texto-titulo)}
.tabela tr:last-child td{border-bottom:0}
.tabela tbody tr:hover{background:var(--superficie-neutra)}
.tabela.compacta td,.tabela.compacta th{padding:var(--espaco-1-5) var(--espaco-2-5)}
.tabela tr.feito{opacity:.55}
.tabela select{width:auto;padding:var(--espaco-1) var(--espaco-2)}

/* ============================================================
 * Chips específicos deste sistema (cluster A/B/C, situação de ciclo)
 * ============================================================ */
.cluster{display:inline-block;min-width:1.6rem;height:1.6rem;line-height:1.6rem;padding:0 var(--espaco-1-5);text-align:center;border-radius:var(--raio-md);font-weight:var(--fonte-peso-semibold);font-size:var(--fonte-tamanho-xs)}
.cluster.cA{background:var(--cluster-a-fundo);color:var(--cluster-a-texto)}
.cluster.cB{background:var(--cluster-b-fundo);color:var(--cluster-b-texto)}
.cluster.cC{background:var(--cluster-c-fundo);color:var(--cluster-c-texto)}
.cluster.contato{background:var(--superficie);border:1.5px dashed var(--borda);color:var(--texto-muted)}
.situ{display:inline-block;padding:var(--espaco-0-5) var(--espaco-2);border-radius:var(--raio-full);font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-semibold);white-space:nowrap}
.situ.ok{background:var(--situ-ok-fundo);color:var(--situ-ok-texto)}
.situ.aviso{background:var(--situ-aviso-fundo);color:var(--situ-aviso-texto)}
.situ.alerta{background:var(--situ-alerta-fundo);color:var(--situ-alerta-texto)}
.situ.neutro{background:var(--situ-neutro-fundo);color:var(--situ-neutro-texto)}
.etiqueta{display:inline-block;background:var(--alerta-chip-fundo);color:var(--alerta-escuro);font-size:var(--fonte-tamanho-10);padding:0 var(--espaco-1-5);border-radius:var(--raio-sm);margin-left:var(--espaco-1);font-weight:var(--fonte-peso-semibold);text-transform:uppercase;letter-spacing:.05em}
.bloco{margin-bottom:var(--espaco-6)}

/* ============================================================
 * Linha do tempo (eventos)
 * ============================================================ */
.linha-tempo{list-style:none;margin:0;padding:0;border-left:2px solid var(--borda-leve);margin-left:var(--espaco-1-5)}
.linha-tempo li{position:relative;padding:var(--espaco-1) 0 var(--espaco-4) var(--espaco-5)}
.linha-tempo li::before{content:"";position:absolute;left:-7px;top:.55rem;width:12px;height:12px;border-radius:var(--raio-full);background:var(--cor-primaria);border:2px solid var(--fundo-app)}
.linha-tempo li.inedita::before{background:var(--texto-titulo)} .linha-tempo li.evento::before{background:var(--texto-muted)}
.linha-tempo .quando{font-size:var(--fonte-tamanho-xs);color:var(--texto-muted)} .linha-tempo .oque{line-height:1.5}

/* ============================================================
 * Login — padrão do Portal de Pedidos (/interno/login):
 * logo completo acima do cartão, cartão branco com raio-2xl e sombra-xl,
 * fundo cinza-claro (--superficie-cinza) e alinhamento vertical centrado.
 * ============================================================ */
body.pagina-entrar{background:var(--superficie-cinza);padding-bottom:0}
body.pagina-entrar .pagina{max-width:none;padding:0}
.entrar-tela{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:var(--espaco-4)}
.entrar-envelope{width:100%;max-width:var(--largura-sm)}
.entrar-logo{margin-bottom:var(--espaco-8);text-align:center}
.entrar-logo img{display:block;margin:0 auto var(--espaco-4);max-height:160px;object-fit:contain}
.entrar-logo p{margin:0;color:var(--texto-muted)}
.cartao-login{background:var(--superficie);border-radius:var(--raio-2xl);padding:var(--espaco-6);box-shadow:var(--sombra-xl)}
.cartao-login h2{margin:0 0 var(--espaco-5);font-size:var(--fonte-tamanho-lg);font-weight:var(--fonte-peso-semibold);color:var(--texto-titulo)}
.cartao-login form{display:flex;flex-direction:column;gap:var(--espaco-4);margin:0}
.cartao-login label{gap:var(--espaco-1);font-size:var(--fonte-tamanho-sm);font-weight:var(--fonte-peso-medio);color:var(--texto-corpo)}
.cartao-login input{padding:var(--espaco-3) var(--espaco-4);border:1px solid var(--borda);border-radius:var(--raio-lg);font-size:var(--fonte-tamanho-sm);background:var(--superficie);width:100%}
.cartao-login input:focus{border-color:var(--cor-primaria);outline:none;box-shadow:0 0 0 1px var(--cor-primaria)}
.cartao-login button{width:100%;padding:var(--espaco-3);border-radius:var(--raio-xl);background:var(--cor-primaria);color:var(--texto-invertido);font-weight:var(--fonte-peso-semibold);font-size:var(--fonte-tamanho-sm);border:1px solid var(--cor-primaria);cursor:pointer;transition:var(--transicao-cor)}
.cartao-login button:hover{background:var(--cor-primaria-escura);border-color:var(--cor-primaria-escura)}
.erro-login{margin:0 0 var(--espaco-4);padding:var(--espaco-2) var(--espaco-3);background:var(--erro-fundo);color:var(--erro);border-radius:var(--raio-lg);font-size:var(--fonte-tamanho-sm)}

.acoes-linha{white-space:nowrap} .acoes-linha a{margin-right:var(--espaco-1)}
.eventos-mes{margin-top:var(--espaco-6)}
.eventos-mes h2{margin-top:0}

/* ============================================================
 * Agenda alfabética (específica deste produto — uso móvel em campo)
 * ============================================================ */
.indice{display:flex;flex-wrap:wrap;gap:var(--espaco-0-5);margin:var(--espaco-3) 0 var(--espaco-4);position:sticky;top:3.5rem;background:var(--fundo-app);padding:var(--espaco-1-5) 0;z-index:3}
.indice a,.indice span{width:1.7rem;height:1.7rem;line-height:1.7rem;text-align:center;border-radius:var(--raio-md);font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-semibold)}
.indice a{background:var(--superficie);border:1px solid var(--borda);color:var(--texto-secundario)}
.indice a:hover{background:var(--cor-primaria);border-color:var(--cor-primaria);color:var(--texto-invertido);text-decoration:none}
.indice span{color:var(--borda);border:1px solid transparent}
@media (max-width:760px){.indice{top:0}}
.agenda .letra{margin-bottom:var(--espaco-5);scroll-margin-top:6rem}
.agenda .letra h2{margin:0 0 var(--espaco-2);font-size:var(--fonte-tamanho-sm);color:var(--cor-primaria);text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--cor-primaria-suave);padding-bottom:var(--espaco-1)}
.agenda ul{list-style:none;margin:0;padding:0}
.agenda li{display:flex;align-items:center;gap:var(--espaco-3);background:var(--superficie);border:1px solid var(--borda-leve);border-radius:var(--raio-xl);padding:var(--espaco-2-5) var(--espaco-3);margin-bottom:var(--espaco-1-5);box-shadow:var(--sombra-sm)}
.agenda .pessoa{display:flex;align-items:center;gap:var(--espaco-3);flex:1;color:var(--texto-titulo);min-width:0}
.agenda .pessoa:hover{text-decoration:none} .agenda .pessoa:hover b{color:var(--cor-primaria)}
.agenda .nome-bloco{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.agenda .nome-bloco small{font-size:var(--fonte-tamanho-xs);color:var(--texto-muted)}
.agenda .cluster{flex-shrink:0}
.mini-situ{font-size:var(--fonte-tamanho-10);padding:var(--espaco-0-5) var(--espaco-1-5)}
.contatos{display:flex;gap:var(--espaco-1);flex-shrink:0}
.icone{width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--raio-md);background:var(--superficie-neutra);color:var(--texto-corpo);font-size:var(--fonte-tamanho-base);border:1px solid var(--borda-leve);transition:var(--transicao-cor)}
.icone:hover{background:var(--cor-primaria);border-color:var(--cor-primaria);color:var(--texto-invertido);text-decoration:none}
.icone.destaque{background:var(--cor-primaria);border-color:var(--cor-primaria);color:var(--texto-invertido)}
.icone svg{display:block;width:1.15rem;height:1.15rem}
.agenda .linha-endereco{display:block}
.agenda .rotulo-inline{display:inline-block;font-size:9px;font-weight:var(--fonte-peso-semibold);text-transform:uppercase;letter-spacing:.05em;color:var(--texto-desativado);padding:1px var(--espaco-1);border:1px solid var(--borda-leve);border-radius:var(--raio-sm);margin-right:var(--espaco-1);vertical-align:1px}
label.destacado{font-weight:var(--fonte-peso-semibold);color:var(--texto-titulo)}
label.destacado .mudo{font-weight:var(--fonte-peso-normal);font-size:var(--fonte-tamanho-xs)}
input.pendente{border-color:var(--alerta);background:var(--alerta-fundo)}
input.pendente:focus{border-color:var(--cor-primaria);box-shadow:0 0 0 1px var(--cor-primaria);background:var(--superficie)}

/* Cabeça: agrupa botão primário e formulário de filtros à direita */
.acoes-cabeca{display:flex;flex-direction:column;align-items:flex-end;gap:var(--espaco-2)}
@media (max-width:760px){.acoes-cabeca{align-items:stretch;width:100%} .acoes-cabeca .linha-form{justify-content:flex-start}}

/* Chamado para ação: usada no painel Metas quando não há visita hoje */
.chamado{display:flex;justify-content:space-between;align-items:center;gap:var(--espaco-3);flex-wrap:wrap;background:var(--alerta-fundo);border-left:4px solid var(--alerta);color:var(--alerta-escuro);padding:var(--espaco-3) var(--espaco-4);border-radius:var(--raio-lg);margin-bottom:var(--espaco-4)}
.chamado .chamado-texto{font-size:var(--fonte-tamanho-sm)}

/* Ícone de ajuda inline, link para /conceitos#âncora */
.ajuda{display:inline-flex;align-items:center;justify-content:center;width:1.1rem;height:1.1rem;margin-left:var(--espaco-0-5);border:1px solid var(--borda);border-radius:var(--raio-full);font-size:10px;font-weight:var(--fonte-peso-semibold);color:var(--texto-muted);background:var(--superficie);vertical-align:1px;line-height:1;text-decoration:none}
.ajuda:hover{background:var(--cor-primaria);border-color:var(--cor-primaria);color:var(--texto-invertido);text-decoration:none}

/* Etiquetas para distinguir evento x treinamento na linha do tempo geral */
.etiqueta-tipo{display:inline-block;font-size:var(--fonte-tamanho-10);font-weight:var(--fonte-peso-semibold);text-transform:uppercase;letter-spacing:.05em;padding:1px var(--espaco-1-5);border-radius:var(--raio-sm);vertical-align:1px}
.etiqueta-tipo.evento{background:var(--superficie-cinza);color:var(--texto-corpo)}
.etiqueta-tipo.treinamento{background:var(--cor-primaria-suave);color:var(--cor-primaria)}

/* Marcador da linha do tempo para treinamento (mesmo estilo neutro do evento) */
.linha-tempo li.treinamento::before{background:var(--cor-primaria);opacity:.7}

/* Card separado do bloco Treinamentos no painel de Metas — visualmente descolado dos quatro blocos de visita */
.grade-treinamentos{grid-template-columns:1fr;margin-top:var(--espaco-6)}
.kpi-treinamentos{border-left:4px solid var(--cor-primaria);background:linear-gradient(90deg,var(--cor-primaria-suave) 0,var(--superficie) 40%)}
.kpi-rotulo-linha{display:flex;align-items:center;justify-content:space-between;gap:var(--espaco-2);flex-wrap:wrap}
.etiqueta-fora-visitas{display:inline-block;font-size:var(--fonte-tamanho-10);font-weight:var(--fonte-peso-semibold);text-transform:uppercase;letter-spacing:.05em;padding:1px var(--espaco-1-5);border-radius:var(--raio-sm);background:var(--superficie-cinza);color:var(--texto-muted)}

/* Badge de pendentes (menu Gestão, cabeçalho do painel admin) */
.badge-pendentes{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 var(--espaco-1);background:var(--alerta);color:var(--texto-invertido);border-radius:var(--raio-full);font-size:var(--fonte-tamanho-10);font-weight:var(--fonte-peso-semibold);margin-left:var(--espaco-1);vertical-align:1px}
.nav-desk .badge-pendentes,.nav-mob .badge-pendentes{background:var(--alerta);color:var(--texto-invertido)}
h1 .badge-pendentes{height:1.5rem;min-width:1.5rem;font-size:var(--fonte-tamanho-xs)}

/* Botão "desabilitado" (span com aparência de botão que não age) */
.botao.desabilitado,span.botao.desabilitado{background:var(--superficie-cinza);color:var(--texto-muted);border-color:var(--borda);cursor:not-allowed;pointer-events:none}

/* Critérios do IAV em somente-leitura */
.criterios-bloqueados{background:var(--superficie-cinza);border-color:var(--borda-leve)}
.criterios-bloqueados legend{color:var(--texto-muted)}
.grade-2.leitura>div{display:flex;flex-direction:column;gap:var(--espaco-0-5);padding:var(--espaco-2);background:var(--superficie);border:1px solid var(--borda-leve);border-radius:var(--raio-md)}
.grade-2.leitura .rotulo-c{margin:0}

/* Prévia dinâmica do IAV na tela de reclassificação */
.previa-recl{background:var(--sucesso-fundo);border-color:var(--sucesso)}
.previa-recl .destaque{display:flex;align-items:center;gap:var(--espaco-2)}

/* Cartão de solicitação pendente na fila admin */
.cartao.solicitacao{border-left:4px solid var(--alerta);margin-bottom:var(--espaco-4)}
.cartao.solicitacao .cabeca{margin-bottom:var(--espaco-3)}
.cartao.solicitacao .tabela tr.mudou td{background:var(--alerta-chip-fundo);font-weight:var(--fonte-peso-semibold)}

/* Checkboxes de UF na Gestão */
.checkboxes-uf{display:grid;grid-template-columns:repeat(6,minmax(60px,1fr));gap:var(--espaco-1) var(--espaco-2)}
.checkboxes-uf legend{grid-column:1/-1}
.checkboxes-uf label.check{margin:0}
@media (max-width:640px){.checkboxes-uf{grid-template-columns:repeat(4,1fr)}}

/* ============================================================
 * Fechamento mensal
 * ============================================================ */
.fechamento-cabeca .acoes{align-items:flex-start}
.secao{margin-top:var(--espaco-8)}
.secao > h2{margin-top:0;font-size:var(--fonte-tamanho-lg);color:var(--texto-titulo);letter-spacing:-.01em;border-bottom:1px solid var(--borda-leve);padding-bottom:var(--espaco-2)}
.secao > h3{color:var(--cor-primaria);margin-top:var(--espaco-4)}
.obs-bloco{background:var(--alerta-chip-fundo);color:var(--alerta-escuro);border-radius:var(--raio-sm);padding:2px var(--espaco-1-5);margin-top:var(--espaco-1) !important;font-size:var(--fonte-tamanho-10);line-height:1.4}
.grafico-evolucao{width:100%;max-width:640px;height:auto;color:var(--texto-corpo);margin-top:var(--espaco-3)}
.inedita-cartao{margin-bottom:var(--espaco-3)}
.inedita-cartao .cabeca{margin-bottom:var(--espaco-2)}
.ponto-atencao{margin-bottom:var(--espaco-3);border-left:4px solid var(--borda)}
.ponto-atencao.ponto-reconhecimento{border-left-color:var(--sucesso)}
.ponto-cabeca{display:flex;gap:var(--espaco-2);align-items:center;margin-bottom:var(--espaco-2)}

/* ============================================================
 * Mídia print — versão limpa para PDF
 * ============================================================ */
@media print{
  @page{margin:1.5cm 1.2cm}
  body{background:white;padding:0}
  .topo,.nav-mob,.fab,.no-print,.flash,.offline{display:none !important}
  .pagina{max-width:100%;padding:0}
  a{color:inherit;text-decoration:none}
  .cabeca{page-break-after:avoid}
  .secao{page-break-inside:avoid;margin-top:var(--espaco-5)}
  .kpi,.cartao,.ponto-atencao,.inedita-cartao{box-shadow:none;border:1px solid var(--borda);page-break-inside:avoid}
  .grade-kpi{grid-template-columns:repeat(4,1fr) !important;gap:var(--espaco-2)}
  .kpi-destaque{grid-column:1/-1}
  .tabela{font-size:10pt}
  .tabela th{background:var(--superficie-cinza) !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .barra .feito,.grafico-evolucao rect,.situ,.cluster,.badge-pendentes{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  h1,h2,h3{color:black}
}

/* ============================================================
 * Tags / chips de filtro
 * ============================================================ */
.chips{display:flex;flex-wrap:wrap;gap:var(--espaco-1-5);margin:0 0 var(--espaco-4)}
.chip{background:var(--superficie);border:1px solid var(--borda);border-radius:var(--raio-full);padding:var(--espaco-1) var(--espaco-3);font-size:var(--fonte-tamanho-xs);font-weight:var(--fonte-peso-medio);color:var(--texto-secundario);transition:var(--transicao-cor)}
.chip small{color:var(--texto-muted)}
.chip.on{background:var(--cor-primaria);color:var(--texto-invertido);border-color:var(--cor-primaria)}
.chip:hover{text-decoration:none;border-color:var(--cor-primaria);color:var(--cor-primaria)}
.chip.on:hover{color:var(--texto-invertido)}
.tag{display:inline-block;background:var(--cor-primaria-suave);color:var(--cor-primaria);border-radius:var(--raio-sm);padding:0 var(--espaco-1-5);font-size:var(--fonte-tamanho-xs);margin-right:var(--espaco-1);font-weight:var(--fonte-peso-medio)}
.tags-linha{display:flex;flex-wrap:wrap;gap:var(--espaco-1);align-items:center;margin-top:var(--espaco-1)}