/*
 * Checklist ESEN — protótipo (Etapa A)
 * telas/historico.css — #/historico (linha do tempo e serviços executados) e #/auditoria. Prefixo .historico-; só tokens.
 */

/* =========================================================================
   COMUNS
   ========================================================================= */
.historico-pessoa { font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); color: var(--cor-texto); }
.historico-pessoa .avatar { flex: none; }

.historico-nota { display: flex; align-items: flex-start; gap: var(--esp-1); }
.historico-nota .icone { flex: none; margin-top: 2px; width: 14px; height: 14px; color: var(--cor-texto-3); stroke-width: var(--traco-icone-status); }

/* Cabeçalho de dia: "Hoje 15/10/2026 ............ 12 registros" */
.historico-dia__cab {
  display: flex; align-items: baseline; gap: var(--esp-2);
  margin: 0; padding: var(--esp-4) var(--esp-4) var(--esp-2);
  font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); font-weight: var(--peso-forte); color: var(--cor-texto);
  border-bottom: var(--borda-largura) solid var(--cor-borda-sutil);
}
.historico-dia__data { font-weight: var(--peso-normal); color: var(--cor-texto-3); font-variant-numeric: tabular-nums; }
.historico-dia__total { margin-left: auto; font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-normal); color: var(--cor-texto-3); white-space: nowrap; }

.historico-rodape__info { font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); color: var(--cor-texto-2); }

/* =========================================================================
   REGISTROS — linha do tempo (hora · ícone · registro · usuário · serviço)
   ========================================================================= */
.historico-colunas { display: none; }
.historico-eventos { list-style: none; margin: 0; padding: 0; }
.historico-evento {
  display: grid; grid-template-columns: 48px 16px minmax(0, 1fr); align-items: start; gap: var(--esp-3);
  padding: var(--esp-3) var(--esp-4); border-bottom: var(--borda-largura) solid var(--cor-borda-sutil);
}
.historico-evento:focus-visible { outline-offset: -2px; }
.historico-dia:last-child .historico-evento:last-child { border-bottom: 0; }
.historico-evento__hora { font-family: var(--fonte-mono); font-variant-numeric: normal; font-size: var(--fs-codigo); line-height: var(--lh-corpo); color: var(--cor-texto-2); }
.historico-evento__icone { display: flex; margin-top: 2px; color: var(--cor-texto-3); }
.historico-evento__icone .icone { width: 16px; height: 16px; stroke-width: var(--traco-icone-status); }
.historico-evento__corpo { display: flex; flex-direction: column; gap: var(--esp-2); min-width: 0; }
.historico-evento__desc { min-width: 0; }
.historico-evento__titulo { font-size: var(--fs-corpo); line-height: var(--lh-corpo); font-weight: var(--peso-forte); color: var(--cor-texto); }
.historico-evento__texto { font-size: var(--fs-corpo); line-height: var(--lh-corpo); color: var(--cor-texto-2); overflow-wrap: anywhere; }
.historico-evento__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-1) var(--esp-5); min-width: 0; }
.historico-evento__pessoa { display: inline-flex; min-width: 0; max-width: 100%; }
.historico-evento__servico { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0 var(--esp-2); min-width: 0; font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-texto-2); }
.historico-evento__servico-l1 { display: inline-flex; align-items: center; gap: var(--esp-2); min-width: 0; }
.historico-evento__tipo { display: inline-flex; align-items: center; gap: var(--esp-1); color: var(--cor-texto-2); white-space: nowrap; }
.historico-evento__tipo .icone { flex: none; color: var(--cor-texto-3); }
.historico-evento__local { min-width: 0; overflow-wrap: anywhere; }
.historico-evento__local::before { content: "·"; margin-right: var(--esp-2); color: var(--cor-texto-3); }

@media (min-width: 1200px) {
  .historico-colunas {
    display: grid; grid-template-columns: 48px 16px minmax(0, 1fr) 184px minmax(0, 300px); align-items: center; gap: var(--esp-3);
    height: var(--altura-cabecalho-tabela); padding: 0 var(--esp-4);
    font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-forte); color: var(--cor-texto-2);
    border-bottom: var(--borda-largura) solid var(--cor-borda);
  }
  .historico-evento__corpo { display: grid; grid-template-columns: minmax(0, 1fr) 184px minmax(0, 300px); align-items: start; gap: var(--esp-3); }
  .historico-evento__meta { display: contents; }
  .historico-evento__pessoa { padding-top: 0; }
  .historico-evento__pessoa .pessoa { max-width: 100%; }
  .historico-evento__servico { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
  .historico-evento__local { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .historico-evento__local::before { content: none; }
}

/* =========================================================================
   SERVIÇOS EXECUTADOS — tabela agrupada por dia (desktop) e lista (toque)
   ========================================================================= */
.historico-tabela .historico-col-hora { width: 72px; }
.historico-tabela .historico-col-servico { width: 148px; }
.historico-tabela .historico-col-func { width: 168px; }
.historico-tabela .historico-col-situacao { width: 152px; }
.historico-tabela .historico-col-nc { width: 52px; }
.historico-tabela .historico-col-rel { width: 124px; }
.historico-tabela .historico-col-acoes { width: 52px; }
.historico-tabela tbody td { padding-top: var(--esp-2); padding-bottom: var(--esp-2); }
.historico-hora { font-family: var(--fonte-mono); font-variant-numeric: normal; font-size: var(--fs-codigo); color: var(--cor-texto-2); }
.historico-tipo { display: inline-flex; align-items: center; gap: var(--esp-1); }
.historico-tipo .icone { flex: none; color: var(--cor-texto-3); }
.historico-situacao { display: flex; flex-direction: column; align-items: flex-start; gap: var(--esp-1); }
@media (min-width: 1440px) {
  /* Largo: situação e resultado lado a lado (linha mais baixa). */
  .historico-tabela .historico-col-situacao { width: 252px; }
  .historico-situacao { flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--esp-1) var(--esp-2); }
}
.historico-situacao__sec { max-width: 100%; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-2); }
.historico-tabela abbr { text-decoration: none; cursor: help; }

/* Linha de grupo (dia) dentro da tabela */
.historico-tabela tbody tr.historico-tabela__dia:hover { background: transparent; }
.historico-tabela tbody tr.historico-tabela__dia > th { height: auto; padding: 0; border-bottom: 0; text-align: left; font-weight: var(--peso-normal); }
.historico-tabela tbody:first-of-type tr.historico-tabela__dia .historico-dia__cab { padding-top: var(--esp-3); }
.historico-tabela tbody + tbody tr.historico-tabela__dia > th { border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.historico-tabela tbody tr:last-child td { border-bottom: 0; }

.historico-badges { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2); min-width: 0; }
.historico-linha-hora { display: inline-flex; align-items: center; gap: var(--esp-2); margin-left: auto; white-space: nowrap; font-variant-numeric: tabular-nums; }
.historico-linha-motivo { font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-texto-2); overflow-wrap: anywhere; }
.historico-lado-func { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--cor-texto); }
@media (min-width: 768px) { .historico-linha-hora { display: none; } }

/* =========================================================================
   AUDITORIA
   ========================================================================= */
.historico-aud-tabela .historico-aud-c-data { width: 148px; }
.historico-aud-tabela .historico-aud-c-usuario { width: 184px; }
.historico-aud-tabela .historico-aud-c-acao { width: 204px; }
.historico-aud-tabela .historico-aud-c-ent { width: 96px; }
.historico-aud-tabela .historico-aud-c-ident { width: 148px; }
.historico-aud-tabela .historico-aud-c-abrir { width: 48px; }
.historico-aud-tabela tbody tr { cursor: pointer; }
.historico-aud-data { font-variant-numeric: tabular-nums; color: var(--cor-texto); }
.historico-acao { display: inline-flex; align-items: center; gap: var(--esp-2); max-width: 100%; min-width: 0; vertical-align: middle; }
.historico-acao > .icone { flex: none; stroke-width: var(--traco-icone-status); }
/* Cor de família só em conclusão, cancelamento e falhas (design system 9.30); demais ações em texto-3. */
.historico-acao > .icone:not(.icone--sucesso):not(.icone--perigo):not(.icone--neutro):not(.icone--processo) { color: var(--cor-texto-3); }
.historico-acao > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.historico-aud-ident { display: flex; flex-direction: column; min-width: 0; }
.historico-aud-ident > * { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.historico-aud-ident__ent { display: none; font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-3); }
.historico-ident { max-width: 100%; }

/* Notebook (1024–1199): a coluna Entidade vira linha secundária do identificador. */
@media (min-width: 1024px) and (max-width: 1199px) {
  .historico-aud-tabela .historico-aud-c-ent { width: 0; }
  .historico-aud-tabela .historico-aud-col-ent { padding: 0; visibility: hidden; }
  .historico-aud-tabela .historico-aud-c-usuario { width: 168px; }
  .historico-aud-tabela .historico-aud-c-acao { width: 196px; }
  .historico-aud-tabela .historico-aud-c-ident { width: 140px; }
  .historico-aud-tabela tbody td { height: var(--altura-linha-tabela-dupla); }
  .historico-aud-ident__ent { display: block; }
  .historico-tabela .historico-col-func { width: 140px; }
  .historico-tabela .historico-col-servico { width: 140px; }
}

/* Ordenação no toque */
.historico-ordem {
  display: flex; align-items: center; justify-content: space-between; gap: var(--esp-3);
  min-height: var(--alvo-minimo); padding: var(--esp-1) var(--esp-2) var(--esp-1) var(--esp-4);
  border-bottom: var(--borda-largura) solid var(--cor-borda-sutil);
}
.historico-ordem__texto { display: inline-flex; align-items: center; gap: var(--esp-2); min-width: 0; font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); color: var(--cor-texto); }
.historico-ordem__texto .icone { flex: none; color: var(--cor-destaque); stroke-width: var(--traco-icone-status); }
.historico-ordem__texto strong { font-weight: var(--peso-forte); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.historico-ordem .btn { flex: none; }

.historico-aud-linha .linha__titulo { display: flex; }
.historico-aud-linha__detalhe { font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-texto-2); }

/* Gaveta do registro */
.historico-reg__cab { display: flex; align-items: flex-start; gap: var(--esp-3); }
.historico-reg__icone { display: flex; flex: none; align-items: center; justify-content: center; width: 40px; height: 40px; border: var(--borda-largura) solid var(--cor-borda); border-radius: var(--raio-2); background: var(--cor-superficie-2); color: var(--cor-texto-2); }
.historico-reg__titulos { min-width: 0; }
.historico-reg__titulo { font-size: var(--fs-secao); line-height: var(--lh-secao); font-weight: var(--peso-forte); }
.historico-reg__sub { font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-texto-2); }
.historico-reg__valor { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
.historico-reg__sec { font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-3); overflow-wrap: anywhere; }
.historico-reg .ficha dd { overflow-wrap: anywhere; }
.historico-reg__nota { display: flex; align-items: flex-start; gap: var(--esp-2); }
.historico-reg__nota .icone { flex: none; margin-top: 1px; stroke-width: var(--traco-icone-status); }
.historico-reg__rel { display: grid; gap: var(--esp-2); padding-top: var(--esp-4); border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
/* Sem agrupamento por dia a linha do tempo mostra a data completa (dd/mm/aaaa) na primeira coluna. */
.historico-reg__rel .linha-tempo__evento { grid-template-columns: 88px 16px minmax(0, 1fr); }
@media (max-width: 1023px) { .historico-reg__rel .linha-tempo__evento { grid-template-columns: 96px 20px minmax(0, 1fr); } }

/* =========================================================================
   TOQUE (< 1024) e CELULAR (< 768)
   ========================================================================= */
@media (max-width: 1023px) {
  .historico-pessoa { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
  .historico-dia__cab { font-size: var(--fs-rotulo-toque); line-height: var(--lh-rotulo-toque); }
  .historico-dia__total { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
  .historico-rodape__info { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
  .historico-evento { grid-template-columns: 48px 20px minmax(0, 1fr); }
  .historico-evento__hora { font-size: var(--fs-legenda-toque); line-height: 22px; }
  .historico-evento__icone .icone { width: 20px; height: 20px; }
  .historico-evento__titulo, .historico-evento__texto { font-size: 15px; line-height: 22px; }
  .historico-evento__servico, .historico-linha-motivo, .historico-aud-linha__detalhe { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
  .historico-reg__sub { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
  .historico-reg__sec { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
}

@media (max-width: 767px) {
  .historico-evento { gap: var(--esp-2) var(--esp-3); padding: var(--esp-3) var(--esp-4); grid-template-columns: 44px 20px minmax(0, 1fr); }
  .historico-evento__meta { flex-direction: column; align-items: flex-start; gap: var(--esp-1); }
  .historico-evento__servico { flex-direction: column; align-items: flex-start; gap: 2px; }
  .historico-evento__local::before { content: none; }
  .historico-rodape { flex-direction: column; align-items: stretch; padding: var(--esp-3) var(--esp-4); }
  .historico-rodape .btn { width: 100%; }
  .historico-reg .ficha { grid-template-columns: minmax(0, 1fr); }
}