Implemented project-wide localization plumbing and converted the visible UI/app messages to translation-ready strings.

resources/js/layouts/auth/auth-simple-layout.tsx

@@ -1,5 +1,6 @@
 import { Link } from '@inertiajs/react';
 import AppLogoIcon from '@/components/app-logo-icon';
+import { useTranslation } from '@/lib/translations';
 import { home } from '@/routes';
 import type { AuthLayoutProps } from '@/types';
 
@@ -8,6 +9,8 @@ export default function AuthSimpleLayout({
     title,
     description,
 }: AuthLayoutProps) {
+    const { t } = useTranslation();
+
     return (
         <div className="flex min-h-svh flex-col items-center justify-center gap-6 bg-background p-6 md:p-10">
             <div className="w-full max-w-sm rounded-md border bg-card p-6 shadow-sm">
@@ -20,13 +23,15 @@ export default function AuthSimpleLayout({
                             <div className="mb-1 flex size-10 items-center justify-center rounded-md bg-primary text-primary-foreground">
                                 <AppLogoIcon className="size-6 fill-current" />
                             </div>
-                            <span className="sr-only">{title}</span>
+                            <span className="sr-only">{t(title ?? '')}</span>
                         </Link>
 
                         <div className="space-y-2 text-center">
-                            <h1 className="text-xl font-semibold">{title}</h1>
+                            <h1 className="text-xl font-semibold">
+                                {t(title ?? '')}
+                            </h1>
                             <p className="text-center text-sm text-muted-foreground">
-                                {description}
+                                {t(description ?? '')}
                             </p>
                         </div>
                     </div>