/* ========================================================
   TABLES — Consistent data tables with mobile scroll
   ======================================================== */

.table-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  overflow: hidden;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-small);
}
.data-table th {
  text-align: left;
  padding: 0.75rem 1rem;
  font-size: var(--text-2xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
  background: var(--bg-alt);
  white-space: nowrap;
}
.data-table td {
  padding: 0.875rem 1rem;
  border-bottom: 1px solid var(--border);
  color: var(--fg-2);
  vertical-align: middle;
}
.data-table tr:last-child td { border-bottom: none; }
.data-table tr:hover td { background: var(--bg-alt); }

.table-img-thumb {
  width: 96px;
  height: 56px;
  overflow: hidden;
  border-radius: var(--r-sm);
  background: var(--bg-alt);
  border: 1px solid var(--border);
}
.table-img-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Mobile: allow horizontal scroll for wide tables */
@media (max-width: 768px) {
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .data-table { min-width: 600px; }
}