/* Element Variables */
.el-header{
  height: var(--page-header);
  border-bottom: 2px solid var(--gray-light);
}
/* button */
// .el-button{
//   padding: 8px 12px;
// }
.el-button--big{
  padding: 9.67px 18px;
  height: 40px;
  font-size: 16px;
  i{
    font-size:16px;
  }
}
.el-button--large{
  padding: 15px 30px;
  height: 48px;
}
.el-button--medium,
.el-button--small{
  font-size: 14px;
  .iconfont{
    font-size: 14px;
  }
}
.el-button--mini{
  padding: 5px 10px;
  font-size: 12px;
  .iconfont{
    font-size: 12px;
  }
}
.el-button--dashed{
  border-style: dashed;
}
.el-button--primary{
  //@include buttonCreat(--primary,--primary);
  //box-shadow:0 4px 8px 0 rgba(78,136,243,.25);
  box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.06);
}
.el-button.is-disabled{
  background: rgba(239, 241, 246, 0.8);
  border-color: #E7EAEF;
  color:rgba(64, 66, 71, .3);
  box-shadow: none;
  &:hover{
    color:rgba(64, 66, 71, .4);
    background: rgba(239, 241, 246, 0.4);
    box-shadow: none;
    border-color: #E7EAEF;
  }
}
.el-tooltip__popper.is-dark{
  --white:var(--menu-bgcolor);
  --primary-text:var(--gray);
}
.popper__arrow{
  --primary-text:var(--sideBarBg);
}

//input
// .el-input{
//   .el-input__inner{
//     height: 32px;
//     line-height: 32px;
//   }
//   .el-input__icon{
//     line-height: 32px;
//   }
// }


//tree icon 
.el-icon-circle-plus-outline.expanded{
  transform: rotate(0deg);
  .el-tree-node__expand-icon.is-leaf{
    color: inherit;
    &::before{
      content: "";
      width: .8em;
      height: .8em;
      display: block;
      margin: .2em .1em;
      border: 1px solid #ccc;
      border-radius: .8em;
    }
  }
  .el-tree-node.is-expanded{
    .expanded{
      color: var(--primary);
    }
  }
  .el-tree-node__content:hover{
    .el-tree-node__expand-icon.is-leaf{
      &::before{
        border: 1px solid var(--primary);
      }
    }
  }
  
}


.tab-button{
  border:1px solid #E7EAEF;
  padding: 3px;
  border-radius: 4px;
  box-sizing: border-box;
  height: 40px;
  .el-radio-button__inner{
    padding: 9px 20px;
    border:none;
  }
  
  .el-radio-button:first-child .el-radio-button__inner{
    border:none;
  }
  .el-radio-button__orig-radio:checked + .el-radio-button__inner{
    border-radius: 4px;
    background: var(--primary);
    box-shadow: 0px 4px 8px 0px rgba(78, 136, 243, 0.25);
  }
}

.el-image{
  img{border-radius: 2px;}
}

//dialog-style
.el-dialog__header{
  border-bottom: 1px solid $border-color;
  padding:20px 20px 15px;
  .el-dialog__headerbtn{
    top: 22px;
  }
}
.el-dialog__body{
  padding: 20px;
}
.el-dialog__footer{
  text-align: center;
  padding: 14px 20px 15px;
  border-top: 1px solid $border-color;
}

.dialog-locus{
  .el-dialog__body{
    padding: 0;
  }
}

//message-box
.el-message-box__header{
  border-bottom: 1px solid var(--gray-light);
  padding: 20px 15px 16px;
  .el-message-box__headerbtn{
    top:20px
  }
}
.el-message-box__content{
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  .el-message-box__input{
    margin-left: 10px;
  }
}
.el-message-box__btns{
  border-top: 1px solid var(--gray-light);
  text-align: center;
  padding: 15px 15px 5px;
  .el-button{
    padding: 12px 22px;
  }
}

.el-tabs__nav-next, 
.el-tabs__nav-prev{
  line-height: 32px;
}

//table

.el-table tr th.is-leaf,
.el-table tr td{
  border-bottom: none;
}
.el-table--striped .el-table__body tr.el-table__row--striped td{
  background: #FAFBFF;
}
// .el-table--striped .el-table__body tr.el-table__row--striped:hover td,
// .el-table--enable-row-hover .el-table__body tr:hover > td {
//   background-color: #F3F6FD;
// }
.el-table::before{
  height: 0;
}

.el-tooltip,
.el-table{
  .el-button--text{
    padding: 0 4px;
    color:var(--gray-dark);
    &:hover{
      color:var(--primary);
    }
    
  }
  .el-button--text + .el-button--text{
    margin-left:0
  }
}

//table-scroll
.scrollable {
  height: 100%;
  .el-table__body-wrapper{
    overflow-y: auto;
    height: calc(100% - 70px);
  }
}

//tree-select
.vue-treeselect__control{
  border-color: var(--gray-light);
  border-radius: 4px;
  line-height: 38px;
}
.vue-treeselect__placeholder, 
.vue-treeselect__single-value{
  line-height: 38px;
}
.vue-treeselect__value-remove,
.vue-treeselect__multi-value-item{
  color:var(--primary);
}
.vue-treeselect--focused:not(.vue-treeselect--open) .vue-treeselect__control {
  border-color: var(--primary);
}
.vue-treeselect:not(.vue-treeselect--disabled) .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-disabled):hover .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-new) .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-new):hover {
  color:var(--primary)
}
.vue-treeselect {
  span{
    line-height: 1.4;
  }
  .vue-treeselect__value-remove{
    line-height: 0;
    border-left: none;
    background: #d0d3da;
    border-radius: 10px;
    padding:3px 5px;
    &:hover{
      background: #5d5d5d;
      color:#fff;
    }
    svg{
      vertical-align: middle;
    }
  }
}

.vue-treeselect__multi-value-item-container{
  padding-top: 0px;
  margin-bottom: 3px;
  padding-right: 3px;
}
.vue-treeselect__limit-tip{
  padding-top:2px;
}
.vue-treeselect__multi-value,
.vue-treeselect__multi-value-item-container,
.vue-treeselect__multi-value-item{
  line-height: 1.6;
}

.vue-treeselect__multi-value-item{
  background: #efefef;
  color: #5d5d5d;
  padding: 4px 3px 4px 0;
  &:hover{
    .vue-treeselect__value-remove{
      //color: #fff;
      color: #5d5d5d;
    }
  }
}
.vue-treeselect--has-value .vue-treeselect__multi-value{
  margin-bottom: 0;
  margin-top:1px;//选中多行时，顶部间距
  max-height: 180px;
  overflow-y:auto;
}
.vue-treeselect__value-remove{
  color: #5d5d5d;
}
.vue-treeselect__multi-value-item:hover .vue-treeselect__value-remove{
  color: #5d5d5d;
  &:hover{
    color:#fff;
  }
}

.vue-treeselect div.vue-treeselect__single-value{
  line-height: 40px;
}
.vue-treeselect__menu {
  line-height: 220%;
}
.vue-treeselect__label-container:hover .vue-treeselect__checkbox--unchecked {
  //border-color: #039be5;
  border-color: var(--primary);
}
.vue-treeselect__checkbox--checked,
.vue-treeselect__checkbox--indeterminate,
.vue-treeselect__label-container:hover .vue-treeselect__checkbox--checked,
.vue-treeselect__label-container:hover .vue-treeselect__checkbox--indeterminate {
  background: var(--primary);
  border-color: var(--primary);
}


//input 有后置图标及clearable时，图标位置交换

.el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled){
  box-shadow: none;
}

.el-select .el-tag{
  border-color:#efefef;
  border-radius: 2px;
}

.text--success{color: var(--success);}
.text--warning{color: var(--warning);}
.text--danger{color: var(--danger);}