//
// Basic Bootstrap table
//

.table {
  width: 100%;
  margin-bottom: $spacer;

  @include themes($table-theme-map, $create: parent) {
    color: themes-get-value("table-color");
    background-color: themes-get-value("table-bg");
  }

  th,
  td {
    padding: $table-cell-padding;
    vertical-align: top;
    border-top: $table-border-width solid;

    @include themes($table-theme-map, $create: parent) {
      border-top-color: themes-get-value("table-border-color");
    }
  }

  thead th {
    vertical-align: bottom;
    border-bottom: (2 * $table-border-width) solid;

    @include themes($table-theme-map, $create: parent) {
      border-bottom-color: themes-get-value("table-border-color");
    }
  }

  tbody + tbody {
    border-top: (2 * $table-border-width) solid;

    @include themes($table-theme-map, $create: parent) {
      border-top-color: themes-get-value("table-border-color");
    }
  }
}


//
// Condensed table w/ half padding
//

.table-sm {
  th,
  td {
    padding: $table-cell-padding-sm;
  }
}


// Border versions
//
// Add or remove borders all around the table and between all the columns.

.table-bordered {
  border: $table-border-width solid;

  @include themes($table-theme-map, $create: parent) {
    border-color: themes-get-value("table-border-color");
  }

  th,
  td {
    border: $table-border-width solid;

    @include themes($table-theme-map, $create: parent) {
      border-color: themes-get-value("table-border-color");
    }
  }

  thead {
    th,
    td {
      border-bottom-width: 2 * $table-border-width;
    }
  }
}

.table-borderless {
  th,
  td,
  thead th,
  tbody + tbody {
    border: 0;
  }
}

// Zebra-striping
//
// Default zebra-stripe styles (alternating gray and transparent backgrounds)

.table-striped {
  tbody tr:nth-of-type(#{$table-striped-order}) {

    @include themes($table-theme-map, $create: parent) {
      background-color: themes-get-value("table-accent-bg");
    }
  }
}


// Hover effect
//
// Placed here since it has to come after the potential zebra striping

.table-hover {
  tbody tr {
    @include hover() {
      @include themes($table-theme-map, $create: parent) {
        color: themes-get-value("table-hover-color");
        background-color: themes-get-value("table-hover-bg");
      }
    }
  }
}


// Table backgrounds
//
// Exact selectors below required to override `.table-striped` and prevent
// inheritance to nested tables.

@include theme-variant() {
  @include table-row-variant($color,  theme-color-level($value, $table-bg-level),  theme-color-level($value, $table-border-level));
}

@include themes($table-theme-map, $create: parent) {
  @include table-row-variant(active, themes-get-value("table-active-bg"));
  @include table-row-variant(selected, themes-get-value("table-active-bg"), themes-get-value("table-active-bg"));
}

// stylelint-disable-next-line no-duplicate-selectors
.table {
  tbody tr {
    &:focus {
      outline: 0;
      @include themes($table-theme-map, $create: parent) {
        color: themes-get-value("table-hover-color");
        background-color: themes-get-value("table-hover-bg");
      }
    }
  }
}


// Dark styles
//
// Same table markup, but inverted color scheme: dark background and light text.

// stylelint-disable-next-line no-duplicate-selectors
.table {
  .thead-dark {
    th {
      @include themes($table-theme-map) {
        color: themes-get-value("table-dark-color");
        background-color: themes-get-value("table-dark-bg");
        border-color: themes-get-value("table-dark-border-color");
      }
    }
  }

  .thead-light {
    th {
      @include themes($table-theme-map) {
        color: themes-get-value("table-head-color");
        background-color: themes-get-value("table-head-bg");
        border-color: themes-get-value("table-border-color");
      }
    }
  }
}

.table-dark {
  @include themes($table-theme-map) {
    color: themes-get-value("table-dark-color");
    background-color: themes-get-value("table-dark-bg");
  }

  th,
  td,
  thead th {
    @include themes($table-theme-map) {
      border-color: themes-get-value("table-dark-border-color");
    }
  }

  &.table-bordered {
    border: 0;
  }

  &.table-striped {
    tbody tr:nth-of-type(#{$table-striped-order}) {
      @include themes($table-theme-map) {
        background-color: themes-get-value("table-dark-accent-bg");
      }
    }
  }

  &.table-hover {
    tbody tr {
      @include hover() {
        @include themes($table-theme-map) {
          color: themes-get-value("table-dark-hover-color");
          background-color: themes-get-value("table-dark-hover-bg");
        }
      }
    }
  }
}


// Responsive tables
//
// Generate series of `.table-responsive-*` classes for configuring the screen
// size of where your table will overflow.

.table-responsive {
  @each $breakpoint in map-keys($grid-breakpoints) {
    $next: breakpoint-next($breakpoint, $grid-breakpoints);
    $infix: breakpoint-infix($next, $grid-breakpoints);

    &#{$infix} {
      @include media-breakpoint-down($breakpoint) {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;

        // Prevent double border on horizontal scroll due to use of `display: block;`
        > .table-bordered {
          border: 0;
        }
      }
    }
  }
}

.table-outline {
  border: 1px solid;

  @include themes($table-theme-map, $create: parent) {
    border-color: themes-get-value("table-border-color");
  }

  td {
    vertical-align: middle;
  }
}

.table-align-middle {

  td {
    vertical-align: middle;
  }
}

.table-clear {
  td {
    border: 0;
  }
}