@import "mixins/bem-mixin";
@import "common/variable";

@include b(tree-view) {
  border: {
    left: 1px solid #eee;
    top: 1px solid #eee;
    right: 1px solid #eee;
  };
  -webkit-box-shadow: 0 0 15px #d8d8d8;
  -moz-box-shadow: 0 0 15px #d8d8d8;
  box-shadow: 0 0 15px #d8d8d8;
  @include m(no-data) {
    border-bottom: 1px solid #eee;
    min-height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    @include e(text) {
      font-size: 12px;
    }
  }
}

@include b(tree-view-item) {
  text-align: left;
  padding-left: 10px;
  @include e(text-box) {
    padding: 10px 20px;
    border-bottom: 1px solid #eee;
    display: flex;
    align-items: center;
    justify-content: space-between;
    @include pseudo(hover) {
      background-color: #f8f8f8;
    }
    @include e(icon) {
      margin-right: 5px;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #5485fe;
      width: 16px;
      height: 16px;
      @include pseudo(before) {
        content: '+';
        color: #fff;
        font-size: 16px;
        line-height: 16px;
        font-weight: 900;
      }
      @include pseudo(hover) {
        cursor: pointer;
      }
      @include when(expand) {
        background-color: #5485fe;
        @include pseudo(before) {
          content: '-';
        }
      }
      @include when(leaf) {
        background-color: transparent;
        @include pseudo(before) {
          content: ' ';
        }
      }
    }
    @include e(text) {
      margin-top: 0;
      margin-bottom: 0;
    }
    @include e(btn-group) {

    }
  }
}