/* Adapt to the available article width, including narrow desktop panels. */
html body .responsive-table-container {
  --table-ink: var(--accent-ink, var(--ink, #153e35));
  --table-pale: var(--pale, var(--ice, #f0f5f2));
  container-type: inline-size;
  container-name: data-table;
  width: 100%; max-width: 100%; min-width: 0;
}
html body .article-body { min-width: 0; width: 100%; max-width: 100%; }
html body :is(.table-scroll,.tablewrap,.local-evidence-scroll,.company-table-scroll) {
  min-width: 0; max-width: 100%; box-sizing: border-box;
}
html body table.responsive-data-table[data-responsive-table] {
  width: 100%; min-width: 0; max-width: 100%; table-layout: fixed;
}
html body table.responsive-data-table[data-responsive-table] :is(th,td) {
  min-width: 0; white-space: normal; overflow-wrap: anywhere;
}
html body table.responsive-data-table[data-responsive-table] tbody th {
  color: var(--table-ink); background: var(--table-pale);
}
html body table.responsive-data-table[data-responsive-table] .table-cell-label { display: none; }

/* A row becomes a labelled card. Keep the column headers in the accessibility tree. */
@container data-table (max-width: 700px) {
  html body table.responsive-data-table[data-responsive-table] { display: block; }
  html body table.responsive-data-table[data-responsive-table] caption {
    display: block; width: 100%; padding: 16px; box-sizing: border-box;
    white-space: normal; color: var(--table-ink); background: var(--table-pale);
  }
  html body table.responsive-data-table[data-responsive-table] thead {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap;
  }
  html body table.responsive-data-table[data-responsive-table] tbody { display: block; padding: 0; }
  html body table.responsive-data-table[data-responsive-table] tbody tr {
    display: block; width: 100%; border: 0; border-radius: 0; background: #fff;
    padding: 0; margin: 0; overflow: visible;
  }
  html body table.responsive-data-table[data-responsive-table] tbody tr + tr { border-top: 3px solid var(--line,#d7e0da); }
  html body table.responsive-data-table[data-responsive-table] tbody tr > :is(td,th) {
    display: block; width: 100% !important; min-width: 0 !important;
    padding: 14px 16px; box-sizing: border-box; text-align: left;
    border: 0 !important; border-bottom: 1px solid var(--line,#d7e0da) !important;
    font-size: 16px !important; line-height: 1.6; color: var(--table-ink); background: #fff;
  }
  html body table.responsive-data-table[data-responsive-table] tbody tr > :first-child {
    background: var(--table-pale); font-weight: 700;
  }
  html body table.responsive-data-table[data-responsive-table] tbody tr > :last-child { border-bottom: 0 !important; }
  html body table.responsive-data-table[data-responsive-table] .table-cell-label {
    display: block; font-weight: 700; font-size: 12px; line-height: 1.4;
    letter-spacing: .035em; text-transform: uppercase; margin: 0 0 5px;
    color: var(--table-ink); opacity: .85;
  }
  html body table.responsive-data-table[data-responsive-table] :is(td,th)::before { content: none; }
}

/* Company comparisons need the same treatment earlier because they have five columns. */
@container data-table (min-width: 701px) and (max-width: 960px) {
  html body table.responsive-data-table[data-responsive-table="wide"] { display: block; }
  html body table.responsive-data-table[data-responsive-table="wide"] caption { display: block; width: 100%; padding: 16px; box-sizing: border-box; }
  html body table.responsive-data-table[data-responsive-table="wide"] thead { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  html body table.responsive-data-table[data-responsive-table="wide"] tbody { display: block; padding: 0; }
  html body table.responsive-data-table[data-responsive-table="wide"] tbody tr { display: block; border: 0; border-radius: 0; padding: 0; margin: 0; background: #fff; }
  html body table.responsive-data-table[data-responsive-table="wide"] tbody tr + tr { border-top: 3px solid var(--line,#d7e0da); }
  html body table.responsive-data-table[data-responsive-table="wide"] tbody tr > :is(th,td) { display: block; width: 100% !important; min-width: 0 !important; padding: 14px 16px; box-sizing: border-box; border: 0 !important; border-bottom: 1px solid var(--line,#d7e0da) !important; font-size: 16px !important; line-height: 1.6; color: var(--table-ink); background: #fff; }
  html body table.responsive-data-table[data-responsive-table="wide"] tbody tr > :first-child { background: var(--table-pale); font-weight: 700; }
  html body table.responsive-data-table[data-responsive-table="wide"] tbody tr > :last-child { border-bottom: 0 !important; }
  html body table.responsive-data-table[data-responsive-table="wide"] .table-cell-label { display: block; font-weight: 700; font-size: 12px; line-height: 1.4; text-transform: uppercase; margin: 0 0 5px; color: var(--table-ink); opacity: .85; }
}
