diff --git a/Vue/Consulterproduit/index.php b/Vue/Consulterproduit/index.php
index 947afc99..2df129b9 100755
--- a/Vue/Consulterproduit/index.php
+++ b/Vue/Consulterproduit/index.php
@@ -10,7 +10,7 @@
             </div>
             <div class="flex-grow-1">
                 <h4 id="titre-page" class="mb-0 fw-bold text-uppercase"><?= $this->nettoyer($produit['libelle']) ?></h4>
-                <p class="text-muted small mb-0"><?= _("Code Produit :") ?> <span class="badge bg-light text-primary border"><?= $this->nettoyer($produit['codeProduit']) ?></span></p>
+                <p class="text-muted small mb-0"><?= _("Code Produit :") ?> <span class="badge bg-light text-muted fw-bold border"><?= $this->nettoyer($produit['codeProduit']) ?></span></p>
             </div>
         </div>
     </div>
diff --git a/Vue/Modifierproduit/index.php b/Vue/Modifierproduit/index.php
index b425362d..09e68ff8 100755
--- a/Vue/Modifierproduit/index.php
+++ b/Vue/Modifierproduit/index.php
@@ -1,88 +1,113 @@
-<?php $this->titre = "INTER SANTE - Modification Produit"; 
-
-	$codeModecalculPrime = $produit['codeModecalculPrime'];
+<?php 
+    $codeModecalculPrime = $produit['codeModecalculPrime'];
 ?>
 
-<input class="sr-only" type="text" id="nomForm" name="nomForm" value="modifierproduit" >
+<div class="page-content animate__animated animate__fadeIn">
+    
+    <div class="header-section mb-1">
+        <div class="d-flex align-items-center justify-content-between bg-white p-3 shadow border-start border-warning border-4" style="border-radius: var(--radius-md);">
+            <div class="d-flex align-items-center">
+                <div class="icon-shape bg-warning-light 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-4"></i>
+                </div>
+                <div>
+                    <h4 id="titre-page" class="mb-0 fw-bold text-uppercase fs-5 text-warning"><?= _("Modifier Produit Santé") ?></h4>
+                    <p class="text-muted small mb-0 d-none d-md-block"><?= _("Code :") ?> <span class="badge bg-light text-muted fw-bold border"><?= $this->nettoyer($produit['codeProduit']) ?></span> — <?= $this->nettoyer($produit['libelle']) ?></p>
+                </div>
+            </div>
 
-<input class="sr-only" type="text" id="idProduit" name="idProduit" value="<?= $this->nettoyer($produit['idProduit']) ?>" >
+            <div class="d-flex gap-2">
+                <button type="button" class="btn btn-light rounded-pill px-3 fw-bold text-muted border shadow-sm btn-sm" onclick="retour_liste_produits();">
+                    <i class="fas fa-times me-1"></i> <?= _("Annuler") ?>
+                </button>
+                <button type="button" id="btn_enreg" class="btn btn-warning rounded-pill px-4 fw-bold shadow-sm btn-sm text-light" onclick="enregistrer_modif_produit();">
+                    <i class="fas fa-save me-1"></i> <?= _("Enregistrer les modifications") ?>
+                </button>
+            </div>
+        </div>
+    </div>
 
-<input class="sr-only" type="text" id="codeGcAssureur" NAME="codeGcAssureur" value="<?= $this->nettoyer($produit['codeGcAssureur']) ?>" >
-<input class="sr-only" type="text" id="codeModecalculPrime" NAME="codeModecalculPrime" value="<?= $this->nettoyer($produit['codeModecalculPrime']) ?>" >
+    <form id="form_modifier_produit">
+        <input type="hidden" id="nomForm" name="nomForm" value="modifierproduit">
+        <input type="hidden" id="idProduit" name="idProduit" value="<?= $this->nettoyer($produit['idProduit']) ?>">
+        <input type="hidden" id="codeGcAssureur" name="codeGcAssureur" value="<?= $this->nettoyer($produit['codeGcAssureur']) ?>">
+        <input type="hidden" id="codeModecalculPrime" name="codeModecalculPrime" value="<?= $this->nettoyer($produit['codeModecalculPrime']) ?>">
 
+        <div class="card border-0 shadow-sm mb-1">
+            <div class="card-header bg-white py-3 border-bottom border-2 border-primary-light">
+                <h6 class="mb-0 fw-bold text-primary text-uppercase small"><i class="fas fa-cog me-2"></i><?= _("Paramètres Généraux") ?></h6>
+            </div>
+            <div class="card-body p-4">
+                <div class="row g-3">
+                    <div class="col-md-2">
+                        <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Code") ?></label>
+                        <input class="form-control bg-light border-2 fw-bold" type="text" id="codeProduit" name="codeProduit" value="<?= $this->nettoyer($produit['codeProduit']) ?>" readonly>
+                    </div>
+                    <div class="col-md-6">
+                        <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Nom du Produit") ?> <span class="text-danger">*</span></label>
+                        <input class="form-control majuscule border-2 shadow-none" type="text" id="libelle" name="libelle" value="<?= $this->nettoyer($produit['libelle']) ?>" required autofocus>
+                    </div>
+                    <div class="col-md-4">
+                        <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Plafond Famille") ?></label>
+                        <input class="form-control border-2 shadow-none fw-bold text-primary" type="text" id="plafondAdherent" name="plafondAdherent" 
+                               value="<?= format_N($this->nettoyer($produit['plafondAdherent'])) ?>" 
+                               onfocus="formatNumerique(this);" onkeyup="controle_numerique(this);" onblur="formatMonetaire(this);">
+                    </div>
+                    
+                    <div class="col-md-4">
+                        <label class="form-label small fw-bold text-muted text-uppercase"><?= _("État") ?> <span class="text-danger">*</span></label>
+                        <select class="form-select border-2 shadow-none" id="codeEtatProduit" name="codeEtatProduit" required>
+                            <?php liste_options($etatproduit,$this->nettoyer($produit['codeEtatProduit']),true); ?>
+                        </select>
+                    </div>
+                    <div class="col-md-4">
+                        <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Garant") ?></label>
+                        <select class="form-select bg-light border-2" disabled>
+                            <?php liste_options($garant,$this->nettoyer($produit['codeGcAssureur'])); ?>
+                        </select>
+                    </div>
+                    <div class="col-md-4">
+                        <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Mode Calcul Prime") ?></label>
+                        <select class="form-select bg-light border-2" disabled>
+                            <?php liste_options($calculprime,$this->nettoyer($produit['codeModecalculPrime']),false); ?>
+                        </select>
+                    </div>
+                </div>
+            </div>
+        </div>
 
-<legend> <?= _("Modifier Produit") ?> </legend>
-
-<table class="table table-responsive table-condensed" style="font-size:10pt;">
-	<tbody>	
-		<tr> 
-			<td width="5%"> Code </td>
-			<td width="15%"><INPUT class="form-control" TYPE="text" id="codeProduit" NAME="codeProduit" value="<?= $this->nettoyer($produit['codeProduit']) ?>" readonly></td>
-
-			<td width="8%" align="center" class="required"> <?= _("Nom") ?> </td>
-			<td ><INPUT style="font-size:10pt;" class="form-control majuscule" TYPE="text" id="libelle" NAME="libelle" required AUTOCOMPLETE="OFF" value="<?= $this->nettoyer($produit['libelle']) ?>" autofocus></td>
-		
-			<td align="center" > <?= _("Plafond Famille") ?> </td>
-			<td ><INPUT style="font-size:10pt;" class="form-control" TYPE="text" id="plafondAdherent" NAME="plafondAdherent" required AUTOCOMPLETE="OFF" onfocus="javascript:formatNumerique(this);" 
-			onkeyup="controle_numerique(this);" onblur="formatMonetaire(this);" value="<?= format_N($this->nettoyer($produit['plafondAdherent'])) ?>"></td>
-		</tr>
-		
-		<tr>
-			<td class="required">  <?= _("Etat") ?> </td>
-			<td  >
-				<SELECT style="font-size:10pt;" class="form-select" id="codeEtatProduit" NAME="codeEtatProduit" required AUTOCOMPLETE="OFF">
-					<?php liste_options($etatproduit,$this->nettoyer($produit['codeEtatProduit']),true); ?>						
-				</SELECT>	
-			</td>
-			
-			<td align="center"> <?= _("Garant") ?> </td>
-			<td width="45%">
-				<SELECT style="font-size:10pt;" class="form-control" disabled>
-					<?php liste_options($garant,$this->nettoyer($produit['codeGcAssureur'])); ?>						
-				</SELECT>	
-			</td>
-			
-			<td align="center">  <?= _("Mode Calcul Prime") ?> </td>
-			<td  width="16%">
-				<SELECT style="font-size:10pt; height:30px;" class="form-control" disabled>
-					<?php liste_options($calculprime,$this->nettoyer($produit['codeModecalculPrime']),false); ?>						
-				</SELECT>	
-			</td>
-		</tr>
-	</tbody>
-</table>
-
-<div id="div_modeprime" style="margin-bottom:10px;">
-	<?php if($codeModecalculPrime=="TA"): ?>
-	<table class="table table-responsive table-condensed">
-		<tbody>	
-			<tr> 
-				<td width="10%" class="required"><?= _("Type Tranche Âge")?></td>
-				<td >
-					<select class="form-control selectpicker" data-live-search="true" id="codeEnteteTrancheAge" NAME="codeEnteteTrancheAge" required AUTOCOMPLETE="OFF" autofocus onChange="javascript:trancheage();" style="font-size:12pt;">
-						<?php liste_options($typesTranches,$this->nettoyer($produit['codeEnteteTrancheAge'])); ?>						
-					</SELECT>
-				</td>
-			</tr>
-		</tbody>
-	</table>
-	
-	<div id="div_trancheage" class="col-md-12">			
-		
-	</div>
-	<?php else: ?>	
-	<div id="div_prime_lienparente" class="col-md-12">			
-	
-	</div>
-	<?php endif; ?>
+        <div class="card border-0 shadow-sm mb-1">
+            <div class="card-header bg-light py-3 border-bottom border-2 border-primary-light">
+                <h6 class="mb-0 fw-bold text-muted text-uppercase small"><i class="fas fa-calculator me-2"></i><?= _("Grille Tarifaire") ?></h6>
+            </div>
+            <div class="card-body p-4">
+                <div id="div_modeprime">
+                    <?php if($codeModecalculPrime=="TA"): ?>
+                        <div class="row align-items-center mb-1">
+                            <div class="col-md-3">
+                                <label class="form-label small fw-bold text-muted text-uppercase mb-0"><?= _("Catégorie Tranche d'Âge") ?> <span class="text-danger">*</span></label>
+                            </div>
+                            <div class="col-md-9">
+                                <select class="form-control selectpicker shadow-none" data-live-search="true" id="codeEnteteTrancheAge" name="codeEnteteTrancheAge" required onchange="trancheage();">
+                                    <?php liste_options($typesTranches,$this->nettoyer($produit['codeEnteteTrancheAge'])); ?>
+                                </select>
+                            </div>
+                        </div>
+                        <div id="div_trancheage" class="animate__animated animate__fadeIn">
+                            </div>
+                    <?php else: ?>
+                        <div id="div_prime_lienparente" class="animate__animated animate__fadeIn">
+                             </div>
+                    <?php endif; ?>
+                </div>
+            </div>
+        </div>
+    </form>
 </div>
 
-<table class="table table-responsive table-condensed table-bordered" style="font-size:12pt;">
-	<tbody>					
-		<tr style='background-color:white'> 
-			<td  > <input id="btn_enreg" name="btn_enreg"  class = "form-control btn btn-primary" type="button" value="<?= _("Enregistrer") ?>" onClick="javascript:enregistrer_modif_produit();" style='font-size:10pt;' > </td>
-			<td > </td>
-			<td  > <input class = "form-control btn btn-warning" type="button" value="<?= _("Annuler") ?>" onClick="javascript:retour_liste_produits();" style='font-size:10pt;' > </td>
-		</tr>
-	</tbody>
-</table>
\ No newline at end of file
+<style>
+    .bg-warning-light { background-color: rgba(255, 193, 7, 0.15) !important; }
+    .border-primary-light { border-color: rgba(33, 46, 83, 0.1) !important; }
+    .majuscule { text-transform: uppercase; }
+    .form-control:focus, .form-select:focus { border-color: var(--bs-warning); box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.1); }
+</style>
\ No newline at end of file