ST-cmovs8psg: notifications-sheet + iOS meta-tags in layout

notifications-sheet.tsx: PushToggle onderin met sectie
'Notificatie-instellingen' en visuele scheidslijn.
app/layout.tsx: appleWebApp.capable, statusBarStyle en
mobile-web-app-capable meta-tags toegevoegd via Next.js Metadata API.
manifest.json had al display: standalone.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

app/layout.tsx

@@ -1,4 +1,4 @@
-import type { Metadata } from "next";
+import type { Metadata, Viewport } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 import { Analytics } from "@vercel/analytics/next";
 import { Toaster } from "sonner";
@@ -30,6 +30,17 @@ export const metadata: Metadata = {
     ],
   },
   manifest: "/manifest.json",
+  appleWebApp: {
+    capable: true,
+    statusBarStyle: 'default',
+  },
+  other: {
+    'mobile-web-app-capable': 'yes',
+  },
+};
+
+export const viewport: Viewport = {
+  themeColor: '#ffffff',
 };
 
 export default function RootLayout({

components/notifications/notifications-sheet.tsx

@@ -17,6 +17,7 @@ import {
 } from '@/components/ui/sheet'
 import { useNotificationsStore } from '@/stores/notifications-store'
 import { AnswerModal } from './answer-modal'
+import { PushToggle } from './push-toggle'
 import { cn } from '@/lib/utils'
 import type { NotificationQuestion } from '@/stores/notifications-store'
 
@@ -94,6 +95,12 @@ export function NotificationsSheet({
               })}
             </ul>
           )}
+          <div className="border-border mt-4 border-t px-4 pt-4 pb-2">
+            <p className="text-muted-foreground mb-2 text-xs font-medium uppercase tracking-wide">
+              Notificatie-instellingen
+            </p>
+            <PushToggle vapidPublicKey={process.env.NEXT_PUBLIC_VAPID_PUBLIC_KEY} />
+          </div>
         </SheetContent>
       </Sheet>