fix:(ux) ajuste nos inputs

frontend/pages/Profile.tsx

@@ -8,6 +8,7 @@ import { Button } from "../components/Button";
 import { useAuth } from "../contexts/AuthContext";
 import { getFunctions, createProfessional, updateProfessional } from "../services/apiService";
 import { toast } from "react-hot-toast";
+import { formatCPFCNPJ, formatPhone } from "../utils/masks";
 
 // --- Helper Components ---
 
@@ -473,7 +474,8 @@ export const ProfilePage: React.FC = () => {
                         label="CPF/CNPJ"
                         icon={FileText}
                         value={formData.cpf_cnpj_titular || ""}
-                        onChange={(e) => handleChange("cpf_cnpj_titular", e.target.value)}
+                        onChange={(e) => handleChange("cpf_cnpj_titular", formatCPFCNPJ(e.target.value))}
+                        maxLength={18}
                       />
                     </div>
                   </div>
@@ -495,7 +497,8 @@ export const ProfilePage: React.FC = () => {
                           label="WhatsApp"
                           icon={Phone}
                           value={formData.whatsapp || ""}
-                          onChange={(e) => handleChange("whatsapp", e.target.value)}
+                          onChange={(e) => handleChange("whatsapp", formatPhone(e.target.value))}
+                          maxLength={15}
                         />
                         
                         <div className="md:col-span-2 border-t pt-4 mt-2">

frontend/utils/masks.ts

@@ -0,0 +1,30 @@
+export const formatCPFCNPJ = (value: string) => {
+  const clean = value.replace(/\D/g, "");
+
+  if (clean.length <= 11) {
+    // CPF
+    return clean
+      .replace(/(\d{3})(\d)/, "$1.$2")
+      .replace(/(\d{3})(\d)/, "$1.$2")
+      .replace(/(\d{3})(\d{1,2})/, "$1-$2")
+      .replace(/(-\d{2})\d+?$/, "$1");
+  } else {
+    // CNPJ
+    return clean
+      .replace(/^(\d{2})(\d)/, "$1.$2")
+      .replace(/^(\d{2})\.(\d{3})(\d)/, "$1.$2.$3")
+      .replace(/\.(\d{3})(\d)/, ".$1/$2")
+      .replace(/(\d{4})(\d)/, "$1-$2")
+      .replace(/(-\d{2})\d+?$/, "$1");
+  }
+};
+
+export const formatPhone = (value: string) => {
+  const clean = value.replace(/\D/g, "");
+  
+  // (11) 99999-9999
+  return clean
+    .replace(/^(\d{2})(\d)/, "($1) $2")
+    .replace(/(\d{5})(\d)/, "$1-$2")
+    .replace(/(-\d{4})\d+?$/, "$1"); 
+};