// MostlyPrivacy — the ONE marketing chrome (nav + footer + visible FAQ) shared by every
// crawlable page: the landing, /pricing, /compare*, /integrations/*, the generator and
// banner pages and the /cookie-scanner tool.
//
// WHY ONE FILE. Each standalone page used to carry its own copy of the nav/footer, with
// hardcoded English labels and onClick-only links — so the localized surface had almost no
// crawlable internal links, and the few it had pointed at the ENGLISH URL from all 36 locale
// copies (97% of internal links crossed a locale boundary, 175 orphans; 2026-10-01 audit).
// Every per-locale href below goes through window.mpPath (mp/shared.jsx over
// @mostly-tiny/i18n core/locale-path.js); single routes (/signin, /blog, /legal/*) stay literal.
//
// IIFE-scoped: the page modules share one global script scope.
(function () {
const F = window.ForgeDesignSystem_e40d74;
const { Button } = F;
const { Icon, ICONS, PrivacyMark, Wordmark, mpPath } = window.MP;
const I18N = (typeof window !== "undefined" && window.ForgeI18n) || { t: (k) => k };
const tr = (k, a) => I18N.t(k, a);
const P = (p) => (mpPath ? mpPath(p) : p);

// The crawlable marketing pages, in nav/footer order. `key` → chrome.link.<key> label.
const PRODUCT_LINKS = [
  { key: "banner", path: "/cookie-consent-banner" },
  { key: "privacy", path: "/privacy-policy-generator" },
  { key: "cookie", path: "/cookie-policy-generator" },
  { key: "terms", path: "/terms-and-conditions-generator" },
  { key: "scanner", path: "/cookie-scanner" },
  { key: "pricing", path: "/pricing" },
];
// Competitor names are proper nouns — the "vs <name>" label is brand text, not copy.
const COMPARE_LINKS = [
  { name: "Termly", path: "/compare/termly" },
  { name: "Cookiebot", path: "/compare/cookiebot" },
  { name: "CookieYes", path: "/compare/cookieyes" },
  { name: "iubenda", path: "/compare/iubenda" },
  { name: "TermsFeed", path: "/compare/termsfeed" },
];

function MPNav({ nav, cta = "banner" }) {
  const go = nav || window.mpNav;
  return (
    <header className="mp-nav">
      <div className="mp-wrap mp-nav__inner">
        <a className="mp-brand" href={P("/")}><PrivacyMark s={28} /><Wordmark /></a>
        <nav className="mp-nav__links">
          <a href={P("/cookie-consent-banner")}>{tr("landing.nav.cookieBanner")}</a>
          <a href={P("/privacy-policy-generator")}>{tr("chrome.nav.generators")}</a>
          <a href={P("/cookie-scanner")}>{tr("chrome.nav.scanner")}</a>
          <a href={P("/pricing")}>{tr("landing.nav.pricing")}</a>
          <a href={P("/compare")}>{tr("chrome.nav.compare")}</a>
        </nav>
        <div className="mp-nav__cta">
          <a className="forge-btn forge-btn--ghost forge-btn--sm" href="/signin">{tr("landing.nav.signin")}</a>
          <Button variant="primary" size="sm" iconRight={<Icon d={ICONS.arrow} size={15} />} onClick={() => go("app", cta)}>{tr("landing.nav.getStarted")}</Button>
        </div>
      </div>
    </header>
  );
}

function MPFooter() {
  const columns = [
    { heading: tr("landing.footer.col.product"),
      links: PRODUCT_LINKS.map((l) => ({ label: tr("chrome.link." + l.key), href: P(l.path) })) },
    { heading: tr("chrome.nav.compare"),
      links: COMPARE_LINKS.map((l) => ({ label: "vs " + l.name, href: P(l.path) })) },
    // Company + Legal are completed by the kit (Support, Status, the registry's legal documents).
    { key: "company", heading: tr("chrome.col.company"),
      links: [
        // /blog is English-only (content.config.js) → a single literal route, never P().
        { label: tr("chrome.link.blog"), href: "/blog" },
        { label: "MostlyRender (PDF export)", href: P("/integrations/mostlyrender") },
        { label: tr("chrome.link.home"), href: P("/") },
      ] },
    { key: "legal", heading: tr("landing.footer.col.legal"), links: [] },
  ];
  return (
    <window.ForgeKit.Footer
      brand={<a className="mp-brand" href={P("/")}><PrivacyMark s={26} /><Wordmark size={17} /></a>}
      tagline={tr("landing.footer.tagline")}
      columns={columns}
      suiteSelf="https://mostlyprivacy.com"
      version="MostlyPrivacy · v1.0"
    />
  );
}

// The visible FAQ for a seo.config.js page. Reads seo.<seoKey>.faq.<i>.q/.a — the SAME keys
// the build turns into the FAQPage JSON-LD and llms.txt — so the visible Q&A, the schema and
// the 36 locales stay one source (Google requires FAQ markup to match visible content).
function MPFaq({ seoKey, n = 10, eyebrow, heading }) {
  const items = [];
  for (let i = 0; i < n; i++) {
    const q = tr("seo." + seoKey + ".faq." + i + ".q");
    const a = tr("seo." + seoKey + ".faq." + i + ".a");
    // tr() returns the key itself when missing — skip an un-authored slot.
    if (q && q.indexOf("seo." + seoKey + ".faq.") !== 0) items.push({ q, a });
  }
  if (!items.length) return null;
  return (
    <section className="mp-section int-faq" id="faq">
      <div className="mp-wrap">
        <div className="mp-section-head" style={{ marginBottom: 22 }}>
          <span className="mp-eyebrow">{eyebrow || tr("chrome.faq.eyebrow")}</span>
          <h2 className="mp-h2">{heading || tr("chrome.faq.heading")}</h2>
        </div>
        <div className="int-faq__list">
          {items.map((it, i) => (
            <details className="int-faq__item" key={i} open={i === 0}>
              <summary>{it.q}</summary>
              <p>{it.a}</p>
            </details>
          ))}
        </div>
      </div>
    </section>
  );
}

window.MP = Object.assign(window.MP || {}, { MPNav, MPFooter, MPFaq, PRODUCT_LINKS, COMPARE_LINKS });
})();