Add WhatsApp and National Number fields to registration forms

- Tenant form: added WhatsApp number + National number inputs
- Owner form: added National number input (already had WhatsApp)
- Both forms send whatsAppNumber and nationalNumber in payload
- Added validation for required fields

app/register/owner/page.js

@@ -29,6 +29,7 @@ export default function OwnerRegisterPage() {
     email: '',
     phone: '',
     whatsapp: '',
+    nationalNumber: '',
     password: '',
     confirmPassword: '',
     ownerType: OwnerType.PERSON,
@@ -129,6 +130,7 @@ export default function OwnerRegisterPage() {
       email: formData.email,
       phoneNumber: formData.phone || '',
       whatsAppNumber: formData.whatsapp,
+      nationalNumber: formData.nationalNumber,
       password: formData.password,
       ownerType: formData.ownerType,
     };
@@ -358,6 +360,20 @@ export default function OwnerRegisterPage() {
                     {errors.whatsapp && <p className="text-red-500 text-sm mt-1">{errors.whatsapp}</p>}
                   </motion.div>
 
+                  <motion.div variants={fadeInUp}>
+                    <label className="block text-sm font-medium text-gray-300 mb-2">الرقم الوطني <span className="text-red-500">*</span></label>
+                    <div className="relative group">
+                      <div className="absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none">
+                        <User className={`w-5 h-5 ${errors.nationalNumber ? 'text-red-500' : 'text-gray-400 group-focus-within:text-amber-500'}`} />
+                      </div>
+                      <input type="text" value={formData.nationalNumber}
+                        onChange={(e) => { setFormData({...formData, nationalNumber: e.target.value}); setErrors({...errors, nationalNumber: null}); }}
+                        className={`w-full pr-12 pl-4 py-3 bg-white/5 border rounded-xl focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-transparent text-white placeholder-gray-500 transition-all ${errors.nationalNumber ? 'border-red-500' : 'border-gray-700'}`}
+                        placeholder="أدخل الرقم الوطني" />
+                    </div>
+                    {errors.nationalNumber && <p className="text-red-500 text-sm mt-1">{errors.nationalNumber}</p>}
+                  </motion.div>
+
                   <motion.div variants={fadeInUp}>
                     <label className="block text-sm font-medium text-gray-300 mb-2">نوع المالك <span className="text-red-500">*</span></label>
                     <select value={formData.ownerType}

app/register/tenant/page.js

@@ -29,6 +29,7 @@ export default function TenantRegisterPage() {
     email: '',
     phone: '',
     whatsapp: '',
+    nationalNumber: '',
     password: '',
     confirmPassword: '',
     customerType: CustomerType.PERSONAL,
@@ -81,6 +82,8 @@ export default function TenantRegisterPage() {
     if (!formData.password) newErrors.password = 'كلمة المرور مطلوبة';
     else if (formData.password.length < 6) newErrors.password = 'كلمة المرور يجب أن تكون 6 أحرف على الأقل';
 
+    if (!formData.whatsapp) newErrors.whatsapp = 'رقم الواتساب مطلوب';
+    if (!formData.nationalNumber) newErrors.nationalNumber = 'الرقم الوطني مطلوب';
     if (formData.password !== formData.confirmPassword) newErrors.confirmPassword = 'كلمات المرور غير متطابقة';
 
     setErrors(newErrors);
@@ -126,6 +129,8 @@ export default function TenantRegisterPage() {
       lastName: formData.lastName,
       email: formData.email,
       phoneNumber: formData.phone,
+      whatsAppNumber: formData.whatsapp,
+      nationalNumber: formData.nationalNumber,
       password: formData.password,
       customerType: formData.customerType,
     };
@@ -339,6 +344,34 @@ export default function TenantRegisterPage() {
                     {errors.phone && <p className="text-red-500 text-sm mt-1">{errors.phone}</p>}
                   </motion.div>
 
+                  <motion.div variants={fadeInUp}>
+                    <label className="block text-sm font-medium text-gray-300 mb-2">رقم الواتساب <span className="text-red-500">*</span></label>
+                    <div className="relative group">
+                      <div className="absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none">
+                        <Phone className={`w-5 h-5 ${errors.whatsapp ? 'text-red-500' : 'text-gray-400 group-focus-within:text-blue-500'}`} />
+                      </div>
+                      <input type="tel" value={formData.whatsapp}
+                        onChange={(e) => { setFormData({...formData, whatsapp: e.target.value}); setErrors({...errors, whatsapp: null}); }}
+                        className={`w-full pr-12 pl-4 py-3 bg-white/5 border rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent text-white placeholder-gray-500 transition-all ${errors.whatsapp ? 'border-red-500' : 'border-gray-700'}`}
+                        placeholder="أدخل رقم الواتساب" />
+                    </div>
+                    {errors.whatsapp && <p className="text-red-500 text-sm mt-1">{errors.whatsapp}</p>}
+                  </motion.div>
+
+                  <motion.div variants={fadeInUp}>
+                    <label className="block text-sm font-medium text-gray-300 mb-2">الرقم الوطني <span className="text-red-500">*</span></label>
+                    <div className="relative group">
+                      <div className="absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none">
+                        <User className={`w-5 h-5 ${errors.nationalNumber ? 'text-red-500' : 'text-gray-400 group-focus-within:text-blue-500'}`} />
+                      </div>
+                      <input type="text" value={formData.nationalNumber}
+                        onChange={(e) => { setFormData({...formData, nationalNumber: e.target.value}); setErrors({...errors, nationalNumber: null}); }}
+                        className={`w-full pr-12 pl-4 py-3 bg-white/5 border rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent text-white placeholder-gray-500 transition-all ${errors.nationalNumber ? 'border-red-500' : 'border-gray-700'}`}
+                        placeholder="أدخل الرقم الوطني" />
+                    </div>
+                    {errors.nationalNumber && <p className="text-red-500 text-sm mt-1">{errors.nationalNumber}</p>}
+                  </motion.div>
+
                   <motion.div variants={fadeInUp}>
                     <label className="block text-sm font-medium text-gray-300 mb-2">نوع العميل <span className="text-red-500">*</span></label>
                     <select value={formData.customerType}