[data-component="table"], .table-component {
  width: 100%;
  overflow: auto clip;

  [data-table="table"], .table {
    width: 100%;

    &[data-variant="min-width"] {
      min-width: 30rem;
    }
  }
}

[data-table="row"], .table-row {
  text-align: left;
  border: 0 transparent;
  border-bottom: 1px solid var(--_site-theme---table--row-border);
  background-color: var(--_site-theme---table--row-background);
  color: var(--_site-theme---table--row-text);

  &[data-variant="header"] {
    border-bottom-width: 2px;
    background-color: var(--_site-theme---table--header-background);
    color: var(--_site-theme---table--header-text);
  }

  &[data-variant="alt"] {
    background-color: var(--_site-theme---table--row-alt-background);
    color: var(--_site-theme---table--row-alt-text);
  }
}

[data-table="cell"], .table-cell {
  flex: 1;
  padding: 1rem;
  border: 0 transparent;
}