diff --git a/Js/fonctions.js b/Js/fonctions.js
index 8c6151d3..de2b1eb7 100755
--- a/Js/fonctions.js
+++ b/Js/fonctions.js
@@ -34431,53 +34431,74 @@ function afficher_garantie_produit_cons() {
 }
 
 
-function afficher_garantie_produit()
-{
-	codeGcAssureur =$("#codeGcAssureur").val();
-	
-	
-	if(codeGcAssureur<=" ") 
-	{
-		v_msg="Veuillez s\u00e9lectionner un garant!";
-		v_msgEng="Please select a guarantor!";
-		alert_ebene(v_msg, v_msgEng);
+function afficher_garantie_produit() {
+    // 1. Définition des constantes et cibles
+    const codeGcAssureur = $("#codeGcAssureur").val();
+    const codeProduit = $("#codeProduit").val();
+    const div_cible = $('#div_garantieproduit');
+    const racineWeb = $("#racineWeb").val();
+    const codeLangue = $("#codeLangue").val();
 
-		$("#codeGcAssureur").focus();
-		
-		$('#div_garantieproduit').html("");
-		
-		return;
-	}
+    // 2. Validation du Garant via alert_ebene
+    if (!codeGcAssureur || codeGcAssureur.trim() === "") {
+        let v_msg = "Garant manquant ! Veuillez sélectionner un garant pour continuer.";
+        let v_msg_eng = "Guarantor missing ! Please select a guarantor to continue.";
+        
+        alert_ebene(v_msg, v_msg_eng);
+        
+        $("#codeGcAssureur").focus();
+        div_cible.html("");
+        return;
+    }
 
-	codeProduit=$("#codeProduit").val();
-	
-	if (codeProduit<=" ") 
-	{
-		v_msg="Veuillez s\u00e9lectionner un produit!";
-		v_msgEng="Please select a product!";
-		alert_ebene(v_msg, v_msgEng);
-		
-		$('#div_garantieproduit').html("");
-		return;
-	}
-	donnees = 'codeProduit='+codeProduit;
+    // 3. Validation du Produit via alert_ebene
+    if (!codeProduit || codeProduit.trim() === "") {
+        let v_msg = "Produit manquant ! Veuillez sélectionner un produit.";
+        let v_msg_eng = "Product missing ! Please select a product.";
+        
+        alert_ebene(v_msg, v_msg_eng);
+        
+        div_cible.html("");
+        return;
+    }
 
-	var div_attente = $('#div_garantieproduit');
-	
-	div_attente.html('<div style="padding-top:80px; text-align:center; font-size:14px; color: #0088cf; "><span><i class="fa fa-spinner fa-spin fa-5x" >' + '</span></div>');
+    // 4. Préparation et affichage du loader bilingue
+    const donnees = { codeProduit: codeProduit };
+    let loadingTxt = (codeLangue === "en_US") ? "Loading the entry form..." : "Chargement du formulaire de saisie...";
 
-	$.ajax({
-		url: $("#racineWeb").val()+"Ajaxparamseuilalerte/affichergarantieproduit/",
-		type : 'post',
-		data: donnees,
-		error: function(errorData) {			
-		},
-		success: function(data) {
-			div_attente.html(data);
-		},
-		complete: function() {
-		}
-	}); 
+    div_cible.html(`
+        <div class="d-flex flex-column align-items-center justify-content-center p-5">
+            <div class="spinner-grow text-warning" role="status" style="width: 3rem; height: 3rem;">
+                <span class="visually-hidden">Loading...</span>
+            </div>
+            <h5 class="mt-4 text-warning fw-bold text-uppercase italic">${loadingTxt}</h5>
+        </div>
+    `);
+
+    // 5. Exécution de la requête AJAX
+    $.ajax({
+        url: racineWeb + "Ajaxparamseuilalerte/affichergarantieproduit/",
+        type: 'post',
+        data: donnees,
+        success: function(data) {
+            div_cible.html(data);
+
+            // INITIALISATION DATATABLE
+            setTimeout(function() {
+                const nomProduit = $("#codeProduit option:selected").text();
+                initSmartTable('#tableSeuilsModif', 'Modif Seuils - ' + nomProduit);
+            }, 150);
+        },
+        error: function() {
+            let errorTxt = (codeLangue === "en_US") ? "Technical error while retrieving the form." : "Erreur technique lors de la récupération du formulaire.";
+            div_cible.html(`
+                <div class="alert alert-danger d-flex align-items-center m-3" role="alert">
+                    <i class="fas fa-exclamation-triangle me-2"></i>
+                    <div>${errorTxt}</div>
+                </div>
+            `);
+        }
+    });
 }
 
 
@@ -61146,39 +61167,49 @@ function filtrecollegepolice()
 	}); 
 }
 
-function filtreproduitgarant(){
-	//
-	
-	var codeGcAssureur = $('#codeGcAssureur').val();
-	
-	var codeGcAssureur = $('#codeGcAssureur').val();
-	
-	
-	donnees  = 'codeGcAssureur='+codeGcAssureur;
-	
-	if(codeGcAssureur !=""){
-		$.ajax({
-			url: $("#racineWeb").val()+"Ajaxfiltreproduitgarant/",
-			type : 'post',
-			data: donnees,
-			error: function(errorData){			
-				//alert("Erreur : "+errorData);
-			},
-			success: function(data) {
-				//alert("Success : "+data);	
-				//
-				$('#div_produit').html(data);
-				$("#codeProduit").selectpicker();
-			},
-			complete: function() {
-				
-			}
-		}); 
-		
-		
-	}
+function filtreproduitgarant() {
+    const codeGcAssureur = $('#codeGcAssureur').val();
+    const racineWeb = $("#racineWeb").val();
+    const $container = $('#div_produit');
+
+    if (codeGcAssureur !== "") {
+        // 1. Feedback visuel Neutral Pro : On vide et on met un spinner
+        $container.html(`
+            <div class="d-flex align-items-center p-2 text-primary small">
+                <div class="spinner-border spinner-border-sm me-2" role="status"></div>
+                <span>${(typeof codeLangue !== 'undefined' && codeLangue === "en_US") ? "Loading products..." : "Chargement des produits..."}</span>
+            </div>
+        `);
+
+        $.ajax({
+            url: racineWeb + "Ajaxfiltreproduitgarant/",
+            type: 'POST',
+            data: { codeGcAssureur: codeGcAssureur }, // Utilisation d'un objet (plus propre)
+            success: function(data) {
+                // 2. Injection des données
+                $container.html(data);
+
+                // 3. Réinitialisation du SelectPicker (si vous l'utilisez toujours)
+                if ($.fn.selectpicker) {
+                    $("#codeProduit").selectpicker('refresh');
+                }
+            },
+            error: function(xhr, status, error) {
+                console.error("Erreur Filtre Produit:", error);
+                $container.html(`
+                    <div class="text-danger small p-2">
+                        <i class="fas fa-exclamation-circle me-1"></i> Erreur de chargement
+                    </div>
+                `);
+            }
+        });
+    } else {
+        // Si aucun garant n'est sélectionné, on peut vider ou réinitialiser le champ produit
+        $container.html('');
+    }
 }
 
+
 function afficher_adherent_bascule()
 {
 	codeGcAssureur 	= $('#codeGcAssureur').val();
diff --git a/Vue/Ajaxparamseuilalerte/affichergarantieproduit.php b/Vue/Ajaxparamseuilalerte/affichergarantieproduit.php
index 8214501f..012d128a 100755
--- a/Vue/Ajaxparamseuilalerte/affichergarantieproduit.php
+++ b/Vue/Ajaxparamseuilalerte/affichergarantieproduit.php
@@ -1,79 +1,117 @@
-<div class="row">	
-	<div id="div_sans_seuil" class="col-5" >
-		<legend> <?= _("Sans seuil") ?> </legend>
-		<table class="table table-striped table-bordered table-hover table-condensed table-responsive" style="font-size:10pt;">
-			<thead>
-			  <tr>
-				<th style='text-align:center'> <?= _("Garantie") ?> </th>
-				<th width="20%" style='text-align:center'> => </th>
-			  </tr>
+<div class="row g-4">
+    <div id="div_sans_seuil" class="col-md-5">
+        <div class="card border-0 shadow-sm" style="border-radius: var(--radius-md);">
+            <div class="card-header bg-white border-0 py-3 d-flex align-items-center justify-content-between">
+                <h6 class="mb-0 fw-bold text-uppercase text-muted small">
+                    <i class="fas fa-list-ul me-2"></i><?= _("Garanties Sans seuil") ?>
+                </h6>
+                <span class="badge bg-light text-dark rounded-pill"><?= count($garanties_sans_seuils) ?></span>
+            </div>
+            
+            <div class="p-2 border-top border-bottom bg-light">
+                <button type="button" class="btn btn-primary btn-sm w-100 fw-bold shadow-sm" onclick="javascript:ajouter_tous_garantie_produit();">
+                    <?= _("Tout Ajouter") ?> <i class="fas fa-angle-double-right ms-2"></i>
+                </button>
+            </div>
 
-			  <tr>
-				<th colspan="2"> <button type="button" style="font-size:10pt;" class="form-control btn btn-primary" onclick="javascript:ajouter_tous_garantie_produit();" > <?= _("Ajouter tous"). " ==>" ?> </button> </th> 
-			  </tr>
-			  
-			</thead>
+            <div class="table-responsive" style="max-height: 500px; overflow-y: auto;">
+                <table class="table table-hover align-middle mb-0" style="font-size: 9pt;">
+                    <thead class="bg-white sticky-top shadow-xs">
+                        <tr>
+                            <th class="ps-3"><?= _("Libellé Garantie") ?></th>
+                            <th width="15%" class="text-center"><?= _("Action") ?></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <?php foreach ($garanties_sans_seuils as $v): $codeGarantie = $v['codeGarantie']; ?>
+                        <tr>
+                            <td class="ps-3 fw-medium text-dark"><?= $this->nettoyer($v['garantie']) ?></td>
+                            <td class="text-center">
+                                <button class="btn btn-outline-primary btn-xs rounded-circle" title="<?= _('Ajouter') ?>"
+                                        onClick="javascript:ajouter_un_garantie_produit('<?=$codeGarantie?>');">
+                                    <i class="fas fa-chevron-right"></i>
+                                </button>
+                            </td>
+                        </tr>
+                        <?php endforeach; ?>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
 
-			<tbody>
-				<?php foreach ($garanties_sans_seuils as $garanties_sans_seuil):
-					$codeGarantie	= $garanties_sans_seuil['codeGarantie'];
-				?>
-				<tr valign="top">
-					<td align='center'><?=  $this->nettoyer($garanties_sans_seuil['garantie']) ?></td>
-					<td align='center'> <input type="button" value="=>" onClick="javascript:ajouter_un_garantie_produit('<?=$codeGarantie?>');" ></td>
-				</tr>
-				<?php endforeach; ?>
-			</tbody>
-		</table>
-	</div>
+    <div id="div_avec_seuil" class="col-md-7">
+        <div class="card border-0 shadow-sm" style="border-radius: var(--radius-md);">
+            <div class="card-header bg-white border-0 py-3 d-flex align-items-center justify-content-between">
+                <h6 class="mb-0 fw-bold text-uppercase text-warning small">
+                    <i class="fas fa-check-double me-2"></i><?= _("Garanties avec Seuil d'alerte") ?>
+                </h6>
+                <button type="button" class="btn btn-outline-danger btn-xs fw-bold px-3" onclick="javascript:retirer_tous_garantie_produit();">
+                    <i class="fas fa-trash-alt me-1"></i> <?= _("Tout Retirer") ?>
+                </button>
+            </div>
 
-	<div id="div_avec_seuil" class="col-7" >
-		<legend> <?= _("Avec seuil") ?> </legend>
-		<table class="table table-striped table-bordered table-hover table-condensed table-responsive" style="font-size:10pt;">
-			<thead>
-			
-			  <tr>
-				<th rowspan="2" width="10%" style='text-align:center'> <= </th>
-				<th rowspan="2" style='text-align:center'> <?= _("Garantie") ?> </th>
-				<th colspan="4" style='text-align:center'> <?= _("Seuil") ?> </th>
-			  </tr>
-			  
-			  <tr>
-				<th colspan="2" style='text-align:center'> <?= _("Taux") ?> </th>
-				<th colspan="2"  style='text-align:center'> <?= _("Forfait") ?> </th>
-			  </tr>
-			  
-			  <tr>
-				<td colspan="6"> <button type="button" style="font-size:10pt;" class="form-control btn btn-danger" onclick="javascript:retirer_tous_garantie_produit();" > <?= "<== " . _("Retirer tous") ?> </button> </td>						
-			  </tr>
-			  
-			</thead>
+            <div class="table-responsive">
+                <table id="tableSeuilsModif" class="table table-hover align-middle mb-0" style="font-size: 9pt;">
+                    <thead class="bg-light text-muted small">
+                        <tr>
+                            <th width="5%" class="text-center">#</th>
+                            <th><?= _("Garantie") ?></th>
+                            <th width="20%" class="text-center"><?= _("Taux (%)") ?></th>
+                            <th width="25%" class="text-center"><?= _("Forfait (Montant)") ?></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <?php foreach ($garanties_avec_seuils as $v): 
+                            $id = $v['id'];
+                            $taux = $v['tauxSeuilAlerte'];
+                            $montant = $v['seuilAlerte'];
+                        ?>
+                        <tr>
+                            <td class="text-center">
+                                <button class="btn btn-link text-danger p-0" title="<?= _('Retirer') ?>"
+                                        onClick="javascript:retirer_un_garantie_produit('<?=$id?>');">
+                                    <i class="fas fa-minus-circle"></i>
+                                </button>
+                            </td>
+                            <td class="fw-bold text-dark"><?= $this->nettoyer($v['garantie']) ?></td>
+                            <td>
+                                <div class="input-group input-group-sm">
+                                    <input type="number" class="form-control text-center border-warning-subtle fw-bold" value="<?= $taux ?>" 
+                                           onchange="if(controle_numerique(this)){maj_taux_seuil_alerte_garantie('<?=$id?>', this.value);}">
+                                    <span class="input-group-text bg-white"><i class="fas fa-percent text-muted small"></i></span>
+                                </div>
+                            </td>
+                            <td>
+                                <div class="input-group input-group-sm">
+                                    <input type="number" class="form-control text-end pe-2 border-warning-subtle fw-bold" value="<?= $montant ?>" 
+                                           onchange="if(controle_numerique(this)){maj_seuil_alerte_garantie('<?=$id?>', this.value);}">
+                                    <span class="input-group-text bg-white small">CFA</span>
+                                </div>
+                            </td>
+                        </tr>
+                        <?php endforeach; ?>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</div>
 
-			<tbody>
-				<?php foreach ($garanties_avec_seuils as $garanties_avec_seuil):
-					$id					= $garanties_avec_seuil['id'];
-					$tauxSeuilAlerte	= $garanties_avec_seuil['tauxSeuilAlerte'];
-					$seuilAlerte		= $garanties_avec_seuil['seuilAlerte'];
-				?>
-				<tr valign="top">
-					<td align='center'> <input type="button" value="<=" onClick="javascript:retirer_un_garantie_produit('<?=$id?>');" ></td>
-					
-					<td align='center'><?=  $this->nettoyer($garanties_avec_seuil['garantie']) ?></td>
+<style>
+/* Style spécifique pour les inputs de modification */
+#tableSeuilsModif .form-control:focus {
+    background-color: #fff9f0;
+    border-color: #f39c12;
+    box-shadow: none;
+}
 
-					<td <th width="10%" align='center'><?= $tauxSeuilAlerte ?></td>
-					<td <th width="15%" >
-						<INPUT style="font-size:10pt; text-align:center;" class="form-control"  TYPE="number"  value="<?= $tauxSeuilAlerte ?>" 
-						onChange="this.value=supprimer_espace_nombre(this.value);if(controle_numerique(this)){maj_taux_seuil_alerte_garantie('<?=$id?>', this.value);}">
-					</td>
-					
-					<td <th width="15%" align='center'><?= format_N($seuilAlerte) ?></td>
-					<td <th width="20%" >
-						<INPUT style="font-size:10pt; text-align:center;" class="form-control"  TYPE="number"  value="<?= $seuilAlerte ?>" 
-						onChange="this.value=supprimer_espace_nombre(this.value);if(controle_numerique(this)){maj_seuil_alerte_garantie('<?=$id?>', this.value);}">
-					</td>
-				</tr>
-				<?php endforeach; ?>
-			</tbody>
-		</table>
-	</div>
-</div>	
+#tableSeuilsModif .form-control {
+    background-color: #fafafa;
+    border-radius: 4px;
+}
+
+/* Scroll personnalisé pour la liste de gauche */
+#div_sans_seuil .table-responsive::-webkit-scrollbar { width: 6px; }
+#div_sans_seuil .table-responsive::-webkit-scrollbar-thumb { background: #dcdcdc; border-radius: 10px; }
+</style>
\ No newline at end of file
diff --git a/Vue/Paramseuilalerte/index.php b/Vue/Paramseuilalerte/index.php
index 4660babf..34e58f56 100755
--- a/Vue/Paramseuilalerte/index.php
+++ b/Vue/Paramseuilalerte/index.php
@@ -8,7 +8,7 @@
                 </div>
                 <div>
                     <h4 id="titre-page" class="mb-0 fw-bold text-uppercase"><?= _("Gestion des seuils de consommation") ?></h4>
-                    <p class="text-muted small mb-0"><?= _("Configuration par les produits d'assurance des garants") ?></p>
+                    <p class="text-muted small mb-0"><?= _("Consultez par les produits santé des garants") ?></p>
                 </div>
             </div>