/* 深色模式样式
------------------------------- */
[data-theme='dark'] {
  // 变量(自定义时，只需修改这里的值)
  --next-bg-main: #1f1f1f;
  --next-color-white: #ffffff;
  --next-color-disabled: #191919;
  --next-color-bar: #dadada;
  --next-color-primary: #303030;
  --next-border-color: #424242;
  --next-border-black: #333333;
  --next-border-columns: #2a2a2a;
  --next-color-seting: #505050;
  --next-text-color-regular: #9b9da1;
  --next-text-color-placeholder: #7a7a7a;
  --next-color-hover: #3c3c3c;
  --next-color-hover-rgba: rgba(0, 0, 0, 0.3);

  // root
  --next-bg-main-color: var(--next-bg-main) !important;
  --next-bg-topBar: var(--next-color-disabled) !important;
  --next-bg-topBarColor: var(--next-color-bar) !important;
  --next-bg-menuBar: var(--next-color-disabled) !important;
  --next-bg-menuBarColor: var(--next-color-bar) !important;
  --next-bg-menuBarActiveColor: var(--next-color-hover-rgba) !important;
  --next-bg-columnsMenuBar: var(--next-color-disabled) !important;
  --next-bg-columnsMenuBarColor: var(--next-color-bar) !important;
  --next-border-color-light: var(--next-border-black) !important;
  --next-color-primary-lighter: var(--next-color-primary) !important;
  --next-color-success-lighter: var(--next-color-primary) !important;
  --next-color-warning-lighter: var(--next-color-primary) !important;
  --next-color-danger-lighter: var(--next-color-primary) !important;
  --next-bg-color: var(--next-color-primary) !important;
  --next-color-dark-hover: var(--next-color-hover) !important;
  --next-color-menu-hover: var(--next-color-hover-rgba) !important;
  --next-color-user-hover: var(--next-color-hover-rgba) !important;
  --next-color-seting-main: var(--next-color-seting) !important;
  --next-color-seting-aside: var(--next-color-hover) !important;
  --next-color-seting-header: var(--next-color-primary) !important;
  --next-color-menuBarActiveColor: var(--next-color-white) !important;

  // alert / notice-bar
  .home-card-item {
    border: 1px solid var(--next-border-color-light) !important;
  }
  .el-alert,
  .notice-bar {
    border: 1px solid var(--next-border-color) !important;
    background-color: var(--next-color-disabled) !important;
  }

  // topBar
  .layout-navbars-breadcrumb-index {
    background: none !important;
  }

  // menu
  .layout-aside {
    border-right: 1px solid var(--next-border-color-light) !important;
    background: var(--el-bg-color-overlay);
  }

  // countup
  .countup-card-item-flex {
    color: var(--el-text-color-primary) !important;
  }

  // editor
  .editor-container {
    .w-e-toolbar {
      background: var(--el-bg-color-overlay) !important;
      border: 1px solid var(--next-border-color-light) !important;
      .w-e-menu:hover {
        background: var(--el-color-primary-light-9) !important;
        i {
          color: var(--el-text-color-primary) !important;
        }
      }
    }
    .w-e-text-container {
      border: 1px solid var(--next-border-color-light) !important;
      border-top: none !important;
      .w-e-text {
        background: var(--el-bg-color) !important;
      }
    }
    .w-e-full-screen-container {
      z-index: 10;
    }
  }

  // columns
  .layout-columns-aside ul .layout-columns-active {
    color: var(--next-color-white) !important;
  }
  .layout-columns-aside {
    border-right: 1px solid var(--next-border-columns);
  }

  // tagsView
  .tags-style-one {
    .is-active {
      color: var(--el-text-color-primary) !important;
    }
    .layout-navbars-tagsview-ul-li:hover {
      border-color: var(--el-border-color-lighter) !important;
    }
  }
}
