// ============================================================================
// StyleKro — APP ROOT (split from app.jsx on 2026-06-26).
// MUST load LAST: defines App() router and calls ReactDOM.createRoot().render().
// All page components must already be defined by the earlier babel scripts.
// ============================================================================
function App() {
  return (
    <AuthProvider>
      <ConfirmProvider>
        <HashRouter>
          <Routes>
            <Route path="/" element={<HomeRedirect />} />
            <Route path="/login" element={<LoginPage />} />
            <Route path="/privacy" element={<PrivacyPage />} />
            <Route path="/delete-account" element={<DeleteAccountPage />} />
            <Route path="/profile" element={<Protected><ProfilePage /></Protected>} />
            <Route path="/choose-experience" element={<Protected><ChooseExperiencePage /></Protected>} />
            <Route path="/chat" element={<Protected experience="buyer"><ChatPage /></Protected>} />
            <Route path="/wardrobe" element={<Protected experience="buyer"><WardrobePage /></Protected>} />
            <Route path="/shops" element={<Protected experience="buyer"><ShopsPage /></Protected>} />
            <Route path="/shops/:id" element={<Protected><ShopDetailPage /></Protected>} />
            <Route path="/shops/:shopId/items/:garmentId" element={<Protected><BuyerGarmentDetailPage /></Protected>} />
            <Route path="/looks" element={<Protected experience="buyer"><MyLooksPage /></Protected>} />
            <Route path="/shop/manage" element={<Protected experience="seller"><ManageShopPage /></Protected>} />
            <Route path="/shop/manage/items/:garmentId" element={<Protected experience="seller"><ManageGarmentDetailPage /></Protected>} />
            <Route path="/shop/settings" element={<Protected experience="seller"><ShopSettingsPage /></Protected>} />
            <Route path="*" element={<Navigate to="/" replace />} />
          </Routes>
        </HashRouter>
      </ConfirmProvider>
    </AuthProvider>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);