// @import ".";

@mixin highlightTD($color) {
  td,
  th {
    // background-color: $color;
    color: $color;
    border-bottom-color: darken($color, 10%);
  }
}
.table-body-scroll {
  overflow-y: auto;
  overflow-x: hidden;
}
.table-header {
  table-layout: fixed;
}
.table-render {
  // overflow: auto;
  overflow-x: auto;
}
.table-container {
  @include card();
  // padding-bottom: 10px;
}
.hide-table {
  // opacity: 0;
  height: 0;
  overflow: hidden;
}
.no-record-tip {
  display: block;
  padding: 20px 0;
  text-align: center;
  color: #999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.table {
  border-spacing: 0;
  * {
    user-select: auto;
  }
  thead {
    background-color: $tableHeaderBgColor;
    tr {
      th {
        border-bottom: 1px solid #eee;
        font-weight: normal;
        color: $tableHeaderTextColor;
        padding: 8px 0;
        // vertical-align: middle;
        // border-bottom: 2px solid #ddd;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        &:hover {
          background-color: darken($tableHeaderBgColor, 2%);
        }
      }
    }
  }

  tr {
    &.theme {
      @include highlightTD($red);
    }
    &.blue {
      @include highlightTD($blue);
    }
    &.red {
      @include highlightTD($red);
    }
    &.orange {
      @include highlightTD($orange);
    }
  }

  tbody {
    background-color: $tableBodyBgColor;
    tr {
      &:hover {
        background-color: rgba($themeColor, 0.06) !important;
      }
      td {
        border-bottom: 1px solid #f0f0f0;
        border-right: 1px solid #eee;
        padding: 8px 2px;
        text-align: center;
        border-top: 0;
        word-break: keep-all;
        vertical-align: middle;
        color: $tableBodyTextColor;
        // min-width: 30px;
        max-width: 400px !important;
      }
      &:nth-of-type(even) {
        background-color: #f5f5f5;
      }
    }
  }

  // &.fixed {
  //   table-layout: fixed;
  // }
}