/* EVMS — tema FUSO (Website Standards Manual): branco dominante, Jaguar/Jumbo/Cool Gray, Crimson só em acções. */
:root {
  --jet: #191919;
  --jaguar: #262626;
  --jumbo: #7b7b7b;
  --cool: #8f98aa;
  --crimson: #e10202;
  --crimson-escuro: #b90000;
  --fundo: #f7f7f7;
  --linha: #e3e5ea;
  --branco: #ffffff;
  --ok: #1d7a3a;
  --ok-fundo: #e8f5ec;
  --aviso: #8a5a00;
  --aviso-fundo: #fff4dc;
  --erro: #b90000;
  --erro-fundo: #fff0f0;
  --info: #1f4f8a;
  --info-fundo: #eaf1fb;
  --raio: 6px;
  --sombra: 0 1px 2px rgba(0, 0, 0, .06), 0 2px 8px rgba(0, 0, 0, .04);
  font-family: Roboto, "Helvetica Neue", Arial, system-ui, sans-serif;
}
* { box-sizing: border-box; }
fieldset { min-width: 0; }
html, body { margin: 0; padding: 0; }
body { background: var(--fundo); color: var(--jaguar); font-size: 15px; line-height: 1.5; }
a { color: var(--jaguar); text-decoration: underline; text-decoration-color: var(--cool); }
a:hover { color: var(--crimson); }
h1, h2, h3 { color: var(--jet); line-height: 1.25; margin: 0 0 .6em; }
h1 { font-size: 1.6rem; font-weight: 500; }
h2 { font-size: 1.2rem; font-weight: 500; margin-top: 1.4em; }
h3 { font-size: 1rem; font-weight: 600; }
p { margin: 0 0 .8em; }
small, .muted { color: var(--jumbo); }
code, .codigo { font-family: "Roboto Mono", ui-monospace, Menlo, monospace; letter-spacing: .08em; }
hr { border: 0; border-top: 1px solid var(--linha); margin: 1.5rem 0; }

/* Layout interno: barra lateral + conteúdo */
.shell { display: grid; grid-template-columns: 240px minmax(0, 1fr); min-height: 100vh; }
.lateral { background: var(--jaguar); color: #fff; padding: 20px 0; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.lateral .logo { display: block; padding: 0 20px 18px; }
.lateral .logo img { height: 34px; }
.lateral nav a { display: block; color: #e6e8ec; text-decoration: none; padding: 9px 20px; border-left: 3px solid transparent; }
.lateral nav a:hover { background: #303030; color: #fff; }
.lateral nav a.activo { border-left-color: var(--crimson); background: #303030; color: #fff; }
.lateral .secao { color: var(--cool); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; padding: 16px 20px 6px; }
.lateral .utilizador { padding: 16px 20px; border-top: 1px solid #3a3a3a; margin-top: 16px; font-size: .85rem; color: var(--cool); }
.lateral .utilizador strong { color: #fff; display: block; font-weight: 500; }
.conteudo { padding: 28px 32px 60px; max-width: 1280px; width: 100%; min-width: 0; }
.topo { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.topo h1 { margin: 0; }
.menu-movel { display: none; }

/* Layout público (participante, tablet, entrar) */
.cabecalho { background: var(--branco); border-bottom: 1px solid var(--linha); }
.cabecalho .interior { max-width: 920px; margin: 0 auto; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cabecalho img { height: 30px; display: block; }
.cabecalho nav { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; font-size: .9rem; }
.publico { max-width: 920px; margin: 0 auto; padding: 24px 16px 60px; }
.estreito { max-width: 520px; margin: 0 auto; }
.tablet-faixa { background: var(--jaguar); color: #fff; text-align: center; font-size: .85rem; padding: 6px; }

/* Componentes */
.cartao { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); padding: 20px 22px; box-shadow: var(--sombra); margin-bottom: 18px; }
.cartao > h2:first-child, .cartao > h3:first-child { margin-top: 0; }
.grelha { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.grelha-2 { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.indicador { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px 16px; }
.indicador .valor { font-size: 1.8rem; font-weight: 500; color: var(--jet); }
.indicador .rotulo { color: var(--jumbo); font-size: .85rem; }
.linha-accoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.direita { margin-left: auto; }
.dados { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
.dados dt { color: var(--jumbo); }
.dados dd { margin: 0; }
.vazio { color: var(--jumbo); text-align: center; padding: 24px; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--jaguar); background: var(--branco); color: var(--jaguar); padding: 8px 16px; border-radius: var(--raio); font: inherit; font-weight: 500; cursor: pointer; text-decoration: none; min-height: 38px; }
.btn:hover { background: #f0f0f0; color: var(--jet); }
.btn-primario { background: var(--crimson); border-color: var(--crimson); color: #fff; }
.btn-primario:hover { background: var(--crimson-escuro); border-color: var(--crimson-escuro); color: #fff; }
.btn-perigo { border-color: var(--erro); color: var(--erro); }
.btn-perigo:hover { background: var(--erro-fundo); color: var(--erro); }
.btn-pequeno { padding: 4px 10px; min-height: 30px; font-size: .85rem; }
.btn-grande { padding: 12px 22px; font-size: 1.05rem; min-height: 48px; }
.btn[disabled], .btn:disabled { opacity: .45; cursor: not-allowed; }
.btn-link { background: none; border: 0; padding: 0; color: var(--jaguar); text-decoration: underline; cursor: pointer; font: inherit; min-height: 0; }

.estado { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .78rem; font-weight: 500; white-space: nowrap; background: #eef0f3; color: var(--jaguar); }
.estado.ok { background: var(--ok-fundo); color: var(--ok); }
.estado.aviso { background: var(--aviso-fundo); color: var(--aviso); }
.estado.erro { background: var(--erro-fundo); color: var(--erro); }
.estado.info { background: var(--info-fundo); color: var(--info); }

.mensagem { border-radius: var(--raio); padding: 10px 14px; margin-bottom: 14px; border: 1px solid; }
.mensagem.success { background: var(--ok-fundo); border-color: #b8dfc4; color: var(--ok); }
.mensagem.error { background: var(--erro-fundo); border-color: #f2c4c4; color: var(--erro); }
.mensagem.warning { background: var(--aviso-fundo); border-color: #f0d9a8; color: var(--aviso); }
.mensagem.info { background: var(--info-fundo); border-color: #c8d9f0; color: var(--info); }

table.tabela { width: 100%; border-collapse: collapse; background: var(--branco); }
.tabela th, .tabela td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--linha); vertical-align: top; }
.tabela th { font-weight: 500; color: var(--jumbo); font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; background: #fafafa; }
.tabela tr.destaque td { background: var(--aviso-fundo); }
.tabela tr.alerta td { background: var(--erro-fundo); }
.tabela-rolar { overflow-x: auto; border: 1px solid var(--linha); border-radius: var(--raio); }

form .campo { margin-bottom: 14px; }
label { display: block; font-weight: 500; margin-bottom: 4px; }
label.inline, .opcao label { display: inline; font-weight: 400; }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=time], input[type=number], input[type=search], select, textarea {
  width: 100%; padding: 8px 10px; border: 1px solid var(--cool); border-radius: var(--raio); font: inherit; color: var(--jaguar); background: #fff;
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--crimson); outline-offset: 0; border-color: var(--crimson); }
textarea { min-height: 80px; resize: vertical; }
.ajuda { color: var(--jumbo); font-size: .82rem; margin-top: 3px; }
.erro-campo { color: var(--erro); font-size: .85rem; margin-top: 3px; }
input.invalido, .invalido input { border-color: var(--erro); background: var(--erro-fundo); }
.campos { display: grid; gap: 0 16px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.opcao { display: flex; gap: 8px; align-items: flex-start; margin: 6px 0; }
.opcao input { margin-top: 4px; }
.filtros { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 14px; }
.filtros .campo { margin: 0; min-width: 150px; }
.contador { float: right; color: var(--jumbo); font-size: .8rem; font-weight: 400; }

/* Portaria */
.validacao input.codigo-grande { font-size: 1.8rem; letter-spacing: .2em; text-transform: uppercase; text-align: center; font-family: "Roboto Mono", ui-monospace, monospace; }
.resultado { border-radius: var(--raio); padding: 18px 20px; margin: 14px 0; border: 2px solid; }
.resultado.registada { border-color: var(--ok); background: var(--ok-fundo); }
.resultado.recusa, .resultado.erro { border-color: var(--erro); background: var(--erro-fundo); }
.resultado.ja_presente, .resultado.saida_tardia { border-color: #d4a017; background: var(--aviso-fundo); }
.resultado .nome { font-size: 1.9rem; font-weight: 500; color: var(--jet); line-height: 1.2; }
.resultado .empresa { font-size: 1.3rem; color: var(--jaguar); }
.resultado .titulo { font-size: 1.1rem; font-weight: 600; margin-bottom: 8px; }

/* Credencial */
.credencial { text-align: center; }
.credencial .qr svg { width: 230px; height: 230px; }
.credencial .codigo-credencial { font-size: 2rem; font-weight: 500; letter-spacing: .25em; font-family: "Roboto Mono", ui-monospace, monospace; }

/* Questionário e vídeo */
.pergunta { border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px 16px; margin-bottom: 12px; background: #fff; }
.pergunta.por-responder { border-color: #d4a017; }
.video-caixa video { width: 100%; max-height: 70vh; background: #000; border-radius: var(--raio); }
.progresso { height: 8px; background: var(--linha); border-radius: 4px; overflow: hidden; }
.progresso > div { height: 100%; background: var(--crimson); width: 0; transition: width .3s; }

/* Caixa de correio de desenvolvimento */
.email-corpo { white-space: pre-wrap; font-family: ui-monospace, Menlo, monospace; font-size: .85rem; background: #fafafa; border: 1px solid var(--linha); padding: 12px; border-radius: var(--raio); }
.dev-faixa { background: #fff4dc; color: var(--aviso); font-size: .8rem; padding: 4px 12px; text-align: center; border-bottom: 1px solid #f0d9a8; }
.dev-faixa a { color: var(--aviso); }

@media (max-width: 820px) {
  .shell { grid-template-columns: minmax(0, 1fr); }
  .lateral { position: static; height: auto; display: none; }
  .lateral.aberta { display: block; }
  .menu-movel { display: flex; align-items: center; justify-content: space-between; background: var(--jaguar); padding: 10px 16px; }
  .menu-movel img { height: 26px; }
  .menu-movel button { background: none; border: 1px solid var(--cool); color: #fff; border-radius: var(--raio); padding: 4px 10px; }
  .conteudo { padding: 18px 16px 50px; }
  .tabela th, .tabela td { padding: 7px 6px; }
}

@media print {
  .lateral, .menu-movel, .cabecalho, .nao-imprimir, .dev-faixa, .tablet-faixa { display: none !important; }
  .shell { display: block; }
  body { background: #fff; }
  .conteudo, .publico { padding: 0; max-width: none; }
  .cartao { box-shadow: none; border: 0; padding: 0; }
}

/* area: portaria, presentes, emergência, histórico e dashboard */
[hidden] { display: none !important; }
.portaria-camara { margin-top: 12px; }
.portaria-camara video { width: 100%; max-width: 420px; display: block; border-radius: var(--raio); background: #000; margin-bottom: 8px; }
.resultado .portaria-mensagem { font-size: 1.5rem; }
.portaria-anular, .portaria-tardia { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(0, 0, 0, .1); }
.portaria-anular summary { cursor: pointer; font-weight: 500; margin-bottom: 8px; }
.portaria-tardia input[type=time] { max-width: 180px; }
.portaria-tardia-linha { margin-top: 8px; }
.portaria-tardia-linha label { font-size: .8rem; font-weight: 400; }
.portaria-tardia-linha input[type=time] { max-width: 140px; margin-bottom: 4px; }
.portaria-alerta { display: block; white-space: normal; margin-bottom: 3px; }
.portaria-indicador-aviso { border-color: #d4a017; background: var(--aviso-fundo); }
.portaria-indicador-alerta { border-color: var(--erro); background: var(--erro-fundo); }
.portaria-total { font-size: 1.3rem; font-weight: 500; }
.portaria-grupo { margin-top: 18px; break-inside: avoid; }
.portaria-check { width: 90px; text-align: center; }
.portaria-separadores { display: flex; gap: 4px; border-bottom: 1px solid var(--linha); margin-bottom: 14px; }
.portaria-separadores a { padding: 8px 16px; text-decoration: none; border-bottom: 3px solid transparent; }
.portaria-separadores a.activo { border-bottom-color: var(--crimson); font-weight: 500; }
.portaria-participante { margin-bottom: 4px; }
.portaria-periodos { margin-right: 12px; }
.portaria-barras { list-style: none; padding: 0; margin: 0 0 12px; }
.portaria-barras li { display: grid; grid-template-columns: minmax(90px, 30%) 1fr auto; gap: 10px; align-items: center; margin: 5px 0; font-size: .9rem; }
.portaria-barra { background: var(--linha); border-radius: 3px; height: 12px; overflow: hidden; }
.portaria-barra > span { display: block; height: 100%; background: var(--jaguar); }
.portaria-barra-valor { color: var(--jumbo); white-space: nowrap; }
@media print { .portaria-emergencia .tabela th { background: #fff; } .tabela tr.destaque td { background: #fff; } }

/* area: visitas */
fieldset.pessoa { border: 1px solid var(--linha); border-radius: var(--raio); padding: 10px 14px 12px; margin: 0 0 12px; }
fieldset.pessoa legend { font-size: .8rem; padding: 0 4px; }
fieldset.pessoa.invalido { border-color: var(--erro); background: var(--erro-fundo); }
details.accao-convite { margin-top: 6px; }
details.accao-convite summary { cursor: pointer; text-decoration: underline; font-size: .85rem; }
details.accao-convite form { margin-top: 8px; min-width: 220px; }
.historico-visita { list-style: none; padding: 0; margin: 0; }
.historico-visita > li { padding: 8px 0; border-bottom: 1px solid var(--linha); }
.historico-visita ul { margin: 4px 0 0; padding-left: 18px; }

/* area: participante (convite, área, formação, credencial, tablet) */
.tablet-sair { display: flex; justify-content: flex-end; margin-bottom: 12px; }
.escolha-idioma { display: flex; gap: 12px; flex-wrap: wrap; }
.escolha-idioma .btn { flex: 1 1 160px; }
.texto-privacidade { max-height: 220px; overflow-y: auto; border: 1px solid var(--linha); border-radius: var(--raio); padding: 12px; background: #fafafa; font-size: .9rem; margin-bottom: 4px; }
.item-convite { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; padding: 12px 0; border-bottom: 1px solid var(--linha); }
.item-convite:last-child { border-bottom: 0; }
details.corrigir-email summary, details.recusa summary { cursor: pointer; }
details.corrigir-email form, details.recusa form { margin-top: 10px; }
.destaque-aviso { border-color: #f0d9a8; }
.perguntas-nav { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 14px; }
.perguntas-nav a { min-width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--cool); border-radius: var(--raio); text-decoration: none; background: #fff; }
.perguntas-nav a.respondida { background: var(--jaguar); color: #fff; border-color: var(--jaguar); }
.perguntas-nav a.por-responder { border-color: #d4a017; background: var(--aviso-fundo); }
fieldset.pergunta { min-width: 0; }
fieldset.pergunta legend { padding: 0 4px; }
.lista-credenciais { list-style: none; padding: 0; }
.lista-credenciais li { margin-bottom: 10px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.video-caixa .progresso { margin-top: 10px; }
.credencial .qr svg { max-width: 100%; height: auto; }

/* area: gestao (back-office do Administrador) */
summary.btn { list-style: none; }
summary.btn::-webkit-details-marker { display: none; }

/* area: ajustes finais */
.tabela-compacta th, .tabela-compacta td { padding: 7px 7px; font-size: .9rem; }
.tabela-compacta .portaria-tardia-linha { max-width: 170px; }
.tabela-compacta .portaria-tardia-linha .btn { white-space: normal; }