@import "~antd-mobile/lib/style/themes/default.less";

.drawer-group{
  position: relative;
  height: 80px;
  width: 100%;

  .drawer-group-content{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }

  .drawer-group-sidebar{
    position: absolute;
    width: 100%;
    left: 0;
    top: 80px;
    z-index: 99;
  }

  .drawer-group-mask{
    transition: all 0.2s ease-out;
    background: @fill-mask;
  }
}

// 抽屉按钮组
.drawer-group-btn{
  position: relative;
  height: auto;
  background: #fff;
  border-bottom: @border-width-sm solid @border-color-base;

  .drawer-group-btn-item{
    &.selected{
      .btn-content{
        color: @brand-primary;
      }
    }

    .btn-content{
      color: #666;
      font-size: 28px;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .btn-title{
      position: relative;
      line-height: 79px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      padding: 0 10px;
    }

    .btn-icon{
      width: 26px;
      height: 14px;
      background-image: url("../styles/images/icon/filter_down.png");
      background-size: cover;
      flex-shrink: 0;
    }
  }
}

// 抽屉地区选择控件
.drawer-district{
  background: #f8f8f8;

  .drawer-district-extra{
    color: #999;
    font-size: @font-size-caption-sm;
    padding: 20px;
    text-align: center;
  }

  :global{
    .drawer-picker-btn{
      height: 120px;
      background: #fff;
      padding: 0 20px;
      border-top: @border-width-sm solid @border-color-base;
    }

    .am-picker-col-mask{
      display: none;
    }
  }
}

// 抽屉排序控件
.drawer-sort{
  margin-top: -1px;
  background: #fff;

  :global{
    .sort-selected{
      color: @brand-primary;
    }

    .am-button{
      color: #666;
      border-radius: 6px;
    }

    .am-button-primary{
      color: #fff;
    }

    .am-list-content{
      font-size: 28px !important;
    }
  }
}

// 抽屉筛选控件
.drawer-filter{
  position: relative;
  //position: absolute;
  //left: 0;
  //right: 0;
  //top: 0;
  //bottom: 0;
  background: #f8f8f8;
  //position: relative;
  //padding-bottom: 120px;

  :global{
    .drawer-filter-content{
      position: absolute;
      width: 100%;
      overflow: auto;
      -webkit-overflow-scrolling : touch;
      left: 0;
      top: 0;
      bottom: 120px;
    }

    .drawer-filter-item{
      position: relative;
      border-bottom: @border-width-sm solid @border-color-base;
      padding-top: 20px;

      &:last-child{
        border-bottom: 0;
      }
    }

    .drawer-filter-item-title{
      min-height: 6px;
      margin-top: -20px;
      padding-left: 20px;
      padding-top: 26px;
      padding-bottom: 26px;
      font-size: 28px;
      color: #666;
      text-align: left;
    }

    .drawer-filter-btn{
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 120px;
      background: #fff;
      padding: 0 20px;
      border-top: @border-width-sm solid @border-color-base;
    }
  }
}

.selected{
  color: @brand-primary;
}

.selected:after{
  background-image: url("../styles/images/icon/filter_up.png");
}