/* Gisler Votes No — layout pieces (Jordan's flat redesign, Sept 2026) */

function Hero() {
  return (
    <section className="hero" data-screen-label="01 Hero">
      <div className="hero-photo" />
      <div className="hero-scrim" />
      <div className="hero-content">
        <div className="eyebrow">His record. Vote by vote.</div>
        <h1 className="hero-title">
          <span className="line-1">Eric Gisler</span>
          <span className="line-2">Votes <em className="no">“No”</em></span>
          <span className="line-3">And Hurts</span>
          <span className="line-4">Georgia Families</span>
        </h1>
        <p className="hero-summary">
          Eric Gisler's voting record tells the story. Property taxes. Seniors.
          School choice. Public safety. See the votes for yourself.
        </p>
      </div>
      <div className="hero-footer"><span>See his record</span><span className="arrow">▼</span></div>
    </section>
  );
}

function TaxSection() {
  return (
    <section className="tax"
      ref={(el) => { if (el && window.__trackIO) window.__trackIO.observe(el); }}
      data-track-kind="feature" data-track-key="feature-proptax" data-track-id="proptax"
      data-track-category="anti-community" data-track-position={0}
      data-screen-label="Feature - Property Tax"
    >
      <div className="wrap">
        <div className="eyebrow">June 2026 · Special Session</div>
        <h2>Property Tax Relief?<br /><span className="red">Gisler Voted No.</span></h2>
        <p className="lead">
          Sixty-six local bills would have let Georgia voters decide whether to
          use a one-cent sales tax to lower property taxes.{" "}
          <strong>The decision would have belonged to the voters. Gisler voted no.</strong>
        </p>
        <div className="stats">
          <div className="stat"><b>66</b><span>Chances for voters to decide</span></div>
          <div className="stat"><b className="red">NO</b><span>Gisler's vote</span></div>
        </div>
        <div className="punch">
          He didn't just vote against property tax relief. He voted against
          letting you decide.
        </div>
      </div>
    </section>
  );
}

function LocalBillsSection({ localBills }) {
  return (
    <section className="bill-list-section" data-screen-label="66 local bills">
      <div className="wrap">
        <div className="eyebrow">The 66 local bills</div>
        <h3 className="cond">66 Communities.<br /><span className="red">66 Chances to Decide.</span></h3>
        <p className="bill-list-intro">
          These are the local homestead-exemption bills considered during the
          June 2026 special session.
        </p>
        <div className="bill-grid">
          {localBills.map((b) => (
            <div className="local-bill" key={b.id}>
              <div className="num">{b.id}</div>
              <div className="place">{b.place}</div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

function CloseSection() {
  const [copied, setCopied] = useState(false);

  async function copyLink() {
    try {
      await navigator.clipboard.writeText(window.location.href);
      setCopied(true);
      setTimeout(() => setCopied(false), 2200);
    } catch (e) {}
  }
  async function shareRecord() {
    if (navigator.share) {
      try { await navigator.share({ title: document.title, url: window.location.href }); return; } catch (e) {}
    }
    copyLink();
  }

  return (
    <section className="close" data-screen-label="Footer / CTA">
      <div className="wrap">
        <h2>Now You Know.<span>Make It Count.</span></h2>
        <p>
          <strong>The record is public. The choice is yours.</strong><br />
          Share it with someone who lives in House District 121. And remember it
          in November.
        </p>
        <div className="buttons">
          <button className="btn primary" onClick={shareRecord}>Share the record</button>
          <button className="btn" onClick={copyLink}>{copied ? "Link copied" : "Copy link"}</button>
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { Hero, TaxSection, LocalBillsSection, CloseSection });