// blog.jsx — mounts the EXISTING site chrome on the build-generated blog pages.
// Reuses AnnouncementBar + Header + Footer from chrome.jsx (and the auto-injected
// WhatsApp FAB). The article/listing markup itself is real, build-time HTML that
// lives in <main> and is NOT touched by React. The chrome wrappers use
// `display:contents` so the sticky header shares the <body> scroll container.
(function () {
  function mount() {
    var top = document.getElementById('jynx-top');
    var bottom = document.getElementById('jynx-bottom');
    if (top && typeof Header !== 'undefined') {
      ReactDOM.createRoot(top).render(
        <React.Fragment>
          <AnnouncementBar />
          <Header />
        </React.Fragment>
      );
    }
    if (bottom && typeof Footer !== 'undefined') {
      ReactDOM.createRoot(bottom).render(<Footer />);
    }
  }
  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', mount);
  else mount();
})();
