/*
 * TABELA (grades de dados)
 * Uso restrito a dados genuinamente tabulares (parcelas, reajustes),
 * onde colunas alinhadas ajudam a comparar valores. Listagens gerais
 * usam o componente de lista, não esta tabela.
 */

.table-wrap {
  overflow-x: auto;
}

.table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-sm);
}

/* Cabeçalho: rótulos discretos, alinhados à esquerda, divisor inferior. */
.table thead th {
  padding: var(--space-2) var(--space-3);
  text-align: left;
  font-weight: var(--weight-medium);
  color: var(--color-text-muted);
  border-bottom: var(--border-width) solid var(--color-border);
  white-space: nowrap;
}

/* Células: divisor sutil entre linhas. */
.table tbody td {
  padding: var(--space-3);
  border-bottom: var(--border-width) solid var(--color-border);
  color: var(--color-text);
  vertical-align: middle;
}

/* Última linha sem divisor, para não duplicar com a borda externa. */
.table tbody tr:last-child td {
  border-bottom: none;
}

/* Hover sutil na linha, para leitura. */
.table tbody tr:hover td {
  background-color: var(--color-hover);
}

/* Coluna de valores monetários: alinhada à ESQUERDA como as demais (padrão
   único), com dígitos tabulares (largura fixa por dígito) e sem quebra. */
.table__num {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* Link de registro na célula: herda a cor do texto, sublinha no hover. */
.table__link {
  color: var(--color-text);
  font-weight: var(--weight-medium);
  text-decoration: none;
}

.table__link:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Coluna de ações (menu): encostada à direita, sem quebrar. */
.table__actions {
  text-align: right;
  white-space: nowrap;
  width: 1%;
}

/* Célula com mídia + texto (ex.: miniatura do imóvel + endereço). */
.table-cell-media {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

/* Tabela dentro de um card sem padding: alinha 1ª/última coluna à borda. */
.card--table .table th:first-child,
.card--table .table td:first-child {
  padding-left: var(--space-5);
}

.card--table .table th:last-child,
.card--table .table td:last-child {
  padding-right: var(--space-5);
}

/* Tabela direto na página (sem card): 1ª/última coluna flush com a borda,
   alinhando com filtros/KPIs acima. */
.table-wrap > .table th:first-child,
.table-wrap > .table td:first-child {
  padding-left: 0;
}

.table-wrap > .table th:last-child,
.table-wrap > .table td:last-child {
  padding-right: 0;
}

/* Subtexto numa célula: detalhe secundário abaixo do valor principal
   (ex.: encargos de atraso somados ao valor da parcela). */
.table__sub {
  display: block;
  margin-top: 2px;
  font-size: var(--text-xs);
  color: var(--color-text-subtle);
}

/* Tabela com menus de ação (dropdown) por linha: no desktop o contêiner
   deixa o menu escapar (o overflow-x cortaria o painel flutuante). No mobile
   mantém a rolagem horizontal — lá as ações cabem na largura. */
@media (min-width: 768px) {
  .table-wrap--actions {
    overflow: visible;
  }
}
