diff --git a/Vue/Modifierbaremepriseencharge/index.php b/Vue/Modifierbaremepriseencharge/index.php
index 284c0963..1b279b31 100755
--- a/Vue/Modifierbaremepriseencharge/index.php
+++ b/Vue/Modifierbaremepriseencharge/index.php
@@ -1,146 +1,134 @@
 <?php 
-	$this->titre = "INTER SANTE - Modifier un Barème de prise en charge initial"; 
-	
-	$archiver = $this->nettoyer($bareme['archiver']);
-	
-	$superUser = $_SESSION['superUser'];
+    $archiver = $this->nettoyer($bareme['archiver']);
+    $superUser = $_SESSION['superUser'];
+    $idBareme = $this->nettoyer($bareme['id']);
 ?>
 
-<legend> <?= _("Modifier un Barème de prise en charge initial") ?> </legend>
+<div class="page-content animate__animated animate__fadeIn">
+    <div class="header-section mb-4">
+        <div class="d-flex align-items-center justify-content-between 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">
+                <div class="icon-shape bg-warning-ghost text-warning rounded-circle me-3" style="width: 48px; height: 48px; 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"><?= _("Modifier le Barème") ?></h4>
+                    <p class="text-muted small mb-0"><?= _("ID Barème :") ?> <span class="fw-bold text-dark"><?= $idBareme ?></span></p>
+                </div>
+            </div>
+            <button class="btn btn-light border rounded-pill px-3 fw-bold btn-sm shadow-xs" onclick="retour_liste_bareme();">
+                <i class="fas fa-arrow-left me-1"></i> <?= _("Retour") ?>
+            </button>
+        </div>
+    </div>
 
+    <input type="hidden" id="idBaremePriseEnCharge" name="idBaremePriseEnCharge" value="<?= $idBareme ?>">
+    <input type="hidden" id="nomForm" name="nomForm" value="frmmodifierbareme">
+    <input type="hidden" id="codeGcAssureur" name="codeGcAssureur" value="<?= $this->nettoyer($bareme['codeGcAssureur']);?>">
+    <input type="hidden" id="codeProduit" name="codeProduit" value="<?= $this->nettoyer($bareme['codeProduit']);?>">
 
-<INPUT TYPE="text" class="sr-only" id = "idBaremePriseEnCharge" name = "idBaremePriseEnCharge" value="<?= $this->nettoyer($bareme['id']);?>">
-<INPUT TYPE="text" class="sr-only" id = "nomForm" name = "nomForm" value="frmmodifierbareme">
+    <div class="card border-0 shadow-sm mb-4 opacity-75">
+        <div class="card-header bg-light py-2">
+            <h6 class="mb-0 fw-bold text-muted small text-uppercase"><i class="fas fa-history me-2"></i><?= _("Valeurs Actuelles") ?></h6>
+        </div>
+        <div class="card-body p-3 bg-light-subtle">
+            <div class="row g-3">
+                <div class="col-md-4">
+                    <label class="form-label smaller fw-bold text-muted"><?= _("Garant") ?></label>
+                    <input type="text" class="form-control form-control-sm border-0 bg-white fw-bold" value="<?= $this->nettoyer($bareme['garant']) ?>" disabled>
+                </div>
+                <div class="col-md-4">
+                    <label class="form-label smaller fw-bold text-muted"><?= _("Produit") ?></label>
+                    <input type="text" class="form-control form-control-sm border-0 bg-white fw-bold" value="<?= $this->nettoyer($bareme['produit']) ?>" disabled>
+                </div>
+                <div class="col-md-4">
+                    <label class="form-label smaller fw-bold text-muted"><?= _("Libellé") ?></label>
+                    <input type="text" class="form-control form-control-sm border-0 bg-white fw-bold" value="<?= $this->nettoyer($bareme['libelle']) ?>" disabled>
+                </div>
+            </div>
+        </div>
+    </div>
 
-<table class="table table-responsive table-condensed" style="font-size:10pt;">
-	<tbody>	
-		<tr>
-			<td align="center" colspan="6" style="font-size:12pt; background-color: green; color: white; font-weight: bold;">
-				<?= _("ANCIENNES VALEURS DU BAREME") ?>
-			</td>
-		</tr>
-		<tr> 
-			<td width="10%" class="text-center"> <?= _("Garant") ?> </td>
-			<td colspan="3">
-				<SELECT style="font-size:10pt; height:30px;" class="form-select" disabled>
-					<?= liste_options($garant,$this->nettoyer($bareme['codeGcAssureur']),true) ?>						
-				</SELECT>	
-			</td>
-			
-			<td width="13%" class="text-center"> <?= _("Produit") ?> </td>
-			<td width="30%">
-				<SELECT style="font-size:10pt; height:30px;" class="form-select" disabled>
-					<?php liste_options($produits,$this->nettoyer($bareme['codeProduit']),true); ?>						
-				</SELECT>
-			</td>
-		</tr>
-		<tr> 
-			<td width="10%" align="center"> <?= _("Taux Couverture") ?> </td>
-			<td width="10%" >
-				<select class="form-select" disabled>
-                    <?= liste_options($taux,$this->nettoyer($bareme['idTauxCouverture']),true) ?>
-                </select>
-			</td>
-			
-			<td width="10%" align="center"> <?= _("Territoire") ?> </td>
-			<td>
-				<select class="form-select" disabled>
-                    <?= liste_options($territoire,$this->nettoyer($bareme['codeTerritoire']),true) ?>
-                </select>
-			</td>
+    <div class="card border-0 shadow-sm overflow-hidden border-top border-primary border-4">
+        <div class="card-header bg-white py-3">
+            <h6 class="mb-0 fw-bold text-primary text-uppercase small"><i class="fas fa-sync me-2"></i><?= _("Mise à jour des paramètres") ?></h6>
+        </div>
+        <div class="card-body p-4">
+            <form id="form_modifier_bareme">
+                <div class="row g-4 mb-4 p-3 bg-primary-ghost rounded-3">
+                    <div class="col-md-3">
+                        <label class="form-label small fw-bold text-muted required"><?= _("Taux Couverture") ?></label>
+                        <select name="idTauxCouverture" id="idTauxCouverture" class="selectpicker form-control border-2" required onchange="libelleTauxBareme(this); majTicketModerateur();">
+                            <?= liste_options($taux,$this->nettoyer($bareme['idTauxCouverture']),true) ?>
+                        </select>
+                    </div>
+                    <div class="col-md-4">
+                        <label class="form-label small fw-bold text-muted required"><?= _("Territoire") ?></label>
+                        <select name="codeTerritoire" id="codeTerritoire" class="selectpicker form-control border-2" data-live-search="true" onchange="libelleTerritoireBareme(this.value);" required>
+                            <?= liste_options($territoire,$this->nettoyer($bareme['codeTerritoire']),true) ?>
+                        </select>
+                    </div>
+                    <div class="col-md-5">
+                        <label class="form-label small fw-bold text-muted"><?= _("Souscripteur") ?></label>
+                        <div id="div_souscripteur">
+                            <select name="numeroClient" id="numeroClient" class="selectpicker form-control border-2" data-live-search="true" onchange="libelleClientBareme(this);">
+                                <?= liste_options($clients,$this->nettoyer($bareme['numeroClient']),false) ?>
+                            </select>
+                        </div>
+                    </div>
+                </div>
 
-			<td width="10%" align="center" > <?= _("Souscripteur") ?> </td>
-			<td>
-				<select class="form-select" disabled>
-					<?= liste_options($clients,$this->nettoyer($bareme['numeroClient']),false) ?>
-				</select>
-			</td>
-		</tr>
-		<tr> 
-			<td width="10%" align="center" > <?= _("Libellé") ?> </td>
-			<td colspan="5"><INPUT style="font-size:10pt;" class="form-control" TYPE="text" value="<?= $this->nettoyer($bareme['libelle'])?>" disabled></td>
-		</tr> 
-		
-		<tr> 
-			<td width="10%" align="center"> <?= _("Observation") ?> </td>
-			<td colspan="5"><INPUT style="font-size:10pt;" class="form-control" TYPE="text" value="<?= $this->nettoyer($bareme['observationBareme'])?>" disabled></td>
-		</tr> 
-	</tbody>
-</table>	
+                <div class="row g-3 mb-3">
+                    <div class="col-md-12">
+                        <label class="form-label small fw-bold text-muted required"><?= _("Libellé") ?></label>
+                        <input class="form-control border-2 shadow-none fw-bold majuscule py-2" type="text" id="libelle" name="libelle" value="<?= $this->nettoyer($bareme['libelle'])?>">
+                    </div>
+                </div>
 
-<INPUT TYPE="text" class="sr-only" id="codeGcAssureur" NAME="codeGcAssureur" value="<?= $this->nettoyer($bareme['codeGcAssureur']);?>">
-<INPUT TYPE="text" class="sr-only" id="codeProduit" NAME="codeProduit" value="<?= $this->nettoyer($bareme['codeProduit']);?>">
+                <div class="row g-3 mb-4">
+                    <div class="col-md-12">
+                        <label class="form-label small fw-bold text-muted"><?= _("Observation") ?></label>
+                        <textarea class="form-control border-2 shadow-none majuscule" id="observationBareme" name="observationBareme" rows="2"><?= $this->nettoyer($bareme['observationBareme'])?></textarea>
+                    </div>
+                </div>
 
-<table class="table table-responsive table-condensed" style="font-size:10pt;">
-	<tbody>	
-		<tr>
-			<td align="center" colspan="6" style="font-size:12pt; background-color: green; color: white; font-weight: bold;">
-				<?= _("NOUVELLES VALEURS DU BAREME") ?>
-			</td>
-		</tr>
-		<tr> 
-			<td width="10%" class="text-center"> <?= _("Garant") ?> </td>
-			<td colspan="3">
-				<SELECT style="font-size:10pt; height:30px;" class="form-control" disabled >
-					<?= liste_options($garant,$this->nettoyer($bareme['codeGcAssureur']),false) ?>						
-				</SELECT>	
-			</td>
-			
-			<td width="13%" class="text-center"> <?= _("Produit") ?> </td>
-			<td width="30%">
-				<div id="div_produit">
-					<SELECT style="font-size:10pt; height:30px;" class="form-control" disabled >
-						<?php liste_options($produits,$this->nettoyer($bareme['codeProduit']),false); ?>						
-					</SELECT>	
-				</div>
-			</td>
-		</tr>
-		<tr> 
-			<td width="10%" class="required" align="center"> <?= _("Taux Couverture") ?> </td>
-			<td width="10%" >
-				<select name="idTauxCouverture" id="idTauxCouverture" class="form-select" required 
-				onchange="libelleTauxBareme(this);majTicketModerateur();">
-                    <?= liste_options($taux,$this->nettoyer($bareme['idTauxCouverture']),true) ?>
-                </select>
-			</td>
-			
-			<td width="10%" align="center" class="required" > <?= _("Territoire") ?> </td>
-			<td>
-				<select name="codeTerritoire" id="codeTerritoire" class="form-control selectpicker" data-live-search="true" 
-				onchange="libelleTerritoireBareme(this.value);" required >
-                    <?= liste_options($territoire,$this->nettoyer($bareme['codeTerritoire']),true) ?>
-                </select>
-			</td>
+                <div class="row g-3 border-top pt-4 mt-2">
+                    <div class="col-md-8">
+                        <button id="btn_enreg" type="button" class="btn btn-primary w-100 py-3 rounded-pill fw-bold shadow-sm" onclick="modifier_bareme();">
+                            <i class="fas fa-save me-2"></i> <?= _("Enregistrer les modifications") ?>
+                        </button>
+                    </div>
+                    <div class="col-md-4">
+                        <button type="button" class="btn btn-warning-light w-100 py-3 rounded-pill fw-bold text-warning" onclick="retour_liste_bareme();">
+                            <?= _("Fermer") ?>
+                        </button>
+                    </div>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
 
-			<td width="10%" align="center" > <?= _("Souscripteur") ?> </td>
-			<td>
-				<div id="div_souscripteur">
-					<select name="numeroClient" id="numeroClient" class="form-control selectpicker" data-live-search="true" 
-					onchange="libelleClientBareme(this);">
-						<?= liste_options($clients,$this->nettoyer($bareme['numeroClient']),false) ?>
-					</select>
-				<div>
-			</td>
-			
-		</tr>
-		<tr> 
-			<td width="10%" align="center" class="required"> <?= _("Libellé") ?> </td>
-			<td colspan="5"><INPUT style="font-size:10pt;" class="form-control" TYPE="text" id="libelle" NAME="libelle" value="<?= $this->nettoyer($bareme['libelle'])?>"></td>
-		</tr> 
-		
-		<tr> 
-			<td width="10%" align="center"> <?= _("Observation") ?> </td>
-			<td colspan="5"><INPUT style="font-size:10pt;" class="form-control" TYPE="text" id="observationBareme" NAME="observationBareme" value="<?= $this->nettoyer($bareme['observationBareme'])?>"></td>
-		</tr> 
-		<tr> 
-			<td colspan="3" > <input id="btn_enreg" name="btn_enreg"  class = "form-control btn btn-primary" type="button" value="<?= _("Enregistrer") ?>" onClick="javascript:modifier_bareme();" style='font-size:10pt;' > </td>
-
-			<td colspan="2"> </td>
-			<td> <input class = "form-control btn btn-warning" type="button" value="<?= _("Fermer") ?>" onClick="javascript:retour_liste_bareme();" style='font-size:10pt;' > </td>
-		</tr>
-	</tbody>
-</table>	
+<style>
+    .bg-warning-ghost { background-color: rgba(255, 193, 7, 0.1); }
+    .bg-primary-ghost { background-color: rgba(33, 46, 83, 0.05); }
+    .btn-warning-light { background-color: rgba(255, 193, 7, 0.08); border: 1px solid rgba(255, 193, 7, 0.2); }
+    .smaller { font-size: 0.75rem; }
+    
+    /* Harmonisation SelectPicker */
+    .bootstrap-select .btn.dropdown-toggle {
+        height: 42px !important;
+        border-width: 2px !important;
+        background-color: #fff !important;
+        font-weight: 600 !important;
+    }
+</style>
 
+<script>
+    document.addEventListener("DOMContentLoaded", function() {
+        actualiserSelectPicker('.selectpicker');
+    });
+</script>