/* global React, ReactDOM, PageNav, PageFooter, PageHeader, applyTweaks */
const { useState } = React;
applyTweaks();

/* generic content page */
window.renderContentPage = function ({ eyebrow, title, titleEm, sub, body }) {
  function App() {
    return (<>
      <PageNav />
      <PageHeader eyebrow={eyebrow} title={title} titleEm={titleEm} sub={sub} />
      <section className="content"><div className="container">{body()}</div></section>
      <PageFooter />
    </>);
  }
  ReactDOM.createRoot(document.getElementById("root")).render(<App />);
};

/* legal page (Privacy / Terms / DPA / Cookies / Security all share this) */
window.renderLegal = function ({ eyebrow, title, titleEm, sub, sections }) {
  window.renderContentPage({
    eyebrow, title, titleEm, sub,
    body: () => (
      <>
        <p className="mono" style={{marginBottom:32}}>Last updated: April 2026</p>
        {sections.map((s, i) => (
          <React.Fragment key={i}>
            <h2>{s.h}</h2>
            {s.p.map((para, j) => <p key={j}>{para}</p>)}
            {s.list && <ul>{s.list.map((l, k) => <li key={k}>{l}</li>)}</ul>}
          </React.Fragment>
        ))}
      </>
    ),
  });
};