Fix auth translations and admin PWA UI

resources/js/admin/mobile/LogoutPage.tsx

@@ -1,9 +1,15 @@
 import React from 'react';
+import { Card } from '@tamagui/card';
+import { YStack } from '@tamagui/stacks';
+import { SizableText as Text } from '@tamagui/text';
+import { Spinner } from 'tamagui';
 import { useAuth } from '../auth/context';
 import { ADMIN_PUBLIC_LANDING_PATH } from '../constants';
+import { useAdminTheme } from './theme';
 
 export default function LogoutPage() {
   const { logout } = useAuth();
+  const { textStrong, muted, border, surface, shadow, appBackground } = useAdminTheme();
   const safeAreaStyle: React.CSSProperties = {
     paddingTop: 'calc(env(safe-area-inset-top, 0px) + 16px)',
     paddingBottom: 'calc(env(safe-area-inset-bottom, 0px) + 16px)',
@@ -14,13 +20,34 @@ export default function LogoutPage() {
   }, [logout]);
 
   return (
-    <div
-      className="flex min-h-screen items-center justify-center bg-gradient-to-br from-rose-50 via-white to-slate-50 text-sm text-slate-600"
-      style={safeAreaStyle}
+    <YStack
+      alignItems="center"
+      justifyContent="center"
+      padding="$4"
+      style={{ minHeight: '100vh', backgroundImage: appBackground, ...safeAreaStyle }}
+      backgroundColor={surface}
     >
-      <div className="rounded-2xl border border-rose-100 bg-white/90 px-6 py-4 shadow-sm shadow-rose-100/60">
-        Abmeldung wird vorbereitet ...
-      </div>
-    </div>
+      <Card
+        borderRadius={22}
+        borderWidth={2}
+        borderColor={border}
+        backgroundColor={surface}
+        padding="$3"
+        shadowColor={shadow}
+        shadowOpacity={0.16}
+        shadowRadius={16}
+        shadowOffset={{ width: 0, height: 10 }}
+      >
+        <YStack alignItems="center" space="$2">
+          <Spinner size="small" color={textStrong} />
+          <Text fontSize="$sm" fontWeight="700" color={textStrong}>
+            Abmeldung wird vorbereitet ...
+          </Text>
+          <Text fontSize="$xs" color={muted}>
+            Bitte einen Moment Geduld.
+          </Text>
+        </YStack>
+      </Card>
+    </YStack>
   );
 }