Update guest v2 branding and theming

resources/js/guest-v2/screens/LegalScreen.tsx

@@ -1,23 +1,24 @@
 import React from 'react';
 import { useParams } from 'react-router-dom';
-import { YStack } from '@tamagui/stacks';
+import { YStack, XStack } from '@tamagui/stacks';
 import { SizableText as Text } from '@tamagui/text';
 import { Card } from '@tamagui/card';
 import { useTranslation } from '@/guest/i18n/useTranslation';
 import { useLocale } from '@/guest/i18n/LocaleContext';
 import { LegalMarkdown } from '@/guest/components/legal-markdown';
-import { useAppearance } from '@/hooks/use-appearance';
+import EventLogo from '../components/EventLogo';
+import { useGuestThemeVariant } from '../lib/guestTheme';
 
 export default function LegalScreen() {
   const { page } = useParams<{ page: string }>();
   const { t } = useTranslation();
   const { locale } = useLocale();
-  const { resolved } = useAppearance();
-  const isDark = resolved === 'dark';
+  const { isDark } = useGuestThemeVariant();
   const primaryText = isDark ? '#F8FAFF' : '#0F172A';
   const mutedText = isDark ? 'rgba(226, 232, 240, 0.7)' : 'rgba(15, 23, 42, 0.6)';
   const cardBackground = isDark ? 'rgba(15, 23, 42, 0.75)' : 'rgba(255, 255, 255, 0.9)';
   const cardBorder = isDark ? 'rgba(148, 163, 184, 0.18)' : 'rgba(15, 23, 42, 0.12)';
+  const brandName = 'Fotospiel';
   const [loading, setLoading] = React.useState(true);
   const [title, setTitle] = React.useState('');
   const [body, setBody] = React.useState('');
@@ -67,6 +68,12 @@ export default function LegalScreen() {
   return (
     <YStack flex={1} minHeight="100vh" padding="$5" backgroundColor={isDark ? '#0B101E' : '#FFF8F5'}>
       <YStack gap="$4" maxWidth={720} width="100%" alignSelf="center">
+        <XStack alignItems="center" gap="$3">
+          <EventLogo name={brandName} size="s" />
+          <Text fontSize="$5" fontFamily="$display" fontWeight="$8" color={primaryText}>
+            {brandName}
+          </Text>
+        </XStack>
         <Text fontSize="$7" fontFamily="$display" fontWeight="$9" color={primaryText}>
           {title || fallbackTitle}
         </Text>