diff --git a/Js/fonctions.js b/Js/fonctions.js
index b26375e..a356e96 100755
--- a/Js/fonctions.js
+++ b/Js/fonctions.js
@@ -2502,102 +2502,96 @@ $( ".datepicker" ).datepicker({
 	
 });
 
-function charger_fichier_modele_assure()
-{
-	$('#div_exporter_liste_assures').html("");
-	
-	$('#div_form_upload').show();
+/**
+ * ETAPE 2 : Affichage du formulaire d'upload
+ */
+function charger_fichier_modele_assure() {
+    // Nettoie la zone de prévisualisation avant un nouvel upload
+    $('#div_exporter_liste_assures').empty();
+    
+    // Animation fluide pour afficher le formulaire
+    $('#div_form_upload').slideDown();
+    
+    // Scroll automatique vers le formulaire pour l'utilisateur
+    $('html, body').animate({
+        scrollTop: $("#div_form_upload").offset().top - 100
+    }, 500);
 }
 
-function init_importer_modele_assure()
-{
-	etape2=$("#etape2").val();
+/**
+ * ETAPE 3 (Init) : Chargement de la liste des avenants
+ */
+function init_importer_modele_assure() {
+    // Vérification stricte de l'étape précédente
+    var etape2 = $("#etape2").val();
 
-	if (etape2 != "1") 
-	{
-		v_msg="Etape 2 incomplète!";
-		v_msgEng="Incomplete step 2!";
-		alert_ebene(v_msg, v_msgEng);
+    if (etape2 !== "1") {
+        alert_ebene("Veuillez d'abord charger un fichier Excel (Étape 2) !", "Please upload an Excel file first (Step 2)!");
+        return;
+    }
 
-		return;
-	}
+    $('#div_form_upload').slideUp();
+    var div_export = $('#div_exporter_liste_assures');
+    
+    // Spinner moderne
+    div_export.html('<div class="text-center py-5"><div class="spinner-border text-primary" role="status"></div><p class="mt-2">Récupération des avenants...</p></div>');
 
-	$('#div_form_upload').hide();
-	
-	var div_export = $('#div_exporter_liste_assures');
-	
-	div_export.html('<div style="padding-top:80px;"><img src="Bootstrap/images/loading.gif"/>&nbsp;&nbsp;<span style="font-size:15pt;">' + 'Veuillez patienter... / Please wait...' + '</span></div>');
-
-	$.ajax({
-		url: $("#racineWeb").val()+"Ajaximporterlisteassure/initimportermodele/",
-		type: 'POST',			
-		// data: donnees,		
-		success: function(data) 
-		{
-			div_export.html(data);
-		},
-		error : function(resultat, statut, erreur)
-		{
-		},
-		complete: function(data) 
-		{
-		}
-	});
+    $.ajax({
+        url: $("#racineWeb").val() + "Ajaximporterlisteassure/initimportermodele/",
+        type: 'POST',           
+        success: function(data) {
+            div_export.html(data);
+        },
+        error: function() {
+            div_export.html('<div class="alert alert-danger">Erreur de connexion au serveur.</div>');
+        }
+    });
 }
 
-function importer_modele_assure(idAvenant)
-{
-	etape2=$("#etape2").val();
+/**
+ * ETAPE 3 (Action) : Liaison du fichier à l'avenant choisi
+ */
+function importer_modele_assure(idAvenant) {
+    // On re-vérifie la présence du fichier par sécurité
+    var cheminFichier = $("#cheminFichier").val();
+    if (!cheminFichier || cheminFichier === "") {
+        alert_ebene("Erreur: Aucun fichier trouvé.", "Error: No file found.");
+        return;
+    }
 
-	if (etape2 != "1") 
-	{
-		v_msg="Etape 2 incomplète!";
-		v_msgEng="Incomplete step 2!";
-		alert_ebene(v_msg, v_msgEng);
+    var div_export = $('#div_exporter_liste_assures');
+    div_export.html('<div class="text-center py-5"><div class="spinner-border text-info" role="status"></div><p class="mt-2">Analyse du fichier et liaison à l\'avenant...</p></div>');
 
-		return;
-	}
+    var donnees = {
+        idAvenant: idAvenant,
+        cheminFichier: cheminFichier
+    };
+    
+    $("#div_erreur_excel").empty();
 
-	$('#div_form_upload').hide();
-	
-	var div_export = $('#div_exporter_liste_assures');
-	
-	div_export.html('<div style="padding-top:80px;"><img src="Bootstrap/images/loading.gif"/>&nbsp;&nbsp;<span style="font-size:15pt;">' + 'Chargement en cours! Veuillez patienter...' + '</span></div>');
-
-	cheminFichier=$("#cheminFichier").val();
-
-	donnees = 'idAvenant='+idAvenant+'&cheminFichier='+cheminFichier;
-	
-	$("#div_erreur_excel").html("");
-
-	$.ajax({
-		url: $("#racineWeb").val()+"Ajaximporterlisteassure/importermodele/",
-		type: 'POST',			
-		data: donnees,		
-		success: function(data) 
-		{
-			div_export.html('');
-			$("#div_erreur_excel").html(data);
-			
-			v_msg="Opération terminée avec succès!";
-			v_msgEng="Operation completed successfully!";
-			alert_ebene(v_msg, v_msgEng);
-		},
-		error : function(resultat, statut, erreur)
-		{
-		},
-		complete: function(data) 
-		{
-			div_export.html('');
-			
-			succes_impot_execl=$("#succes_impot_execl").val();
-			
-			if (succes_impot_execl == "1") 
-			{
-				maj_etape_3_import_assures();
-			}
-		}
-	});
+    $.ajax({
+        url: $("#racineWeb").val() + "Ajaximporterlisteassure/importermodele/",
+        type: 'POST',          
+        data: donnees,      
+        success: function(data) {
+            // Le serveur doit retourner un flag de succès dans le HTML 
+            // ex: <input type="hidden" id="succes_impot_execl" value="1">
+            $("#div_erreur_excel").html(data);
+            
+            var isSuccess = $("#succes_impot_execl").val();
+            
+            if (isSuccess === "1") {
+                alert_ebene("Liaison réussie ! Passage au traitement...", "Link successful! Moving to processing...");
+                maj_etape_3_import_assures();
+            } else {
+                div_export.empty(); // On vide le spinner pour laisser voir l'erreur
+                alert_ebene("Le fichier contient des erreurs de format.", "The file contains formatting errors.");
+            }
+        },
+        error: function() {
+            alert_ebene("Erreur technique lors de l'importation.", "Technical error during import.");
+        }
+    });
 }
 
 function maj_etape_3_import_assures()
diff --git a/Vue/Importassure/index.php b/Vue/Importassure/index.php
index 7b7775a..f1e29c1 100644
--- a/Vue/Importassure/index.php
+++ b/Vue/Importassure/index.php
@@ -1,79 +1,126 @@
-<div class="card mb-4">
-  <div class="card-header fw-bold text-secondary">
-    <i class="fas fa-tasks me-2"></i><?= _("Processus d'importation des assurés") ?>
-  </div>
-  <div class="card-body">
+<div id="div_liste_adherent" class="container-fluid py-1 animate__animated animate__fadeIn">
 
-    <!-- Progress bar -->
-    <div class="progress mb-4" style="height: 25px;">
-      <div class="progress-bar bg-primary fw-bold" role="progressbar" 
-           style="width: <?= ($fichierimport['etape3']=='1') ? '100%' : (($fichierimport['etape2']=='1') ? '50%' : '25%') ?>;" 
-           aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
-        <?= _("Progression") ?>
-      </div>
+	<h1 class="text-primary"><i class="fas fa-file-import me-2"></i></i> <?= _("Importer les assurés") ?></h1>
+
+    <div class="card shadow-sm border-0 mb-0 bg-light">
+        <div class="card-body">
+            <div class="row g-3 align-items-center">
+                <div class="col-md-4">
+                    <h6 class="text-muted small fw-bold mb-1 text-uppercase"><?= _("Client / Souscripteur") ?></h6>
+                    <div class="h5 mb-0 fw-bold text-primary"><?= $_SESSION['nomClient_C'] ?></div>
+                </div>
+                <div class="col-md-3">
+                    <h6 class="text-muted small fw-bold mb-1 text-uppercase"><?= _("Police N°") ?></h6>
+                    <div class="h5 mb-0 fw-bold"><?= $this->nettoyer($police['numeroPolice']) ?></div>
+                </div>
+                <div class="col-md-2 text-center border-start">
+                    <h6 class="text-muted small fw-bold mb-1 text-uppercase"><?= _("État") ?></h6>
+                    <span class="badge bg-success px-3"><?= $this->nettoyer($police['etatPolice']) ?></span>
+                </div>
+                <div class="col-md-3 text-end border-start">
+                    <h6 class="text-muted small fw-bold mb-1 text-uppercase"><?= _("Période") ?></h6>
+                    <div class="small fw-bold">Du <?= dateLang($this->nettoyer($police['dateEffet'])) ?></div>
+                    <div class="small fw-bold">Au <?= dateLang($this->nettoyer($police['dateEcheance'])) ?></div>
+                </div>
+            </div>
+        </div>
     </div>
 
-    <!-- Timeline steps -->
-    <div class="row g-4 text-center">
-
-      <!-- Étape 1 -->
-      <div class="col-md-3">
-        <div class="card h-100 <?= ($fichierimport['etape1']=='1') ? 'border-success' : 'border-secondary' ?>">
-          <div class="card-body">
-            <h6 class="fw-bold">1️⃣ <?= _("Obtenir Fichier Modèle") ?></h6>
-            <button type="button" class="btn btn-primary w-100 mt-2" onclick="exporter_modele_assure();">
-              <?= _("Télécharger") ?>
-            </button>
-            <span class="badge mt-2 <?= ($fichierimport['etape1']=='1') ? 'bg-success' : 'bg-secondary' ?>">
-              <?= ($fichierimport['etape1']=='1') ? _("Validée") : _("En attente") ?>
-            </span>
-          </div>
+    
+    <div class="card shadow-sm border-0 mb-4">
+        <div class="card-header bg-white py-1">
+            <h5 class="card-title mb-0 fw-bold"><i class="fas fa-file-import me-2 text-info"></i><?= _("Processus d'importation des assurés") ?></h5>
         </div>
-      </div>
+        <div class="card-body">
+            <div class="row g-4 text-center">
+                <div class="col-md-3">
+                    <div class="p-3 border rounded h-100 bg-white shadow-sm hover-elevate">
+                        <div class="badge bg-primary rounded-circle mb-3 fs-5" style="width:40px; height:40px; line-height:28px;">1</div>
+                        <p class="small fw-bold mb-3"><?= _("Modèle Excel") ?></p>
+                        <button class="btn btn-outline-primary btn-sm w-100" onclick="javascript:exporter_modele_assure();">
+                            <i class="fas fa-download me-1"></i> <?= _("Télécharger") ?>
+                        </button>
+                    </div>
+                </div>
 
-      <!-- Étape 2 -->
-      <div class="col-md-3">
-        <div class="card h-100 <?= ($fichierimport['etape2']=='1') ? 'border-success' : 'border-secondary' ?>">
-          <div class="card-body">
-            <h6 class="fw-bold">2️⃣ <?= _("Charger Fichier Renseigné") ?></h6>
-            <button type="button" class="btn btn-primary w-100 mt-2" onclick="charger_fichier_modele_assure();">
-              <?= _("Uploader") ?>
-            </button>
-            <span class="badge mt-2 <?= ($fichierimport['etape2']=='1') ? 'bg-success' : 'bg-secondary' ?>">
-              <?= ($fichierimport['etape2']=='1') ? _("Validée") : _("En attente") ?>
-            </span>
-          </div>
+                <div class="col-md-3">
+                    <div class="p-3 border rounded h-100 <?= ($fichierimport['etape2']=='1') ? 'bg-success-subtle border-success' : 'bg-white shadow-sm' ?>">
+                        <div class="badge <?= ($fichierimport['etape2']=='1') ? 'bg-success' : 'bg-secondary' ?> rounded-circle mb-3 fs-5" style="width:40px; height:40px; line-height:28px;">
+                            <?= ($fichierimport['etape2']=='1') ? '<i class="fas fa-check"></i>' : '2' ?>
+                        </div>
+                        <p class="small fw-bold mb-3"><?= _("Charger le fichier") ?></p>
+                        <button class="btn <?= ($fichierimport['etape2']=='1') ? 'btn-success' : 'btn-primary' ?> btn-sm w-100" onclick="javascript:charger_fichier_modele_assure();">
+                            <i class="fas fa-upload me-1"></i> <?= _("Choisir fichier") ?>
+                        </button>
+                    </div>
+                </div>
+
+                <div class="col-md-3">
+                    <div class="p-3 border rounded h-100 <?= ($fichierimport['etape3']=='1') ? 'bg-success-subtle border-success' : 'bg-white shadow-sm' ?>">
+                        <div class="badge <?= ($fichierimport['etape3']=='1') ? 'bg-success' : 'bg-secondary' ?> rounded-circle mb-3 fs-5" style="width:40px; height:40px; line-height:28px;">
+                            <?= ($fichierimport['etape3']=='1') ? '<i class="fas fa-check"></i>' : '3' ?>
+                        </div>
+                        <p class="small fw-bold mb-3"><?= _("Avenant lié") ?></p>
+                        <button class="btn btn-primary btn-sm w-100" onclick="javascript:init_importer_modele_assure();" <?= ($fichierimport['etape2']!='1') ? 'disabled' : '' ?>>
+                            <i class="fas fa-list-alt me-1"></i> <?= _("Lier Avenant") ?>
+                        </button>
+                    </div>
+                </div>
+
+                <div class="col-md-3">
+                    <div class="p-3 border rounded h-100 bg-white shadow-sm">
+                        <div class="badge bg-secondary rounded-circle mb-3 fs-5" style="width:40px; height:40px; line-height:28px;">4</div>
+                        <p class="small fw-bold mb-3"><?= _("Traitement final") ?></p>
+                        <button class="btn btn-warning btn-sm w-100 fw-bold" onclick="javascript:traiter_lignes_importees();" <?= ($fichierimport['etape3']!='1') ? 'disabled' : '' ?>>
+                            <i class="fas fa-cogs me-1"></i> <?= _("Lancer l'import") ?>
+                        </button>
+                    </div>
+                </div>
+            </div>
         </div>
-      </div>
-
-      <!-- Étape 3 -->
-      <div class="col-md-3">
-        <div class="card h-100 <?= ($fichierimport['etape3']=='1') ? 'border-success' : 'border-secondary' ?>">
-          <div class="card-body">
-            <h6 class="fw-bold">3️⃣ <?= _("Choisir Avenant") ?></h6>
-            <button type="button" class="btn btn-primary w-100 mt-2" onclick="init_importer_modele_assure();">
-              <?= _("Sélectionner") ?>
-            </button>
-            <span class="badge mt-2 <?= ($fichierimport['etape3']=='1') ? 'bg-success' : 'bg-secondary' ?>">
-              <?= ($fichierimport['etape3']=='1') ? _("Validée") : _("En attente") ?>
-            </span>
-          </div>
-        </div>
-      </div>
-
-      <!-- Étape 4 -->
-      <div class="col-md-3">
-        <div class="card h-100 border-secondary">
-          <div class="card-body">
-            <h6 class="fw-bold">4️⃣ <?= _("Traiter Importations") ?></h6>
-            <button type="button" class="btn btn-primary w-100 mt-2" onclick="traiter_lignes_importees();">
-              <?= _("Lancer") ?>
-            </button>
-            <span class="badge mt-2 bg-secondary"><?= _("En attente") ?></span>
-          </div>
-        </div>
-      </div>
-
     </div>
-  </div>
-</div>
\ No newline at end of file
+
+    <?php if($fichierimport['nomOrigine'] > ""): ?>
+    <div class="alert alert-info d-flex align-items-center shadow-sm" role="alert">
+        <i class="fas fa-file-excel fa-2x me-3"></i>
+        <div>
+            <div class="small text-muted"><?= _("Fichier actuellement chargé :") ?></div>
+            <strong class="text-uppercase"><?= $this->nettoyer($fichierimport['nomOrigine']) ?></strong>
+        </div>
+    </div>
+    <?php endif; ?>
+
+    <div id="div_form_upload" class="card shadow-sm border-0 mb-4 animate__animated animate__fadeInUp" style="display: none">
+        <div class="card-body bg-light">
+            <form enctype="multipart/form-data" action="Importassure" method="post">
+                <div class="row align-items-end g-3">
+                    <div class="col-md-8">
+                        <label class="form-label fw-bold small text-muted"><?= _("Sélectionnez le document Excel (.xlsx, .xls)") ?></label>
+                        <input class="form-control" name="fichier_upload" type="file" id="fichier_upload" required />
+                    </div>
+                    <div class="col-md-4">
+                        <button type="submit" name="submit" class="btn btn-primary w-100">
+                            <i class="fas fa-cloud-upload-alt me-2"></i><?= _("Envoyer sur le serveur") ?>
+                        </button>
+                    </div>
+                </div>
+            </form>
+        </div>
+    </div>
+
+    <?php if((isset($msgErreur)) && ($msgErreur > " ")) : ?>
+        <div class="alert alert-warning border-0 shadow-sm text-center fw-bold fs-5 py-3">
+            <i class="fas fa-exclamation-circle me-2"></i> <?= $msgErreur ?>
+        </div>
+    <?php endif; ?>
+
+</div>
+
+<input type="hidden" id="cheminFichier" name="cheminFichier" value="<?= $this->nettoyer($fichierimport['cheminFichier']) ?>">
+<div id="div_exporter_liste_assures" class="d-none"></div> 
+
+<style>
+    .hover-elevate:hover { transform: translateY(-3px); transition: 0.3s; }
+    .bg-success-subtle { background-color: #d1e7dd !important; }
+    .badge { display: inline-flex; align-items: center; justify-content: center; }
+</style>
\ No newline at end of file