/* --------------------------------------------------------------------------
   AUDITORIA

   O que é próprio das telas de consulta da trilha. O esqueleto — cabeçalho, faixa de filtro,
   grid e os quatro estados — vem de `cadastro.css`, porque é o mesmo; aqui fica só o detalhe
   do ato, a marcação de risco e a cronologia.

   Nenhum valor literal: cor, espaço, raio e duração vêm de `design-system.css`.
   -------------------------------------------------------------------------- */

/* Período em vigor, sempre visível. A consulta nunca roda sem janela, e quem não sabe qual
   janela está valendo lê como ausência de resultado o que é só recorte. */
.wms-auditoria__janela {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-2);
  padding: var(--espaco-1) var(--espaco-3);
  border-radius: var(--raio-pilula);
  background: var(--cor-info-fundo);
  color: var(--cor-info);
  font-size: var(--fonte-tam-xs);
  font-weight: var(--fonte-peso-medio);
}

/* Os campos do filtro num bloco só, para o `Enter` ter um recipiente onde ser ouvido — e para a
   faixa quebrar linha pelos campos, deixando as ações sempre à direita. */
.wms-auditoria__filtros-completos {
  display: flex;
  align-items: flex-end;
  gap: var(--gap-campo);
  flex-wrap: wrap;
  flex: 1 1 auto;
}

.wms-auditoria__acoes-do-filtro {
  display: flex;
  align-items: center;
  gap: var(--espaco-2);
  margin-left: auto;
  align-self: flex-end;
}

/* --------------------------------------------------------------------------
   DETALHE DO ATO
   -------------------------------------------------------------------------- */

.wms-auditoria__detalhe {
  padding: var(--espaco-4);
  background: var(--cor-fundo-sutil);
}

.wms-auditoria__campos {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fonte-tam-sm);
}

.wms-auditoria__campos th {
  text-align: left;
  padding: var(--espaco-1) var(--espaco-3);
  color: var(--cor-texto-secundario);
  font-weight: var(--fonte-peso-medio);
  border-bottom: var(--borda-largura) solid var(--cor-borda);
}

.wms-auditoria__campos td {
  padding: var(--espaco-2) var(--espaco-3);
  border-bottom: var(--borda-largura) solid var(--cor-borda);
  vertical-align: top;
}

.wms-auditoria__campos tr:last-child td {
  border-bottom: none;
}

/* Anterior e novo lado a lado, distinguidos por mais do que a posição: quem lê a coluna sozinha
   — numa tela estreita, num leitor de tela — precisa saber qual é qual. */
.wms-auditoria__valor {
  font-family: var(--fonte-mono);
  font-size: var(--fonte-tam-xs);
  overflow-wrap: anywhere;
}

.wms-auditoria__valor--anterior {
  color: var(--cor-texto-secundario);
  text-decoration: line-through;
  text-decoration-color: var(--cor-texto-tenue);
}

.wms-auditoria__valor--novo {
  color: var(--cor-texto);
  font-weight: var(--fonte-peso-medio);
}

.wms-auditoria__valor--ausente {
  font-family: var(--fonte-base);
  font-style: italic;
  color: var(--cor-texto-tenue);
  text-decoration: none;
}

.wms-auditoria__motivo {
  margin-top: var(--espaco-3);
  padding: var(--espaco-2) var(--espaco-3);
  border-left: var(--espaco-1) solid var(--cor-aviso);
  background: var(--cor-aviso-fundo);
  color: var(--cor-texto);
  font-size: var(--fonte-tam-sm);
}

/* --------------------------------------------------------------------------
   AUTORIA E RISCO
   -------------------------------------------------------------------------- */

/* Operação sem autor é do sistema — carga inicial, job, migração. Nunca célula em branco: em
   branco parece dado perdido, e numa auditoria dado perdido é achado. */
.wms-auditoria__sistema {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-1);
  color: var(--cor-texto-secundario);
  font-style: italic;
}

/* Rótulo em texto além da cor, como todo status deste sistema. */
.wms-auditoria__risco {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-1);
  padding: var(--espaco-1) var(--espaco-2);
  border-radius: var(--raio-pilula);
  background: var(--cor-erro-fundo);
  color: var(--cor-erro);
  font-size: var(--fonte-tam-xs);
  font-weight: var(--fonte-peso-medio);
}

.wms-cadastro__linha--risco {
  box-shadow: inset var(--espaco-1) 0 0 0 var(--cor-erro);
}

/* Tentativas repetidas contra o mesmo login: é o padrão que denuncia força bruta, e ele só
   aparece quando a contagem está na linha. */
.wms-auditoria__repeticao {
  color: var(--cor-erro);
  font-weight: var(--fonte-peso-forte);
}

/* --------------------------------------------------------------------------
   CRONOLOGIA
   -------------------------------------------------------------------------- */

.wms-auditoria__cronologia {
  display: flex;
  flex-direction: column;
  gap: var(--espaco-1);
  margin: 0;
  padding: 0;
  list-style: none;
}

.wms-auditoria__entrada {
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: baseline;
  gap: var(--espaco-3);
  padding: var(--espaco-3) var(--espaco-4);
  border: var(--borda-largura) solid var(--cor-borda);
  border-radius: var(--raio-md);
  background: var(--cor-fundo-superficie);
  transition: background var(--transicao), box-shadow var(--transicao);
}

.wms-auditoria__entrada:hover {
  background: var(--cor-fundo-sutil);
  box-shadow: var(--sombra-1);
}

.wms-auditoria__entrada--risco {
  border-color: var(--cor-erro);
  background: var(--cor-erro-fundo);
}

.wms-auditoria__momento {
  font-family: var(--fonte-mono);
  font-size: var(--fonte-tam-xs);
  color: var(--cor-texto-secundario);
  white-space: nowrap;
}

.wms-auditoria__natureza {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-1);
  font-size: var(--fonte-tam-xs);
  color: var(--cor-texto-secundario);
}

.wms-auditoria__descricao {
  color: var(--cor-texto);
}

.wms-auditoria__detalhe-da-entrada {
  display: block;
  font-size: var(--fonte-tam-xs);
  color: var(--cor-texto-secundario);
}

@media (max-width: 48rem) {
  .wms-auditoria__entrada {
    grid-template-columns: 1fr;
    gap: var(--espaco-1);
  }
}

/* --------------------------------------------------------------------------
   HISTÓRICO DE UM REGISTRO
   -------------------------------------------------------------------------- */

.wms-auditoria__pagina {
  display: flex;
  flex-direction: column;
  gap: var(--espaco-5);
  padding: var(--espaco-5);
}

.wms-auditoria__ato {
  border: var(--borda-largura) solid var(--cor-borda);
  border-radius: var(--raio-lg);
  background: var(--cor-fundo-superficie);
  box-shadow: var(--sombra-1);
  overflow: hidden;
  transition: box-shadow var(--transicao);
}

.wms-auditoria__ato:hover {
  box-shadow: var(--sombra-2);
}

.wms-auditoria__ato-topo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--espaco-3);
  padding: var(--espaco-3) var(--espaco-4);
  border-bottom: var(--borda-largura) solid var(--cor-borda);
  background: var(--cor-fundo-sutil);
}

.wms-auditoria__ato-autor {
  margin-left: auto;
  font-size: var(--fonte-tam-sm);
  color: var(--cor-texto-secundario);
}

@media (prefers-reduced-motion: reduce) {
  .wms-auditoria__entrada,
  .wms-auditoria__ato {
    transition: none;
  }
}