frontend/app/layout.tsx

import './globals.css'
import type { Metadata } from 'next'
import { Inter, Space_Grotesk } from 'next/font/google'

const inter = Inter({
    subsets: ['latin'],
    variable: '--font-inter',
    display: 'swap',
})

const spaceGrotesk = Space_Grotesk({
    subsets: ['latin'],
    variable: '--font-space-grotesk',
    display: 'swap',
})

export const metadata: Metadata = {
    title: 'IDP System - AI-Powered Document Processing',
    description: 'Extract structured data from invoices, receipts, and forms with AI-powered intelligence. Lightning fast, highly accurate document processing.',
    keywords: ['IDP', 'Document Processing', 'OCR', 'AI', 'Invoice Processing', 'Receipt Extraction'],
    authors: [{ name: 'IDP Team' }],
    viewport: 'width=device-width, initial-scale=1, maximum-scale=5',
}

export default function RootLayout({
    children,
}: {
    children: React.ReactNode
}) {
    return (
        <html lang="en" suppressHydrationWarning>
            <body className={`${inter.variable} ${spaceGrotesk.variable} font-sans antialiased`}>
                {children}
            </body>
        </html>
    )
}