@layer atoms {
  .mobius-table {
    display: table;
    width: 100%;
    text-align: left;
    border-collapse: collapse;
    line-height: 1.7;
    box-sizing: border-box;
    text-indent: initial;
    border-spacing: 2px;
    border-color: var(--color-border-light);
  }

  .mobius-table__head {
    display: table-row-group;
    box-sizing: border-box;
    vertical-align: middle;
    border-color: inherit;
    font-weight: var(--font-weight-bold);
  }

  .mobius-table__head-cell {
    display: table-cell;
    font-weight: var(--font-weight-bold);
    box-sizing: border-box;
    vertical-align: baseline;
    padding-top: var(--size-xs);
    padding-bottom: var(--size-xs);
    padding-right: var(--size-lg);
    border-color: currentColor;
    border-width: var(--table-border-width);
    border-bottom-style: solid;
  }

  .mobius-table__body {
    display: table-row-group;
    box-sizing: border-box;
    vertical-align: middle;
    border-color: inherit;
  }

  .mobius-table__body-cell {
    display: table-cell;
    vertical-align: baseline;
    box-sizing: border-box;
    color: var(--color-text-medium);
    padding-top: var(--size-xs);
    padding-bottom: var(--size-xs);
    padding-right: var(--size-lg);
    border-color: var(--color-border-light);
    border-width: var(--table-border-width);
    border-bottom-style: solid;
  }

  .mobius-table__row {
    display: table-row;
  }
}
