/* 对话框样式 */
.mobile-van-action {
  font-size: 16px;
}

.van-toast {
  padding: 12px;
}

.theme-color {
  color: #409eff;
}

.blue-color {
  color: #4053ff;
}

.red-color {
  color: #e55555;
}

.purple-color {
  color: #8550e1;
}

.light-blue-color {
  color: #3ac3df;
}

.gray-blue-color {
  color: #73c0d4;
}

.yellow-color {
  color: #ffae44;
}

.green-color {
  color: #07c160;
}

.light-brown-color {
  color: #c1ad9a;
}

.deep-purple-color {
  color: #51519a;
}

.orange-yellow-color {
  color: #e57a52;
}

.theme-bgcolor {
  background-color: #409eff;
}

.blue-bgcolor {
  background-color: #4053ff;
}

.red-bgcolor {
  background-color: #e55555;
}

.purple-bgcolor {
  background-color: #8550e1;
}

.light-blue-bgcolor {
  background-color: #3ac3df;
}

.gray-blue-bgcolor {
  background-color: #73c0d4;
}

.gray-bgcolor {
  background-color: #8c8c8c;
}

.light-gray-bgcolor {
  background-color: #bebebe;
}

.yellow-bgcolor {
  background-color: #ffae44;
}

.green-bgcolor {
  background-color: #07c160;
}

.orange-color {
  color: #fa541c;
}

.purple-blue-bgcolor {
  background-color: #6f95ee;
}

.light-brown-bgcolor {
  background-color: #c1ad9a;
}

.red-urgent-state-bgcolor {
  background-color: #e5555529;
}

.yellow-urgent-state-bgcolor {
  background-color: #ffae4429;
}

.theme-urgent-state-bgcolor {
  background-color: #409eff29;
}

.task_pc {
  color: $base-gray-disabled-text-color !important;

  .task_list_flowname {
    color: $base-gray-disabled-text-color !important;
  }

  .task_list_name {
    color: $base-gray-disabled-text-color !important;
  }

  .task_list_user {
    color: $base-gray-disabled-text-color !important;
  }

  .task_list_procDefName {
    color: $base-gray-disabled-text-color !important;
    .task_list_status_end,
    .task_list_status_manualend {
      color: $base-gray-disabled-text-color !important;
    }
  }

  .task_list_duration {
    color: $base-gray-disabled-text-color !important;
  }
  .task_list_deadline {
    opacity: 0.5;
  }
}
.news-content {
  font-size: 14px;
  color: #666;
  margin: 0 16px 16px;
  img {
    width: 100% !important;
  }
}
.task_isback {
  background: linear-gradient(90deg, #fbe4e4 0%, #ffefef 36%, #ffffff 100%);
}

.dialog__min-height {
  min-height: 40vh;
}

.flow-form {
  .online-form {
    .el-row {
      max-width: 100vw;
      .ht-charts {
        padding: 12px 16px;
      }
    }
    .el-row--flex {
      margin-bottom: 0 !important;
    }
  }
  .van-overlay {
    background-color: rgba(0, 0, 0, 0.5);
  }
}
.filter-action {
  min-height:40vh; 
  max-height: 80vh;
  border-radius: 12px 12px 0 0;
  .van-nav-bar {
    .van-nav-bar__content {
      height: 44px;
      .van-nav-bar__text {
        color: #8c8c8c;
      }
      .van-nav-bar__title {
        font-size: 17px;
        color: #1a1a1a;
      }
    }
    &::after {
      border: none;
    }
  }
}
.van-action-sheet__cancel {
  font-size: $base-font-size-default;
}

.van-overlay {
  background-color: rgba(0, 0, 0, 0.5);
}

.mobile-sunpop-content {
  overflow-x: hidden;
  height: calc(80vh - 120px);
  overflow-y: scroll;
}
.van-empty__image {
  width: unset;
}

.placeholder-margin {
  .van-cell__value {
    margin-bottom: 24px;
  }
}
.placeholder-margin.van-field--error {
  .van-cell__value {
    margin-bottom: 0px;
  }
}

.task_list_item {
  &::after {
    border: none !important;
  }
}

.van-tabs--line .van-tabs__wrap {
  height: 40px;
}
.van-tabs {
  .van-tabs__nav {
    height: 40px;
    padding-bottom: 0;
    .van-tab {
      height: 40px;
      line-height: 40px;
      font-size: 16px;
      font-weight: 500;
      .van-info {
        top: 10px;
      }
    }
    .van-tab--active {
      .van-tab__text {
        color: #409eff;
      }
    }
    .van-tabs__line {
      border-radius: 2px;
      height: 3px;
      bottom: 0;
      -webkit-border-radius: 2px;
      -moz-border-radius: 2px;
      -ms-border-radius: 2px;
      -o-border-radius: 2px;
    }
  }
}

.ht-statistical-chart-container,
.ht-combination-tabs,
.ht-process-center {
  .van-tabs__wrap {
    height: 40px;
  }
  .van-tabs__nav {
    // display: inline-flex;
    // display: -webkit-inline-flex; /*webkit*/
    height: 40px;
  }
  .van-tab {
    padding: 0 12px;
    .van-tab__text {
      display: -webkit-box;
      overflow: hidden;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
    }
  }
  .mobile-custom-title {
    .van-tab__text {
      color: #8c8c8c;
      font-size: 18px;
      font-weight: 400;
    }
  }

  .van-tab--active.mobile-custom-title .van-tab__text {
    color: #262626;
    font-weight: bold;
  }
}
.mobile-template-form__detail.template-form--detail {
  .custom-form {
    height: calc(#{$vh} - 46px);
  }
  .has-footer {
    height: calc(#{$vh} - 110px);
  }
  .ht-mobile-relevant__flow {
    .header-btn {
      // top: -48px;
    }
  }
}
.template-preview-container {
  .template-content {
    .form-list--content {
      height: calc(#{$vh} - 104px);
    }
    .has-bottom--btn {
      height: calc(#{$vh} - 168px);
    }
    .has-merge-search {
      height: calc(#{$vh} - 166px);
    }
    .has-search-bottomBtn {
      height: calc(#{$vh} - 228px);
    }
  }
  .filter-action {
    .el-form {
      .mobile-search__container {
        min-height: calc(#{$vh} - 60vh - 110px);
        max-height: calc(#{$vh} - 20vh - 110px);
      }
    }
  }
}
.online-form-wrap {
  width: 100vw;
  overflow-x: hidden;
}
.filter-config {
  .van-dropdown-item__content {
    max-height: 80% !important;
    position: absolute;
  }
}
.dropDown {
  .van-dropdown-item__content {
    max-height: 80% !important;
    position: absolute !important;
  }
}
.van-notify--danger {
  color: #fff !important;
}
.mobile-chart-tabs {
  .van-tabs--line .van-tabs__wrap {
    height: 32px;
  }
  .van-tabs {
    position: static;
    .van-tabs__nav {
      height: 32px;
      line-height: 32px;
      display: flex;
      width: 100%;
      .van-tab {
        height: 32px;
        line-height: 32px;
      }
    }
  }
}
.online-form-wrap.form-table__wrap {
  .mobile-ht-form-item {
    display: flex;
    align-items: center;
    .el-form-item__label {
      position: unset !important;
      transform: unset !important;
      display: flex;
      align-items: center;
    }
    .el-form-item__content {
      flex: 1;
      margin-left: 0 !important;
      line-height: 20px;
      .mobileCellRightIcon {
        margin-right: -4px;
      }
      .mobile-error-field-tail {
        .el-form-item__error {
          bottom: -8px;
        }
      }

      .mobile-number-field-tail {
        .el-form-item__error {
          display: inline-block;
          text-align: right;
        }
      }
      .ht-textarea{
        .mobile-error-field-tail{
          bottom: 8px;
        }
      }
    }
    .has-company-box {
      align-items: center;
    }
  }
  .mobile-ht-form-item.ht-form-item-top-label {
    .el-form-item__label {
      margin-top: 0 !important;
    }
    flex-direction: column;
    .mobile-upload {
      top: -60px;
    }
    .has-value-input {
      .mobile-upload {
        top: -48px;
      }
    }
    .mobile-picture{
      .ht-picture__web-box{
        .btn-wrap{
          position: absolute;
          right: 0;
          top: -44px;
        }
      }
      .has-img{
        .btn-wrap{
          top: -38px;
        }
      }
      
    }
  }
  .has-margin-inputs{
    .inputs{
      margin-bottom: 10px;
      .el-form-item__error{
        bottom: -3px;
      }
    }
    .mobile-checkbox-box,.mobile-radio-box{
      margin-bottom: 0;
      .el-form-item__error{
        bottom: -8px;
      }
    }
    .has-margin-radio-box,.has-margin-checkbox-box{
      margin-bottom: 10px;
      .el-form-item__error{
        bottom: -3px;
      }
    }
    
  }
  .mobile-map-form-item,
  .mobile-relevant-flow__form-item,
  .mobile-qrcode-form-item,
  .mobile-opinion-form-item,
  .mobile-textarea-form-item
   {
    display: block;
    
  }
  .mobile-map-form-item{
    .el-form-item__content{
      margin-left: 120px !important;
    }
  }
}

.readonly-form {
  .has-company-box {
    .field-tail__wrap {
      position: unset;
    }
  }
  .mobile-readonly {
    .num-wrap {
      .num-t {
        top: 0;
      }
    }
  }
}
.mobile-readonly-wrap {
  text-align: right;
  .mobile-readonly {
    .num-wrap {
      .num-t {
        top: -10%;
      }
    }
  }
}
.van-popup{
  .mobile-sunpop-content{
    .mobile-ht-form-item {
      display: flex;
      align-items: center;
      .el-form-item__label {
        position: unset !important;
        transform: unset !important;
        display: flex;
        align-items: center;
      }
      .el-form-item__content {
        flex: 1;
        margin-left: 0 !important;
        line-height: 20px;
        .mobileCellRightIcon {
          margin-right: -4px;
        }
        .mobile-error-field-tail {
          .el-form-item__error {
            bottom: -8px;
          }
        }
  
        .mobile-number-field-tail {
          .el-form-item__error {
            display: inline-block;
            text-align: right;
          }
        }
        .ht-textarea{
          .mobile-error-field-tail{
            bottom: 8px;
          }
        }
      }
      .has-company-box {
        align-items: center;
      }
    }
    .mobile-ht-form-item.ht-form-item-top-label {
      .el-form-item__label {
        margin-top: 0 !important;
      }
      flex-direction: column;
      .mobile-upload {
        top: -60px;
      }
      .has-value-input {
        .mobile-upload {
          top: -48px;
        }
      }
    }
    .has-margin-inputs{
      .inputs{
        margin-bottom: 10px;
        .el-form-item__error{
          bottom: -3px;
        }
      }
      .mobile-checkbox-box,.mobile-radio-box{
        margin-bottom: 0;
        .el-form-item__error{
          bottom: -8px;
        }
      }
      .has-margin-radio-box,.has-margin-checkbox-box{
        margin-bottom: 10px;
        .el-form-item__error{
          bottom: -3px;
        }
      }
      
    }
    .mobile-map-form-item,
    .mobile-relevant-flow__form-item,
    .mobile-qrcode-form-item,
    .mobile-opinion-form-item,
    .mobile-textarea-form-item
     {
      display: block;
      
    }
    .mobile-map-form-item{
      .el-form-item__content{
        margin-left: 120px !important;
      }
    }
    .mobile-upload{
      top: -86px;
    }
    .has-value-input{
      .mobile-upload{
        top: -60px;
      }
    }
  }
}
.el-tooltip__popper{
  width: 80%;
}