import type { Metadata } from 'next';
import './globals.css';
import { ToastProvider } from '@/components/providers/toast-provider';
export const metadata: Metadata = {
title: 'Paint UI - Browser Image Editor',
description: 'Modern browser-based image editor built with Next.js. Multi-layer canvas, drawing tools, effects, and more.',
keywords: ['image editor', 'canvas', 'drawing', 'paint', 'layers', 'effects', 'photoshop alternative'],
};
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en" suppressHydrationWarning>
<head>
<script
dangerouslySetInnerHTML={{
__html: `
(function() {
try {
const theme = localStorage.getItem('theme');
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
const shouldBeDark = theme === 'dark' || (!theme && prefersDark);
if (shouldBeDark) {
document.documentElement.classList.add('dark');
}
} catch (e) {}
})();
`,
}}
/>
</head>
<body className="min-h-screen antialiased overflow-hidden">
{children}
<ToastProvider />
</body>
</html>
);