@import "@/styles/mixin.scss";

.wrap{
  @include wh(100%,100%);
  background-color: #F4F5F7;

}
.navBar{
  margin-bottom: 46px;
}
.rightWrap {
  @include flexCenter;
  .img2 {
    @include wh(17px, 17px);
  }
}
.tab_wrap {
  @include fontWeightSize(bold, 12px);
  display: flex;
  justify-content: space-around;
  padding: 5px 0 5px 0;
  @include colorOpa(#737373,0.7);
  div {
    padding-top: 8px;
  }
  .active {
    color: #3678FF;
    position: relative;
  }
  .active:after {
    content: '';
    display: block;
    @include wh(50px,2px);
    background: linear-gradient(270deg, #33A3FF 0%, #176AFE 100%);
    border-radius: 2px;
    position: absolute;
    margin-top: 3px;
    left: 50%;
    transform: translateX(-50%);
  }
}
.contentWrap{
  @include sizingPadding(0,8px);
  overflow-y: auto;
  width: 100%;
  height: calc(100% - 100px);
  margin-top: 10px;
  .itemWrap{
    margin-bottom: 16px;
    width: 100%;
    //@include wh(100%, 300px);
    background: #FFFFFF;
    box-shadow: 0px 2px 10px 0px rgba(216, 216, 216, 0.5);
    @include sizingPadRadius(6px ,0,6px);
    @include flexAround;
    @include fontWeightSize(400, 12px);
    .flexBetween{
      @include flexColBet;
    }
    .common{
      margin: 0 15px ;
    }
    .time{
      color: rgba(0,0,0,0.7);
      margin-top: 5px;
    }
    .imgWrap{
      @include wh(100%,200px);
      position: relative;
      margin: 6px 0;
      img{
        @include wh(100%,100%);
      }
    }
    .left{
      color: red;
      @include fontWeightSize(bold,15px);
    }
  }

}
.empty{
  @include flexTwoCenter;
  height:calc(100% - 86px);
  background-color: #FAFAFA;
  img{
    width: 100%;
  }
}