@font-face {
  font-family: "FZLTXHJW";
  src: url("../../static/font/FZLTXHJW.TTF") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ArchSans-Thin";
  src: url("../../static/font/ArchSans-Thin.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

// 整体色彩
@base-active-color: #2672ff;
@opacity: 40;
@opacity-light: 10;
@opacity-light2: 20;
@opacity-light3: 30;
@opacity-dark: 70;
@opacity-5: 5;
@opacity-10: 10;
@opacity-20: 20;
@opacity-30: 30;
@opacity-40: 40;
@opacity-50: 50;
@opacity-70: 70;
@opacity-80: 80;
@opacity-100: 100;
@base-gray-color: #ddd; //基础灰色
@base-activeDis-color: #8482f8; //选中禁用
@base-disClick-color: #aaa; //
@base-border-color: #e1e4eb; //边框色
@base-bg-color: #f7f7f9; //背景色
@base-font-color: #303133; //字体色
@base-font-size: 14px; //字体大小
@placeholder-color: #909299; //输入框占位符文字色
@base-font-family: "FZLTXHJW"; //基础字体
@base-color: #363636; //按扭，题目标题 颜色
@base-basic-color: #ffffff; //深色系主题 单独使用
@base-option-color: #606266; //选项基础色
@base-error-color: #fa7070; //异常文字基础色
@base-error-bgColor: #ffebeb; //异常文字基础色
@color9: #909399;

/**/
@base-business-color: #303133; //商务主题 单独使用背景色
@base-activity-color: #fd887b; //活动主题 单独使用背景色

@base-rate-star-color: #fab55a; // 打分题
/**/

/*theme style*/
.q-dark__wrap .errorFailed,
.q-dark__wrap .fail,
.q-dark__wrap .redTips {
  background-color: transparent;
}
.q-dark__wrap .q-option-input {
  background-color: transparent;
}
.q-dark__wrap .icon-btn,
.UploadFile > i,
.q-dark__wrap input::-webkit-input-placeholder,
.q-dark__wrap textarea::-webkit-input-placeholder,
.q-dark__wrap .remark-label,
.q-dark__wrap .number-tips,
.q-dark__wrap .q-proportion-total,
.q-dark__wrap .q-points__score,
.q-dark__wrap .q-footer a,
.q-dark__wrap .q-geo_xy,
.q-dark__wrap .el-icon-date,
.q-dark__wrap .el-icon-time,
.q-dark__wrap .el-icon-date,
.q-dark__wrap .q-score-text .prompt-text .prompt-texts,
.q-dark__wrap .matrix .wj-head-box.score-header {
  color: fade(@base-basic-color, @opacity-40);
}
.q-photo__wrap .q-footer a,
.q-fashion__wrap .q-footer a,
.q-medical__wrap .q-footer a {
  color: fade(@base-basic-color, @opacity-70);
}
.q-dark__wrap .q-autoTable__btn,
.q-dark__wrap q-dark__wrap .qbase .el-button--primary,
.q-dark__wrap .q-geo__btn,
.q-dark__wrap .qbase .el-button--primary:focus,
.q-dark__wrap .option-label,
.q-dark__wrap .matrix .wj-head-box,
.q-dark__wrap .q-geo_street,
.q-dark__wrap .order-remove,
.q-dark__wrap .q-star .score-name,
.q-dark__wrap .tooltips,
.q-dark__wrap .answered {
  color: fade(@base-basic-color, @opacity-70);
}
.q-dark__wrap .matrix table tr td.first-td,
.q-dark__wrap .matrix table tr td.last-td {
  background-color: @base-basic-color;
  background: linear-gradient(
    to top right,
    transparent 0%,
    transparent calc(50% - 1px),
    fade(@base-border-color, @opacity-20) 50%,
    transparent calc(50% + 1px),
    transparent
  );
}
.q-dark__wrap .active .icon-btn,
.q-dark__wrap .icon-checkbox-active,
.q-dark__wrap .icon-radio-acitve,
.q-dark__wrap .q-star .eva-tag,
.q-dark__wrap .el-select-dropdown__item span,
.q-dark__wrap .el-input--suffix .el-input__inner,
.q-dark__wrap .q-vote__info {
  // color: fade(@base-active-color, @opacity-70);
  color: @base-active-color;
}
// .q-dark__wrap .q-classify-unmove .q-option-input,
// .q-dark__wrap .q-classify-moved .q-option-input,
// .q-dark__wrap .q-score-text .prompt-text .prompt-texts,
// .q-dark__wrap .q-autoTable__tile,
// .q-dark__wrap .matrix .wj-head-box,
// .q-dark__wrap .q-option-title,
// .q-dark__wrap .q-score-title,
// .q-dark__wrap .q-blank-title,
// .q-dark__wrap .q-order-title,
// .q-dark__wrap .q-option-input textarea {
// }

.q-dark__wrap .q-option-input,
.q-dark__wrap .q-classify-category-list,
.q-dark__wrap .el-input__inner,
.q-dark__wrap .order-content,
.q-dark__wrap .style-order,
.q-dark__wrap .matrix table tr td,
.q-dark__wrap .q-autoTable__btn,
.q-dark__wrap .order-remove,
.q-dark__wrap .q-classify__btn,
.q-dark__wrap .q-geo__wrap {
  border: 1px fade(@base-border-color, @opacity-20) solid;
}
.q-dark__wrap .q-matrix__table .data-row .option-label:before,
.q-dark__wrap .q-matrix__table .head-row .first-td:before,
.q-dark__wrap .q-matrix__table .data-row .option-label:after,
.q-dark__wrap .q-matrix__table .head-row .first-td:after {
  background-color: fade(@base-border-color, @opacity-20);
}
.q-matrix__title .q-row-title {
  color: rgba(48, 49, 51, 0.7);
}
.q-dark__wrap .q-option-title,
.q-dark__wrap .q-score-title,
.q-dark__wrap .q-blank-title,
.q-dark__wrap .q-order-title,
.q-dark__wrap .matrix .wj-head-box,
.q-dark__wrap .q-autoTable__tile {
  color: rgba(255, 255, 255, 0.7);
}
.q-dark__wrap .q-color .q-score .q-score-box {
  border-right: 0;
}
.q-dark__wrap .q-ribbon-color .q-score .q-score-item {
  color: fade(@base-basic-color, @opacity-70);
  border: 1px fade(@base-basic-color, @opacity-20) solid;
  border-right: 0;
}
.q-dark__wrap .q-geo__address,
.q-dark__wrap .q-ribbon-color .q-score .q-score-item:last-child {
  border-right: 1px fade(@base-border-color, @opacity-20) solid;
}
.q-dark__wrap .question-list-content .q-box,
.q-dark__wrap .q-upload__wrap {
  border-top: 1px fade(@base-border-color, @opacity-20) dashed;
}
.q-dark__wrap .q-matrix__groupWrap .q-martix__rowsWrap .q-matrix__optionWrap,
.q-dark__wrap .matrix .data-row {
  border-bottom: 1px fade(@base-border-color, @opacity-20) dashed;
}
.q-dark__wrap .q-autoTable__box .data-row {
  border-bottom: 0;
}
.q-dark__wrap .slider .tips i {
  border-top: 0.12rem fade(@base-active-color, @opacity-20) solid !important;
}
.q-dark__wrap .q-btn__arrowdown i {
  border-color: fade(@base-active-color, @opacity-20) transparent transparent
    transparent;
}
.q-dark__wrap .q-btn__arrowup i {
  border-color: transparent transparent fade(@base-active-color, @opacity-20)
    transparent;
}

.q-custom-tips__wrap {
  background: @base-active-color;
  border: 1px solid @base-active-color;
}
.q-custom-tips__wrap .q-tips__box {
  border: 1px solid @base-active-color;
}
.q-custom-tips__text:before {
  border-top: 6px solid fade(@base-active-color, @opacity-40);
}
.q-dark__wrap .q-classify-option,
.q-dark__wrap .q-classify-category,
.q-dark__wrap .full-text .order-content,
.q-dark__wrap .q-proportion-input textarea:disabled,
.q-dark__wrap .q-proportion-input textarea[disabled],
.q-dark__wrap .matrix table tr.head-row td,
.q-dark__wrap .matrix table tr td.option-label,
.q-dark__wrap .q-autoTable__box .data-row,
.q-dark__wrap .q-files__default,
.q-dark__wrap .q-geo__wrap,
.q-dark__wrap .q-geo__clear {
  background-color: fade(@base-basic-color, @opacity-5);
}
.q-dark__wrap .slider,
.q-dark__wrap .slider_point,
.q-dark__wrap .q-matrix__repeatHeaderBox {
  background-color: fade(@base-basic-color, @opacity-20);
}
.q-dark__wrap .q-classify-head,
.q-dark__wrap .el-select .el-input .el-select__caret,
.q-dark__wrap .q-option-input,
.q-dark__wrap .tips-number,
.q-dark__wrap .q-theme_null,
.q-dark__wrap .q-files__name,
.q-dark__wrap .q-tips__text {
  color: fade(@base-basic-color, @opacity-70);
}
.q-dark__wrap .q-classify-category-name {
  background-color: fade(@base-basic-color, @opacity-5);
  color: fade(@base-basic-color, @opacity-50);
}
.q-dark__wrap .unmovedClass > span:after {
  color: fade(@base-basic-color, @opacity-30);
}
.q-dark__wrap .el-input__inner,
.q-dark__wrap .q-classify-category-list,
.q-dark__wrap .q-order__active .q-order__box,
.q-dark__wrap .matrix table tr td,
.q-dark__wrap .matrix table tr.even-color,
.q-dark__wrap
  .matrix
  table
  tr.even-color
  td
  .q-dark__wrap
  .q-classify-category-list {
  background-color: transparent !important;
}
.q-dark__wrap .q-order .active,
.q-dark__wrap .q-order .rder-content:hover {
  background-color: @base-basic-color;
  border: 1px @base-basic-color solid;
}
.q-dark__wrap .q-matrixRow__close {
  color: fade(@base-basic-color, @opacity-30);
}
/*深色系移动端提示样式*/
.q-dark__wrap .van-toast {
  background-color: #fff;
}
/*深色系单独设置排序题*/
.q-business__wrap .q-order .active .q-order-title,
.q-business__wrap .q-ribbon-color .q-score .color-active {
  color: @base-business-color;
}
.q-business__wrap .q-ribbon-color .q-score .color-active {
  border: 1px @base-business-color solid;
}
.q-business__wrap .q-ribbon-color .q-score .color-active:last-child {
  border-right: 0;
}
.q-business__wrap .q-matrix__repeatHeaderBox .q-option-title {
  color: fade(@base-basic-color, @opacity-30);
}
.q-business__wrap .q-matrix__repeatHeaders .data-row .q-matrix-row {
  color: fade(@base-basic-color, @opacity-50);
}
.q-business__wrap .q-order__active .q-order__box,
.q-business__wrap .slider .tips {
  background-color: @base-business-color !important;
}
// 排序题
.q-business__wrap .q-order .order-content.active .q-option-input {
  border: 1px @base-border-color solid;
  color: @color9;
  input::placeholder {
    color: @color9;
  }
}
.q-activity__wrap .q-order .order-content.active .q-option-input {
  input::placeholder {
    color: fade(@base-activity-color, @opacity-70);
  }
}
/*商务风格移动端文字颜色*/
.q-business__wrap .van-toast {
  color: #606266;
}
.q-activity__wrap .q-matrix__repeatHeaderBox .q-option-title {
  color: fade(@base-basic-color, @opacity-50);
}
.q-activity__wrap .q-matrix__repeatHeaders .data-row .q-matrix-row {
  color: fade(@base-basic-color, @opacity-70);
}
.q-activity__wrap .q-order .active .q-order-title,
.q-activity__wrap .q-ribbon-color .q-score .color-active {
  color: @base-activity-color;
}
.q-activity__wrap .q-order__active .q-order__box,
.q-activity__wrap .slider .tips {
  background-color: @base-activity-color !important;
}
.q-activity__wrap .q-ribbon-color .q-score .color-active {
  border: 1px @base-activity-color solid;
}

/*活动风格移动端文字颜色*/
.q-activity__wrap .van-toast {
  color: #fdaa91;
}
.q-business__wrap .el-popper[x-placement^="top"] .popper__arrow::after,
.q-business__wrap .el-popper[x-placement^="top"] .popper__arrow {
  border-top-color: fade(@base-business-color, @opacity-20);
}
.q-business__wrap .el-popper[x-placement^="right"] .popper__arrow::after,
.q-business__wrap .el-popper[x-placement^="right"] .popper__arrow {
  border-right-color: fade(@base-business-color, @opacity-20);
}
.q-business__wrap .el-popper[x-placement^="bottom"] .popper__arrow::after,
.q-business__wrap .el-popper[x-placement^="bottom"] .popper__arrow {
  border-bottom-color: fade(@base-business-color, @opacity-20);
}
.q-business__wrap .el-popper[x-placement^="left"] .popper__arrow::after,
.q-business__wrap .el-popper[x-placement^="left"] .popper__arrow {
  border-left-color: fade(@base-business-color, @opacity-20);
}
.q-business__wrap .q-custom-tips__text {
  color: fade(@base-business-color, @opacity-70);
}
.q-activity__wrap .q-custom-tips__text {
  color: fade(@base-activity-color, @opacity-70);
}
// .q-business__wrap .van-picker__cancel,
// .q-business__wrap .van-picker__confirm {
//color: @base-business-color !important;
// }
.q-activity__wrap .van-picker__cancel,
.q-activity__wrap .van-picker__confirm {
  color: @base-activity-color !important;
}
.q-business__wrap {
  .van-picker__confirm,
  .van-picker__cancel {
    color: #518eff !important;
  }
  .van-picker {
    background-color: #303133;
  }
  .van-picker__mask {
    background-image: linear-gradient(
        180deg,
        hsla(0, 0%, 18%, 0.9),
        hsla(0, 0%, 18%, 0.4)
      ),
      linear-gradient(0deg, hsla(0, 0%, 18%, 0.9), hsla(0, 0%, 18%, 0.4));
  }
  .van-ellipsis {
    color: @base-basic-color;
  }
}

.q-activity__wrap .q-order .order-content.active .q-option-input {
  border: 1px fade(@base-activity-color, @opacity-40) solid;
  color: fade(@base-activity-color, @opacity-70);
}

.q-activity__wrap .el-popper[x-placement^="top"] .popper__arrow::after,
.q-activity__wrap .el-popper[x-placement^="top"] .popper__arrow {
  border-top-color: fade(@base-activity-color, @opacity-20);
}
.q-activity__wrap .el-popper[x-placement^="right"] .popper__arrow::after,
.q-activity__wrap .el-popper[x-placement^="right"] .popper__arrow {
  border-right-color: fade(@base-activity-color, @opacity-20);
}
.q-activity__wrap .el-popper[x-placement^="bottom"] .popper__arrow::after,
.q-activity__wrap .el-popper[x-placement^="bottom"] .popper__arrow {
  border-bottom-color: fade(@base-activity-color, @opacity-20);
}
.q-activity__wrap .el-popper[x-placement^="left"] .popper__arrow::after,
.q-activity__wrap .el-popper[x-placement^="left"] .popper__arrow {
  border-left-color: fade(@base-activity-color, @opacity-20);
}
/*element-ui日期空间*/
.q-business__wrap .el-date-table td:hover,
.q-business__wrap .el-date-table td.today span {
  color: fade(@base-business-color, @opacity-50) !important;
}
.q-business__wrap .el-date-table td.current:not(.disabled) span {
  color: fade(@base-active-color, @opacity-50) !important;
  background-color: fade(@base-business-color, @opacity-50) !important;
}
.q-activity__wrap .el-date-table td:hover,
.q-activity__wrap .el-date-table td.today span {
  color: fade(@base-activity-color, @opacity-70) !important;
}
.q-activity__wrap .el-date-table td.current:not(.disabled) span {
  color: fade(@base-active-color, @opacity-70) !important;
  background-color: fade(@base-activity-color, @opacity-50) !important;
}
/*element-ui日期空间*/
/*深色系单独设置排序题*/
.q-business__wrap .el-select-dropdown {
  background-color: @base-business-color;
  border: 1px fade(@base-basic-color, @opacity-20) solid;
}
.q-activity__wrap .el-select-dropdown {
  background-color: @base-activity-color;
  border: 1px fade(@base-basic-color, @opacity-20) solid;
}
.q-dark__wrap .q-image-select .option-label .img-view-wrap {
  background-color: transparent;
}
.q-dark__wrap .q-image-select .option-label .img-view,
.q-dark__wrap .q-image-select .option-label .q-label__wrap {
  border: 1px fade(@base-basic-color, @opacity-20) solid;
}

@media (max-width: 641px) {
  .q-autoTable__box .data-row {
    background-color: @base-bg-color;
  }
  .q-dark__wrap .q-autoTable__box .data-row {
    background-color: fade(@base-bg-color, @opacity-5);
  }
  .q-dark__wrap .q-footer__box {
    margin: 0;
  }
  .q-dark__wrap .question-list-content .q-box {
    border-top: 0px fade(@base-border-color, @opacity-20) dashed;
  }
  .q-photo__wrap .q-footer a,
  .q-fashion__wrap .q-footer a,
  .q-medical__wrap .q-footer a {
    color: @placeholder-color;
  }
}
/*theme style*/

/*评价题*/
.q-star .eva-active {
  color: @base-active-color;
  border: 1px fade(@base-active-color, @opacity-30) solid;
}
//商务活动主题
.q-activity__wrap,
.q-business__wrap {
  .calendarPc .el-input--prefix .el-input__inner:hover {
    border-color: rgba(255, 255, 255, 0.7) !important;
  }
  .el-input--suffix .el-input__inner:hover {
    border-color: rgba(255, 255, 255, 0.7) !important;
  }
}
.q-business__wrap {
  [class*="van-hairline"]::after {
    border-top: 1px solid #454647;
    border-bottom: 1px solid #454647;
  }
  .van-picker__toolbar {
    border-bottom: 1px solid #454647;
  }
}
//餐饮主题
.q-food__wrap {
  .calendarPc .el-input--prefix .el-input__inner:hover {
    border-color: #fa9d5a !important;
  }
}

//时尚主题
.q-fashion__wrap {
  .calendarPc .el-input--prefix .el-input__inner:hover {
    border-color: #a2cbe7 !important;
  }
}
//医疗主题
.q-medical__wrap {
  .calendarPc .el-input--prefix .el-input__inner:hover {
    border-color: #76bdb7 !important;
  }
}

// 商务主题
.q-business__wrap {
  .q-order__box2 .q-order__name {
    color: rgba(48, 49, 51, 0.7);
  }
}
//活动主题
.q-activity__wrap {
  .q-order__box2 .q-order__name {
    color: fade(@base-activity-color, @opacity-70);
  }
}

//商务主题 的矩阵题首列有颜色
.q-business__wrap .matrix table tr td,
.q-business__wrap .matrix table tr.even-color,
.q-business__wrap
  .matrix
  table
  tr.even-color
  td
  .q-dark__wrap
  .q-classify-category-list {
  background-color: fade(@base-business-color, @opacity-100) !important;
}
//活动主题 的矩阵题首列有颜色
.q-activity__wrap .matrix table tr td,
.q-activity__wrap .matrix table tr.even-color,
.q-activity__wrap
  .matrix
  table
  tr.even-color
  td
  .q-dark__wrap
  .q-classify-category-list {
  background-color: fade(@base-activity-color, @opacity-100) !important;
}

// 打分
.q-dark__wrap .q-star .hoverActive {
  .iconfont {
    color: rgba(255, 255, 255, 0.7) !important;
  }
  .circleNumber {
    color: @base-basic-color !important;
    border-color: fade(@base-basic-color, @opacity-50);
    background: fade(@base-basic-color, @opacity-20);
  }
}
.q-business__wrap .q-star .hoverActive {
  .iconstar {
    color: #fcd9ac;
  }
}

.q-dark__wrap .q-star .hoverInActive {
  // .iconfont {
  // color: rgba(255, 255, 255, 0.4) !important;
  // }
  .circleNumber {
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: transparent;
  }
}

.q-dark__wrap .q-star .score-active {
  .iconfont {
    color: @base-basic-color !important;
  }
  .iconstar {
    color: @base-rate-star-color !important;
  }
  .circleNumber {
    color: @base-font-color !important;
    background: @base-basic-color;
    border-color: @base-basic-color;
  }
}

.q-dark__wrap .q-star .q-score-item .iconfont,
.q-dark__wrap .q-star .q-exc-item .iconfont,
.q-dark__wrap .q-mtrix-star .q-score-item .iconfont,
.q-dark__wrap .q-mtrix-star .q-exc-item .iconfont,
.q-dark__wrap .q-star .eva-active {
  color: fade(@base-basic-color, @opacity-20);
}
.q-activity__wrap .q-star .q-score-item .iconfont,
.q-activity__wrap .q-star .q-exc-item .iconfont,
.q-activity__wrap .q-mtrix-star .q-score-item .iconfont,
.q-activity__wrap .q-mtrix-star .q-exc-item .iconfont {
  color: fade(@base-basic-color, @opacity-40);
}
.q-activity__wrap .q-star .eva-active {
  color: fade(@base-active-color, @opacity-70);
  background-color: fade(@base-active-color, @opacity-20);
}

.q-activity__wrap .q-star {
  .hoverActive .iconfont {
    color: fade(@base-basic-color, @opacity-70) !important;
  }
  .hoverInActive .iconfont {
    color: fade(@base-basic-color, @opacity-40) !important;
  }
  .score-active {
    .iconfont {
      color: @base-basic-color;
    }
    .iconstar {
      color: @base-basic-color !important;
    }
  }
}

.q-dark__wrap .q-star .score-active .score-number {
  color: @base-font-color;
  background: fade(@base-basic-color, @opacity-80);
}
.q-business__wrap .q-star .score-active .score-number.star {
  color: @base-basic-color;
  background: @base-rate-star-color;
}

.q-activity__wrap {
  .q-star .score-active {
    .score-number {
      color: #fd8278;
    }
  }
}

// no_apply按钮
.q-business__wrap {
  .no-apply-btn {
    .q-label__box {
      background-color: fade(@base-basic-color, @opacity-10) !important;
      .icon-radio {
        background: transparent !important;
      }
    }
    &.active {
      .q-label__box {
        .icon-radio {
          color: fade(@base-basic-color, @opacity-70) !important;
        }
      }
    }
  }
}
.q-activity__wrap {
  .no-apply-btn {
    .q-label__box {
      background-color: fade(@base-basic-color, @opacity-10) !important;
      .icon-radio {
        background: transparent !important;
      }
    }
    &.active {
      .q-label__box {
        .icon-radio {
          color: fade(@base-basic-color, @opacity-100) !important;
        }
      }
    }
  }
}

.locale-changer-box-popup-info {
  .click-button {
    color: @base-basic-color;
    background: @base-active-color;
  }
  .icon-btn {
    color: #c0c4cc;
  }
  .popup-info-item.active {
    .icon-btn {
      color: @base-active-color;
    }
  }
}

.q-business__wrap {
  .locale-changer-box-popup-info {
    .click-button {
      color: @base-basic-color;
      background: @base-business-color;
    }
    .icon-btn {
      color: #c0c4cc;
    }
    .popup-info-item.active {
      .icon-btn {
        color: @base-business-color;
      }
    }
  }
}
.q-activity__wrap {
  .locale-changer-box-popup-info {
    .click-button {
      color: @base-basic-color;
      background: @base-activity-color;
    }
    .icon-btn {
      color: #c0c4cc;
    }
    .popup-info-item.active {
      .icon-btn {
        color: @base-activity-color;
      }
    }
  }
}
