/* 全站导航栏布局:品牌左 / 导航项右 / 按钮组(切换主题)最右。
   原先这套只写在 hero-bar.css 里,而 hero-bar.css 只在首页加载,所以只有首页是这样,
   其余页面(作品、关于我们、爱发电、文档页)的 .nav 被主题绝对居中
   (`.nav[X]{position:absolute;left:50%;transform:translate(-50%)}`)。
   这里收成一份、全站加载,注意力锚点一致:切换主题永远在右上角同一个位置。
   ⚠ 必须先脱出绝对定位,auto 外边距才会生效。
   ⚠ ≤860px 时主题把 .nav 设成 display:none(改用汉堡下拉),这里不碰 display:
   那时 .nav-bar 只剩 品牌 + 按钮组 两个子元素,靠 justify-content:space-between
   就能把按钮组顶到右边,所以下面那条 margin-left:0 在窄屏也安全。 */
.site-header .nav-bar .nav {
  position: static;
  left: auto;
  transform: none;
  margin-left: auto;
}

/* 余量全给 .nav,按钮组紧贴导航项;两者间距由 .nav-bar 的 gap 决定。
   不这样写的话两个 margin-left:auto 会各分一半空白,链接和按钮组隔开老远。 */
.site-header .nav-bar .nav-actions {
  margin-left: 0;
}

/* 首页导航文字:一律白色,不用主题的 --color-text-muted(#a4a29a)。
   首页导航是透明通栏,文字直接压在主视觉上——切到 ClearSky 那屏(重色彩底图)时,
   灰字整个糊进背景里读不出。层级不再靠"深灰/浅灰",改由选中项那层圆角底(pill)承担。
   ⚠ 特异性 (0,4,0) 刚好压过主题的 `.nav-link[X]:hover,.active`(0,3,0),
   所以悬停/选中也一并是纯白,悬停只出 pill。 */
.site-header.nav-flat .nav-bar .nav-link {
  color: #fff;
}

/* 首页通栏导航的内容对齐站点内容列(与 --container-max 同宽),窄屏回落 22px。
   ⚠ 限制的是"内容"宽度(padding),不是栏体本身:给 .nav-bar 加 max-width 的话,
   两侧会露出没被毛玻璃盖住的直角边。 */
.site-header.nav-flat .nav-bar {
  padding-left: max(22px, calc((100% - var(--container-max, 1280px)) / 2));
  padding-right: max(22px, calc((100% - var(--container-max, 1280px)) / 2));
}
