/**
 * Chrome canônico de listas (Foto B — Relatórios → Tickets).
 * Contrato: degradê contínuo no cabeçalho/rodapé; células th transparentes;
 * altura thead = pager = 3.125rem; sort sem trocar fundo da célula.
 */
:root {
  --fd-list-thead-h: 3.125rem;
  --fd-list-pager-h: 3.125rem;
  --fd-list-thead-grad: linear-gradient(145deg, #163f9a 0%, #1a4db8 30%, #2f6fe0 64%, #5aa0ff 100%);
  --fd-list-thead-edge: inset 0 0.0625rem 0 rgba(255, 255, 255, 0.34), inset 0 -0.0625rem 0 rgba(8, 32, 90, 0.16);
}

/* Nublado — cabecalho e rodape de lista sao ESTRUTURA. Este e o unico
   ponto de troca: os escopos internos (.tickets-card, .clientes) apenas
   reexportam --fd-list-thead-grad, entao definir aqui alcanca todos. */
html[data-theme="cinza"] {
  --fd-list-thead-grad: linear-gradient(145deg, #333b45 0%, #3f4854 34%, #4a5462 68%, #57616f 100%);
  --fd-list-thead-edge: inset 0 0.0625rem 0 rgba(255, 255, 255, 0.14), inset 0 -0.0625rem 0 rgba(20, 24, 29, 0.30);
}

/* Banda sticky reutilizável (::before no scroll) — mesma cor da Foto B. */
.fd-list-thead-band::before {
  content: "";
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  display: block;
  height: var(--fd-list-thead-h, 3.125rem);
  margin-bottom: calc(-1 * var(--fd-list-thead-h, 3.125rem));
  pointer-events: none;
  background: var(--fd-list-thead-grad);
  box-shadow: var(--fd-list-thead-edge);
  border-radius: var(--fd-radius-card, 0.25rem) var(--fd-radius-card, 0.25rem) 0 0;
}