.table-full-width table {
  width: 100%;
}

.table-striped tr:nth-child(2n) {
  background-color: var(--color--gray-95);
}

@container (width < 20rem) {
  .table-stacked-20rem :where(th, td) {
    padding-block: var(--sp-xs);
    padding-inline-end: unset;
    border-block-end: unset;
  }
  .table-stacked-20rem th {
    display: none;
  }
  .table-stacked-20rem td {
    display: block;
  }
}

@container (width < 40rem) {
  .table-stacked-40rem :where(th, td) {
    padding-block: var(--sp-xs);
    padding-inline-end: unset;
    border-block-end: unset;
  }
  .table-stacked-40rem th {
    display: none;
  }
  .table-stacked-40rem td {
    display: block;
  }
}

@container (width < 60rem) {
  .table-stacked-60rem :where(th, td) {
    padding-block: var(--sp-xs);
    padding-inline-end: unset;
    border-block-end: unset;
  }
  .table-stacked-60rem th {
    display: none;
  }
  .table-stacked-60rem td {
    display: block;
  }
}

@container (width < 80rem) {
  .table-stacked-80rem :where(th, td) {
    padding-block: var(--sp-xs);
    padding-inline-end: unset;
    border-block-end: unset;
  }
  .table-stacked-80rem th {
    display: none;
  }
  .table-stacked-80rem td {
    display: block;
  }
}