import type { Metadata } from 'next';
import { Inter, Be_Vietnam_Pro } from 'next/font/google';
import './globals.css';
import { coreService } from '@/services/coreService';

// Configure fonts
const inter = Inter({
  subsets: ['latin', 'vietnamese'],
  variable: '--font-body-next',
  display: 'swap',
});

const beVietnamPro = Be_Vietnam_Pro({
  weight: ['400', '500', '600', '700', '800'],
  subsets: ['latin', 'vietnamese'],
  variable: '--font-heading-next',
  display: 'swap',
});

export async function generateMetadata(): Promise<Metadata> {
  // Fetch site settings từ Django API
  const settings = await coreService.getSettings().catch(() => null);

  const siteName = settings?.site_name || 'Vitalist Pharma';
  const metaTitle = settings?.meta_title || `${siteName} - Công ty Dược phẩm hàng đầu Việt Nam`;
  const metaDesc = settings?.meta_description || `${siteName} - Chuyên sản xuất và phân phối dược phẩm chất lượng cao.`;
  const keywords = settings?.keywords || 'dược phẩm, thuốc, sức khỏe';
  const faviconUrl = settings?.favicon || '/favicon.ico';
  const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000';

  return {
    title: {
      template: `%s | ${siteName}`,
      default: metaTitle,
    },
    description: metaDesc,
    keywords,
    authors: [{ name: siteName }],
    creator: siteName,
    publisher: siteName,
    icons: {
      icon: faviconUrl,
    },
    metadataBase: new URL(siteUrl),
    openGraph: {
      type: 'website',
      locale: 'vi_VN',
      url: siteUrl,
      siteName,
      title: metaTitle,
      description: metaDesc,
      images: [
        {
          url: '/images/og-default.jpg',
          width: 1200,
          height: 630,
          alt: siteName,
        },
      ],
    },
    twitter: {
      card: 'summary_large_image',
      title: metaTitle,
      description: metaDesc,
      images: ['/images/og-default.jpg'],
    },
  };
}

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="vi" translate="no" className={`${inter.variable} ${beVietnamPro.variable}`}>
      <head>
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" crossOrigin="anonymous" referrerPolicy="no-referrer" />
      </head>
      <body className="antialiased text-dark-700 bg-white">
        {children}
      </body>
    </html>
  );
}
