import type { Metadata } from 'next'
import { Inter, Cinzel } from 'next/font/google'
import { Suspense } from 'react'
import './globals.css'
import Header from '@/components/navigation/Header'
import AppProviders from '@/components/providers/AppProviders'

const inter = Inter({ subsets: ['latin', 'latin-ext'] })
const cinzel = Cinzel({ weight: '400', subsets: ['latin', 'latin-ext'], variable: '--font-cinzel' })

export const metadata: Metadata = {
  title: 'Twoja Łódka - Sprzedaż i wynajem żaglówek',
  description: 'Profesjonalna sprzedaż, wynajem i serwis żaglówek w Polsce',
}

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="pl">
      <body className={`${inter.className} ${cinzel.variable}`} suppressHydrationWarning>
        <Suspense fallback={null}>
          <AppProviders>
            <Header />
            <main>{children}</main>
          </AppProviders>
        </Suspense>
      </body>
    </html>
  )
}
