import type { Metadata } from 'next'
import './globals.css'
import Header from '@/components/Header'
import Footer from '@/components/Footer'

export const metadata: Metadata = {
  title: {
    default: 'sterownikled.pl – Sterowniki schodowe LED',
    template: '%s | sterownikled.pl',
  },
  description:
    'Inteligentne sterowniki oświetlenia schodowego LED. Ponad 15 lat doświadczenia. Modele na 5–20 stopni, czujniki Sharp i PIR, maskownice. Gwarancja 2 lata.',
  keywords: [
    'sterownik schodowy',
    'sterownik schodowy LED',
    'oświetlenie schodów LED',
    'inteligentne oświetlenie schodowe',
    'sterowniki schodowe 12V',
    'czujnik schodowy',
    'sterownikled.pl',
    'nowoster',
    'firmaled',
  ],
  openGraph: {
    type: 'website',
    locale: 'pl_PL',
    siteName: 'sterownikled.pl',
  },
}

const darkModeScript = `
(function() {
  try {
    var stored = localStorage.getItem('theme');
    var prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
    if (stored === 'dark' || (!stored && prefersDark)) {
      document.documentElement.classList.add('dark');
    }
  } catch(e) {}
})();
`

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="pl" suppressHydrationWarning>
      <head>
        <script dangerouslySetInnerHTML={{ __html: darkModeScript }} />
      </head>
      <body className="min-h-screen bg-white dark:bg-gray-950 text-gray-900 dark:text-gray-100 flex flex-col transition-colors duration-200">
        <Header />
        <main className="flex-1">{children}</main>
        <Footer />
      </body>
    </html>
  )
}