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/(main)/+layout.svelte

@@ -2,16 +2,28 @@
 import Header from '$lib/components/Header.svelte'
 import UserHeader from '$lib/components/UserHeader.svelte';
 import LanguageSelector from '$lib/components/LanguageSelector.svelte';
-let { data } = $props();
+let { data, children } = $props();
 
 let user = $derived(data.session?.user);
 </script>
 
 <Header>
-	<ul class=site_header slot=links>
-	</ul>
-	<LanguageSelector slot=language_selector_mobile />
-	<LanguageSelector slot=language_selector_desktop />
-	<UserHeader {user} slot=right_side></UserHeader>
-	<slot></slot>
+	{#snippet links()}
+		<ul class=site_header>
+		</ul>
+	{/snippet}
+
+	{#snippet language_selector_mobile()}
+		<LanguageSelector />
+	{/snippet}
+
+	{#snippet language_selector_desktop()}
+		<LanguageSelector />
+	{/snippet}
+
+	{#snippet right_side()}
+		<UserHeader {user}></UserHeader>
+	{/snippet}
+
+	{@render children()}
 </Header>