/* ============================================================
 *  bxsh API 节点状态页 — 主题覆写
 *
 *  色值直接取自 New API 主站（theme = "default"）编译后的 CSS：
 *    :root  { --primary:#3ea4ec; --background:#fff;    --foreground:#0a0a0a;
 *             --secondary:#eee; --secondary-foreground:#004f8b;
 *             --muted:#f5f5f5; --muted-foreground:#606060; }
 *    .dark  { --primary:#0e72bc; --background:#1e1e1e; --foreground:#f3f3f3;
 *             --card:#2a2a2a;    --secondary:#373737;  --secondary-foreground:#c6e1ff;
 *             --muted:#2f2f2f;   --muted-foreground:#b7b7b7; }
 *
 *  这个文件只做「覆写」，不改 panel 的结构。
 *  删掉它页面依然能用，只是回到默认的青蓝配色。
 *  必须在 styles.css 之后加载。
 * ============================================================ */

/* ---------------- 亮色（与主站 default 亮色一致）---------------- */
[data-mode="light"] {
  --bg: #f5f5f5;
  --bg-2: #eee;

  --panel: rgba(255, 255, 255, .9);
  --panel-solid: #ffffff;
  --panel-2: #f5f5f5;

  --line: rgba(10, 10, 10, .1);
  --line-strong: rgba(10, 10, 10, .2);

  --text: #0a0a0a;
  --text-2: #3d3d3d;
  --text-3: #606060;
  --dim: #606060;

  --accent: #3ea4ec;
  --accent-2: #004f8b;
  --accent-soft: rgba(62, 164, 236, .12);
  --accent-line: rgba(62, 164, 236, .38);

  --ok: #009767;
  --warn: #cd8900;
  --bad: #cb3435;

  --shadow: 0 12px 32px -20px rgba(10, 10, 10, .3);
  --grid-color: rgba(10, 10, 10, .04);
}

/* ---------------- 暗色（与主站 default 暗色一致）---------------- */
[data-mode="dark"] {
  --bg: #1e1e1e;
  --bg-2: #2a2a2a;

  --panel: rgba(42, 42, 42, .78);
  --panel-solid: #2a2a2a;
  --panel-2: #2f2f2f;

  --line: rgba(243, 243, 243, .12);
  --line-strong: rgba(243, 243, 243, .22);

  --text: #f3f3f3;
  --text-2: #c9c9c9;
  --text-3: #b7b7b7;
  --dim: #b7b7b7;

  --accent: #0e72bc;
  --accent-2: #3ea4ec;
  --accent-soft: rgba(14, 114, 188, .22);
  --accent-line: rgba(62, 164, 236, .45);

  --ok: #00bb7f;
  --warn: #f99c00;
  --bad: #e55354;

  --shadow: 0 18px 44px -24px rgba(0, 0, 0, .8);
  --grid-color: rgba(243, 243, 243, .045);
}

/* 主站的圆角是 1rem，这里跟随，让两个页面观感一致 */
[data-mode] {
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
}

/* 主站是浅色系，暗色下把背景网格和扫描线压淡一点，
   避免和主站的干净观感差太远 */
[data-mode="dark"] .bg-scan { opacity: .35; }
[data-mode="dark"] .bg-grid { opacity: .7; }

/* 顶栏跟随主站的边框风格（主站 header 是纯色 + 细分割线） */
.topbar {
  background: color-mix(in srgb, var(--bg) 88%, transparent);
}

/* 亮色下 hero 标题不要渐变到看不清，主站是纯深色标题 */
[data-mode="light"] #heroTitle {
  background: none;
  -webkit-text-fill-color: currentColor;
  color: var(--text);
}

/* 进度条：亮色下用 primary 实色更贴近主站按钮观感 */
[data-mode="light"] .bar i.ok,
[data-mode="light"] .stat-bar i {
  background: linear-gradient(90deg, #3ea4ec, #004f8b);
}
[data-mode="dark"] .bar i.ok,
[data-mode="dark"] .stat-bar i {
  background: linear-gradient(90deg, #0e72bc, #3ea4ec);
}

/* 环形图进度色跟随 accent */
[data-mode="light"] .ring .prog { stroke: #3ea4ec; }
[data-mode="dark"] .ring .prog { stroke: #3ea4ec; }