// 分组渲染背景色
$table-group-background-color = #FAFAFB

.n-table-body
  overflow auto
  position relative
  &-ref
    z-index -1
    visibility hidden
    n-absolute(0,0,0,0)

.n-table-virtual-y
  width 0
  float left


/** tbody **/
.n-tbody-tr
  background-color #FFFFFF
  transition background-color 0.2s ease
  &-active
    background-color #e8f1fe
.n-td
  vertical-align top
  min-width 0
  min-height 36px
  height 100%
  border-bottom 1px solid #e6e7eb
  &-cell
    n-ellipsis()
    color $n-color-1
    font-size 13px
    line-height 24px
    padding 6px 8px
    min-height 36px
    &.outer
      padding 0
    &.normal
      padding 6px 8px
  &-center
    text-align center
    .n-td-justify-content
      justify-content center
  &-right
    text-align right
    .n-td-justify-content
      justify-content flex-end
  &-wrap
    white-space normal
    word-break break-all
.n-tbody-tr-last
  background-color #FFFBEE

.n-th-cell-select
.n-td-cell-select
  display flex
  align-items center
  justify-content center
.n-table-select-icon:not(.disabled)
  cursor pointer

.n-td-cell-operation
  padding 0
  display flex
  align-items center
  &-button
    margin 0 auto
  &-options
    padding-left 3px
    padding-right @padding-left
    margin-right 8px

/** 分组 **/

.n-table-group
  border-bottom 1px solid #e6e7eb
  background-color $table-group-background-color
  &-sticky
    left 0
    position sticky
    display inline-flex
    background-color inherit



/** 可编辑单元格 **/
.n-th-form-cell
  background-color #D7E8FC
  .n-th-title:after
    content '(可编辑)'
    color #606871
    margin-left 4px
    font-weight normal

.n-td-form-cell
  padding 0
  display flex
  align-items center
  .n-form-border-middle .n-form-value
    padding-top 7px
    padding-bottom @padding-top



.n-tree-shape
  width 32px
  &.active
    transform rotate(90deg)

for indent in (0..5)
  .n-tree-shape-{indent}
    margin-left: indent * 20px - 8px

/** 多行渲染 **/
.n-td-rows > .n-td-cell
  padding-top 3px
  padding-bottom @padding-top
  min-height 30px
  border-bottom 1px solid #e6e7eb
  &:last-child
    border-bottom-width 0
  &:nth-child(odd)
    background-color #fafafb
    transition background-color .2s ease


// 改变背景颜色时要把子元素背景设置成透明
.n-tbody-tr:hover
.n-tbody-tr-last
.n-tbody-tr-active
  .n-td-rows > .n-td-cell:nth-child(odd)
    background-color transparent
