import React from 'react';
import { createRoot } from 'react-dom/client';
import App from './App.tsx';
import { ErrorBoundary } from './components/ErrorBoundary.tsx';
import { ToastProvider } from './contexts/ToastContext.tsx';
import './index.css';

// CSS imports are now handled in index.html via <link> tags for AI Studio compatibility, 
// but we add it here too for Vite dev server robustness.

/**
 * AI Studio Compatible Entrypoint
 * 
 * This version restores the necessary providers (`ErrorBoundary`, `ToastProvider`)
 * to allow the application to run correctly after the initial bootstrap.
 * It uses the modern `createRoot` API, which is required for React 18 and newer.
 */
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';

const queryClient = new QueryClient();

const rootElement = document.getElementById('root');
if (rootElement) {
  const root = createRoot(rootElement);
  root.render(
    <React.StrictMode>
      <QueryClientProvider client={queryClient}>
        <ErrorBoundary>
          <ToastProvider>
            <App />
          </ToastProvider>
        </ErrorBoundary>
      </QueryClientProvider>
    </React.StrictMode>
  );
} else {
  console.error("CRITICAL: Root element #root not found. App could not be mounted.");
  const errorDiv = document.getElementById('global-error-display');
  if (errorDiv) {
    errorDiv.style.display = 'block';
    errorDiv.innerText = 'ERRO CRÍTICO: O ELEMENTO #ROOT NÃO FOI ENCONTRADO NO HTML.';
  }
}