//@import "../../assets/stylus/colorConfig"
.date-container{
  //position absolute
  //width 100%
  //height 100%
  //overflow-y auto
  //-webkit-overflow-scrolling touch
}
.calendar{
  //position absolute
  width 100%
  height calc(100vh - 9.8125rem)
  overflow-y auto
  -webkit-overflow-scrolling touch
}
.tab_section{
  width 100%
  height 6.55rem
}
.calendar_tab{
  width 100%
  padding 1.85rem 1.25rem
  box-sizing border-box
  background #fff
  .tab-nav{
    box-shadow 0px 0px 20px 0px rgba(150,149,150,0.33)
    border-radius 30px;
    .tab_date{
      height 2.85rem;
      line-height 2.85rem
      text-align center
      color #fd8b81
      &.active{
        background: -webkit-gradient(linear, 0% 25%, 75% 100%, from(#fba78d), to(#fd8a81))
        background: -ms-linear-gradient(left,#fba78d 0%,#fd8a81 100%)
        color #fff
        border-radius 30px;
      }
    }
  }
}

.calendar_head{
  width 100%
  height 5rem
  .head_bar{
    width 100%
    height 5rem
    text-align center
    background #f9f9f9
    top 0
    left 0
    z-index 1000
    p{
      height 2.2rem
      margin-bottom .4rem
      padding-top .9rem
      box-sizing border-box
      font-size 1.1rem
      font-weight bold
      color #3f474c
      i{
        position absolute
        left 1.25rem
      }
    }
  }
  .week_title{
    width 100%
    height 2.4rem
    line-height 2.4rem
    text-align center
    border-bottom 1px solid #eee
    color #2b353b
    font-size .85rem
    //box-shadow 1px 1px 1px #ddd
  }
}
.calendar_group{
  text-align center
  .calendar_month{
    padding 1.8rem 0 1.2rem
    font-weight bold
    font-size 1.1rem
    color #2b353b
  }
  .calendar_days_box{
    display inline-block
    width 100%
    .calendar_day_cell{
      float left
      width 14.2857%
      height 53.56px
      line-height 53.56px
      margin-bottom .95rem
      font-size .825rem
      color #2e2e2e
    }
    .checkedDay{
      background #a7c7fb
      color #fff
    }
    .borderRadius{
      border-radius 100%
    }
    .all-borderRadius{
      border-radius 24px;
    }
    .past{
      color #d9d9d9
      cursor not-allowed
    }
  }
}
.bottom-section{
  height 4.8125rem
  .fixed_bottom{
    position fixed
    background #fff
    padding 1rem
    height 4.8125rem
    box-sizing border-box
    box-shadow: 0 0 30px 1px rgba(188, 188, 190, 0.32);
    .btn{
      margin 0;
      box-sizing border-box
      padding 0 2.8125rem
      text-align left
      span{
        display inline-block
        line-height 1rem
        padding .5rem 0
        font-size .625rem
        i{
          display block
          font-style normal
          font-weight bold
          font-size 1rem
        }
      }
      a{
        display block
        text-align right
        font-weight bold
      }
    }
  }
}

.time_solt{
  padding 0 1rem
  .title{
    margin-top .5rem
    margin-bottom 1rem
  }
  .week_wrap{
    margin-bottom 1.85rem
    ul{
      width 100%
      height 3.2rem
      border-radius 10px
      border 1px solid #e7e7e7
      li{
        height 3.2rem
        line-height 3.2rem
        text-align center
        border-left 1px solid #e7e7e7
        font-size .65rem
        color #484848
        &:first-child{
          border none
        }
        &.active{
          border none
          background #a7c7fb
          color #fff
        }
      }
    }
  }
  .month_wrap{
    ul{
      li{
        width 6.56rem
        height 3.2rem
        line-height 3.2rem
        margin-right .6rem
        margin-bottom .6rem
        text-align center
        border 1px solid #e7e7e7
        border-radius 10px
        box-sizing border-box
        font-size .65rem
        color #484848
        &:nth-child(3n){
          margin-right 0
        }
        &.active{
          border none
          background #a7c7fb
          color #fff
        }
      }
    }
  }
}