added test dev buttons and email button

src/lib/components/Button.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+
+	interface Props {
+		children: Snippet;
+		variant?: "primary" | "google" | "apple" | "secondary" | "danger";
+		onclick?: () => void;
+		class?: string;
+		type?: "button" | "submit" | "reset";
+	}
+
+	let {
+		children,
+		variant = "primary",
+		onclick,
+		class: className = "",
+		type = "button",
+	}: Props = $props();
+
+	const variantClasses = {
+		primary:
+			"bg-blue-500 hover:bg-blue-600 text-white border-gray-500 shadow-md hover:shadow-lg",
+		google: "bg-white hover:bg-gray-50 text-gray-700 border-gray-500 shadow-md hover:shadow-lg",
+		apple: "bg-black hover:bg-gray-900 text-white border-gray-500 shadow-md hover:shadow-lg",
+		secondary:
+			"bg-white/50 hover:bg-white/70 text-gray-700 border-gray-500 shadow-sm hover:shadow-md backdrop-blur-sm",
+		danger: "bg-red-500 hover:bg-red-600 text-white border-gray-500 shadow-md hover:shadow-lg",
+	};
+</script>
+
+<button
+	{type}
+	{onclick}
+	class="inline-flex items-center justify-center px-4 py-2 rounded-lg border-2 font-bold text-sm transition-all duration-200 {variantClasses[
+		variant
+	]} {className}"
+>
+	{@render children()}
+</button>