(function () {
  const e = React.createElement;

  function mountWhenReady(render) {
    if (window.Header && window.SiteFooter && window.ConsultationCard && window.getBlogPost && window.Arrow) {
      render();
      return;
    }
    setTimeout(() => mountWhenReady(render), 40);
  }

  function renderInline(text) {
    const parts = [];
    const pattern = /(\[[^\]]*\]\([^\)]+\)|\*\*[^*]+\*\*|\*[^*]+\*|https?:\/\/\S+)/g;
    let last = 0;
    let match;
    let idx = 0;
    while ((match = pattern.exec(text)) !== null) {
      if (match.index > last) parts.push(text.slice(last, match.index));
      const token = match[0];
      if (token.startsWith("[")) {
        const parsed = token.match(/^\[([^\]]*)\]\(([^\)]+)\)$/);
        if (parsed && parsed[1].trim()) {
          parts.push(e("a", { href: parsed[2], target: "_blank", rel: "noreferrer", key: idx++ }, parsed[1]));
        }
      } else if (token.startsWith("**")) {
        parts.push(e("strong", { key: idx++ }, token.slice(2, -2)));
      } else if (token.startsWith("*")) {
        parts.push(e("em", { key: idx++ }, token.slice(1, -1)));
      } else {
        parts.push(e("a", { href: token, target: "_blank", rel: "noreferrer", key: idx++ }, token));
      }
      last = pattern.lastIndex;
    }
    if (last < text.length) parts.push(text.slice(last));
    return parts;
  }

  function renderParagraph(text, className) {
    return e("p", { className }, renderInline(text));
  }

  function renderListItem(item, idx) {
    const lines = Array.isArray(item) ? item : [item];
    return e("li", { key: idx }, lines.map((line, lineIdx) => renderParagraph(line, lineIdx > 0 ? "blog-source-line" : null)));
  }


  function parseTableRow(row) {
    return row.trim().replace(/^\|/, "").replace(/\|$/, "").split("|").map((cell) => cell.trim());
  }

  function renderTable(block, idx) {
    const rows = block.rows || [];
    const header = parseTableRow(rows[0] || "");
    const bodyRows = rows.slice(2).map(parseTableRow);
    return e("div", { className: "blog-table-wrap", key: idx },
      e("table", { className: "blog-table" },
        e("thead", null, e("tr", null, header.map((cell, cellIdx) => e("th", { key: cellIdx }, renderInline(cell))))),
        e("tbody", null, bodyRows.map((row, rowIdx) => e("tr", { key: rowIdx }, row.map((cell, cellIdx) => e("td", { key: cellIdx }, renderInline(cell))))))
      )
    );
  }
  function renderBlock(block, idx) {
    if (Array.isArray(block)) {
      return e("section", { className: "blog-article-block", key: block[0] || idx }, e("h2", null, block[0]), renderParagraph(block[1]));
    }
    if (block.type === "heading") return e("h2", { key: idx }, block.text);
    if (block.type === "paragraph") return renderParagraph(block.text, block.lead ? "blog-article-lead" : null);
    if (block.type === "list") return e("ul", { key: idx }, block.items.map(renderListItem));
    if (block.type === "table") return renderTable(block, idx);
    if (block.type === "html") return e("div", { className: "blog-html", key: idx, dangerouslySetInnerHTML: { __html: block.html || "" } });
    return null;
  }

  function BlogPostPage() {
    window.useReveal();
    const params = new URLSearchParams(window.location.search);
    const post = window.getBlogPost(params.get("post"));
    const blocks = post.blocks || post.body || [];
    React.useEffect(() => window.scrollTo(0, 0), []);
    return e("div", { className: "blog-page-shell" },
      e(window.Header),
      e("main", { className: "dark-theme" },
        e("section", { className: "article-hero article-hero--narrow blog-post-hero" },
          e("div", { className: "wrap article-hero__inner reveal" },
            e("p", { className: "eyebrow" }, post.category),
            e("h1", null, post.title, e("span", { className: "dot" }, "."))
          )
        ),
        e("section", { className: "sec sec--sunken blog-article-sec" },
          e("div", { className: "wrap blog-article-wrap" },
            e("article", { className: "article-body blog-article-body reveal" }, blocks.map(renderBlock)),
            e("aside", { className: "blog-booking reveal" },
              e(window.ConsultationCard, { slotId: "blog-post-consultation-card-avatar" })
            )
          )
        )
      ),
      e("div", { className: "dark-theme" }, e(window.SiteFooter))
    );
  }

  mountWhenReady(() => ReactDOM.createRoot(document.getElementById("root")).render(e(BlogPostPage)));
})();