// Section 8.6 — Common questions (FAQ accordion).
// Sits between the membership explainer (Section 8.5) and the intake board (Section 9).
// One question open at a time; smooth height transition.

const FAQS = [
  {
    q: "What if my child doesn't complete the weekly work?",
    a: "The grade improvement guarantee applies to students who complete the baseline submission in Week 1 and the final submission in Week 3 or 4 (depending on programme). If your child doesn't submit either, the guarantee doesn't apply, but they remain in the cohort and receive all teaching, feedback, and materials. We don't kick students out for missed deadlines; we expect that life happens.",
  },
  {
    q: "Who actually teaches and marks my child's work?",
    a: "The coach who scored 7 in your child's specific subject. Economics is taught and marked by Steven, History by Sebastian, English A by Steven or Elijah. Each piece of marked feedback comes from the named coach, not a junior or a teaching assistant.",
  },
  {
    q: "How is the teacher-assessed grade verified for the refund?",
    a: "You submit a documented baseline before the programme starts; usually the most recent mock grade or teacher-assessed mark on the specific component. After the programme, you submit the updated teacher-assessed grade. If it hasn't improved, full refund. We don't require IB moderation; only the teacher's mark before moderation.",
  },
  {
    q: "Will this conflict with my child's school academic integrity policy?",
    a: "No. Our coaches review structural decisions before your child writes. They never generate ideas, write prose, edit drafts, or touch the document. This is the level of support a good supervisor should provide. See the \"Is this academic dishonesty?\" section above for the exact breakdown of what we do and don't do.",
  },
  {
    q: "Can we pay in instalments?",
    a: "Yes. Email hello@iborbit.com after applying and we'll set up a two-payment plan: 50% on acceptance, 50% before Week 2. No extra fees.",
  },
  {
    q: "My child's English isn't their first language. Will they keep up with the cohort?",
    a: "Probably yes. Our cohorts include students from international schools across Asia, Europe, and the Middle East, most of whom are working in English as a second language. Live sessions are recorded so your child can re-watch and read along. If we don't think it's a fit after the Week 1 baseline, we'll refund you in full and recommend a more suitable approach.",
  },
  {
    q: "Are sessions recorded? Can parents review them?",
    a: "Live sessions and recorded coach commentary are available to the student inside the iBOrbit community. They're not public, but your child can share them with you. Marked feedback is written, time-stamped, and shareable.",
  },
  {
    q: "What's your cancellation policy before the programme starts?",
    a: "Full refund if you cancel more than 7 days before the cohort start date. 50% refund within 7 days. No refund after the programme starts, but the grade improvement guarantee still applies if your child completes the required submissions.",
  },
  {
    q: "Do you work with students from non-English IB schools?",
    a: "Yes for English-language IB components (English A, English IO, IAs and EEs written in English). Not yet for non-English language components.",
  },
  {
    q: "What happens after the programme ends?",
    a: "The cohort group chat stays open until results day. Your child keeps access to the recorded sessions and feedback indefinitely. iBOrbit members get continued access to weekly Q&As, Office Hours, and new exemplar walkthroughs as we add them.",
  },
];

const FaqRow = ({ q, a, open, onToggle }) => {
  const bodyRef = React.useRef(null);
  const [height, setHeight] = React.useState(0);

  React.useEffect(() => {
    if (open && bodyRef.current) {
      setHeight(bodyRef.current.scrollHeight);
    } else {
      setHeight(0);
    }
  }, [open, a]);

  return (
    <div className={`faq-row ${open ? "open" : ""}`}>
      <button
        type="button"
        className="faq-q"
        aria-expanded={open}
        onClick={onToggle}
      >
        <span className="faq-q-text">{q}</span>
        <span className="faq-indicator" aria-hidden="true">
          <span className="faq-plus">+</span>
        </span>
      </button>
      <div
        className="faq-a-wrap"
        style={{ height: `${height}px` }}
        aria-hidden={!open}
      >
        <div className="faq-a" ref={bodyRef}>
          <p>{a}</p>
        </div>
      </div>
    </div>
  );
};

const FaqSection = () => {
  const [openIndex, setOpenIndex] = React.useState(-1);

  return (
    <section className="section faq-section" id="faq">
      <div className="wide">
        <header className="section-head intensives-section-head align-left">
          <div className="eyebrow">Before you apply</div>
          <h2>
            Common <Scribble>questions.</Scribble>
          </h2>
        </header>

        <div className="faq-list">
          {FAQS.map((item, i) => (
            <FaqRow
              key={i}
              q={item.q}
              a={item.a}
              open={openIndex === i}
              onToggle={() => setOpenIndex(openIndex === i ? -1 : i)}
            />
          ))}
        </div>

        <p className="faq-footer">
          Other questions? Email{" "}
          <a href="mailto:hello@iborbit.com" className="faq-link">hello@iborbit.com</a>{" "}
          or DM Steven on Instagram{" "}
          <a href="https://instagram.com/jspark8" className="faq-link" target="_blank" rel="noopener">(@jspark8)</a>.
          We answer within 24 hours.
        </p>
      </div>
    </section>
  );
};

Object.assign(window, { FaqSection, FAQS, FaqRow });
