migrate from deprecated slots to snippets and fix event handlers

- Replace deprecated <slot> syntax with modern {#snippet} and {@render} patterns
- Add TypeScript types for snippet props in Header component
- Convert on:click event handlers to onclick attribute throughout
- Update all layout files to use new snippet-based composition pattern

src/routes/glaube/+layout.svelte

@@ -2,7 +2,7 @@
 import { page } from '$app/stores';
 import Header from '$lib/components/Header.svelte'
 import UserHeader from '$lib/components/UserHeader.svelte';
-export let data
+let { data, children } = $props();
 
 function isActive(path) {
 	const currentPath = $page.url.pathname;
@@ -11,11 +11,17 @@ function isActive(path) {
 }
 </script>
 <Header>
-	<ul class=site_header slot=links>
-	<li><a href="/glaube/gebete" class:active={isActive('/glaube/gebete')}>Gebete</a></li>
-	<li><a href="/glaube/rosenkranz" class:active={isActive('/glaube/rosenkranz')}>Rosenkranz</a></li>
-	<li><a href="/glaube/predigten" class:active={isActive('/glaube/predigten')}>Predigten</a></li>
-	</ul>
-	<UserHeader user={data.session?.user} slot=right_side></UserHeader>
-	<slot></slot>
+	{#snippet links()}
+		<ul class=site_header>
+		<li><a href="/glaube/gebete" class:active={isActive('/glaube/gebete')}>Gebete</a></li>
+		<li><a href="/glaube/rosenkranz" class:active={isActive('/glaube/rosenkranz')}>Rosenkranz</a></li>
+		<li><a href="/glaube/predigten" class:active={isActive('/glaube/predigten')}>Predigten</a></li>
+		</ul>
+	{/snippet}
+
+	{#snippet right_side()}
+		<UserHeader user={data.session?.user}></UserHeader>
+	{/snippet}
+
+	{@render children()}
 </Header>