//
// Tables
// --------------------------------------------------


.table {
  th {
    color: $gray-dark;
    font-weight: bold;
    font-size: 90%;
    position: relative;
    z-index: 2;
  }
}

.table {
  > thead,
  > tbody,
  > tfoot {
    > tr {
      > th {
        border-bottom: 1px solid $gray-light;
      }
      &:first-of-type {
        > td {
          border-top: none;
        }
      }
    }
  }
}

.table-striped {
  > tbody > tr:nth-child(odd) {
    background-color: $table-bg;
  }

  > tbody > tr:nth-child(even) {
    background-color: $table-bg-accent;
  }
}

.table-bordered {
  border: none;
  border-collapse: separate;

  td {
    border-top: none !important;
  }

  th:not(:last-of-type),
  td:not(:last-of-type) {
    border-right: none !important;
  }

  > thead:first-child {
    > tr:first-child {
      > th {
        border-top: 1px solid $table-border-color;

        &:first-of-type {
          border-top-left-radius: $border-radius-base;
        }

        &:last-of-type {
          border-top-right-radius: $border-radius-base;
        }
      }
    }
  }

  > tbody,
  > tfoot {
    > tr:last-child {
      > td {
        &:first-of-type {
          border-bottom-left-radius: $border-radius-base;
        }

        &:last-of-type {
          border-bottom-right-radius: $border-radius-base;
        }
      }
    }
  }
}

.table-responsive,
.editable-table-component.table-responsive {
  border: none;
}

@include purple-table-row-variant('active', lighten($table-bg-active, 7.5%), $gray-dark);
@include purple-table-row-variant('success', $state-success-bg, shade($state-success-text, 15%));
@include purple-table-row-variant('info', $state-info-bg, shade($state-info-text, 15%));
@include purple-table-row-variant('warning', $state-warning-bg, shade($state-warning-text, 15%));
@include purple-table-row-variant('danger', $state-danger-bg, shade($state-danger-text, 15%));