diff --git a/resources/views/components/devdojoauth/button.blade.php b/resources/views/components/devdojoauth/button.blade.php
index 7c60505..273c4d1 100644
--- a/resources/views/components/devdojoauth/button.blade.php
+++ b/resources/views/components/devdojoauth/button.blade.php
@@ -47,5 +47,6 @@
 @endphp
 
 <{!! $tagAttr !!} {!! $attributes->except(['class']) !!} class="{{ $sizeClasses }} {{ $typeClasses }} cursor-pointer inline-flex items-center w-full justify-center disabled:opacity-50 font-semibold focus:outline-none">
+    <svg xmlns="http://www.w3.org/2000/svg" wire:loading viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-1.5 w-4 h-4 animate-spin"><path d="M21 12a9 9 0 1 1-6.219-8.56"></path></svg>
     {{ $slot }}
 </{{ $tagClose }}>
\ No newline at end of file
diff --git a/resources/views/components/devdojoauth/input.blade.php b/resources/views/components/devdojoauth/input.blade.php
index 5d62be9..f5bf43e 100644
--- a/resources/views/components/devdojoauth/input.blade.php
+++ b/resources/views/components/devdojoauth/input.blade.php
@@ -15,7 +15,7 @@
     @endif
 
     <div data-model="{{ $wireModel }}" class="mt-1.5 rounded-md shadow-sm">
-        <input {{ $attributes->whereStartsWith('wire:model') }} id="{{ $id ?? '' }}" name="{{ $name ?? '' }}" type="{{ $type ?? '' }}" required autofocus class="appearance-none flex w-full h-10 px-3 py-2 text-sm bg-white dark:text-gray-300 dark:bg-white/[4%] border rounded-md border-gray-300 dark:border-white/10 ring-offset-background placeholder:text-gray-500 dark:placeholder:text-gray-400 focus:border-gray-300 dark:focus:border-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-200/60 dark:focus:ring-white/20 disabled:cursor-not-allowed disabled:opacity-50 @error($wireModel) border-red-300 text-red-900 placeholder-red-300 focus:border-red-300 focus:ring-red @enderror" />
+        <input {{ $attributes->whereStartsWith('wire:model') }} id="{{ $id ?? '' }}" name="{{ $name ?? '' }}" type="{{ $type ?? '' }}" required autofocus class="appearance-none flex w-full h-10 px-3 py-2 text-sm bg-white dark:text-gray-300 dark:bg-white/[4%] border rounded-md border-gray-300 dark:border-white/10 ring-offset-background placeholder:text-gray-500 dark:placeholder:text-gray-400 focus:border-zinc-800 dark:focus:border-gray-700 focus:outline-none focus:ring-1 focus:ring-zinc-800 dark:focus:ring-white/20 disabled:cursor-not-allowed disabled:opacity-50 @error($wireModel) border-red-300 text-red-900 placeholder-red-300 focus:border-red-300 focus:ring-red @enderror" />
     </div>
 
     @error($wireModel)