import type React from "react"
import type { Metadata } from "next"
import { GeistSans } from "geist/font/sans"
import { GeistMono } from "geist/font/mono"
import { Analytics } from "@vercel/analytics/next"
import { Suspense } from "react"
import { Toaster } from "sonner"
import { ErrorBoundary } from "@/components/error-boundary"
import { LoadingPage } from "@/components/loading-spinner"
import "./globals.css"

export const metadata: Metadata = {
  title: "Fanaka International University College - Student Application Portal",
  description: "Apply to Fanaka International University College - Your Journey to Academic Excellence Begins Here",
  generator: "v0.app",
  keywords: ["university", "application", "education", "fanaka", "student portal"],
  authors: [{ name: "Fanaka International University College" }],
  viewport: "width=device-width, initial-scale=1",
}

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode
}>) {
  return (
    <html lang="en">
      <body className={`font-sans ${GeistSans.variable} ${GeistMono.variable} antialiased`}>
        <ErrorBoundary>
          <Suspense fallback={<LoadingPage />}>{children}</Suspense>
          <Toaster
            position="top-right"
            richColors
            closeButton
            toastOptions={{
              style: {
                background: "hsl(var(--background))",
                color: "hsl(var(--foreground))",
                border: "1px solid hsl(var(--border))",
              },
            }}
          />
        </ErrorBoundary>
        <Analytics />
      </body>
    </html>
  )
}
