import type { Metadata, Viewport } from "next";
import { Inter } from "next/font/google";
import "./globals.css";
import { dbAvailable, meta } from "@/lib/db";
import { SiteHeader } from "@/components/site-header";
import { SiteFooter } from "@/components/site-footer";
import { MobileNav } from "@/components/mobile-nav";

const inter = Inter({ subsets: ["latin"], variable: "--font-inter", display: "swap" });

export async function generateMetadata(): Promise<Metadata> {
  const n = dbAvailable() ? Number(meta("listings_sale")) + Number(meta("listings_rent")) : 0;
  const count = n ? `${n.toLocaleString("fr-CA")} propriétés à vendre et à louer au Québec` : "Propriétés à vendre et à louer au Québec";
  return {
    metadataBase: new URL("https://www.toveli.ca"),
    title: { default: `Toveli — ${count}`, template: "%s · Toveli" },
    description: `${count}, réunies en un seul endroit : annonces, carte, estimation de valeur avec fourchette et confiance, comparables, marché, financement.`,
    applicationName: "Toveli",
    openGraph: { type: "website", locale: "fr_CA", siteName: "Toveli", url: "https://www.toveli.ca", title: `Toveli — ${count}`, description: "L'immobilier, enfin réuni. Acheter, louer, estimer, comparer, financer." },
    twitter: { card: "summary_large_image" },
    robots: { index: true, follow: true },
  };
}

export const viewport: Viewport = { themeColor: "#e0263c", width: "device-width", initialScale: 1 };

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="fr-CA" className={inter.variable}>
      <body className="min-h-dvh flex flex-col pb-16 md:pb-0">
        <SiteHeader />
        <main className="flex-1">{children}</main>
        <SiteFooter />
        <MobileNav />
      </body>
    </html>
  );
}