import type { Metadata } from "next";
import localFont from "next/font/local";
import "./globals.css";
import { LocaleProvider } from "@/i18n/LocaleProvider";
import { AppShell } from "@/components/AppShell";

const latin = localFont({
  src: "./fonts/Montserrat.ttf",
  variable: "--font-latin",
  weight: "100 900",
});
const arabic = localFont({
  src: [
    { path: "./fonts/Tajawal-Regular.ttf", weight: "400" },
    { path: "./fonts/Tajawal-Medium.ttf", weight: "500" },
    { path: "./fonts/Tajawal-Bold.ttf", weight: "700" },
  ],
  variable: "--font-arabic",
});

export const metadata: Metadata = {
  title: {
    default: "BeebBeeb Admin",
    template: "%s | BeebBeeb Admin",
  },
  description: "BeebBeeb super-admin dashboard: fleet, zones, pricing, staff, API keys, and analytics.",
  applicationName: "BeebBeeb Admin",
  // Private operations console: keep it out of search engines.
  robots: { index: false, follow: false, nocache: true },
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  // lang/dir are set to LTR/English for the initial render; LocaleProvider updates them on the
  // client from the saved preference.
  return (
    <html lang="en" dir="ltr">
      <body className={`${latin.variable} ${arabic.variable} antialiased`}>
        <LocaleProvider>
          <AppShell>{children}</AppShell>
        </LocaleProvider>
      </body>
    </html>
  );
}