diff --git a/Js/fonctions.js b/Js/fonctions.js
index f97c722c..b1dd14cb 100755
--- a/Js/fonctions.js
+++ b/Js/fonctions.js
@@ -47,7 +47,6 @@ function alert_ebene(p_msg, p_msg_eng) {
     });
 }
 
-
 function confirm_ebene(p_msg, p_msg_eng) {
     // Récupération de la langue sélectionnée
     let codeLangue = $("#codeLangue").val();
@@ -34428,99 +34427,125 @@ 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();
 
-		$("#codeGcAssureur").focus();
-		
-		$('#div_garantieproduit').html("");
-		
-		return;
-	}
+    // 2. Validation du Garant (avec SweetAlert2)
+    if (!codeGcAssureur || codeGcAssureur.trim() === "") {
+        Swal.fire({
+            icon: 'warning',
+            title: '<?= _("Garant manquant") ?>',
+            text: '<?= _("Veuillez sélectionner un garant pour continuer.") ?>',
+            confirmButtonColor: '#212e53'
+        });
+        $("#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
+    if (!codeProduit || codeProduit.trim() === "") {
+        Swal.fire({
+            icon: 'warning',
+            title: '<?= _("Produit manquant") ?>',
+            text: '<?= _("Veuillez sélectionner un produit !") ?>',
+            confirmButtonColor: '#212e53'
+        });
+        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 des paramètres et affichage du loader "Ghost"
+    const donnees = { codeProduit: codeProduit };
 
-	$.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">${'<?= _("Chargement du formulaire de saisie...") ?>'}</h5>
+        </div>
+    `);
+
+    // 5. Exécution de la requête AJAX
+    $.ajax({
+        url: racineWeb + "Ajaxparamseuilalerte/affichergarantieproduit/",
+        type: 'post',
+        data: donnees,
+        success: function(data) {
+            // Injection du contenu (Tableau avec inputs de modification)
+            div_cible.html(data);
+
+            // INITIALISATION DATATABLE
+            // On utilise l'ID #tableSeuilsModif qui doit être présent dans le retour AJAX
+            setTimeout(function() {
+                const nomProduit = $("#codeProduit option:selected").text();
+                initSmartTable('#tableSeuilsModif', 'Modif Seuils - ' + nomProduit);
+            }, 150);
+        },
+        error: function() {
+            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>${'<?= _("Erreur technique lors de la récupération du formulaire.") ?>'}</div>
+                </div>
+            `);
+        }
+    });
 }
 
 
-function ajouter_tous_garantie_produit()
-{
-	codeProduit=$("#codeProduit").val();
+function ajouter_tous_garantie_produit() {
+    const codeProduit = $("#codeProduit").val();
+    const racineWeb = $("#racineWeb").val();
+    const codeLangue = $("#codeLangue").val();
 
-	if (codeProduit<=" ") 
-	{
-		v_msg="Veuillez sélectionner un produit!";
-		v_msgEng="Please select a category!";
-		alert_ebene(v_msg, v_msgEng);
+    // 1. Validation de sécurité (Messages manuels selon la langue)
+    if (!codeProduit || codeProduit.trim() === "") {
+        let v_err = (codeLangue === "en_US") ? "Please select a product!" : "Veuillez sélectionner un produit !";
+        toastr.warning(v_err);
+        return;
+    }
 
-		return;
-	}
+    // 2. Définition des messages pour confirm_ebene
+    let v_msg = "Confirmez-vous l'ajout de toutes les garanties ?";
+    let v_msgEng = "Do you confirm the addition of all guarantees?";
 
-	donnees = 'codeProduit='+codeProduit;
+    // 3. Appel de votre fonction de confirmation personnalisée
+    confirm_ebene(v_msg, v_msgEng).then((isConfirmed) => {
+        if (isConfirmed) {
+            
+            // Affichage d'un indicateur de traitement (Loading)
+            Swal.showLoading();
 
-	v_msg="Confirmez-vous cette opération?";
-	v_msgEng="Do you confirm this operation?";
-	
-		
-	confirm_ebene(v_msg, v_msgEng)
-	.then((isConfirmed) => {
-		if (isConfirmed) {
-			// L'utilisateur a confirmé
-			$.ajax({
-				url: $("#racineWeb").val()+"Ajaxparamseuilalerte/ajoutertousgarantieproduit/",
-				type: 'POST',			
-				data: donnees,
-				success: function(data) {
-				},
-				error: function(data) {
-				},
-				complete: function() {
-					afficher_garantie_produit();
-				}
-			});
-		} else {
-			// L'utilisateur a annulé
-			console.log("Confirmation refusée");
-		}
-	});
-	
+            $.ajax({
+                url: racineWeb + "Ajaxparamseuilalerte/ajoutertousgarantieproduit/",
+                type: 'POST',
+                data: { codeProduit: codeProduit },
+                success: function(data) {
+                    // Notification discrète de succès
+                    let v_suc = (codeLangue === "en_US") ? "Operation successful" : "Opération réussie";
+                    toastr.success(v_suc);
+                },
+                error: function() {
+                    let v_err_ajax = (codeLangue === "en_US") ? "Server error" : "Erreur serveur";
+                    toastr.error(v_err_ajax);
+                },
+                complete: function() {
+                    // 4. Rafraîchissement automatique de la vue
+                    afficher_garantie_produit();
+                }
+            });
+        }
+    });
 }
 
+
+
 function retirer_tous_garantie_produit()
 {
 	codeProduit=$("#codeProduit").val();
@@ -46244,7 +46269,7 @@ $(function(){
 			afficher_bareme_produit();
 		}
 		
-	}else if($('#nomForm').val()=="modifierseuilalerte"){
+	}/*else if($('#nomForm').val()=="modifierseuilalerte"){
 		codeGcAssureur	= $("#codeGcAssureur").val();
 		codeProduit		= $("#codeProduit").val();
 		
@@ -46252,7 +46277,7 @@ $(function(){
 			afficher_garantie_produit();
 		}
 		
-	}else if($('#nomForm').val()=="Paramfacproduit"){
+	}*/else if($('#nomForm').val()=="Paramfacproduit"){
 		codeProduit		= $("#codeProduit").val();
 		
 		if(codeProduit > ""){
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/Modifparamseuilalerte/index.php b/Vue/Modifparamseuilalerte/index.php
index 8520a25d..71e2425a 100755
--- a/Vue/Modifparamseuilalerte/index.php
+++ b/Vue/Modifparamseuilalerte/index.php
@@ -1,45 +1,59 @@
-<?php $this->titre = "INTER SANTE - Seuil alerte consommation"; 
+<div class="page-content">
+    <div class="header-section mb-4">
+        <div class="bg-white p-3 shadow-sm border-start border-warning border-4" style="border-radius: var(--radius-md);">
+        
+            <div class="d-flex align-items-center mb-3">
+                <div class="icon-shape bg-warning-ghost text-warning rounded-circle me-3" style="width: 45px; height: 45px; display: flex; align-items: center; justify-content: center;">
+                    <i class="fas fa-edit fs-5"></i>
+                </div>
+                <div>
+                    <h4 id="titre-page" class="mb-0 fw-bold text-uppercase"><?= _("Modification des Seuils") ?></h4>
+                    <p class="text-muted small mb-0"><?= _("Ajustez les taux et forfaits d'alerte par produit de santé") ?></p>
+                </div>
+            </div>
 
-	$codeGcAssureur = isset($_SESSION['codeGcAssureur_S']) ? $_SESSION['codeGcAssureur_S'] : "";
-	$codeProduit 	= isset($_SESSION['codeProduit_S']) ? $_SESSION['codeProduit_S'] : "";
-?>
+            <div class="row g-2 align-items-end p-2 rounded-3 border" style="background-color: #fafafa;">
+                <div class="col-md-5">
+                    <label class="form-label small fw-bold text-muted ps-2 mb-1"><?= _("Garant") ?></label>
+                    <select class="form-select selectpicker w-100" data-live-search="true" id="codeGcAssureur" name="codeGcAssureur" required onchange="javascript:filtreproduitgarant();">
+                        <?php liste_options($garant, $codeGcAssureur); ?>
+                    </select>
+                </div>
 
-<script type="text/javascript">
+                <div class="col-md-5">
+                    <label class="form-label small fw-bold text-muted ps-2 mb-1"><?= _("Produit Santé") ?></label>
+                    <div id="div_produit">
+                        <select class="form-select selectpicker w-100" data-live-search="true" id="codeProduit" name="codeProduit" required>
+                            <?php liste_options($produits, $codeProduit); ?>
+                        </select>
+                    </div>
+                </div>
 
-</script>
+                <div class="col-md-2">
+                    <button class="btn btn-warning w-100 fw-bold text-white shadow-sm" onclick="javascript:afficher_garantie_produit();">
+                        <i class="fas fa-search me-2"></i><?= _("Actualiser") ?>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
 
-<legend> <?= _("Modification Seuil alerte consommation") ?> </legend>
+    <div id="div_garantieproduit" class="mt-4">
+        <?php if($codeGcAssureur != "" && $codeProduit != ""): ?>
+            <script>window.addEventListener('load', function() { afficher_garantie_produit(); });</script>
+        <?php else: ?>
+            <div class="text-center p-5 bg-white shadow-sm rounded-3">
+                <div class="icon-shape bg-light text-muted rounded-circle mx-auto mb-3" style="width: 60px; height: 60px; display: flex; align-items: center; justify-content: center;">
+                    <i class="fas fa-mouse-pointer fa-2x"></i>
+                </div>
+                <h6 class="text-muted"><?= _("Sélectionnez un couple Garant/Produit pour modifier les seuils") ?></h6>
+            </div>
+        <?php endif; ?>
+    </div>
+</div>
 
-<INPUT class="sr-only" TYPE="text" id="nomForm" NAME="nomForm" value="modifierseuilalerte" >
-
-<table class="table  table-condensed table-responsive" style="font-size:10pt;" >
-	<tbody>	
-		<tr> 
-			<td width="8%" class="required text-center"> <?= _("Garant") ?> </td>
-			<td width="40%">
-				<SELECT style="font-size:10pt; height:30px;" class="form-control selectpicker" data-live-search="true" id="codeGcAssureur" NAME="codeGcAssureur" required AUTOCOMPLETE="OFF" autofocus 
-				onChange="javascript:filtreproduitgarant();" >
-					<?php liste_options($garant, $codeGcAssureur); ?>						
-				</SELECT>	
-			</td>
-			
-			<td width="8%" class="required text-center"> <?= _("Produit") ?> </td>
-			<td width="32%">
-				<div id="div_produit">
-					<SELECT style="font-size:10pt; height:30px;" class="form-control selectpicker" data-live-search="true" id="codeProduit" NAME="codeProduit" required>
-						<?php liste_options($produits, $codeProduit); ?>						
-					</SELECT>
-				</div>
-			</td>
-			<td width="2%"></td>
-			<td>
-				<td width="10%" align="center"> <input class = "form-control btn btn-primary" 	style="font-size:10pt;" type="button" value="<?= _("Actualiser") ?>" onClick="javascript:afficher_garantie_produit();"> </td>
-			</td>
-			
-		</tr>
-	</tbody>
-</table>
-
-
-<div id="div_garantieproduit">
-</div>	
\ No newline at end of file
+<style>
+    .bg-warning-ghost { background-color: rgba(243, 156, 18, 0.1) !important; color: #e67e22 !important; }
+    .breadcrumb-item + .breadcrumb-item::before { content: "›"; }
+    .form-select.selectpicker + .btn { border: 2px solid #eee !important; border-radius: 8px; }
+</style>
\ No newline at end of file