/* ============================================================================
   TIDAL · 冷银科技 —— 迷你 K 线图浅色化
   ----------------------------------------------------------------------------
   背景：生产 member_v5.js::kline() 把 SVG 描边/填充色写死在 JS 字符串里，
   CSS 无法触及（stroke="#527079" 等内联属性优先于样式表）。
   本文件用「属性选择器 + !important」让样式表重新接管，从而零改 JS。

   覆盖对象（member_v5.js 实际输出的内联色）：
     #527079  右侧价格轴竖线        → --line-3
     #31545c  水平网格虚线          → --line-2
     #b8c9cb  右侧价格刻度文字      → --ink3
     #a7bbbe  左/右日期刻度文字     → --ink3
     #91a8ac  中间日期刻度文字      → --ink3
     #ef4f61  阳线（涨）柱体+影线   → --up
     #20bd7a  阴线（跌）柱体+影线   → --down
     （DOM 里的红涨/绿跌文字仍由 .kline-head i 覆盖，见文件末）
   ============================================================================ */

/* ---------- 1. 容器 ---------- */
.kline-wrap{
  margin:12px 0;
  padding:10px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--card-glass);
  -webkit-backdrop-filter:blur(10px) saturate(140%);
  backdrop-filter:blur(10px) saturate(140%);
}
.kline-head{
  display:flex;justify-content:space-between;
  margin-bottom:7px;
  color:var(--ink3);
  font-size:11.5px;font-weight:var(--w-semi);
  letter-spacing:.02em;
}
.mini-kline{display:block;width:100%;height:auto;overflow:visible;min-height:104px}

/* 空态 */
.kline-empty{display:flex;min-height:118px;flex-direction:column}
.kline-empty-body{
  display:flex;flex:1;align-items:center;justify-content:center;
  padding:18px;
  color:var(--ink3);font-size:var(--fs-sm);text-align:center;
  border-top:1px dashed var(--line-2);
}

/* 图表条（K线 + 右侧收盘价） */
.chart-strip{display:grid;grid-template-columns:minmax(0,1fr) 98px;gap:10px;margin:11px 0}
.chart-strip .kline-wrap{margin:0;padding:8px}
.close-side{
  display:flex;flex-direction:column;justify-content:center;
  padding:11px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--card-glass);
}
.close-side small{color:var(--ink3);font-size:10.5px;letter-spacing:var(--ls-label)}
.close-side b{
  margin:5px 0 12px;
  color:var(--ink);font-size:18px;font-weight:var(--w-light);
  letter-spacing:var(--ls-num);font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.close-side em{margin-top:5px;color:var(--ink2);font-size:var(--fs-xs);font-style:normal;white-space:nowrap}

/* 展开详情里的图表（原先 #25464e / #071a20） */
.detail-market .kline-wrap,
.detail-market .close-side{
  border-color:var(--line);
  background:var(--card-glass);
}
.detail-market .mini-kline{aspect-ratio:260/104}
.detail-market .kline-head{margin-bottom:6px;font-size:11.5px}

/* ---------- 2. SVG 内联色 → token（属性选择器，必须 !important） ---------- */
/* 2.1 涨跌柱体与影线 */
.mini-kline line[stroke="#ef4f61"],
.mini-kline rect[fill="#ef4f61"]{ stroke:var(--up)!important; fill:var(--up)!important; }
.mini-kline line[stroke="#20bd7a"],
.mini-kline rect[fill="#20bd7a"]{ stroke:var(--down)!important; fill:var(--down)!important; }

/* 2.2 网格与轴 */
.mini-kline line[stroke="#527079"]{ stroke:var(--line-3)!important; stroke-width:.9 }
.mini-kline line[stroke="#31545c"]{ stroke:var(--line-2)!important; stroke-dasharray:3 3 }

/* 2.3 刻度文字 */
.mini-kline text[fill="#b8c9cb"],
.mini-kline text[fill="#a7bbbe"],
.mini-kline text[fill="#91a8ac"]{
  fill:var(--ink3)!important;
  font-weight:var(--w-med);
  font-variant-numeric:tabular-nums;
}

/* ---------- 3. 图例文字（DOM 元素，可正常用 CSS） ---------- */
.kline-head i{font-style:normal;font-weight:var(--w-semi)}
.kline-head i[style*="#ff6574"],
.kline-head i[style*="ff6574"]{color:var(--up)!important}
.kline-head i[style*="#34d399"],
.kline-head i[style*="34d399"]{color:var(--down)!important}

/* ---------- 4. 收窄布局 ---------- */
@media(max-width:420px){
  .chart-strip{grid-template-columns:minmax(0,1fr) 92px;gap:8px}
  .close-side{padding:8px}
  .close-side b{font-size:16px}
  .kline-head{font-size:11px}
}