diff --git a/src/modules/auth/ui/views/forgot-password-view.tsx b/src/modules/auth/ui/views/forgot-password-view.tsx
index 1cb7590..5458145 100644
--- a/src/modules/auth/ui/views/forgot-password-view.tsx
+++ b/src/modules/auth/ui/views/forgot-password-view.tsx
@@ -15,7 +15,8 @@ const ForgotPasswordView = () => {
   const router = useRouter();
   const supabase = createClient();
 
-  const handleReset = async () => {
+  const handleReset = async (e: React.FormEvent) => {
+    e.preventDefault();
     setEmailError("");
     setLoading(true);
 
@@ -41,8 +42,8 @@ const ForgotPasswordView = () => {
   return (
     <div className="flex min-h-screen">
       {/* Sidebar */}
-      <div className="hidden lg:flex lg:w-1/6 ">
-        <div className="fixed p-4 left-0 top-0 h-screen w-1/2 z-10">
+      <div className="hidden lg:block lg:w-[40%] ">
+        <div className="fixed left-0 top-0 h-screen w-[40%] p-2 z-10">
           <AuthSidebarComponent
             title="Passwort zurücksetzen"
             description="Keine Sorge, wir helfen Ihnen dabei, wieder Zugang zu Ihrem Konto zu erhalten."
@@ -56,13 +57,13 @@ const ForgotPasswordView = () => {
         <div className="w-full max-w-lg flex flex-col gap-4 z-20">
           <h1 className="text-2xl font-extrabold text-blue mb-8">Passwort vergessen?</h1>
 
-          {!emailSent ? (
-            <>
-              <p className="text-sm text-gray-600 mb-4">
-                Geben Sie Ihre E-Mail-Adresse ein und wir senden Ihnen einen Link zum Zurücksetzen
-                Ihres Passworts.
-              </p>
+          <p className="text-sm text-gray-600 mb-4">
+            Geben Sie Ihre E-Mail-Adresse ein und wir senden Ihnen einen Link zum Zurücksetzen Ihres
+            Passworts.
+          </p>
 
+          {!emailSent ? (
+            <form onSubmit={handleReset} className="space-y-5">
               <InputComponent
                 isLabel
                 label="E-mail Adresse"
@@ -73,10 +74,10 @@ const ForgotPasswordView = () => {
                 error={emailError}
               />
 
-              <Button onClick={handleReset} disabled={loading} className="w-full mt-6">
+              <Button type="submit" disabled={loading} className="w-full mt-6">
                 {loading ? <Spinner /> : "Link zum Zurücksetzen senden"}
               </Button>
-            </>
+            </form>
           ) : (
             <div className="bg-green-50 border border-green-200 rounded-lg p-6 mt-4">
               <h2 className="text-lg font-semibold text-green-800 mb-2">E-Mail wurde versendet!</h2>
diff --git a/src/modules/auth/ui/views/login-view.tsx b/src/modules/auth/ui/views/login-view.tsx
index 79de2a7..1adc2eb 100644
--- a/src/modules/auth/ui/views/login-view.tsx
+++ b/src/modules/auth/ui/views/login-view.tsx
@@ -18,7 +18,8 @@ const LoginView = () => {
   const [remember, setRemember] = useState(false);
   const router = useRouter();
 
-  const handleLogin = async () => {
+  const handleLogin = async (e: React.FormEvent) => {
+    e.preventDefault();
     const success = await loginUser(email, password, remember);
     if (success) {
       router.push("/dashboard");
@@ -42,49 +43,52 @@ const LoginView = () => {
       <div className="w-full lg:w-[60%] lg:ml-auto flex justify-center items-center min-h-screen px-4">
         <div className="w-full max-w-lg flex flex-col gap-4 z-20">
           <h1 className="text-2xl font-extrabold text-blue mb-8 ">Login</h1>
-
-          <InputComponent
-            isLabel
-            label="E-mail Adresse"
-            type="email"
-            id="login-email"
-            value={email}
-            onChange={(e) => setEmail(e.target.value)}
-            error={errors.email}
-          />
-          <InputComponent
-            isLabel
-            label="Passwort"
-            type="password"
-            id="login-password"
-            value={password}
-            onChange={(e) => setPassword(e.target.value)}
-            error={errors.password}
-          />
-
-          <div className="flex flex-col sm:flex-row sm:justify-between w-full mt-6 gap-4 text-sm">
-            <div className="flex items-center gap-2">
-              <Checkbox
-                id="remembering"
-                checked={remember}
-                onCheckedChange={(val: boolean) => setRemember(val)}
-                className="shadow-none h-5 w-5 bg-white border-blue cursor-pointer"
+          <form onSubmit={handleLogin}>
+            <div className="space-y-5">
+              <InputComponent
+                isLabel
+                label="E-mail Adresse"
+                type="email"
+                id="login-email"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                error={errors.email}
+              />
+              <InputComponent
+                isLabel
+                label="Passwort"
+                type="password"
+                id="login-password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                error={errors.password}
               />
-              <Label htmlFor="remembering" className="cursor-pointer">
-                Beim nächsten Mal an mich erinnern
-              </Label>
             </div>
-            <p
-              className="hover:underline cursor-pointer text-blue"
-              onClick={() => router.push("/forgot-password")}
-            >
-              Passwort vergessen?
-            </p>
-          </div>
 
-          <Button onClick={handleLogin} disabled={loading} className="w-full mt-6">
-            {loading ? <Spinner /> : "Anmelden"}
-          </Button>
+            <div className="flex flex-col sm:flex-row sm:justify-between w-full mt-6 gap-4 text-sm">
+              <div className="flex items-center gap-2">
+                <Checkbox
+                  id="remembering"
+                  checked={remember}
+                  onCheckedChange={(val: boolean) => setRemember(val)}
+                  className="shadow-none h-5 w-5 bg-white border-blue cursor-pointer"
+                />
+                <Label htmlFor="remembering" className="cursor-pointer">
+                  Beim nächsten Mal an mich erinnern
+                </Label>
+              </div>
+              <p
+                className="hover:underline cursor-pointer text-blue"
+                onClick={() => router.push("/forgot-password")}
+              >
+                Passwort vergessen?
+              </p>
+            </div>
+
+            <Button type="submit" disabled={loading} className="w-full mt-6">
+              {loading ? <Spinner /> : "Anmelden"}
+            </Button>
+          </form>
 
           <hr className="mt-6 border-blue" />
 
diff --git a/src/modules/auth/ui/views/register-admin-view.tsx b/src/modules/auth/ui/views/register-admin-view.tsx
index b70a7c7..0e06ddf 100644
--- a/src/modules/auth/ui/views/register-admin-view.tsx
+++ b/src/modules/auth/ui/views/register-admin-view.tsx
@@ -1,5 +1,5 @@
 "use client";
-import { useState } from "react";
+import React, { useState } from "react";
 import AuthSidebarComponent from "../components/AuthSidebarComponent";
 import InputComponent from "@/src/components/layout/InputComponent";
 import { Button } from "@/src/components/ui/button";
@@ -24,7 +24,8 @@ const RegisterAdmin = () => {
     formData.setField(field, value);
   };
 
-  const handleNext = () => {
+  const handleNext = (e: React.FormEvent) => {
+    e.preventDefault();
     setErrors({});
     try {
       if (step === 1) {
@@ -58,7 +59,8 @@ const RegisterAdmin = () => {
     }
   };
 
-  const handleRegister = async () => {
+  const handleRegister = async (e: React.FormEvent) => {
+    e.preventDefault();
     setErrors({});
     try {
       adminRegisterStep3Schema.parse({
@@ -125,7 +127,7 @@ const RegisterAdmin = () => {
           <h1 className="text-2xl font-extrabold text-blue mb-8 mt-8 ">Sign up for free</h1>
 
           {step === 1 && (
-            <>
+            <form onSubmit={handleNext} className="space-y-5">
               <InputComponent
                 isLabel
                 label="Vor- und Nachname"
@@ -172,14 +174,14 @@ const RegisterAdmin = () => {
                 error={errors.passwordConfirm}
               />
 
-              <Button className="w-full mt-6" onClick={handleNext} disabled={loading}>
+              <Button className="w-full mt-6" type="submit" disabled={loading}>
                 {loading ? <Spinner /> : "Weiter"}
               </Button>
-            </>
+            </form>
           )}
 
           {step === 2 && (
-            <>
+            <form onSubmit={handleNext} className="space-y-5">
               <InputComponent
                 isLabel
                 label="PLZ"
@@ -209,14 +211,14 @@ const RegisterAdmin = () => {
                 error={errors.street}
               />
 
-              <Button className="w-full mt-6" onClick={handleNext} disabled={loading}>
+              <Button className="w-full mt-6" type="submit" disabled={loading}>
                 {loading ? <Spinner /> : "Weiter"}
               </Button>
-            </>
+            </form>
           )}
 
           {step === 3 && (
-            <>
+            <form onSubmit={handleRegister} className="space-y-5">
               <InputComponent
                 isLabel
                 label="Unternehmensname"
@@ -273,10 +275,10 @@ const RegisterAdmin = () => {
                 error={errors.companyNumber}
               />
 
-              <Button className="w-full mt-6" onClick={handleRegister} disabled={loading}>
+              <Button className="w-full mt-6" type="submit" disabled={loading}>
                 {loading ? <Spinner /> : "Anmelden"}
               </Button>
-            </>
+            </form>
           )}
 
           <div className="flex flex-col sm:flex-row gap-2 items-center mt-8 text-sm">
diff --git a/src/modules/auth/ui/views/register-user-view.tsx b/src/modules/auth/ui/views/register-user-view.tsx
index 165d2f6..b81335e 100644
--- a/src/modules/auth/ui/views/register-user-view.tsx
+++ b/src/modules/auth/ui/views/register-user-view.tsx
@@ -23,7 +23,8 @@ const RegisterUserView = () => {
     formData.setField(field, value);
   };
 
-  const handleNext = () => {
+  const handleNext = (e: React.FormEvent) => {
+    e.preventDefault();
     setErrors({});
     try {
       if (step === 1) {
@@ -49,7 +50,8 @@ const RegisterUserView = () => {
     }
   };
 
-  const handleRegister = async () => {
+  const handleRegister = async (e: React.FormEvent) => {
+    e.preventDefault();
     const success = await registerUser({
       fullName: formData.fullName,
       email: formData.email,
@@ -89,7 +91,7 @@ const RegisterUserView = () => {
           <h1 className="text-2xl font-extrabold text-blue mb-8 mt-8 ">Sign up for free</h1>
 
           {step === 1 && (
-            <>
+            <form onSubmit={handleNext} className="space-y-5">
               <InputComponent
                 isLabel
                 label="Vor- und Nachname"
@@ -128,14 +130,14 @@ const RegisterUserView = () => {
                 error={errors.passwordConfirm}
               />
 
-              <Button className="w-full mt-6" onClick={handleNext}>
+              <Button className="w-full mt-6" type="submit">
                 {loading ? <Spinner /> : "Weiter"}
               </Button>
-            </>
+            </form>
           )}
 
           {step === 2 && (
-            <>
+            <form onSubmit={handleRegister} className="space-y-5">
               <InputComponent
                 isLabel
                 label="Geburtsdatum"
@@ -182,10 +184,10 @@ const RegisterUserView = () => {
                 error={errors.gender}
               />
 
-              <Button onClick={handleRegister} disabled={loading} className="w-full mt-6">
+              <Button type="submit" disabled={loading} className="w-full mt-6">
                 {loading ? <Spinner /> : "Anmelden"}
               </Button>
-            </>
+            </form>
           )}
 
           <hr className="mt-6 border-blue" />
diff --git a/src/modules/auth/ui/views/reset-password-view.tsx b/src/modules/auth/ui/views/reset-password-view.tsx
index 69b30b9..13d0db7 100644
--- a/src/modules/auth/ui/views/reset-password-view.tsx
+++ b/src/modules/auth/ui/views/reset-password-view.tsx
@@ -2,7 +2,7 @@
 import InputComponent from "@/src/components/layout/InputComponent";
 import AuthSidebarComponent from "../components/AuthSidebarComponent";
 import { Button } from "@/src/components/ui/button";
-import { useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { useRouter } from "next/navigation";
 import { Spinner } from "@/src/components/ui/spinner";
 import { createClient } from "@/src/lib/supabase/client";
@@ -25,7 +25,9 @@ const ResetPasswordView = () => {
     });
   }, [router, supabase]);
 
-  const handleResetPassword = async () => {
+  const handleResetPassword = async (e: React.FormEvent) => {
+    e.preventDefault();
+
     setLoading(true);
     setPasswordError("");
     setConfirmPasswordError("");
@@ -66,8 +68,8 @@ const ResetPasswordView = () => {
   return (
     <div className="flex min-h-screen">
       {/* Sidebar */}
-      <div className="hidden lg:flex lg:w-1/6 ">
-        <div className="fixed p-4 left-0 top-0 h-screen w-1/2 z-10">
+      <div className="hidden lg:block lg:w-[40%] ">
+        <div className="fixed left-0 top-0 h-screen w-[40%] p-2 z-10">
           <AuthSidebarComponent
             title="Neues Passwort setzen"
             description="Wählen Sie ein sicheres Passwort für Ihr Konto."
@@ -77,16 +79,16 @@ const ResetPasswordView = () => {
       </div>
 
       {/* Reset Password Formular */}
-      <div className="w-full lg:w-5/6 lg:ml-auto flex justify-center items-center min-h-screen px-4">
+      <div className="w-full lg:w-[60%] lg:ml-auto flex justify-center items-center min-h-screen px-4">
         <div className="w-full max-w-lg flex flex-col gap-4 z-20">
           <h1 className="text-2xl font-extrabold text-blue mb-8">Passwort zurücksetzen</h1>
 
-          {!resetSuccess ? (
-            <>
-              <p className="text-sm text-gray-600 mb-4">
-                Bitte geben Sie Ihr neues Passwort ein. Es sollte mindestens 8 Zeichen lang sein.
-              </p>
+          <p className="text-sm text-gray-600 mb-4">
+            Bitte geben Sie Ihr neues Passwort ein. Es sollte mindestens 8 Zeichen lang sein.
+          </p>
 
+          {!resetSuccess ? (
+            <form onSubmit={handleResetPassword} className="space-y-5">
               <InputComponent
                 isLabel
                 label="Neues Passwort"
@@ -107,10 +109,10 @@ const ResetPasswordView = () => {
                 error={confirmPasswordError}
               />
 
-              <Button onClick={handleResetPassword} disabled={loading} className="w-full mt-6">
+              <Button type="submit" disabled={loading} className="w-full mt-6">
                 {loading ? <Spinner /> : "Passwort zurücksetzen"}
               </Button>
-            </>
+            </form>
           ) : (
             <div className="bg-green-50 border border-green-200 rounded-lg p-6 mt-4">
               <h2 className="text-lg font-semibold text-green-800 mb-2">