// FAQ.jsx — accordion (reusable) + closing CTA band + footer
const phFaqsFull = [
  { q: 'What is Direct Primary Care?', a: 'A membership for your primary care. One simple monthly fee, direct access to your provider, longer visits, and care built around you.' },
  { q: 'Do I still need health insurance?', a: 'Yes. DPC works alongside insurance. It doesn’t replace it. Keep a high-deductible or catastrophic plan for big things like hospital stays, specialists, and emergencies.' },
  { q: 'What does my membership include?', a: 'Most everyday care: preventive visits, sick visits (in person and virtual), chronic disease and medication management, women’s health, mental health screening and support, and referral coordination, plus direct messaging and discounted labs.' },
  { q: 'Are there extra costs?', a: 'Some labs, medications, and outside imaging or specialist visits. There are no copays, hidden fees, or surprise bills.' },
  { q: 'Can I use my HSA or FSA?', a: 'Often yes for qualified costs. Rules on membership fees vary, so check with your HSA provider or tax advisor.' },
  { q: 'How do I schedule a visit?', a: 'Request a visit or message your provider through the secure portal, and ask for same-day or next-day care.' },
  { q: 'Do you offer in-person visits?', a: 'Yes, a weekly in-person clinic day, unhurried and on your schedule.' },
  { q: 'Can I reach my provider between visits?', a: 'Yes, by secure message, usually with a reply within 24 hours.' },
  { q: 'Do you offer telemedicine?', a: 'Yes, with the same personal attention as an in-person visit.' },
  { q: 'Is this insurance?', a: 'No. It’s a membership for primary care and doesn’t replace health coverage.' },
  { q: 'How do I join?', a: 'Start by sharing your interest through the form on the Enroll page. There’s no commitment to start. Azra will reach out personally to answer your questions and help you decide if it’s the right fit.' },
  { q: 'What if I have an emergency?', a: 'Call 911 or go to the nearest emergency room. DPC is for primary care, not emergencies.' },
];
const phFaqsHome = phFaqsFull.slice(0, 5);

function FAQ({ items = phFaqsHome, eyebrow = 'Good questions', title = 'The things people ask us most.',
  sub, warm = true, showHead = true, defaultOpen = 0 }) {
  const [open, setOpen] = useState(defaultOpen);
  return (
    <section className={'ph-section' + (warm ? ' is-warm' : '')} id="faq">
      <div className="ph-container ph-faq-wrap">
        {showHead && <SectionHead center eyebrow={eyebrow} title={title} sub={sub} />}
        <div className="ph-faq">
          {items.map((f, i) => {
            const isOpen = open === i;
            return (
              <div className={'ph-faq-item' + (isOpen ? ' is-open' : '')} key={f.q}>
                <button className="ph-faq-q" onClick={() => setOpen(isOpen ? -1 : i)} aria-expanded={isOpen}>
                  <span>{f.q}</span>
                  <Icon name="chevron" size={22} color="#1E364E" />
                </button>
                <div className="ph-faq-a"><p>{f.a}</p></div>
              </div>
            );
          })}
        </div>
      </div>
    </section>
  );
}

function CTABand() {
  return (
    <section className="ph-cta" id="join">
      <div className="ph-container ph-cta-inner">
        <div>
          <span className="eyebrow ph-cta-eyebrow">No copays · No hidden fees</span>
          <h2>Ready for care that takes its time?</h2>
          <p>Just simple, caring healthcare, and a provider who’s glad to see you.</p>
        </div>
        <div className="ph-cta-actions">
          <a className="btn btn-green btn-lg" href="enroll.html">Become a member</a>
          <a className="btn btn-lg ph-btn-ghostlight" href="contact.html">Book a meet-and-greet</a>
        </div>
      </div>
    </section>
  );
}

const phLegal = [
  { label: 'Privacy Policy', href: 'privacy.html' },
  { label: 'Terms of Use', href: 'terms.html' },
  { label: 'Membership Agreement', href: 'membership-agreement.html' },
  { label: 'Notice of Non-Insurance', href: 'notice-of-non-insurance.html' },
  { label: 'Accessibility', href: 'accessibility.html' },
];

function Footer({ portal = 'https://peacefulheartsdpc.atlas.md' }) {
  return (
    <footer className="ph-footer">
      <div className="ph-container ph-footer-grid">
        <div className="ph-footer-brand">
          <img src="assets/peaceful-hearts-logo-white-trim.png" alt="Peaceful Hearts Direct Primary Care" />
          <p>Membership-based primary care for adults in Orlando, Florida. Calm, personal, and
            built around a real relationship with your provider.</p>
        </div>
        <div className="ph-footer-col">
          <h4>Get in touch</h4>
          <p><Icon name="pin" size={16} color="#8AA1B7" /> 1010 Arthur Avenue, Suite C, Orlando, FL 32804</p>
          <a href="mailto:info@peacefulheartsdirect.com"><Icon name="mail" size={16} color="#8AA1B7" /> info@peacefulheartsdirect.com</a>
          <a href={portal} target="_blank" rel="noopener"><Icon name="user" size={16} color="#8AA1B7" /> Patient portal ↗</a>
        </div>
        <div className="ph-footer-col">
          <h4>Explore</h4>
          <a href="what-is-dpc.html">What is DPC</a>
          <a href="services.html">Services</a>
          <a href="membership.html">Membership</a>
          <a href="about.html">About</a>
          <a href="faq.html">FAQ</a>
          <a href="contact.html">Contact</a>
          <a href="enroll.html">Become a member</a>
        </div>
        <div className="ph-footer-col">
          <h4>Legal</h4>
          {phLegal.map(l => <a key={l.label} href={l.href}>{l.label}</a>)}
        </div>
      </div>
      <div className="ph-container ph-footer-bottom">
        <span>© 2026 Peaceful Hearts Direct Primary Care. All rights reserved.</span>
        <span>Membership is not health insurance and does not replace it.</span>
      </div>
    </footer>
  );
}
Object.assign(window, { FAQ, CTABand, Footer, phFaqsFull, phFaqsHome });