import type { Metadata, Viewport } from "next";
import { Hanken_Grotesk, Playfair_Display, Plus_Jakarta_Sans } from "next/font/google";
import "./globals.css";
import TopNavbar from "@/components/TopNavbar";
import Footer from "@/components/Footer";
import { AuthProvider } from "@/context/AuthContext";

const hankenGrotesk = Hanken_Grotesk({
  subsets: ["latin"],
  weight: ["300", "400", "500", "600", "700", "800", "900"],
  variable: "--font-hanken",
  display: "swap",
});

const playfairDisplay = Playfair_Display({
  subsets: ["latin"],
  weight: ["400", "500", "600", "700", "800", "900"],
  variable: "--font-playfair",
  display: "swap",
});

const plusJakarta = Plus_Jakarta_Sans({
  subsets: ["latin"],
  weight: ["300", "400", "500", "600", "700", "800"],
  variable: "--font-plus-jakarta",
  display: "swap",
});

export const viewport: Viewport = {
  themeColor: "#059669",
  width: "device-width",
  initialScale: 1,
};

export const metadata: Metadata = {
  title: "Dream Homes Real Estate (PVT) Ltd | Sri Lanka Property for Sale & Investment",
  description: "Sri Lanka's trusted partner for property for sale and property investment. Specialising in connecting buyers and sellers across Colombo district, Thalawathugoda, Malabe, Battaramulla, Nugegoda, and emerging areas.",
  keywords: [
    "Dream Homes Real Estate",
    "Houses for sale in Thalawathugoda",
    "Land for sale in Malabe",
    "Battaramulla Property for Sale",
    "Colombo District Real Estate",
    "Sri Lanka Property Investment",
    "Dream Homes Sri Lanka"
  ],
  icons: {
    icon: "/logo.png",
    shortcut: "/logo.png",
    apple: "/logo.png",
  },
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="en" suppressHydrationWarning className={`${hankenGrotesk.variable} ${playfairDisplay.variable} ${plusJakarta.variable}`}>
      <head>
        <link rel="icon" href="/logo.png" type="image/png" sizes="any" />
        <link rel="shortcut icon" href="/logo.png" type="image/png" />
        <link rel="apple-touch-icon" href="/logo.png" />
        <link rel="preconnect" href="https://fonts.googleapis.com" />
        <link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="anonymous" />
      </head>
      <body suppressHydrationWarning className="min-h-screen flex flex-col font-sans bg-[#0A0A0A] text-slate-100 antialiased selection:bg-[#059669] selection:text-white">
        <AuthProvider>
          <TopNavbar />
          <main className="flex-grow">{children}</main>
          <Footer />
        </AuthProvider>
      </body>
    </html>
  );
}
