/* ============================================================
   行情列表 /market 页级样式（2026-09-18 第二轮）
   ⛔ 颜色一律走 theme.css 的 CSS 变量（双主题共享同一份规则）
   ============================================================ */

/* --- 工具条 --- */
.mk-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mk-bar .mk-lb { font-size: 12px; color: var(--text-3); }
.mk-bar #mkQ { width: 210px; }
.mk-bar .mk-num { width: 74px; }
.mk-bar .mk-hint { font-size: 12px; color: var(--text-3); }
.mk-count { font-size: 13px; color: var(--text-2); font-variant-numeric: tabular-nums; }
.mk-funnel { font-size: 12px; color: var(--text-3); }
.mk-note { margin: 6px 0 8px; font-size: 12px; color: var(--text-3); }

/* --- 表格容器：固定高度内滚动 + 表头吸顶（看盘式布局） --- */
.mk-scroll {
  max-height: 70vh;
  overflow: auto;
  border: 1px solid var(--card-border);
  border-radius: var(--radius);
  background: var(--card);
  -webkit-overflow-scrolling: touch;
}
table.mkt { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
table.mkt thead th {
  position: sticky; top: 0; z-index: 2;
  background: var(--bg-soft, var(--card));
  border-bottom: 1px solid var(--card-border);
  font-weight: 600; white-space: nowrap;
  cursor: pointer; user-select: none;
  padding: 7px 6px;
}
table.mkt thead th:hover { color: var(--accent); }
table.mkt thead th.srt { color: var(--accent); }
table.mkt thead th.srt::before { content: '▲'; font-size: 9px; margin-right: 3px; opacity: .9; }
table.mkt thead th.srt.asc::before { content: '▲'; }
table.mkt thead th.srt.desc::before { content: '▼'; }

/* 列宽拖拽手柄 */
.mkt-rz {
  position: absolute; top: 0; right: 0; width: 7px; height: 100%;
  cursor: col-resize; z-index: 3;
}
.mkt-rz:hover { background: var(--accent); opacity: .35; }
table.mkt thead th { position: sticky; }

table.mkt td { border-bottom: 1px solid var(--card-border); padding: 5px 6px; white-space: nowrap; }
table.mkt tbody tr:nth-child(even) { background: var(--bg-soft); }
table.mkt tbody tr:hover { background: var(--row-hover); }
table.mkt td.c-name { overflow: hidden; text-overflow: ellipsis; }
table.mkt td.c-px, table.mkt td.c-hi, table.mkt td.c-lo { color: var(--text-2); }
table.mkt td.c-pct, table.mkt td.c-vol, table.mkt td.c-amt { text-align: right; font-variant-numeric: tabular-nums; }
table.mkt td.c-pct { font-weight: 600; }
table.mkt td.c-pct.up { color: var(--up); }
table.mkt td.c-pct.down { color: var(--down); }
table.mkt tr.mk-empty td { text-align: center; color: var(--text-3); padding: 26px 8px; }

/* --- 移动端：窄屏保证列不挤散（表格在容器内横向滚动） --- */
@media (max-width: 860px) {
  .mk-scroll { max-height: 62vh; }
  table.mkt { min-width: 720px; }
  .mk-bar #mkQ { width: 100%; }
  .mk-bar .mk-num { width: 62px; }
}