"use client"; // Ensure client-side rendering

import "./globals.css";
import dynamic from "next/dynamic";
import { Toaster } from "react-hot-toast";
import { ThemeProvider } from "../app/Setting/ThemeContext"; // 👈 add this

// Dynamically import components to prevent SSR
const StoreProvider = dynamic(() => import("./store/StoreProvider"), {
  ssr: false,
});

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <head></head>

      <body className="bg-white dark:bg-[#0B0B0F] transition-colors duration-300">
        <StoreProvider>
          <ThemeProvider>
            {children}
          </ThemeProvider>
        </StoreProvider>

        <Toaster
          toastOptions={{ duration: 3000 }}
          position="top-center"
          reverseOrder={false}
        />
      </body>
    </html>
  );
}