// FAQ 页 (支持双语)
function FaqPage({ onNavigate, lang = 'zh', t }) {
  const i18n = t || (window.I18N && window.I18N[lang]) || window.I18N.zh;
  const f = i18n.faq;
  const isEn = lang === 'en';
  const [openIndex, setOpenIndex] = React.useState(0);

  const faqItems = isEn ? [
    {
      question: 'Why is the community free? How do you monetize?',
      answer: 'Our revenue is generated through exchange partnership rebates. When you trade using our referral link, the exchange distributes a portion of standard trading fees to us at zero additional cost to you. This aligns our financial interest directly with your longevity: the more sustainably and successfully you trade, the more consistent our rebate revenue. We do not charge membership dues or tuition.'
    },
    {
      question: 'Are these trading records authentic? How can I verify them?',
      answer: 'Every entry, stop loss, target, and exit execution timestamp is systematically recorded and disclosed. You can directly cross-check every single order against historic candlestick charts from TradingView or Bitget. Furthermore, the cumulative equity curve directly mirrors the ledger row by row without cherry-picking.'
    },
    {
      question: 'Why is the Telegram channel muted/broadcast-only?',
      answer: 'To protect pure trading signal execution. Trading psychology is frequently ruined by crowd noise, panic, and emotional FOMO. Our broadcast channel provides clean pre-market research and intraday updates. For questions, members can contact our administrators directly.'
    },
    {
      question: 'What is your win rate? How much profit can I expect?',
      answer: 'We do not promise or guarantee fixed returns. The performance displayed represents our historical internal statistics. Trading involves mathematical probability; leverage magnifies risk. You must manage capital strictly according to your individual risk tolerance.'
    },
    {
      question: 'How do I obtain the TradingView indicators? Are there hidden fees?',
      answer: 'Simply sign up on our partner exchange via our referral link and join our channel. Indicator access permissions for dynamic volume profile and cost levels are provided complimentary without hidden costs.'
    },
    {
      question: 'How many tickers are published daily? What are the selection criteria?',
      answer: 'Our multi-factor quant engine ingests the top 10 US equities by social volume across Twitter, Reddit, and market feeds. After quantitative vector cleaning, our lead analyst selects the 3 optimal setups considering sector rotation and price structures.'
    },
    {
      question: 'How often is the public ledger updated?',
      answer: 'Data is reconciled every 2 business days to account for ongoing open positions, post-trade review notes, and execution logs.'
    }
  ] : FAQ_ITEMS;

  return (
    <div className="page faq-page">
      <div className="page-header page-header-compact">
        <div className="section-inner">
          <div className="page-header-inner">
            <div>
              <h1 className="page-title page-title-compact">{f.pageTitle}</h1>
              <p className="page-desc page-desc-compact">
                {f.pageDesc}
              </p>
            </div>
          </div>
        </div>
      </div>

      {/* FAQ 列表 */}
      <section className="section faq-section">
        <div className="section-inner">
          <div className="faq-list">
            {faqItems.map((item, i) => (
              <div
                key={i}
                className={'faq-item ' + (openIndex === i ? 'open' : '')}
                onClick={() => setOpenIndex(openIndex === i ? -1 : i)}
              >
                <div className="faq-question">
                  <span className="faq-q-num">Q{i + 1}</span>
                  <span className="faq-q-text">{item.question}</span>
                  <span className="faq-icon">
                    <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" strokeWidth="2.2" strokeLinecap="round">
                      <path d="M12 5v14M5 12h14" />
                    </svg>
                  </span>
                </div>
                <div className="faq-answer">
                  <div className="faq-answer-inner">
                    {item.answer}
                    <div className="faq-answer-cta">
                      <button className="btn-link btn-link-sm" onClick={(e) => { e.stopPropagation(); onNavigate('record'); }}>
                        {f.seeRecordsBtn}
                      </button>
                    </div>
                  </div>
                </div>
              </div>
            ))}
          </div>
        </div>
      </section>

      {/* 合规声明区 */}
      <div className="section">
        <div className="section-inner">
          <RiskBanner lang={lang} t={t} />
        </div>
      </div>
    </div>
  );
}

Object.assign(window, { FaqPage });