import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { RouterProvider } from 'react-router';
import '@fontsource/bebas-neue/latin-400.css';
import '@fontsource/dm-mono/latin-400.css';
import '@fontsource/dm-mono/latin-500.css';
import '@fontsource-variable/space-grotesk/wght.css';
import './styles/tokens.css';
import './styles/base.css';
import './styles/components.css';
import './styles/screens.css';
import { router } from './app/router';
import { PwaProvider } from './pwa/PwaContext';
import { ProgressProvider } from './state/ProgressContext';
import { ToastProvider } from './state/ToastContext';

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <ToastProvider>
      <ProgressProvider>
        <PwaProvider>
          <RouterProvider router={router} />
        </PwaProvider>
      </ProgressProvider>
    </ToastProvider>
  </StrictMode>,
);