/**
 * Content tables — subtle polish on top of Olivero defaults.
 *
 * Goals:
 * - Fit page rhythm (Olivero spacing + neutrals)
 * - Centered table block, no row rules
 * - No horizontal page scroll on narrow viewports
 * - Match editor preview (.cke_editable)
 */

.text-content table,
.cke_editable table {
  width: fit-content;
  max-width: 100%;
  margin-block: var(--sp1-5);
  margin-inline: auto;
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  table-layout: auto;
  color: var(--color-text-neutral-medium);
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: var(--sp1-5);
}

.text-content table caption,
.cke_editable table caption {
  margin-block-end: var(--sp0-5);
  text-align: center;
  color: var(--color-text-neutral-medium);
  font-family: var(--font-serif);
  font-size: 0.875rem;
  font-style: italic;
}

.text-content table th,
.cke_editable table th,
.text-content table td,
.cke_editable table td {
  padding-block: var(--sp0-75);
  padding-inline: var(--sp1) var(--sp1-5);
  vertical-align: top;
  text-align: start;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
  border: 0;
  border-block-end: 0;
}

.text-content table th,
.cke_editable table th {
  color: var(--color-text-neutral-loud);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Narrow screens: stack cells so 2-column “list” tables don’t overflow. */
@media (max-width: 43.74rem) {
  .text-content table,
  .cke_editable table,
  .text-content table thead,
  .cke_editable table thead,
  .text-content table tbody,
  .cke_editable table tbody,
  .text-content table tfoot,
  .cke_editable table tfoot,
  .text-content table tr,
  .cke_editable table tr,
  .text-content table th,
  .cke_editable table th,
  .text-content table td,
  .cke_editable table td {
    display: block;
    width: 100%;
    max-width: 100%;
  }

  .text-content table,
  .cke_editable table {
    width: 100%;
  }

  .text-content table tr,
  .cke_editable table tr {
    padding-block: var(--sp0-5);
    border: 0;
  }

  .text-content table th,
  .cke_editable table th,
  .text-content table td,
  .cke_editable table td {
    padding-block: var(--sp0-25);
    padding-inline: 0;
    border: 0;
  }

  /* Soft visual cue when a row had multiple columns. */
  .text-content table td + td,
  .cke_editable table td + td,
  .text-content table th + th,
  .cke_editable table th + th,
  .text-content table th + td,
  .cke_editable table th + td,
  .text-content table td + th,
  .cke_editable table td + th {
    margin-block-start: var(--sp0-25);
  }
}