import type { Metadata, Viewport } from 'next'
import { Bricolage_Grotesque, DM_Sans } from 'next/font/google'
import './globals.css'

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

const dmSans = DM_Sans({
  subsets: ['latin'],
  variable: '--font-sans',
  display: 'swap',
})

export const metadata: Metadata = {
  title: 'FAST CREW — Programa de Influenciadores | Fast\'n Fit',
  description:
    'Junte-se à FAST CREW, o time oficial de criadores da Fast\'n Fit. Receba marmitas ultracongeladas, cupons exclusivos e acesso VIP. Inscreva-se agora!',
  keywords: ['influenciadores', 'fast crew', 'fast n fit', 'marmitas saudáveis', 'programa de parceiros'],
  openGraph: {
    title: 'FAST CREW — Programa de Influenciadores',
    description: 'A praticidade virou comunidade. Junte-se ao time de criadores da Fast\'n Fit.',
    type: 'website',
  },
}

export const viewport: Viewport = {
  colorScheme: 'light',
  themeColor: '#ffbb1c',
}

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode
}>) {
  return (
    <html lang="pt-BR" className={`${bricolage.variable} ${dmSans.variable} bg-[#ffbb1c]`}>
      <body className="antialiased font-sans bg-background text-foreground overflow-x-hidden">
        {children}
      </body>
    </html>
  )
}
