/**
 @Element修正
 @Name: Hui-Vue2
 @Author: HAIFAN
 @version:8.4.3
 @date:2025年05月24日20:03:31
 */

.el {
  // 加载
  &-loading {
    &-spinner {
      .el-loading-text {
        color: $primary;
      }
      .path {
        stroke: $primary;
      }
    }
  }
  // 右侧系统选择
  &-drawer {
    width: 120px !important;
    &__header {
      margin-bottom: 20px;
      span {
        display: block;
        outline: none;
      }
    }
  }
  // tabs
  &-tabs {
    &__item {
      font-size: 16px;
      color: #97a8be;
      &:hover {
        color: $primary !important;
      }
      &.is-active {
        background-color: $primary;
        color: #fff !important;
      }
    }
    &__active-bar {
      background-color: $primary !important;
    }

    &__nav-wrap::after {
      height: 1px !important;
    }
  }

  // 侧边栏
  &-scrollbar {
    height: 100%;
  }
  // 面包屑
  &-breadcrumb {
    line-height: 50px;
    margin-left: 16px;

    &__inner {
      a {
        &:hover {
          color: rgba($primary, $alpha: 1);
        }
      }
      .no-redirect {
        color: #97a8be;
      }
    }
  }
  // input
  &-input {
    &__inner {
      &:focus,
      &:active,
      &:hover {
        border-color: $primary;
      }
    }
  }
  // 多级下拉框
  &-cascader {
    &-node {
      &.hover,
      &:hover {
        color: $primary;
        background-color: rgba($primary, $alpha: 0.05);
      }
      &.in-active-path,
      &.is-active,
      &.is-selectable.in-checked-path {
        color: $primary;
      }
    }

    .el-input {
      &__inner {
        &:focus {
          border-color: $primary;
        }
      }
      &.is-focus {
        .el-input__inner {
          border-color: $primary;
        }
      }
    }
  }
  //textarea文本框
  &-textarea {
    .el-input__count {
      background: transparent;
    }
  }
  // date-选择器
  &-date {
    &-editor {
      &.el-input {
        width: 100%;
      }
      &.el-input__inner {
        width: 100%;
      }
    }
  }
  // date日期区间选择器
  &-date {
    &-editor {
      &--daterange {
        &.el-input {
          width: 100%;
        }
        &.el-input__inner {
          width: 100%;
        }
      }
      &--timerange {
        &.el-input {
          width: 100%;
        }
        &.el-input__inner {
          width: 100%;
        }
      }
    }
  }
  // 弹窗
  &-dialog {
    width: 30%;
    &__header,
    &__footer {
      text-align: center;
    }
    &__body {
      padding: 30px 30px 0 30px;
    }
    &__footer {
      .hui-btn {
        padding: 9px 16px;
        font-size: 12px;
        border-radius: 3px;
      }
    }

    // 弹窗加滚动条
    &.exceed-dialog {
      height: 750px;
      overflow: hidden;
      .el-dialog__body {
        height: 640px;
        overflow-y: scroll;
        padding-bottom: 30px;
        background-color: $g-100;
      }
    }
  }
  // 下拉菜单
  &-dropdown {
    &-menu {
      border: none;
      a {
        display: block;
      }
      &__item {
        transition: all 0.3s;
        &:hover {
          color: $primary !important;
          background: rgba($primary, $alpha: 0.1) !important;
        }
      }
    }
  }
  // 下拉框
  &-select {
    width: 100%;
    .el {
      &-input.is-focus,
      &-input:active {
        .el {
          &-input {
            &__inner {
              border-color: $primary;
            }
          }
        }
      }
    }

    // 下拉框菜单
    &-dropdown__item {
      &.selected {
        color: $primary !important;
      }
      &.hover,
      &:hover {
        color: $primary;
        background-color: rgba($primary, $alpha: 0.05);
      }
    }
  }
  // 多个下拉框
  &-select {
    & + & {
      margin-left: 10px;
    }
  }
  // 带输入建议的输入框
  &-autocomplete {
    width: 100%;
  }
  // 表格
  &-table {
    // 内容居中
    &.is-center {
      table {
        tr {
          th,
          td {
            text-align: center;
          }
        }
      }

      // 部分局左
      .is-left {
        text-align: left !important;
      }
    }

    // 表格头
    &__header {
      &-wrapper {
        .el-table__header {
          thead {
            color: $g-666;
            tr,
            th {
              background-color: $g-200;
              font-size: $ft-sm;
            }
          }
        }
      }
    }

    // 表格体
    &__body {
      &-wrapper {
        .el-table__body {
          tbody {
            tr {
              td {
                .btn-text {
                  padding: 0;
                  .svg-icon {
                    width: 20px;
                    height: 20px;
                  }
                  // 编辑
                  &.icon-edit {
                    &:hover {
                      .svg-icon {
                        color: $primary;
                      }
                    }
                  }
                  // 删除
                  &.icon-del {
                    &:hover {
                      .svg-icon {
                        color: $red;
                      }
                    }
                  }
                }

                [class*="icon-"],
                .svg-icon {
                  cursor: pointer;
                }

                // 默认字体图标加字体图标
                [class*="icon-"] + [class*="icon-"],
                .svg-icon + [class*="icon-"],
                .svg-icon + .svg-icon {
                  margin-left: 10px;
                }

                // 默认图片
                .user-default {
                  color: $g-500 !important;
                  width: 32px;
                  height: 32px;
                }
                // 图片预览（表格里的小图）
                .el-image {
                  width: 40px;
                  height: 40px;
                  border-radius: 3px;
                }
              }

              // 选中
              &.current-row > td {
                background-color: rgba($primary, $alpha: 0.1);
                color: $primary;
              }
              &:hover > td {
                background-color: rgba($primary, $alpha: 0.05);
              }
            }
          }
        }
      }
    }
  }
  // 表单
  &-form {
    &-item {
      &__content {
        line-height: normal;
      }
    }
  }
  // 多选框组
  &-checkbox {
    width: 20%;
    padding: 10px 0;
    margin-right: 0;

    &:hover {
      .el-checkbox__label {
        color: $primary;
      }
      .el-checkbox__inner {
        border-color: $primary;
      }
    }
    &-group {
      display: flex;
      flex-wrap: wrap;
    }
    // 选择
    &__input {
      &.is-checked + .el-checkbox__label {
        color: $primary;
      }
      &.is-checked,
      &.is-indeterminate {
        .el-checkbox__inner {
          background-color: $primary;
          border-color: $primary;
        }
      }
    }
  }
  // radio选择报错
  input[aria-hidden="true"] {
    display: none !important;
  }

  // 按钮
  &-button {
    &--primary {
      background-color: $primary !important;
      border-color: $primary !important;
      &:hover,
      &:active,
      &:focus {
        color: $white !important;
        opacity: 0.85;
      }
    }
    &--default {
      &:hover,
      &:active,
      &:focus {
        color: $primary;
        border-color: $primary;
        background-color: rgba($primary, $alpha: 0.05);
      }
    }
  }
  // 提示信息
  &-message {
    &-box {
      &__header {
        text-align: center;
      }
      &__btns {
        text-align: center;
        padding: 20px 20px 5px 20px;
      }
    }
  }

  // 单选框
  &-radio {
    &__input {
      &.is-checked {
        & + .el-radio__label {
          color: $primary;
        }
        .el-radio__inner {
          border-color: $primary;
          background-color: $primary;
        }
      }
    }
    &__inner:hover {
      border-color: $primary;
    }
  }
  // 图片
  &-image {
    &-viewer {
      &__wrapper {
        background-color: $white;
      }
      &__close {
        background-color: $white;
      }
    }
  }
  // 图片上传
  &-upload {
    &-list {
      display: flex;
      &--picture {
        position: absolute;
        left: 0px;
        top: 0px;
        .el-upload-list__item-status-label {
          z-index: 9;
          color: $primary;
          background-color: $primary;
          box-shadow: none;
        }
        .el-upload-list__item-thumbnail {
          width: 80px !important;
          height: 80px !important;
          margin-left: 0 !important;
        }
        .el-upload-list__item {
          width: 80px;
          height: 80px;
          border: none !important;
          padding: 0 !important;
          margin: 0 !important;
          float: none;
          transition: none;
          margin-right: 10px !important;

          .el-icon-close {
            z-index: 100;
            color: #f00;
          }

          &-name {
            display: none;
          }
        }
      }
    }
    .el-upload-dragger {
      width: 100%;
      &:hover,
      &:focus,
      &:active {
        border-color: $primary !important;
      }
      .el-upload__text {
        em {
          color: $primary !important;
        }
      }
    }
  }
  &--picture {
    // 树形菜单
    &-tree {
      &-node {
        &_content {
          height: 42px;
          line-height: 42px;
        }
        &_children {
          margin-left: 36px;
        }
        &__expand {
          &-icon {
            color: $primary;
            padding: 6px 10px;
          }
        }
      }
    }
    &-input__suffix {
      color: $primary;
    }
    // 菜单
    &-menu {
      &-item {
        height: 50px;
        line-height: 50px;
        color: $white;
      }
    }
  }

  // 导入弹窗
  .upload-import {
    .el-upload {
      display: block;
    }
  }

  // 定义表单form的尺寸和组件input尺寸
  .el {
    &-form {
      &-item {
        &--200 {
          width: 320px;
          .el-form-item__label {
            width: 120px;
          }
          .el-input--200 {
            width: 200px;
          }
        }
      }
    }
  }
  // 修改默认弹窗尺寸
  .hui-dialog-base {
    width: 484px;
    min-height: 240px;
    .el {
      &-textarea {
        &__inner {
          min-height: 120px;
        }
      }
    }
  }
  // 头像上传尺寸
  .avatar-uploader {
    position: relative;

    img {
      width: 80px !important;
      height: 80px !important;
    }
  }
}