import type { Metadata } from "next";
import type { ReactNode } from "react";
import { Cairo, Noto_Naskh_Arabic } from "next/font/google";
import "./globals.css";
import { ToastProvider } from "@/components/ui/toast";
import { ThemeProvider } from "@/components/theme/theme-provider";

const heading = Cairo({
  subsets: ["arabic", "latin"],
  variable: "--font-heading",
  weight: ["600", "700", "800"],
});

const body = Noto_Naskh_Arabic({
  subsets: ["arabic", "latin"],
  variable: "--font-body",
  weight: ["400", "500", "600", "700"],
});

export const metadata: Metadata = {
  title: "Oudelaa Admin",
  description: "Premium admin dashboard for Oudelaa",
};

export default function RootLayout({ children }: { children: ReactNode }) {
  return (
    <html lang="ar" dir="rtl" suppressHydrationWarning className="theme-dark">
      <body className={`${heading.variable} ${body.variable} min-h-screen bg-background font-body text-foreground antialiased`}>
        <ThemeProvider>
          <ToastProvider>{children}</ToastProvider>
        </ThemeProvider>
      </body>
    </html>
  );
}
