Improve auth pages

frontend/src/css/_auth.scss

@@ -1,4 +1,5 @@
 @use "common/colors" as *;
+@use "common/material" as *;
 
 .auth-container {
     display: flex;
@@ -6,30 +7,27 @@
     align-items: center;
     min-height: 100vh;
     padding: 2rem;
-    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
+    background-color: $color-dark-surface;
 
     .auth-card {
-        background: white;
+        background-color: $color-dark-surface-container;
+        color: $color-dark-on-surface;
         border-radius: 12px;
         box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
         width: 100%;
         max-width: 450px;
         overflow: hidden;
-        transition: all 0.3s ease;
-
-        &:hover {
-            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
-        }
     }
       
     .auth-header {
-        background: linear-gradient(135deg, $primary, $primary-dark);
-        color: white;
-        padding: 1.5rem;
+        margin: 0;
+        padding: 16px;
+        padding-bottom: 0;
         text-align: center;
 
         h2 {
             font-size: 1.8rem;
+            margin: 0;
             margin-bottom: 0.5rem;
             align-items: center;
             display: flex;
@@ -40,6 +38,13 @@
     }
       
     .auth-body {
-        padding: 2rem;
+        padding: 25px;
+        padding-bottom: 16px;
+
+        form {
+            display: flex;
+            flex-direction: column;
+            gap: 10px;
+        }
     }
 }