// @import "./iconfont";
@import "./_var";
$color-brand: map_get($generalColor,theme);
page, body {
  font-size: 14px !important;
  height: 100%;
  box-sizing: border-box;
  background: map_get($generalColor, background);
}
// etao-sjht-strat
.containerWidth{
  width: map-get($width, containerWidth);
  margin: 0 auto;
}
.asideWidth{
  width: map-get($width, asideWidth);
}
a{
  text-decoration: none;
  color: #16A8E7;
}
.header_m_top{
  //悬浮顶部的高度
  margin-top: 70px !important;
}
.header_m_top_112{
  //悬浮顶部的高度
  margin-top: 112px !important;
}
.blueColor{
  color: #409EFF;
  cursor: pointer;
}
// etao-sjht-end
.b_line{
  border-top:1px solid #eee;
}
$ellipsis:1 2 3 4 5 6;
@each $key in $ellipsis {
  .ellipsis_#{$key} {
    @include textOver($key)
  }
}
.f_w{
  font-weight:bold;
}
@each $key, $color in $generalColor {
  .f_c_#{$key} {
    color: $color;
  }
  .bg_c_#{$key} {
    background: $color;
  }
  .b_c_#{$key} {
    border:1Px solid $color
  }
}
$fontSizeArr:12 14 16 18 20 24 26 28 30 32 34 36;
@each $px in $fontSizeArr {
  .f_#{$px} {
    font-size: $px+px;
  }
  .l_h_#{$px}{
    line-height:$px+px;
  }
}
$distanceArr: 5 10 20 30 40 50 60;
@each $px in $distanceArr {
  .m_t_#{$px} {
    margin-top:$px+px;
  }
  .m_l_#{$px} {
    margin-left:$px+px;
  }
  .m_r_#{$px} {
    margin-right:$px+px;
  }
  .m_b_#{$px} {
    margin-bottom:$px+px;
  }
  .m_tb_#{$px} {
    margin-top:$px+px;
    margin-bottom:$px+px;
  }
  .m_all_#{$px} {
    margin:$px+px;
  }
  .p_t_#{$px} {
    padding-top:$px+px;
  }
  .p_l_#{$px} {
    padding-left:$px+px;
  }
  .p_r_#{$px} {
    padding-right:$px+px;
  }
  .p_b_#{$px} {
    padding-bottom:$px+px;
  }
  .p_tb_#{$px} {
    padding-top:$px+px;
    padding-bottom:$px+px;
  }
  .p_lr_#{$px} {
    padding-right:$px+px;
    padding-left:$px+px;
  }
  .p_all_#{$px} {
    padding:$px+px;
  }
  .p_m_all_#{$px}{
    padding:$px+px;
    margin:$px+px;
  }
  .split_#{$px} {
    width: $px+px;
    display: inline-block;
  }
  .radius_#{$px}{
    border-radius: $px+px;
  }
}
.clear_float{
  float: none;
  clear: both;
}
// 自定义的一些样式 TaroUI的tab太少了

// .hx_btn{
//   display: flex;
//   align-items: center;
//   justify-content: center;
//   &.plain {
//     background: #fff!important;
//     &.primary{
//       color: #2390E8;
//       border:1px solid #2390E8;
//     }
//     &.theme{
//       color: map_get($generalColor, theme);
//       border:1.90px solid map_get($generalColor, theme);
//     }
//     &.stheme{
//       color: map_get($generalColor, theme);
//       border:1.90px solid map_get($generalColor, stheme);
//     }
//     &.error{
//       color: map_get($generalColor, error);
//       border:1.90px solid map_get($generalColor, error);
//     }
//     &.warning{
//       color: map_get($generalColor, warning);
//       border:1.90px solid map_get($generalColor, warning);
//     }
//     &.success{
//       color: map_get($generalColor, success);
//       border:1.90px solid map_get($generalColor, success);
//     }
//     &.light{
//       color: #fff;
//       border:1.90px solid #fff;
//     }
//     &.black{
//       color: #000;
//       border:1.90px solid #BBBBBB;
//     }
//   }
//   &.radius_m{
//     border-radius: 7px;
//   }
//   &.radius_x{
//     border-radius: 20px;
//   }
//   &.radius_xx{
//     border-radius:  37px;
//   }
//   &.normal{
//     width:100%;
//     height: 100px;
//     text-align: center;
//     font-size: 28px;
//   }
//   &.small{
//     width:100%;
//     height: 80px;
//     text-align: center;
//     font-size: 28px;
//   }
//   &.mini {
//     width:100%;
//     height: 50px;
//     text-align: center;
//     font-size: 24px;
//   }
//   &.black{
//     background: #000;
//     color: #e2dfd1;
//   }
//   &.success{
//     background: map_get($generalColor, success);
//     color: #fff;
//   }
//   &.warning{
//     background: map_get($generalColor, warning);
//     color: #fff;
//   }
//   &.table_header{
//     background: map_get($generalColor, table_header);
//     color: #000;
//   }
//   &.theme{
//     background: map_get($generalColor, theme);
//     color: #fff;
//   }
//   &.stheme{
//     background: map_get($generalColor, stheme);
//     color: #fff;
//   }
//   &.disable{
//     background: map_get($generalColor, border)!important;
//     color: map_get($generalColor, disable);
//   }
//   &.light{
//     background: #fff;
//     color: #000;
//   }
// }
// .hx_textarea{
//   border:1px solid map_get($generalColor,border);
//   border-radius: 5px;
//   margin:auto;
//   width:100%;
//   padding:30px;
//   box-sizing: border-box;
//   font-size:28px;
//   min-height: 200px;
//   line-height: 45px;
// }
// .hx_inpt_place{
//   color: map_get($generalColor,disable);
//   font-size:28px;
// }
// .inpt-placeholder{
//   color: #999;
// }
// .hx_form{
//   @at-root .hx_form_cell{
//     box-sizing: border-box;
//     padding:30px;
//     position: relative;
//     display: flex;
//     align-items: center;
//     &:last-child{
//       &:after{
//         display: none;
//       }
//     }
//     &:after{
//       content: ' ';
//       height:1px;
//       position: absolute;
//       left:30px;
//       right:30px;
//       bottom:0px;
//       background: map_get($generalColor,border);
//     }
//     .hx_inpt,.inpt{
//       padding-left:20px;
//       box-sizing: border-box;
//     }
//     .hx_inpt_cont{
//       flex:1;
//       display: flex;
//       align-items: center;
//     }
//     .cell_label{
//       color: map_get($generalColor,primary_text);
//       font-size:28px;
//     }
//   }

// }

.container{
  position: absolute;
  min-height:100vh;
  width:100%;
  top:0px;
}
//limitcontainer 没有滚动处理的
.limit_container{
  width:100%;
}
.d_flex{
  display: flex;
}
.flex_row{
  flex-direction: row;
  align-items: center;
}
.flex_align_items {
  align-items: center;
}
.flex_justify_cont{
  justify-content: center;
}
.flex_dir{
  flex-direction:column;
}
$flex-direction:(left:flex-start, center:center, right:flex-end, between:space-between);
@each $key, $val in $flex-direction{
  // 垂直方向,align-items不存在between
  @if $key != between {
    // 兼容
    .flex_y_#{$key}{
      @extend .d_flex;
      align-items:#{$val};
      @extend .flex_dir;
    }
    @each $key2, $val2 in $flex-direction{
      .flex_y_#{$key}_#{$key2}{
        @extend .d_flex;
        align-items:#{$val};
        justify-content:#{$val2};
        @extend .flex_dir;
      }
    }
  }
  // 水平方向
  // 兼容
  .flex_x_#{$key}{
    @extend .d_flex;
    justify-content:#{$val};
    @extend .flex_row;
  }
  @each $key2, $val2 in $flex-direction{
    @if $key2 != between {
      .flex_x_#{$key}_#{$key2}{
        @extend .d_flex;
        justify-content:#{$val};
        align-items:#{$val2};
        @extend .flex_row;
      }
    }
  }
}

.flex_1{
  flex:1;
}
.flex_2{
  flex:2;
}
.d_inline_block{
  display: inline-block;
}
.d_block{
  display: block;
}

// card 小程序
// .card_tips_box{
//   background: #fff;
//   width:80vw;
//   display: block;
//   margin: auto;
//   border-radius:10px;
//   position: relative;
//   z-index: map_get($zIndex,pop);
//   box-sizing: border-box;
//   .tit{
//     font-size:32px;
//     color: map_get($generalColor, primary_text);
//     height:110px;
//     line-height: 110px;
//     border-bottom: 1px solid map_get($generalColor,border);
//     text-align: center;
//   }
//   .content{
//     box-sizing: border-box;
//     padding: 50px;
//   }
//   .message{
//     text-align: center;
//     font-size:32px;
//     color: map_get($generalColor, primary_text);
//     display: flex;
//     align-items: center;
//     justify-content: center;
//   }
// }

.t_center{
  text-align: center;
  width:100%;
  display: block;
}
.text_al{
  text-align: left;
}


$radio: 30px;
radio{
  margin-top:5px;
}
radio .wx-radio-input{
  /* 自定义样式.... */
  height: $radio;
  width: $radio;
  border-radius: 50%;
  border: 2px solid map_get($generalColor,border);
  background: transparent;
}
radio .wx-radio-input.wx-radio-input-checked{
  width: $radio; /* 选中后对勾大小，不要超过背景的尺寸 */
  height: $radio; /* 选中后对勾大小，不要超过背景的尺寸 */
  background: #fff;
}
radio .wx-radio-input.wx-radio-input-checked::before{
  border-radius: 50%;/* 圆角 */
  width: $radio; /* 选中后对勾大小，不要超过背景的尺寸 */
  height: $radio; /* 选中后对勾大小，不要超过背景的尺寸 */
  line-height: $radio;
  text-align: center;
  font-size:24px; /* 对勾大小 30rpx */
  color: #fff; /* 对勾颜色 白色 */
  border:2px solid map_get($generalColor,theme);
  background: map_get($generalColor, theme);
  transform:translate(-50%, -50%) scale(1);
  -webkit-transform:translate(-50%, -50%) scale(1);
}
/*checkbox 选项框大小  */
$checkbox: 30px;
checkbox .wx-checkbox-input {
  width: $checkbox;
  height: $checkbox;
}
/*checkbox选中后样式  */
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
  background: map_get($generalColor, theme);
}
/*checkbox选中后图标样式  */
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  font-size: 22px;
  color: #fff;
  background: transparent;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}

.clear_wx_btn{
  background: transparent;
  line-height: inherit;
  padding:0px;
  flex-shrink: 0;
  display: inline-block;
  margin: 0px!important;
  display: flex;
  align-items: center;
  &:after{
    border:none;
  }
}
.hidden{
  display: none!important;
}
.at-message{
  z-index: map_get($zIndex,pop)!important;
  &.custom{
    top:140px!important;
  }
}

@font-face {
  font-family: DIN-Medium;
  src: url('/static/DIN-Medium.otf');
}