@import './e-select-menu/index.scss';
.e-tree-selects{
  padding: vw(12) vw(16) vw(8) vw(12); 
  box-shadow:0px 3px 4px 0px rgba(0,0,0,0.03);
  .e-tree-warp{
    position: relative;
  }
  .e-tree-scroll{
    white-space: nowrap;
    overflow-x: scroll;
    padding-right: vw(23);
    &::-webkit-scrollbar {
      background-color:transparent;
      display:none;
    }
    div{
      display: inline-block;
      margin-right: vw(16);
      padding: 0 vw(8);
      line-height: vw(24);
      font-size: vw(14);
      color: #666666;
      @extend .font-family-PR;
    }
    .activeTag{
      text-align: center;
      color: #ffffff;
      border-radius:vw(12);
      background:#03C777
    }
    .e-tree-more{
      position: absolute;
      top:vw(0);
      padding: 0;
     right: vw(-32);
      height: vw(24);
      width: vw(46);
      display: flex;
      justify-content: center;
      background: #ffffff;
    }
  }
  .e-tree-select__list {
    position: relative;
    .e-tree-select__items {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin:vw(10) 0 0;
        padding-left:vw(8);
        width: 100%;
        .e-tree-select__item {
          display: flex;
          height: 100%;
          align-items: center;
          font-size: 14px;
          color: #999999;
          @extend .font-family-PR;
          &::after {
            content: '';
            display: inline-block;
            margin-top:vw(-2);
            margin-left: vw(8);
            border-top: 1px solid #BEBEBE;
            border-right: 1px solid #BEBEBE;
            width: vw(6);
            height: vw(6);
            transform: rotate(135deg);
            transition: all 200ms;
          }
          &.active {
            color:#03C777;
            &::after {
              transform: rotate(-45deg);
              color:#03C777;
              border-top: 1px solid #03C777;
              border-right: 1px solid #03C777;
            }
          }
        }
        .showfree{
          display:flex;
          align-items:center;
          font-size:12px;
          color:#999999;
          @extend .font-family-PR;
          .van-switch{
            margin-left:8px
          }
        }
    }
    .van-switch{
      width: 3em;
    }
    .van-switch--on .van-switch__node {
      -webkit-transform: translateX(1em);
      transform: translateX(2em);
  }
  }
}
