.display-none {
  display: none;
}

.text-left {
  text-align: left;
}

@mixin cover {
  position: absolute;
  top: 0;
  width: 0;
  height: 100%;
  background-color: rgba(222, 222, 222, 0.5);
  content: ' ';
}

.ne-table-item-cell-stripe {
  background-color: $tabel-head-bg;
}

.scroll-x {
  overflow-x: scroll;
}

table {
  width: 100%;
}

.#{$prefix}-table {
  position: relative;
  color: $component-default-color;
  text-align: left;
  &-visible {
    visibility: visible;
  }
  &-hidden {
    visibility: hidden;
  }
  &-thead {
    background-color: $tabel-head-bg;
  }
  &-tbody {
    background-color: $white;
  }
  &-thead th {
    padding: 10px;
    font-weight: bold;
  }
  &-tbody th,
  &-tbody td {
    padding: 10px;
    word-break: break-all;
  }
  &-left-fixed {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    &-shadow-border {
      box-shadow: $tabel-scroll-shadow;
    }
    .ne-table-item-tbody {
      overflow: -moz-scrollbars-none;
    }
    .ne-table-item-tbody::-webkit-scrollbar {
      display: none;
    }
  }
  &-right-fixed {
    position: absolute;
    top: 0;
    right: 0;
    overflow: -moz-scrollbars-none;
    z-index: 1;
    &-shadow-border {
      box-shadow: -$tabel-scroll-shadow;
    }
    .ne-table-item-tbody::-webkit-scrollbar {
      display: none;
    }
  }
  &-all-border {
    border-right: $table-border;
    border-left: $table-border;
    th,
    td {
      border: $table-border;
    }
    th:nth-child(1),
    td:nth-child(1) {
      border-left: none;
    }
    th:nth-last-child(1),
    td:nth-last-child(1) {
      border-right: none;
    }
  }
  &-border-row {
    tbody {
      th,
      td {
        border-top: $table-border;
        pointer-events: auto;
      }
      &:last-child {
        border-bottom: $table-border;
      }
    }
  }
  &-warp-border {
    border: $table-border;
    tbody {
      &:last-child {
        border-bottom: none;
      }
    }
  }
  .ne-switch-base-icon {
    background-color: $white;
  }
  &-outer {
    position: relative;
  }
  .ne-icon {
    cursor: pointer;
    &-sort-up,
    &-sort-down {
      color: $primary-color;
    }
  }

  &-item {
    overflow: auto;
    overflow-x: hidden;

    &-table-tbody-row {
      display: flex;
      flex-direction: column;
    }
    &-body-expand-row-left,
    &-body-expand-row-right {
      visibility: hidden;
    }
    &-header {
      position: relative;
      overflow: scroll;
      z-index: 1;
      &-icon {
        vertical-align: middle;
      }
      &-icon-filtered {
        color: $primary-color;
      }
    }
    &-header::-webkit-scrollbar {
      display: none;
    }
    //&-tbody::-webkit-scrollbar {
    //    display: none;
    //}
    &-header-filter {
      div &-body {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin: 10px 0;
      }
      div &-footer {
        display: flex;
        align-items: center;
        justify-content: space-around;
        margin-bottom: 5px;
      }
    }
  }
  &-loading-cover {
    display: flex;
    position: absolute;
    bottom: 0;
    overflow: hidden;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 0;
    opacity: 0;
    transition: opacify $animation-duration-slow;
    &:before,
    &:after {
      @include cover;
      transition: width $animation-duration-slow;
    }
    &:before {
      left: 0;
    }
    &:after {
      right: 0;
    }
    &.active {
      height: 100%;
      opacity: 1;
      &:before,
      &:after {
        width: 50%;
      }
    }
  }
  &-loading {
    width: 50px;
    height: 50px;
    margin: 0 auto;
    border: 2px solid rgb(0, 0, 0);
    border-radius: 50%;
    border-right-color: transparent;
    border-left-color: transparent;
    :local {
      animation: fa-spin 575ms infinite linear;
    }
  }
  &-border-none {
    border-right: none;
    border-left: none;
  }
}

.text-center {
  text-align: center;
}

@keyframes fa-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}

.#{$prefix}-table-pagination {
  display: flex;
  justify-content: center;
}

.ne-table-exist-scroll-y {
  border-bottom: $table-border;
  .ne-table-tbody tr:first-child td {
    border-top: none;
  }
  .ne-table-tbody tr:last-child td {
    border-bottom: none;
  }
}

div.ne-table-item-filter-body {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  > label {
    margin-right: 12px;

    &:last-child {
      margin-bottom: 5px;
    }
  }
}

.ne-table-item-filter-footer {
  display: flex;
  justify-content: space-between;
}

.ne-table-is-hover {
  background-color: $table-row-hover;
}