// Tables
// Beautiful data tables


// opinionated reset
th { text-align: left }

// standard
.table, .article table {

  font-variant-numeric: lining-nums tabular-nums; // wishful thinking
  width: 100%;
  border-collapse: collapse;

  tr {
    //background-color: var(--color-main-2);
  }
  tr.tri {
    background-color: var(--color-bg-1, var(--color-main-2));
    //border-radius: var(--border-radius-s); // needs to be on TD but only if...
    //background-color: var(--color-main-2);
    cursor: pointer;
    &:hover {
      background-color: var(--color-prime-1);
    }
  }

  td, th {
    vertical-align: middle;
    padding: var(--space-s);
    border: var(--space-px) solid;
    //border-color: var(--border-color, var(--color-main-5));
    border-color: var(--color-shadow-1);
  }

  &.bo-v {
    th, td {
      border-top: none;
      border-bottom: none;
      &:first-child { border-left: none }
      &:last-child  { border-right: none }
    }
  }
  &.bo-h {
    th, td {
      border-left: none;
      border-right: none;
    }
    tr:first-child { th, td { border-top: none } }
    tr:last-child  { th, td { border-bottom: none } }
  }
  &.bo-no { th, td { border: none } }

  // Styles
  &.auto  { width: auto; }
  &.fixed { table-layout: fixed; }

  // Spacing
  &.dense    {
    td, th { @include padding-fix(xs) } // MS Edge fix
  }
  &.space    {
    td, th { @include padding-fix(m) } // MS Edge fix
  }
}