/* ============================================================================
 * header-enhance.css
 * 顶部 header 品牌区补全：LOGO + 公司名 + 拉开发新疆(组织切换)与管理员(用户)间距
 * 兼容 5 套主题（走 --brand-* CSS 变量）
 * ============================================================================ */

/* header-right 容器改为 flex 布局，自动间距 */
.el-header.header .header-right,
.layout-header .header-right,
header .header-right {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
}

/* 品牌区 */
.he-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 4px 14px 4px 4px !important;
  border-radius: 999px !important;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--brand-50, #e8f1ff) 80%, transparent),
    color-mix(in srgb, var(--brand-100, #d4e6ff) 60%, transparent)
  ) !important;
  border: 1px solid color-mix(in srgb, var(--brand-200, #b8d4ff) 60%, transparent) !important;
  transition: all 0.25s ease !important;
  cursor: default !important;
  user-select: none !important;
  height: auto !important;
  min-height: 36px !important;
}

.he-brand:hover {
  background: linear-gradient(
    135deg,
    var(--brand-50, #e8f1ff),
    var(--brand-100, #d4e6ff)
  ) !important;
  border-color: var(--brand-300, #8fb8ff) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--brand-500, #409eff) 15%, transparent) !important;
}

.he-brand-logo {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, var(--brand-500, #2f5496), var(--brand-700, #1f3a5f)) !important;
  color: #fff !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 6px color-mix(in srgb, var(--brand-700, #1f3a5f) 35%, transparent) !important;
}

.he-brand-logo svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
}

.he-brand-text {
  display: flex !important;
  flex-direction: column !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}

.he-brand-name {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--brand-700, #1f3a5f) !important;
  letter-spacing: 0.5px !important;
}

/* 主口号：中文楷体，居首 */
.he-brand-sub.he-brand-slogan {
  font-size: 12px !important;
  color: var(--brand-500, #2f5496) !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  font-family: "STKaiti", "KaiTi", "楷体", "Songti SC", "STSong", serif !important;
  text-transform: none !important;
  margin-top: 2px !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.6);
}

/* 英文副标语：英文小写紧跟其下，常规大小写 */
.he-brand-sub.he-brand-tag-en {
  font-size: 9px !important;
  color: var(--brand-400, #7a9ec9) !important;
  font-weight: 500 !important;
  letter-spacing: 1.8px !important;
  margin-top: 1px !important;
  text-transform: uppercase !important;
}

/* 副标语：中文小字灰色，紧跟主口号之下 */
.he-brand-sub.he-brand-tagline {
  font-size: 10px !important;
  color: #8a94a6 !important;
  font-weight: 500 !important;
  letter-spacing: 2.5px !important;
  margin-top: 1px !important;
}

/* 下拉按钮自身的间距（双重保险） */
.el-header.header .header-right .el-dropdown,
.layout-header .header-right .el-dropdown,
header .header-right .el-dropdown {
  margin-left: 0 !important;
}

.el-header.header .header-right .el-dropdown + .el-dropdown,
.layout-header .header-right .el-dropdown + .el-dropdown,
header .header-right .el-dropdown + .el-dropdown {
  margin-left: 8px !important;
  padding-left: 16px !important;
  border-left: 1px solid var(--brand-100, #d4e6ff) !important;
}

/* org-switcher 文字色用品牌色突出 */
.el-header.header .header-right .org-switcher,
.layout-header .header-right .org-switcher,
header .header-right .org-switcher {
  color: var(--brand-700, #1f3a5f) !important;
  font-weight: 500 !important;
}

.el-header.header .header-right .user-info,
.layout-header .header-right .user-info,
header .header-right .user-info {
  color: var(--brand-700, #1f3a5f) !important;
  font-weight: 500 !important;
}

/* 中等屏以下隐藏英文副标语 + 副标语 */
@media (max-width: 1400px) {
  .he-brand-tag-en { display: none !important; }
  .he-brand-tagline { display: none !important; }
}
/* 覆盖 header-layout-fix.css 1500px 的全 .he-brand-sub 隐藏规则，保留中文主口号和副标语 */
@media (max-width: 1500px) {
  header.el-header.header .header-right .he-brand .he-brand-slogan,
  .el-header.header .header-right .he-brand .he-brand-slogan,
  header.el-header.header .header-right .he-brand .he-brand-tagline,
  .el-header.header .header-right .he-brand .he-brand-tagline {
    display: block !important;
  }
}

/* 较窄屏缩小主口号，避免溢出 */
@media (max-width: 1200px) {
  .he-brand-slogan { font-size: 11px !important; letter-spacing: 1.5px !important; }
  .he-brand-name { font-size: 12px !important; }
  .he-brand { padding-right: 10px !important; }
}

/* 覆盖 header-layout-fix.css 1280px 的品牌名 200px 省略号规则：
 * 公司名 13 字实宽约 216px，200px 会被截断 → 放宽到 280px 完整显示
 * 特异性比 header-layout-fix.css 多一层 .he-brand-text，不依赖加载顺序 */
@media (max-width: 1280px) {
  header.el-header.header .header-right .he-brand .he-brand-text .he-brand-name,
  .el-header.header .header-right .he-brand .he-brand-text .he-brand-name {
    max-width: 280px !important;
  }
}

/* 窄屏（平板）只显示 LOGO 圆形，去掉文字 */
@media (max-width: 1000px) {
  .he-brand-text { display: none !important; }
  .he-brand { padding: 4px !important; }
}