/* Aevitan website — Longevity Club program page. */
const DSlc = window.AevitanDesignSystem_6a042d;

function Club({ go }) {
  // B33: the tier grid renders the LIVE program (whatever the owner sets in Club admin).
  const [liveTiers, setLiveTiers] = React.useState(null);
  React.useEffect(() => {
    fetch('/api/tiers')
      .then((r) => r.json())
      .then((d) => { if (d && Array.isArray(d.tiers) && d.tiers.length) setLiveTiers(d.tiers); })
      .catch(() => {});
  }, []);
  // Membership is the single entry point for every persona. Signed-in members can open the optional
  // Subscription screen directly; signed-out visitors always complete the common free signup first.
  // Auth resolves via the shared /api/me promise
  // WITHOUT classifying "unresolved" as signed-out (window.__aevitanMe may not have settled at click time).
  const routePath = async () => {
    const portal = (typeof location !== 'undefined' && location.hostname === 'localhost')
      ? 'http://localhost:3001' : 'https://portal.aevitan.com';
    let me = window.__aevitanMe;
    if (me === undefined) {
      const ready = window.__aevitanMeReady
        || fetch(portal + '/api/me', { credentials: 'include' }).then((r) => (r.ok ? r.json() : null))
             .then((d) => (d && d.firstName ? { firstName: d.firstName } : false)).catch(() => false);
      try { me = await ready; } catch (e) { me = false; }
    }
    if (me && me.firstName) {
      // B54: the only 'sub' caller is gone and the subscriptions screen is retired — every
      // signed-in path now lands on the member's own dashboard.
      window.location.href = `${portal}/`;
      return;
    }
    window.location.href = portal + '/signup';
  };
  const { Kicker, Button, Badge } = DSlc;
  const staticTiers = [
    ['Foundation', 'Entry', '0%', 'No minimum', 'Standard'],
    ['Vitalis', 'Silver', '8%', 'Early access'],
    ['Meridian', 'Gold', '12%', 'Priority'],
    ['Apex', 'By invitation', '18%', 'First access'],
  ];
  // B54: the qualification threshold is no longer published. Standing is described, not tabulated.
  const tiers = liveTiers
    ? liveTiers.map((t) => [t.label, t.tag, `${t.pct}%`, t.priority])
    : staticTiers;
  return (
    <div>
      <section className="aevsite-band aevsite-band--top aevsite-visual-hero aevsite-club-hero">
        <div className="aevsite-visual-hero__bg" aria-hidden="true">
          <img src="../../assets/hero-club-4k.jpg" alt="" loading="eager" decoding="async" />
        </div>
        <div className="aevsite-visual-hero__fog" aria-hidden="true"></div>
        <div className="aevsite-wrap aevsite-reveal aevsite-visual-hero__content">
          <Kicker>Aevitan Longevity Club</Kicker>
          <h1 className="aevsite-h1">Membership that compounds.</h1>
          <p className="aevsite-lead">Membership is free for everyone. Club standing reflects sustained activity within the Club, and it opens the professional curation reports — the scientific board's full evaluation of a product, its certificate of analysis and the manufacturer's package insert.</p>
          <div className="aevsite-club-hero__actions">
            <Button variant="primary" onClick={() => routePath()}>Join the Club</Button>
            <Button variant="ghost" onClick={() => go('science')}>The Aevitan Standard</Button>
          </div>
        </div>
      </section>

      {/* ONE MEMBERSHIP, WITH OPTIONAL BENEFITS */}
      <section className="aevsite-band">
        <div className="aevsite-wrap aevsite-reveal">
          <div className="aevsite-sec-head"><div><Kicker>How to belong</Kicker><h2 className="aevsite-h2">One free membership. Benefits that grow.</h2></div></div>
          <div className="aevpath">
            <div className="aevpath__card">
              <div className="aevpath__who">Free membership</div>
              <div className="aevpath__name">Join the Longevity Club</div>
              <div className="aevpath__cost">No cost · one common signup</div>
              <p className="aevpath__desc">Patients and individuals, health professionals, clinics and qualified resellers all enter through the same basic membership form. Choose the profile that describes you and confirm the applicable declaration.</p>
              <ul className="aevpath__list">
                <li>Access to the portfolio of evaluated products</li>
                <li>Club services matched to your member profile</li>
                <li>Additional information completed only when a service requires it</li>
              </ul>
              <div className="aevpath__cta"><Button variant="gold" onClick={() => routePath()}>Join the Club</Button></div>
            </div>

            <div className="aevpath__card">
              <div className="aevpath__who">Member benefit</div>
              <div className="aevpath__name">Progressive discounts</div>
              <div className="aevpath__cost">Volume-based · from 0%</div>
              <p className="aevpath__desc">Active members progress through Club standing automatically. Standing is a recognition of participation in the Club, not a separate membership path, and it governs how much of the curation library stays open to you.</p>
              <ul className="aevpath__list">
                <li>Automatic discount from verified purchase history, up to 18% off</li>
                <li>No application or separate enrollment</li>
                <li>Your current standing and progress visible in your private area</li>
              </ul>
            </div>

            {/* B54: was "Subscription plans" — a paid recurring shipment Aevitan no longer runs. The
                real member perk is the professional curation report, so the card now describes that. */}
            <div className="aevpath__card aevpath__card--feature">
              <div className="aevpath__who">The member benefit</div>
              <div className="aevpath__name">Professional curation reports</div>
              <div className="aevpath__cost">Included · earned through Club standing</div>
              <p className="aevpath__desc">Every member reads the scientific board's opinion on each product. The professional report goes further: the board's full evaluation, the batch certificate of analysis, and the manufacturer's package insert. It opens when your consultant confirms an order and stays open while your standing holds.</p>
              <ul className="aevpath__list">
                <li>Full evaluation: scope, evidence, mechanism, quality, risk-reward</li>
                <li>Third-party certificate of analysis for the released batch</li>
                <li>Manufacturer package insert, transcribed and attributed</li>
              </ul>
              <div className="aevpath__cta"><Button variant="gold" onClick={() => routePath()}>Join the Club</Button></div>
            </div>
          </div>
        </div>
      </section>

      {/* COMPLIANCE DIFFERENTIATOR */}
      <section className="aevsite-band aevsite-mist">
        <div className="aevsite-wrap aevsite-narrow aevsite-reveal">
          <Kicker>Why we can ship where others can't</Kicker>
          <h2 className="aevsite-h2">Curation is also compliance.</h2>
          <p className="aevsite-lead">Because Aevitan curates its portfolio, every product carries complete technical and regulatory documentation. Our scientific board assesses each product for each market and member type before it can be requested — and where a lawful pathway exists, orders ship with the full documentation behind them.</p>
        </div>
      </section>

      {/* PROFESSIONAL TIERS */}
      <section className="aevsite-band">
        <div className="aevsite-wrap aevsite-reveal">
          <div className="aevsite-sec-head"><div><Kicker>Progressive discount benefit</Kicker><h2 className="aevsite-h2">Four tiers. One standard.</h2></div></div>
          <div className="aevclub-tiers">
            {tiers.map(([name, tag, pct, prio], i) => (
              <div key={name} className={`aevclub-tier ${i === 3 ? 'aevclub-tier--apex' : ''}`}>
                <div className="aevclub-tier__tag mono">{tag.toUpperCase()}</div>
                <div className="aevclub-tier__name">{name}</div>
                <div className="aevclub-tier__pct">−{pct}<span> on every order</span></div>
                <div className="aevclub-tier__meta">
                  <div><span className="muted">Priority</span><b>{prio}</b></div>
                </div>
              </div>
            ))}
          </div>
          <p className="muted sm" style={{ marginTop: 18 }}>Club standing reflects sustained activity within the Longevity Club and is reassessed continuously. Apex is by invitation. Standing may qualify you for preferential pricing with participating consultants.</p>
        </div>
      </section>

      {/* B54: the patient-subscription section is REMOVED. It described Aevitan building a bundle,
          shipping it on a cadence and coordinating customs — i.e. Aevitan as the seller and shipper,
          which is exactly what this batch stops being true. The Subscription plans destination is
          retired from the member portal, so advertising it publicly would sell a door that is shut. */}
    </div>
  );
}

window.Club = Club;