@ollaid/native-sso 1.0.6 → 1.0.8

package/dist/index.js

@@ -125,8 +125,13 @@ function DialogContent({ children, className = "" }) {
     /* @__PURE__ */ jsx(
       "div",
       {
-        style: { position: "fixed", inset: 0, backgroundColor: "rgba(0,0,0,0.5)" },
-        onClick: () => onOpenChange(false)
+        style: {
+          position: "fixed",
+          inset: 0,
+          backgroundColor: "rgba(0,0,0,0.5)",
+          backdropFilter: "blur(4px)",
+          animation: "ollaid-overlay-in 0.25s ease-out"
+        }
       }
     ),
     /* @__PURE__ */ jsxs(
@@ -139,19 +144,21 @@ function DialogContent({ children, className = "" }) {
           width: "100%",
           maxWidth: "28rem",
           margin: "1rem",
-          padding: "1.5rem",
+          padding: "1rem",
           borderRadius: "0.75rem",
           backgroundColor: "white",
           boxShadow: "0 25px 50px -12px rgba(0,0,0,0.25)",
           maxHeight: "90vh",
-          overflowY: "auto"
+          display: "flex",
+          flexDirection: "column",
+          animation: "ollaid-modal-in 0.3s ease-out"
         },
         children: [
           /* @__PURE__ */ jsx(
             "button",
             {
               onClick: () => onOpenChange(false),
-              style: { position: "absolute", right: "1rem", top: "1rem", background: "none", border: "none", cursor: "pointer", fontSize: "1.25rem", color: "#9ca3af", lineHeight: 1 },
+              style: { position: "absolute", right: "0.75rem", top: "0.75rem", background: "none", border: "none", cursor: "pointer", fontSize: "1.25rem", color: "#9ca3af", lineHeight: 1, zIndex: 2 },
               "aria-label": "Close",
               children: "✕"
             }
@@ -162,8 +169,14 @@ function DialogContent({ children, className = "" }) {
     )
   ] });
 }
+function DialogBody({ children, className = "", style }) {
+  return /* @__PURE__ */ jsx("div", { className, style: { flex: 1, overflowY: "auto", paddingBottom: "0.5rem", minHeight: 0, ...style }, children });
+}
+function DialogFooter({ children, className = "", style }) {
+  return /* @__PURE__ */ jsx("div", { className, style: { flexShrink: 0, paddingTop: "0.75rem", borderTop: "1px solid #e5e7eb", display: "flex", flexDirection: "column", gap: "0.5rem", ...style }, children });
+}
 function DialogHeader({ children, className = "", style }) {
-  return /* @__PURE__ */ jsx("div", { className, style: { marginBottom: "0.5rem", ...style }, children });
+  return /* @__PURE__ */ jsx("div", { className, style: { marginBottom: "0.5rem", flexShrink: 0, ...style }, children });
 }
 function DialogTitle({ children, className = "" }) {
   return /* @__PURE__ */ jsx("h2", { className, style: { fontSize: "1.25rem", fontWeight: 600, color: "#111827" }, children });
@@ -263,7 +276,7 @@ if (typeof document !== "undefined") {
   if (!document.getElementById(styleId)) {
     const style = document.createElement("style");
     style.id = styleId;
-    style.textContent = `@keyframes spin { to { transform: rotate(360deg); } }`;
+    style.textContent = `@keyframes spin { to { transform: rotate(360deg); } } @keyframes ollaid-overlay-in { from { opacity: 0; } to { opacity: 1; } } @keyframes ollaid-modal-in { from { opacity: 0; transform: translateY(20px) scale(0.97); } to { opacity: 1; transform: translateY(0) scale(1); } }`;
     document.head.appendChild(style);
   }
 }
@@ -939,7 +952,8 @@ function getIAMHeaders() {
   }
   return {
     "Content-Type": "application/json",
-    "Accept": "application/json"
+    "Accept": "application/json",
+    "X-IAM-App-Key": creds.appKey
   };
 }
 const mobilePasswordService = {
@@ -1427,7 +1441,7 @@ function PasswordRecoveryModal({ open, onOpenChange, onSuccess, saasApiUrl, iamA
         /* @__PURE__ */ jsx(DialogTitle, { children: "Mot de passe modifié !" }),
         /* @__PURE__ */ jsx(DialogDescription, { children: "Votre mot de passe a été changé avec succès." })
       ] }),
-      /* @__PURE__ */ jsx(Button, { onClick: handleBackToLogin, style: { width: "100%", marginTop: "1rem" }, children: "Retour à la connexion" })
+      /* @__PURE__ */ jsx(DialogFooter, { style: { borderTop: "none" }, children: /* @__PURE__ */ jsx(Button, { onClick: handleBackToLogin, style: { width: "100%" }, children: "Retour à la connexion" }) })
     ] }) });
   }
   return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(DialogContent, { children: [
@@ -1447,49 +1461,35 @@ function PasswordRecoveryModal({ open, onOpenChange, onSuccess, saasApiUrl, iamA
         step === "password" && "Définissez votre nouveau mot de passe"
       ] })
     ] }),
-    /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+    /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
       error && /* @__PURE__ */ jsx("div", { style: { padding: "0.75rem", borderRadius: "0.375rem", backgroundColor: C$3.redBg, color: C$3.red, fontSize: "0.875rem" }, children: error }),
-      step === "email" && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "recovery-email", children: "Adresse email" }),
-          /* @__PURE__ */ jsx(Input, { id: "recovery-email", type: "email", placeholder: "vous@exemple.com", value: email, onChange: (e) => setEmail(e.target.value), disabled: pwLoading })
-        ] }),
-        /* @__PURE__ */ jsx(Button, { onClick: handleEmailSubmit, disabled: pwLoading, style: { width: "100%" }, children: pwLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
-          /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
-          " Vérification..."
-        ] }) : "Continuer" }),
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: handleBackToLogin, style: { width: "100%" }, children: "Retour à la connexion" })
+      step === "email" && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "recovery-email", children: "Adresse email" }),
+        /* @__PURE__ */ jsx(Input, { id: "recovery-email", type: "email", placeholder: "vous@exemple.com", value: email, onChange: (e) => setEmail(e.target.value), disabled: pwLoading })
       ] }),
-      step === "method-choice" && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(RadioGroup, { value: selectedMethod, onValueChange: (v) => setSelectedMethod(v), children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
-          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem", borderRadius: "0.5rem", border: `2px solid ${selectedMethod === "email" ? C$3.primary : C$3.gray200}`, cursor: "pointer" }, onClick: () => setSelectedMethod("email"), children: [
-            /* @__PURE__ */ jsx(RadioGroupItem, { value: "email", id: "method-email" }),
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("div", { style: { fontWeight: 500 }, children: "Par email" }),
-              /* @__PURE__ */ jsx("div", { style: { fontSize: "0.75rem", color: C$3.gray500 }, children: maskedEmail })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem", borderRadius: "0.5rem", border: `2px solid ${selectedMethod === "phone" ? C$3.primary : C$3.gray200}`, cursor: "pointer" }, onClick: () => setSelectedMethod("phone"), children: [
-            /* @__PURE__ */ jsx(RadioGroupItem, { value: "phone", id: "method-phone" }),
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("div", { style: { fontWeight: 500 }, children: "Par SMS" }),
-              /* @__PURE__ */ jsx("div", { style: { fontSize: "0.75rem", color: C$3.gray500 }, children: maskedPhone })
-            ] })
+      step === "method-choice" && /* @__PURE__ */ jsx(RadioGroup, { value: selectedMethod, onValueChange: (v) => setSelectedMethod(v), children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem", borderRadius: "0.5rem", border: `2px solid ${selectedMethod === "email" ? C$3.primary : C$3.gray200}`, cursor: "pointer" }, onClick: () => setSelectedMethod("email"), children: [
+          /* @__PURE__ */ jsx(RadioGroupItem, { value: "email", id: "method-email" }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("div", { style: { fontWeight: 500 }, children: "Par email" }),
+            /* @__PURE__ */ jsx("div", { style: { fontSize: "0.75rem", color: C$3.gray500 }, children: maskedEmail })
           ] })
-        ] }) }),
-        /* @__PURE__ */ jsx(Button, { onClick: handleMethodSubmit, disabled: pwLoading, style: { width: "100%" }, children: pwLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
-          /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
-          " Envoi..."
-        ] }) : "Envoyer le code" })
-      ] }),
+        ] }),
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem", borderRadius: "0.5rem", border: `2px solid ${selectedMethod === "phone" ? C$3.primary : C$3.gray200}`, cursor: "pointer" }, onClick: () => setSelectedMethod("phone"), children: [
+          /* @__PURE__ */ jsx(RadioGroupItem, { value: "phone", id: "method-phone" }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("div", { style: { fontWeight: 500 }, children: "Par SMS" }),
+            /* @__PURE__ */ jsx("div", { style: { fontSize: "0.75rem", color: C$3.gray500 }, children: maskedPhone })
+          ] })
+        ] })
+      ] }) }),
       step === "otp" && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx(OTPInput, { value: otp, onChange: setOtp, disabled: pwLoading }),
         /* @__PURE__ */ jsx("div", { style: { textAlign: "center", fontSize: "0.875rem" }, children: resendCooldown > 0 ? /* @__PURE__ */ jsxs("span", { style: { color: C$3.gray500 }, children: [
           "Renvoyer dans ",
           resendCooldown,
           "s"
-        ] }) : /* @__PURE__ */ jsx("button", { type: "button", style: { color: C$3.primary, background: "none", border: "none", cursor: "pointer", textDecoration: "underline" }, onClick: handleResendOTP, children: "Code non reçu ? Renvoyer" }) }),
-        /* @__PURE__ */ jsx(Button, { onClick: handleOTPSubmit, disabled: otp.length !== 6, style: { width: "100%" }, children: "Vérifier" })
+        ] }) : /* @__PURE__ */ jsx("button", { type: "button", style: { color: C$3.primary, background: "none", border: "none", cursor: "pointer", textDecoration: "underline" }, onClick: handleResendOTP, children: "Code non reçu ? Renvoyer" }) })
       ] }),
       step === "password" && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs("div", { children: [
@@ -1499,12 +1499,26 @@ function PasswordRecoveryModal({ open, onOpenChange, onSuccess, saasApiUrl, iamA
         /* @__PURE__ */ jsxs("div", { children: [
           /* @__PURE__ */ jsx(Label, { children: "Confirmer le mot de passe" }),
           /* @__PURE__ */ jsx(Input, { type: "password", placeholder: "Retapez votre mot de passe", value: confirmPassword, onChange: (e) => setConfirmPassword(e.target.value), disabled: pwLoading })
-        ] }),
-        /* @__PURE__ */ jsx(Button, { onClick: handlePasswordSubmit, disabled: pwLoading || !password || !confirmPassword, style: { width: "100%" }, children: pwLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
-          /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
-          " Modification..."
-        ] }) : "Modifier le mot de passe" })
+        ] })
       ] })
+    ] }) }),
+    /* @__PURE__ */ jsxs(DialogFooter, { children: [
+      step === "email" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Button, { onClick: handleEmailSubmit, disabled: pwLoading, style: { width: "100%" }, children: pwLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+          /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
+          " Vérification..."
+        ] }) : "Continuer" }),
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: handleBackToLogin, style: { width: "100%" }, children: "Retour à la connexion" })
+      ] }),
+      step === "method-choice" && /* @__PURE__ */ jsx(Button, { onClick: handleMethodSubmit, disabled: pwLoading, style: { width: "100%" }, children: pwLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+        /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
+        " Envoi..."
+      ] }) : "Envoyer le code" }),
+      step === "otp" && /* @__PURE__ */ jsx(Button, { onClick: handleOTPSubmit, disabled: otp.length !== 6, style: { width: "100%" }, children: "Vérifier" }),
+      step === "password" && /* @__PURE__ */ jsx(Button, { onClick: handlePasswordSubmit, disabled: pwLoading || !password || !confirmPassword, style: { width: "100%" }, children: pwLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+        /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
+        " Modification..."
+      ] }) : "Modifier le mot de passe" })
     ] })
   ] }) });
 }
@@ -1871,7 +1885,7 @@ function useNativeAuth(options) {
         await nativeAuthService.loadCredentials();
       }
       const response = await nativeAuthService.loginAccessOtp(otpCode);
-      if (response.success && response.needs_access && response.process_token) {
+      if ((response.needs_access || response.status === "needs_access") && response.process_token) {
         setState((prev) => ({
           ...prev,
           processToken: response.process_token,
@@ -2339,7 +2353,8 @@ function LoginModal({
   iamApiUrl,
   loading,
   showSwitchToSignup = true,
-  defaultAccountType
+  defaultAccountType,
+  initialPhone
 }) {
   const {
     status,
@@ -2418,6 +2433,12 @@ function LoginModal({
   useEffect(() => {
     if (!open) resetState();
   }, [open]);
+  useEffect(() => {
+    if (open && initialPhone) {
+      setStep("phone-input");
+      setPhone(initialPhone);
+    }
+  }, [open, initialPhone]);
   const exchangeCallbackToken = async (callbackToken) => {
     try {
       const response = await nativeAuthService.exchange(callbackToken);
@@ -2574,23 +2595,25 @@ function LoginModal({
           "."
         ] })
       ] }),
-      /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem" }, children: [
-        /* @__PURE__ */ jsxs("div", { style: { padding: "1rem", backgroundColor: C$2.gray100, borderRadius: "0.5rem", marginBottom: "1rem", fontSize: "0.875rem", color: C$2.gray500 }, children: [
+      /* @__PURE__ */ jsxs(DialogBody, { children: [
+        /* @__PURE__ */ jsxs("div", { style: { padding: "1rem", backgroundColor: C$2.gray100, borderRadius: "0.5rem", fontSize: "0.875rem", color: C$2.gray500 }, children: [
           "Votre compte ",
           /* @__PURE__ */ jsx("strong", { style: { color: C$2.primary }, children: "iam.ollaid.com" }),
           " existe déjà. Cliquez sur Confirmer pour créer votre accès à ",
           /* @__PURE__ */ jsx("strong", { style: { color: C$2.gray900 }, children: application.name }),
           "."
         ] }),
-        renderError(),
-        /* @__PURE__ */ jsx(Button, { onClick: handleGrantAccess, disabled: isSubmitting, style: { width: "100%", marginTop: "0.75rem" }, children: isSubmitting ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+        renderError()
+      ] }),
+      /* @__PURE__ */ jsxs(DialogFooter, { children: [
+        /* @__PURE__ */ jsx(Button, { onClick: handleGrantAccess, disabled: isSubmitting, style: { width: "100%" }, children: isSubmitting ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
           /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
           "Création en cours..."
         ] }) : "Confirmer la création de mon compte" }),
         /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => {
           resetAuth();
           setStep("choice");
-        }, disabled: isSubmitting, style: { width: "100%", marginTop: "0.5rem" }, children: "Annuler" })
+        }, disabled: isSubmitting, style: { width: "100%" }, children: "Annuler" })
       ] })
     ] }) : alternativeMethod ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
@@ -2598,21 +2621,21 @@ function LoginModal({
         /* @__PURE__ */ jsx(DialogTitle, { children: "Moyen de connexion désactivé" }),
         /* @__PURE__ */ jsx(DialogDescription, { children: "Vos identifiants sont corrects, mais vous avez désactivé ce moyen de connexion depuis votre compte IAM." })
       ] }),
-      /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem" }, children: [
-        alternativeMethod.value && /* @__PURE__ */ jsxs("div", { style: { padding: "1rem", backgroundColor: C$2.gray100, borderRadius: "0.5rem", marginBottom: "1rem" }, children: [
-          /* @__PURE__ */ jsx("p", { style: { fontSize: "0.875rem", color: C$2.gray500, marginBottom: "0.75rem" }, children: "Vous pouvez vous connecter avec :" }),
-          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem", fontSize: "0.875rem", fontWeight: 500, color: C$2.gray900 }, children: [
-            alternativeMethod.type === "phone" ? /* @__PURE__ */ jsx(IconPhone, { style: { width: "1rem", height: "1rem", color: C$2.primary } }) : /* @__PURE__ */ jsx(IconMail, { style: { width: "1rem", height: "1rem", color: C$2.primary } }),
-            /* @__PURE__ */ jsx("span", { children: alternativeMethod.value })
-          ] })
-        ] }),
+      /* @__PURE__ */ jsx(DialogBody, { children: alternativeMethod.value && /* @__PURE__ */ jsxs("div", { style: { padding: "1rem", backgroundColor: C$2.gray100, borderRadius: "0.5rem" }, children: [
+        /* @__PURE__ */ jsx("p", { style: { fontSize: "0.875rem", color: C$2.gray500, marginBottom: "0.75rem" }, children: "Vous pouvez vous connecter avec :" }),
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem", fontSize: "0.875rem", fontWeight: 500, color: C$2.gray900 }, children: [
+          alternativeMethod.type === "phone" ? /* @__PURE__ */ jsx(IconPhone, { style: { width: "1rem", height: "1rem", color: C$2.primary } }) : /* @__PURE__ */ jsx(IconMail, { style: { width: "1rem", height: "1rem", color: C$2.primary } }),
+          /* @__PURE__ */ jsx("span", { children: alternativeMethod.value })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs(DialogFooter, { children: [
         /* @__PURE__ */ jsx(Button, { onClick: () => {
           if (alternativeMethod.type === "phone") setStep("phone-input");
           else setStep("email-check");
           resetAuth();
         }, style: { width: "100%" }, children: alternativeMethod.type === "phone" ? "Se connecter par téléphone" : "Se connecter par email" }),
-        /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => window.open("https://iam.ollaid.com", "_blank"), style: { width: "100%", marginTop: "0.5rem" }, children: "Réactiver depuis iam.ollaid.com" }),
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: () => onOpenChange(false), style: { width: "100%", marginTop: "0.5rem" }, children: "Annuler" })
+        /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => window.open("https://iam.ollaid.com", "_blank"), style: { width: "100%" }, children: "Réactiver depuis iam.ollaid.com" }),
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: () => onOpenChange(false), style: { width: "100%" }, children: "Annuler" })
       ] })
     ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
       step !== "choice" && renderBackBtn(),
@@ -2622,7 +2645,7 @@ function LoginModal({
           /* @__PURE__ */ jsx(DialogTitle, { children: "Connexion" }),
           /* @__PURE__ */ jsx(DialogDescription, { children: "Choisissez votre méthode de connexion" })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
           renderError(),
           /* @__PURE__ */ jsxs(Button, { variant: "outline", onClick: () => setStep("email-check"), style: methodBtnStyle, children: [
             /* @__PURE__ */ jsx("div", { style: methodIconStyle(C$2.accent), children: /* @__PURE__ */ jsx(IconMail, { style: { width: "1.25rem", height: "1.25rem", color: C$2.white } }) }),
@@ -2657,7 +2680,7 @@ function LoginModal({
             /* @__PURE__ */ jsx("span", { style: { color: C$2.gray500 }, children: "Pas encore de compte ? " }),
             /* @__PURE__ */ jsx("button", { type: "button", style: linkStyle$1, onClick: onSwitchToSignup, children: "Inscrivez-vous" })
           ] })
-        ] })
+        ] }) })
       ] }),
       step === "email-check" && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
@@ -2665,7 +2688,7 @@ function LoginModal({
           /* @__PURE__ */ jsx(DialogTitle, { children: "Connexion par email" }),
           /* @__PURE__ */ jsx(DialogDescription, { children: "Entrez votre adresse email" })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
           renderError(),
           /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.25rem" }, children: [
             /* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "Adresse email" }),
@@ -2687,7 +2710,9 @@ function LoginModal({
               }
             )
           ] }),
-          /* @__PURE__ */ jsx("div", { style: { textAlign: "right" }, children: /* @__PURE__ */ jsx("button", { type: "button", style: { ...linkStyle$1, fontSize: "0.75rem" }, onClick: () => setShowPasswordRecovery(true), children: "Mot de passe oublié ?" }) }),
+          /* @__PURE__ */ jsx("div", { style: { textAlign: "right" }, children: /* @__PURE__ */ jsx("button", { type: "button", style: { ...linkStyle$1, fontSize: "0.75rem" }, onClick: () => setShowPasswordRecovery(true), children: "Mot de passe oublié ?" }) })
+        ] }) }),
+        /* @__PURE__ */ jsxs(DialogFooter, { children: [
           renderLoaderBtn("Continuer", "Vérification...", handleEmailCheck, !email.trim()),
           showSwitchToSignup && /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", fontSize: "0.875rem" }, children: [
             /* @__PURE__ */ jsx("span", { style: { color: C$2.gray500 }, children: "Pas encore de compte ? " }),
@@ -2705,41 +2730,43 @@ function LoginModal({
           ] }),
           /* @__PURE__ */ jsx(DialogDescription, { children: email })
         ] }),
-        /* @__PURE__ */ jsxs("form", { onSubmit: handleEmailPasswordSubmit, style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
-          renderError(),
-          /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.25rem" }, children: [
-            /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
-              /* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Mot de passe" }),
-              /* @__PURE__ */ jsx("button", { type: "button", style: { ...linkStyle$1, fontSize: "0.75rem" }, onClick: () => setShowPasswordRecovery(true), children: "Mot de passe oublié ?" })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
-              /* @__PURE__ */ jsx(
-                Input,
-                {
-                  id: "password",
-                  type: showPassword ? "text" : "password",
-                  placeholder: "••••••••",
-                  value: password,
-                  onChange: (e) => setPassword(e.target.value),
-                  disabled: isSubmitting,
-                  style: { paddingRight: "2.5rem" }
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => setShowPassword(!showPassword),
-                  style: { position: "absolute", right: 0, top: 0, height: "100%", padding: "0 0.75rem", background: "none", border: "none", cursor: "pointer" },
-                  children: showPassword ? /* @__PURE__ */ jsx(IconEyeOff, { style: { width: "1rem", height: "1rem", color: C$2.gray500 } }) : /* @__PURE__ */ jsx(IconEye, { style: { width: "1rem", height: "1rem", color: C$2.gray500 } })
-                }
-              )
+        /* @__PURE__ */ jsxs("form", { onSubmit: handleEmailPasswordSubmit, style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: [
+          /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+            renderError(),
+            /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.25rem" }, children: [
+              /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
+                /* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Mot de passe" }),
+                /* @__PURE__ */ jsx("button", { type: "button", style: { ...linkStyle$1, fontSize: "0.75rem" }, onClick: () => setShowPasswordRecovery(true), children: "Mot de passe oublié ?" })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: "password",
+                    type: showPassword ? "text" : "password",
+                    placeholder: "••••••••",
+                    value: password,
+                    onChange: (e) => setPassword(e.target.value),
+                    disabled: isSubmitting,
+                    style: { paddingRight: "2.5rem" }
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setShowPassword(!showPassword),
+                    style: { position: "absolute", right: 0, top: 0, height: "100%", padding: "0 0.75rem", background: "none", border: "none", cursor: "pointer" },
+                    children: showPassword ? /* @__PURE__ */ jsx(IconEyeOff, { style: { width: "1rem", height: "1rem", color: C$2.gray500 } }) : /* @__PURE__ */ jsx(IconEye, { style: { width: "1rem", height: "1rem", color: C$2.gray500 } })
+                  }
+                )
+              ] })
             ] })
-          ] }),
-          /* @__PURE__ */ jsx(Button, { type: "submit", disabled: isSubmitting || !password, style: { width: "100%" }, children: isSubmitting ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+          ] }) }),
+          /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsx(Button, { type: "submit", disabled: isSubmitting || !password, style: { width: "100%" }, children: isSubmitting ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
             /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
             "Connexion..."
-          ] }) : "Se connecter" })
+          ] }) : "Se connecter" }) })
         ] })
       ] }),
       step === "email-otp" && /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -2752,12 +2779,12 @@ function LoginModal({
             /* @__PURE__ */ jsx("strong", { style: { color: C$2.gray900 }, children: email })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
           renderError(),
           /* @__PURE__ */ jsx(OTPInput, { value: emailOtpCode, onChange: setEmailOtpCode, disabled: isSubmitting }),
-          renderResendLink(),
-          renderLoaderBtn("Vérifier", "Vérification...", handleEmailOtpVerify, emailOtpCode.length !== 6)
-        ] })
+          renderResendLink()
+        ] }) }),
+        /* @__PURE__ */ jsx(DialogFooter, { children: renderLoaderBtn("Vérifier", "Vérification...", handleEmailOtpVerify, emailOtpCode.length !== 6) })
       ] }),
       step === "phone-input" && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
@@ -2765,7 +2792,7 @@ function LoginModal({
           /* @__PURE__ */ jsx(DialogTitle, { children: "Connexion par téléphone" }),
           /* @__PURE__ */ jsx(DialogDescription, { children: "Entrez votre numéro pour recevoir un code SMS" })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
           renderError(),
           /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.25rem" }, children: [
             /* @__PURE__ */ jsx(Label, { children: "Indicatif" }),
@@ -2802,7 +2829,9 @@ function LoginModal({
               phone.replace(/\D/g, "").length,
               "/9)"
             ] })
-          ] }),
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsxs(DialogFooter, { children: [
           renderLoaderBtn("Recevoir le code SMS", "Envoi en cours...", handlePhoneInit, phone.replace(/\D/g, "").length !== 9),
           showSwitchToSignup && /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", fontSize: "0.875rem" }, children: [
             /* @__PURE__ */ jsx("span", { style: { color: C$2.gray500 }, children: "Pas encore de compte ? " }),
@@ -2825,12 +2854,12 @@ function LoginModal({
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
           renderError(),
           /* @__PURE__ */ jsx(OTPInput, { value: phoneOtpCode, onChange: setPhoneOtpCode, disabled: isSubmitting }),
-          renderResendLink(),
-          renderLoaderBtn("Se connecter", "Vérification...", handlePhoneVerify, phoneOtpCode.length !== 6)
-        ] })
+          renderResendLink()
+        ] }) }),
+        /* @__PURE__ */ jsx(DialogFooter, { children: renderLoaderBtn("Se connecter", "Vérification...", handlePhoneVerify, phoneOtpCode.length !== 6) })
       ] }),
       step === "access-otp" && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
@@ -2838,7 +2867,7 @@ function LoginModal({
           /* @__PURE__ */ jsx(DialogTitle, { children: "Code d'accès" }),
           /* @__PURE__ */ jsx(DialogDescription, { children: "Entrez le code d'accès à 8 chiffres" })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
           renderError(),
           /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.25rem" }, children: [
             /* @__PURE__ */ jsx(Label, { children: "Code d'accès (8 chiffres)" }),
@@ -2855,9 +2884,9 @@ function LoginModal({
                 maxLength: 8
               }
             )
-          ] }),
-          renderLoaderBtn("Se connecter", "Vérification...", handleAccessOtpSubmit, accessOtpCode.length !== 8)
-        ] })
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsx(DialogFooter, { children: renderLoaderBtn("Se connecter", "Vérification...", handleAccessOtpSubmit, accessOtpCode.length !== 8) })
       ] })
     ] }) }) }),
     /* @__PURE__ */ jsx(
@@ -2872,25 +2901,220 @@ function LoginModal({
     )
   ] });
 }
-const SUPPORTED_COUNTRIES = [
-  { code: "+221", name: "Sénégal", flag: "🇸🇳", digits: 9 },
-  { code: "+229", name: "Bénin", flag: "🇧🇯", digits: 8 },
-  { code: "+225", name: "Côte d'Ivoire", flag: "🇨🇮", digits: 10 },
-  { code: "+228", name: "Togo", flag: "🇹🇬", digits: 8 },
-  { code: "+237", name: "Cameroun", flag: "🇨🇲", digits: 9 },
-  { code: "+33", name: "France", flag: "🇫🇷", digits: 9 }
+const COUNTRIES = [
+  // ── Afrique de l'Ouest (prioritaires) ──
+  { code: "SN", name: "Sénégal", dialCode: "+221", flag: "🇸🇳", digits: 9 },
+  { code: "CI", name: "Côte d'Ivoire", dialCode: "+225", flag: "🇨🇮", digits: 10 },
+  { code: "ML", name: "Mali", dialCode: "+223", flag: "🇲🇱", digits: 8 },
+  { code: "BF", name: "Burkina Faso", dialCode: "+226", flag: "🇧🇫", digits: 8 },
+  { code: "GN", name: "Guinée", dialCode: "+224", flag: "🇬🇳", digits: 9 },
+  { code: "TG", name: "Togo", dialCode: "+228", flag: "🇹🇬", digits: 8 },
+  { code: "BJ", name: "Bénin", dialCode: "+229", flag: "🇧🇯", digits: 8 },
+  { code: "NE", name: "Niger", dialCode: "+227", flag: "🇳🇪", digits: 8 },
+  { code: "MR", name: "Mauritanie", dialCode: "+222", flag: "🇲🇷", digits: 8 },
+  { code: "GW", name: "Guinée-Bissau", dialCode: "+245", flag: "🇬🇼", digits: 7 },
+  { code: "GM", name: "Gambie", dialCode: "+220", flag: "🇬🇲", digits: 7 },
+  { code: "CV", name: "Cap-Vert", dialCode: "+238", flag: "🇨🇻", digits: 7 },
+  { code: "SL", name: "Sierra Leone", dialCode: "+232", flag: "🇸🇱", digits: 8 },
+  { code: "LR", name: "Liberia", dialCode: "+231", flag: "🇱🇷", digits: 7 },
+  { code: "GH", name: "Ghana", dialCode: "+233", flag: "🇬🇭", digits: 9 },
+  { code: "NG", name: "Nigeria", dialCode: "+234", flag: "🇳🇬", digits: 10 },
+  // ── Afrique Centrale ──
+  { code: "CM", name: "Cameroun", dialCode: "+237", flag: "🇨🇲", digits: 9 },
+  { code: "GA", name: "Gabon", dialCode: "+241", flag: "🇬🇦", digits: 7 },
+  { code: "CG", name: "Congo", dialCode: "+242", flag: "🇨🇬", digits: 9 },
+  { code: "CD", name: "RD Congo", dialCode: "+243", flag: "🇨🇩", digits: 9 },
+  { code: "TD", name: "Tchad", dialCode: "+235", flag: "🇹🇩", digits: 8 },
+  { code: "CF", name: "Centrafrique", dialCode: "+236", flag: "🇨🇫", digits: 8 },
+  { code: "GQ", name: "Guinée équatoriale", dialCode: "+240", flag: "🇬🇶", digits: 9 },
+  { code: "ST", name: "São Tomé-et-Príncipe", dialCode: "+239", flag: "🇸🇹", digits: 7 },
+  { code: "BI", name: "Burundi", dialCode: "+257", flag: "🇧🇮", digits: 8 },
+  { code: "RW", name: "Rwanda", dialCode: "+250", flag: "🇷🇼", digits: 9 },
+  // ── Afrique de l'Est ──
+  { code: "KE", name: "Kenya", dialCode: "+254", flag: "🇰🇪", digits: 9 },
+  { code: "TZ", name: "Tanzanie", dialCode: "+255", flag: "🇹🇿", digits: 9 },
+  { code: "UG", name: "Ouganda", dialCode: "+256", flag: "🇺🇬", digits: 9 },
+  { code: "ET", name: "Éthiopie", dialCode: "+251", flag: "🇪🇹", digits: 9 },
+  { code: "SO", name: "Somalie", dialCode: "+252", flag: "🇸🇴", digits: 8 },
+  { code: "DJ", name: "Djibouti", dialCode: "+253", flag: "🇩🇯", digits: 8 },
+  { code: "ER", name: "Érythrée", dialCode: "+291", flag: "🇪🇷", digits: 7 },
+  { code: "SS", name: "Soudan du Sud", dialCode: "+211", flag: "🇸🇸", digits: 9 },
+  { code: "MG", name: "Madagascar", dialCode: "+261", flag: "🇲🇬", digits: 9 },
+  { code: "MU", name: "Maurice", dialCode: "+230", flag: "🇲🇺", digits: 8 },
+  { code: "SC", name: "Seychelles", dialCode: "+248", flag: "🇸🇨", digits: 7 },
+  { code: "KM", name: "Comores", dialCode: "+269", flag: "🇰🇲", digits: 7 },
+  // ── Afrique Australe ──
+  { code: "ZA", name: "Afrique du Sud", dialCode: "+27", flag: "🇿🇦", digits: 9 },
+  { code: "MZ", name: "Mozambique", dialCode: "+258", flag: "🇲🇿", digits: 9 },
+  { code: "ZW", name: "Zimbabwe", dialCode: "+263", flag: "🇿🇼", digits: 9 },
+  { code: "ZM", name: "Zambie", dialCode: "+260", flag: "🇿🇲", digits: 9 },
+  { code: "MW", name: "Malawi", dialCode: "+265", flag: "🇲🇼", digits: 9 },
+  { code: "BW", name: "Botswana", dialCode: "+267", flag: "🇧🇼", digits: 8 },
+  { code: "NA", name: "Namibie", dialCode: "+264", flag: "🇳🇦", digits: 9 },
+  { code: "AO", name: "Angola", dialCode: "+244", flag: "🇦🇴", digits: 9 },
+  { code: "SZ", name: "Eswatini", dialCode: "+268", flag: "🇸🇿", digits: 8 },
+  { code: "LS", name: "Lesotho", dialCode: "+266", flag: "🇱🇸", digits: 8 },
+  // ── Afrique du Nord ──
+  { code: "MA", name: "Maroc", dialCode: "+212", flag: "🇲🇦", digits: 9 },
+  { code: "DZ", name: "Algérie", dialCode: "+213", flag: "🇩🇿", digits: 9 },
+  { code: "TN", name: "Tunisie", dialCode: "+216", flag: "🇹🇳", digits: 8 },
+  { code: "LY", name: "Libye", dialCode: "+218", flag: "🇱🇾", digits: 9 },
+  { code: "EG", name: "Égypte", dialCode: "+20", flag: "🇪🇬", digits: 10 },
+  { code: "SD", name: "Soudan", dialCode: "+249", flag: "🇸🇩", digits: 9 },
+  // ── Europe ──
+  { code: "FR", name: "France", dialCode: "+33", flag: "🇫🇷", digits: 9 },
+  { code: "BE", name: "Belgique", dialCode: "+32", flag: "🇧🇪", digits: 9 },
+  { code: "CH", name: "Suisse", dialCode: "+41", flag: "🇨🇭", digits: 9 },
+  { code: "DE", name: "Allemagne", dialCode: "+49", flag: "🇩🇪", digits: 10 },
+  { code: "GB", name: "Royaume-Uni", dialCode: "+44", flag: "🇬🇧", digits: 10 },
+  { code: "ES", name: "Espagne", dialCode: "+34", flag: "🇪🇸", digits: 9 },
+  { code: "IT", name: "Italie", dialCode: "+39", flag: "🇮🇹", digits: 10 },
+  { code: "PT", name: "Portugal", dialCode: "+351", flag: "🇵🇹", digits: 9 },
+  { code: "NL", name: "Pays-Bas", dialCode: "+31", flag: "🇳🇱", digits: 9 },
+  { code: "SE", name: "Suède", dialCode: "+46", flag: "🇸🇪", digits: 9 },
+  { code: "NO", name: "Norvège", dialCode: "+47", flag: "🇳🇴", digits: 8 },
+  { code: "DK", name: "Danemark", dialCode: "+45", flag: "🇩🇰", digits: 8 },
+  { code: "FI", name: "Finlande", dialCode: "+358", flag: "🇫🇮", digits: 10 },
+  { code: "PL", name: "Pologne", dialCode: "+48", flag: "🇵🇱", digits: 9 },
+  { code: "AT", name: "Autriche", dialCode: "+43", flag: "🇦🇹", digits: 10 },
+  { code: "IE", name: "Irlande", dialCode: "+353", flag: "🇮🇪", digits: 9 },
+  { code: "GR", name: "Grèce", dialCode: "+30", flag: "🇬🇷", digits: 10 },
+  { code: "CZ", name: "Tchéquie", dialCode: "+420", flag: "🇨🇿", digits: 9 },
+  { code: "RO", name: "Roumanie", dialCode: "+40", flag: "🇷🇴", digits: 9 },
+  { code: "HU", name: "Hongrie", dialCode: "+36", flag: "🇭🇺", digits: 9 },
+  { code: "BG", name: "Bulgarie", dialCode: "+359", flag: "🇧🇬", digits: 9 },
+  { code: "HR", name: "Croatie", dialCode: "+385", flag: "🇭🇷", digits: 9 },
+  { code: "SK", name: "Slovaquie", dialCode: "+421", flag: "🇸🇰", digits: 9 },
+  { code: "SI", name: "Slovénie", dialCode: "+386", flag: "🇸🇮", digits: 8 },
+  { code: "RS", name: "Serbie", dialCode: "+381", flag: "🇷🇸", digits: 9 },
+  { code: "UA", name: "Ukraine", dialCode: "+380", flag: "🇺🇦", digits: 9 },
+  { code: "RU", name: "Russie", dialCode: "+7", flag: "🇷🇺", digits: 10 },
+  { code: "TR", name: "Turquie", dialCode: "+90", flag: "🇹🇷", digits: 10 },
+  { code: "LU", name: "Luxembourg", dialCode: "+352", flag: "🇱🇺", digits: 9 },
+  { code: "MC", name: "Monaco", dialCode: "+377", flag: "🇲🇨", digits: 8 },
+  { code: "IS", name: "Islande", dialCode: "+354", flag: "🇮🇸", digits: 7 },
+  { code: "AL", name: "Albanie", dialCode: "+355", flag: "🇦🇱", digits: 9 },
+  { code: "ME", name: "Monténégro", dialCode: "+382", flag: "🇲🇪", digits: 8 },
+  { code: "MK", name: "Macédoine du Nord", dialCode: "+389", flag: "🇲🇰", digits: 8 },
+  { code: "BA", name: "Bosnie-Herzégovine", dialCode: "+387", flag: "🇧🇦", digits: 8 },
+  { code: "LT", name: "Lituanie", dialCode: "+370", flag: "🇱🇹", digits: 8 },
+  { code: "LV", name: "Lettonie", dialCode: "+371", flag: "🇱🇻", digits: 8 },
+  { code: "EE", name: "Estonie", dialCode: "+372", flag: "🇪🇪", digits: 8 },
+  { code: "MT", name: "Malte", dialCode: "+356", flag: "🇲🇹", digits: 8 },
+  { code: "CY", name: "Chypre", dialCode: "+357", flag: "🇨🇾", digits: 8 },
+  { code: "MD", name: "Moldavie", dialCode: "+373", flag: "🇲🇩", digits: 8 },
+  { code: "GE", name: "Géorgie", dialCode: "+995", flag: "🇬🇪", digits: 9 },
+  { code: "AM", name: "Arménie", dialCode: "+374", flag: "🇦🇲", digits: 8 },
+  { code: "AZ", name: "Azerbaïdjan", dialCode: "+994", flag: "🇦🇿", digits: 9 },
+  { code: "BY", name: "Biélorussie", dialCode: "+375", flag: "🇧🇾", digits: 9 },
+  // ── Amérique du Nord ──
+  { code: "US", name: "États-Unis", dialCode: "+1", flag: "🇺🇸", digits: 10 },
+  { code: "CA", name: "Canada", dialCode: "+1", flag: "🇨🇦", digits: 10 },
+  { code: "MX", name: "Mexique", dialCode: "+52", flag: "🇲🇽", digits: 10 },
+  // ── Amérique Centrale & Caraïbes ──
+  { code: "HT", name: "Haïti", dialCode: "+509", flag: "🇭🇹", digits: 8 },
+  { code: "DO", name: "République dominicaine", dialCode: "+1809", flag: "🇩🇴", digits: 10 },
+  { code: "CU", name: "Cuba", dialCode: "+53", flag: "🇨🇺", digits: 8 },
+  { code: "JM", name: "Jamaïque", dialCode: "+1876", flag: "🇯🇲", digits: 7 },
+  { code: "GT", name: "Guatemala", dialCode: "+502", flag: "🇬🇹", digits: 8 },
+  { code: "HN", name: "Honduras", dialCode: "+504", flag: "🇭🇳", digits: 8 },
+  { code: "SV", name: "El Salvador", dialCode: "+503", flag: "🇸🇻", digits: 8 },
+  { code: "NI", name: "Nicaragua", dialCode: "+505", flag: "🇳🇮", digits: 8 },
+  { code: "CR", name: "Costa Rica", dialCode: "+506", flag: "🇨🇷", digits: 8 },
+  { code: "PA", name: "Panama", dialCode: "+507", flag: "🇵🇦", digits: 8 },
+  { code: "TT", name: "Trinité-et-Tobago", dialCode: "+1868", flag: "🇹🇹", digits: 7 },
+  // ── Amérique du Sud ──
+  { code: "BR", name: "Brésil", dialCode: "+55", flag: "🇧🇷", digits: 11 },
+  { code: "AR", name: "Argentine", dialCode: "+54", flag: "🇦🇷", digits: 10 },
+  { code: "CO", name: "Colombie", dialCode: "+57", flag: "🇨🇴", digits: 10 },
+  { code: "CL", name: "Chili", dialCode: "+56", flag: "🇨🇱", digits: 9 },
+  { code: "PE", name: "Pérou", dialCode: "+51", flag: "🇵🇪", digits: 9 },
+  { code: "VE", name: "Venezuela", dialCode: "+58", flag: "🇻🇪", digits: 10 },
+  { code: "EC", name: "Équateur", dialCode: "+593", flag: "🇪🇨", digits: 9 },
+  { code: "BO", name: "Bolivie", dialCode: "+591", flag: "🇧🇴", digits: 8 },
+  { code: "PY", name: "Paraguay", dialCode: "+595", flag: "🇵🇾", digits: 9 },
+  { code: "UY", name: "Uruguay", dialCode: "+598", flag: "🇺🇾", digits: 8 },
+  { code: "GY", name: "Guyana", dialCode: "+592", flag: "🇬🇾", digits: 7 },
+  { code: "SR", name: "Suriname", dialCode: "+597", flag: "🇸🇷", digits: 7 },
+  // ── Moyen-Orient ──
+  { code: "AE", name: "Émirats arabes unis", dialCode: "+971", flag: "🇦🇪", digits: 9 },
+  { code: "SA", name: "Arabie saoudite", dialCode: "+966", flag: "🇸🇦", digits: 9 },
+  { code: "QA", name: "Qatar", dialCode: "+974", flag: "🇶🇦", digits: 8 },
+  { code: "KW", name: "Koweït", dialCode: "+965", flag: "🇰🇼", digits: 8 },
+  { code: "BH", name: "Bahreïn", dialCode: "+973", flag: "🇧🇭", digits: 8 },
+  { code: "OM", name: "Oman", dialCode: "+968", flag: "🇴🇲", digits: 8 },
+  { code: "JO", name: "Jordanie", dialCode: "+962", flag: "🇯🇴", digits: 9 },
+  { code: "LB", name: "Liban", dialCode: "+961", flag: "🇱🇧", digits: 8 },
+  { code: "IQ", name: "Irak", dialCode: "+964", flag: "🇮🇶", digits: 10 },
+  { code: "IR", name: "Iran", dialCode: "+98", flag: "🇮🇷", digits: 10 },
+  { code: "IL", name: "Israël", dialCode: "+972", flag: "🇮🇱", digits: 9 },
+  { code: "PS", name: "Palestine", dialCode: "+970", flag: "🇵🇸", digits: 9 },
+  { code: "YE", name: "Yémen", dialCode: "+967", flag: "🇾🇪", digits: 9 },
+  { code: "SY", name: "Syrie", dialCode: "+963", flag: "🇸🇾", digits: 9 },
+  // ── Asie ──
+  { code: "CN", name: "Chine", dialCode: "+86", flag: "🇨🇳", digits: 11 },
+  { code: "JP", name: "Japon", dialCode: "+81", flag: "🇯🇵", digits: 10 },
+  { code: "KR", name: "Corée du Sud", dialCode: "+82", flag: "🇰🇷", digits: 10 },
+  { code: "IN", name: "Inde", dialCode: "+91", flag: "🇮🇳", digits: 10 },
+  { code: "PK", name: "Pakistan", dialCode: "+92", flag: "🇵🇰", digits: 10 },
+  { code: "BD", name: "Bangladesh", dialCode: "+880", flag: "🇧🇩", digits: 10 },
+  { code: "ID", name: "Indonésie", dialCode: "+62", flag: "🇮🇩", digits: 10 },
+  { code: "MY", name: "Malaisie", dialCode: "+60", flag: "🇲🇾", digits: 10 },
+  { code: "PH", name: "Philippines", dialCode: "+63", flag: "🇵🇭", digits: 10 },
+  { code: "TH", name: "Thaïlande", dialCode: "+66", flag: "🇹🇭", digits: 9 },
+  { code: "VN", name: "Vietnam", dialCode: "+84", flag: "🇻🇳", digits: 9 },
+  { code: "SG", name: "Singapour", dialCode: "+65", flag: "🇸🇬", digits: 8 },
+  { code: "HK", name: "Hong Kong", dialCode: "+852", flag: "🇭🇰", digits: 8 },
+  { code: "TW", name: "Taïwan", dialCode: "+886", flag: "🇹🇼", digits: 9 },
+  { code: "MM", name: "Myanmar", dialCode: "+95", flag: "🇲🇲", digits: 9 },
+  { code: "KH", name: "Cambodge", dialCode: "+855", flag: "🇰🇭", digits: 9 },
+  { code: "LA", name: "Laos", dialCode: "+856", flag: "🇱🇦", digits: 10 },
+  { code: "NP", name: "Népal", dialCode: "+977", flag: "🇳🇵", digits: 10 },
+  { code: "LK", name: "Sri Lanka", dialCode: "+94", flag: "🇱🇰", digits: 9 },
+  { code: "AF", name: "Afghanistan", dialCode: "+93", flag: "🇦🇫", digits: 9 },
+  { code: "UZ", name: "Ouzbékistan", dialCode: "+998", flag: "🇺🇿", digits: 9 },
+  { code: "KZ", name: "Kazakhstan", dialCode: "+7", flag: "🇰🇿", digits: 10 },
+  { code: "MN", name: "Mongolie", dialCode: "+976", flag: "🇲🇳", digits: 8 },
+  // ── Océanie ──
+  { code: "AU", name: "Australie", dialCode: "+61", flag: "🇦🇺", digits: 9 },
+  { code: "NZ", name: "Nouvelle-Zélande", dialCode: "+64", flag: "🇳🇿", digits: 9 },
+  { code: "FJ", name: "Fidji", dialCode: "+679", flag: "🇫🇯", digits: 7 },
+  { code: "PG", name: "Papouasie-Nouvelle-Guinée", dialCode: "+675", flag: "🇵🇬", digits: 8 }
 ];
+const DEFAULT_COUNTRY_CODE = "SN";
+const DEFAULT_DIAL_CODE = "+221";
+const COUNTRIES_SORTED_BY_CODE = [...COUNTRIES].sort((a, b) => a.code.localeCompare(b.code));
+const getCountryByCode = (code) => COUNTRIES.find((c) => c.code.toLowerCase() === code.toLowerCase());
+const getCountryByDialCode = (dialCode) => COUNTRIES.find((c) => c.dialCode === dialCode);
+const getDefaultCountry = () => COUNTRIES.find((c) => c.code === DEFAULT_COUNTRY_CODE);
+const searchCountries = (query) => {
+  const q = query.toLowerCase().trim();
+  if (!q) return COUNTRIES;
+  return COUNTRIES.filter(
+    (c) => c.name.toLowerCase().includes(q) || c.dialCode.includes(q) || c.code.toLowerCase().includes(q)
+  );
+};
 function PhoneInput({
   value,
   onChange,
-  ccphone = "+221",
+  ccphone = DEFAULT_DIAL_CODE,
   onCcphoneChange,
   disabled = false,
   error,
   placeholder = "77 123 45 67",
   lockCcphone = false
 }) {
-  const selectedCountry = SUPPORTED_COUNTRIES.find((c) => c.code === ccphone) || SUPPORTED_COUNTRIES[0];
+  const selectedCountry = getCountryByDialCode(ccphone) || COUNTRIES_SORTED_BY_CODE[0];
+  const [dropdownOpen, setDropdownOpen] = useState(false);
+  const dropdownRef = useRef(null);
+  useEffect(() => {
+    if (!dropdownOpen) return;
+    const handler = (e) => {
+      if (dropdownRef.current && !dropdownRef.current.contains(e.target)) setDropdownOpen(false);
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [dropdownOpen]);
   const handleChange = (e) => {
     const cleaned = e.target.value.replace(/\D/g, "");
     onChange(cleaned.slice(0, selectedCountry.digits));
@@ -2901,33 +3125,96 @@ function PhoneInput({
     if (phone.length <= 7) return `${phone.slice(0, 2)} ${phone.slice(2, 5)} ${phone.slice(5)}`;
     return `${phone.slice(0, 2)} ${phone.slice(2, 5)} ${phone.slice(5, 7)} ${phone.slice(7)}`;
   };
+  const handleSelect = (dialCode) => {
+    if (onCcphoneChange) onCcphoneChange(dialCode);
+    setDropdownOpen(false);
+  };
   return /* @__PURE__ */ jsxs("div", { children: [
     /* @__PURE__ */ jsxs("div", { style: {
       display: "flex",
       alignItems: "center",
       border: `2px solid ${error ? "#ef4444" : "#d1d5db"}`,
       borderRadius: "0.5rem",
-      overflow: "hidden",
+      overflow: "visible",
       opacity: disabled ? 0.5 : 1,
-      backgroundColor: disabled ? "#f3f4f6" : "white"
+      backgroundColor: disabled ? "#f3f4f6" : "white",
+      position: "relative"
     }, children: [
-      onCcphoneChange && !lockCcphone ? /* @__PURE__ */ jsx(
-        "select",
-        {
-          value: ccphone,
-          onChange: (e) => onCcphoneChange(e.target.value),
-          disabled,
-          style: { padding: "0.75rem", backgroundColor: "#f9fafb", borderRight: "1px solid #e5e7eb", fontWeight: 500, color: "#374151", outline: "none", border: "none" },
-          children: SUPPORTED_COUNTRIES.map((c) => /* @__PURE__ */ jsxs("option", { value: c.code, children: [
-            c.flag,
-            " ",
-            c.code
-          ] }, c.code))
-        }
-      ) : /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.75rem", backgroundColor: "#f9fafb", borderRight: "1px solid #e5e7eb" }, children: [
-        /* @__PURE__ */ jsx("span", { style: { fontSize: "1.125rem" }, children: selectedCountry.flag }),
-        /* @__PURE__ */ jsx("span", { style: { fontWeight: 500, color: "#374151" }, children: selectedCountry.code })
-      ] }),
+      onCcphoneChange && !lockCcphone ? /* @__PURE__ */ jsxs("div", { ref: dropdownRef, style: { position: "relative" }, children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => !disabled && setDropdownOpen(!dropdownOpen),
+            disabled,
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: "0.375rem",
+              padding: "0.75rem",
+              backgroundColor: "#f9fafb",
+              borderRight: "1px solid #e5e7eb",
+              border: "none",
+              cursor: disabled ? "not-allowed" : "pointer",
+              fontWeight: 500,
+              color: "#374151",
+              fontSize: "0.9375rem",
+              whiteSpace: "nowrap"
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { style: { fontSize: "1.125rem" }, children: selectedCountry.flag }),
+              /* @__PURE__ */ jsx("span", { children: selectedCountry.dialCode }),
+              /* @__PURE__ */ jsx("span", { style: { fontSize: "0.625rem", marginLeft: "0.125rem" }, children: "▼" })
+            ]
+          }
+        ),
+        dropdownOpen && /* @__PURE__ */ jsx("div", { style: {
+          position: "absolute",
+          top: "100%",
+          left: 0,
+          zIndex: 50,
+          backgroundColor: "white",
+          border: "1px solid #d1d5db",
+          borderRadius: "0.375rem",
+          boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
+          maxHeight: "15rem",
+          overflowY: "auto",
+          minWidth: "12rem",
+          marginTop: "0.25rem"
+        }, children: COUNTRIES_SORTED_BY_CODE.map((c) => /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => handleSelect(c.dialCode),
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: "0.5rem",
+              width: "100%",
+              padding: "0.5rem 0.75rem",
+              border: "none",
+              cursor: "pointer",
+              fontSize: "0.875rem",
+              backgroundColor: c.dialCode === ccphone ? "#f3f4f6" : "transparent",
+              textAlign: "left"
+            },
+            onMouseEnter: (e) => e.currentTarget.style.backgroundColor = "#f3f4f6",
+            onMouseLeave: (e) => e.currentTarget.style.backgroundColor = c.dialCode === ccphone ? "#f3f4f6" : "transparent",
+            children: [
+              /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: "#374151", minWidth: "1.75rem" }, children: c.code }),
+              /* @__PURE__ */ jsx("span", { children: c.flag }),
+              /* @__PURE__ */ jsx("span", { style: { color: "#6b7280" }, children: c.dialCode })
+            ]
+          },
+          `${c.code}-${c.dialCode}`
+        )) })
+      ] }) : (
+        /* Locked view: only flag + dialCode */
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.375rem", padding: "0.75rem", backgroundColor: "#f9fafb", borderRight: "1px solid #e5e7eb" }, children: [
+          /* @__PURE__ */ jsx("span", { style: { fontSize: "1.125rem" }, children: selectedCountry.flag }),
+          /* @__PURE__ */ jsx("span", { style: { fontWeight: 500, color: "#374151" }, children: selectedCountry.dialCode })
+        ] })
+      ),
       /* @__PURE__ */ jsx(
         "input",
         {
@@ -3230,6 +3517,18 @@ function useMobileRegistration(options) {
       }));
       return { success: false, error_type: response.error_type };
     } catch (err) {
+      if (err instanceof ApiError && err.statusCode === 409 && err.response) {
+        const resp = err.response;
+        if (resp.conflict) {
+          setState((prev) => ({
+            ...prev,
+            loading: false,
+            error: resp.message || "Ce compte existe déjà",
+            conflict: resp.conflict
+          }));
+          return { success: false, error_type: resp.error_type };
+        }
+      }
       const message = getErrorMessage(err, "l'inscription");
       setState((prev) => ({ ...prev, loading: false, error: message, conflict: null }));
       return { success: false };
@@ -3375,6 +3674,7 @@ const C$1 = {
   gray900: "#111827",
   red: "#dc2626",
   redBg: "#fef2f2",
+  amber: "#f59e0b",
   amberBg: "#fef3c7",
   white: "#ffffff"
 };
@@ -3467,12 +3767,14 @@ function SuccessOrbit() {
     })
   ] });
 }
-function SignupModal({ open, onOpenChange, onSwitchToLogin, onSignupSuccess, saasApiUrl, iamApiUrl, defaultAccountType }) {
+function SignupModal({ open, onOpenChange, onSwitchToLogin, onSignupSuccess, saasApiUrl, iamApiUrl, defaultAccountType, onSwitchToLoginWithPhone }) {
+  var _a, _b, _c, _d, _e, _f;
   const {
     status,
     formData,
     loading: regLoading,
     error: regError,
+    conflict,
     accountType,
     setAccountType,
     isPhoneOnly,
@@ -3484,6 +3786,7 @@ function SignupModal({ open, onOpenChange, onSwitchToLogin, onSignupSuccess, saa
     reset: resetReg,
     clearError
   } = useMobileRegistration({ saasApiUrl, iamApiUrl });
+  const [showPasswordRecovery, setShowPasswordRecovery] = useState(false);
   const [step, setStep] = useState("intro");
   const [otpCode, setOtpCode] = useState("");
   const [password, setPassword] = useState("");
@@ -3536,31 +3839,35 @@ function SignupModal({ open, onOpenChange, onSwitchToLogin, onSignupSuccess, saa
     }
   };
   const handleInfoSubmit = async (e) => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g;
     e.preventDefault();
     setLocalError(null);
     clearError();
-    if (!((_a = formData.name) == null ? void 0 : _a.trim())) {
+    if (!((_a2 = formData.name) == null ? void 0 : _a2.trim())) {
       setLocalError("Le nom est requis");
       return;
     }
-    if (!isPhoneOnly && !((_b = formData.email) == null ? void 0 : _b.trim())) {
+    if (!isPhoneOnly && !((_b2 = formData.email) == null ? void 0 : _b2.trim())) {
       setLocalError("L'adresse email est requise");
       return;
     }
-    if (!((_c = formData.phone) == null ? void 0 : _c.trim()) || (((_d = formData.phone) == null ? void 0 : _d.length) || 0) < 6) {
+    if (!((_c2 = formData.phone) == null ? void 0 : _c2.trim()) || (((_d2 = formData.phone) == null ? void 0 : _d2.length) || 0) < 6) {
       setLocalError("Numéro de téléphone invalide");
       return;
     }
+    if (formData.ccphone === "+221" && ((_e2 = formData.phone) == null ? void 0 : _e2.length) !== 9) {
+      setLocalError("Le numéro sénégalais doit contenir exactement 9 chiffres");
+      return;
+    }
     if (isPhoneOnly && formData.ccphone !== "+221") {
       setLocalError("L'inscription par téléphone est réservée aux numéros sénégalais (+221)");
       return;
     }
-    if (!((_e = formData.town) == null ? void 0 : _e.trim())) {
+    if (!((_f2 = formData.town) == null ? void 0 : _f2.trim())) {
       setLocalError("La ville est requise");
       return;
     }
-    if (!((_f = formData.country) == null ? void 0 : _f.trim())) {
+    if (!((_g = formData.country) == null ? void 0 : _g.trim())) {
       setLocalError("Le pays est requis");
       return;
     }
@@ -3607,185 +3914,286 @@ function SignupModal({ open, onOpenChange, onSwitchToLogin, onSignupSuccess, saa
   };
   const handleAccountTypeSelect = (type) => {
     setAccountType(type);
-    if (type === "phone-only") updateFormData({ ccphone: "+221", country: "Sénégal", email: "" });
+    if (type === "phone-only") updateFormData({ ccphone: "+221", country: "SN", email: "" });
+    else if (!formData.country) updateFormData({ country: DEFAULT_COUNTRY_CODE });
     goToStep("info");
   };
   const renderError = () => error ? /* @__PURE__ */ jsx("div", { style: { padding: "0.75rem", borderRadius: "0.375rem", backgroundColor: C$1.redBg, color: C$1.red, fontSize: "0.875rem" }, children: error }) : null;
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx(DialogContent, { children: signupSuccess && signupData ? /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
-    /* @__PURE__ */ jsx(SuccessOrbit, {}),
-    /* @__PURE__ */ jsx(DialogTitle, { children: "Félicitations !" }),
-    /* @__PURE__ */ jsxs(DialogDescription, { children: [
-      "Votre compte a été créé avec succès. Bienvenue ",
-      formData.name,
-      " !"
-    ] }),
-    /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", fontSize: "0.875rem", color: C$1.gray500, marginTop: "1rem" }, children: [
-      /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
-      "Connexion automatique en cours..."
-    ] })
-  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-    step === "intro" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.accent + "1a", "4rem"), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "2rem", height: "2rem", color: C$1.accent } }) }),
-        /* @__PURE__ */ jsx(DialogTitle, { children: "Ouvrez un compte Ollaid" }),
-        /* @__PURE__ */ jsx(DialogDescription, { children: "Un compte unique qui vous donne accès à toutes les applications" })
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx(DialogContent, { children: signupSuccess && signupData ? /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+      /* @__PURE__ */ jsx(SuccessOrbit, {}),
+      /* @__PURE__ */ jsx(DialogTitle, { children: "Félicitations !" }),
+      /* @__PURE__ */ jsxs(DialogDescription, { children: [
+        "Votre compte a été créé avec succès. Bienvenue ",
+        formData.name,
+        " !"
       ] }),
-      /* @__PURE__ */ jsx(AppsLogoSlider, { iamApiUrl }),
-      /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem", fontSize: "0.875rem", color: C$1.gray500, margin: "1rem 0" }, children: ["Un seul compte pour toutes les applications", "Plus besoin de multiples mots de passe", "Connexion simplifiée et sécurisée"].map((text) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem" }, children: [
-        /* @__PURE__ */ jsx(IconCheckCircle2, { style: { width: "1.25rem", height: "1.25rem", color: C$1.green, flexShrink: 0 } }),
-        text
-      ] }, text)) }),
-      /* @__PURE__ */ jsx(StepIndicator, { current: 1 }),
-      /* @__PURE__ */ jsx(Button, { onClick: () => goToStep("account-type"), style: { width: "100%", marginTop: "1rem" }, children: "Suivant →" }),
-      /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", fontSize: "0.875rem", marginTop: "1rem" }, children: [
-        /* @__PURE__ */ jsx("span", { style: { color: C$1.gray500 }, children: "Déjà un compte ? " }),
-        /* @__PURE__ */ jsx("button", { type: "button", style: linkStyle, onClick: onSwitchToLogin, children: "Connectez-vous" })
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", fontSize: "0.875rem", color: C$1.gray500, marginTop: "1rem" }, children: [
+        /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
+        "Connexion automatique en cours..."
       ] })
-    ] }),
-    step === "account-type" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("button", { onClick: () => goToStep("intro"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
-      /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.gray100), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "1.5rem", height: "1.5rem", color: C$1.primary } }) }),
-        /* @__PURE__ */ jsx(DialogTitle, { children: "Choisissez votre type de compte" })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem", marginTop: "1rem" }, children: [
-        /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => handleAccountTypeSelect("email"),
-            style: { width: "100%", padding: "1rem", border: `2px solid ${C$1.gray200}`, borderRadius: "0.5rem", textAlign: "left", cursor: "pointer", background: C$1.white, display: "flex", alignItems: "center", gap: "0.75rem" },
-            children: [
-              /* @__PURE__ */ jsx("div", { style: { width: "2.5rem", height: "2.5rem", backgroundColor: C$1.accent, borderRadius: "0.5rem", display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 }, children: /* @__PURE__ */ jsx(IconMail, { style: { width: "1.25rem", height: "1.25rem", color: C$1.white } }) }),
-              /* @__PURE__ */ jsxs("div", { children: [
-                /* @__PURE__ */ jsx("div", { style: { fontWeight: 600, color: C$1.gray900 }, children: "Email + Téléphone" }),
-                /* @__PURE__ */ jsx("div", { style: { fontSize: "0.875rem", color: C$1.gray500 }, children: "Compte complet" })
-              ] })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => handleAccountTypeSelect("phone-only"),
-            style: { width: "100%", padding: "1rem", border: `2px solid ${C$1.gray200}`, borderRadius: "0.5rem", textAlign: "left", cursor: "pointer", background: C$1.white, display: "flex", alignItems: "center", gap: "0.75rem" },
-            children: [
-              /* @__PURE__ */ jsx("div", { style: { width: "2.5rem", height: "2.5rem", backgroundColor: C$1.accent, borderRadius: "0.5rem", display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 }, children: /* @__PURE__ */ jsx(IconSmartphone, { style: { width: "1.25rem", height: "1.25rem", color: C$1.white } }) }),
-              /* @__PURE__ */ jsxs("div", { children: [
-                /* @__PURE__ */ jsx("div", { style: { fontWeight: 600, color: C$1.gray900 }, children: "Téléphone uniquement" }),
-                /* @__PURE__ */ jsx("div", { style: { fontSize: "0.875rem", color: C$1.gray500 }, children: "🇸🇳 Sénégal uniquement" })
-              ] })
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(StepIndicator, { current: 2 })
-    ] }),
-    step === "info" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("button", { onClick: () => goToStep("account-type"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
-      /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.primary + "1a"), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "1.5rem", height: "1.5rem", color: C$1.primary } }) }),
-        /* @__PURE__ */ jsx(DialogTitle, { children: "Créer votre compte" })
-      ] }),
-      isPhoneOnly && /* @__PURE__ */ jsx("div", { style: { padding: "0.75rem", borderRadius: "0.375rem", backgroundColor: C$1.accent + "1a", color: C$1.accent, fontSize: "0.8125rem", marginTop: "0.5rem", textAlign: "center" }, children: "📱 Inscription par téléphone — 🇸🇳 Sénégal uniquement" }),
-      !isPhoneOnly && /* @__PURE__ */ jsx("div", { style: { padding: "0.75rem", borderRadius: "0.375rem", backgroundColor: C$1.amberBg, color: "#92400e", fontSize: "0.8125rem", marginTop: "0.5rem", textAlign: "center" }, children: "⚠️ Un code OTP sera envoyé par email pour vérification" }),
-      /* @__PURE__ */ jsxs("form", { onSubmit: handleInfoSubmit, style: { display: "flex", flexDirection: "column", gap: "0.75rem", marginTop: "0.75rem" }, children: [
-        renderError(),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Label, { children: "Nom complet" }),
-          /* @__PURE__ */ jsx(Input, { placeholder: "Jean Dupont", value: formData.name || "", onChange: (e) => updateFormData({ name: e.target.value }), disabled: regLoading })
-        ] }),
-        !isPhoneOnly && /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Label, { children: "Adresse email" }),
-          /* @__PURE__ */ jsx(Input, { type: "email", placeholder: "vous@exemple.com", value: formData.email || "", onChange: (e) => updateFormData({ email: e.target.value }), disabled: regLoading })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      step === "intro" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+          /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.accent + "1a", "4rem"), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "2rem", height: "2rem", color: C$1.accent } }) }),
+          /* @__PURE__ */ jsx(DialogTitle, { children: "Ouvrez un compte Ollaid" }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: "Un compte unique qui vous donne accès à toutes les applications" })
         ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Label, { children: "Numéro de téléphone" }),
-          /* @__PURE__ */ jsx(PhoneInput, { value: formData.phone || "", onChange: (p) => updateFormData({ phone: p }), ccphone: formData.ccphone || "+221", onCcphoneChange: (c) => updateFormData({ ccphone: c }), disabled: regLoading, lockCcphone: isPhoneOnly })
+        /* @__PURE__ */ jsxs(DialogBody, { children: [
+          /* @__PURE__ */ jsx(AppsLogoSlider, { iamApiUrl }),
+          /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem", fontSize: "0.875rem", color: C$1.gray500, margin: "0.75rem 0" }, children: ["Un seul compte pour toutes les applications", "Plus besoin de multiples mots de passe", "Connexion simplifiée et sécurisée"].map((text) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem" }, children: [
+            /* @__PURE__ */ jsx(IconCheckCircle2, { style: { width: "1.25rem", height: "1.25rem", color: C$1.green, flexShrink: 0 } }),
+            text
+          ] }, text)) }),
+          /* @__PURE__ */ jsx(StepIndicator, { current: 1 })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: "0.75rem" }, children: [
-          /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx(Label, { children: "Ville" }),
-            /* @__PURE__ */ jsx(Input, { placeholder: "Dakar", value: formData.town || "", onChange: (e) => updateFormData({ town: e.target.value }), disabled: regLoading })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx(Label, { children: "Pays" }),
-            /* @__PURE__ */ jsx(Input, { placeholder: "Sénégal", value: formData.country || "", onChange: (e) => updateFormData({ country: e.target.value }), disabled: regLoading || isPhoneOnly })
+        /* @__PURE__ */ jsxs(DialogFooter, { children: [
+          /* @__PURE__ */ jsx(Button, { onClick: () => goToStep("account-type"), style: { width: "100%" }, children: "Suivant →" }),
+          /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", fontSize: "0.875rem" }, children: [
+            /* @__PURE__ */ jsx("span", { style: { color: C$1.gray500 }, children: "Déjà un compte ? " }),
+            /* @__PURE__ */ jsx("button", { type: "button", style: linkStyle, onClick: onSwitchToLogin, children: "Connectez-vous" })
           ] })
+        ] })
+      ] }),
+      step === "account-type" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("button", { onClick: () => goToStep("intro"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
+        /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+          /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.gray100), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "1.5rem", height: "1.5rem", color: C$1.primary } }) }),
+          /* @__PURE__ */ jsx(DialogTitle, { children: "Choisissez votre type de compte" })
         ] }),
-        /* @__PURE__ */ jsx(StepIndicator, { current: 3 }),
-        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: regLoading, style: { width: "100%" }, children: regLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
-          /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
-          " Vérification..."
-        ] }) : "Continuer" })
-      ] })
-    ] }),
-    step === "otp" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("button", { onClick: () => goToStep("info"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
-      /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.accent), children: /* @__PURE__ */ jsx(IconKeyRound, { style: { width: "1.5rem", height: "1.5rem", color: C$1.white } }) }),
-        /* @__PURE__ */ jsx(DialogTitle, { children: "Vérification" }),
-        /* @__PURE__ */ jsxs(DialogDescription, { children: [
-          "Entrez le code envoyé ",
-          isPhoneOnly ? `au ${formData.ccphone} ${formData.phone}` : `à ${formData.email}`
+        /* @__PURE__ */ jsxs(DialogBody, { children: [
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleAccountTypeSelect("email"),
+                style: { width: "100%", padding: "1rem", border: `2px solid ${C$1.gray200}`, borderRadius: "0.5rem", textAlign: "left", cursor: "pointer", background: C$1.white, display: "flex", alignItems: "center", gap: "0.75rem" },
+                children: [
+                  /* @__PURE__ */ jsx("div", { style: { width: "2.5rem", height: "2.5rem", backgroundColor: C$1.accent, borderRadius: "0.5rem", display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 }, children: /* @__PURE__ */ jsx(IconMail, { style: { width: "1.25rem", height: "1.25rem", color: C$1.white } }) }),
+                  /* @__PURE__ */ jsxs("div", { children: [
+                    /* @__PURE__ */ jsx("div", { style: { fontWeight: 600, color: C$1.gray900 }, children: "Email + Téléphone" }),
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: "0.875rem", color: C$1.gray500 }, children: "Compte complet" })
+                  ] })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleAccountTypeSelect("phone-only"),
+                style: { width: "100%", padding: "1rem", border: `2px solid ${C$1.gray200}`, borderRadius: "0.5rem", textAlign: "left", cursor: "pointer", background: C$1.white, display: "flex", alignItems: "center", gap: "0.75rem" },
+                children: [
+                  /* @__PURE__ */ jsx("div", { style: { width: "2.5rem", height: "2.5rem", backgroundColor: C$1.accent, borderRadius: "0.5rem", display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0 }, children: /* @__PURE__ */ jsx(IconSmartphone, { style: { width: "1.25rem", height: "1.25rem", color: C$1.white } }) }),
+                  /* @__PURE__ */ jsxs("div", { children: [
+                    /* @__PURE__ */ jsx("div", { style: { fontWeight: 600, color: C$1.gray900 }, children: "Téléphone uniquement" }),
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: "0.875rem", color: C$1.gray500 }, children: "🇸🇳 Sénégal uniquement" })
+                  ] })
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(StepIndicator, { current: 2 })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "1rem" }, children: [
-        renderError(),
-        /* @__PURE__ */ jsx(OTPInput, { value: otpCode, onChange: setOtpCode, disabled: regLoading }),
-        /* @__PURE__ */ jsx("div", { style: { textAlign: "center", fontSize: "0.875rem" }, children: resendCooldown > 0 ? /* @__PURE__ */ jsxs("span", { style: { color: C$1.gray500 }, children: [
-          "Renvoyer dans ",
-          resendCooldown,
-          "s"
-        ] }) : /* @__PURE__ */ jsx("button", { type: "button", onClick: handleResendOTP, style: linkStyle, children: "Code non reçu ? Renvoyer" }) }),
-        /* @__PURE__ */ jsx(StepIndicator, { current: 4 }),
-        /* @__PURE__ */ jsx(Button, { onClick: handleOTPSubmit, disabled: regLoading || otpCode.length !== 6, style: { width: "100%" }, children: regLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+      step === "info" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("button", { onClick: () => goToStep("account-type"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
+        conflict ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+            /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.amberBg), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "1.5rem", height: "1.5rem", color: C$1.amber } }) }),
+            /* @__PURE__ */ jsx(DialogTitle, { children: conflict.type === "phone" ? "Numéro déjà utilisé" : "Email déjà utilisé" }),
+            /* @__PURE__ */ jsxs(DialogDescription, { children: [
+              conflict.type === "phone" ? `Le numéro ${formData.ccphone || ""} ${formData.phone || ""} est déjà associé à un compte.` : `L'adresse ${formData.email || ""} est déjà associée à un compte.`,
+              " ",
+              "S'il s'agit du vôtre, connectez-vous."
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(DialogFooter, { style: { borderTop: "none" }, children: [
+            conflict.type === "phone" && formData.ccphone === "+221" && ((_a = conflict.options) == null ? void 0 : _a.can_login) && /* @__PURE__ */ jsxs(
+              Button,
+              {
+                onClick: () => {
+                  const fullPhone = formData.phone || "";
+                  if (onSwitchToLoginWithPhone) onSwitchToLoginWithPhone(fullPhone);
+                  else onSwitchToLogin();
+                },
+                style: { width: "100%" },
+                children: [
+                  /* @__PURE__ */ jsx(IconSmartphone, { style: { width: "1rem", height: "1rem" } }),
+                  "Se connecter par téléphone"
+                ]
+              }
+            ),
+            (conflict.type === "email" || conflict.type === "phone" && formData.ccphone !== "+221") && ((_b = conflict.options) == null ? void 0 : _b.can_login) && /* @__PURE__ */ jsx(Button, { onClick: onSwitchToLogin, style: { width: "100%" }, children: "Se connecter" }),
+            !isPhoneOnly && (((_c = conflict.options) == null ? void 0 : _c.can_recover_by_email) || ((_d = conflict.options) == null ? void 0 : _d.can_recover_by_sms)) && /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => setShowPasswordRecovery(true), style: { width: "100%" }, children: "Récupérer mon compte" }),
+            /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => clearError(), style: { width: "100%" }, children: conflict.type === "phone" ? "Changer le numéro" : "Changer l'email" }),
+            ((_e = conflict.options) == null ? void 0 : _e.masked_email) && /* @__PURE__ */ jsxs("div", { style: { padding: "0.75rem", backgroundColor: C$1.gray100, borderRadius: "0.375rem", fontSize: "0.8125rem", color: C$1.gray500, textAlign: "center" }, children: [
+              "Email lié : ",
+              /* @__PURE__ */ jsx("strong", { style: { color: C$1.gray900 }, children: conflict.options.masked_email })
+            ] }),
+            ((_f = conflict.options) == null ? void 0 : _f.masked_phone) && /* @__PURE__ */ jsxs("div", { style: { padding: "0.75rem", backgroundColor: C$1.gray100, borderRadius: "0.375rem", fontSize: "0.8125rem", color: C$1.gray500, textAlign: "center" }, children: [
+              "Téléphone lié : ",
+              /* @__PURE__ */ jsx("strong", { style: { color: C$1.gray900 }, children: conflict.options.masked_phone })
+            ] })
+          ] })
+        ] }) : (
+          /* ---- NORMAL INFO FORM ---- */
+          /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+              /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.primary + "1a"), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "1.5rem", height: "1.5rem", color: C$1.primary } }) }),
+              /* @__PURE__ */ jsx(DialogTitle, { children: "Créer votre compte" })
+            ] }),
+            /* @__PURE__ */ jsxs("form", { onSubmit: handleInfoSubmit, style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: [
+              /* @__PURE__ */ jsxs(DialogBody, { children: [
+                isPhoneOnly && /* @__PURE__ */ jsx("div", { style: { padding: "0.75rem", borderRadius: "0.375rem", backgroundColor: C$1.accent + "1a", color: C$1.accent, fontSize: "0.8125rem", marginBottom: "0.5rem", textAlign: "center" }, children: "📱 Inscription par téléphone — 🇸🇳 Sénégal uniquement" }),
+                !isPhoneOnly && /* @__PURE__ */ jsx("div", { style: { padding: "0.75rem", borderRadius: "0.375rem", backgroundColor: C$1.amberBg, color: "#92400e", fontSize: "0.8125rem", marginBottom: "0.5rem", textAlign: "center" }, children: "⚠️ Un code OTP sera envoyé par email pour vérification" }),
+                /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
+                  renderError(),
+                  /* @__PURE__ */ jsxs("div", { children: [
+                    /* @__PURE__ */ jsxs(Label, { children: [
+                      "Nom complet ",
+                      /* @__PURE__ */ jsx("span", { style: { color: C$1.red }, children: "*" })
+                    ] }),
+                    /* @__PURE__ */ jsx(Input, { placeholder: "Jean Dupont", value: formData.name || "", onChange: (e) => updateFormData({ name: e.target.value }), disabled: regLoading })
+                  ] }),
+                  !isPhoneOnly && /* @__PURE__ */ jsxs("div", { children: [
+                    /* @__PURE__ */ jsxs(Label, { children: [
+                      "Adresse email ",
+                      /* @__PURE__ */ jsx("span", { style: { color: C$1.red }, children: "*" })
+                    ] }),
+                    /* @__PURE__ */ jsx(Input, { type: "email", placeholder: "vous@exemple.com", value: formData.email || "", onChange: (e) => updateFormData({ email: e.target.value }), disabled: regLoading })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { children: [
+                    /* @__PURE__ */ jsxs(Label, { children: [
+                      "Numéro de téléphone ",
+                      /* @__PURE__ */ jsx("span", { style: { color: C$1.red }, children: "*" })
+                    ] }),
+                    /* @__PURE__ */ jsx(PhoneInput, { value: formData.phone || "", onChange: (p) => updateFormData({ phone: p }), ccphone: formData.ccphone || "+221", onCcphoneChange: (c) => updateFormData({ ccphone: c }), disabled: regLoading, lockCcphone: isPhoneOnly })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: "0.75rem" }, children: [
+                    /* @__PURE__ */ jsxs("div", { children: [
+                      /* @__PURE__ */ jsxs(Label, { children: [
+                        "Ville ",
+                        /* @__PURE__ */ jsx("span", { style: { color: C$1.red }, children: "*" })
+                      ] }),
+                      /* @__PURE__ */ jsx(Input, { placeholder: "Dakar", value: formData.town || "", onChange: (e) => updateFormData({ town: e.target.value }), disabled: regLoading })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { children: [
+                      /* @__PURE__ */ jsxs(Label, { children: [
+                        "Pays ",
+                        /* @__PURE__ */ jsx("span", { style: { color: C$1.red }, children: "*" })
+                      ] }),
+                      /* @__PURE__ */ jsx(
+                        "select",
+                        {
+                          value: formData.country || DEFAULT_COUNTRY_CODE,
+                          onChange: (e) => {
+                            const country = getCountryByCode(e.target.value);
+                            updateFormData({ country: e.target.value, ccphone: (country == null ? void 0 : country.dialCode) || "+221" });
+                          },
+                          disabled: regLoading || isPhoneOnly,
+                          style: { width: "100%", padding: "0.5rem", borderRadius: "0.375rem", border: "1px solid #d1d5db", backgroundColor: regLoading || isPhoneOnly ? "#f3f4f6" : "white", fontSize: "0.875rem" },
+                          children: COUNTRIES_SORTED_BY_CODE.map((c) => /* @__PURE__ */ jsxs("option", { value: c.code, children: [
+                            c.code,
+                            " ",
+                            c.flag,
+                            " ",
+                            c.name
+                          ] }, c.code))
+                        }
+                      )
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsx(StepIndicator, { current: 3 })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsx(Button, { type: "submit", disabled: regLoading, style: { width: "100%" }, children: regLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+                /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
+                " Vérification..."
+              ] }) : "Continuer" }) })
+            ] })
+          ] })
+        )
+      ] }),
+      step === "otp" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("button", { onClick: () => goToStep("info"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
+        /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+          /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.accent), children: /* @__PURE__ */ jsx(IconKeyRound, { style: { width: "1.5rem", height: "1.5rem", color: C$1.white } }) }),
+          /* @__PURE__ */ jsx(DialogTitle, { children: "Vérification" }),
+          /* @__PURE__ */ jsxs(DialogDescription, { children: [
+            "Entrez le code envoyé ",
+            isPhoneOnly ? `au ${formData.ccphone} ${formData.phone}` : `à ${formData.email}`
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1rem" }, children: [
+          renderError(),
+          /* @__PURE__ */ jsx(OTPInput, { value: otpCode, onChange: setOtpCode, disabled: regLoading }),
+          /* @__PURE__ */ jsx("div", { style: { textAlign: "center", fontSize: "0.875rem" }, children: resendCooldown > 0 ? /* @__PURE__ */ jsxs("span", { style: { color: C$1.gray500 }, children: [
+            "Renvoyer dans ",
+            resendCooldown,
+            "s"
+          ] }) : /* @__PURE__ */ jsx("button", { type: "button", onClick: handleResendOTP, style: linkStyle, children: "Code non reçu ? Renvoyer" }) }),
+          /* @__PURE__ */ jsx(StepIndicator, { current: 4 })
+        ] }) }),
+        /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsx(Button, { onClick: handleOTPSubmit, disabled: regLoading || otpCode.length !== 6, style: { width: "100%" }, children: regLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
           /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
           " Vérification..."
-        ] }) : "Vérifier" })
-      ] })
-    ] }),
-    step === "password" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("button", { onClick: () => goToStep("otp"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
-      /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.accent), children: /* @__PURE__ */ jsx(IconLock, { style: { width: "1.5rem", height: "1.5rem", color: C$1.white } }) }),
-        /* @__PURE__ */ jsx(DialogTitle, { children: "Créer un mot de passe" })
+        ] }) : "Vérifier" }) })
       ] }),
-      /* @__PURE__ */ jsxs("form", { onSubmit: handlePasswordSubmit, style: { display: "flex", flexDirection: "column", gap: "0.75rem", marginTop: "0.75rem" }, children: [
-        renderError(),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Label, { children: "Mot de passe" }),
-          /* @__PURE__ */ jsx(Input, { type: "password", placeholder: "Minimum 8 caractères", value: password, onChange: (e) => setPassword(e.target.value), disabled: regLoading })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Label, { children: "Confirmer le mot de passe" }),
-          /* @__PURE__ */ jsx(Input, { type: "password", placeholder: "••••••••", value: passwordConfirm, onChange: (e) => setPasswordConfirm(e.target.value), disabled: regLoading })
+      step === "password" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("button", { onClick: () => goToStep("otp"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
+        /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+          /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.accent), children: /* @__PURE__ */ jsx(IconLock, { style: { width: "1.5rem", height: "1.5rem", color: C$1.white } }) }),
+          /* @__PURE__ */ jsx(DialogTitle, { children: "Créer un mot de passe" })
         ] }),
-        /* @__PURE__ */ jsx(StepIndicator, { current: 5 }),
-        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: regLoading, style: { width: "100%" }, children: "Continuer" })
-      ] })
-    ] }),
-    step === "confirm" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("button", { onClick: () => goToStep("password"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
-      /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.primary + "1a"), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "1.5rem", height: "1.5rem", color: C$1.primary } }) }),
-        /* @__PURE__ */ jsx(DialogTitle, { children: "Confirmer votre inscription" })
+        /* @__PURE__ */ jsxs("form", { onSubmit: handlePasswordSubmit, style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: [
+          /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
+            renderError(),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(Label, { children: "Mot de passe" }),
+              /* @__PURE__ */ jsx(Input, { type: "password", placeholder: "Minimum 8 caractères", value: password, onChange: (e) => setPassword(e.target.value), disabled: regLoading })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(Label, { children: "Confirmer le mot de passe" }),
+              /* @__PURE__ */ jsx(Input, { type: "password", placeholder: "••••••••", value: passwordConfirm, onChange: (e) => setPasswordConfirm(e.target.value), disabled: regLoading })
+            ] }),
+            /* @__PURE__ */ jsx(StepIndicator, { current: 5 })
+          ] }) }),
+          /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsx(Button, { type: "submit", disabled: regLoading, style: { width: "100%" }, children: "Continuer" }) })
+        ] })
       ] }),
-      /* @__PURE__ */ jsxs("div", { style: { marginTop: "1rem", display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
-        renderError(),
-        /* @__PURE__ */ jsx("div", { style: { backgroundColor: C$1.gray100, borderRadius: "0.5rem", padding: "1rem" }, children: [["Nom", formData.name], ...!isPhoneOnly ? [["Email", formData.email]] : [], ["Téléphone", `${formData.ccphone} ${formData.phone}`], ["Ville", formData.town], ["Pays", formData.country]].map(([label, value]) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", padding: "0.375rem 0" }, children: [
-          /* @__PURE__ */ jsx("span", { style: { fontSize: "0.875rem", color: C$1.gray500 }, children: label }),
-          /* @__PURE__ */ jsx("span", { style: { fontSize: "0.875rem", fontWeight: 500 }, children: value })
-        ] }, label)) }),
-        /* @__PURE__ */ jsx(StepIndicator, { current: 6 }),
-        /* @__PURE__ */ jsx(Button, { onClick: handleConfirm, disabled: regLoading, style: { width: "100%" }, children: regLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
+      step === "confirm" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("button", { onClick: () => goToStep("password"), style: backBtnStyle, type: "button", children: /* @__PURE__ */ jsx(IconArrowLeft, { style: { width: "1rem", height: "1rem" } }) }),
+        /* @__PURE__ */ jsxs(DialogHeader, { style: { textAlign: "center" }, children: [
+          /* @__PURE__ */ jsx("div", { style: iconCircle(C$1.primary + "1a"), children: /* @__PURE__ */ jsx(IconShieldCheck, { style: { width: "1.5rem", height: "1.5rem", color: C$1.primary } }) }),
+          /* @__PURE__ */ jsx(DialogTitle, { children: "Confirmer votre inscription" })
+        ] }),
+        /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
+          renderError(),
+          /* @__PURE__ */ jsx("div", { style: { backgroundColor: C$1.gray100, borderRadius: "0.5rem", padding: "1rem" }, children: [["Nom", formData.name], ...!isPhoneOnly ? [["Email", formData.email]] : [], ["Téléphone", `${formData.ccphone} ${formData.phone}`], ["Ville", formData.town], ["Pays", formData.country]].map(([label, value]) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", padding: "0.375rem 0" }, children: [
+            /* @__PURE__ */ jsx("span", { style: { fontSize: "0.875rem", color: C$1.gray500 }, children: label }),
+            /* @__PURE__ */ jsx("span", { style: { fontSize: "0.875rem", fontWeight: 500 }, children: value })
+          ] }, label)) }),
+          /* @__PURE__ */ jsx(StepIndicator, { current: 6 })
+        ] }) }),
+        /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsx(Button, { onClick: handleConfirm, disabled: regLoading, style: { width: "100%" }, children: regLoading ? /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
           /* @__PURE__ */ jsx(IconLoader2, { style: { width: "1rem", height: "1rem" } }),
           " Création du compte..."
-        ] }) : "Créer mon compte" })
+        ] }) : "Créer mon compte" }) })
       ] })
-    ] })
-  ] }) }) });
+    ] }) }) }),
+    /* @__PURE__ */ jsx(
+      PasswordRecoveryModal,
+      {
+        open: showPasswordRecovery,
+        onOpenChange: setShowPasswordRecovery,
+        onSuccess: () => setShowPasswordRecovery(false),
+        saasApiUrl,
+        iamApiUrl
+      }
+    )
+  ] });
 }
 const C = {
   primary: "#002147",
@@ -3852,7 +4260,7 @@ function OnboardingModal({ open, onOpenChange, user, onComplete, onSkip }) {
       ] }),
       /* @__PURE__ */ jsx(DialogDescription, { children: "Ajoutez les informations manquantes pour finaliser votre compte." })
     ] }),
-    /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1.25rem", marginTop: "1rem" }, children: [
+    /* @__PURE__ */ jsx(DialogBody, { children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "1.25rem", marginTop: "0.75rem" }, children: [
       needsPhoto && /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx(Label, { style: { display: "block", marginBottom: "0.5rem", color: C.gray700, fontWeight: 500 }, children: "Photo de profil" }),
         /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "1rem" }, children: [
@@ -3884,15 +4292,7 @@ function OnboardingModal({ open, onOpenChange, user, onComplete, onSkip }) {
               fontWeight: 500
             }, children: [
               "Choisir une photo",
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "file",
-                  accept: "image/*",
-                  onChange: handleFileChange,
-                  style: { display: "none" }
-                }
-              )
+              /* @__PURE__ */ jsx("input", { type: "file", accept: "image/*", onChange: handleFileChange, style: { display: "none" } })
             ] }),
             /* @__PURE__ */ jsx("p", { style: { fontSize: "0.75rem", color: fileError ? "#dc2626" : C.gray500, marginTop: "0.25rem" }, children: fileError || "JPG, PNG. Max 2 Mo." })
           ] })
@@ -3900,15 +4300,7 @@ function OnboardingModal({ open, onOpenChange, user, onComplete, onSkip }) {
       ] }),
       needsPhone && /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx(Label, { style: { display: "block", marginBottom: "0.5rem", color: C.gray700, fontWeight: 500 }, children: "Numéro de téléphone" }),
-        /* @__PURE__ */ jsx(
-          PhoneInput,
-          {
-            value: phone,
-            onChange: setPhone,
-            ccphone,
-            onCcphoneChange: setCcphone
-          }
-        )
+        /* @__PURE__ */ jsx(PhoneInput, { value: phone, onChange: setPhone, ccphone, onCcphoneChange: setCcphone })
       ] }),
       needsEmail && /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsxs(Label, { style: { display: "block", marginBottom: "0.5rem", color: C.gray700, fontWeight: 500 }, children: [
@@ -3950,38 +4342,32 @@ function OnboardingModal({ open, onOpenChange, user, onComplete, onSkip }) {
             type: "checkbox",
             checked: confirmed,
             onChange: (e) => setConfirmed(e.target.checked),
-            style: {
-              width: "1rem",
-              height: "1rem",
-              marginTop: "0.125rem",
-              accentColor: C.primary,
-              cursor: "pointer"
-            }
+            style: { width: "1rem", height: "1rem", marginTop: "0.125rem", accentColor: C.primary, cursor: "pointer" }
           }
         ),
         /* @__PURE__ */ jsx("span", { children: "Je confirme que ces informations sont exactes" })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            onClick: handleSubmit,
-            disabled: !canSubmit || submitting,
-            style: { width: "100%", height: "2.75rem", opacity: canSubmit && !submitting ? 1 : 0.5 },
-            children: submitting ? "Enregistrement..." : "Valider"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "outline",
-            onClick: onSkip,
-            disabled: submitting,
-            style: { width: "100%", height: "2.75rem" },
-            children: "Passer pour l'instant"
-          }
-        )
       ] })
+    ] }) }),
+    /* @__PURE__ */ jsxs(DialogFooter, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          onClick: handleSubmit,
+          disabled: !canSubmit || submitting,
+          style: { width: "100%", height: "2.75rem", opacity: canSubmit && !submitting ? 1 : 0.5 },
+          children: submitting ? "Enregistrement..." : "Valider"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          onClick: onSkip,
+          disabled: submitting,
+          style: { width: "100%", height: "2.75rem" },
+          children: "Passer pour l'instant"
+        }
+      )
     ] })
   ] }) });
 }
@@ -4232,6 +4618,7 @@ function NativeSSOPage({
   redirectAfterLogout
 }) {
   const [modal, setModal] = useState("none");
+  const [loginInitialPhone, setLoginInitialPhone] = useState();
   const [showOnboarding, setShowOnboarding] = useState(false);
   const [pendingSession, setPendingSession] = useState(null);
   const [session, setSession] = useState(() => {
@@ -4273,13 +4660,23 @@ function NativeSSOPage({
   }, []);
   const openLogin = useCallback(() => setModal("login"), []);
   const openSignup = useCallback(() => setModal("signup"), []);
-  const closeModal = useCallback(() => setModal("none"), []);
+  const closeModal = useCallback(() => {
+    setModal("none");
+    setLoginInitialPhone(void 0);
+  }, []);
   const switchToSignup = useCallback(() => {
     setModal("none");
+    setLoginInitialPhone(void 0);
     setTimeout(() => setModal("signup"), 150);
   }, []);
   const switchToLogin = useCallback(() => {
     setModal("none");
+    setLoginInitialPhone(void 0);
+    setTimeout(() => setModal("login"), 150);
+  }, []);
+  const switchToLoginWithPhone = useCallback((phone) => {
+    setModal("none");
+    setLoginInitialPhone(phone);
     setTimeout(() => setModal("login"), 150);
   }, []);
   const handleLoginSuccess = useCallback((token, user) => {
@@ -4379,6 +4776,13 @@ function NativeSSOPage({
     }, children: /* @__PURE__ */ jsx(AppsLogoSlider, { iamApiUrl, speed: "normal" }) }) })
   ] }) });
   if (session) {
+    if (redirectAfterLogin) {
+      window.location.href = redirectAfterLogin;
+      return /* @__PURE__ */ jsxs("div", { style: containerStyle, children: [
+        /* @__PURE__ */ jsx(TopBranding, { subtitle: title }),
+        /* @__PURE__ */ jsx("p", { style: { color: "rgba(255,255,255,0.7)", fontSize: "0.875rem" }, children: "Redirection en cours..." })
+      ] });
+    }
     return /* @__PURE__ */ jsxs("div", { style: containerStyle, children: [
       /* @__PURE__ */ jsx(TopBranding, { subtitle: title }),
       /* @__PURE__ */ jsx(SliderBadge, {}),
@@ -4423,7 +4827,8 @@ function NativeSSOPage({
         onLoginSuccess: handleLoginSuccess,
         saasApiUrl,
         iamApiUrl,
-        defaultAccountType: accountType
+        defaultAccountType: accountType,
+        initialPhone: loginInitialPhone
       }
     ),
     /* @__PURE__ */ jsx(
@@ -4434,6 +4839,7 @@ function NativeSSOPage({
           if (!open) closeModal();
         },
         onSwitchToLogin: switchToLogin,
+        onSwitchToLoginWithPhone: switchToLoginWithPhone,
         onSignupSuccess: handleLoginSuccess,
         saasApiUrl,
         iamApiUrl,
@@ -4623,6 +5029,9 @@ const iamAccountService = {
 export {
   ApiError,
   AppsLogoSlider,
+  COUNTRIES,
+  DEFAULT_COUNTRY_CODE,
+  DEFAULT_DIAL_CODE,
   LoginModal,
   NativeSSOPage,
   NativeSSOProvider,
@@ -4635,10 +5044,14 @@ export {
   getAccountType,
   getAuthToken,
   getAuthUser,
+  getCountryByCode,
+  getCountryByDialCode,
+  getDefaultCountry,
   getNativeAuthConfig,
   iamAccountService,
   mobilePasswordService,
   nativeAuthService,
+  searchCountries,
   setNativeAuthConfig,
   useMobilePassword,
   useMobileRegistration,