/** table 容器 **/

.n-table
  overflow hidden
  background-color #FFFFFF

/**
 * fill-height 模式
 **/
.n-table-fill-height
  height 100%
  display flex
  flex-direction column
  .n-table-no-data
    z-index 1
    height unset
    padding-bottom 2px
    n-absolute(0,0,0,0)
  .n-table-body
    n-absolute(0,0,0,0)
  .n-table-blank
    n-absolute(unset,0,0,0)

/** main body **/
.n-table-main
  flex auto
  position relative

/**
 * top
 **/
.n-table-top
  z-index 2
  overflow hidden
  position relative
  margin-bottom -1px
  min-height 36px
  background-color #FAFAFB
  border-top 1px solid #E6E7EB
  border-bottom 1px solid #D4D7DC
.n-ttop-title
  z-index 3
  n-absolute(0, unset, 0, 0)
  background-color #FAFAFB
  &:after
    content ''
    position absolute
    right 0
    top 50%
    height 16px
    margin-top -8px
    border-right 1px solid #E6E7EB
.n-ttop-tr
  background-color #FAFAFB

// 该节点是为了填补 n-table-top 元素的 padding-right 颜色问题
.n-table-top .n-td
  border-bottom-width 0
  &.n-tx-natural:last-child
    position relative
  &:last-child:after
    content ''
    width 30px
    n-absolute(0, unset, 0, 100%)
    background-color #FAFAFB


/**
 * footer
 **/
.n-table-footer
  z-index 2
  overflow hidden
  position relative
  min-height 36px
  margin-top -1px
  background-color #FAFAFB
  border-top 1px solid #D4D7DC
  border-bottom 1px solid #E6E7EB
.n-table-has-scroll-left .n-table-footer
.n-table-has-scroll-right .n-table-footer
  margin-top 0
  border-top-color #E6E7EB
.n-tfoot-title
  z-index 3
  n-absolute(0, unset, 0, 0)
  background-color #FAFAFB
  &:after
    content ''
    position absolute
    right 0
    top 50%
    height 16px
    margin-top -8px
    border-right 1px solid #E6E7EB
.n-tfoot-tr
  background-color #FAFAFB
  &:last-child .n-td
    border-bottom-width 0
  &:not(:last-child) .n-td:last-child:after
    bottom -1px
    border-bottom 1px solid #e6e7eb

// 该节点是为了填补 n-table-footer 元素的 padding-right 颜色问题
.n-table-footer .n-td
  //border-bottom-width 0
  &.n-tx-natural:last-child
    position relative
  &:last-child:after
    content ''
    width 30px
    n-absolute(0, unset, 0, 100%)
    background-color #FAFAFB


/** table附加的组件 **/

.n-table-setting
  width 24px
  font-size 16px
  line-height 32px
  z-index 2
  right 0
  top -33px
  position absolute
  background-color #F3F8FE

.n-table-loading
  pointer-events none
  z-index 2


/**
 * 无数据
 **/

.n-table-no-data
  font-size 13px
  line-height 24px
  height 100%
  padding-top 2px
  color $n-color-4
  position relative
  &-content
    flex auto
    min-height 32px

.n-table-blank
  height 2px
  border-bottom 1px solid #E6E7EB



/**
 * 强度
 **/

.n-table-level-strong
  // 表头
  .n-table-header
    border-top-width 0
    border-bottom-width 0
  .n-thead-tr
    background-color #D7E8FC
  .n-table-setting
    top -32px
    background-color #D7E8FC
  // 表头边框色
  div.n-table-header
  th.n-tx-sticky:before
  th.n-tx-natural
    border-color #D5D6DD
  .n-th:hover
    background-color tint($primary-color, 90%)
  .n-tbody-tr:hover
    background-color #E8F1FE

.n-table-level-normal
  .n-td[rowspan]:not([rowspan="1"])
    background-color #FFFFFF
  .n-tbody-tr:hover
    background-color tint(#F3F8FE, 45%)

.n-table-level-tiny
  .n-table-header
    border-top none
    min-height 24px
    border-bottom-width 0
  .n-td
    border-bottom-width 0
  .n-th-cell
  .n-td-cell
    min-height 24px
    padding 2px 6px
    font-size 12px
    line-height 20px
    &.normal
      padding 2px 6px
  .n-tbody-tr:nth-child(even)
    background-color #fafafb
  .n-tbody-tr:hover
    background-color #E7F1FF