// Root layout — imports globals.css. The SPA renders entirely client-side,
// so there is no SSR document to worry about here.
//
// The app is bilingual (see `locales` in app.config.ts): <LocaleSwitcher>
// writes the `voltro:locale` cookie + reloads so the framework re-renders in the
// chosen language.

import type { ReactNode } from 'react'
import { useLocale, useT } from '@voltro/i18n'
import { LocaleSwitcher } from '@voltro/ui-shadcn'
import '../globals.css'

const LOCALES = [
  { code: 'en', label: 'English' },
  { code: 'de', label: 'Deutsch' },
]

export default function Layout({ children }: { readonly children: ReactNode }): ReactNode {
  return (
    <>
      <header style={{ display: 'flex', justifyContent: 'flex-end', padding: '12px 16px' }}>
        <LocaleSwitcher locales={LOCALES} current={useLocale()} ariaLabel={useT('lang.label')} />
      </header>
      {children}
    </>
  )
}