/* ============================================================
   APP — main router + mounting
   ============================================================ */

function App() {
  const { path } = useRouter();

  // Routing
  let page;
  if (path === '/' || path === '') page = <HomePage />;
  else if (path === '/cats' || path.startsWith('/cats/')) page = <CatsPage />;
  else if (path === '/menu') page = <MenuPage />;
  else if (path === '/reservations') page = <ReservationsPage />;
  else if (path === '/about') page = <AboutPage />;
  else if (path === '/gallery') page = <GalleryPage />;
  else if (path === '/blog') page = <BlogPage />;
  else page = <HomePage />;

  return (
    <div className="app-root">
      <Header />
      <main key={path}>
        {page}
      </main>
      <Footer />
      <FloatingBookCta />
    </div>
  );
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <LangProvider>
    <RouterProvider>
      <App />
    </RouterProvider>
  </LangProvider>
);