Fix auth translations and admin PWA UI

resources/js/admin/mobile/EventFormPage.tsx

@@ -7,7 +7,7 @@ import { SizableText as Text } from '@tamagui/text';
 import { Switch } from '@tamagui/switch';
 import { MobileShell } from './components/MobileShell';
 import { MobileCard, CTAButton } from './components/Primitives';
-import { MobileField, MobileInput, MobileSelect, MobileTextArea } from './components/FormControls';
+import { MobileDateTimeInput, MobileField, MobileInput, MobileSelect, MobileTextArea } from './components/FormControls';
 import { LegalConsentSheet } from './components/LegalConsentSheet';
 import {
   createEvent,
@@ -401,14 +401,9 @@ export default function MobileEventFormPage() {
 
         <MobileField label={t('eventForm.fields.date.label', 'Date & time')}>
           <XStack alignItems="center" space="$2">
-            <NativeDateTimeInput
+            <MobileDateTimeInput
               value={form.date}
-              onChange={(value) => setForm((prev) => ({ ...prev, date: value }))}
-              border={border}
-              surface={surface}
-              text={text}
-              primary={primary}
-              danger={danger}
+              onChange={(event) => setForm((prev) => ({ ...prev, date: event.target.value }))}
               style={{ flex: 1 }}
             />
             <CalendarDays size={16} color={subtle} />
@@ -624,57 +619,6 @@ function toDateTimeLocal(value?: string | null): string {
   return fallback.length >= 16 ? fallback.slice(0, 16) : '';
 }
 
-function NativeDateTimeInput({
-  value,
-  onChange,
-  border,
-  surface,
-  text,
-  primary,
-  danger,
-  hasError,
-  style,
-}: {
-  value: string;
-  onChange: (value: string) => void;
-  border: string;
-  surface: string;
-  text: string;
-  primary: string;
-  danger: string;
-  hasError?: boolean;
-  style?: React.CSSProperties;
-}) {
-  const [focused, setFocused] = React.useState(false);
-  const ringColor = hasError ? withAlpha(danger, 0.18) : withAlpha(primary, 0.18);
-  const borderColor = hasError ? danger : focused ? primary : border;
-
-  return (
-    <input
-      type="datetime-local"
-      value={value}
-      onChange={(event) => onChange(event.target.value)}
-      onFocus={() => setFocused(true)}
-      onBlur={() => setFocused(false)}
-      style={{
-        width: '100%',
-        height: 44,
-        padding: '0 12px',
-        borderRadius: 12,
-        borderWidth: 1,
-        borderStyle: 'solid',
-        borderColor,
-        backgroundColor: surface,
-        color: text,
-        fontSize: 14,
-        boxShadow: focused ? `0 0 0 3px ${ringColor}` : undefined,
-        outline: 'none',
-        ...style,
-      }}
-    />
-  );
-}
-
 function resolveLocation(event: TenantEvent): string {
   const settings = (event.settings ?? {}) as Record<string, unknown>;
   const candidate =