import type { Metadata, Viewport } from 'next'
import { Toaster } from 'sonner'
import { FarbschemaAnbieter } from '@/components/farbschema-anbieter'
import './globals.css'

export const metadata: Metadata = {
  title: {
    default: 'Planer',
    template: '%s – Planer',
  },
  description: 'Aufgaben, Ideen, Projekte und Zeitblöcke an einem Ort.',
  applicationName: 'Planer',
  robots: { index: false, follow: false },
}

export const viewport: Viewport = {
  width: 'device-width',
  initialScale: 1,
  themeColor: [
    { media: '(prefers-color-scheme: light)', color: '#fbfbfd' },
    { media: '(prefers-color-scheme: dark)', color: '#1a1c22' },
  ],
}

export default function WurzelLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="de" suppressHydrationWarning>
      <body className="min-h-dvh antialiased">
        <FarbschemaAnbieter>
          {children}
          <Toaster position="bottom-right" richColors closeButton />
        </FarbschemaAnbieter>
      </body>
    </html>
  )
}