.bg-primary {
  background-color: var(--el-color-primary, #2563eb);
}

.bg-primary-light-3 {
  background-color: var(--el-color-primary-light-3);
}

.bg-primary-light-5 {
  background-color: var(--el-color-primary-light-5);
}

.bg-primary-light-7 {
  background-color: var(--el-color-primary-light-7);
}

.bg-primary-light-8 {
  background-color: var(--el-color-primary-light-8);
}

.bg-primary-light-9,
.hover-bg-primary-light-9:hover {
  background-color: var(--el-color-primary-light-9);
}

.border-primary {
  border-color: var(--el-color-primary, #2563eb);
}

.text-theme,
.hover-text-theme:hover {
  color: var(--el-color-primary, #2563eb);
}

.text-theme-important,
.hover-text-theme-important:hover {
  color: var(--el-color-primary, #2563eb) !important;
}

.text-primary {
  color: var(--el-text-color-primary, #121519);
}

.text-primary-important {
  color: var(--el-text-color-primary, #121519) !important;
}

.text-regular {
  color: var(--el-text-color-regular, #182b50);
}

.text-regular-important {
  color: var(--el-text-color-regular, #182b50) !important;
}

.text-secondary {
  color: var(--el-text-color-secondary, #999);
}

.text-secondary-important {
  color: var(--el-text-color-secondary, #999) !important;
}

.text-placeholder {
  color: var(--el-text-color-placeholder, #999);
}

.text-placeholder-important {
  color: var(--el-text-color-placeholder, #999) !important;
}

.nav-bg {
  background-color: var(--el-color-nav-bg, #fff);
}

.nav-text {
  color: var(--el-color-nav-text, #1d1e1f);
}

.page-footer-bg {
  background-color: var(--el-color-page-footer-bg, #18191f);
}

.page-footer-text {
  color: var(--el-color-page-footer-text, #f2f2f2);
}
