/* ==================== 全局基础变量（不随主题变化） ==================== */
:root {
  --font-weight: 400;
  --primaryfamily: 'BarlowSemiCondensedSemiBold', 'sans-serif';
  --secondryfamily: 'Barlow Semi Condensed', 'sans-serif';
  --el-input-height: 46px;
}

/* ==================== 系统主题偏好兜底 ==================== */
@media (prefers-color-scheme: light) {
  :root {
    --color-background: #f7f9f7;
    --color-background-header: #ffffff;
    --color-background-menu: #f5f5f5;
    --color-text: #333333;
    --color-text-deputy: #333333;
    --color-border: #C2C2C2;
    --color-menu-hover: #1966321a;
  }
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-background: #0E0F0E;
    --color-background-header: #24221F;
    --color-background-menu: #24221F;
    --color-text: #e6e6e6;
    --color-text-deputy: #D0D2DE;
    --color-border: #3B3F44;
    --color-menu-hover: #19663233;
  }
}

.el-date-table-cell__text {
  --el-color-primary: #2e9e52;
  --el-datepicker-active-color: #2e9e52;
}

/* ==================== 亮色主题完整样式 ==================== */
html[data-theme="light"] {
  /* 基础色板 */
  --background-color: #f7f9f7; /* 内容容器背景色 */
  --background-header: #ffffff; /* 头部背景色 */
  --menu-hover: #1966321a; /* 侧边栏菜单hover颜色 */
  --sidebar-bg-color: #FCFFFD; /* 侧边栏背景色 */
  --universal-color: #FFFFFF; /* 通用色 */
  --divider-color: #F0F0F0; /* 分割线颜色 */
  --input-border-color: #A8A8A8; /* 输入框颜色 */
  --box-bg-color: #FFFFFF; /* 模块底色 */
  --select-pop-bg-color: #FFFFFF; /* 下拉弹出框背景色 */
  --select-hover-bg-color: #19663210; /* 下拉弹出框item hover背景色 */
  --menu-font-color: #333333; /* 菜单字体颜色 */
  --page-main-title: #1A1A1A; /* 页面一级标题字体颜色 */
  --page-desc-title: #5c5c5c; /* 页面一级标题下描述颜色 */
  --model-title: #333333; /* 页面中小模块下的标题颜色 */
  --special-font-color: #93A674; /* 特殊字体颜色 */
  --font-color: #333333; /* 亮色调的主字体色 */
  --background-menu: #f5f5f5; /* 目录背景色 */
  --font-color-deputy: #333333; /* 亮色调的副字体色 */
  --border-color: #C2C2C2;
  --background-card: #f5f5f5;
  --theme-color: #2e9e52;
  --scrollbar-color: #196632;

  /* 兼容旧变量名（base.less 等文件引用） */
  --background-color-light: var(--background-color);
  --background-header-light: var(--background-header);
  --menu-hover-light: var(--menu-hover);
  --background-menu-light: var(--background-menu);
  --font-color-deputy-light: var(--font-color-deputy);
  --border-light: var(--border-color);
  --background-light-card: var(--background-card);
  --font-color-light: var(--font-color);

  /* 语义化变量 */
  --color-background: var(--background-color);
  --color-background-header: var(--background-header);
  --color-background-menu: var(--background-menu);
  --color-text: var(--font-color);
  --color-text-deputy: var(--font-color-deputy);
  --color-border: var(--border-color);
  --color-menu-hover: var(--menu-hover);

  /* 文本/输入/通用 */
  --font-color1: #757575;
  --font-color2: #1A1A1A;
  --input-select-border: #A8A8A8; /* 输入框/选择框border颜色 */
  --input-select-placeholder: #757575; /* 输入框/选择框默认文字颜色 */
  --input-select-text: #1A1A1A; /* 输入框/选择框输入或选择后文字颜色 */
  --custom-info-button-bg: #F5F5F5; /* info-button背景色 */
  --custom-info-button-text: #1A1A1A; /* info-button文字颜色 */
  --common-info-text: #1A1A1A; /* 通用标题颜色 */
  --common-text1: #2e9e52;
  --kyc-audit-text: #ef2929;
  --common-text2: #F0F0F0;
  --common-text3: #808080;
  --common-text4: #8C8162;

  /* 组件级变量 */
  --custom-button-bg-color: var(--common-text1);
  --custom-button-hover-color: #ffc219c9;
  --custom-button-plain-bg-color: #FAF7F0;
  --custom-checkbox-checked-bg-color: var(--common-text1);
  --general-text-color: var(--common-text1);
  --general-text-hover-color: var(--common-text1);
  --card-bg-color: #FFFFFF;
  --card-bg-color-noChecked: #F0F0F0;
  --card-bg-color-isChecked: #dcf7e120;
  --dialog-bg: #FFFFFF;
  --dialog-bg-secondary: #ffffff;
  --main-container-bg: var(--background-card);

  /* Element Plus 主色 */
  --el-color-primary: #292929;
  --el-menu-bg-color: var(--color-background-menu);

  color: var(--color-text);

  /* ---------------------- 按钮 ---------------------- */
  .el-button--primary {
    background-color: #292929;
    color: #F5F5F5;
  }
  .el-button:hover {
    border-color: transparent;
  }
  .plain-button {
    color: #424242 !important;
    border-radius: 4px !important;
    border: 1px solid #424242 !important;
    &:active {
      border-color: #424242 !important;
    }
    &:hover {
      background-color: transparent;
    }
  }
  .cancel-button,
  .info-button {
    color: var(--custom-info-button-text) !important;
    background: var(--custom-info-button-bg) !important;
    border-radius: 4px !important;
    border: 1px solid var(--custom-info-button-bg) !important;
    &:active {
      border-color: var(--custom-info-button-bg) !important;
    }
  }
  .el-button.is-disabled {
    --el-button-disabled-border-color: var(--common-text1);
  }
  .el-button:focus-visible {
    outline: none;
  }
  .el-button--danger.is-plain {
    background-color: transparent;
    --el-button-text-color: var(--el-color-danger);
    --el-button-border-color: var(--el-color-danger);
    &:hover {
      border-color: var(--el-color-danger);
      color: var(--el-color-danger);
    }
  }

  /* ---------------------- 复选框 / 单选框 ---------------------- */
  .el-checkbox__input.is-checked .el-checkbox__inner {
    background-color: var(--custom-checkbox-checked-bg-color);
    border-color: var(--custom-checkbox-checked-bg-color);
  }
  .el-checkbox__inner:hover {
    border-color: var(--custom-checkbox-checked-bg-color);
  }
  .el-checkbox-button {
    --el-checkbox-button-checked-bg-color: var(--custom-checkbox-checked-bg-color);
    --el-checkbox-button-checked-text-color: var(--el-color-primary);
    --el-checkbox-button-checked-border-color: var(--custom-checkbox-checked-bg-color);
  }
  .el-radio-button {
    --el-radio-button-checked-bg-color: var(--custom-checkbox-checked-bg-color);
    --el-radio-button-checked-text-color: var(--el-color-primary);
    --el-radio-button-checked-border-color: var(--custom-checkbox-checked-bg-color);
    --el-text-color-regular: var(--custom-info-button-text);
  }
  .el-radio-button__inner {
    --el-border: var(--el-border-width) var(--el-border-style) var(--input-border-color);
  }

  /* ---------------------- 输入框 / 选择框 ---------------------- */
  .el-input-group__append,
  .el-input-group__prepend {
    background-color: var(--universal-color);
  }
  .el-dropdown,
  .el-input-group__append,
  .el-select__wrapper,
  .el-input-group__prepend,
  .el-input__wrapper,
  .el-textarea__inner {
    --el-input-border-color: var(--input-border-color);
    --el-border-color: var(--input-border-color);
  }
  .el-input.is-disabled .el-input__wrapper {
    --el-disabled-border-color: var(--input-border-color);
    background-color: #F5F5F5;
  }
  .el-input.is-disabled .el-input__inner {
    --el-disabled-text-color: var(--common-info-text);
  }
  .el-input__wrapper.is-focus,
  .el-textarea__inner.is-focus {
    box-shadow: 0 0 0 0.00521rem var(--custom-checkbox-checked-bg-color) inset;
  }
  .el-input__wrapper:hover,
  .el-textarea__inner:hover {
    --el-input-hover-border-color: var(--input-select-border);
  }
  .el-select__wrapper.is-focused {
    box-shadow: 0 0 0 0.00521rem var(--custom-checkbox-checked-bg-color) inset;
  }
  .el-select__wrapper.is-hovering:not(.is-focused) {
    --el-border-color-hover: var(--input-select-border);
  }
  .el-input,
  .el-date-editor,
  .el-textarea {
    --el-text-color-placeholder: var(--input-select-placeholder);
  }
  .el-input__inner,
  .el-textarea__inner,
  .el-select__placeholder {
    color: var(--input-select-text);
  }
  .el-select__placeholder.is-transparent {
    color: var(--input-select-placeholder);
  }
  .el-select__wrapper .el-select__caret {
    color: #808080;
  }
  .el-select__wrapper.is-disabled .el-select__selected-item {
    color: var(--input-select-text);
  }
  .el-select__wrapper.is-disabled {
    background-color: transparent;
    box-shadow: none !important;
    border: 1px solid #A8A8A8;
  }
  .el-input-group__prepend .el-select__wrapper.is-disabled {
    border-color: transparent;
  }
  .el-range-input {
    color: var(--input-select-text);
    font-family: var(--primaryfamily) !important;
  }
  .el-range-editor.is-active {
    box-shadow: 0 0 0 0.00521rem var(--custom-checkbox-checked-bg-color) inset;
  }

  /* ---------------------- 下拉弹出框 ---------------------- */
  .el-popper.is-light,
  .el-popper.is-light > .el-popper__arrow:before {
    --el-bg-color-overlay: var(--select-pop-bg-color);
    border: transparent !important;
  }
  .el-popper.is-light {
    border: none !important;
  }
  .el-popper .el-picker-panel__icon-btn {
    color: var(--theme-color);
  }
  .el-select-dropdown__item {
    --el-text-color-regular: var(--common-info-text);
  }
  .el-select-dropdown__item.is-hovering {
    --el-fill-color-light: var(--select-hover-bg-color);
  }
  .el-select-dropdown__item.is-selected {
    color: var(--common-text1);
    .option-box {
      .option-content,
      .name {
        color: var(--common-text1) !important;
      }
    }
  }
  .el-dropdown-menu__item:not(.is-disabled):focus {
    --el-dropdown-menuItem-hover-fill: var(--select-hover-bg-color);
  }
  .el-dropdown-menu__item {
    color: #292929;
    font-size: 14px;
  }

  /* ---------------------- 标签页 ---------------------- */
  .el-tabs__active-bar {
    background-color: var(--common-text1);
    height: 0.006rem;
  }

  /* ---------------------- 侧边栏 / 导航栏 ---------------------- */
  .el-menu-item,
  .el-sub-menu,
  .el-sub-menu__title {
    color: var(--common-info-text);
  }
  .layout-container-left {
    background-color: var(--sidebar-bg-color);
    box-shadow: 0 0.005208rem 0.02rem #4745450f, 0 -0.005208rem 0.02rem #4745450f, -0.005208rem 0 0.02rem #4745450f, 0.005208rem 0 0.02rem 0 #4745450f;
  }
  .logo {
    box-shadow: 4px 0.005208rem 0.02rem #47454524;
    background-color: var(--sidebar-bg-color) !important;
  }
  .el-menu,
  .el-menu-item {
    background-color: var(--sidebar-bg-color) !important;
  }
  .el-menu-item:hover {
    background-color: var(--sidebar-bg-color) !important;
  }
  .el-sub-menu__title:hover {
    background-color: var(--color-menu-hover);
  }
  .el-menu-item.is-active {
    color: var(--theme-color) !important;
  }
  .layout-header {
    background-color: var(--sidebar-bg-color);
    box-shadow: 4px 0.005208rem 0.02rem #47454524;
  }
  .layout-menu .el-sub-menu__icon-arrow {
    color: #808080;
  }

  /* ---------------------- 表格 ---------------------- */
  .el-table {
    --el-border-color-lighter: #F0F0F0;
  }
  .el-table tr {
    background-color: #FAFAFA;
    color: #424242;
  }
  .el-table .el-table__header tr {
    color: var(--input-select-text);
  }
  .el-table__header-wrapper,
  .el-table__header {
    min-height: 60px;
  }
  .el-table th.el-table__cell {
    background-color: #F0F0F0;
    color: var(--custom-info-button-text);
  }
  .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
    background-color: #FFFFFF;
  }
  .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
    --el-fill-color-lighter: #FAFAFA;
  }
  .el-form-item__label {
    color: var(--custom-info-button-text);
  }

  /* ---------------------- 分页 ---------------------- */
  .el-pagination.is-background li {
    color: var(--font-color1);
    background-color: #f5f5f5;
  }
  .el-pagination.is-background li.is-active {
    background-color: #292929;
    color: #F5F5F5;
  }
  .el-pagination.is-background .btn-prev,
  .el-pagination.is-background .btn-next {
    background-color: transparent;
    color: var(--font-color1);
  }

  /* ---------------------- 时间轴 ---------------------- */
  .el-timeline-item__content span {
    color: #4C4C4C;
  }

  /* ---------------------- 弹窗 / MessageBox ---------------------- */
  .el-dialog--center {
    background-color: var(--dialog-bg) !important;
    .el-textarea__inner {
      color: #292929;
    }
  }
  .el-dialog {
    --el-dialog-bg-color: var(--card-bg-color);
    .el-dialog__title {
      color: var(--common-info-text);
    }
    .el-dialog__body {
      color: var(--input-select-text);
      font-size: 16px;
    }
  }
  .el-message-box {
    --el-bg-color: #fff;
    .el-message-box__title {
      color: var(--color-text-deputy);
    }
    .el-message-box__headerbtn:hover .el-message-box__close {
      color: var(--color-text-deputy);
    }
  }
  .is-message-box .el-message-box__btns button:first-child {
    color: #424242 !important;
    background: #ffffff !important;
    border-radius: 4px !important;
    border: 1px solid #424242 !important;
    &:active {
      border-color: #424242 !important;
    }
  }

  /* ---------------------- 注册流程 ---------------------- */
  .register_box {
    --el-text-color-primary: #4D4D4D;
    --el-color-primary: #292929;
    .el-dialog {
      background: #fff;
      border-radius: 10px;
    }
    .el-step__icon {
      background: #fff;
    }
    .description {
      background: #FFFDF0;
      border: 1px solid #FFEDB3;
      color: var(--common-info-text);
    }
    .custom_title {
      border-bottom-color: #F0F0F0;
      div:first-child {
        color: var(--common-info-text);
      }
    }
  }

  /* ---------------------- 首页 ---------------------- */
  .homeBox {
    .el-step__icon {
      background: #FFFFFF;
    }
    .custom-table .el-table__cell {
      border-bottom: 1px solid #F0F0F0 !important;
      padding: 10px 0px;
    }
    .el-card.is-always-shadow {
      box-shadow: 0 0.005208rem 0.02rem #4745450f, 0 -0.005208rem 0.02rem #4745450f, -0.005208rem 0 0.02rem #4745450f, 0.005208rem 0 0.02rem 0 #4745450f;
    }
    .title-color {
      color: var(--common-info-text);
    }
  }

  /* ---------------------- 输入框组合 ---------------------- */
  .input-wrapper .el-input-group--prepend > .el-input__wrapper {
    background-color: var(--color-border);
  }
  .input-wrapper .el-input-group--prepend .el-input-group__prepend .el-select__wrapper {
    background-color: var(--color-border);
  }
  .el-select__wrapper.is-disabled,
  .input-wrapper .login-input-code,
  .login-inputs .el-input__wrapper {
    background-color: var(--color-border);
  }

  /* ---------------------- 分割线 ---------------------- */
  .el-divider--vertical,
  .el-divider--horizontal {
    border-color: var(--divider-color);
  }

  /* ---------------------- 特殊业务组件 ---------------------- */
  .page-header .rows {
    background-color: #88e27a1a;
  }
  .card-list .el-scrollbar__thumb {
    --el-scrollbar-bg-color: var(--scrollbar-color);
    --el-scrollbar-hover-bg-color: var(--scrollbar-color);
    --el-text-color-secondary: var(--scrollbar-color);
  }
  .openAccount-box {
    .card-account {
      color: #292929;
      .name {
        color: #424242;
      }
    }
    // .servers-name {
    //   color: var(--custom-info-button-text);
    //   .liveStyle {
    //     color: #38B171;
    //     background: #EBFAF2;
    //   }
    //   .demoStyle {
    //     color: var(--custom-info-button-text);
    //     background: #F0F0F0;
    //   }
    // }
  }
  .note-box-top {
    background-color: #FFFDF0;
    border: 1px solid #FFEDB3;
  }

  /* ---------------------- el-empty ---------------------- */
  .el-empty {
    margin-top: 80px;
    --el-empty-fill-color-0: var(--el-color-white);
    --el-empty-fill-color-1: #fcfcfd;
    --el-empty-fill-color-2: #f8f9fb;
    --el-empty-fill-color-3: #f7f8fc;
    --el-empty-fill-color-4: #eeeff3;
    --el-empty-fill-color-5: #edeef2;
    --el-empty-fill-color-6: #e9ebef;
    --el-empty-fill-color-7: #e5e7e9;
    --el-empty-fill-color-8: #e0e3e9;
    --el-empty-fill-color-9: #d5d7de;
    .el-empty__description p {
      color: #757575;
    }
  }
}

/* ==================== 暗色主题完整样式 ==================== */
html[data-theme="dark"] {
  /* 基础色板 */
  --background-color: #0E0F0E; /* 内容容器背景色 */
  --background-header: #24221F; /* 头部背景色 */
  --menu-hover: #19663233; /* 侧边栏菜单hover颜色 */
  --sidebar-bg-color: #1F1F1F; /* 侧边栏背景色 */
  --universal-color: #1A1918; /* 通用色 */
  --divider-color: #303030; /* 分割线颜色 */
  --input-border-color: #5F5F5F; /* 输入框颜色 */
  --box-bg-color: #1A1918; /* 模块底色 */
  --select-pop-bg-color: #333333; /* 下拉弹出框背景色 */
  --select-hover-bg-color: #19663220; /* 下拉弹出框item hover背景色 */
  --menu-font-color: #E6E6E6; /* 菜单字体颜色 */
  --page-main-title: #C2C2C2; /* 页面一级标题字体颜色 */
  --page-desc-title: #999999; /* 页面一级标题下描述颜色 */
  --model-title: #e6e6e6; /* 页面中小模块下的标题颜色 */
  --special-font-color: #718059; /* 特殊字体颜色 */
  --font-color: #e6e6e6; /* 暗色调的主字体色 */
  --background-menu: #24221F; /* 目录背景色 */
  --font-color-deputy: #D0D2DE; /* 暗色调的副字体色 */
  --border-color: #3B3F44;
  --background-card: #333333;
  --theme-color: #2e9e52;
  --scrollbar-color: #196632;

  /* 兼容旧变量名（base.less 等文件引用） */
  --background-color-dark: var(--background-color);
  --background-header-dark: var(--background-header);
  --menu-hover-dark: var(--menu-hover);
  --background-menu-dark: var(--background-menu);
  --font-color-deputy-dark: var(--font-color-deputy);
  --border-dark: var(--border-color);
  --background-dark-card: var(--background-card);
  --font-color-dark: var(--font-color);

  /* 语义化变量 */
  --color-background: var(--background-color);
  --color-background-header: var(--background-header);
  --color-background-menu: var(--background-menu);
  --color-text: var(--font-color);
  --color-text-deputy: var(--font-color-deputy);
  --color-border: var(--border-color);
  --color-menu-hover: var(--menu-hover);

  /* 文本/输入/通用 */
  --font-color1: #C2C2C2;
  --font-color2: #f5f5f5;
  --input-select-border: #5C5C5C; /* 输入框/选择框border颜色 */
  --input-select-placeholder: #8F8F8F; /* 输入框/选择框默认文字颜色 */
  --input-select-text: #f5f5f5; /* 输入框/选择框输入或选择后文字颜色 */
  --custom-info-button-bg: #424242; /* info-button背景色 */
  --custom-info-button-text: #999999; /* info-button文字颜色 */
  --common-info-text: #DBDBDB; /* 通用标题颜色 */
  --common-text1: #2e9e52;
  --kyc-audit-text: #CCAB51;
  --common-text2: #292929;
  --common-text3: #999999;
  --common-text4: #B3AEA1;

  /* 组件级变量 */
  --custom-button-bg-color: var(--common-text1);
  --custom-button-hover-color: #ffc219c9;
  --custom-button-plain-bg-color: #333029;
  --custom-checkbox-checked-bg-color: var(--common-text1);
  --general-text-color: var(--common-text1);
  --general-text-hover-color: var(--common-text1);
  --card-bg-color: #1F1F1F;
  --card-bg-color-noChecked: #1f1f1f;
  --card-bg-color-isChecked: #19663220;
  --dialog-bg: #333333;
  --dialog-bg-secondary: #1A1C1F;
  --main-container-bg: var(--background-card);

  /* Element Plus 主色 */
  --el-color-primary: #ffffff;
  --el-menu-bg-color: var(--color-background-menu);

  color: var(--color-text);

  /* ---------------------- 按钮 ---------------------- */
  .el-button--primary {
    background-color: #ffffff;
    color: #292929;
  }
  .el-button:hover {
    border-color: transparent;
  }
  .plain-button {
    color: #DBDBDB !important;
    border-radius: 4px !important;
    border: 1px solid #DBDBDB !important;
    &:active {
      border-color: #ffffff !important;
    }
    &:hover {
      background-color: transparent;
    }
  }
  .cancel-button,
  .info-button {
    color: var(--custom-info-button-text) !important;
    background: var(--custom-info-button-bg) !important;
    border-radius: 4px !important;
    border: 1px solid var(--custom-info-button-bg) !important;
    &:active {
      border-color: var(--custom-info-button-bg) !important;
    }
  }
  .el-button.is-disabled {
    --el-button-disabled-border-color: var(--common-text1);
  }
  .el-button:focus-visible {
    outline: none;
  }
  .el-button--danger.is-plain {
    background-color: transparent;
    --el-button-text-color: var(--el-color-danger);
    --el-button-border-color: var(--el-color-danger);
    &:hover {
      border-color: var(--el-color-danger);
      color: var(--el-color-danger);
    }
  }

  /* ---------------------- 复选框 / 单选框 ---------------------- */
  .el-checkbox__input.is-checked .el-checkbox__inner {
    background-color: var(--custom-checkbox-checked-bg-color);
    border-color: var(--custom-checkbox-checked-bg-color);
  }
  .el-checkbox__inner:hover {
    border-color: var(--custom-checkbox-checked-bg-color);
  }
  .el-checkbox-button {
    --el-checkbox-button-checked-bg-color: var(--custom-checkbox-checked-bg-color);
    --el-checkbox-button-checked-text-color: var(--el-color-primary);
    --el-checkbox-button-checked-border-color: var(--custom-checkbox-checked-bg-color);
  }
  .el-radio-button {
    --el-radio-button-checked-bg-color: var(--custom-checkbox-checked-bg-color);
    --el-radio-button-checked-text-color: var(--el-color-primary);
    --el-radio-button-checked-border-color: var(--custom-checkbox-checked-bg-color);
    --el-text-color-regular: var(--custom-info-button-text);
  }
  .el-radio-button__inner {
    --el-border: var(--el-border-width) var(--el-border-style) var(--input-border-color);
  }

  /* ---------------------- 输入框 / 选择框 ---------------------- */
  .el-input-group__append,
  .el-input-group__prepend {
    background-color: #333333;
  }
  .el-dropdown,
  .el-input-group__append,
  .el-select__wrapper,
  .el-input-group__prepend,
  .el-input__wrapper,
  .el-textarea__inner {
    --el-input-border-color: var(--input-border-color);
    --el-border-color: var(--input-border-color);
  }
  .el-input.is-disabled .el-input__wrapper {
    --el-disabled-border-color: var(--input-border-color);
    background-color: #292929;
  }
  .el-input.is-disabled .el-input__inner {
    --el-disabled-text-color: var(--common-info-text);
  }
  .el-input__wrapper.is-focus,
  .el-textarea__inner.is-focus {
    box-shadow: 0 0 0 0.00521rem var(--custom-checkbox-checked-bg-color) inset;
  }
  .el-input__wrapper:hover,
  .el-textarea__inner:hover {
    --el-input-hover-border-color: var(--input-select-border);
  }
  .el-select__wrapper.is-focused {
    box-shadow: 0 0 0 0.00521rem var(--custom-checkbox-checked-bg-color) inset;
  }
  .el-select__wrapper.is-hovering:not(.is-focused) {
    --el-border-color-hover: var(--input-select-border);
  }
  .el-input,
  .el-date-editor,
  .el-textarea {
    --el-text-color-placeholder: var(--input-select-placeholder);
  }
  .el-input__inner,
  .el-textarea__inner,
  .el-select__placeholder {
    color: var(--input-select-text);
  }
  .el-select__placeholder.is-transparent {
    color: var(--input-select-placeholder);
  }
  .el-select__wrapper .el-select__caret {
    color: #808080;
  }
  .el-select__wrapper.is-disabled .el-select__selected-item {
    color: var(--input-select-text);
  }
  .el-select__wrapper.is-disabled {
    background-color: transparent;
    box-shadow: none !important;
    border: 1px solid #5f5f5f;
  }
  .el-input-group__prepend .el-select__wrapper.is-disabled {
    border-color: transparent;
  }
  .el-range-input {
    color: var(--input-select-text);
    font-family: var(--primaryfamily) !important;
  }
  .el-range-editor.is-active {
    box-shadow: 0 0 0 0.00521rem var(--custom-checkbox-checked-bg-color) inset;
  }

  /* ---------------------- 下拉弹出框 ---------------------- */
  .el-popper.is-light,
  .el-popper.is-light > .el-popper__arrow:before {
    --el-bg-color-overlay: var(--select-pop-bg-color);
    border: transparent !important;
  }
  .el-popper.is-light {
    border: none !important;
  }
  .el-popper .el-picker-panel__icon-btn {
    color: var(--theme-color);
  }
  .el-select-dropdown__item {
    --el-text-color-regular: var(--common-info-text);
  }
  .el-select-dropdown__item.is-hovering {
    --el-fill-color-light: var(--select-hover-bg-color);
  }
  .el-select-dropdown__item.is-selected {
    color: var(--common-text1);
    .option-box {
      .option-content,
      .name {
        color: var(--common-text1) !important;
      }
    }
  }
  .el-dropdown-menu__item:not(.is-disabled):focus {
    --el-dropdown-menuItem-hover-fill: var(--select-hover-bg-color);
  }
  .el-dropdown-menu__item {
    color: #F5F5F5;
    font-size: 14px;
  }

  /* ---------------------- 标签页 ---------------------- */
  .el-tabs__active-bar {
    background-color: var(--common-text1);
    height: 0.006rem;
  }

  /* ---------------------- 侧边栏 / 导航栏 ---------------------- */
  .el-menu-item,
  .el-sub-menu,
  .el-sub-menu__title {
    color: var(--common-info-text);
  }
  .layout-container-left {
    background-color: var(--sidebar-bg-color);
    border-right: 1px solid var(--divider-color);
  }
  .logo {
    border-bottom: 1px solid var(--divider-color);
    background-color: var(--sidebar-bg-color) !important;
  }
  .el-menu,
  .el-menu-item {
    background-color: var(--sidebar-bg-color) !important;
  }
  .el-menu-item:hover {
    background-color: var(--sidebar-bg-color) !important;
  }
  .el-sub-menu__title:hover {
    background-color: var(--color-menu-hover);
  }
  .el-menu-item.is-active {
    color: var(--theme-color);
  }
  .layout-header {
    background-color: var(--sidebar-bg-color);
    border-bottom: 1px solid var(--divider-color);
  }
  .layout-menu .el-sub-menu__icon-arrow {
    color: #808080;
  }

  /* ---------------------- 表格 ---------------------- */
  .el-table {
    --el-border-color-lighter: #292929;
  }
  .el-table tr {
    background-color: #333333;
    color: #F0F0F0;
  }
  .el-table .el-table__header tr {
    color: var(--input-select-text);
  }
  .el-table__header-wrapper,
  .el-table__header {
    min-height: 60px;
  }
  .el-table th.el-table__cell {
    background-color: #333333;
    color: var(--custom-info-button-text);
  }
  .el-table__body td.el-table__cell {
    background: #0f0f0f;
  }
  .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
    background-color: #1f1f1f;
  }
  .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
    --el-fill-color-lighter: #0f0f0f;
  }
  .el-form-item__label {
    color: var(--custom-info-button-text);
  }

  /* ---------------------- 分页 ---------------------- */
  .el-pagination.is-background li {
    color: var(--font-color1);
    background-color: #292929;
  }
  .el-pagination.is-background li.is-active {
    background-color: #ffffff;
    color: #292929;
  }
  .el-pagination.is-background .btn-prev,
  .el-pagination.is-background .btn-next {
    background-color: transparent;
    color: var(--font-color1);
  }

  /* ---------------------- 时间轴 ---------------------- */
  .el-timeline-item__content span {
    color: #C2C2C2;
  }

  /* ---------------------- 弹窗 / MessageBox ---------------------- */
  .el-dialog--center {
    background-color: var(--dialog-bg) !important;
    .el-textarea__inner {
      color: #F5F5F5;
    }
  }
  .el-dialog {
    --el-dialog-bg-color: var(--common-text2);
    .el-dialog__title {
      color: var(--common-info-text);
    }
    .el-dialog__body {
      color: var(--input-select-text);
      font-size: 16px;
    }
  }
  .el-message-box {
    --el-bg-color: #242321;
    .el-message-box__title {
      color: var(--color-text-deputy);
    }
    .el-message-box__headerbtn:hover .el-message-box__close {
      color: var(--color-text-deputy);
    }
  }
  .is-message-box .el-message-box__btns button:first-child {
    color: #DBDBDB !important;
    background: var(--custom-button-plain-bg-color) !important;
    border-radius: 4px !important;
    border: 1px solid #DBDBDB !important;
    &:active {
      border-color: #ffffff !important;
    }
  }

  /* ---------------------- 注册流程 ---------------------- */
  .register_box {
    --el-text-color-primary: #fff;
    --el-color-primary: #ffffff;
    .el-dialog {
      background: #333333;
      border-radius: 10px;
    }
    .el-step__icon {
      background: #333333;
    }
    .description {
      background: #42413C;
      border: 1px solid #665F47;
      color: var(--common-info-text);
    }
    .custom_title {
      border-bottom-color: #303030;
      div:first-child {
        color: var(--common-info-text);
      }
    }
  }

  /* ---------------------- 首页 ---------------------- */
  .homeBox {
    .el-step__icon {
      background: #1F1F1F !important;
    }
    .custom-table .el-table__cell {
      border-bottom: 1px solid #424242 !important;
      padding: 10px 0px;
    }
    .title-color {
      color: var(--common-info-text);
    }
  }

  /* ---------------------- 输入框组合 ---------------------- */
  .input-wrapper .el-input-group--prepend > .el-input__wrapper {
    background-color: var(--color-border);
  }
  .input-wrapper .el-input-group--prepend .el-input-group__prepend .el-select__wrapper {
    background-color: var(--color-border);
  }
  .el-select__wrapper.is-disabled,
  .input-wrapper .login-input-code,
  .login-inputs .el-input__wrapper {
    background-color: var(--color-border);
  }

  /* ---------------------- 分割线 ---------------------- */
  .el-divider--vertical,
  .el-divider--horizontal {
    border-color: var(--divider-color);
  }

  /* ---------------------- 特殊业务组件 ---------------------- */
  .page-header .rows {
    background-color: #88e27a1a;
  }
  .card-list .el-scrollbar__thumb {
    --el-scrollbar-bg-color: var(--scrollbar-color);
    --el-scrollbar-hover-bg-color: var(--scrollbar-color);
    --el-text-color-secondary: var(--scrollbar-color);
  }
  .openAccount-box {
    .card-account {
      color: #F5F5F5;
      .name {
        color: #F5F5F5;
      }
    }
    // .servers-name {
    //   color: var(--common-info-text);
    //   div:last-child {
    //     background: #2B3330;
    //   }
    //   .liveStyle {
    //     color: #38B171;
    //     background: #2B3330;
    //   }
    //   .demoStyle {
    //     color: var(--custom-info-button-text);
    //     background: #303030;
    //   }
    // }
  }
  .note-box-top {
    background: #2B2923;
    border: 1px solid #665F47;
  }

  /* ---------------------- el-empty ---------------------- */
  .el-empty {
    margin-top: 80px;
    --el-empty-fill-color-0: var(--el-color-black);
    --el-empty-fill-color-1: #4b4b52;
    --el-empty-fill-color-2: #36383d;
    --el-empty-fill-color-3: #1e1e20;
    --el-empty-fill-color-4: #262629;
    --el-empty-fill-color-5: #202124;
    --el-empty-fill-color-6: #212224;
    --el-empty-fill-color-7: #1b1c1f;
    --el-empty-fill-color-8: #1c1d1f;
    --el-empty-fill-color-9: #18181a;
    .el-empty__description p {
      color: #B3B3B3;
    }
  }
}