src/main.tsx

import React, { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { HelmetProvider } from "react-helmet-async";
import App from "./App.tsx";
import "./index.css";

// --- Apply saved theme immediately (default = dark) ---
const savedPref = localStorage.getItem("theme-preference") || "dark";

const getSystemTheme = () =>
  window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";

const resolved = savedPref === "system" ? getSystemTheme() : savedPref;
document.documentElement.classList.toggle("dark", resolved === "dark");

// --- Unregister any service workers to avoid WebContainer errors ---
if ("serviceWorker" in navigator) {
  navigator.serviceWorker
    .getRegistrations()
    .then((registrations) => {
      registrations.forEach((reg) => reg.unregister());
    })
    .catch((err) => console.warn("SW unregister failed:", err));
}

// --- Render React app ---
const container = document.getElementById("root");
if (container) {
  createRoot(container).render(
    <StrictMode>
      <HelmetProvider>
        <App />
      </HelmetProvider>
    </StrictMode>
  );
} else {
  console.error("Root element not found!");
}