/* Template 3 - part C: orthodontist, finance, reviews(tabs), FAQ, final CTA, footer */
(function () {
  const e = React.createElement;
  const { useState } = React;
  const { useCountdown, fmtDate } = window;
  const Icon = window.Icon;
  const B = (props, ...kids) => e(window.T3Btn, props, ...kids);

  /* orthodontist ---------------------------------------------------------- */
  const Ortho = ({ cfg }) =>
    e("section", { className: "t3-sec t3-cont" },
      e("div", { className: "t3-ortho__grid" },
        e("div", { className: "t3-ortho__visual" },
          e("div", { className: "t3-ortho__img" }, e("img", { src: "assets/photo-saroshen.png", alt: "Dr Saroshen Naidoo" })),
          e("div", { className: "t3-ortho__chip" },
            e("div", null,
              e("b", null, "Dr Saroshen Naidoo"),
              e("span", null, "PGDip in Orthodontics")),
            e("span", { className: "badge" }, "Aligners & braces"))),
        e("div", { className: "t3-ortho__copy" },
          e("span", { className: "t3-kick" }, "The person you'll meet"),
          e("h2", { className: "t3-h2" }, "Meet ", e("span", { className: "alt" }, "Dr Saroshen Naidoo"), "."),
          e("p", { className: "t3-body" },
            "Dr Naidoo has managed complex orthodontic cases for over a decade \u2013 adults and children, aligner and fixed, including challenging cases like impacted canines and severe crowding. He treats the full range of cases \u2013 not just the straightforward ones \u2013 across our practices."),
          e("ul", { className: "t3-cred" },
            [["PGDip in Orthodontics"],
             ["Works primarily with Spark aligners and 32co"],
             ["Experienced with Invisalign, ceramic and metal fixed braces, and adult lingual braces"],
             ["Honest \u2013 he'll tell you if there isn't a route to a straighter smile"]].map(([t], i) =>
              e("li", { key: i }, e(Icon, { name: "check" }),
                e("span", null, e("b", null, t))))),
          e("p", { className: "t3-body", style: { margin: "0 0 24px" } }, "De-ientes is a family practice. Dr Naidoo grew up in it \u2013 and that shapes how he treats people."),
          B({ variant: "light", href: "#reserve" }, "Reserve your spot"))),
    );

  /* finance --------------------------------------------------------------- */
  const Finance = ({ cfg }) =>
    e("section", { className: "t3-sec t3-cont", id: "finance" },
      e("div", { className: "t3-fin__card t3-reveal" },
        e("img", { className: "t3-fin__leaf", src: "assets/logo-mark-leaves.png", alt: "" }),
        e("div", { className: "t3-fin__head" },
          e("span", { className: "t3-kick", style: { color: "var(--t3-gold)" } }, "Costs & finance"),
          e("h2", { className: "t3-h2" }, "From the price of a ", e("span", { className: "alt" }, "coffee a day"), "."),
          e("p", { className: "t3-lead" }, "Most patients spread treatment over ", cfg.financeTerm, " with 0% finance, so it can cost less each month than you'd expect. Your exact price depends on your case \u2013 you'll get a clear, written plan before you commit to anything.")),
        e("div", { className: "t3-fin__grid" },
          [["\u00a34,500", "", "Clear aligners, from", "Before your open-day discount, free whitening and retainers."],
           ["\u00a33,450", "", "Fixed braces, from", "From price; final cost by complexity, for children and adults."]].map(([big, suf, t, s], i) =>
            e("div", { className: "t3-fin__stat", key: i },
              e("div", { className: "t3-fin__big" }, big, suf && e("small", null, suf)),
              e("div", { className: "t3-fin__t" }, t),
              e("div", { className: "t3-fin__s" }, s)))),
        e("p", { className: "t3-fin__note" },
          "0% finance is available to help spread the cost, subject to status. To secure your spot we take a \u00a320 deposit \u2013 it comes off your treatment if you go ahead, or is fully refunded if you cancel, and is only forfeited for a no-show without notice. ", cfg.practice, " is a credit broker, not a lender.")),
    );

  /* reviews ---------------------------------------------------------------- */
  const Reviews = ({ cfg }) =>
    e("section", { className: "t3-sec t3-cont" },
      e("div", { className: "t3-rev__head" },
        e("div", null,
          e("span", { className: "t3-kick" }, "Loved locally"),
          e("h2", { className: "t3-h2", style: { marginTop: 14 } }, "Smiles that started ", e("span", { className: "alt" }, "like yours"), "."))),
      e("div", { className: "t3-rev__grid" },
        cfg.reviews.map(({ text, name }, i) => e("div", { className: "t3-revcard", key: i },
          e("div", { className: "t3-revcard__st" }, "\u2605\u2605\u2605\u2605\u2605"),
          e("p", { className: "t3-revcard__q" }, "\u201C", text, "\u201D"),
          e("div", { className: "t3-revcard__by" },
            e("div", null, e("div", { className: "t3-revcard__n" }, name), e("div", { className: "t3-revcard__m" }, "Google review")))))),
    );

  /* faq ------------------------------------------------------------------- */
  const FAQ = ({ cfg }) => {
    const [open, setOpen] = useState(0);
    const items = [
      ["How do I secure my spot?", "Fill in the form on this page and we'll call you back to confirm your time slot and take a \u00a320 deposit over the phone. The deposit comes off your treatment if you go ahead, or is refunded if you cancel \u2013 it's only forfeited if you don't attend without letting us know in advance."],
      ["Is the open day for children, adults, or both?", "Both. Dr Naidoo treats children and adults, and the assessment suits anyone considering orthodontic treatment. Booking for your child? Come along together \u2013 the consultation covers exactly what's suitable for their age and development."],
      ["What treatments does it cover?", "All types of orthodontic treatment \u2013 clear aligners (Spark, 32co and Invisalign), fixed metal and ceramic braces, and hidden lingual braces for adults. Dr Naidoo will recommend what suits you best."],
      ["What if I've already had a consultation elsewhere?", "No problem at all. If you've had a scan or assessment elsewhere and want a second opinion, bring any records you have and Dr Naidoo will give you his honest view."],
      ["Will I be able to start treatment on the day?", "Not on the day itself \u2013 the assessment comes first. If you decide to go ahead, the team will book your next appointment before you leave, and your \u00a3500 discount and package inclusions are secured from that point."],
      ["Can I spread the cost?", "Yes \u2013 0% finance is available to help spread the cost, subject to status. Ask the team for details when you attend."],
      ["What if I can't make either date?", "Fill in the form to register your interest and we'll call you back \u2013 just let us know that neither date works, and we'll do our best to offer you the next available opportunity."],
      ["Is there parking?", cfg.parking],
    ];
    return e("section", { className: "t3-sec t3-cont", id: "faq" },
      e("div", { className: "t3-faq__grid" },
        e("div", { className: "t3-faq__head" },
          e("span", { className: "t3-kick" }, "Good to know"),
          e("h2", { className: "t3-h2" }, "Your questions, ", e("span", { className: "alt" }, "answered"), ".")),
        e("div", { className: "t3-faq__list" },
          items.map(([q, a], i) => e("div", { className: "t3-faq__item", key: i, "data-open": open === i },
            e("button", { className: "t3-faq__q", onClick: () => setOpen(open === i ? -1 : i) },
              e("span", null, q),
              e("span", { className: "t3-faq__ic" }, e(Icon, { name: "plus" }))),
            e("div", { className: "t3-faq__a", style: { maxHeight: open === i ? 260 : 0 } },
              e("div", { className: "t3-faq__a-in" }, a)))))));
  };

  /* final cta ------------------------------------------------------------- */
  const FinalCTA = ({ cfg }) => {
    const t = useCountdown(cfg.eventISO);
    const u = [["Days", t.days], ["Hrs", t.hours], ["Min", t.mins], ["Sec", t.secs]];
    return e("section", { className: "t3-sec t3-cont" },
      e("div", { className: "t3-final__card t3-ondark" },
        e("img", { className: "t3-final__leaf", src: "assets/logo-mark-leaves.png", alt: "" }),
        e("div", { className: "t3-final__inner" },
          e("span", { className: "t3-eyebrow t3-eyebrow--plain" }, "Filling fast"),
          e("h2", { className: "t3-display" }, "Only ", cfg.slots, " spaces in ", e("span", { className: "alt" }, cfg.location), "."),
          e("p", { className: "t3-final__fine", style: { marginTop: 8, color: "var(--t3-gold)" } }, "Golders Green \u2013 Sat 11 July \u00b7 Bedford \u2013 Sat 18 July \u00b7 filling from 12 June"),
          e("div", { className: "t3-final__cd" },
            u.map(([l, v], i) => e("div", { className: "u", key: i },
              e("b", null, String(v).padStart(2, "0")), e("span", null, l)))),
          e("p", { className: "t3-lead", style: { maxWidth: 640, margin: "0 auto 28px" } }, "If you've been thinking about treatment for yourself or your child, and you want a proper assessment, a clear plan and a real saving on getting started, it's worth an hour of your day."),
          e("div", { className: "t3-final__actions" },
            B({ variant: "gold", lg: true, href: "#reserve" }, "Reserve my spot"),
            B({ variant: "light", lg: true, href: "tel:" + cfg.phone }, "Call " + cfg.phone)),
          e("p", { className: "t3-final__fine" }, "De-ientes ", cfg.location, " \u00b7 ", cfg.address, " \u00b7 ", cfg.email))),
    );
  };

  /* footer ---------------------------------------------------------------- */
  const Footer = ({ cfg }) =>
    e("footer", { className: "t3-footer" },
      e("div", { className: "t3-footer__card" },
        e("div", { className: "t3-footer__top" },
          e("div", null,
            e("div", { className: "t3-footer__brand" },
              e("img", { className: "t3-footer__logo", src: "assets/logo-full-color.png", alt: cfg.practice })),
            e("p", { style: { maxWidth: 340 } }, "A family-run, specialist-led practice helping people across ",
              cfg.city, " smile with confidence. We look forward to seeing you on the day."),
            e("div", { className: "t3-footer__badges" },
              ["Specialist-led care", "GDC Registered", "CQC Regulated"].map((b, i) =>
                e("span", { className: "t3-footer__badge", key: i }, b)))),
          e("div", null,
            e("h4", null, "Visit us"),
            e("p", { style: { fontWeight: 600, color: "var(--t3-ink)" } }, "De-ientes ", cfg.location),
            e("p", null, cfg.address),
            e("p", { style: { marginTop: 10 } }, e("a", { href: "tel:" + cfg.phone }, cfg.phone)),
            e("p", null, e("a", { href: "mailto:" + cfg.email }, cfg.email))),
          e("div", null,
            e("h4", null, "The open day"),
            e("ul", null,
              [["What's included", "#offer"], ["The day", "#day"], ["Your options", "#treatments"], ["Costs & finance", "#finance"], ["FAQs", "#faq"], ["Reserve your spot", "#reserve"]].map(([l, h], i) =>
                e("li", { key: i }, e("a", { href: h }, l)))))),
        e("div", { className: "t3-footer__bar" },
          e("span", null, "\u00A9 ", new Date().getFullYear(), " ", cfg.practice, ". All rights reserved."),
          e("span", null, "Treatment subject to clinical suitability. Offer valid on the advertised open day only."))),
    );

  /* sticky mobile CTA (phones only, after ~520px scroll) ----------------- */
  const StickyCTA = ({ cfg }) => {
    const [show, setShow] = useState(false);
    React.useEffect(() => {
      const onScroll = () => setShow(window.scrollY > 520);
      window.addEventListener("scroll", onScroll, { passive: true });
      onScroll();
      return () => window.removeEventListener("scroll", onScroll);
    }, []);
    return e("div", { className: "t3-stickycta" + (show ? " is-on" : ""), "aria-hidden": !show },
      e("a", { className: "t3-stickycta__call", href: "tel:" + cfg.phone, "aria-label": "Call us" },
        e(Icon, { name: "phone" }), e("span", null, "Call")),
      e("a", { className: "t3-stickycta__book", href: "#reserve" }, "Reserve your spot"));
  };

  window.T3C = { Ortho, Finance, Reviews, FAQ, FinalCTA, Footer, StickyCTA };
})();
