@import 'element-variables.scss';

/* 改变 icon 字体路径变量，必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts';

@import '~element-ui/packages/theme-chalk/src/index';
@import '../icon/iconfont.css';

@font-face {
  font-family: 'electronicFont';
  src: url('../fonts/CursedTimerUlil-Aznm.ttf');
}

@font-face {
  font-family: 'YouSheBiaoTiHei';
  src: url('../fonts/YouSheBiaoTiHei.ttf');
}

@font-face {
  font-family: 'LCDATTPhoneTimeDate';
  src: url('../fonts/LCDAT-TPhoneTimeDate-1.ttf');
}


@font-face {
  font-family: 'PingFang SC';
  src: url("../fonts/SourceHanSansSC-Normal-2.woff2");
}

@font-face {
  font-family: 'DaKai-Regular';
  src: url("../fonts/AlimamaDongFangDaKai-Regular.ttf");
}


/*
  思源宋体
*/
@font-face {
  font-family: 'SourceHanSerifCN-Regular';
  src: url("../fonts/SourceHanSerifCN-Regular.otf");
}

@font-face {
  font-family: 'SourceHanSerifCN-Medium';
  src: url("../fonts/SourceHanSerifCN-Medium.otf");
}

@font-face {
  font-family: 'SourceHanSerifCN-SemiBold';
  src: url("../fonts/SourceHanSerifCN-SemiBold.otf");
}

/*
  英文
*/
@font-face {
  font-family: 'Lato-Regular';
  src: url("../fonts/Lato-Regular.ttf");
}

@font-face {
  font-family: 'Lato-Medium';
  src: url("../fonts/Lato-Medium.ttf");
}

@font-face {
  font-family: 'Lato-Bold';
  src: url("../fonts/Lato-Bold.ttf");
}

.el-menu--popup {
  width: 180px;
  background: $--color-white;
  box-shadow: 0 0 10px 0 rgba(43, 148, 220, 0.3);
  border-radius: 8px;
  padding: 8px;
  box-sizing: border-box;

  .el-menu-item {
    height: 40px;
    line-height: 40px;
    border-radius: 8px;
    padding-left: 40px;
    margin-bottom: 8px;

    &:last-child {
      margin-bottom: 0;
    }

    svg, span {
      font-size: 14px;
      font-family: Microsoft YaHei, serif;
      color: #333333;
    }

    &:hover {

      svg, span {
        color: #4080FF;
      }
    }

    &:focus {
    }

    &.is-active {
      width: 100%;
      background: #4080FF;

      svg, span {
        color: #fff;
      }
    }
  }

}

.tooltip-wrapper {
  position: relative;
  display: inline-block;
  padding: 4px 6px;
  top: 10px;
}

.tooltip-wrapper::before {
  content: '';
  position: absolute;
  border-width: 4px 6px 0 6px;
  border-style: solid;
  border-color: transparent;
  border-top-color: black;
  opacity: 0;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
}

.tooltip-wrapper:hover > .msg-log-content {
  opacity: 1;
  position: static;
  display: inline-block;
}

.msg-log-icon {
  position: relative;
  top: -10px;
}

.msg-log-icon:hover + .msg-log-content {
  opacity: 1;
  position: static;
  display: inline-block;
}

.msg-log-content {
  position: absolute;
  background: black;
  text-align: center;
  color: #fff;
  border-radius: 5px;
  padding: 4px 2px;
  min-width: 80px;
  pointer-events: auto;
  opacity: 0;
  left: 50%;
  top: -5px;
  transform: translateX(-50%) translateY(-100%);
}

.tooltip-wrapper:hover::after,
.tooltip-wrapper:hover::before {
  opacity: 1;
}

/* 右侧 */
.tooltip-wrapper:hover[position='right']::before {
  top: 15%;
  left: 8%;
  margin-left: -3px;
  transform: translateY(-50%) rotate(-90deg);
}

.tooltip-wrapper[position='right'] > .msg-log-content {
  top: 50%;
  left: 100%;
  margin-left: 10px;
  transform: translateY(-50%);
}

// 导出按钮的间距
.export-import-container + .export-import-container,
.export-import-container + .el-button,
.el-button + .export-import-container,
.ht-delete-button + .export-import-container {
  margin-left: 10px;
}


/* 层级 */
.v-modal {
  //z-index: 11 !important;
}

/* tab */
.el-tabs {
  width: 100%;
  height: 100%;
}

.el-tag,
.el-input__inner {
  font-size: 13px;
}

.el-tabs__content {
  width: 100%;
  height: 100%;
}

/* 穿梭框 */
.el-transfer {
  height: 100% !important;
  display: flex;
}

.el-transfer-panel__body {
  height: 100% !important;
}

.el-transfer-panel {
  flex: 1 !important;
  height: 100% !important;
}

.el-checkbox-group {
  // height: 458px !important;
}

.el-transfer__buttons {
  width: 10% !important;
  line-height: 584px !important;
}

.el-tree {
  border-right: 1px solid rgb(238, 237, 237);
  border-left: 1px solid rgb(238, 237, 237);
  border-bottom: 1px solid rgb(238, 237, 237);
}

// 全部修改弹层样式高度
.el-dialog__body {
  max-height: 85vh;
  overflow: auto;
}

.cqlt-icon {
  font-size: 28px;
}

.cqlt-icon:hover {
  cursor: pointer;
  color: #409eff;
}

.el-dialog__wrapper {
  background-color: rgba(0, 0, 0, 0.3);
}

.el-input__inner::-webkit-outer-spin-button,
.el-input__inner::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.el-link {
  padding: 0 14px;
  position: relative;

  &:not(:last-child) {
    border-right: 1px solid $--system-border-color2;
  }

  &:first-child {
    padding-left: 0;
  }

  &:last-child {
    padding-right: 0;
  }
}

.el-link--inner,
.el-cascader__search-input,
.el-input--suffix .el-input__inner,
.el-input__inner,
.el-select-dropdown__item span,
.el-message-box__message p,
.el-message-box__title span,
.el-icon-close:before,
.el-icon-plus,
.el-icon-delete,
.el-icon-upload,
.el-icon-upload2,
.el-button span {
  font-size: 14px !important;
}

.el-input__inner, .el-cascader__search-input {
  background-color: $--system-module-color1;
  color: $--color-white;

  &::placeholder {
    font-size: 14px !important;
  }
}

.el-input-group__append {
  border-left: 0;
}

.el-tooltip__popper {
  span {
    font-size: 12px;
  }
}

.el-table__empty-text {
  font-size: 14px;
  color: $--color-text-placeholder;
}

.el-loading-mask {
  z-index: 4;
}

.el-dropdown-menu__item {
  font-size: 14px !important;
  height: 30px !important;
  line-height: 30px !important;
  padding: 0 16px !important;
}

.table-form-item {
  margin-bottom: 20px;

  .el-input {
    .el-input__inner {
      font-size: 14px !important;

      &::placeholder {
        font-size: 14px !important;
      }
    }
  }

  .el-form-item__error {
    padding-top: 5px;
    font-size: 12px !important;
  }
}

.el-input {
  .el-input__icon {
    font-size: 14px;
  }
}

.el-cascader__dropdown {

  .el-cascader-node__label, .el-icon-arrow-right {
    font-size: 13px;
    font-family: Microsoft YaHei, Microsoft YaHei, serif;
  }
}

.el-cascader {

  .el-tag {
    background-color: $--system-box-color1;

    span {
      color: $--color-white;
    }

    span, .el-tag__close {
      font-size: 13px;
    }
  }
}

.el-table td.el-table__cell div {
  font-size: 14px;
}

.el-table {
  border: 1px solid $--system-border-color3;
  background-color: $--system-module-color3;

  &::after, &::before {
    width: 0;
  }

  .el-table__header-wrapper {
    .el-table__header {
      .el-table__cell {
        padding: 12px 0 !important;
        background-color: $--system-module-color3 !important;
        border-color: $--system-module-color3 !important;
        border-bottom: 1px solid $--system-border-color3 !important;

        &.is-required {
          .cell {
            &::before {
              content: '*';
              display: inline-block;
              color: $--color-danger;
              margin-right: 3px;
              font-size: 11px;
              vertical-align: top;
            }
          }
        }

        .cell {
          font-size: 15px;
          color: $--color-white;
          font-weight: 700;
          font-family: PingFang SC-Medium, PingFang SC, serif;
          white-space: nowrap;
        }
      }
    }
  }

  .el-table__body-wrapper {

    /* 滚动条整体 */
    &::-webkit-scrollbar {
      width: 8px !important;
    }

    /* 滚动条滑块 */
    &::-webkit-scrollbar-thumb {
      background: $--system-border-color5;
    }

    /* 滚动条轨道 */
    &::-webkit-scrollbar-track {
      color: transparent;
      border-radius: 0;
      background: $--system-module-color3 !important;
    }


    .el-table__row {

      .el-table__cell {
        background-color: $--system-module-color1;
        border: 0;
        border-bottom: 1px solid $--system-module-color3;
        color: $--system-table-text-color;
      }

      &:hover {
        .el-table__cell {
          background-color: $--system-box-color5 !important;
        }
      }
    }

    .el-table__row--striped {
      .el-table__cell {
        background-color: $--system-module-color1 !important;
      }
    }
  }

}

// 修改整体输入框样式及其组件样式
.el-submenu__title i,
.el-tree-node,
.form-table > tbody > tr > th {
  color: $--color-white !important;
}

.el-table th > .cell,
.el-date-picker__header-label,
.el-date-table th,
.has-gutter tr th > .cell,
.el-table__column-filter-trigger i,
.el-collapse-item__header,
.el-card,
.el-range-editor .el-range-input,
.el-range-separator,
.record-container > span[data-v-452e030f],
.el-popover,
.action-container > span[data-v-1e8bb8cd],
.form-container > span[data-v-35213a62],
.el-icon {
  color: $--color-white !important;
}

.el-input .el-input__inner,
.el-select .el-input__inner,
.el-textarea .el-textarea__inner,
.el-form-item__content .el-range-editor--small.el-input__inner,
.el-range-editor .el-range-input,
.content_top_wrap_form .form_date_picker,
.el-date-editor--monthrange.el-input, .el-date-editor--monthrange.el-input__inner {
  background-color: $--system-input-bgColor;
  border: 1px solid $--system-border-color3;
  color: $--color-white;
}

.el-select .el-select__input {
  color: $--color-white;
}

.is-disabled {
  .el-input__inner, .el-checkbox__inner, .el-textarea__inner {
    background-color: $--system-input-disabled-bgColor !important;
    border: 1px solid $--system-border-color3 !important;
    color: $--color-white;

    &:hover {
      border-color: $--system-border-color3 !important;
    }
  }
}

.el-range-editor.el-input__inner {
  background-color: $--system-input-bgColor;
  border: 1px solid $--system-border-color3;

  &.is-disabled {
    background-color: $--system-input-disabled-bgColor !important;
    border: 1px solid $--system-border-color3 !important;
    color: $--color-white;

    i, .el-range-separator {
      color: $--input-placeholder-color !important;
    }

    .el-range-input {
      color: $--color-text-placeholder !important;
      background-color: $--system-input-disabled-bgColor !important;
    }

    &:hover {
      border-color: $--system-border-color3 !important;
    }
  }
}


.el-card.is-always-shadow,
.el-collapse-item .el-collapse-item__header,
.el-tabs__content .el-table--border, .el-range-input,
.el-input-number.is-controls-right[class*='small'] [class*='decrease'],
.el-popper {
  border: none !important;
}


.el-input {
  background: transparent;

  &.el-click-input {
    .el-input-group__append, .el-input-group__prepend, .el-input__inner {
      cursor: pointer !important;
    }
  }

  .el-input-group__append, .el-input-group__prepend {
    background-color: $--system-module-color3;
    color: $--system-hover-active-text;
    border: 1px solid $--system-border-color3;
    transition: all 0.3s;
    font-size: 14px;
  }

  .el-input-group__prepend {
    border-right: 0;
  }

  .el-input-group__append {
    border-left: 0;
  }

  &.el-input-group--append, &.el-input-group--prepend {
    .el-input__inner {
      &:hover {
        border-color: $--system-border-color3 !important;
      }
    }

    &:hover {
      .el-input-group__append, .el-input-group__prepend, .el-input__inner {
        border-color: $--system-border-color1 !important;
      }
    }
  }
}

.el-input__inner:hover,
.el-textarea__inner:hover,
.el-select:hover {
  border-color: $--system-border-color1 !important;
}

.el-form-item__content .el-upload--picture-card {
  background-color: $--system-module-color1;
  border: 1px dashed #1a4a72;
}

.el-select-dropdown {
  background: $--system-module-color2;

  .el-scrollbar {
    background: transparent;
    border-radius: 5px;
    border: 1px solid $--system-border-color1 !important;

    .el-scrollbar__view {
      background: transparent;

      .el-select-dropdown__item {
        background: $--system-module-color2;

        span {
          color: #fff;
        }

        &.hover {
          background: $--system-active-bgColor;
        }

        &.selected {

          span {
            color: $--system-border-color1;
          }
        }
      }
    }
  }

  .el-select-dropdown__empty {
    color: $--color-text-placeholder;
    border: 1px solid $--system-border-color2 !important;
    border-radius: 5px;
    overflow: hidden;
  }
}

.el-picker-panel {
  border: 1px solid $--system-border-color1 !important;
  background: $--system-module-color2;
  border-radius: 5px;
  box-sizing: border-box;

  .el-picker-panel__body-wrapper {
    background-color: transparent;

    .el-picker-panel__body {

      .el-date-range-picker__time-header {
        border-bottom: 1px solid $--system-border-color2;

        .el-icon-arrow-right {
          color: $--color-white;
        }

        .el-input__inner {
          font-size: 14px;

          &::placeholder {
            font-size: 14px;
          }
        }
      }

      .el-date-picker__header {
        border-bottom: 1px solid $--system-border-color2;

        .el-picker-panel__icon-btn {
          color: $--color-white;

          &:hover {
            color: $--system-hover-active-text;
          }
        }
      }

      .el-date-picker__time-header {
        border-bottom: 1px solid $--system-border-color2;
      }

      .el-picker-panel__content {
        &.is-left {
          border-right: 1px solid $--system-border-color2;
        }

        &.is-right {

        }

        .el-date-range-picker__header {
          * {
            color: $--color-white;
          }

          button {
            &:hover {
              color: $--system-hover-active-text;
            }
          }
        }

        .el-date-table {

          tbody {
            * {
              font-size: 12px;
            }

            tr {
              &:first-child {
                th {
                  border-bottom-color: $--system-border-color2;
                }
              }
            }

            .el-date-table__row {
              td {
                &.disabled {
                  div {
                    background-color: $--system-disabled-bgColor;
                  }
                }


                &.available {
                  div {
                    span {
                      color: $--color-white;
                    }
                  }

                  &.in-range {
                    div {
                      background-color: $--system-active-bgColor;
                    }
                  }

                  &.start-date, &.end-date, &.current {
                    div {
                      span {
                        background-color: $--system-hover-active-text;
                        color: $--color-white !important;
                      }
                    }
                  }

                  &.today {
                    div {
                      span {
                        font-weight: bold;
                        color: $--system-hover-active-text;
                      }
                    }
                  }


                  &:not(.start-date):not(.end-date):not(.current) {
                    &:hover {
                      div {
                        span {
                          color: $--system-hover-active-text;
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        }

        .el-month-table {
          tbody {
            tr {
              td {

                .cell {
                  color: $--color-white;

                  &:hover {
                    color: $--system-hover-active-text;
                  }
                }

                &.current .cell {
                  color: $--system-hover-active-text;
                }

                &.today .cell {
                  font-weight: bold;
                  color: $--system-hover-active-text;
                }

                &.current.today .cell {
                  color: $--color-white;
                }
              }
            }
          }
        }

        .el-year-table {
          tbody {
            * {
              font-size: 14px;
            }


            tr {
              td {

                &.available {
                  .cell {
                    color: $--color-white;
                  }


                  &.current {
                    .cell {
                      color: $--system-hover-active-text;
                    }
                  }

                  &.today {
                    .cell {
                      font-weight: bold;
                      color: $--system-hover-active-text;
                    }
                  }

                  &.current.today {
                    .cell {
                      color: $--color-white;
                    }
                  }

                  &:hover {
                    .cell {
                      color: $--system-hover-active-text;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }

  .el-picker-panel__footer {
    background-color: transparent;
    border-top: 1px solid $--system-border-color2;
  }

  .popper__arrow {
  }
}

.el-time-panel {
  background: $--system-module-color2;
  border: 1px solid $--system-border-color1 !important;
  border-radius: 5px;

  * {
    border-color: $--system-border-color2;
  }

  .el-time-panel__content {
    &::after, &::before {
      border-color: $--system-border-color2;
    }

    .el-time-spinner__item {
      color: $--color-white;

      &:hover {
        background-color: $--system-active-bgColor;
      }

      &.active {
        color: $--system-hover-active-text;
        background-color: transparent;
      }
    }
  }

  .el-time-panel__footer {
    .cancel {
      color: $--color-white;
    }
  }
}

.el-dropdown-menu {
  background: $--system-module-color2;
  border: 1px solid $--system-border-color1 !important;
  border-radius: 5px;

  .el-dropdown-menu__item {
    color: $--color-white;

    &:hover {
      color: $--system-hover-active-text;
      background-color: $--system-active-bgColor;
    }
  }
}

.el-dropdown {
  .el-button-group {
    .el-button {
      background-color: $--system-input-bgColor;
      border: 1px solid $--system-border-color2;
      color: $--color-white;

      &.el-dropdown__caret-button {
        border-left: 0;

        &::before {
          background-color: $--system-border-color2;
        }
      }

      &:hover {
        color: $--system-hover-active-text;
        border-color: $--system-border-color1;
      }
    }
  }
}

.el-checkbox {
  .el-checkbox__input {
    .el-checkbox__inner {
      background-color: $--system-module-color3;
      border: 1px solid $--system-border-color2;

      &:hover {
        border-color: $--system-border-color1;
      }
    }

    &.is-checked, &.is-indeterminate {
      .el-checkbox__inner {
        border-color: $--system-border-color1;
        background-color: $--system-border-color1;
      }
    }
  }


  .el-checkbox__label {
    color: $--color-white;

    span {
      color: $--color-white;
    }
  }

  &.is-disabled {
    .el-checkbox__label {
      color: $--color-text-placeholder;

      span {
        color: $--color-text-placeholder;
      }
    }

    &:hover {
      border-color: $--system-input-disabled-bgColor;
    }
  }

  &.is-checked {
    .el-checkbox__label {
      color: $--system-hover-active-text;

      span {
        color: $--system-hover-active-text;
      }
    }
  }

  &.is-bordered {
    border-color: $--system-border-color2;

    &:hover {
      border-color: $--system-border-color1;
    }
  }

  &.is-bordered.is-checked {
    border-color: $--system-border-color1;
    background-color: $--system-box-color3;

    .el-checkbox__label {
      color: $--system-hover-active-text;

      span {
        color: $--system-hover-active-text;
      }
    }
  }

  &.is-bordered.is-disabled.is-checked {
    border-color: $--system-input-disabled-bgColor;
    background-color: $--system-input-disabled-bgColor;

    .el-checkbox__label {
      color: $--color-text-placeholder;

      span {
        color: $--color-text-placeholder;
      }
    }

    &:hover {
      border-color: $--system-input-disabled-bgColor;
    }
  }
}

.el-radio {

  .el-radio__input {
    .el-radio__inner {
      background-color: $--system-module-color3;
      border: 1px solid $--system-border-color2;

      &:hover {
        border-color: $--system-border-color1;
      }
    }

    &.is-checked {
      .el-radio__inner {
        border-color: $--system-border-color1;
        background-color: $--system-border-color1;
      }
    }
  }

  .el-radio__label {
    color: $--color-white;

    span {
      color: $--color-white;
    }
  }

  &.is-disabled {
    .el-radio__input {
      .el-radio__inner {
        background-color: $--system-disabled-bgColor;
        border: 1px solid $--system-border-color2;

        &:hover {
          border-color: $--system-border-color2;
        }
      }
    }


    .el-radio__label {
      color: $--color-text-placeholder;

      span {
        color: $--color-text-placeholder;
      }
    }

    &:hover {
      border-color: $--system-input-disabled-bgColor;
    }
  }

  &.is-checked {
    .el-radio__label {
      color: $--system-hover-active-text;

      span {
        color: $--system-hover-active-text;
      }
    }
  }

}

.el-tabs {
  .el-tabs__header {
    .el-tabs__nav-scroll {
      .el-tabs__item {
        color: $--color-white;

        &.is-active {
          color: $--system-hover-active-text;
          font-weight: 700;
        }
      }
    }
  }
}

.el-upload__tip {
  color: $--color-text-placeholder;
}

.el-upload-list {
  .el-upload-list__item {
    &:hover {
      background-color: $--system-box-color3;

      .el-upload-list__item-name {
        color: $--system-hover-active-text;
      }

    }

    .el-upload-list__item-name {
      color: $--color-text-placeholder;

      i {
        color: $--color-text-placeholder;
      }
    }

    .el-icon-close {
      color: $--color-text-placeholder;

      &:hover {
        color: $--color-danger;
      }
    }
  }
}

.el-dialog__wrapper {
  background-color: rgba($--color-black, 0.5);
}

.el-message {
  .el-message__icon {
    font-size: 18px !important;
  }

  &.el-message--info {
    background-color: mix($--color-white, mix($--color-black, $--color-info, 80%), 6%) !important;
    border-color: mix($--color-white, mix($--color-black, $--color-info, 60%), 25%) !important;
  }

  &.el-message--success {
    background-color: mix($--color-white, mix($--color-black, $--color-success, 80%), 6%) !important;
    border-color: mix($--color-white, mix($--color-black, $--color-success, 60%), 25%) !important;
  }

  &.el-message--warning {
    background-color: mix($--color-white, mix($--color-black, $--color-warning, 80%), 6%) !important;
    border-color: mix($--color-white, mix($--color-black, $--color-warning, 60%), 25%) !important;
  }

  &.el-message--error {
    background-color: mix($--color-white, mix($--color-black, $--color-error, 80%), 6%) !important;
    border-color: mix($--color-white, mix($--color-black, $--color-error, 60%), 25%) !important;
  }
}

.el-popover {
  background-color: $--system-module-color1;
  border: 1px solid $--system-border-color1 !important;
}

.el-switch {
  .el-switch__core {
    border-color: $--system-disabled-bgColor;
    background-color: $--system-disabled-bgColor;
  }
}

.el-result {
  .el-result__title {
    p {
      color: $--color-text-placeholder;
    }
  }
}

.el-backtop {
  right: 4vw !important;
  bottom: 180px !important;
  width: 60px;
  height: 60px;

  .top-box {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    background-color: $--system-box-color2;
    text-align: center;
    color: $--color-text-placeholder;
    transition: all 0.15s;
    box-shadow: 0 0 6px $--system-disabled-bgColor;
    border-radius: 20%;
    font-size: 24px;
    user-select: none;

    &:hover {
      color: $--system-hover-active-text;
      background-color: $--system-box-color2;
    }
  }
}

.el-drawer__wrapper {

  &.el-drawer-fade-enter-active {
    animation: el-drawer-fade-in 0.2s;
  }

  &.el-drawer-fade-leave-active {
    animation: el-drawer-fade-in 0.1s reverse;
  }

  .el-drawer__container {
    &.el-drawer__open {
      .rtl {
        animation: rtl-drawer-in 0.4s 2ms;
      }
    }

    .el-drawer {
      box-shadow: 4px 0 10px 0 rgba(53, 152, 220, 0.1);
      border-left: 1px solid $--system-border-color2;
      background-color: $--system-background-color;

      .el-drawer__body {
        overflow: hidden;
        height: 100%;
      }
    }
  }
}

.el-cascader__dropdown {
  border-radius: 4px;
  border: 0;

  .el-cascader-panel {
    overflow: hidden;
    border: 1px solid $--system-border-color1;

    .el-cascader-menu {
      background-color: $--system-module-color1;

      .el-cascader-menu__list {
        .el-cascader-node {
          .el-cascader-node__label, .el-icon-arrow-right {
            color: $--color-white;
          }

          &.is-active {
            .el-cascader-node__label, .el-icon-arrow-right {
              color: $--system-hover-active-text;
            }
          }

          &:hover, &:focus {
            background-color: $--system-box-color3;
          }

          &.in-active-path {

            .el-cascader-node__label {
              font-weight: bold;
            }
          }
        }
      }
    }
  }
}

.el-message-box {
  background: $--system-background-color;
  border-color: $--system-border-color3;

  .el-message-box__title {
    color: $--color-white;
  }

  .el-message-box__message {
    color: $--system-table-text-color;
  }
}

.el-descriptions {
  .el-descriptions__body {
    background-color: $--system-module-color1;

    .el-descriptions-row {
      .el-descriptions-item__cell {
        padding: 15px 10px;
        border-color: $--system-border-color2;
        color: $--system-table-text-color;

        &.el-descriptions-item__label {
          width: 10%;
          font-family: PingFang SC-Medium, PingFang SC, serif;
          font-size: 15px;
          background-color: $--system-module-color3;
          color: $--color-white;
        }

        &.el-descriptions-item__content {
          font-size: 15px;

          > * {
            font-size: 15px;
          }

          .text-ellipsis {
            overflow: hidden;
            text-overflow: ellipsis;
            -webkit-line-clamp: 1;
            display: -webkit-box;
            -webkit-box-orient: vertical;
          }

          .high-item {
            display: flex;
            min-height: 340px;
            align-items: center;
          }
        }
      }
    }
  }
}

.el-progress {
  &.is-success {
    .el-progress__text {
      color: $--color-success !important;
    }
  }

  &.is-warning {
    .el-progress__text {
      color: $--color-warning !important;
    }
  }

  &.is-exception {
    .el-progress__text {
      color: $--color-danger !important;
    }
  }

  .el-progress__text {
    color: $--color-primary !important;
  }
}

.el-select {
  .el-select__tags {
    .el-tag {
      background: $--system-box-color1;
      color: $--color-white;
      border: 1px solid $--system-border-color3;
    }
  }
}

.el-form {
  .el-form-item {
    .el-form-item__label {
      color: $--color-white;
    }

    .el-form-item__content {
      .el-select {
        width: 100%;
      }

      .el-input-number .el-input__inner {
        text-align: left;
      }

      .el-date-editor.el-input, .el-date-editor.el-input__inner {
        width: 100%;
      }
    }
  }
}

.el-card {
  background-color: $--system-module-color1;
}

.el-scrollbar__thumb {
  background-color: $--system-border-color6;
}

.el-popper {
  background: $--system-module-color2;
}