fix(auth): correct user query column name and improve message display

- Change query filter from 'user_id' to 'id' in UserComponent
- Update message visibility checks from null comparison to length-based
- Add margin and flexbox styling to message containers and pagination

src/Authentication/Components/UserComponent.vala

@@ -87,7 +87,7 @@ namespace Spry.Authentication {
             }
 
             user = yield orm_session.query<UserProjection>()
-                .where(expr("user_id == $0", elem<int64?>(user_id)))
+                .where(expr("id == $0", elem<int64?>(user_id)))
                 .first_async();
 
             if(action == "edit") {

src/Authentication/Components/UserManagementComponent.vala

@@ -43,13 +43,13 @@ namespace Spry.Authentication {
                     </div>
                 </form>
             </details>
-            <div spry-if="this.error_message != null" style="color: red;">
+            <div spry-if="this.error_message.length > 0" style="color: red; margin-top: 1em;">
                 <strong content-expr="this.error_message"></strong>
             </div>
-            <div spry-if="this.success_message != null" style="color: green;">
+            <div spry-if="this.error_message.length > 0" style="color: green; margin-top: 1em;">
                 <strong content-expr="this.success_message"></strong>
             </div>
-            <div>
+            <div style="margin-top: 1em; display: flex; gap: 0.75em; align-items: center">
                 <button spry-action=":previous" spry-target="container" hx-swap="outerHTML">Previous</button>
                 <span>Page <strong content-expr="stringify(this.page_number + 1)"></strong></span>
                 <button spry-action=":next" spry-target="container" hx-swap="outerHTML">Next</button>