import { BrowserRouter, Routes, Route } from 'react-router-dom';
import { QueryProvider } from './providers/QueryProvider';
import { ThemeProvider } from './providers/ThemeProvider';
import { Toaster } from '@/components/ui/toaster';
import { Layout } from './components/layout/Layout';
import { Dashboard } from './pages/Dashboard';
import { ScenariosPage } from './pages/ScenariosPage';
import { ScenarioDetail } from './pages/ScenarioDetail';
import { Compare } from './pages/Compare';
import { Reports } from './pages/Reports';
import { NotFound } from './pages/NotFound';

function App() {
  return (
    <ThemeProvider defaultTheme="system">
      <QueryProvider>
        <BrowserRouter>
          <Routes>
            <Route path="/" element={<Layout />}>
              <Route index element={<Dashboard />} />
              <Route path="scenarios" element={<ScenariosPage />} />
              <Route path="scenarios/:id" element={<ScenarioDetail />} />
              <Route path="scenarios/:id/reports" element={<Reports />} />
              <Route path="compare" element={<Compare />} />
              <Route path="*" element={<NotFound />} />
            </Route>
          </Routes>
        </BrowserRouter>
        <Toaster />
      </QueryProvider>
    </ThemeProvider>
  );
}

export default App;