/* ============================================================================
   tables.css — Reusable table styling + responsive wrapper (IAPrompt #33).
   ============================================================================ */
.wa-table { width: 100%; border-collapse: collapse; font-size: var(--wa-fs-sm); }
.wa-table thead th {
  text-align: left; padding: 0.5rem; border-bottom: 2px solid var(--wa-border);
  color: var(--wa-text-muted); font-weight: 700; white-space: nowrap;
}
.wa-table tbody td { padding: 0.5rem; border-bottom: 1px solid var(--wa-border-soft); vertical-align: top; }
.wa-table tbody tr:hover { background: var(--wa-surface-alt); }
.wa-table a { color: var(--wa-blue); text-decoration: none; }

/* Horizontal scroll wrapper so wide tables don't overflow on mobile. */
.wa-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.wa-table-empty { padding: 1.5rem; text-align: center; color: var(--wa-text-faint); }