@forward 'element-plus/theme-chalk/src/common/var.scss' with (
  $font-family: (
    '': 'Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif'
  ),
  $switch: (
    'off-color': #dcdfe6
  ),
  $text-color: (
    'placeholder': rgb(204, 204, 204),
    'secondary': #999999,
    'primary': #333333,
    'regular': #666666
  ),
  $checkbox: (
    'disabled-input-fill': #edf2fc
  ),
  $colors: (
    'danger': (
      'base': #f4333c
    ),
    'info': (
      'base': #999999
    ),
    'error': (
      'base': #f4333c
    ),
    'warning': (
      'base': #f5a72b
    )
  ),
  $input: (
    'hover-border-color': #ccc // 'bg-color': red
  ),
  $fill-color: (
    'light': #f5f5f5
  ),
  $common-component-size: (
    'small': 28px
  ),
  $table: (
    'header-bg-color': #eef0f2,
    'text-color': #333333
  ),
  $pagination: (
    'button-width': 30px,
    'button-height': 30px
  ),
  $link: (
    'text-color': #666666
  ),
  $tabs: (
    'header-height': 38px
  ),
  $tree: (
    'text-color': #666666
  )
);

// 如果只是按需导入，则可以忽略以下内容。
// 如果你想导入所有样式:
@use 'element-plus/theme-chalk/src/index.scss' as *;

.sie-ecp {
  .app-main {
    background-color: var(--color-bg-1);
  }
  .el-input.el-date-editor{
    width: 100%;
  }
  // 抽屉样式
  .el-drawer {
    .el-drawer__header {
      padding: 12px 20px;
      margin-bottom: 0;
      background-color: var(--color-bg-4);
      font-weight: 700;
      font-size: var(--size-text-title);
      color: var(--color-text-main);
      box-sizing: border-box;

      .el-drawer__title {
        font-size: 18px;
      }

      .el-drawer__close-btn {
        height: 32px;
        display: flex;
        align-items: center;
      }

      .el-drawer__header > :first-child {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
      }
    }

    .el-drawer__footer:has(.gs-draw-footer) {
      border-top: 1px solid #ebeef5;
    }
  }

  .el-form-item.is-error .el-input__wrapper {
    box-shadow: none !important;
    border-color: var(--el-color-danger) !important;
  }

  // 输入框边框
  .el-input .el-input__wrapper {
    box-shadow: none;
    border: 1px solid var(--color-border-line);
    box-sizing: border-box;
    padding-top: 0;
    padding-bottom: 0;
  }

  .el-form-item .el-date-editor.el-input__wrapper,
  .el-input-group__append,
  .el-input-group__prepend,
  .el-input.is-disabled .el-input__wrapper {
    // box-shadow: none;
    // box-shadow: 0 1px 0 0 var(--el-input-border-color) inset, 0 -1px 0 0 var(--el-input-border-color) inset, -1px 0 0 0 var(--el-input-border-color) inset;
    // border: 1px solid var(--color-border-line);
    box-sizing: border-box;
    padding-top: 0;
    padding-bottom: 0;
    // font-size: 14px;
  }
  .el-input-group__append {
    box-shadow: 0 1px 0 0 var(--color-border-line) inset, 0 -1px 0 0 var(--color-border-line) inset,
      -1px 0 0 0 var(--color-border-line) inset;
  }
  .el-input-group__prepend {
    box-shadow: 1px 0 0 0 var(--color-border-line) inset, 0 1px 0 0 var(--color-border-line) inset,
      0 -1px 0 0 var(--color-border-line) inset;
    .el-select .el-input .el-input__wrapper {
      // border-color: transparent;
      box-shadow: 1px 0 0 0 #f6f6f8 inset, 0 1px 0 0 #f6f6f8 inset, 0 -1px 0 0 #f6f6f8 inset;
      .el-input__inner {
        color: #999;
      }
    }
  }
  .el-input-group--prepend {
    .el-input-group__prepend {
      .el-select {
        .el-input .el-input__wrapper {
          box-shadow: none;
        }
        &:hover .el-input__wrapper {
          box-shadow: none !important;
        }
      }
    }
  }

  .el-input.is-disabled .el-input__wrapper {
    color: #666;
    .el-input__inner {
      -webkit-text-fill-color: #666;
    }
  }

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

  .el-input-group--append > .el-input__wrapper {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

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

  .el-textarea:not(.el-textarea--disabled) {
    .el-textarea__inner {
      box-shadow: none;
      border: 1px solid var(--el-input-border-color);
      transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
      &:focus {
        border-color: var(--el-color-primary);
      }
    }
  }
  .el-form-item.is-error .el-textarea__inner {
    border: 1px solid var(--el-color-danger);
    &:focus {
      border-color: var(--el-color-danger);
    }
  }
  .el-textarea.is-disabled .el-textarea__inner {
    color: #666;
  }

  // 分割线
  .el-divider.el-divider--horizontal {
    border: none;
    background-color: var(--color-border-line);
  }

  // form: label & input wrapper & input inner
  .el-form-item {
    .el-form-item__label {
      color: #666;
    }

    .el-input__wrapper {
      // 修复下拉箭头不对齐问题
      // padding: 0 15px;
      border-color: var(--color-border-line);
    }
    .el-input--prefix .el-input__wrapper {
      padding-left: 8px;
    }

    .el-input__inner {
      color: #666;
    }
  }

  .el-badge__content--danger {
    background-color: #f4333c !important;
  }

  .el-divider__text {
    &.is-left {
      font-size: var(--size-text-base);
    }
    &.is-center {
      font-size: var(--size-text-base);
    }
    &.is-right {
      font-size: var(--size-text-base);
    }
  }

  // select
  // .el-select,
  .gs-dict-cascader {
    width: 100%;
  }

  .el-cascader {
    width: 100%;
  }

  // element弹窗样式
  .el-dialog {
    padding: 0;
    .el-dialog__header {
      padding: 15px 30px;
      background-color: var(--color-bg-4);
      height: 46px;
      line-height: 10px;
      margin: 0;
      .el-dialog__title {
        font-size: var(--size-text-base);
        color: var(--color-text-main);
        font-weight: 700;
      }
      .el-dialog__headerbtn {
        top: 20px;
        right: 20px;
        padding: 0;
        width: 16px;
        height: 16px;
        background: 0 0;
        border: none;
        outline: 0;
        font-size: 16px;
      }
    }
    .el-dialog__body {
      padding: calc(var(--el-dialog-padding-primary) + 10px) var(--el-dialog-padding-primary);
    }
    .el-dialog__footer {
      padding: var(--el-dialog-padding-primary);
    }
  }
  // 折叠面板头部
  .popover-main .el-collapse-item__header {
    line-height: 24px !important;
  }
  .el-collapse-item__header {
    color: #333;
  }

  // el-tooltip样式，由于该组件结构变化，暂时定这个写法
  .el-popper.is-dark {
    z-index: 99999 !important;
    max-width: 80%;
  }

  // 消息弹窗样式
  .el-message.el-message--success {
    min-width: 380px;
    padding: 15px 15px 15px 20px !important;
    background: #e6fbf3 !important;
  }
  .el-message.el-message--warning,
  .el-message.el-message--error,
  .el-message.el-message--info {
    min-width: 380px;
  }
  .el-message.el-message--info {
    background-color: #edf2fc;
  }
  // el-radio-group 普通size字体大小
  .el-radio-group .el-radio-button:not(.el-radio-button--small, .el-radio-button--large) {
    .el-radio-button__inner {
      font-size: 12px;
      padding: 9px 15px;
    }
  }
  // 消息box样式
  .el-message-box {
    .el-message-box__header {
      span {
        font-size: 16px;
        color: #333;
      }
    }

    &__status.el-message-box-icon--warning {
      color: #f5a72b;
    }

    .el-message-box__content {
      p {
        color: #666;
      }
    }

    .el-message-box__btns {
      .el-button {
        padding: 9px 15px;
      }
    }
  }

  .el-tag {
    font-weight: 500;
    &.el-tag--success.el-tag--light {
      background: #e6fbf3;
      color: #00d485;
    }
  }

  // element plus el-select-tags-wrapper 样式修改会element-ui
  // 目前就覆盖默认样式
  .el-select__tags {
    .el-tag--info {
      padding-right: 2px !important;
    }
    .el-tag--default {
      height: 20px;
      padding: 0 5px;
      .el-tag__close {
        margin-left: 6px;
        background-color: #c0c4cc;
        color: #909399;
        width: 11px;
        height: 11px;
        // margin-top: -3px;
      }
    }
  }

  // ---------------------------------

  // 按钮样式
  // .el-button.el-button--danger {
  //   background-color: #f4333c;
  //   border-color: #f4333c;
  // }
  // .el-button.el-button--danger.is-plain {
  //   border-color: var(--el-button-border-color);
  //   background-color: var(--el-button-bg-color);
  // }
  // .el-button.el-button--danger.is-plain:hover {
  //   background-color: #f4333c;
  // }

  .el-button.is-circle {
    width: auto;
    border-radius: 50%;
    padding: 8px;
  }

  // .el-button.is-plain {
  //   @include el-button--ghost();
  // }

  // // 默认按钮
  // .el-button .el-button--default {
  //   padding: 9px 15px;
  //   margin-left: 10px;
  // }

  .el-button:not(.is-link, .is-circle, .is-text, .el-button--text, .el-dropdown__caret-button) {
    padding: 9px 15px;
  }

  .el-link.el-link--danger:hover {
    color: var(--el-color-danger);
  }
  .el-button.is-text {
    padding-left: 0;
    padding-right: 0;
  }

  .el-input-group__append {
    .el-button {
      padding: 9px 20px;
    }
  }
  // 操作按钮类型为text是，点击会改变颜色的问题
  .el-button--text:not(.is-disabled):active {
    color: var(--el-button-active-text-color)
  }

  // 按钮icon
  .el-button [class*='el-icon'] + span {
    margin-left: 6px;
  }

  .el-icon--left {
    margin-right: 6px;
  }

  .el-icon--right {
    margin-left: 6px;
  }

  // 修复按钮点击后变灰的问题
//   .el-button:focus:not(.is-plain):not(.is-link){
//     background-color: var(--el-fill-color-blank);
//   }
  .el-button--primary:focus:not(.is-plain):not(.is-link){
    background-color: var(--el-color-primary);
  }
  .el-button--info:focus:not(.is-plain):not(.is-link){
    background-color: var(--el-color-info);
  }
  .el-button--success:focus:not(.is-plain):not(.is-link){
    background-color: var(--el-color-success);
  }
  .el-button--warning:focus:not(.is-plain):not(.is-link){
    background-color: var(--el-color-warning);
  }
  .el-button--danger:focus:not(.is-plain):not(.is-link){
    background-color: var(--el-color-danger);
  }

  // // fix： 重构按钮的active样式
  button.el-button--primary:active:not(.is-link):not(.is-text):not(.is-disabled) {
    color:var(--el-button-hover-text-color) !important;
    border-color: var(--el-color-primary);
    background-color: var(--el-color-primary);
    outline: 0;
  }
  // 重构text的active样式
  .el-button.is-text:not(.is-disabled):active {
    color: var(--el-button-active-color);
    border-color: transparent;
    background-color: transparent;
}

  // 操作按钮类型为text是，点击会改变颜色的问题
  .el-button--text:not(.is-disabled):active {
    color: var(--el-button-active-text-color)
  }
  .el-button--text:not(.is-disabled):focus {
    background-color: transparent !important;
  }

  // hover
  .el-button.is-link:hover:not(.el-button--success):not(.el-button--warning):not(.el-button--info):not(.el-button--danger),
  .el-button.is-link:focus:not(.el-button--success):not(.el-button--warning):not(.el-button--info):not(.el-button--danger) {
    color: var(--el-color-primary);
  }

  // .el-button--danger.is-link:hover {
  //   color: var(--el-color-danger);
  // }
  .el-button--ghost {
    @include el-button--ghost();
  }

  // $liColor: '-primary', '-success', '-info', '-warning', '-danger';
  // @for $i from 0 to length($liColor) {
  //   button.el-button-#{$i} {
  //     color: var(--el-color#{$i});
  //     border-color: var(--el-color#{$i});
  //     background-color: var(--el-color#{$i});
  //     outline: 0;
  //   }
  // }

  // ------------------------------------

  // 重写small样式
  .el-button--small.is-link {
    font-size: 13px;
  }
  .el-form-item--small .el-form-item__label {
    height: 28px;
    line-height: 28px;
  }
  // .el-button--small,
  // .el-input--small:not(.el-textarea) {
  //   height: 28px;
  // }
  .el-table--small .el-table__cell {
    padding: 6px 0;
  }
  .el-table--small .el-table__header .el-table__cell {
    padding: 4px 0;
  }

  .el-table--default .el-table__cell {
    padding: 8px 0;
  }

  .el-table--large .el-table__cell {
    padding: 10px 0;
  }

  // bug-27919 高级表格设置布局模型行高不变
  // 默认
  .gs-table .el-table--default .el-table__cell {
    padding: 8px 0;
  }
  // small
  .gs-table .el-table--small .el-table__cell {
    padding: 6px 0;
  }
  // large
  .gs-table .el-table--large .el-table__cell {
    padding: 10px 0;
  }

  .gs-table .gs-switch .el-switch__core{
    .is-text {
      font-size: 13px;
      margin-top: 2px;
    }
  }
  .gs-table .gs-switch:not(.is-checked) .el-switch__core {
    background: rgb(244, 244, 244);
    .el-switch__action {
      left: 3px;
    }
    .is-text {
      color: #333;
    }
  }
  /* 按钮 */
  // 按钮图标大小统一
  .el-button {
    .el-icon svg {
      stroke: currentColor;
      stroke-width: 20px;
      color: currentColor;
    }
  }
  // 普通 switch
  .el-switch {
    height: auto;
    .el-switch__core {
      color: #dcdfe6;
    }
  }
  .el-switch--large .el-switch__core .el-switch__action {
    width: 18px;
    height: 18px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  }

  /* 分页器 */
  .el-pagination {
    font-weight: normal;

    &.is-background {
      .btn-next,
      .btn-prev,
      .btn-next:disabled,
      .btn-prev:disabled,
      .el-pager li {
        margin: 0 5px;
        background-color: var(--color-white);
        border: 1px solid var(--color-border-line);
        color: var(--color-text-main);
        font-size: 13px;
        &.is-active {
          color: var(--el-color-white);
          border: 1px solid var(--color-border-line);
          background-color: var(--el-color-primary);
        }
      }
      .btn-prev:disabled {
        color: #ccc;
      }
      .btn-next:disabled {
        color: #ccc;
      }
      .btn-next,
      .btn-prev {
        width: 32px;
      }
      .el-select__wrapper {
        min-height: 30px;
      }
    }

    .el-pagination__total,
    .el-pagination__goto,
    .el-pagination__classifier {
      color: var(--el-pagination-text-color);
      font-size: 13px;
    }
    .el-select .el-input {
      width: 100px;
    }

    .el-pagination__editor {
      width: 46px;
    }
    .el-pagination__jump {
      margin-left: 0;
      .el-input__wrapper {
        padding: 0 3px;
      }
    }
    .el-pagination__goto {
      margin-right: 4px;
      color: var(--el-pagination-text-color);
    }
    .el-pagination__classifier {
      margin-left: 4px;
      color: var(--el-pagination-text-color);
    }
    .el-pagination__sizes {
      margin-right: 10px;
    }
  }
  // 下拉框无数据时字号
  .el-select .el-select-dropdown__empty,
  .el-select-dropdown .el-select-dropdown__empty {
    font-size: 14px;
  }
  /* 滚动条 */
  .el-scrollbar {
    .el-scrollbar__bar.is-horizontal {
      height: 9px !important;
      border-radius: 0;

      .el-scrollbar__thumb {
        height: 9px;
        margin-right: 9px;
      }
    }

    .el-scrollbar__thumb {
      opacity: 1;
      margin-bottom: 9px;
      box-shadow: inset 0 0 5px #eef0f5;
      border-radius: 7px;
    }

    .el-scrollbar__bar.is-vertical {
      width: 9px;
      border-radius: 0;

      .el-scrollbar__thumb {
        width: 9px !important;
        margin-bottom: 9px;
      }
    }
  }

  /* 表格 */
  .el-table {
    .cell {
      padding: 0 10px;
    }
    td.el-table__cell {
      font-size: var(--el-font-size-base);
    }
    th.el-table__cell {
      font-size: var(--el-font-size-extra-small);
    }
    .el-table__empty-text {
      font-size: var(--el-font-size-extra-small);
    }
  }
  /* 输入框 */
  .el-input {
    // 默认中等输入的字体
    &.el-input--default {
      font-size: 13px;
    }
    &:not(.el-input--small):not(.el-input--large) {
      font-size: 13px;
    }
  }
  .el-range-editor:not(.el-range-editor--small, .el-range-editor--large) {
    &.el-input__wrapper .el-range-input {
      font-size: 13px;
    }
  }
  // 默认下拉菜单的字号
  .el-dropdown-menu:not(.el-dropdown-menu--small, .el-dropdown-menu--large) {
    .el-dropdown-menu__item {
      font-size: 13px;
    }
  }
  .el-select .el-input__wrapper {
    padding-right: 10px;
    transition: border-color 0.28s;
  }
  /* 边框hover样式 */
  // 级联选择器
  .el-cascader:not(.is-disabled):hover .el-input__wrapper {
    box-shadow: none;
    border-color: var(--el-input-hover-border-color);
  }
  .el-cascader .el-input.is-focus .el-input__wrapper {
    box-shadow: none;
    border-color: var(--el-input-focus-border-color);
  }
  // 下拉框
  .el-select:not(.el-select--disabled):hover .el-input__wrapper {
    box-shadow: none !important;
  }
  .el-select .el-input:not(.is-disabled):hover .el-input__wrapper {
    border-color: none;
  }
  .el-select .el-input.is-focus .el-input__wrapper {
    box-shadow: none !important;
    border-color: var(--el-select-input-focus-border-color);
  }
  .el-select .el-input .is-focus.el-input__wrapper {
    box-shadow: none !important;
    border-color: var(--el-select-input-focus-border-color);
  }
  .el-input-group--append .el-input-group__append .el-select .el-input.is-focus .el-input__wrapper {
    box-shadow: none !important;
  }
  .el-form-item.is-error .el-select .el-input.is-focus .el-input__wrapper {
    box-shadow: none !important;
  }
  .el-select .el-input.is-disabled .el-input__wrapper:hover {
    box-shadow: none;
  }
  // 下拉prepend/append
  .el-input-group--append .el-input-group__append .el-select .el-input .el-input__wrapper {
    box-shadow: none;
    border: 1px solid var(--color-border-line);
    border-left: 0;
  }
  .el-input-group__prepend,.el-input-group__append {
    box-shadow: none;
    border: 1px solid var(--color-border-line);
  }
  .el-input-group .el-input-group__prepend {
    border-right: none;
  }
  .el-input-group .el-input-group__append {
    border-left: none;
  }
  .el-input-group--prepend .el-input-group__prepend .el-select .el-select__wrapper,
  .el-input-group--append .el-input-group__append .el-select .el-select__wrapper {
    box-shadow: none;
  }
  .el-input-group__prepend .el-select .el-input.el-input--suffix:not(.is-disabled):hover .el-input__wrapper,
  .el-input-group--append .el-input-group__append.el-select .el-input.el-input--suffix:not(.is-disabled):hover .el-input__wrapper {
    border-color: var(--el-border-color-light) !important;
    box-shadow: none;
  }
  .el-input-group__prepend .el-select .el-input--suffix:hover,
  .el-input-group--append .el-input-group__append .el-select .el-input--suffix:hover {
    border-color: var(--el-border-color-light) !important;
  }
  .el-input-group__prepend .el-select .el-input.el-input--suffix.is-focus .el-input__wrapper,
  .el-input-group--append .el-input-group__append .el-select .el-input.el-input--suffix.is-focus .el-input__wrapper {
    box-shadow: none !important;
    border-color: var(--el-border-color-light) !important;
  }
  .el-input-group__prepend .el-select .el-input.el-input--suffix .is-focus.el-input__wrapper,
  .el-input-group--append .el-input-group__append .el-select .el-input.el-input--suffix .is-focus.el-input__wrapper {
    box-shadow: none !important;
    border-color: var(--el-border-color-light) !important;
  }
  // v2下拉框
  .el-select-v2__popper .el-select-dropdown__option-item {
    font-size: var(--el-font-size-base);
  }
  .el-form-item.is-error .el-select-v2__wrapper {
    box-shadow: none;
    border-color: var(--el-color-danger);
  }

  /* 弹出框 */
  .el-popper:not(.el-color-picker__panel) {
    // width: auto !important;
    .el-popconfirm__main {
      margin: 0 0 14px;
      i {
        margin-bottom: 1px;
      }
    }
  }

  /* 按钮 */
  .el-button + .el-button {
    margin-left: 10px;
  }
  .el-button-group .el-button + .el-button {
    margin-left: 0;
  }

  .el-button.is-text:not(.is-disabled):hover,
  .el-button.is-text:not(.is-disabled):focus {
    background-color: initial;
  }

  /* 文本域 */
  .el-textarea textarea {
    padding: 11px 14px 22px 11px;
  }

  /* 页头 */
  .el-page-header__header {
    .el-page-header__icon {
      margin-right: 6px;
      margin-bottom: 0.5px;
      font-size: 18px;
    }
    .el-divider.el-divider--vertical {
      margin: 0 20px;
    }
  }

  /* 时间选择器 */
  // 时间范围
  .el-date-editor.el-date-editor--datetimerange.el-input__wrapper {
    box-shadow: none;
    border: 1px solid var(--color-border-line);
    &:hover {
      border-color: var(--el-input-hover-border-color);
    }
    &.is-active {
      border-color: var(--el-color-primary);
    }
  }
  /* 单选框组 */
  .el-radio {
    .el-radio__label {
      padding-left: 10px;
    }
  }
  .el-radio-group {
    // small
    .el-radio-button.el-radio-button--small .el-radio-button__inner {
      padding: 7px 15px;
    }
    // large
    .el-radio-button.el-radio-button--large .el-radio-button__inner {
      padding: 12px 20px;
    }
    // 默认
    .el-radio-button:not(.el-radio-button--small, .el-radio-button--large) .el-radio-button__inner {
      padding: 9px 15px;
    }
  }

  .el-progress.is-success .el-progress-bar__inner {
    background: #00d485;
  }

  // 去除高级表格头部下拉菜单的悬浮边框
  .gs-table .el-button:focus-visible {
    outline: none;
  }

  /* switch */
  // gs-table switch
  .gs-table .gs-switch .el-switch__core {
    width: 62px !important;
    // border: 1px solid rgb(204 204 204);
  }
  .el-switch.is-checked .el-switch__core .el-switch__inner {
    padding: 0 20px 0 4px;
  }
  .el-switch .el-switch__core .el-switch__inner {
    padding: 0 4px 0 20px;
    // .is-text {
    //   padding-bottom: 1px;
    // }
  }

  // 数字输入框
  .el-input-number__increase:hover ~ .el-input:not(.is-disabled) .el-input__wrapper,
  .el-input-number__decrease:hover ~ .el-input:not(.is-disabled) .el-input__wrapper {
    box-shadow: none;
    border: 1px solid var(--el-input-focus-border-color);
  }
  .el-input-number.is-controls-right .el-input__wrapper {
    padding-right: 50px;
  }

  /* 抽屉 */
  .el-drawer__close-btn:hover i {
    color: inherit;
  }

  /* upload组件 */
  .el-upload-list__item-file-name {
    line-height: initial;
  }
  .el-upload-list__item:first-child {
    margin-top: 10px;
  }
  /***************** 全局所有匹配禁用样式 ****************/
  .is-link[class*='is-disabled'] {
    color: #ccc !important;
  }
  .el-button.is-text > span {
    // color: var(--el-color-primary)
  }
  // 滚动条
  .el-scrollbar__bar.is-vertical {
  }
}