/*custom  variables*/
//$--colors: (
//  'primary': (
//    'base': red
//  ),
//  'success': (
//    'base': #21ba45
//  ),
//  'warning': (
//    'base': #f2711c
//  ),
//  'danger': (
//    'base': #db2828
//  ),
//  'error': (
//    'base': #db2828
//  ),
//  'info': (
//    'base': #42b8dd
//  )
//);

//@forward "./var.scss" with (
//  $colors: $--colors
//);

/*import dark theme 起作用*/
//@use "./css-vars.scss" as *;
html.base-theme {
  /*element-plus section */
  --el-menu-active-color: #409eff;
  --el-menu-text-color: #bfcbd9;
  --el-menu-hover-text-color: var(--el-color-primary);
  --el-menu-bg-color: #304156;
  --el-menu-hover-bg-color: #263445;
  --el-menu-item-height: 56px;
  --el-menu-border-color: none;
  /*layout section*/
  //layout
  --layout-border-left-color: #ddd;
  //Breadcrumb
  --breadcrumb-no-redirect: #97a8be;
  //Hamburger
  --hamburger-color: #2b2f3a;
  --hamburger-width: 20px;
  --hamburger-height: 20px;
  //Sidebar
  --sidebar-el-icon-size: 20px;
  --sidebar-logo-background: #2b2f3a;
  --sidebar-logo-color: #09ff01d7;
  --sidebar-logo-width: 32px;
  --sidebar-logo-height: 32px;
  --sidebar-logo-title-color: #fff;
  --side-bar-width: 210px;
  --side-bar-border-right-color: '#ddd';
  //TagsView
  --tags-view-background: #fff;
  --tags-view-border-bottom: #d8dce5;
  --tags-view-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
  --tags-view-item-background: #fff;
  --tags-view-item-border-color: #d8dce5;
  --tags-view-item-color: #495060;
  --tag-view-height: 32px;
  --tags-view-item-active-background: #42b983;
  --tags-view-item-active-color: #fff;
  --tags-view-item-active-border-color: #42b983;
  --tags-view-contextmenu-background: #fff;
  --tags-view-contextmenu-color: #333;
  --tags-view-contextmenu-box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
  --tags-view-contextmenu-hover-background: #eee;
  //close-icon
  --tags-view-close-icon-hover-background: #b4bccc;
  --tags-view-close-icon-hover-color: #fff;
  //AppMain.vue
  --app-main-padding: 10px;
  --app-main-background: #fff;
  //Navbar.vue
  --nav-bar-height: 50px;
  --nav-bar-background: #fff;
  --nav-bar-box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
  --nav-bar-right-menu-background: #fff;
}
