/**
 * Engineer Tsai — Responsive table styles (frontend)
 * Version: 0.1.1
 *
 * Targets `.is-responsive-table` on the Gutenberg figure wrapper.
 * `.has-3-columns` and `.has-4-columns` set the minimum scroll width so
 * columns stay readable on narrow mobile viewports without word breaking.
 */

/* ── Scrollable wrapper ─────────────────────────────────────────────────── */

figure.wp-block-table.is-responsive-table,
.wp-block-table.is-responsive-table {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}

/* Contain within theme article columns (flex/grid children need min-width: 0) */

.entry-content > figure.wp-block-table.is-responsive-table,
.entry-content > .wp-block-table.is-responsive-table,
.ast-article-single .entry-content > figure.wp-block-table.is-responsive-table,
.ast-article-single .entry-content > .wp-block-table.is-responsive-table,
.site-content .entry-content > figure.wp-block-table.is-responsive-table,
.site-content .entry-content > .wp-block-table.is-responsive-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* ── Table layout ───────────────────────────────────────────────────────── */

figure.wp-block-table.is-responsive-table table,
.wp-block-table.is-responsive-table table {
  width: max-content;
  min-width: 100%;
  max-width: none;
  table-layout: auto;
}

/* ── Column-count minimum widths ────────────────────────────────────────── */

.wp-block-table.has-3-columns table {
  min-width: 720px;
}

.wp-block-table.has-4-columns table {
  min-width: 920px;
}

/* ── Cell readability ───────────────────────────────────────────────────── */

.wp-block-table.is-responsive-table th,
.wp-block-table.is-responsive-table td {
  word-break: normal;
  overflow-wrap: normal;
  hyphens: manual;
  vertical-align: top;
  min-width: 110px;
}
