Added optimizations for mobile

components/UniversProForm.tsx

@@ -20,6 +20,7 @@ interface UniversProFormProps {
 
 export default function UniversProForm({ contact, onClose }: UniversProFormProps) {
   const [loading, setLoading] = useState(false);
+  const [isMobile, setIsMobile] = useState(false);
   const [alertModal, setAlertModal] = useState<{
     show: boolean;
     type: 'success' | 'error' | 'info' | 'warning';
@@ -48,6 +49,17 @@ export default function UniversProForm({ contact, onClose }: UniversProFormProps
     }
   }, [contact]);
 
+  useEffect(() => {
+    const checkMobile = () => {
+      setIsMobile(window.innerWidth < 768); // md breakpoint
+    };
+    
+    checkMobile();
+    window.addEventListener('resize', checkMobile);
+    
+    return () => window.removeEventListener('resize', checkMobile);
+  }, []);
+
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
     setLoading(true);
@@ -88,6 +100,51 @@ export default function UniversProForm({ contact, onClose }: UniversProFormProps
     }
   };
 
+  // Si on est sur mobile, afficher un message au lieu du formulaire
+  if (isMobile) {
+    return (
+      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
+        <div className="bg-white rounded-lg p-6 max-w-md w-full mx-4">
+          <div className="flex justify-between items-start mb-6">
+            <div className="flex-1">
+              <h2 className="text-xl font-semibold text-gray-900 mb-2">
+                {contact ? 'Modifier le contact' : 'Nouveau contact'}
+              </h2>
+            </div>
+            <button
+              onClick={onClose}
+              className="text-gray-400 hover:text-gray-600 ml-4"
+            >
+              <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
+              </svg>
+            </button>
+          </div>
+          
+          <div className="text-center py-8">
+            <div className="mb-6">
+              <svg className="w-16 h-16 mx-auto text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+              </svg>
+            </div>
+            <h3 className="text-lg font-semibold text-gray-900 mb-3">
+              Utilisez un ordinateur
+            </h3>
+            <p className="text-sm text-gray-600 mb-6">
+              Pour {contact ? 'modifier' : 'créer'} un contact professionnel, veuillez utiliser un ordinateur. Cette fonctionnalité n'est pas optimisée pour les appareils mobiles.
+            </p>
+            <button
+              onClick={onClose}
+              className="px-6 py-2 bg-lblue text-white rounded-lg hover:bg-dblue transition-colors"
+            >
+              Fermer
+            </button>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
   return (
     <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
       <div className="bg-white rounded-lg p-6 max-w-2xl w-full mx-4 max-h-[90vh] overflow-y-auto">