@import 'mixin.styl'
@import 'iconfont.styl'

body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, li, a, p, h1, h2, h3, h4,h5, h6,textarea, button, input, select, figure, figcaption 
  padding: 0
  margin: 0
  list-style: none
  font-style: normal
  text-decoration: none
  border: none
  outline: none
  color: $fc1
  font-size .28rem
  font-weight: normal
  font-family: Arial, "Microsoft Yahei", "Helvetica Neue", Helvetica, sans-serif
  box-sizing: border-box
  -webkit-tap-highlight-color:transparent
  -webkit-font-smoothing: antialiased
  &:hover
    outline: none

input[type="button"], input[type="submit"], input[type="search"], input[type="reset"], textarea, select
  -webkit-appearance: none
  appearance: none

html,body
  height: auto
  width: 100%
  background-color: #F5F5F5
  outline: 0
  padding: 0
  margin: 0
  border: 0

html
  background-color: #fff
  
.clear:after
  content: ''
  display: block
  clear: both

.clear
  zoom:1

.margin
  margin: 0 auto

.fl
  float: left

.fr
  float: right

.text-center
  text-align: center !important

.text-right
  text-align: right !important

.relative
  position relative

.hide
  display: none

.show
  display: block

.bold
  font-weight: bold

.pointer
  cursor pointer

.halfwidth
  width 50%

.allwidth
  width 100%

.spaceween
  justify-content: space-between

.ellipsis
  overflow: hidden
  text-overflow: ellipsis
  white-space: nowrap

.txtjustify
  display inline-block
  width 100%
  text-align: justify
  &:after
    content: ''
    display: inline-block
    _wh(100%, 0)
    overflow hidden


.mgt15
  margin-top: .15rem !important
.mgl5
  margin-left: .05rem !important
.mgl20
  margin-left: .2rem !important
.mgt86
  margin-top .86rem !important
.mgt186
  margin-top 1.86rem !important
.mgt196
  margin-top 1.96rem !important
.mgb110
  margin-bottom: 1.1rem !important
.mgb70
  margin-bottom: .8rem !important
.mgb186
  margin-bottom: 1.86rem !important
.cred
  color $red !important

.bgred
  background-color: $red !important

.bgyellow
  background-color: $yellow !important

.bgblue
  background-color: $blue !important

.bggreen
  background-color: $green !important

.bggray
  background-color: $gray !important

.bgwhite
  background-color: #ffffff !important

.fxrow
  _fj()

.fxcol
  flex: 1
  overflow hidden

.visible
  overflow visible

[class^="icon-"]
  display: inline-block
  height: inherit

/** 公共样式 **/
header
  position fixed
  top 0
  _fj()
  _wh(100%, .86rem)
  padding 0 .24rem
  background: $red
  z-index 100
  span
    _font(.36rem,.86rem,#ffffff,bold,center)
.content
  position: relative
  padding: 0 0.24rem
  z-index 99
.content-scroll
  height calc(100% - 2.2rem)
  overflow-y scroll
.login-bg
  background: #ffffff center bottom / 100% auto no-repeat url(./images/bg.png)
.loading-tips
  _font(.28rem,.53rem,#929292,,center)
  height .53rem
  overflow hidden
/** grid列表 **/
.grid-wraper
  _fj(,flex-start)
  // height calc(100% - 2.49rem)
  // overflow-y auto
.left_fixed
  flex 0 0 1.5rem
.slide
  flex 1
  overflow-x scroll
.layout-t
  border-collapse separate
  border-spacing 0
  text-align left
  vertical-align middle
  tr
    th,td
      white-space nowrap
      padding 0 .2rem
      border-bottom .1rem solid #f5f5f5
    th
      _font(.26rem,.98rem,#696969,bold)
      height 1.08rem
      background-color #d7d7d7
    td
      _font(.28rem,.98rem,$fc1)
      height 1.08rem
      background-color #ffffff
      a
        text-decoration underline
        color $red
.layout-t tr.checked td
  background-color $red
  color #fff
  a
    color #fff
.grid-wraper::-webkit-scrollbar, .slide::-webkit-scrollbar
  width 0
  height 0
.left_layout_t
  width 100%
  min-width 1.68rem
.sin_input
  width 1.6rem
  _font(.28rem,.6rem,#8a8a8a)
  padding 0 .1rem
  border 1px solid #a1a1a1
  border-radius 3px
.layout-t tr.checked td .sin_input
  color #8a8a8a
  border 1px solid #ffffff
.slide .layout-t
  // min-width 5.34rem
  min-width 7rem

/**detail**/
.detail-title
    _font(.28rem,1,#696969)
    padding-top .25rem
.detail-text
    _font(.3rem,1.2,#323232)
    padding-top .25rem
.detail-input-panel
    display flex
    _wh(100%,.78rem)
    _font(.3rem,.78rem,#323232)
    margin-top .25rem
.detail-input
    flex 9
    height inherit
    line-height inherit
    background #F4F4F4
    text-indent .28rem
.detail-unit
    flex 1
    display inline-block 
.detail-col-1
    flex 9
.detail-col-panel
    width 100%
    display flex
    overflow hidden
.detail-input-col
    flex 3
    _wh(20%,inherit)
    line-height inherit
    background #F4F4F4
    text-indent .28rem
.detail-unit-col
    flex 0.5
    display inline-block 
.detail-img-panel
    position relative
    margin-top .25rem
    width 3.02rem
.detail-img
    _wh(3.02rem,auto)
.detail-img-box
    _wh(3.02rem,3.02rem)

/** 按钮 **/
.btn
  max-width 2rem
  _font(.28rem,.8rem,#fff,,center)
  padding 0 .2rem
  // background-color $red
  border-radius 5px
  border .01rem solid $red
  background-color #fff
  color $red
  cursor pointer
  user-select none
  &:disabled
    background-color: $gray
    border .01rem solid $gray
    color #fff
.btn-disabled
  background-color $gray
  border .01rem solid $gray
  color #fff
.filter-btn
  flex none
  min-width .8rem
  padding 0 .3rem
.lx-icon
  flex 0 0 .44rem
  _wh(.44rem,.44rem)
  background-color: transparent
  cursor pointer
.icon-radio
  _bis('./images/close.png',.44rem)
.icon-radio-active
  _bis('./images/open.png',.44rem)

/** 输入框 **/
.filter-wraper
  width 100%
  margin-bottom .15rem
.bottom-filter
  width 100%
  position fixed
  bottom 1.11rem
  background-color #ffffff
  box-shadow 0 0 15px 0 rgba(160,160,160,0.9)
.bottom-filter-tip
  _fj(space-between)
  padding .1rem 0 0 0
  // border-bottom .01rem solid #f0edf1
  &:last-child
    border-bottom none
.filed-space
  margin 0 -.24rem
.filed-pad
  padding 0 .24rem
.filter-label
  flex none
  width 1.4rem
  _font(.3rem,.9rem,#323232,,justify)
.filter-unit
  width .5rem
  margin-left .2rem
  _font(.26rem,.6rem,#323232)
.filter-input
  display block
  width 100%
  min-width 0
  padding 0 .15rem
  _font(.3rem,.9rem,#606266)
  border .02rem solid #dcdfe6
  border-radius 4px
  background-color #fff
  // box-sizing border-box
  &:disabled
    color #929292
    background-color #f5f7fa
    border .02rem solid #e4e7ed
    cursor not-allowed
.bottom-input
  width 100%
  _font(.28rem,.6rem,#929292,,center)
  background-color: #ececee
.filter-warn
  display inline-block
  flex 0 0 .3rem
  _wh(.3rem,.3rem)
  border-radius 100%
  vertical-align middle
.filter-scan
  display: block
  _ct()
  right 0
  _wh(.9rem,.9rem)
  padding .24rem
.icon-scan
  flex 0 0 .42rem
  _bis('./images/saoma.png',.42rem)
.filter-scan-input
  // padding-right 1.5rem
  // border-bottom 1px solid #d7d7d7
.mount-bg
  padding .25rem
  background: #ffffff center bottom / 100% auto no-repeat url(./images/bg4.png)
.modal-message
  padding .5rem
  font-size .3rem
  line-height 1.5
  color #666
.tip-h1
  _font(.34rem,.54rem,#323232)
.tip-h2
  _font(.28rem,.5rem,#464646)
/** 提交栏 **/
.submit-bar
  _fj(flex-start)
  flex-wrap wrap
  position fixed
  top .86rem
  width 100%
  background-color #fff
  box-shadow 0 .01rem .04rem 0 rgba(160,160,160,0.9)
  z-index 100
  padding .1rem .1rem 0 .1rem
.submit-bar1
  padding-right .6rem
  transition all .3s ease-in-out
  overflow hidden
.submit-button
  flex 1
  line-height .8rem
  padding 0 .01rem
  margin 0 .1rem .1rem 0 // 间隙为.1rem
  width calc((100% - .3rem) / 4)  // 这里的.3rem = (分布个数4-1)*间隙.1rem, 可以根据实际的分布个数和间隙区调整
  min-width calc((100% - .3rem) / 4) // 加入这两个后每个item的宽度就生效了
  max-width calc((100% - .3rem) / 4) // 加入这两个后每个item的宽度就生效了
  &:nth-child(4n) // 去除第3n个的margin-right
    margin-right 0
.submit-button1
  flex 0 0 2.5rem
  line-height 1.1rem
  border-radius 0
.icon-subarrow
  flex 0 0 .22rem
  _wh(.22rem,.46rem)
  _bis('./images/triangle.png',.22rem)
.icon_subarrow_gray
  _bis('./images/triangle-gray.png',.22rem)
.qty_tip
  _font(.26rem,1,#323232)
  vertical-align: middle
.qty_num
  display inline-block
  _font(.3rem,1,$red)
  vertical-align: middle
  max-width 2.6rem
  overflow hidden
// 计算重量栏
.calc_value_wraper
 position fixed
 bottom 0
 width 100%
 padding 0 .24rem .1rem .24rem
 background-color #fff
 box-shadow 0 -.01rem .04rem 0 rgba(160,160,160,0.9)
 z-index 100
 .filter-label, .filter-input
   line-height .68rem
// vant toast style
.van-loading span, .van-toast__text
  color #ffffff !important
// 显示框bg
.disabled-bg
  color #929292
  background-color #f5f7fa
  border 1px solid #e4e7ed
  cursor not-allowed

.van-toast
  background-color rgba(155,155,155,.88)

// 弹窗 + 选择器
.msg_wrapper
  position fixed
  top 0
  bottom 0
  left 0
  right 0
  text-align center
  z-index 100
  &::after
    content ""
    display inline-block
    height 100%
    width 0
    vertical-align middle
.msg_box
  display inline-block
  width 90%
  max-width 420px
  padding .2rem
  vertical-align middle
  background-color #fff
  border-radius 4px
  border 1px solid #ebeef5
  box-shadow 0 2px 12px 0 rgb(0 0 0 / 10%)
  overflow hidden
  backface-visibility hidden
.input_item
  width 100%
  border-radius 4px
  border 1px solid #DCDFE6
  _font(14px,40px,#606266)
  text-indent 25px
.mask
  position fixed
  top 0
  left 0
  width 100%
  height 100%
  opacity .7
  background #000
  z-index 101
.msg_item
  height 50px
  line-height 50px
.label_item
  display inline-block
  width 90px
  _font(16px,inherit,#333)
.from_item
  display inline-block
  width calc(100% - 100px)
  _font(14px,inherit,#606266)
.from_item .el-select
  width 100%
.from_item .el-input
  font-size 14px
.from_item .el-input__inner
  height 40px
  line-height inherit
.el-select-dropdown__item span
  font-size 14px !important
.el-select .el-input .el-select__caret
  line-height 40px
.msg_btns
  height 35px
  line-height 35px
  width 100%
  max-width 300px
  margin 20px auto 0
  _fj()
.msg_btn
  width 80px
  height 35px
  line-height 35px
  font-size 14px
  color #fff
  background-color #d7592f
  border-radius 5px
  text-align center
  &:disabled
    background-color $gray

/** 选择器 */
.el-select
  width 100%
.rel_select .el-select
  width calc(100% - .7rem)
.el-input
  font-size .3rem
.el-select .el-input__inner
  padding-right .9rem
.el-input__inner
  line-height .9rem
  height .9rem
.el-input__suffix
  right .1rem
// .rel_select .el-select .el-input__inner
//   padding-right .9rem
// .rel_select .el-input__suffix
//   right .6rem
.el-select .el-input .el-select__caret
  line-height .9rem
  font-size .4rem
.el-radio__label
  font-size: .28rem
  padding-left: .1rem
  vertical-align: top
.el-radio__inner
  _wh(.28rem,.28rem)
.el-radio__inner::after
  _wh(.08rem,.08rem)
.el-radio__input.is-checked .el-radio__inner 
  border-color: $red
  background: $red
.el-radio__input.is-checked+.el-radio__label
  color#323232
.el-radio__inner:hover
    border-color: $red
// vant日历组件
.van-button__text
  color #fff