import { Suspense, type ReactNode } from "react";
import type { Metadata, Viewport } from "next";
import { Manrope } from "next/font/google";
import { NativeLayer } from "@/components/native/NativeLayer";
import { GoogleAnalytics } from "@/components/public/analytics/GoogleAnalytics";
import { HoverPrefetch } from "@/components/public/common/HoverPrefetch";
import { NavigationProgress } from "@/components/public/common/NavigationProgress";
import { OfflineToast } from "@/components/public/common/OfflineToast";
import { ServiceWorkerRegister } from "@/components/public/common/ServiceWorkerRegister";
import { SITE_URL } from "@/lib/site-url";
import "@/styles/globals.css";

const bodyFont = Manrope({
  variable: "--font-manrope",
  subsets: ["latin", "latin-ext"],
  weight: ["400", "500", "600", "700", "800"],
});

export const metadata: Metadata = {
  metadataBase: new URL(SITE_URL),
  title: {
    default: "BiznisPortal.rs",
    template: "%s | BiznisPortal.rs",
  },
  description:
    "BiznisPortal.rs je premium poslovni portal Srbije za kompanije, mesta, nekretnine, događaje, automobile, poslove i ponude sa jakim lokalnim SEO prikazom.",
  openGraph: {
    title: "BiznisPortal.rs",
    description:
      "Premium poslovni portal Srbije za vidljivost brendova, lokalnu pretragu i merljive rezultate.",
    type: "website",
    locale: "sr_RS",
    siteName: "BiznisPortal.rs",
    images: [
      {
        url: "/images/og/biznisportal-home-og.png",
        width: 1200,
        height: 630,
        alt: "Biznis Portal — sve što vam treba za pravi poslovni izbor",
        type: "image/png",
      },
    ],
  },
  twitter: {
    card: "summary_large_image",
    title: "BiznisPortal.rs",
    description:
      "Premium poslovni portal Srbije za vidljivost brendova, lokalnu pretragu i merljive rezultate.",
    images: ["/images/og/biznisportal-home-og.png"],
  },
  robots: {
    index: true,
    follow: true,
  },
  verification: {
    google: process.env.NEXT_PUBLIC_GOOGLE_SITE_VERIFICATION,
    // Yandex i Bing su ZAKUCANI direktno (bez env lookup-a) — ranije je stajalo
    // `process.env.NEXT_PUBLIC_YANDEX_SITE_VERIFICATION ?? "…"`, ali ako je na
    // Vercel-u postavljena env varijabla sa STAROM vrednošću, ona je NADJAČAVALA
    // fallback (`??` radi samo kad env ne postoji) i meta tag je ostajao stari.
    // Direktna konstanta garantuje tačan token nezavisno od Vercel env-a.
    yandex: "f84d025d5a27bf41",
    other: {
      // Bing Webmaster Tools (msvalidate.01) — vrednost iz Bing panela.
      "msvalidate.01": "80C0892F389DD0B7F4C82E419D4FAAAE",
    },
  },
  manifest: "/manifest.webmanifest",
  appleWebApp: {
    capable: true,
    title: "BiznisPortal",
    statusBarStyle: "black-translucent",
  },
};

export const viewport: Viewport = {
  width: "device-width",
  initialScale: 1,
  themeColor: "#0c1828",
  viewportFit: "cover",
};

export default function RootLayout({
  children,
}: Readonly<{
  children: ReactNode;
}>) {
  return (
    <html lang="sr-Latn-RS" className={bodyFont.variable} suppressHydrationWarning>
      <head>
        {/* Google AdSense — loader/verifikaciona skripta. Mora u server-
            renderovanom <head>-u da bi AdSense mogao da verifikuje sajt i da bi
            „Ponovo pošalji" prošao. Sama skripta NE postavlja reklame — to rade
            auto-ads iz dashboarda ili pojedinačni ad slotovi.
            ca-pub-8928110665539272 je javni ID izdavača. */}
        <script
          async
          src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8928110665539272"
          crossOrigin="anonymous"
        />
        {/* OpenSearch — pretraga sajta iz browser address bara / search box-a */}
        <link
          rel="search"
          type="application/opensearchdescription+xml"
          href="/opensearch.xml"
          title="BiznisPortal.rs"
        />
        {/* Early native flag — setuje html[data-native="1"] PRE prvog paint-a
            SAMO kada smo u stvarnom Capacitor WebView-u.
            ─────────────────────────────────────────────────────────────────
            Stari regex /wv|Version\/[\d.]+ Mobile.+Safari|Android.+Mobile/
            je bio katastrofalno preširok — matchovao je SVAKI iOS Safari
            ("Version/17.0 Mobile … Safari") i SVAKI Android Chrome
            ("Android … Mobile"), pa se header skrivao svim mobilnim
            korisnicima na pravoj produkciji.

            Novi check:
              1. window.Capacitor postoji → 100% native (Capacitor inject-uje
                 ovaj global pre user script-a)
              2. UA ima literal "; wv)" → Android WebView (jedinstven token,
                 obični Android Chrome ga nema)
              3. Capacitor preview na emulator host-u 10.0.2.2

            iOS Capacitor WebView nema diskriminacijski UA token; oslanjamo
            se na window.Capacitor (koji Capacitor.js postavlja sinhrono pri
            učitavanju bridge-a). Mali flicker tamne pozadine na iOS native
            startup je prihvatljiv jer NativeShellController potvrđuje flag
            nakon hidracije.

            `suppressHydrationWarning`: AdSense loader iznad, čim se učita,
            ubaci svoju `show_ads` skriptu na POČETAK <head>-a — pre nego što
            React stigne da hidrira. Time se svaki naš element u <head>-u
            pomeri za jedno mesto, pa React ovu skriptu poredi sa AdSense-ovom
            i prijavljuje „A tree hydrated but some attributes… didn't match".
            Pomeranje ne zavisi od redosleda (probano: i premeštanje AdSense-a
            na kraj i `next/script` sa `beforeInteractive` daju istu grešku),
            jer se ubacivanje dešava na početak. Jedina alternativa bila bi da
            AdSense ne bude u server-renderovanom HTML-u, što ugrožava
            verifikaciju izdavača — zato se poravnanje ovde namerno preskače.
            Skripta je inline i izvrši se pri parsiranju, pa suzbijanje
            poređenja ne menja njeno ponašanje. */}
        <script
          suppressHydrationWarning
          dangerouslySetInnerHTML={{
            __html: `try{var ua=navigator.userAgent||'';var h=location.hostname;var hasCap=typeof window.Capacitor!=='undefined';var isAndroidWv=/; wv\\)/.test(ua);var isEmu=h==='10.0.2.2';if(hasCap||isAndroidWv||isEmu){document.documentElement.setAttribute('data-native','1');document.documentElement.style.background='#0c1828';document.documentElement.style.colorScheme='dark';}}catch(e){}`,
          }}
        />
        {/* Speed up the third-party analytics handshake (GA loads post-hydration). */}
        <link rel="preconnect" href="https://www.googletagmanager.com" />
        <link rel="dns-prefetch" href="https://www.googletagmanager.com" />
        <link rel="dns-prefetch" href="https://www.google-analytics.com" />
        {/* Supabase storage preconnect — sve slike (logo, cover, gallery)
            se serviraju sa supabase CDN-a; preconnect ubrzava prvi handshake
            za hero cover image što direktno utiče na LCP. */}
        <link rel="preconnect" href="https://lfrciizxtxwdbxcnzaoc.supabase.co" crossOrigin="anonymous" />
        <link rel="dns-prefetch" href="https://lfrciizxtxwdbxcnzaoc.supabase.co" />
      </head>
      <body className="antialiased">
        <NavigationProgress />
        <HoverPrefetch />
        <GoogleAnalytics />
        <ServiceWorkerRegister />
        <OfflineToast />
        {/* Native sloj — pokriva SVE rute (uklj. `/`); inertan na web-u
            (gated by Capacitor.isNativePlatform + html[data-native] CSS).
            Suspense: native ekrani (AppFinder/AppAuth) koriste
            useSearchParams(); bez granice statički prerender `/_not-found`
            i `/404` puca (CSR bailout) i ruši ceo `next build`. */}
        <Suspense fallback={null}>
          <NativeLayer />
        </Suspense>
        <div className="min-h-screen bg-[radial-gradient(circle_at_top_left,rgba(194,65,12,0.14),transparent_24%),radial-gradient(circle_at_top_right,rgba(22,22,22,0.08),transparent_26%),linear-gradient(180deg,#fbf6f3_0%,#f7f2ee_28%,#fcfbfa_100%)] text-foreground">
          {children}
        </div>
      </body>
    </html>
  );
}