/* ════════════════════════════════════════════════════════════
   Evidence Sheet — tap a reasoning phrase to see the receipt.
   ════════════════════════════════════════════════════════════ */

function EvidenceSheet({ evidence, onClose }) {
  const lang = window.__LANG || 'zh';
  if (!evidence) return null;
  return (
    <div className="ev-bg" onClick={onClose}>
      <div className="ev-sheet" onClick={(e) => e.stopPropagation()}>
        <div className="ev-grab"/>
        <header className="ev-mast">
          <span className="ev-eb">{lang==='zh'?'证据 · EVIDENCE':'EVIDENCE'}</span>
          <button className="ev-close" onClick={onClose}>×</button>
        </header>
        <div className="ev-claim">
          <span className="ev-quote">“</span>
          {evidence.claim}
          <span className="ev-quote">”</span>
        </div>
        <div className="ev-source">— {evidence.source}</div>
        <div className="ev-body">
          {evidence.points.map((p, i) => (
            <div key={i} className="ev-row">
              <span className="ev-num">{String(i+1).padStart(2,'0')}</span>
              <div className="ev-line">
                <div className="ev-lab">{p.label}</div>
                <div className={'ev-val ' + (p.tone||'')}>{p.value}</div>
                {p.note && <div className="ev-note">{p.note}</div>}
              </div>
            </div>
          ))}
        </div>
        <footer className="ev-foot">
          <span>n = {evidence.n || '—'}</span>
          <span>{lang==='zh'?'更新':'updated'} · {evidence.updated || '7m ago'}</span>
        </footer>
      </div>
    </div>
  );
}

window.openEvidence = (evidence) => {
  const host = document.createElement('div');
  document.body.appendChild(host);
  const root = ReactDOM.createRoot(host);
  const close = () => { root.unmount(); host.remove(); };
  root.render(<EvidenceSheet evidence={evidence} onClose={close} />);
};

/* ── Decorate reasoning text: highlight key phrases ─────── */
function ReasoningWithReceipts({ rec }) {
  const lang = window.__LANG || 'zh';
  const s = rec.scores;
  const chips = [
    { tag: 'tech',   color: 'var(--src-tech, #5b9bff)', label: lang==='zh'?'技术':'TECH',   text: rec.reasoning.technical, score: s.technical,
      evidence: {
        claim: rec.reasoning.technical, source: lang==='zh'?'技术指标 / 60D':'Technical / 60D',
        points: [
          { label: 'RSI(14)',  value: (50 + (s.technical - 60) * 0.5).toFixed(1), tone: s.technical>=65?'up':'dn' },
          { label: 'MA20 / MA50', value: s.technical>=60 ? (lang==='zh'?'金叉确认':'Golden cross'):(lang==='zh'?'死叉警惕':'Death cross'), tone: s.technical>=60?'up':'dn' },
          { label: lang==='zh'?'量能':'Volume', value: s.technical>=70 ? '+38%' : '−12%', note: lang==='zh'?'vs 20日均':'vs 20d avg' },
        ], n: 60, updated: '7m'
      }
    },
    { tag: 'ai', color: 'var(--src-ai, #ffb454)', label: 'AI', text: rec.reasoning.ai, score: s.ai,
      evidence: {
        claim: rec.reasoning.ai, source: lang==='zh'?'融合模型 v4.2':'Fusion Model v4.2',
        points: [
          { label: lang==='zh'?'相似历史样本':'Similar setups', value: rec.backtest.sample_size + ' patterns', note: lang==='zh'?'匹配置信 ' + Math.round(rec.recommendation.confidence*100) + '%':'match ' + Math.round(rec.recommendation.confidence*100) + '%' },
          { label: lang==='zh'?'胜率':'Win rate', value: Math.round(rec.backtest.win_rate*100) + '%', tone: rec.backtest.win_rate>=0.6?'up':'dn' },
          { label: lang==='zh'?'平均收益':'Avg return', value: (rec.backtest.avg_return_pct>=0?'+':'') + rec.backtest.avg_return_pct.toFixed(2) + '%', tone: rec.backtest.avg_return_pct>=0?'up':'dn' },
        ], n: rec.backtest.sample_size, updated: '2m'
      }
    },
    { tag: 'expert', color: 'var(--src-pro, #34c759)', label: lang==='zh'?'专家':'EXPERT', text: rec.reasoning.expert, score: s.expert,
      evidence: {
        claim: rec.reasoning.expert, source: lang==='zh'?'外部研报共识':'Sell-side consensus',
        points: [
          { label: lang==='zh'?'覆盖分析师':'Analysts covering', value: '14' },
          { label: lang==='zh'?'多头比例':'Bull ratio', value: Math.round(s.expert*0.9) + '%', tone: s.expert>=60?'up':'dn' },
          { label: lang==='zh'?'目标价区间':'Target range', value: (rec.recommendation.take_profit*0.92).toFixed(2) + ' – ' + (rec.recommendation.take_profit*1.06).toFixed(2) },
        ], n: 14, updated: '1d'
      }
    },
  ];

  return (
    <div className="rwr">
      {chips.map((c) => (
        <button key={c.tag} className="rwr-chip" onClick={() => window.openEvidence(c.evidence)}
                style={{ borderColor: c.color }}>
          <span className="rwr-dot" style={{ background: c.color }}/>
          <span className="rwr-lab" style={{ color: c.color }}>{c.label}</span>
          <span className="rwr-score">{c.score}</span>
          <span className="rwr-text">{c.text}</span>
          <span className="rwr-arrow">→</span>
        </button>
      ))}
    </div>
  );
}

window.ReasoningWithReceipts = ReasoningWithReceipts;