/* ============ 自选股共享新功能样式 ============ */
/* 排序切换栏、迷你K线弹窗、批量操作模式、快速标签栏 */
/* 使用三种前缀: wl- / bull-wl- / ding-wl- */

/* ---------- 排序切换栏 ---------- */
.wl-sort-bar, .bull-wl-sort-bar, .ding-wl-sort-bar {
  display: flex; align-items: center; gap: 4px;
  padding: 4px 8px; margin-bottom: 4px;
  background: var(--bg-elevated, rgba(255,255,255,0.03)); border-radius: 6px;
  flex-wrap: wrap;
}
.wl-sort-btn, .bull-wl-sort-btn, .ding-wl-sort-btn {
  background: transparent; border: 1px solid var(--border-default, #30363d); color: var(--text-secondary, #8b949e);
  padding: 2px 8px; border-radius: 4px; font-size: 11px; cursor: pointer;
  transition: all 0.15s;
}
.wl-sort-btn.active, .bull-wl-sort-btn.active, .ding-wl-sort-btn.active {
  background: #1f6feb; border-color: #1f6feb; color: #fff;
}
.wl-sort-btn:hover, .bull-wl-sort-btn:hover, .ding-wl-sort-btn:hover {
  border-color: #58a6ff; color: #c9d1d9;
}
.wl-batch-enter, .bull-wl-batch-enter, .ding-wl-batch-enter {
  margin-left: auto; background: var(--bg-elevated, #21262d); border: 1px solid #30363d;
  color: #8b949e; padding: 2px 8px; border-radius: 4px; font-size: 11px; cursor: pointer;
}
.wl-batch-enter:hover, .bull-wl-batch-enter:hover, .ding-wl-batch-enter:hover {
  border-color: #58a6ff; color: #c9d1d9;
}
.wl-batch-info, .bull-wl-batch-info, .ding-wl-batch-info {
  font-size: 11px; color: #58a6ff; margin-left: 8px;
}
.wl-batch-del, .bull-wl-batch-del, .ding-wl-batch-del {
  background: #da3633; border: none; color: #fff;
  padding: 2px 8px; border-radius: 4px; font-size: 11px; cursor: pointer;
  margin-left: 4px;
}
.wl-batch-cancel, .bull-wl-batch-cancel, .ding-wl-batch-cancel {
  background: var(--bg-elevated, #21262d); border: 1px solid #30363d;
  color: #8b949e; padding: 2px 8px; border-radius: 4px; font-size: 11px; cursor: pointer;
}
.wl-batch-selectall, .bull-wl-batch-selectall, .ding-wl-batch-selectall {
  background: transparent; border: 1px solid #58a6ff;
  color: #58a6ff; padding: 2px 8px; border-radius: 4px; font-size: 11px; cursor: pointer;
  margin-left: 4px;
}
.wl-batch-selectall:hover, .bull-wl-batch-selectall:hover, .ding-wl-batch-selectall:hover {
  background: rgba(88,166,255,0.15);
}

/* ---------- 批量选择框 ---------- */
.wl-batch-chk, .bull-wl-batch-chk, .ding-wl-batch-chk {
  margin-right: 6px; accent-color: #1f6feb; flex-shrink: 0;
}

/* ---------- 迷你走势图按钮 ---------- */
.wl-item-chart, .bull-wl-item-chart, .ding-wl-item-chart {
  background: transparent; border: none; cursor: pointer;
  font-size: 13px; padding: 0 2px; line-height: 1; opacity: 0.7;
}
.wl-item-chart:hover, .bull-wl-item-chart:hover, .ding-wl-item-chart:hover {
  opacity: 1;
}

/* ---------- 迷你K线弹窗 ---------- */
.wl-mini-chart-popup, .bull-wl-mini-chart-popup, .ding-wl-mini-chart-popup {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
  background: var(--bg-surface, #161b22); border: 1px solid var(--border-default, #30363d); border-radius: 10px;
  padding: 12px; z-index: 10000; width: 300px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5);
}
.wl-mini-chart-header, .bull-wl-mini-chart-header, .ding-wl-mini-chart-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; color: var(--text-primary, #c9d1d9); font-size: 13px;
}
.wl-mini-chart-close, .bull-wl-mini-chart-close, .ding-wl-mini-chart-close {
  background: transparent; border: none; color: var(--text-muted, #8b949e);
  font-size: 18px; cursor: pointer; line-height: 1;
}
.wl-mini-chart-close:hover, .bull-wl-mini-chart-close:hover, .ding-wl-mini-chart-close:hover {
  color: #f85149;
}
.wl-mini-chart-body, .bull-wl-mini-chart-body, .ding-wl-mini-chart-body {
  text-align: center;
}
.wl-mini-chart-loading, .bull-wl-mini-chart-loading, .ding-wl-mini-chart-loading {
  padding: 20px; color: var(--text-secondary, #8b949e); font-size: 13px;
}
.wl-mini-indicators, .bull-wl-mini-indicators, .ding-wl-mini-indicators {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; justify-content: center;
}
.wl-mini-ind, .bull-wl-mini-ind, .ding-wl-mini-ind {
  font-size: 11px; color: #8b949e; background: var(--bg-elevated, #21262d); padding: 2px 6px; border-radius: 3px;
}
.wl-mini-ind.up, .bull-wl-mini-ind.up, .ding-wl-mini-ind.up { color: #f85149; }
.wl-mini-ind.down, .bull-wl-mini-ind.down, .ding-wl-mini-ind.down { color: #3fb950; }

/* ---------- 顶栏快速标签栏 ---------- */
.wl-qtag, .bull-wl-qtag, .ding-wl-qtag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 4px;
  background: var(--bg-elevated, #21262d); border: 1px solid #30363d;
  cursor: pointer; font-size: 11px; color: #c9d1d9;
  transition: all 0.15s; white-space: nowrap;
}
.wl-qtag:hover, .bull-wl-qtag:hover, .ding-wl-qtag:hover {
  border-color: #58a6ff; background: #1c2333;
}
.wl-qtag-name, .bull-wl-qtag-name, .ding-wl-qtag-name { color: var(--text-primary, #c9d1d9); }
.wl-qtag-price, .bull-wl-qtag-price, .ding-wl-qtag-price {
  font-size: 10px; color: var(--text-muted, #8b949e);
}
.wl-qtag-price.up, .bull-wl-qtag-price.up, .ding-wl-qtag-price.up { color: #f85149; }
.wl-qtag-price.down, .bull-wl-qtag-price.down, .ding-wl-qtag-price.down { color: #3fb950; }

/* 快速标签栏容器 - 放在导航下方 */
.wl-quick-tags-bar, .bull-wl-quick-tags-bar, .ding-wl-quick-tags-bar {
  display: none; /* 默认隐藏，JS控制显示 */
  overflow-x: auto; white-space: nowrap;
  padding: 4px 12px; gap: 4px;
  background: var(--bg-deep, #0d1117); border-bottom: 1px solid var(--border-subtle, #21262d);
  scrollbar-width: thin; scrollbar-color: #30363d transparent;
}
.wl-quick-tags-bar::-webkit-scrollbar, .bull-wl-quick-tags-bar::-webkit-scrollbar, .ding-wl-quick-tags-bar::-webkit-scrollbar-scrollbar {
  height: 3px;
}
.wl-quick-tags-bar::-webkit-scrollbar-thumb, .bull-wl-quick-tags-bar::-webkit-scrollbar-thumb, .ding-wl-quick-tags-bar::-webkit-scrollbar-thumb {
  background: #30363d; border-radius: 2px;
}

/* ---------- 列宽（三种前缀） ---------- */
.bull-wl-item-extra-col, .ding-wl-item-extra-col {
  width: 80px; text-align: right; flex-shrink: 0;
  display: flex; flex-direction: column; align-items: flex-end; gap: 1px;
}
.bull-wl-item-turnover, .bull-wl-item-amount,
.ding-wl-item-turnover, .ding-wl-item-amount {
  font-size: 11px; color: var(--text-secondary);
}



/* ===== 768px 移动端扩展 ===== */
@media (max-width: 768px) {
  .wl-sort-bar, .bull-wl-sort-bar, .ding-wl-sort-bar {
    gap: 2px; padding: 3px 4px;
  }
  .wl-sort-btn, .bull-wl-sort-btn, .ding-wl-sort-btn,
  .wl-batch-enter, .bull-wl-batch-enter, .ding-wl-batch-enter {
    font-size: 10px; padding: 3px 6px; min-height: 26px; /* touch target */
  }
  .wl-mini-chart-popup, .bull-wl-mini-chart-popup, .ding-wl-mini-chart-popup {
    width: 90vw; max-width: 300px;
  }
  .wl-quick-tags-bar, .bull-wl-quick-tags-bar, .ding-wl-quick-tags-bar {
    padding: 4px 8px;
  }
  .wl-qtag, .bull-wl-qtag, .ding-wl-qtag {
    font-size: 11px; padding: 3px 8px; min-height: 26px;
  }
  /* Extra column hide on tablet */
  .bull-wl-item-extra-col, .ding-wl-item-extra-col {
    width: 60px;
  }
}

/* ===== 480px 手机端适配 ===== */
@media (max-width: 480px) {
  .wl-sort-bar, .bull-wl-sort-bar, .ding-wl-sort-bar {
    gap: 1px; padding: 2px;
    overflow-x: auto; flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .wl-sort-btn, .bull-wl-sort-btn, .ding-wl-sort-btn {
    font-size: 10px; padding: 2px 5px; min-height: 24px;
    flex-shrink: 0;
  }
  .wl-batch-enter, .bull-wl-batch-enter, .ding-wl-batch-enter {
    font-size: 10px; padding: 2px 5px; min-height: 24px;
    flex-shrink: 0;
  }
  .wl-batch-info, .bull-wl-batch-info, .ding-wl-batch-info {
    font-size: 10px;
  }
  .wl-batch-del, .bull-wl-batch-del, .ding-wl-batch-del,
  .wl-batch-cancel, .bull-wl-batch-cancel, .ding-wl-batch-cancel,
  .wl-batch-selectall, .bull-wl-batch-selectall, .ding-wl-batch-selectall {
    font-size: 10px; padding: 2px 6px; min-height: 24px;
  }
  .wl-mini-chart-popup, .bull-wl-mini-chart-popup, .ding-wl-mini-chart-popup {
    width: 94vw; max-width: 280px; padding: 8px;
  }
  .wl-mini-ind, .bull-wl-mini-ind, .ding-wl-mini-ind {
    font-size: 10px; padding: 1px 5px;
  }
  .wl-qtag, .bull-wl-qtag, .ding-wl-qtag {
    font-size: 10px; padding: 2px 6px; min-height: 24px;
  }
  .wl-quick-tags-bar, .bull-wl-quick-tags-bar, .ding-wl-quick-tags-bar {
    padding: 2px 4px;
  }
  /* Hide extra column on phone */
  .bull-wl-item-extra-col, .ding-wl-item-extra-col {
    display: none;
  }
  /* Tech tags smaller */
  .wl-tech-tags { gap: 3px; }
  .wl-tech-tag { font-size: 10px; padding: 1px 4px; line-height: 16px; }
}


/* 技术指标标签 */
.wl-tech-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;}
.wl-tech-tag{display:inline-block;padding:1px 6px;border-radius:3px;font-size:11px;line-height:18px;white-space:nowrap;}
.wl-tech-tag.tech-buy{background:rgba(46,204,113,0.15);color:#2ecc71;border:1px solid rgba(46,204,113,0.3);}
.wl-tech-tag.tech-sell{background:rgba(231,76,60,0.15);color:#e74c3c;border:1px solid rgba(231,76,60,0.3);}
.wl-tech-tag.tech-neutral{background:rgba(130,140,150,0.15);color:#828c96;border:1px solid rgba(130,140,150,0.3);}
.wl-tech-row{flex-wrap:wrap;gap:4px;}
.wl-ma-row{font-size:11px;color:var(--text-muted,#828c96);}
.wl-ma-signals{color:var(--text-muted,#828c96);}


/* ===== UX Enhancement Styles ===== */

/* #1 Price flash animation */
.wl-flash-up, .bull-wl-flash-up, .ding-wl-flash-up {
  animation: flashUp 0.6s ease-out;
}
.wl-flash-down, .bull-wl-flash-down, .ding-wl-flash-down {
  animation: flashDown 0.6s ease-out;
}
@keyframes flashUp {
  0% { background: rgba(248,81,73,0.25); }
  100% { background: transparent; }
}
@keyframes flashDown {
  0% { background: rgba(63,185,80,0.25); }
  100% { background: transparent; }
}

/* #4 Card enter animation */
.wl-item-enter, .bull-wl-item-enter, .ding-wl-item-enter {
  animation: slideInItem 0.3s ease-out;
}
@keyframes slideInItem {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}

/* #5 Batch move button */
.wl-batch-move, .bull-wl-batch-move, .ding-wl-batch-move {
  background: var(--accent-blue-dim, #1f6feb); border: none; color: #fff;
  padding: 2px 8px; border-radius: 4px; font-size: 11px; cursor: pointer;
  margin-left: 4px;
}
.wl-batch-move:hover, .bull-wl-batch-move:hover, .ding-wl-batch-move:hover {
  background: #1f6feb;
}

/* #8 Quick tags selected highlight */
.wl-qtag.selected, .bull-wl-qtag.selected, .ding-wl-qtag.selected {
  border-color: #58a6ff;
  background: rgba(31,111,235,0.15);
  box-shadow: 0 0 6px rgba(31,111,235,0.3);
}
/* Quick tags fade masks */
.wl-quick-tags-bar, .bull-wl-quick-tags-bar, .ding-wl-quick-tags-bar {
  mask-image: linear-gradient(to right, black 0%, black 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, black 0%, black 92%, transparent 100%);
}

/* #10 Summary bar */
.wl-summary, .bull-wl-summary, .ding-wl-summary {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; color: var(--text-muted, #8b949e);
  margin-left: auto; padding: 0 4px;
}
.wl-summary-up, .bull-wl-summary-up, .ding-wl-summary-up { color: #f85149; font-weight: 600; }
.wl-summary-down, .bull-wl-summary-down, .ding-wl-summary-down { color: #3fb950; font-weight: 600; }
.wl-summary-flat, .bull-wl-summary-flat, .ding-wl-summary-flat { color: #8b949e; }
.wl-summary-avg, .bull-wl-summary-avg, .ding-wl-summary-avg { font-weight: 600; }
.wl-summary-avg.up, .bull-wl-summary-avg.up, .ding-wl-summary-avg.up { color: #f85149; }
.wl-summary-avg.down, .bull-wl-summary-avg.down, .ding-wl-summary-avg.down { color: #3fb950; }

/* #7 SSE progress glow */
.wl-analysis-btn.streaming, .bull-wl-analysis-btn.streaming, .ding-wl-analysis-btn.streaming {
  box-shadow: 0 0 8px rgba(31,111,235,0.4);
}

/* Mobile responsive for new elements */
@media (max-width: 480px) {
  .wl-summary, .bull-wl-summary, .ding-wl-summary {
    font-size: 10px; gap: 3px;
  }
  .wl-batch-move, .bull-wl-batch-move, .ding-wl-batch-move {
    font-size: 10px; padding: 2px 6px; min-height: 24px;
  }
}

/* ===== 持仓标记样式 ===== */
.wl-holding-info {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px 0 0 0;
  font-size: 11px;
  line-height: 1.4;
}
.wl-holding-label {
  color: var(--text-muted, #8b949e);
}
.wl-holding-pnl {
  font-weight: 600;
}
.wl-holding-amt {
  font-weight: 500;
  font-size: 10px;
}
.wl-pnl-up {
  color: #ef4444;
}
.wl-pnl-down {
  color: #22c55e;
}

/* ===== 持仓/提醒按钮样式 ===== */
.wl-item-holding,
.wl-item-alert {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 13px;
  padding: 0 2px;
  opacity: 0.6;
  transition: opacity 0.2s;
  line-height: 1;
}
.wl-item-holding:hover,
.wl-item-alert:hover {
  opacity: 1;
}
/* 已标记持仓时高亮 */
.wl-item-holding.has-holding {
  opacity: 1;
}

/* ===== Actions default hidden (hover / .show-actions to show) ===== */
.wl-item-actions { opacity:0; pointer-events:none; transition:opacity 0.15s ease; }
.wl-item-main:hover .wl-item-actions,
.wl-item.show-actions .wl-item-actions,
.bull-wl-item-main:hover .bull-wl-item-actions,
.bull-wl-item.show-actions .bull-wl-item-actions,
.ding-wl-item-main:hover .ding-wl-item-actions,
.ding-wl-item.show-actions .ding-wl-item-actions { opacity:1; pointer-events:auto; }

/* Holding badge stays visible when marked */
.wl-item-holding.has-holding,
.bull-wl-item-holding.has-holding,
.ding-wl-item-holding.has-holding { opacity:1; }


/* ===== 价格提醒徽标 ===== */
.wl-alert-badge {
  display: inline-block;
  font-size: 11px;
  margin-left: 3px;
  vertical-align: middle;
  line-height: 1;
}
.wl-alert-triggered {
  animation: wl-alert-pulse 1.5s ease-in-out infinite;
}
@keyframes wl-alert-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.3); opacity: 0.7; }
}

/* ============ 深度分析买卖建议样式 ============ */
/* 使用三种前缀: wl- / bull-wl- / ding-wl- */

/* --- 信号+置信度+评分行 --- */
.wl-signal-row, .bull-wl-signal-row, .ding-wl-signal-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.wl-confidence, .bull-wl-confidence, .ding-wl-confidence {
  display: flex; align-items: center; gap: 4px; font-size: 11px;
}
.wl-conf-label, .bull-wl-conf-label, .ding-wl-conf-label {
  color: var(--text-secondary, #8b949e); white-space: nowrap;
}
.wl-conf-bar, .bull-wl-conf-bar, .ding-wl-conf-bar {
  width: 50px; height: 6px; background: rgba(255,255,255,0.08); border-radius: 3px; overflow: hidden;
}
.wl-conf-fill, .bull-wl-conf-fill, .ding-wl-conf-fill {
  height: 100%; border-radius: 3px; transition: width 0.3s;
}
.wl-conf-fill.conf-high, .bull-wl-conf-fill.conf-high, .ding-wl-conf-fill.conf-high { background: #22c55e; }
.wl-conf-fill.conf-mid, .bull-wl-conf-fill.conf-mid, .ding-wl-conf-fill.conf-mid { background: #eab308; }
.wl-conf-fill.conf-low, .bull-wl-conf-fill.conf-low, .ding-wl-conf-fill.conf-low { background: #6b7280; }
.wl-conf-val, .bull-wl-conf-val, .ding-wl-conf-val {
  font-weight: 600; min-width: 30px; text-align: right;
}

/* --- 买卖建议价行 --- */
.wl-advice-row, .bull-wl-advice-row, .ding-wl-advice-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 4px;
}
.wl-advice-price, .bull-wl-advice-price, .ding-wl-advice-price {
  font-size: 12px; padding: 2px 8px; border-radius: 4px; line-height: 1.6;
}
.wl-advice-price.buy-advice, .bull-wl-advice-price.buy-advice, .ding-wl-advice-price.buy-advice {
  background: rgba(220,38,38,0.10); color: #ef4444; border: 1px solid rgba(220,38,38,0.2);
}
.wl-advice-price.sell-advice, .bull-wl-advice-price.sell-advice, .ding-wl-advice-price.sell-advice {
  background: rgba(22,163,74,0.10); color: #16a34a; border: 1px solid rgba(22,163,74,0.2);
}
.wl-advice-price.stop-advice, .bull-wl-advice-price.stop-advice, .ding-wl-advice-price.stop-advice {
  background: rgba(234,88,12,0.08); color: #ea580c; border: 1px solid rgba(234,88,12,0.15);
}
.wl-advice-price.target-advice, .bull-wl-advice-price.target-advice, .ding-wl-advice-price.target-advice {
  background: rgba(37,99,235,0.08); color: #3b82f6; border: 1px solid rgba(37,99,235,0.15);
}
.wl-advice-price strong, .bull-wl-advice-price strong, .ding-wl-advice-price strong {
  font-weight: 700;
}
.wl-risk-reward, .bull-wl-risk-reward, .ding-wl-risk-reward {
  font-size: 11px; color: var(--text-secondary, #8b949e); padding: 1px 6px;
  background: rgba(255,255,255,0.04); border-radius: 3px;
}

/* --- 十维评分徽章行 --- */
.wl-dims-row, .bull-wl-dims-row, .ding-wl-dims-row {
  display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px;
}
.wl-dim-badge, .bull-wl-dim-badge, .ding-wl-dim-badge {
  font-size: 10px; padding: 1px 5px; border-radius: 3px; line-height: 1.5;
  background: rgba(255,255,255,0.04); color: var(--text-secondary, #8b949e);
}
.wl-dim-badge b, .bull-wl-dim-badge b, .ding-wl-dim-badge b { margin-left: 2px; }
.wl-dim-badge.dim-high, .bull-wl-dim-badge.dim-high, .ding-wl-dim-badge.dim-high {
  background: rgba(22,163,74,0.10); color: #22c55e;
}
.wl-dim-badge.dim-low, .bull-wl-dim-badge.dim-low, .ding-wl-dim-badge.dim-low {
  background: rgba(220,38,38,0.10); color: #ef4444;
}
.wl-dim-badge.dim-mid, .bull-wl-dim-badge.dim-mid, .ding-wl-dim-badge.dim-mid {
  background: rgba(234,179,8,0.08); color: #eab308;
}

/* --- 建议理由和风险提示 --- */
.wl-advice-reasons, .bull-wl-advice-reasons, .ding-wl-advice-reasons {
  font-size: 10px; color: var(--text-secondary, #8b949e); margin-top: 2px;
  line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  max-width: 100%;
}
.wl-advice-warnings, .bull-wl-advice-warnings, .ding-wl-advice-warnings {
  font-size: 10px; color: #ea580c; margin-top: 1px; line-height: 1.4;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
}

/* --- 详情面板新增section标题 --- */
.wl-detail-section, .bull-wl-detail-section, .ding-wl-detail-section {
  font-size: 11px; font-weight: 600; color: var(--text-primary, #c9d1d9);
  margin-top: 6px; padding-top: 4px; border-top: 1px solid rgba(255,255,255,0.06);
}
.wl-detail-section:first-child, .bull-wl-detail-section:first-child, .ding-wl-detail-section:first-child {
  margin-top: 0; padding-top: 0; border-top: none;
}
.wl-detail-row .warn-text, .bull-wl-detail-row .warn-text, .ding-wl-detail-row .warn-text {
  color: #ea580c;
}
.wl-detail-row .buy-val, .bull-wl-detail-row .buy-val, .ding-wl-detail-row .buy-val {
  color: #ef4444;
}
.wl-detail-row .sell-val, .bull-wl-detail-row .sell-val, .ding-wl-detail-row .sell-val {
  color: #16a34a;
}