import { RootProvider } from 'fumadocs-ui/provider';
import { Inter } from 'next/font/google';
import type { Metadata } from 'next';

import '@workspace/ui/globals.css';
import { Providers } from './providers';
import { ParallaxLayers } from '@workspace/ui/components/animate-ui/parallax-layers';
// import { jsonLd } from '@/lib/json-ld'; // Commented out as it's Animate UI specific

// --- Update metadata for Fortura ---
export const metadata: Metadata = {
  title: {
    template: '%s - Fortura Data Solutions',
    default: 'Fortura Data Solutions - Own Your Infrastructure, Slash Your Bill',
  },
  description:
    'Fortura helps you cut cloud costs by moving to owned, colocated infrastructure. Performance parity with zero vendor lock-in.',
  keywords: [
    'Fortura',
    'Cloud Alternatives',
    'Self-hosted',
    'Colocation',
    'Cloud Cost Reduction',
    'Data Ownership',
    'Enterprise Infrastructure',
  ],
  // Icons, authors, openGraph, twitter should be updated for Fortura
  // For now, keeping minimal changes. In practice, update these sections.
};

const inter = Inter({
  subsets: ['latin'],
});

export default function Layout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en" className={inter.className} suppressHydrationWarning>
      <head>
        {/* <script
          type="application/ld+json"
          dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
        /> */}
        {/* Add Fortura-specific SEO/script tags here if needed */}
      </head>
      <body className="flex flex-col min-h-dvh">
        {/* Theme provider is handled by RootProvider, but we need our custom providers like ToneProvider */}
        {/* Assuming RootProvider handles dark mode, we can nest our providers inside */}
        <RootProvider theme={{ defaultTheme: 'dark' }}>
          <Providers>
            <ParallaxLayers />
            {children}
          </Providers>
        </RootProvider>
      </body>
    </html>
  );
}
