/* ============================================================================
 * Odahl — Tables
 * Data tables with hairline rules. Tabular numerals. No zebra striping.
 * Requires tokens.css.
 * ============================================================================ */

.odahl-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--seam);
  background: var(--bone-warm);
}
.odahl-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--body); font-size: var(--type-body-sm);
  color: var(--ink);
}
.odahl-table thead { background: var(--bone-deep); }
.odahl-table th {
  padding: 0.7rem 1rem; text-align: left;
  font-family: var(--display); font-style: italic;
  font-weight: 500; font-size: 0.82rem; color: var(--ink-mute);
  letter-spacing: 0.04em; text-transform: uppercase;
  border-bottom: 1px solid var(--seam);
  white-space: nowrap;
}
.odahl-table th[aria-sort] { cursor: pointer; user-select: none; }
.odahl-table th[aria-sort]:hover { color: var(--ink); }
.odahl-table th[aria-sort]::after {
  content: ''; display: inline-block; width: 0.7em; margin-left: 0.3em;
  opacity: 0.4;
}
.odahl-table th[aria-sort="ascending"]::after  { content: '▲'; opacity: 1; color: var(--aether-deep); }
.odahl-table th[aria-sort="descending"]::after { content: '▼'; opacity: 1; color: var(--aether-deep); }
.odahl-table td {
  padding: 0.7rem 1rem; border-bottom: 1px solid var(--seam);
  vertical-align: middle;
}
.odahl-table tr:last-child td { border-bottom: 0; }
.odahl-table tbody tr {
  transition: background var(--speed-quick) var(--ease-out);
}
.odahl-table tbody tr:hover { background: var(--aether-trace); }
.odahl-table tbody tr[aria-selected="true"] { background: var(--aether-trace); }

/* ── Number cell (right-aligned, mono, tabular) ────────────────────── */
.odahl-table .num {
  text-align: right;
  font-family: var(--mono); font-variant-numeric: tabular-nums;
  font-size: 0.86rem;
}

/* ── Density variants ──────────────────────────────────────────────── */
.odahl-table-compact th, .odahl-table-compact td { padding: 0.4rem 0.8rem; }
.odahl-table-compact { font-size: 0.85rem; }
.odahl-table-comfortable th, .odahl-table-comfortable td { padding: 1rem 1.2rem; }

/* ── Empty row (when no data, span across all columns) ─────────────── */
.odahl-table-empty td {
  padding: 2.5rem 1rem; text-align: center;
  font-family: var(--display); font-style: italic;
  font-size: 1rem; color: var(--ink-mute);
}

@media (prefers-reduced-motion: reduce) {
  .odahl-table tbody tr { transition: none; }
}