/* ============================================================
   xy-iron（铁壳机架）skin-extra.css —— CMS 静态场景的兜底层
   ------------------------------------------------------------
   skin.css 是 assemble.py 的装配产物（源 themes/iron.css），禁止手改；
   本文件只补两类东西：
     1) 源站靠 React onMouseEnter 加 .is-open 才展开的二级菜单，服务端渲染下必须补
        :hover / :focus-within / :target（规范 §10.5 第 3 条）；
     2) 源 JSX 用到但 iron.css 里根本没有规则的悬空类，与由数据形态引起的排版补正。
   链接颜色不用管：kernel.css 里 `a { color: inherit }`，各面板自己继承金属灰。
   ============================================================ */

/* ---------- 1. 悬空类：IronHero.jsx 的两个网格壳在 iron.css 里没有规则 ----------
   .ir-hero-grid 是两列栅格，这两个 div 只是列容器，规则缺失时靠 grid 自动撑开，
   这里显式声明 min-width:0 防止长规格串把列撑破（skin.css 的 .ir-hero-grid > * 同款保护）。 */
:root[data-theme="iron"] .ir-hero-copy,
:root[data-theme="iron"] .ir-hero-rig {
  min-width: 0;
}
/* 页脚 logo 那颗渐变：skin.css 只染 #lg（头部 logo），页脚用 id="lgf" 避免重复 id，这里补齐同色 */
:root[data-theme="iron"] #lgf stop:first-child { stop-color: var(--ir-amber); }
:root[data-theme="iron"] #lgf stop:last-child { stop-color: var(--ir-amber-dim); }

/* ---------- 2. 无 JS 展开：机柜抽屉 mega 与标签贴纸 dropdown ----------
   skin.css 只写了 .ir-nav-item.is-open 的展开态（React 状态驱动），
   hover / 键盘聚焦（focus-within 覆盖 Tab 进面板内链接的情况）都在这儿补。 */
:root[data-theme="iron"] .ir-nav-item:hover .ir-mega,
:root[data-theme="iron"] .ir-nav-item:focus-within .ir-mega,
:root[data-theme="iron"] .ir-nav-item:hover .ir-dd,
:root[data-theme="iron"] .ir-nav-item:focus-within .ir-dd {
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
}
/* 触屏无 hover：assets/js/app.js 点 .nav-link 时切 .is-open（本皮肤已挂内核 nav-link/nav-item 类） */

/* ---------- 3. 无 JS 抽屉：#xy-drawer:target（burger 是 button，锚点由手工/深链进来时仍可用） ---------- */
@media (max-width: 999px) {
  :root[data-theme="iron"] .ir-drawer:target {
    max-height: min(80dvh, 680px);
    overflow-y: auto;
  }
}

/* ---------- 4. 元信息带列数自适应 ----------
   skin.css 把 .ir-tele 固定成 5 栏，但 CMS 的 stats_line 是「配置几条占几格」
   （最多 4 条 + 1 格值守），固定 5 栏会在右侧留下空槽。 */
@media (min-width: 1081px) {
  :root[data-theme="iron"] .ir-tele {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  }
}

/* ---------- 5. 剖面卡里的详情按钮：.ir-chassis 是 grid，默认拉伸成整行宽 ---------- */
:root[data-theme="iron"] .ir-chassis > .ir-side-btn {
  justify-self: start;
  min-width: 152px;
}

/* ---------- 6. 槽位表里的机型链接：给 hover 一个琥珀反馈（表头/单元格本身无链接态样式） ---------- */
:root[data-theme="iron"] .ir-dtbl a:hover {
  color: var(--ir-amber-hi);
}

/* ---------- 7. 状态带 / 铭牌行都由设置项决定渲染与否，版式要跟着让步 ----------
   7a .ir-rail 的内容是 dc_name / ticker_note / stats_line / work_time / contact_phone，
      五项全空时整条不渲染；而 skin.css 的 --header-h 是「rail + deck」两段之和，
      机柜抽屉（.ir-mega 是 position:fixed）与 [id] 锚点留白会整体低一截。
      :has() 不支持的浏览器整条规则失效，退回默认值，不会更糟。 */
:root[data-theme="iron"]:not(:has(.ir-rail)) { --header-h: var(--ir-deck-h); }
/* 7b .ir-nameplate 原本是「短标签 ↔ 短值」的一行两钉（付费用户 / 1.2 万）。
      footer_notes 的正文长得多，标签不许被挤掉、正文右对齐并允许折行。 */
:root[data-theme="iron"] .ir-nameplate li { align-items: baseline; }
:root[data-theme="iron"] .ir-nameplate span { flex: none; }
:root[data-theme="iron"] .ir-nameplate b { flex: 1 1 auto; min-width: 0; text-align: right; overflow-wrap: anywhere; }