/* =========================================================================
   Histórico de SG e Over — estilos específicos
   Reaproveita: especialistas.ui.css (.card/.card-h/.badge), index.css
   (.card.app-card, ponto ●, .table-wrap), cruzamento.css (.xfilters, .seg)
   ========================================================================= */

/* Grade dos blocos de filtro (Visão | Janela) lado a lado */
.hsg-filtergrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, max-content));
  gap: 12px;
  align-items: start;
}
.hsg-filtergrid .seg { margin-top: 2px; }

/* Cabeçalho do card da tabela (título + subtítulo empilhados) */
.hsg-headtexts { min-width: 0; }
.hsg-headtexts .card-head-sub { margin-top: 2px; }

/* -------------------------------------------------------------------------
   TABELA
   ------------------------------------------------------------------------- */
/* Coluna "Time" fixa à esquerda */
#hsgWrap table.sheet th:first-child,
#hsgWrap table.sheet td:first-child {
  position: sticky; left: 0; z-index: 20;
  text-align: left; min-width: 150px;
  box-shadow: 1px 0 0 rgba(15, 23, 42, 0.06);
}
#hsgWrap table.sheet thead th:first-child { z-index: 40; }

/* Colunas numéricas com largura IGUAL e valores centralizados */
#hsgWrap table.sheet th:not(:first-child),
#hsgWrap table.sheet td:not(:first-child) {
  width: 88px; min-width: 88px; max-width: 88px;
  text-align: center;
}
/* Cabeçalhos podem quebrar em 2 linhas para não espremer a coluna */
#hsgWrap table.sheet thead th:not(:first-child) {
  white-space: normal;
  line-height: 1.15;
}

#hsgWrap table.sheet thead th { cursor: help; }

/* Heatmap por célula (cor preenche a célula, como na referência) */
#hsgWrap table.sheet td.hm { font-weight: 700; text-align: center; color: #1f2937; }
body.dark #hsgWrap table.sheet td.hm { color: #10202f; }
#hsgWrap table.sheet td.hsg-strong { font-weight: 800; }
#hsgWrap table.sheet td.hsg-plain { text-align: center; color: var(--muted); font-weight: 700; }

.hsg-team { font-weight: 700; line-height: 1.15; }
.hsg-team small { display: block; color: var(--muted); font-weight: 600; font-size: 10.5px; letter-spacing: .04em; }

.hsg-state { padding: 26px 8px; text-align: center; color: var(--muted); font-size: 13px; }

/* -------------------------------------------------------------------------
   TOOLTIP FLUTUANTE (colunas)
   ------------------------------------------------------------------------- */
.hsg-tip {
  position: fixed; z-index: 9999; max-width: 240px;
  background: #0f172a; color: #f8fafc;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px; padding: 8px 11px;
  font-size: 12px; line-height: 1.45; font-weight: 500;
  box-shadow: 0 10px 30px rgba(2, 6, 23, .35);
  pointer-events: none; opacity: 0; transform: translateY(4px);
  transition: opacity .12s ease, transform .12s ease;
}
.hsg-tip.is-open { opacity: 1; transform: translateY(0); }
.hsg-tip strong { color: #fdba74; font-weight: 800; display: block; margin-bottom: 2px; }

/* -------------------------------------------------------------------------
   RESPONSIVO
   ------------------------------------------------------------------------- */
@media (max-width: 760px) {
  .hsg-filtergrid { grid-template-columns: 1fr; }
  .hsg-filtergrid .seg { flex-wrap: wrap; }
  .hsg-filtergrid .seg-btn { flex: 1 1 auto; text-align: center; }

  #hsgWrap table.sheet th:first-child,
  #hsgWrap table.sheet td:first-child { min-width: 120px; }
  .hsg-team small { display: none; }
  #hsgWrap table.sheet th, #hsgWrap table.sheet td { padding: 8px 9px; }
  #hsgWrap table.sheet th:not(:first-child),
  #hsgWrap table.sheet td:not(:first-child) { width: 66px; min-width: 66px; max-width: 66px; }
}

@media (max-width: 420px) {
  #hsgWrap table.sheet th:first-child,
  #hsgWrap table.sheet td:first-child { min-width: 104px; }
}