diff --git a/package-lock.json b/package-lock.json
index e632986..4a2219e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,5 +1,5 @@
 {
-    "name": "git-courses",
+    "name": "git-amarul",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
@@ -32,29 +32,6 @@
                 "url": "https://github.com/sponsors/sindresorhus"
             }
         },
-        "node_modules/@emnapi/core": {
-            "version": "1.10.0",
-            "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz",
-            "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==",
-            "dev": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "@emnapi/wasi-threads": "1.2.1",
-                "tslib": "^2.4.0"
-            }
-        },
-        "node_modules/@emnapi/runtime": {
-            "version": "1.10.0",
-            "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
-            "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==",
-            "dev": true,
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "tslib": "^2.4.0"
-            }
-        },
         "node_modules/@emnapi/wasi-threads": {
             "version": "1.2.1",
             "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
@@ -964,6 +941,7 @@
                 }
             ],
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "baseline-browser-mapping": "^2.10.12",
                 "caniuse-lite": "^1.0.30001782",
@@ -2153,6 +2131,7 @@
             "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "engines": {
                 "node": ">=12"
             },
@@ -2200,6 +2179,7 @@
                 }
             ],
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "nanoid": "^3.3.11",
                 "picocolors": "^1.1.1",
@@ -2629,6 +2609,7 @@
             "integrity": "sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@alloc/quick-lru": "^5.2.0",
                 "arg": "^5.0.2",
@@ -2806,6 +2787,7 @@
             "integrity": "sha512-Jz1mxtUBR5xTT65VOdJZUUeoyLtqljmFkiUXhPTLZka3RDc9vpi/xXkyrnsdRcm2lIi3l3GPMnAidTsEGIj3Ow==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "lightningcss": "^1.32.0",
                 "picomatch": "^4.0.4",
diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php
index 78b684f..ba3b895 100644
--- a/resources/views/auth/login.blade.php
+++ b/resources/views/auth/login.blade.php
@@ -1,47 +1,60 @@
 <x-guest-layout>
-    <!-- Session Status -->
-    <x-auth-session-status class="mb-4" :status="session('status')" />
+    <div class="mb-8">
+        <p class="text-sm font-semibold uppercase tracking-[0.24em] text-sky-600">{{ __('Account Login') }}</p>
+        <h2 class="mt-3 text-3xl font-bold text-slate-950">{{ __('Sign in to continue') }}</h2>
+        <p class="mt-3 text-sm leading-6 text-slate-500">{{ __('Access your dashboard using your registered email and password.') }}</p>
+    </div>
 
-    <form method="POST" action="{{ route('login') }}">
+    <x-auth-session-status class="mb-5 rounded-2xl border border-emerald-100 bg-emerald-50 px-4 py-3 text-sm text-emerald-700" :status="session('status')" />
+
+    <form method="POST" action="{{ route('login') }}" class="space-y-5">
         @csrf
 
-        <!-- Email Address -->
         <div>
-            <x-input-label for="email" :value="__('Email')" />
-            <x-text-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus autocomplete="username" />
+            <x-input-label for="email" :value="__('Email address')" class="text-sm font-semibold text-slate-700" />
+            <x-text-input id="email" class="mt-2 block w-full rounded-2xl border-slate-200 bg-slate-50 px-4 py-3 text-base shadow-none transition focus:border-sky-400 focus:bg-white focus:ring-sky-200" type="email" name="email" :value="old('email')" required autofocus autocomplete="username" placeholder="name@example.com" />
             <x-input-error :messages="$errors->get('email')" class="mt-2" />
         </div>
 
-        <!-- Password -->
-        <div class="mt-4">
-            <x-input-label for="password" :value="__('Password')" />
+        <div>
+            <div class="flex items-center justify-between gap-4">
+                <x-input-label for="password" :value="__('Password')" class="text-sm font-semibold text-slate-700" />
 
-            <x-text-input id="password" class="block mt-1 w-full"
+                @if (Route::has('password.request'))
+                    <a class="text-sm font-medium text-sky-600 transition hover:text-sky-700 focus:outline-none focus:ring-2 focus:ring-sky-400 focus:ring-offset-2" href="{{ route('password.request') }}">
+                        {{ __('Forgot password?') }}
+                    </a>
+                @endif
+            </div>
+
+            <x-text-input id="password" class="mt-2 block w-full rounded-2xl border-slate-200 bg-slate-50 px-4 py-3 text-base shadow-none transition focus:border-sky-400 focus:bg-white focus:ring-sky-200"
                             type="password"
                             name="password"
-                            required autocomplete="current-password" />
+                            required autocomplete="current-password" placeholder="Enter your password" />
 
             <x-input-error :messages="$errors->get('password')" class="mt-2" />
         </div>
 
-        <!-- Remember Me -->
-        <div class="block mt-4">
-            <label for="remember_me" class="inline-flex items-center">
-                <input id="remember_me" type="checkbox" class="rounded border-gray-300 text-indigo-600 shadow-sm focus:ring-indigo-500" name="remember">
-                <span class="ms-2 text-sm text-gray-600">{{ __('Remember me') }}</span>
+        <div class="flex items-center justify-between gap-4">
+            <label for="remember_me" class="inline-flex items-center gap-2">
+                <input id="remember_me" type="checkbox" class="rounded border-slate-300 text-sky-600 shadow-sm focus:ring-sky-500" name="remember">
+                <span class="text-sm text-slate-600">{{ __('Remember me') }}</span>
             </label>
         </div>
 
-        <div class="flex items-center justify-end mt-4">
-            @if (Route::has('password.request'))
-                <a class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" href="{{ route('password.request') }}">
-                    {{ __('Forgot your password?') }}
-                </a>
-            @endif
-
-            <x-primary-button class="ms-3">
+        <div class="space-y-4 pt-2">
+            <x-primary-button class="flex w-full justify-center rounded-2xl border-0 bg-gradient-to-r from-sky-500 to-violet-500 px-5 py-3 text-sm font-bold normal-case tracking-normal shadow-lg shadow-sky-200 transition hover:from-sky-600 hover:to-violet-600 focus:bg-sky-600 focus:ring-sky-300 active:bg-sky-700">
                 {{ __('Log in') }}
             </x-primary-button>
+
+            @if (Route::has('register'))
+                <p class="text-center text-sm text-slate-600">
+                    {{ __("Don't have an account?") }}
+                    <a href="{{ route('register') }}" class="font-semibold text-rose-500 transition hover:text-rose-600 focus:outline-none focus:ring-2 focus:ring-rose-300 focus:ring-offset-2">
+                        {{ __('Create one') }}
+                    </a>
+                </p>
+            @endif
         </div>
     </form>
 </x-guest-layout>
diff --git a/resources/views/layouts/guest.blade.php b/resources/views/layouts/guest.blade.php
index 11feb47..c338180 100644
--- a/resources/views/layouts/guest.blade.php
+++ b/resources/views/layouts/guest.blade.php
@@ -14,16 +14,48 @@
         <!-- Scripts -->
         @vite(['resources/css/app.css', 'resources/js/app.js'])
     </head>
-    <body class="font-sans text-gray-900 antialiased">
-        <div class="min-h-screen flex flex-col sm:justify-center items-center pt-6 sm:pt-0 bg-gray-100">
-            <div>
-                <a href="/">
-                    <x-application-logo class="w-20 h-20 fill-current text-gray-500" />
-                </a>
-            </div>
+    <body class="font-sans text-slate-900 antialiased">
+        <div class="min-h-screen bg-gradient-to-br from-sky-50 via-white to-rose-50 px-4 py-8 sm:px-6 lg:px-8">
+            <div class="mx-auto flex min-h-[calc(100vh-4rem)] w-full max-w-6xl items-center justify-center">
+                <div class="grid w-full overflow-hidden rounded-[2rem] border border-white/80 bg-white/90 shadow-2xl shadow-sky-100/70 backdrop-blur lg:grid-cols-[0.95fr_1.05fr]">
+                    <div class="relative hidden overflow-hidden bg-gradient-to-br from-cyan-500 via-sky-500 to-violet-500 p-10 text-white lg:block">
+                        <div class="absolute -left-16 top-10 h-44 w-44 rounded-full bg-white/20"></div>
+                        <div class="absolute bottom-12 right-8 h-56 w-56 rounded-full bg-amber-200/30"></div>
+                        <div class="absolute right-20 top-28 h-20 w-20 rounded-full bg-rose-300/40"></div>
 
-            <div class="w-full sm:max-w-md mt-6 px-6 py-4 bg-white shadow-md overflow-hidden sm:rounded-lg">
-                {{ $slot }}
+                        <a href="/" class="relative inline-flex h-14 w-14 items-center justify-center rounded-2xl bg-white/95 shadow-lg shadow-sky-900/20">
+                            <x-application-logo class="h-9 w-9 fill-current text-sky-600" />
+                        </a>
+
+                        <div class="relative mt-24 max-w-sm">
+                            <p class="text-sm font-semibold uppercase tracking-[0.28em] text-white/80">{{ config('app.name', 'Laravel') }}</p>
+                            <h1 class="mt-5 text-4xl font-bold leading-tight">Welcome back to your workspace.</h1>
+                            <p class="mt-5 text-base leading-7 text-white/85">Sign in to manage your account with a secure, simple, and focused experience.</p>
+                        </div>
+
+                        <div class="relative mt-16 grid grid-cols-3 gap-3">
+                            <div class="h-24 rounded-3xl bg-white/20"></div>
+                            <div class="h-24 rounded-3xl bg-white/30"></div>
+                            <div class="h-24 rounded-3xl bg-white/20"></div>
+                        </div>
+                    </div>
+
+                    <div class="flex min-h-[640px] items-center justify-center px-5 py-8 sm:px-10 lg:px-14">
+                        <div class="w-full max-w-md">
+                            <div class="mb-8 flex items-center gap-3 lg:hidden">
+                                <a href="/" class="inline-flex h-12 w-12 items-center justify-center rounded-2xl bg-sky-100">
+                                    <x-application-logo class="h-8 w-8 fill-current text-sky-600" />
+                                </a>
+                                <div>
+                                    <p class="text-sm font-semibold text-slate-500">{{ config('app.name', 'Laravel') }}</p>
+                                    <p class="text-lg font-bold text-slate-900">{{ __('Welcome back') }}</p>
+                                </div>
+                            </div>
+
+                            {{ $slot }}
+                        </div>
+                    </div>
+                </div>
             </div>
         </div>
     </body>