diff --git a/Vue/Paramfactureproduitgarantcons/index.php b/Vue/Paramfactureproduitgarantcons/index.php
index f3d0dd47..8765f184 100755
--- a/Vue/Paramfactureproduitgarantcons/index.php
+++ b/Vue/Paramfactureproduitgarantcons/index.php
@@ -1,28 +1,70 @@
-<?php $this->titre = "INTER SANTE - Paramètres facturation produits garant"; 
-		$superUser = $_SESSION['superUser']; 
-		
-		$codeProduit = $_SESSION['codeProduit_C'];
+<?php 
+    $this->titre = "INTER SANTE - Paramètres facturation produits garant"; 
+    $superUser = $_SESSION['superUser']; 
+    $codeProduit = $_SESSION['codeProduit_C'];
 ?>
 
-<legend> <?= _("PARAMETRES FACTURATION PAR PRODUIT GARANT")." : ".$_SESSION['nomGcAssureur_C'] ?> </legend>
+<div class="page-content animate__animated animate__fadeIn">
+    
+    <div class="header-section mb-4">
+        <div class="d-flex align-items-center bg-white p-3 shadow-sm border-start border-primary border-4" style="border-radius: var(--radius-md);">
+            <div class="icon-shape bg-primary-ghost text-primary rounded-circle me-3" style="width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;">
+                <i class="fas fa-boxes fs-4"></i>
+            </div>
+            <div>
+                <h4 id="titre-page" class="mb-0 fw-bold text-uppercase"><?= _("Facturation Produit Garant") ?></h4>
+                <p class="text-muted small mb-0"><?= _("Garant :") ?> <span class="fw-bold text-primary"><?= $_SESSION['nomGcAssureur_C'] ?></span></p>
+            </div>
+        </div>
+    </div>
 
-<input class="sr-only" type="text" id="nomForm" name="nomForm" value="Paramfacproduit" >
+    <input type="hidden" id="nomForm" name="nomForm" value="Paramfacproduit">
 
-<table class="table  table-condensed table-responsive" style="font-size:10pt;" >
-	<tbody>	
-		<tr> 
-			<td width="10%" class="required"> <?= _("Produit") ?> </td>
-			<td >
-				<SELECT style="font-size:10pt; height:30px;" class="form-control selectpicker" data-live-search="true" 
-				id="codeProduit" NAME="codeProduit" required autofocus onchange="javascript:parametre_produit();">
-					<?php liste_options($produits, $codeProduit); ?>						
-				</SELECT>	
-			</td>
-		</tr>
-	</tbody>
-</table>
+    <div class="card border-0 shadow-sm mb-4">
+        <div class="card-body p-4 bg-primary-ghost-light">
+            <div class="row align-items-center">
+                <div class="col-md-2 text-md-end">
+                    <label class="form-label mb-md-0 fw-bold text-uppercase small text-muted"><?= _("Choisir un Produit") ?> :</label>
+                </div>
+                <div class="col-md-6">
+                    <div class="input-group shadow-sm">
+                        <span class="input-group-text bg-white border-end-0"><i class="fas fa-cube text-primary"></i></span>
+                        <select class="form-control selectpicker border-start-0 w-100" 
+                                data-live-search="true" 
+                                id="codeProduit" 
+                                name="codeProduit" 
+                                onchange="parametre_produit();" 
+                                autofocus>
+                            <?php liste_options($produits, $codeProduit); ?>
+                        </select>
+                    </div>
+                </div>
+                <div class="col-md-4">
+                    <div id="loader_produit" class="d-none animate__animated animate__fadeIn">
+                        <div class="spinner-border spinner-border-sm text-primary me-2" role="status"></div>
+                        <span class="small text-primary fw-bold"><?= _("Chargement des paramètres...") ?></span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
 
-<div id="div_parametres">
-
-	
+    <div id="div_parametres" class="animate__animated animate__fadeInUp">
+        <div class="text-center p-5 text-muted opacity-50">
+            <i class="fas fa-hand-pointer fa-3x mb-3"></i>
+            <p><?= _("Veuillez sélectionner un produit pour afficher ses paramètres de facturation.") ?></p>
+        </div>
+    </div>
 </div>
+
+<style>
+    .bg-primary-ghost { background-color: rgba(33, 46, 83, 0.08) !important; }
+    .bg-primary-ghost-light { background-color: rgba(33, 46, 83, 0.02) !important; }
+    
+    /* Style pour le selectpicker personnalisé */
+    .bootstrap-select .btn {
+        border-width: 2px !important;
+        padding-top: 8px !important;
+        padding-bottom: 8px !important;
+    }
+</style>