import type { Metadata } from 'next';
import { ThemeProvider } from '@/context/ThemeContext';
import '@/styles/globals.css';

export const metadata: Metadata = {
  title: "Amirhossein Khalili | Dedicated Product Engineer",
  description:
    "Personal portfolio of Amirhossein Khalili, Product Engineer & Software Developer based in Iran.",
  keywords: [
    'Amirhossein Khalili',
    'Product Engineer',
    'Software Engineer',
    'Full Stack Developer',
    'Portfolio',
  ],
};

const themeScript = `
  document.documentElement.dataset.siteLoading = 'true';
  try {
    const savedTheme = localStorage.getItem('portfolio-theme');
    const systemTheme = matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
    document.documentElement.dataset.theme = savedTheme || systemTheme;
  } catch {}
`;

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en" suppressHydrationWarning>
      <head>
        <script dangerouslySetInnerHTML={{ __html: themeScript }} />
      </head>
      <body>
        <ThemeProvider>{children}</ThemeProvider>
        <noscript>
          <style>{`#site-loader { display: none !important; }`}</style>
        </noscript>
      </body>
    </html>
  );
}