/* ============================================================
   Main App — Router + page composition
   ============================================================ */

const PAGES = {
  home:        { Comp: window.HomePage,       label: "Home" },
  "ski-areas": { Comp: window.SkiAreasPage,   label: "Ski Areas" },
  programs:    { Comp: window.ProgramsPage,   label: "Programs" },
  statistics:  { Comp: window.StatisticsPage, label: "Statistics" },
  resources:   { Comp: window.ResourcesPage,  label: "Resources" },
  news:        { Comp: window.NewsPage,       label: "News" },
  contact:     { Comp: window.ContactPage,    label: "Contact" },
};

function App() {
  const { route } = useRoute();
  const page = PAGES[route] || PAGES.home;
  const Comp = page.Comp;
  return (
    <>
      <UtilityBar />
      <Nav />
      <main>{Comp ? <Comp /> : <div style={{padding:120, textAlign:"center"}}>Page not found</div>}</main>
      <Footer />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(
  <LanguageProvider>
    <RouteProvider><App /></RouteProvider>
  </LanguageProvider>
);