import type { Metadata } from "next";
import "./globals.css";
import { cn } from "@/lib/utils";
import { fontDisplay, fontMono, fontSans } from "./fonts";
import { Providers } from "@/components/providers";
import { SiteBackground } from "@/components/site-background";
import { site } from "@/content/site";

export const metadata: Metadata = {
  metadataBase: new URL(site.url),
  title: {
    default: `${site.name} — AI Agents Agency for Voice, WhatsApp, Chat & Web`,
    template: `%s | ${site.name}`,
  },
  description: site.description,
  applicationName: site.name,
  openGraph: {
    type: "website",
    siteName: site.name,
    url: site.url,
    title: `${site.name} — AI Agents Agency`,
    description: site.description,
    locale: "en_IN",
  },
  twitter: {
    card: "summary_large_image",
    title: `${site.name} — AI Agents Agency`,
    description: site.description,
  },
  alternates: {
    types: {
      "application/rss+xml": "/rss.xml",
    },
  },
  verification: {
    google: "qDVJqlxDYEw0njSD-uBcNM_AWMWq8a6GjsdUgOjUUWI",
  },
  other: {
    "p:domain_verify": "f1437394f06104af3208d1ef0e0e418f",
  },
  robots: {
    index: true,
    follow: true,
    googleBot: {
      index: true,
      follow: true,
      noimageindex: false,
      "max-video-preview": -1,
      "max-image-preview": "large",
      "max-snippet": -1,
    },
  },
};

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html
      lang="en-IN"
      suppressHydrationWarning
      data-scroll-behavior="smooth"
      className={cn(
        fontSans.variable,
        fontDisplay.variable,
        fontMono.variable,
      )}
    >
      <body className="relative min-h-dvh selection:bg-primary/20 selection:text-foreground">
        <SiteBackground />
        <a
          href="#main"
          className="sr-only rounded-full focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-[100] focus:bg-primary focus:px-4 focus:py-2 focus:text-sm focus:font-medium focus:text-primary-foreground focus:shadow-float focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
        >
          Skip to content
        </a>
        <Providers>{children}</Providers>
      </body>
    </html>
  );
}
