careers contact new image added captcha issue are corrected

src/app/globals.css

@@ -16419,3 +16419,102 @@ h4.service-details__dynamic-content-erp {
     justify-content: center;
   }
 }
+
+.custom-file-upload {
+  position: relative;
+  width: 100%;
+  margin-top: 10px;
+}
+
+.hidden-file-input {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  border: 0;
+}
+
+.file-upload-label {
+  display: flex !important;
+  align-items: center;
+  justify-content: space-between;
+  background: rgba(255, 255, 255, 0.03);
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
+  border: 1.5px dashed rgba(255, 255, 255, 0.15);
+  border-radius: 15px;
+  padding: 18px 24px;
+  cursor: pointer;
+  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+  min-height: 70px;
+  position: relative;
+  overflow: hidden;
+}
+
+.file-upload-label:hover {
+  background: rgba(255, 255, 255, 0.08);
+  border-color: var(--pelocis-base, #3779b9);
+  transform: translateY(-2px);
+  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
+}
+
+.file-upload-content {
+  display: flex;
+  align-items: center;
+  gap: 18px;
+  color: rgba(255, 255, 255, 0.85);
+  flex-grow: 1;
+  overflow: hidden;
+}
+
+.file-upload-content i {
+  font-size: 28px;
+  color: var(--pelocis-base, #3779b9);
+  transition: all 0.3s ease;
+}
+
+.file-upload-label:hover .file-upload-content i {
+  transform: scale(1.1) rotate(-5deg);
+}
+
+.file-name {
+  font-size: 16px;
+  font-weight: 500;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 280px;
+  letter-spacing: 0.3px;
+}
+
+.file-upload-browse {
+  background: #3779b9;
+  color: #fff;
+  padding: 10px 22px;
+  border-radius: 10px;
+  font-size: 13px;
+  font-weight: 800;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  transition: all 0.3s ease;
+  flex-shrink: 0;
+  box-shadow: 0 4px 15px rgba(55, 121, 185, 0.3);
+}
+
+.file-upload-label:hover .file-upload-browse {
+  background: #3779b9;
+  transform: scale(1.05);
+  box-shadow: 0 6px 20px rgba(55, 121, 185, 0.5);
+}
+
+.form-one__control--full .text-danger {
+  display: block;
+  margin-top: 10px;
+  font-size: 14px;
+  font-weight: 600;
+  color: #FFF;
+  animation: fadeIn 0.3s ease;
+}

src/components/careers/CareersForm.tsx

@@ -113,7 +113,7 @@ const CareersForm = () => {
         if (!formData.email.trim()) errors.email = "Email is required.";
         if (!formData.phone.trim()) errors.phone = "Phone is required.";
         if (!formData.position.trim()) errors.position = "Please select a position.";
-        // if (!captchaToken) errors.captcha = "Please verify the CAPTCHA.";
+        if (!captchaToken) errors.captcha = "Please verify the CAPTCHA.";
         if (!resumeFile) errors.resume = "Please upload your resume.";
 
         setFormErrors(errors);
@@ -321,20 +321,22 @@ const CareersForm = () => {
                                             ></textarea>
                                         </div>
 
-                                        {/* <div className="form-one__control--full mb-3 mt-3">
+                                        <div className="form-one__control--full mb-3 mt-3">
                                             <ReCAPTCHA
                                                 sitekey="6LekfpwrAAAAAOTwuP1d2gg-Fv9UEsAjE2gjOQJl"
                                                 onChange={handleCaptchaChange}
                                             />
                                             {formErrors.captcha && <small className="text-danger">{formErrors.captcha}</small>}
-                                        </div> */}
+                                        </div>
+
 
                                         <div className="form-one__control--full">
-                                            <button type="submit" className="submit-btn-custom-global" disabled={isSubmitting}>
+                                            <button type="submit" className="submit-btn-custom-global" disabled={isSubmitting} suppressHydrationWarning={true}>
                                                 <b>{isSubmitting ? "SUBMITTING..." : "SUBMIT APPLICATION"}</b>
                                                 <span></span>
                                             </button>
                                         </div>
+
                                     </div>
                                 </form>
                             </div>