/**  =====================
      Data Tables css start
==========================  **/
.table {
  color: #888;
  td,
  th {
    border-top: 1px solid $theme-border;
    white-space: nowrap;
    padding: 1.05rem 0.75rem;
  }

  thead th {
    border-bottom: 1px solid $theme-border;
  }

  tbody + tbody {
    border-top: 2px solid $theme-border;
  }

  &.table-sm {
    th,
    td {
      padding: 0.35rem;
    }
  }
}
/* Border versions */

.table-bordered {
  border: 1px solid $theme-border;

  td,
  th {
    border: 1px solid $theme-border;
  }
}
/* Zebra-striping */

.table-striped {
  tbody tr:nth-of-type(2n + 1) {
    background-color: transparentize($primary-color, 0.95);
  }
}
/* Hover effect */

.table-hover {
  tbody tr {
    &:hover {
      background-color: transparentize($primary-color, 0.95);
    }
  }
}
/* Table backgrounds */

.table {
  .thead-dark {
    th {
      color: #fff;
      background-color: $dark-color;
      border-color: darken($dark-color, 10%);
    }
  }
}

.table-dark {
  color: #fff;
  background-color: $dark-color;

  td,
  th,
  thead th {
    border-color: darken($dark-color, 10%);
  }

  &.table-striped {
    tbody tr:nth-of-type(odd) {
      background-color: darken($dark-color, 2%);
    }
  }

  &.table-hover {
    tbody tr {
      &:hover {
        background-color: darken($dark-color, 5%);
      }
    }
  }
}
/* fixed header position */

table.dataTable.fixedHeader-floating {
  top: 0 !important;
  @media screen and (max-width: 992px) {
    display: none !important;
  }
}

@media screen and (max-width: 992px) {
  .fixedHeader-locked {
    display: none !important;
  }
}

/**  =====================
      Foo-table css start
==========================  **/

.footable .pagination > {
  .active > {
    a,
    span {
      background-color: $primary-color;
      border-color: $primary-color;

      &:focus,
      &:hover {
        background-color: $primary-color;
        border-color: $primary-color;
      }
    }
  }

  li > {
    a,
    span {
      color: #222;
    }
  }
}

.footable-details.table,
.footable.table {
  margin-bottom: 0;
}

table {
  &.footable > tfoot > tr.footable-paging > td > span.label {
    margin-bottom: 0;
  }

  &.footable-paging-center > tfoot > tr.footable-paging > td {
    padding-bottom: 0;
  }
}

.table-columned > {
  tbody > {
    tr > {
      td {
        border: 0;
        border-left: 1px solid $theme-border;
      }

      th {
        border: 0;
      }
    }
  }
}
/**====== Foo-table css end ======**/
/**====== Data Tables css end ======**/