/* ═══════════════════════════════════════════════════════════════════════════
   BLUE HORIZON DESIGN SYSTEM — components/table.css
   Version: 0.1.0 · Build: 2026-09-13 · Benötigt: tokens.css, base.css
   VENDORED — READ-ONLY.

   Ersetzt .data-table / .data-table-container / .table-container.
   Der Wrapper ist verbindlich: Tabellen scrollen horizontal in ihrem eigenen
   Container, die Seite selbst scrollt nie seitwärts.
   ═══════════════════════════════════════════════════════════════════════════ */

.bh-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--bh-border-subtle);
  border-radius: var(--bh-radius-xl);
  background: var(--bh-surface-1);
  -webkit-overflow-scrolling: touch;
}

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

.bh-table th,
.bh-table td {
  padding: var(--bh-space-3) var(--bh-space-4);
  text-align: left;
  vertical-align: middle;
}

.bh-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--bh-surface-3);
  color: var(--bh-text-muted);
  font-size: var(--bh-text-xs);
  font-weight: var(--bh-weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--bh-tracking-caps);
  white-space: nowrap;
  border-bottom: 1px solid var(--bh-border-subtle);
}

.bh-table tbody tr { border-top: 1px solid var(--bh-border-subtle); }
.bh-table tbody tr:first-child { border-top: 0; }
.bh-table tbody td { color: var(--bh-text-secondary); }

/* Zeilen bekommen nie einen Schatten — nur eine Fläche. */
.bh-table--hover tbody tr { transition: background var(--bh-transition); }
.bh-table--hover tbody tr:hover { background: var(--bh-surface-hover); }
.bh-table--hover tbody tr:active { background: var(--bh-surface-3); }

.bh-table tbody tr.is-selected { background: var(--bh-color-accent-soft); }
.bh-table tbody tr.is-disabled { color: var(--bh-text-muted); opacity: 0.6; }

.bh-table tbody tr:focus-visible {
  outline: var(--bh-focus-width) solid var(--bh-focus-color);
  outline-offset: calc(var(--bh-focus-offset) * -1);
}

/* Sortierbarer Kopf. */
.bh-table__sort {
  display: inline-flex;
  align-items: center;
  gap: var(--bh-space-1);
  background: none; border: 0; padding: 0;
  color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit;
  cursor: pointer;
}
.bh-table__sort:hover { color: var(--bh-text-secondary); }
.bh-table__sort:focus-visible {
  outline: var(--bh-focus-width) solid var(--bh-focus-color);
  outline-offset: var(--bh-focus-offset);
}
.bh-table__sort[aria-sort="ascending"],
.bh-table__sort[aria-sort="descending"] { color: var(--bh-color-accent); }

/* Spaltenhilfen. */
.bh-table__num    { text-align: right; font-variant-numeric: tabular-nums; font-family: var(--bh-font-mono); }
.bh-table__id     { font-family: var(--bh-font-mono); color: var(--bh-text-muted); white-space: nowrap; }
.bh-table__actions{ width: 1%; white-space: nowrap; text-align: right; }

.bh-table--compact th,
.bh-table--compact td { padding: var(--bh-space-2) var(--bh-space-3); }

.bh-table__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bh-space-3);
  padding: var(--bh-space-3) var(--bh-space-4);
  border-top: 1px solid var(--bh-border-subtle);
  color: var(--bh-text-muted);
  font-size: var(--bh-text-xs);
}