/* ==========================================================================
   Life Laboral — Portal de Formulários
   Folha única compartilhada pelo portal, pelos quatro formulários e pelo painel.
   Os valores (cores, raios, sombras) vêm do projeto de design.
   ========================================================================== */

:root{
  --azul:#0D4B86;
  --azul-claro:#eaf5fb;
  --teal:#43B5B6;
  --teal-escuro:#34999a;
  --teal-claro:#eef9f9;

  --fundo:#eef1f4;
  --borda:#d9e0e4;
  --borda-campo:#b7c1c7;
  --linha:#eceff1;
  --cinza-campo:#f5f7f8;

  --texto:#12232e;
  --texto-medio:#33454f;
  --texto-suave:#5b6b74;
  --cinza:#84949c;
  --link:#0086C4;

  --erro:#d24b46;
  --erro-fundo:#fbe7e6;
  --erro-borda:#eb9a96;
  --erro-texto:#8a3330;

  --alerta:#d9922b;
  --alerta-fundo:#fbf0dc;
  --alerta-borda:#f0cf8e;
  --alerta-texto:#6b4712;
  --alerta-titulo:#8a5a13;

  --sucesso:#2f9e6b;
  --sucesso-fundo:#e4f4ec;

  --mulish:'Mulish',system-ui,-apple-system,'Segoe UI',sans-serif;
  --montserrat:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  --curva:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--fundo);font-family:var(--mulish);color:var(--texto)}

.pagina{min-height:100vh;padding:28px 16px}
.pagina--portal{padding:56px 16px}

a:focus-visible,button:focus-visible,
[role="button"]:focus-visible,summary:focus-visible{
  outline:2px solid var(--teal);outline-offset:3px;border-radius:6px;
}

/* Sem isto, qualquer `display:flex` de classe vence o [hidden] do navegador. */
[hidden]{display:none !important}

/* ------------------------------------------------------------------ portal */

.portal{max-width:940px;margin:0 auto}

.portal__barra{display:flex;justify-content:flex-end;margin-bottom:18px}

.botao-admin{
  display:inline-flex;align-items:center;gap:8px;
  text-decoration:none;font-weight:700;font-size:13.5px;color:var(--azul);
  background:#fff;border:1.5px solid var(--borda);border-radius:999px;
  padding:9px 18px;cursor:pointer;
  transition:border-color 180ms ease,background-color 180ms ease;
}
.botao-admin:hover,.botao-admin:focus-visible{border-color:var(--teal);background:var(--teal-claro)}

.portal__cabecalho{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:8px;margin-bottom:44px;
}
.portal__logo{height:86px;width:auto;object-fit:contain;margin-bottom:10px}
.portal__titulo{
  font-family:var(--montserrat);font-weight:900;font-size:30px;
  color:var(--azul);letter-spacing:.01em;margin:0;
}
.portal__subtitulo{font-size:15.5px;color:var(--texto-suave);max-width:480px;line-height:1.5;margin:0}

.portal__grade{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}

.cartao{
  text-decoration:none;display:flex;flex-direction:column;gap:14px;
  background:#fff;border:1.5px solid var(--borda);border-radius:24px;padding:26px;
  box-shadow:0 2px 6px rgba(13,75,134,.07);
  transition:box-shadow 210ms var(--curva),border-color 210ms var(--curva),transform 210ms var(--curva);
}
.cartao:hover,.cartao:focus-visible{
  box-shadow:0 18px 46px rgba(13,75,134,.13);border-color:var(--teal);transform:translateY(-2px);
}
.cartao__icone{
  width:48px;height:48px;flex:none;border-radius:14px;
  background:var(--teal-claro);color:var(--teal);
  display:flex;align-items:center;justify-content:center;
}
.cartao__corpo{flex:1}
.cartao__titulo{font-family:var(--montserrat);font-weight:800;font-size:17px;color:var(--azul);margin:0 0 6px}
.cartao__descricao{font-size:13.5px;color:var(--texto-suave);line-height:1.5;margin:0}
.cartao__acao{display:flex;align-items:center;gap:6px;font-weight:700;font-size:13px;color:var(--teal-escuro)}

.rodape-contatos{
  margin-top:36px;border:1px solid var(--borda);border-radius:16px;background:#fff;
  padding:18px 24px;display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:16px;
}
.rodape-contatos__titulo{font-weight:700;font-size:13.5px;color:var(--texto)}
.rodape-contatos__lista{display:flex;gap:24px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.rodape-contatos__item{font-size:13px;color:var(--texto-suave)}
.rodape-contatos__item b{color:var(--texto);font-weight:700}
.rodape-contatos__item a{color:var(--link);text-decoration:none}
.rodape-contatos__item a:hover,.rodape-contatos__item a:focus-visible{text-decoration:underline}

/* ------------------------------------------------------- folha do formulário */

.folha{
  max-width:980px;margin:0 auto;background:#fff;
  border:2px solid var(--azul);border-radius:20px;
  padding:26px 32px 22px;box-shadow:0 8px 22px rgba(13,75,134,.09);
}
.folha--estreita{max-width:900px}
.folha--larga{max-width:1000px}

.folha__cabecalho{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-bottom:18px;border-bottom:1px solid var(--borda);margin-bottom:20px;
}
.folha__logo{height:60px;width:auto;object-fit:contain;display:block}
.folha__titulos{text-align:center;flex:1;min-width:0}
.folha__titulo{
  font-family:var(--montserrat);font-weight:900;font-size:22px;letter-spacing:.02em;
  color:var(--azul);margin:0;
}
.folha__titulo--g{font-size:26px}
.folha__subtitulo{font-weight:600;font-size:14px;color:var(--texto-medio);margin:2px 0 0}
.folha__nota{font-size:12px;color:var(--texto-suave);margin:4px 0 0}

.selo-nr{
  flex:none;font-family:var(--montserrat);font-weight:800;font-size:11px;letter-spacing:.06em;
  color:var(--azul);background:var(--azul-claro);border-radius:999px;padding:7px 14px;white-space:nowrap;
}
.marca-life{display:flex;align-items:center;gap:8px;flex:none}
.marca-life__icone{
  width:34px;height:34px;border-radius:10px;background:var(--teal-claro);color:var(--teal);
  display:flex;align-items:center;justify-content:center;flex:none;
}
.marca-life__texto{line-height:1.05}
.marca-life__nome{font-family:var(--montserrat);font-weight:800;font-size:15px;color:var(--azul)}
.marca-life__sub{font-family:var(--montserrat);font-weight:800;font-size:10px;letter-spacing:.14em;color:var(--teal)}
.espaco-parceiro{
  flex:none;width:120px;height:52px;border:1.5px dashed var(--borda-campo);border-radius:10px;
  display:flex;align-items:center;justify-content:center;color:var(--cinza);
  font-size:10px;font-weight:700;text-align:center;letter-spacing:.04em;text-transform:uppercase;line-height:1.3;
}

/* ----------------------------------------------------------------- seções */

.faixa-info{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
  background:var(--azul);border-radius:12px;padding:16px 20px;
}
.faixa-info__item{display:flex;align-items:flex-start;gap:12px}
.faixa-info__item svg{flex:none;margin-top:1px;color:#fff}
.faixa-info__item span{font-size:13.5px;color:#fff;line-height:1.4}

.secao{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--azul-claro);border-radius:10px;padding:8px 14px;margin:22px 0 16px;
}
.secao__numero{
  flex:none;width:26px;height:26px;border-radius:7px;background:var(--azul);color:#fff;
  font-family:var(--montserrat);font-weight:800;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}
.secao__titulo{
  font-family:var(--montserrat);font-weight:800;font-size:14px;letter-spacing:.06em;
  color:var(--azul);text-transform:uppercase;margin:0;
}
.secao__nota{font-weight:600;font-size:12.5px;color:var(--texto-suave)}

.bloco{border:1.5px solid var(--borda);border-radius:16px;overflow:hidden}
.bloco--total{grid-column:1 / -1}
.bloco__cabecalho{
  display:flex;align-items:center;gap:10px;
  background:var(--azul-claro);padding:9px 16px;border-bottom:1px solid var(--borda);
}
.bloco__cabecalho svg{color:var(--azul);flex:none}
.bloco__numero{
  flex:none;width:24px;height:24px;border-radius:7px;background:var(--azul);color:#fff;
  font-family:var(--montserrat);font-weight:800;font-size:12.5px;
  display:flex;align-items:center;justify-content:center;
}
.bloco__titulo{
  font-family:var(--montserrat);font-weight:800;font-size:12.5px;letter-spacing:.05em;
  color:var(--azul);text-transform:uppercase;margin:0;
}
.bloco__corpo{padding:16px;display:flex;flex-direction:column;gap:8px}

/* ------------------------------------------------------------------ grades */

.grade{display:grid;gap:16px}
.grade--2{grid-template-columns:repeat(2,1fr)}
.grade--3{grid-template-columns:repeat(3,1fr)}
.grade--5{grid-template-columns:repeat(5,1fr)}
.grade--blocos{gap:18px}
.grade--campos{gap:14px}
.grade--2-1{grid-template-columns:2fr 1fr}
.grade--1-2{grid-template-columns:1fr 2fr}
.grade--14-1{grid-template-columns:1.4fr 1fr}
.grade--1-13{grid-template-columns:1fr 1.3fr}
.grade--1-16{grid-template-columns:1fr 1.6fr}
.grade--foto{grid-template-columns:300px 1fr;gap:18px}
.total{grid-column:1 / -1}
.mb{margin-bottom:16px}
.mb-g{margin-bottom:22px}

/* ------------------------------------------------------------------ campos */

.campo{display:flex;flex-direction:column;gap:6px}
/* Campo que ocupa duas colunas da grade (nomes precisam de mais largura). */
.campo--2col{grid-column:span 2}
@media (max-width:600px){.campo--2col{grid-column:auto}}
.campo__rotulo{font-weight:700;font-size:12.5px;color:var(--texto);line-height:1.25}
.campo__dica{font-size:12px;color:var(--texto-suave);line-height:1.5}
.campo__opcional{color:var(--cinza);font-weight:500}
.obrigatorio{color:var(--erro);margin-left:2px}

.entrada,
.selecao,
.area{
  width:100%;font-family:var(--mulish);font-size:13.5px;color:var(--texto);
  background:#fff;border:1.5px solid var(--borda-campo);border-radius:10px;
  padding:9px 11px;outline:none;
  transition:border-color 140ms ease,box-shadow 140ms ease;
}
.area{resize:vertical;min-height:64px}
.selecao{appearance:none;padding-right:34px;cursor:pointer}

.entrada:hover,.selecao:hover,.area:hover{border-color:var(--cinza)}
.entrada:focus,.selecao:focus,.area:focus{
  border-color:var(--teal);box-shadow:0 0 0 4px rgba(67,181,182,.35);
}
.entrada:disabled,.entrada[readonly]{background:var(--linha);color:var(--texto-suave);border-color:var(--borda)}
.entrada:user-invalid,.selecao:user-invalid,.area:user-invalid{border-color:var(--erro)}

/* Obrigatórios sem resposta (validação feita no JS, porque o input é invisível). */
.campo--invalido .opcao__marca{border-color:var(--erro)}
.campo--invalido .campo__rotulo{color:var(--erro)}
.avaliacao__item--invalido{background:var(--erro-fundo)}
.avaliacao__item--invalido .avaliacao__rotulo{color:var(--erro)}
.avaliacao__item--invalido .pilula{border-color:var(--erro-borda)}
.foto--invalida{border-color:var(--erro);background:var(--erro-fundo)}
.foto--invalida .foto__texto{color:var(--erro)}
.anexo--invalido{border-color:var(--erro);background:var(--erro-fundo)}
.anexo--invalido .anexo__texto{color:var(--erro)}
.entrada--invalida,.tabela__entrada.entrada--invalida{border-color:var(--erro);background:var(--erro-fundo)}

/* Medidas: a unidade fica fixa ao lado do campo, então ninguém digita "cm". */
.tabela__medida{display:flex;align-items:center;gap:6px;min-width:0}
.tabela__medida .tabela__entrada{flex:1;min-width:0}
.tabela__unidade{flex:none;font-size:12px;font-weight:600;color:var(--texto-suave)}
.tabela--medidas .tabela__medida{padding:6px 14px;gap:8px}
.tabela--medidas .tabela__medida .tabela__entrada{margin:0}

/* O CAT usa campos um pouco maiores que os demais formulários. */
.folha--cat .entrada,
.folha--cat .selecao,
.folha--cat .area{font-size:14px;border-radius:12px;padding:10px 12px}
.folha--cat .selecao{padding-right:34px}
.folha--cat .campo__rotulo{font-size:13px}

.selecao-caixa{position:relative;display:flex;align-items:center}
.selecao-caixa__seta{
  position:absolute;right:12px;pointer-events:none;color:var(--cinza);display:flex;
}
.entrada-caixa{position:relative;display:flex;align-items:center}
.entrada-caixa .entrada{padding-right:40px}
.entrada-caixa__icone{position:absolute;right:12px;pointer-events:none;color:var(--cinza);display:flex}

/* --------------------------------------------------- sim / não (radio real) */

.opcoes{display:flex;gap:18px;align-items:center;padding-top:6px;flex-wrap:wrap}
.opcoes--compacto{gap:12px;padding-top:0}

.opcao{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.opcao input{position:absolute;opacity:0;width:0;height:0}
.opcao__marca{
  flex:none;width:20px;height:20px;border-radius:50%;
  border:1.5px solid var(--cinza);background:#fff;
  display:flex;align-items:center;justify-content:center;
  transition:border-color 150ms ease,background-color 150ms ease;
}
.opcao__marca::after{
  content:"";width:8px;height:8px;border-radius:50%;background:#fff;
  transform:scale(0);transition:transform 150ms ease;
}
.opcao input:checked + .opcao__marca{border-color:var(--teal);background:var(--teal)}
.opcao input:checked + .opcao__marca::after{transform:scale(1)}
.opcao input:focus-visible + .opcao__marca{box-shadow:0 0 0 4px rgba(67,181,182,.35)}
.opcao__texto{font-size:14px;color:var(--texto-medio)}
.opcoes--compacto .opcao__texto{font-size:12px}

/* ---------------------------------------- avaliação em três estados (NR-17) */

.avaliacao{border:1px solid var(--borda);border-radius:12px;overflow:hidden}
.avaliacao__item + .avaliacao__item{border-top:1px solid var(--linha)}
.avaliacao__linha{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:11px 14px;flex-wrap:wrap;
}
.avaliacao__texto{flex:1;min-width:220px}
.avaliacao__rotulo{font-weight:700;font-size:13.5px;color:var(--texto)}
.avaliacao__dica{font-size:12px;color:var(--texto-suave);margin-top:1px}
.avaliacao__botoes{display:flex;gap:6px;flex:none;flex-wrap:wrap}

.pilula{
  padding:7px 12px;border-radius:999px;font-size:12px;font-weight:700;
  font-family:var(--mulish);cursor:pointer;user-select:none;white-space:nowrap;
  border:1.5px solid var(--borda);background:#fff;color:var(--texto-suave);
  transition:border-color 150ms ease,background-color 150ms ease,color 150ms ease;
}
.pilula input{position:absolute;opacity:0;width:0;height:0}
.pilula:has(input:focus-visible){box-shadow:0 0 0 4px rgba(67,181,182,.35)}
.pilula--ok:has(input:checked){border-color:var(--sucesso);background:var(--sucesso-fundo);color:var(--sucesso)}
.pilula--nok:has(input:checked){border-color:var(--erro);background:var(--erro-fundo);color:var(--erro)}
.pilula--adq:has(input:checked){border-color:var(--alerta);background:var(--alerta-fundo);color:var(--alerta)}

.avaliacao__obs{display:none;gap:8px;align-items:flex-start;padding:10px 14px;border-top:1px solid transparent}
.avaliacao__item:has(.pilula--nok input:checked) .avaliacao__obs{
  display:flex;background:var(--erro-fundo);border-top-color:var(--erro-borda);
}
.avaliacao__obs textarea{
  flex:1;border:1px solid var(--borda);border-radius:8px;padding:6px 10px;
  font-family:var(--mulish);font-size:12.5px;color:var(--texto);
  background:#fff;resize:vertical;min-height:36px;outline:none;
}
.avaliacao__obs textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(67,181,182,.28)}

/* Variante usada nos critérios de EPI do PPP: texto corrido, resposta Sim/Não. */
.avaliacao--criterios .avaliacao__rotulo{font-weight:400;font-size:12.5px;line-height:1.4}
.avaliacao--criterios .avaliacao__linha{padding:9px 12px}
.avaliacao--criterios .avaliacao__texto{min-width:160px}
/* O par Sim/Não fica sempre lado a lado, alinhado à direita, mesmo em coluna
   estreita — antes escorregava um sob o outro. */
.avaliacao--criterios .opcoes--compacto{
  flex:none;flex-wrap:nowrap;gap:16px;justify-content:flex-end;
  min-width:104px;padding-left:6px;
}
.avaliacao--criterios .opcao{white-space:nowrap}

/* ------------------------------------------------------------- tabelas grid */

.tabela{border:1px solid var(--borda);border-radius:12px;overflow:auto}
.tabela__cabecalho,
.tabela__linha{display:grid}
.tabela__cabecalho{background:var(--azul-claro)}
.tabela__linha{border-top:1px solid var(--borda)}
.tabela__coluna{
  padding:9px 12px;font-weight:700;font-size:12.5px;color:var(--azul);
}
.tabela__coluna + .tabela__coluna{border-left:1px solid var(--borda)}
.tabela__celula{
  padding:9px 12px;font-size:13px;color:var(--texto);
  display:flex;align-items:center;
}
.tabela__entrada{
  width:100%;border:none;background:#fff;padding:8px 12px;outline:none;
  font-family:var(--mulish);font-size:13px;color:var(--texto);
}
/* Depois de .tabela__entrada: senão o `border:none` acima apaga o separador. */
.tabela__linha > * + *{border-left:1px solid var(--borda)}
.tabela__entrada:focus{background:var(--teal-claro)}
.tabela__indice{
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:13px;color:var(--texto-suave);
}
.tabela__referencia{
  padding:9px 14px;font-size:12.5px;color:var(--texto-suave);display:flex;align-items:center;
}
.tabela__entrada--area{
  resize:vertical;line-height:1.45;min-height:38px;align-self:stretch;
  font-family:var(--mulish);
}
.tabela--medidas .tabela__entrada{
  margin:6px 14px;width:auto;border:1.5px solid var(--borda-campo);border-radius:8px;padding:6px 10px;
}
.tabela--medidas .tabela__entrada:focus{
  background:#fff;border-color:var(--teal);box-shadow:0 0 0 4px rgba(67,181,182,.35);
}
.tabela__vazio{padding:28px 16px;text-align:center;font-size:13.5px;color:var(--cinza)}

.legenda{
  font-family:var(--montserrat);font-weight:800;font-size:11px;letter-spacing:.05em;
  color:var(--teal-escuro);text-transform:uppercase;margin:0 0 8px;
}

/* ------------------------------------------------------------------ ações */

.adicionar{
  display:inline-flex;align-items:center;gap:6px;cursor:pointer;user-select:none;
  background:none;border:none;padding:0;margin-top:8px;
  font-family:var(--mulish);font-weight:700;font-size:12.5px;color:var(--teal-escuro);
}
.adicionar svg{color:var(--teal)}
.adicionar:hover{color:var(--azul)}
.adicionar[hidden]{display:none}

.botao{
  font-family:var(--mulish);font-weight:700;font-size:14px;color:#fff;
  background:var(--teal);border:none;border-radius:12px;padding:11px 24px;cursor:pointer;
  transition:background-color 150ms ease;
}
.botao:hover:not(:disabled){background:var(--teal-escuro)}
.botao:disabled{opacity:.6;cursor:progress}
.botao--secundario{
  color:var(--azul);background:#fff;border:1.5px solid var(--azul);padding:10px 20px;
}
.botao--secundario:hover:not(:disabled){background:var(--azul-claro)}

.barra-final{
  display:flex;align-items:center;justify-content:space-between;
  border-top:1px solid var(--borda);padding-top:14px;margin-top:18px;
  flex-wrap:wrap;gap:10px;
}
.barra-final__nota{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--texto-medio)}
.barra-final__nota svg{color:var(--azul);flex:none}
.barra-final__versao{font-size:12.5px;color:var(--cinza)}
.barra-final__acoes{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

.aviso{font-weight:700;font-size:13px;margin:0}
.aviso--ok{color:var(--sucesso)}
.aviso--erro{color:var(--erro)}

/* ---------------------------------------------------------------- anexos */

.anexo{
  display:flex;align-items:center;gap:10px;border:1.5px dashed var(--borda-campo);
  border-radius:10px;padding:8px 12px;cursor:pointer;
  transition:border-color 150ms ease,background-color 150ms ease;
}
.anexo:hover,.anexo:focus-within{border-color:var(--teal);background:var(--teal-claro)}
.anexo input{position:absolute;opacity:0;width:0;height:0}
.anexo svg{color:var(--azul);flex:none}
.anexo__texto{font-size:13px;color:var(--texto)}
.anexo-nome{font-size:12px;color:var(--sucesso);font-weight:700}
.anexo-nome:empty{display:none}
/* Vários arquivos: cada um em uma linha, com peso e botão de remover. */
ul.anexo-lista,.anexo-lista{
  list-style:none;display:flex;flex-direction:column;gap:6px;margin:8px 0 0;padding:0;
  color:var(--texto);font-weight:400;
}
.anexo-lista__item{
  display:flex;align-items:center;gap:10px;background:var(--cinza-campo);
  border:1px solid var(--borda);border-radius:8px;padding:6px 10px;font-size:12.5px;
}
.anexo-lista__nome{flex:1;overflow-wrap:anywhere;font-weight:700}
.anexo-lista__peso{color:var(--texto-suave);font-variant-numeric:tabular-nums}
.anexo-lista__remover{
  border:none;background:none;padding:0;cursor:pointer;font-family:var(--mulish);
  font-size:12px;font-weight:700;color:var(--erro);text-decoration:underline;
}

.foto{
  border:1.5px dashed var(--borda-campo);border-radius:14px;background:var(--cinza-campo);
  height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;cursor:pointer;overflow:hidden;position:relative;
  transition:border-color 150ms ease,background-color 150ms ease;
}
.foto:hover,.foto:focus-within{border-color:var(--teal);background:var(--teal-claro)}
.foto input{position:absolute;opacity:0;width:0;height:0}
.foto svg{color:var(--cinza)}
.foto__texto{font-size:12.5px;font-weight:700;color:var(--texto-suave);text-align:center;padding:0 12px}
.foto__previa{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.foto--preenchida .foto__previa{display:block}
.foto--preenchida svg,.foto--preenchida .foto__texto{display:none}

/* -------------------------------------------------------------- caixas info */

.caixa{border:1px solid var(--borda);border-radius:12px;padding:16px 18px}
.caixa__titulo{
  font-family:var(--montserrat);font-weight:800;font-size:13px;letter-spacing:.04em;
  color:var(--azul);text-transform:uppercase;margin:0 0 4px;
}
.caixa__nota{font-size:12.5px;color:var(--texto-suave);margin:0 0 12px}
.caixa__lista{display:flex;flex-direction:column;gap:10px;list-style:none;margin:0;padding:0}
.caixa__lista li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--texto)}
.caixa__lista svg{color:var(--azul);flex:none;margin-top:1px}

/* Instruções de captação: presentes, mas sem competir com os campos. */
.caixa--instrucoes{padding:12px 16px;background:var(--cinza-campo);border-color:var(--linha)}
.caixa__lista--discreta{gap:6px}
.caixa__lista--discreta li{font-size:12.5px;color:var(--texto-suave)}
.caixa__lista--discreta svg{width:13px;height:13px;color:var(--teal)}

.caixa--alerta{border-color:var(--alerta-borda);background:var(--alerta-fundo)}
.caixa--alerta .caixa__titulo{color:var(--alerta-titulo);display:flex;align-items:center;gap:8px;margin-bottom:8px}
.caixa--alerta .caixa__titulo svg{color:var(--alerta)}
.caixa--alerta p{font-size:13px;color:var(--alerta-texto);line-height:1.5;margin:0}

.contatos{border:1px solid var(--borda);border-radius:12px;overflow:hidden}
.contatos__titulo{
  background:var(--azul);padding:10px 18px;
  font-family:var(--montserrat);font-weight:800;font-size:13px;letter-spacing:.04em;
  color:#fff;text-transform:uppercase;margin:0;
}
.contatos__lista{display:grid;gap:14px;padding:14px 18px;list-style:none;margin:0}
.contatos__lista--3{grid-template-columns:repeat(3,1fr)}
.contatos__item{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:10px;font-size:12.5px}
.contatos__item--email{grid-template-columns:34px 1fr 1.3fr}
.contatos__avatar{
  width:30px;height:30px;border-radius:50%;background:var(--teal);color:#fff;
  display:flex;align-items:center;justify-content:center;flex:none;
}
.contatos__nome b{color:var(--texto)}
.contatos__nome span{color:var(--texto-suave)}
.contatos__item a{font-size:13px;color:var(--link);text-decoration:none;word-break:break-all}
.contatos__item a:hover{text-decoration:underline}
.contatos__agradecimento{
  display:flex;align-items:center;gap:8px;background:var(--teal-claro);
  padding:10px 18px;border-top:1px solid var(--borda);
  font-size:12.5px;color:#215c5d;
}
.contatos__agradecimento svg{color:var(--teal-escuro);flex:none}

.faixa-id{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  background:var(--azul-claro);border-radius:14px;padding:16px 18px;margin-bottom:22px;
}
.faixa-assinatura{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  background:var(--cinza-campo);border-radius:12px;padding:16px 18px;margin-bottom:22px;
}

.lista-relato{margin:6px 0 0;padding-left:18px;font-size:12.5px;color:var(--texto-suave);line-height:1.6}

/* ------------------------------------------------------------------- login */

.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.login__caixa{
  width:100%;max-width:400px;background:#fff;border:2px solid var(--azul);border-radius:20px;
  padding:32px 30px;box-shadow:0 8px 22px rgba(13,75,134,.09);
  display:flex;flex-direction:column;gap:18px;
}
.login__marca{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:6px;text-align:center}
.login__marca img{height:72px;width:auto;object-fit:contain}
.login__titulo{font-family:var(--montserrat);font-weight:900;font-size:19px;color:var(--azul);margin:0}
.login__nota{font-size:13px;color:var(--texto-suave);margin:2px 0 0}
.login__voltar{
  text-align:center;font-weight:700;font-size:12.5px;color:var(--link);text-decoration:none;
}
.login__voltar:hover{text-decoration:underline}

.alerta-erro{
  display:flex;align-items:center;gap:8px;background:var(--erro-fundo);
  border:1px solid var(--erro-borda);border-radius:10px;padding:9px 12px;
}
.alerta-erro svg{color:var(--erro);flex:none}
.alerta-erro span{font-size:13px;color:var(--erro-texto)}

/* ------------------------------------------------------------------ painel */

.painel{max-width:1120px;margin:0 auto;padding:28px 16px 60px}
.painel__cabecalho{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-bottom:18px;border-bottom:1px solid var(--borda);margin-bottom:22px;flex-wrap:wrap;
}
.painel__titulo{font-family:var(--montserrat);font-weight:900;font-size:22px;color:var(--azul);margin:0}
.painel__nota{font-size:13px;color:var(--texto-suave);margin:2px 0 0}

.abas{
  display:inline-flex;gap:4px;background:#fff;border:1.5px solid var(--borda);
  border-radius:999px;padding:4px;margin-bottom:22px;flex-wrap:wrap;
}
.aba{
  padding:9px 18px;border-radius:999px;cursor:pointer;border:none;background:transparent;
  font-family:var(--mulish);font-weight:700;font-size:13px;color:var(--texto-suave);
  transition:background-color 150ms ease,color 150ms ease;
}
.aba[aria-selected="true"]{background:var(--azul);color:#fff}

.indicadores{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:20px}
.indicador{background:#fff;border:1.5px solid var(--borda);border-radius:14px;padding:16px}
.indicador__valor{font-family:var(--montserrat);font-weight:900;font-size:26px;color:var(--azul)}
.indicador__rotulo{font-size:12px;color:var(--texto-suave);margin-top:2px}

.painel-tabela{border:1px solid var(--borda);border-radius:14px;overflow:hidden;background:#fff}
.painel-tabela__rolagem{max-height:460px;overflow:auto}
.painel-tabela__cabecalho{display:grid;background:var(--azul-claro)}
.painel-tabela__linha{display:grid;border-top:1px solid var(--linha);align-items:center}
.painel-tabela__coluna{padding:10px 16px;font-weight:700;font-size:12.5px;color:var(--azul)}
.painel-tabela__coluna + .painel-tabela__coluna{border-left:1px solid var(--borda)}
.painel-tabela__celula{padding:9px 16px;font-size:13px;color:var(--texto)}
.painel-tabela__linha > * + *{border-left:1px solid var(--linha)}

.detalhe{background:#fff;border:1px solid var(--borda);border-radius:14px;overflow:hidden}
.detalhe__cabecalho{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--azul);padding:12px 18px;flex-wrap:wrap;
}
.detalhe__voltar{
  display:inline-flex;align-items:center;gap:6px;cursor:pointer;border:none;background:none;
  font-family:var(--mulish);font-weight:700;font-size:13px;color:#fff;padding:0;
}
.detalhe__identificacao{font-family:var(--montserrat);font-weight:800;font-size:12.5px;color:#fff;letter-spacing:.03em}
.detalhe__corpo{padding:6px 18px;max-height:520px;overflow:auto}
.detalhe__campo{padding:11px 0;border-top:1px solid var(--linha)}
.detalhe__rotulo{
  font-weight:700;font-size:11.5px;letter-spacing:.03em;color:var(--cinza);text-transform:uppercase;
}
.detalhe__valor{font-size:14px;color:var(--texto);margin-top:3px;line-height:1.5;white-space:pre-wrap}
.detalhe__anexos{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0 16px}

.etiqueta{
  font-weight:700;font-size:11.5px;border-radius:999px;padding:5px 12px;white-space:nowrap;
  background:#fff;color:var(--azul);
}
.etiqueta--enviado{background:var(--sucesso-fundo);color:var(--sucesso)}
.etiqueta--erro{background:var(--erro-fundo);color:var(--erro)}
.etiqueta--desativado{background:var(--linha);color:var(--texto-suave)}

.link-anexo{
  display:inline-flex;align-items:center;gap:6px;text-decoration:none;
  border:1.5px solid var(--borda);border-radius:10px;padding:7px 12px;
  font-size:12.5px;font-weight:700;color:var(--azul);background:#fff;
}
.link-anexo:hover{border-color:var(--teal);background:var(--teal-claro)}

.faixa-aviso{
  display:flex;align-items:center;gap:8px;background:var(--azul-claro);
  border-radius:10px;padding:10px 14px;margin-bottom:16px;
}
.faixa-aviso svg{color:var(--azul);flex:none}
.faixa-aviso span{font-size:12.5px;color:var(--texto-medio)}
.faixa-aviso--alerta{background:var(--alerta-fundo)}
.faixa-aviso--alerta svg{color:var(--alerta)}
.faixa-aviso--alerta span{color:var(--alerta-texto)}

.formulario-config{max-width:640px;background:#fff;border:1px solid var(--borda);border-radius:14px;padding:22px 24px}
.formulario-config__titulo{
  font-family:var(--montserrat);font-weight:800;font-size:14px;letter-spacing:.03em;
  color:var(--azul);text-transform:uppercase;margin:0 0 16px;
}
.interruptor{display:flex;align-items:center;gap:10px;margin:4px 0 14px;cursor:pointer}
.interruptor input{width:18px;height:18px;accent-color:var(--teal);cursor:pointer}
.interruptor span{font-size:13px;color:var(--texto)}

.carregando{
  min-height:60vh;display:flex;align-items:center;justify-content:center;
  font-size:14px;color:var(--cinza);
}

/* ------------------------------------------------------------- responsivo */

@media (max-width:900px){
  .grade--5,.grade--3,.indicadores{grid-template-columns:repeat(2,1fr)}
  .contatos__lista--3{grid-template-columns:1fr}
  .grade--foto{grid-template-columns:1fr}
  .faixa-id,.faixa-assinatura{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:760px){
  .pagina,.pagina--portal{padding:20px 12px}
  .folha{padding:20px 18px 18px;border-radius:16px}
  .folha__cabecalho{flex-direction:column;text-align:center}
  .folha__titulo,.folha__titulo--g{font-size:19px}
  .espaco-parceiro{display:none}
  .portal__grade,.grade--2,.grade--3,.grade--5,.grade--2-1,.grade--1-2,
  .grade--14-1,.grade--1-13,.grade--1-16,.indicadores,
  .faixa-info,.faixa-id,.faixa-assinatura{grid-template-columns:1fr}
  .portal__titulo{font-size:25px}
  .portal__cabecalho{margin-bottom:32px}
  .rodape-contatos{flex-direction:column;align-items:flex-start}
  .rodape-contatos__lista{flex-direction:column;gap:10px}
  .avaliacao__linha{align-items:flex-start}
  .contatos__item--email{grid-template-columns:34px 1fr}
  .painel__cabecalho{justify-content:center;text-align:center}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* ------------------------------------------------ confirmação de envio */

.sucesso{
  max-width:560px;margin:6vh auto;background:#fff;
  border:2px solid var(--sucesso);border-radius:20px;
  padding:40px 36px;text-align:center;
  box-shadow:0 8px 22px rgba(47,158,107,.12);
  animation:sucesso-entra 320ms var(--curva);
}
.sucesso:focus{outline:none}

@keyframes sucesso-entra{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:none}
}

.sucesso__marca{
  width:72px;height:72px;border-radius:50%;
  background:var(--sucesso-fundo);color:var(--sucesso);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 20px;
}
.sucesso__titulo{
  font-family:var(--montserrat);font-weight:900;font-size:22px;
  color:var(--azul);margin:0 0 10px;line-height:1.25;
}
.sucesso__texto{font-size:15px;color:var(--texto-medio);line-height:1.55;margin:0 0 22px}
.sucesso__texto b{color:var(--texto)}

.sucesso__dados{
  display:flex;justify-content:center;gap:14px;flex-wrap:wrap;
  margin:0 0 20px;padding:0;
}
.sucesso__dados > div{
  background:var(--cinza-campo);border:1px solid var(--borda);
  border-radius:12px;padding:10px 18px;min-width:140px;
}
.sucesso__dados dt{
  font-weight:700;font-size:11px;letter-spacing:.04em;
  color:var(--cinza);text-transform:uppercase;
}
.sucesso__dados dd{
  margin:3px 0 0;font-family:var(--montserrat);font-weight:800;
  font-size:15px;color:var(--azul);
}

.sucesso__nota{font-size:13px;color:var(--texto-suave);line-height:1.6;margin:0 0 24px}
.sucesso__acoes{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.sucesso__acoes .botao{text-decoration:none;display:inline-flex;align-items:center}

@media (max-width:520px){
  .sucesso{padding:32px 20px;margin:3vh auto}
  .sucesso__dados > div{flex:1 1 100%}
}

/* ------------------------------------ campos que a Life Laboral preenche */

/* <fieldset disabled> zera a aparência padrão; aqui ele é só um agrupador. */
fieldset.bloqueado{border:none;margin:0;padding:0;min-width:0;opacity:.72}
fieldset.bloqueado .entrada,
fieldset.bloqueado .selecao,
fieldset.bloqueado .area,
.campo--bloqueado .entrada,
.campo--bloqueado .selecao{
  background:var(--cinza-campo);border-style:dashed;color:var(--texto-suave);cursor:not-allowed;
}
.campo--bloqueado .selecao-caixa__seta{opacity:.5}
fieldset.bloqueado .selecao-caixa__seta{opacity:.5}

.campo__bloqueio,
.secao--bloqueada .secao__nota{
  font-weight:700;font-size:11px;letter-spacing:.03em;text-transform:uppercase;
  color:var(--teal-escuro);
}
.campo__bloqueio{display:block;margin-top:4px}
.secao--bloqueada .secao__nota{
  margin-left:auto;background:var(--teal-claro);border-radius:999px;padding:4px 12px;
}

/* ------------------------------------------------- rótulo + opções na linha */

.campo--linha{
  flex-direction:row;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;
}
.campo--linha > *{min-width:0}

.folha__empresa{
  display:inline-block;margin:6px 0 0;padding:4px 12px;
  background:var(--teal-claro);border-radius:999px;
  font-weight:700;font-size:12.5px;color:var(--teal-escuro);
}

/* --------------------------------- resposta renderizada (painel e impressão) */

.folha--resposta{max-width:100%;box-shadow:none}

.resposta-campo{padding:10px 0;border-bottom:1px solid var(--linha)}
.resposta-campo__rotulo{
  font-weight:700;font-size:11.5px;letter-spacing:.03em;
  color:var(--cinza);text-transform:uppercase;
}
.resposta-campo__valor{
  font-size:14px;color:var(--texto);margin-top:3px;line-height:1.5;white-space:pre-wrap;
}

.resposta-avaliacao{border-bottom:1px solid var(--linha)}
.resposta-avaliacao__linha{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding:10px 0;flex-wrap:wrap;
}
.resposta-avaliacao__texto{flex:1;min-width:220px}
.resposta-avaliacao__obs{
  font-size:12.5px;color:var(--texto);line-height:1.5;
  border-radius:8px;padding:8px 12px;margin:0 0 10px;white-space:pre-wrap;
}
.resposta-avaliacao__obs--nok{background:var(--erro-fundo)}
.resposta-avaliacao__obs--adq{background:var(--alerta-fundo)}
.resposta-avaliacao__obs--ok{background:var(--sucesso-fundo)}

/* Pílula sem input — a resposta já está decidida. */
.pilula--marcada{cursor:default}
.pilula--marcada.pilula--ok{border-color:var(--sucesso);background:var(--sucesso-fundo);color:var(--sucesso)}
.pilula--marcada.pilula--nok{border-color:var(--erro);background:var(--erro-fundo);color:var(--erro)}
.pilula--marcada.pilula--adq{border-color:var(--alerta);background:var(--alerta-fundo);color:var(--alerta)}

.resposta-anexos{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
.resposta-foto{margin:0;max-width:320px}
.resposta-foto img{
  width:100%;height:auto;display:block;
  border:1px solid var(--borda);border-radius:12px;
}
.resposta-foto figcaption{font-size:11.5px;color:var(--cinza);margin-top:4px}

/* ---------------------------------------------------------------- empresas */

.empresas{display:flex;flex-direction:column;gap:14px}

.empresa{
  background:#fff;border:1.5px solid var(--borda);border-radius:14px;overflow:hidden;
}
.empresa--inativa{opacity:.62}
.empresa__topo{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 18px;flex-wrap:wrap;
}
.empresa__identificacao{min-width:220px}
.empresa__nome{font-family:var(--montserrat);font-weight:800;font-size:15px;color:var(--azul);margin:0}
.empresa__meta{font-size:12.5px;color:var(--texto-suave);margin:2px 0 0}
.empresa__acoes{display:flex;gap:8px;flex-wrap:wrap}

.botao-mini{
  font-family:var(--mulish);font-weight:700;font-size:12.5px;
  color:var(--azul);background:#fff;border:1.5px solid var(--borda);
  border-radius:999px;padding:6px 14px;cursor:pointer;
  transition:border-color 150ms ease,background-color 150ms ease;
}
.botao-mini:hover{border-color:var(--teal);background:var(--teal-claro)}
.botao-mini--perigo{color:var(--erro)}
.botao-mini--perigo:hover{border-color:var(--erro);background:var(--erro-fundo)}

.links{border-top:1px solid var(--linha);padding:12px 18px;display:grid;gap:8px}
.link-publico{
  display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:10px;
}
.link-publico__nome{font-weight:700;font-size:12.5px;color:var(--texto)}
.link-publico__url{
  font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:12px;
  color:var(--texto-suave);background:var(--cinza-campo);
  border:1px solid var(--borda);border-radius:8px;padding:6px 10px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.link-publico__destino{font-size:11.5px;color:var(--cinza)}

.filtro{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.filtro label{font-weight:700;font-size:12.5px;color:var(--texto)}
.filtro .selecao{width:auto;min-width:220px}

.dialogo{
  border:none;border-radius:16px;padding:0;max-width:560px;width:calc(100% - 32px);
  box-shadow:0 24px 60px rgba(13,75,134,.22);
}
.dialogo::backdrop{background:rgba(18,35,46,.45)}
.dialogo__corpo{padding:22px 24px;display:flex;flex-direction:column;gap:14px}
.dialogo__titulo{
  font-family:var(--montserrat);font-weight:800;font-size:15px;
  color:var(--azul);text-transform:uppercase;letter-spacing:.03em;margin:0;
}
.dialogo__acoes{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}

@media (max-width:760px){
  .link-publico{grid-template-columns:1fr}
  .campo--linha{flex-direction:column;align-items:flex-start}
}

/* ---------------------------------------------------------------- impressão */

/* Impressão de uma resposta a partir do painel: some com todo o resto. */
body.imprimindo .painel__cabecalho,
body.imprimindo .abas,
body.imprimindo #lista-respostas,
body.imprimindo .barra-final,
body.imprimindo [data-painel]:not([data-painel="respostas"]){display:none !important}

@media print{
  body{background:#fff}
  .pagina{padding:0}
  .painel{padding:0;max-width:none}
  .resposta-foto{break-inside:avoid;max-width:260px}
  .resposta-campo,.resposta-avaliacao{break-inside:avoid}
  .folha{border:none;box-shadow:none;max-width:none;padding:0}
  .barra-final__acoes,.adicionar,.botao,.botao-admin{display:none !important}
  .bloco,.avaliacao,.tabela,.caixa,.contatos{break-inside:avoid}
  .secao{break-after:avoid}
}

.contador{
  margin:6px 0 0;font-size:12px;color:var(--texto-suave);text-align:right;
  font-variant-numeric:tabular-nums;
}
.contador[data-cheio="sim"]{color:#b45309;font-weight:600}