.#{$table-prefix-cls} {
  width: inherit;
  max-width: 100%;
  height: 100%;
  overflow: hidden;
  font-size: $font-size-sm;
  color: $body-color;
  background-color: $white;

  &-wrapper {
    position: relative;
  }
  &__header{
    overflow: hidden;
  }

  &__body {
    overflow-y: auto;
  }

  & table {
    width: 100% !important;
    table-layout: fixed;
    border-collapse: separate;
  }

  th,
  td {
    text-align: left;
    vertical-align: middle;
  }

  th {
    height: $table-th-height;
    overflow: hidden;
    font-weight: 400;
    color: $table-head-color;
    white-space: nowrap;
  }

  td {
    height: $table-td-height;
    background-color: $white;
    transition: backgroud $table-transition;
  }

  tbody tr {
    @include hover {
      td{
        background: $table-bg-hover;
      }
    }
  }


  //
  // 行
  //

  &__row {
    // 选中行
    &--highlight {
      td {
        background-color: $table-bg-active;

        &:first-child {
          position: relative;

          &::before {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            width: 3px;
            content: "";
            background-color: $brand-primary;
          }
        }
      }
    }

    // 展开行
    &--expanded {
      > td {
        padding: 20px 50px;
      }
    }

    .expand-icon{
      font-size: 1.5em;
      cursor: pointer;
      transition: transform .2s ease-in-out;
    }
  }


  //
  // 列
  //

  &-sort,
  &-filter {
    i {
      color: $gray;
      cursor: pointer;

      &::before {
        transform: scale(2,2);
      }

      &.on{
        color: $brand-primary;
      }
    }
  }

  // 列筛选
  &-filter {
    display: inline-block;
    vertical-align: middle;

    &-list {
      // 多选
      &-item {
        padding-bottom: 8px;

        .checkbox-wrapper + .checkbox-wrapper {
          margin: 0;
        }

        label {
          display: block;
          margin-bottom: 4px;
        }
      }

      ul {
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;

        > li {
          cursor: pointer;
        }
      }
    }

    // 单选
    &-select-item {
      padding: 7px 16px;
      font-size: $font-size-xs;
      color: $gray;
      white-space: nowrap;
      list-style: none;
      transition: background $transition-time ease-in-out;
      @include hover-focus{
        background-color: $dropdown-link-hover-bg;
      }

      &-selected{
        position: relative;

        &::after {
          position: absolute;
          right: $dropdown-item-padding-x;
          color: $dropdown-link-check-icon-color;
          content: "\f27b";
          @extend %aid-icon;
          transform: scale(1.2) translate(0, 0);
        }
      }
    }
  }

  // 列排序
  &-sort {
    display: inline-flex;
    flex-direction: column;

    i {
      font-size: 20px;
      line-height: 1;

      &:last-child {
        margin-top: -10px;
      }
    }
  }

  // 固定列
  &-fixed {
    position: absolute;
    top: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    background-color: $white;
    box-shadow: 2px 0 6px -2px rgba(0, 0, 0, .2);

    &::before {
      position: absolute;
      bottom: 0;
      left: 0;
      z-index: 4;
      width: 100%;
      height: 1px;
      content: ""; 
      background-color: $table-border-color;
    }
    
    &--right {
      top: 0;
      right: 0;
      left: auto;
      box-shadow: -2px 0 6px -2px rgba(0, 0, 0, .2);
    }
  }
  &-fixed__body {
    z-index: 3;
    overflow: hidden;
  }

  // 固定表头
  &--with-fixed-top {
    .#{$table-prefix-cls}__body {
      overflow-y: auto;
    }
  }


  //
  // 单元格
  //

  &__cell {
    padding-right: 15px;
    padding-left: 15px;
    // .table-cell__text-content {
    //   word-break: normal;
    //   width: auto;
    //   display: block;
    //   white-space: pre-wrap;
    //   word-wrap: break-word;
    //   overflow: hidden;
    // }

    // 超出省略
    &--ellipsis {
      overflow: hidden;
      text-overflow: ellipsis;
      word-break: keep-all;
      white-space: nowrap;

      .tooltip-wrap,
      .tooltip-rel,
      .table__cell--text {
        display: inline;
        width: 100%;
      }
    }

    // 可编辑单元格
    &--edit {
      position: relative;
      height: 100%;
      padding: 0;

      .#{$table-prefix-cls}-edit__text {
        display: flex;
        align-items: center;
        height: 100%;
        padding: 0 15px;
      }

      .#{$table-prefix-cls}-edit__action {
        position: absolute;
        top: 50%;
        right: 15px;
        display: none;
        cursor: pointer;
        transform: translateY(-50%);
      }

      .#{$table-prefix-cls}-edit__input {
        &,
        .input-wrapper,
        input {
          height: 100%;
        }

        input {
          border: none;
          border-radius: 0;
        }
      }

      &:hover {
        .#{$table-prefix-cls}-edit__action {
          display: block;
        }
      }
    }


    // 树单元格
    &--tree {
      display: flex;
      align-items: center;

      .tooltip-wrap,
      .tooltip-rel {
        display: inline;
      }

      .#{$table-prefix-cls}__tree-icon {
        cursor: pointer;
        transform: scale(1.6);
      }
    }

    // 水平对齐方式
    &--column-left {
      text-align: left;
    }

    &--column-center {
      text-align: center;
    }

    &--column-right {
      text-align: right;
    }

    th & {
      display: inline-block;
      max-width: 90%;
      vertical-align: middle;
    }
  }

  // 表头首列斜线分割
  .diagonal__cell {
    width: 100%;
    height: 100%;
    padding: 0;

    .top-r,
    .top-l,
    .bottom-l {
      position: absolute;
      width: auto;
    }
  }

  .diagonal__line {
    border-bottom: 1px solid $table-border-color;
  }


  //
  // 表格提示信息
  //

  &--tips {
    min-height: $table-bg-accent-height;
    &.#{$table-prefix-cls}--with-fixed-top {
      padding-bottom: 0;
    }
  }

  &__tip {
    position: absolute;
    top: $table-th-height;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: $table-bg-accent;
  }


  //
  // 表格隐藏
  //

  &--hide {
    opacity: 0;
  }

  &--hidden {
    visibility: hidden;
  }


  //
  // table--line
  //

  &--line {
    th,
    td{
      border-bottom: $table-border-width solid $table-border-color;
    }
    th {
      background: $table-head-bg;
    }
  }


  //
  // table--border
  //

  &--border {
    box-sizing: content-box;
    border-right: 1px solid $table-border-color;
    border-bottom: 1px solid $table-border-color;

    thead tr {
      background: $table-head-bg;
    }

    th,
    td {
      border-top: 1px solid $table-border-color;
      border-left: 1px solid $table-border-color;
    }

    .#{$table-prefix-cls}__tip {
      border-right: 1px solid $table-border-color;
      border-left: 1px solid $table-border-color;
    }
  }


  //
  // table--stripe
  //

  &--stripe {
    tbody tr:nth-of-type(odd) td {
      background-color: $table-bg-accent;
    }
  }


  //
  // table size
  //

  // table--sm
  &--sm {
    font-size: $table-sm-font-size;

    th {
      height: $table-sm-th-height;
    }

    td {
      height: $table-sm-td-height;
    }
  }

  // table--lg
  &--lg {
    font-size: $table-lg-font-size;

    th,
    td {
      height: $table-lg-th-height;
    }
  }
}
