/* 庚戌学堂 · 排盘显示补齐样式（bazi-display-plus.js / bazi-copy-text.js / bazi-city-search.js）
 * 取色一律走自定义属性、亮暗各一套：主题按钮是运行时可点的（app.js 的 setTheme 改 data-theme），
 * 若在 JS 里把颜色算成 inline 定值，用户点一下就失效 —— 见 AGENTS「随主题的观感一律交给 CSS」。
 */
:root{
  --bpx-ink:#0A1628;
  --bpx-muted:#4A5A6A;
  --bpx-line:rgba(10,22,40,.14);
  --bpx-track:rgba(10,22,40,.10);
  --bpx-good:#1F6F52;
  --bpx-bad:#8A5A3B;      /* 忌：赭石褐，刻意不用警报红（本站不靠焦虑说话） */
  --bpx-flat:#78838D;
  --bpx-chip:#F2EEE3;
  --bpx-chip-ink:#33404F;
  --bpx-focus:#1F6F52;
}
[data-theme="dark"]{
  --bpx-ink:#F1EDE4;
  --bpx-muted:#B0A898;
  --bpx-line:rgba(251,248,241,.16);
  --bpx-track:rgba(251,248,241,.12);
  --bpx-good:#5FC39A;
  --bpx-bad:#C7946B;
  --bpx-flat:#9AA6B2;
  --bpx-chip:#242A33;
  --bpx-chip-ink:#E7E2D7;
  --bpx-focus:#5FC39A;
}

/* ① 地势行（桌面四柱表） */
#baziTableBody .bpx-dishi-cell .di-shi{
  font-size:.92rem;font-weight:600;color:var(--bpx-ink);letter-spacing:.02em;
}
#baziTableBody .bpx-dishi-cell .bpx-cap{
  display:block;font-size:.62rem;font-weight:400;letter-spacing:.06em;
  color:var(--bpx-muted);margin-bottom:1px;
}
/* ⚠️ 斑马纹必须显式钉住，不能交给 nth-child 的自然结果。
   `assets/style.css:625` 的 `.bazi-table tbody tr:nth-child(even) td` 是按**位置**取色的，
   而本行插在 tbody 第 4 位 ⇒ 原有三行整体后移一位：纳音失纹、空亡得纹、神煞失纹，
   日柱列的 `.day-pillar` 底色（style.css:634，特异性低于那条 nth-child）也随之忽有忽无。
   下面把「插入后各位置」映射回「插入前的观感」：新行本身取奇数位的样式（无纹、日柱列有色）。*/
#baziTableBody tr:nth-child(5) td,
#baziTableBody tr:nth-child(7) td{background:rgba(201,184,150,.06)}
#baziTableBody tr:nth-child(4) td,
#baziTableBody tr:nth-child(6) td{background:transparent}
#baziTableBody tr:nth-child(4) td.day-pillar,
#baziTableBody tr:nth-child(6) td.day-pillar{background:rgba(139,26,26,.05)}

/* ② 大运十步喜忌分 */
.bpx-score{
  display:flex;flex-direction:column;align-items:center;gap:3px;
  margin-top:5px;width:100%;
}
.bpx-score-num{
  font-size:.74rem;font-weight:700;line-height:1;color:var(--bpx-muted);
  font-variant-numeric:tabular-nums;
}
.bpx-score-good .bpx-score-num{color:var(--bpx-good)}
.bpx-score-bad .bpx-score-num{color:var(--bpx-bad)}
.bpx-score-track{
  display:block;width:80%;max-width:44px;height:3px;border-radius:2px;
  background:var(--bpx-track);overflow:hidden;
}
.bpx-score-fill{display:block;height:100%;border-radius:2px;background:var(--bpx-flat)}
.bpx-score-good .bpx-score-fill{background:var(--bpx-good)}
.bpx-score-bad .bpx-score-fill{background:var(--bpx-bad)}
.bpx-score-legend{
  margin:10px 0 0;font-size:.78rem;line-height:1.65;color:var(--bpx-muted);
}

/* ③ 复制文本盘按钮（挂在巨石建的分享区旁边，沿用站内 btn 体系） */
.bpx-copy-btn{margin-left:8px}
.bpx-copy-tip{
  display:inline-block;margin-left:8px;font-size:.78rem;color:var(--bpx-good);vertical-align:middle;
}

/* ④ 出生地搜索 */
.bpx-city-search{position:relative;margin:0 0 8px}
.bpx-city-input{
  width:100%;padding:10px 12px;font-size:15px;color:var(--bpx-ink);
  background:var(--field-bg,#fff);border:1.5px solid var(--bpx-line);border-radius:8px;
  box-sizing:border-box;
}
.bpx-city-input:focus{outline:2px solid var(--bpx-focus);outline-offset:1px}
.bpx-city-list{
  position:absolute;z-index:30;left:0;right:0;top:calc(100% + 4px);
  margin:0;padding:4px 0;list-style:none;max-height:230px;overflow-y:auto;
  background:var(--bpx-chip);border:1px solid var(--bpx-line);border-radius:8px;
  box-shadow:0 6px 20px rgba(0,0,0,.16);
}
.bpx-city-list[hidden]{display:none}
.bpx-city-opt{padding:9px 14px;font-size:15px;color:var(--bpx-chip-ink);cursor:pointer}
.bpx-city-opt:hover,.bpx-city-opt.is-active{background:rgba(31,111,82,.16)}
.bpx-city-opt .bpx-city-prov{font-size:.76rem;color:var(--bpx-muted);margin-left:6px}
.bpx-city-empty{padding:10px 14px;font-size:.84rem;color:var(--bpx-muted)}
.bpx-city-hint{display:block;margin-top:4px;font-size:.76rem;color:var(--bpx-muted);line-height:1.5}

/* ⑤ 真太阳时档位与校正明细（bazi-solar-mode.js） */
.bpx-solar-mode{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bpx-mode-cap{font-size:.86rem;color:var(--bpx-ink)}
.bpx-solar-mode select{
  flex:1;min-width:220px;padding:8px 10px;font-size:14px;color:var(--bpx-ink);
  background:var(--field-bg,#fff);border:1.5px solid var(--bpx-line);border-radius:8px;
}
.bpx-meridian-group input{
  width:130px;padding:9px 10px;font-size:15px;color:var(--bpx-ink);
  background:var(--field-bg,#fff);border:1.5px solid var(--bpx-line);border-radius:8px;
}
.bpx-meridian-group small{display:block;margin-top:4px;font-size:.76rem;line-height:1.65;color:var(--bpx-muted)}
.bpx-solar-detail{
  margin:10px 0 0;padding:10px 12px;border:1px solid var(--bpx-line);border-radius:10px;
  background:var(--bpx-track);font-size:.84rem;line-height:1.7;color:var(--bpx-ink);
}
.bpx-solar-detail[hidden]{display:none}
/* 临界提示用赭石、不用警报红：这是「请留意」不是「你错了」（本站不贩卖焦虑） */
/* 手填放开后的越界提示：只描边、不刷背景——沿用 --bpx-bad（赭石褐，刻意不用警报红），
   选择器带上 .bazi-form-grid input 是为了压过 style.css 里同级的 input 边框规则。 */
.bazi-form-grid input.bpx-invalid{border-color:var(--bpx-bad);box-shadow:0 0 0 1px var(--bpx-bad) inset}
.bpx-solar-risk{margin-top:6px;color:var(--bpx-bad);font-weight:600}
