import type { Metadata, Viewport } from "next";
import Script from "next/script";
import { Fraunces, Plus_Jakarta_Sans } from "next/font/google";
import "./globals.css";
import { hotel } from "./data";
import { MotionEffects, NavigationLoader, ScrollToTop } from "./components";
import {
  defaultDescription,
  pageMetadata,
  siteName,
  siteUrl,
  socialImage,
} from "@/lib/seo";

const displayFont = Fraunces({
  subsets: ["latin"],
  weight: ["500", "600", "700"],
  style: ["normal", "italic"],
  variable: "--font-display",
  display: "swap",
});

const bodyFont = Plus_Jakarta_Sans({
  subsets: ["latin"],
  weight: ["400", "500", "600", "700", "800"],
  variable: "--font-body",
  display: "swap",
});

export const metadata: Metadata = {
  metadataBase: new URL(siteUrl),
  ...pageMetadata({
    title: "Bass Resort | Garden Hotel & Restaurant in Bhaktapur",
    description: defaultDescription,
    path: "/",
    keywords: [
      "Bass Resort",
      "hotel in Bhaktapur",
      "garden resort Bhaktapur",
      "restaurant in Bhaktapur",
      "AC room Bhaktapur",
      "hotel booking Bhaktapur",
    ],
  }),
  title: {
    default: "Bass Resort | Garden Hotel & Restaurant in Bhaktapur",
    template: `%s | ${siteName}`,
  },
  applicationName: siteName,
  category: "travel",
  creator: siteName,
  publisher: siteName,
  formatDetection: {
    email: false,
    address: false,
    telephone: false,
  },
  appleWebApp: {
    title: siteName,
    capable: true,
    statusBarStyle: "black-translucent",
  },
  icons: {
    icon: [
      { url: "/favicon.ico?v=20260618-2", type: "image/png" },
      { url: "/favicon.png?v=20260618-2", type: "image/png" },
    ],
    apple: [{ url: "/favicon.png?v=20260618-2", type: "image/png" }],
    shortcut: [{ url: "/favicon.ico?v=20260618-2", type: "image/png" }],
  },
  manifest: "/site.webmanifest",
};

export const viewport: Viewport = {
  themeColor: "#00462d",
  colorScheme: "light",
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  const structuredData = {
    "@context": "https://schema.org",
    "@graph": [
      {
        "@type": "Hotel",
        "@id": `${siteUrl}/#hotel`,
        name: siteName,
        url: siteUrl,
        image: `${siteUrl}${socialImage}`,
        description: defaultDescription,
        address: {
          "@type": "PostalAddress",
          addressLocality: "Bhaktapur",
          addressRegion: "Bagmati Province",
          addressCountry: "NP",
        },
        geo: {
          "@type": "GeoCoordinates",
          latitude: 27.6933898,
          longitude: 85.4593497,
        },
        hasMap: hotel.mapUrl,
        telephone: hotel.phone,
        email: hotel.email,
        priceRange: "NPR 1,500-2,000",
        amenityFeature: [
          { "@type": "LocationFeatureSpecification", name: "Wi-Fi", value: true },
          { "@type": "LocationFeatureSpecification", name: "Parking", value: true },
          { "@type": "LocationFeatureSpecification", name: "Restaurant", value: true },
          { "@type": "LocationFeatureSpecification", name: "Garden", value: true },
        ],
      },
      {
        "@type": "Restaurant",
        "@id": `${siteUrl}/#restaurant`,
        name: `${siteName} Restaurant`,
        url: `${siteUrl}/menu`,
        image: `${siteUrl}${socialImage}`,
        servesCuisine: ["Nepali", "Newari", "Indian", "Continental"],
        priceRange: "NPR",
        telephone: hotel.phone,
        email: hotel.email,
        parentOrganization: { "@id": `${siteUrl}/#hotel` },
        address: {
          "@type": "PostalAddress",
          addressLocality: "Bhaktapur",
          addressRegion: "Bagmati Province",
          addressCountry: "NP",
        },
      },
      {
        "@type": "WebSite",
        "@id": `${siteUrl}/#website`,
        name: siteName,
        url: siteUrl,
        inLanguage: "en",
      },
    ],
  };

  return (
    <html lang="en" className={`${displayFont.variable} ${bodyFont.variable}`}>
      <body>
        <NavigationLoader />
        <MotionEffects />
        {children}
        <ScrollToTop />
        <Script
          src="https://www.googletagmanager.com/gtag/js?id=G-21L9M8V636"
          strategy="afterInteractive"
        />
        <Script id="google-analytics" strategy="afterInteractive">
          {`
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', 'G-21L9M8V636');
          `}
        </Script>
        <script
          type="application/ld+json"
          dangerouslySetInnerHTML={{
            __html: JSON.stringify(structuredData).replace(/</g, "\\u003c"),
          }}
        />
      </body>
    </html>
  );
}
