Use HTML swap to display success and error messages

templates/login.html

@@ -8,7 +8,10 @@
         <p class="mt-2 text-sm text-gray-600">Sign in to access the admin dashboard.</p>
       </div>
       <div class="bg-white rounded-lg shadow-md p-8 border border-gray-200">
-        <form action="/login" method="post" class="space-y-6">
+        <form hx-post="/login"
+              hx-target="#login-messages"
+              hx-swap="innerHTML"
+              class="space-y-6">
           <div>
             <label for="username" class="block text-sm font-medium text-gray-700 mb-2">Username</label>
             <input type="text"
@@ -31,8 +34,8 @@
               Continue
             </button>
           </div>
+          <div id="login-messages" class="mt-4"></div>
         </form>
-        <div class="mt-4 text-center">{{ error }}</div>
       </div>
       <div class="text-center">
         <a href="/"