/* ==========================================================================
   双模式合并层：夜间霓虹矩阵 / 日间柔雾奶油
   仅处理两套主题共存时的结构兼容、装饰显隐与主题切换按钮。
   ========================================================================== */

/* ---- 夜间模式：隐藏日间专属装饰 ---- */
body.design-neon-grid .brand-kicker,
body.design-neon-grid .clay-palette,
body.design-neon-grid .clay-footer,
body.design-neon-grid .glow-orb-3 {
  display: none !important;
}

/* ---- 日间模式：隐藏夜间专属装饰 ---- */
body.design-soft-clay .ng-toprail,
body.design-soft-clay .ng-brand-kicker,
body.design-soft-clay .ng-node-status,
body.design-soft-clay .ng-bar-head,
body.design-soft-clay .ng-prompt,
body.design-soft-clay .ng-summary-code,
body.design-soft-clay .ng-ruler,
body.design-soft-clay .ng-lb-kicker {
  display: none !important;
}

/* ---- 品牌徽标按模式切换 PRO / CLAY ---- */
body.design-neon-grid .badge-text-clay,
body.design-soft-clay .badge-text-pro {
  display: none;
}

/* ---- 夜间头部：header-top 作为透明包裹层，还原三列网格 ---- */
body.design-neon-grid .header-top {
  display: contents;
}
body.design-neon-grid .header-brand {
  order: 1;
}
body.design-neon-grid .stats-strip {
  order: 2;
}
body.design-neon-grid .header-actions {
  order: 3;
}

/* ---- 主题切换按钮：两套模式均可见 ---- */
#themeToggleBtn .theme-toggle-label {
  white-space: nowrap;
}

body.design-neon-grid #themeToggleBtn,
body.design-soft-clay #themeToggleBtn {
  display: inline-flex !important;
}

body.design-neon-grid #themeToggleBtn {
  height: 40px;
  padding: 0 12px;
  gap: 7px;
  border-color: rgba(79, 227, 255, 0.4);
  background: rgba(79, 227, 255, 0.055);
  color: var(--ng-cyan);
}
body.design-neon-grid #themeToggleBtn:hover {
  background: var(--ng-cyan);
  border-color: var(--ng-cyan);
  color: #05070a;
  box-shadow: 0 0 0 1px rgba(79, 227, 255, 0.25), inset 0 0 18px rgba(255, 255, 255, 0.22);
}
body.design-neon-grid #themeToggleBtn svg {
  width: 14px;
  height: 14px;
}
body.design-neon-grid #themeToggleBtn .theme-toggle-label {
  font-family: var(--ng-mono);
  font-size: 0.56rem;
  letter-spacing: 0.1em;
}

body.design-soft-clay #themeToggleBtn {
  height: 44px;
  padding: 0 16px;
  gap: 8px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.92);
  background: linear-gradient(150deg, #fffdfa 0%, #f1e7fb 100%);
  color: #6a4f9b;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow:
    0 14px 26px -20px rgba(122, 88, 116, 0.62),
    inset 0 1px 0 #ffffff,
    inset 0 -4px 8px rgba(180, 150, 200, 0.14);
}
body.design-soft-clay #themeToggleBtn:hover {
  transform: translateY(-2px);
  color: #4a3568;
  background: linear-gradient(150deg, #ffffff 0%, #f6edff 100%);
  border-color: #ffffff;
  box-shadow:
    0 20px 34px -22px rgba(122, 88, 116, 0.68),
    inset 0 1px 0 #ffffff,
    inset 0 -4px 8px rgba(180, 150, 200, 0.16);
}
body.design-soft-clay #themeToggleBtn:active {
  transform: translateY(0) scale(0.99);
}
body.design-soft-clay #themeToggleBtn svg {
  width: 17px;
  height: 17px;
}
body.design-soft-clay #themeToggleBtn .theme-toggle-label {
  font-size: 0.8rem;
}

@media (max-width: 600px) {
  body.design-soft-clay #themeToggleBtn {
    padding: 0 13px;
    border-radius: 15px;
  }
  body.design-neon-grid #themeToggleBtn {
    padding: 0 10px;
  }
}

@media (max-width: 360px) {
  body.design-neon-grid .brand-badge {
    display: none;
  }
}
