* Extended functionalities

* Added different UIs

meal-plan-frontend-mobile/app/(main)/_layout.tsx

@@ -0,0 +1,38 @@
+import { Redirect, Stack } from 'expo-router';
+import { useTranslation } from 'react-i18next';
+import { useAuth } from '@/src/context/AuthContext';
+import { useAppearance } from '@/src/context/AppearanceContext';
+import { Screen } from '@/src/components/Screen';
+
+export default function MainLayout() {
+  const { isAuthenticated, isLoading } = useAuth();
+  const { colors } = useAppearance();
+  const { t } = useTranslation();
+
+  if (isLoading) {
+    return <Screen loading />;
+  }
+
+  if (!isAuthenticated) {
+    return <Redirect href="/(auth)/login" />;
+  }
+
+  return (
+    <Stack
+      screenOptions={{
+        headerStyle: { backgroundColor: colors.surface },
+        headerTintColor: colors.brand,
+        headerTitleStyle: { color: colors.text },
+        contentStyle: { backgroundColor: colors.background },
+      }}
+    >
+      <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
+      <Stack.Screen name="recipe/[id]" options={{ title: t('recipes.allMealsTitle') }} />
+      <Stack.Screen name="recipe/edit/[id]" options={{ title: t('manage.editRecipe') }} />
+      <Stack.Screen name="ingredients" options={{ title: t('nav.ingredientCatalog') }} />
+      <Stack.Screen name="diet-generator" options={{ title: t('nav.dietGenerator') }} />
+      <Stack.Screen name="recipe-generator" options={{ title: t('nav.recipeGenerator') }} />
+      <Stack.Screen name="category/[category]" />
+    </Stack>
+  );
+}