Chỉnh sửa và tối ưu form đăng nhập và đăng ký

frontend/css/style.css

@@ -192,11 +192,11 @@ html, body {
     background: rgba(30, 30, 30, 0.98);
     box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
     border-radius: 8px;
-    padding: 10px 0; /* Remove horizontal padding to let hover cover full width */
+    padding: 15px 0; /* Tăng padding dọc để thoáng hơn */
     width: auto; /* Tự động điều chỉnh theo nội dung */
     z-index: 1600; /* Above top-bar */
     border: 1px solid rgba(255, 255, 255, 0.1);
-    min-width: 180px; /* Đảm bảo không quá nhỏ */
+    min-width: 320px; /* Mở rộng box để tránh ngắt dòng nội dung */
     max-height: 550px;
     overflow-y: auto;
 }
@@ -247,17 +247,37 @@ html, body {
     width: calc(100% - 40px) !important;
     background: #007bff !important;
     color: white !important;
-    padding: 10px !important;
+    padding: 12px !important; /* Tăng padding để nút nhìn đầy đặn hơn */
+    display: flex !important; /* Kích hoạt flexbox để căn giữa icon và text */
+    align-items: center;
+    justify-content: center;
+    gap: 10px; /* Khoảng cách giữa icon và chữ */
+    border-radius: 6px !important;
+    font-weight: 600 !important;
+}
+
+.auth-submit-btn::before {
+    content: '\1F464'; /* Mã Unicode cho icon người dùng (👤) */
+    font-size: 16px;
 }
 
 .rules-checkbox {
     display: flex;
-    align-items: center;
+    align-items: flex-start; /* Căn đỉnh để khi text dài vẫn nhìn hợp lý */
+    justify-content: flex-start; /* Căn lề trái */
     gap: 8px;
     color: #ccc;
     font-size: 12px;
-    margin: 5px 20px 15px;
+    margin: 5px 20px 15px 20px;
     cursor: pointer;
+    text-align: left;
+}
+
+/* Ghi đè độ rộng 100% của input để checkbox không chiếm toàn bộ dòng */
+.rules-checkbox input[type="checkbox"] {
+    width: auto !important;
+    margin: 2px 0 0 0 !important;
+    flex-shrink: 0; /* Ngăn checkbox bị bóp méo */
 }
 
 #user-dropdown input {