diff --git a/Vue/Paramfacturegarantcons/index.php b/Vue/Paramfacturegarantcons/index.php
index 65707cdf..fa011b85 100755
--- a/Vue/Paramfacturegarantcons/index.php
+++ b/Vue/Paramfacturegarantcons/index.php
@@ -1,179 +1,153 @@
-<?php $this->titre = "INTER SANTE - Nouveau Garant"; ?>
+<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-file-invoice-dollar fs-4"></i>
+            </div>
+            <div>
+                <h4 id="titre-page" class="mb-0 fw-bold text-uppercase"><?= _("Paramètres de Facturation") ?></h4>
+                <p class="text-muted small mb-0"><?= _("Garant :") ?> <span class="fw-bold text-primary"><?= $this->nettoyer($gc['libelle']) ?></span></p>
+            </div>
+        </div>
+    </div>
 
-<legend> <?= _("Consultation Paramètres de facturation du garant")." : ".$gc['libelle'] ?> </legend>
+    <input type="hidden" id="idGc" name="idGc" value="<?= $this->nettoyer($gc['id']) ?>">
+    <input type="hidden" id="paramFacGcProduit" name="paramFacGcProduit" value="<?= $paramFacGcProduit ?>">
+    <input type="hidden" id="nomForm" name="nomForm" value="parametrefacturationgarant">
 
-<?php 
-	$superUser = $_SESSION['superUser']; 
-	$codeSourceFondGarantAppelFond = $gc['codeSourceFondGarantAppelFond'];
-	$codeSourceFondGarantHonoraire = $gc['codeSourceFondGarantHonoraire'];
+    <div class="row g-4">
+        
+        <div class="col-lg-6">
+            <div class="card border-0 shadow-sm h-100">
+                <div class="card-header bg-light py-3 border-bottom border-primary-light">
+                    <h6 class="mb-0 fw-bold text-muted small text-uppercase"><i class="fas fa-shield-alt me-2 text-primary"></i><?= _("Fonds Sinistres & Caution") ?></h6>
+                </div>
+                <div class="card-body p-4">
+                    <div class="row g-3">
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Source Fonds Sinistres") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($sourcefonds,$gc['codeSourceFondGarantAppelFond'],false); ?></select>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Périodicité Sinistres") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($periodicitesappelfond,$gc['codePeriodiciteAppelFond'],false); ?></select>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Assiette Fonds Sinistres") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($assiettefonds,$gc['codeAssietteFacturationGarantAppelFond'],false); ?></select>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Périodicité Déficit") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($periodicitesfactDeficit,$gc['codePeriodiciteFacturationDeficit'],false); ?></select>
+                        </div>
+                        
+                        <hr class="my-3 opacity-10">
+                        
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Fraction Caution (Nombre mois/12)") ?></label>
+                            <div class="h5 fw-bold text-dark mb-0"><?= format_N($gc['nbMoisCaution']) ?></div>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Seuil Complément (%)") ?></label>
+                            <div class="h5 fw-bold text-primary mb-0"><?= format_N($gc['seuilComplementCaution']) ?> %</div>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Source Caution Permanent") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($sourcecaution,$gc['codeSourceFondGarantCaution'],false); ?></select>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Forfait Caution (HT)") ?></label>
+                            <div class="h5 fw-bold text-dark mb-0"><?= format_N($gc['forfaitCautionPermanant']) ?></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
 
+        <div class="col-lg-6">
+            <div class="card border-0 shadow-sm h-100">
+                <div class="card-header bg-light py-3 border-bottom border-primary-light">
+                    <h6 class="mb-0 fw-bold text-muted small text-uppercase"><i class="fas fa-hand-holding-usd me-2 text-primary"></i><?= _("Honoraires & Taux Commission") ?></h6>
+                </div>
+                <div class="card-body p-4">
+                    <div class="row g-3">
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Source Fond Honoraires") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($sourcehonoraire,$gc['codeSourceFondGarantHonoraire'],false); ?></select>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Périodicité Honoraires") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($periodicites,$gc['codePeriodiciteHonoraire'],false); ?></select>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Assiette Fond Honoraires") ?></label>
+                            <select class="form-select bg-light border-0 fw-bold" disabled><?php liste_options($assiettehonoraire,$gc['codeAssietteFacturationGarantHonoraire'],false); ?></select>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Forfait Honoraires (HT)") ?></label>
+                            <div class="h5 fw-bold text-dark mb-0"><?= format_N($gc['forfaitHonoraire']) ?></div>
+                        </div>
+                        
+                        <hr class="my-3 opacity-10">
+                        
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("TVA (%)") ?></label>
+                            <div class="h5 fw-bold text-dark mb-0"><?= format_N($gc['gcTauxTva']) ?> %</div>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Comm. Primes (%)") ?></label>
+                            <div class="h5 fw-bold text-primary mb-0"><?= format_N($gc['gcTauxCommissionGerant']) ?> %</div>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Comm. Provision/Sinistres") ?></label>
+                            <div class="h5 fw-bold text-primary mb-0"><?= format_N($gc['gcTauxFraisReel']) ?> %</div>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="form-label small text-muted fw-bold"><?= _("Taux Redressement (%)") ?></label>
+                            <div class="h5 fw-bold text-dark mb-0"><?= format_N($gc['gcTauxRedressement']) ?> %</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
 
-?>
+        <div class="col-lg-12">
+            <div class="card border-0 shadow-sm">
+                <div class="card-body p-4 bg-primary-ghost-light">
+                    <div class="row align-items-center g-3">
+                        <div class="col-md-3 border-end">
+                            <label class="small text-muted fw-bold text-uppercase d-block mb-1"><?= _("Familles Estimées") ?></label>
+                            <span class="h4 fw-bold mb-0"><?= format_N($gc['nbAdherent']) ?></span>
+                        </div>
+                        <div class="col-md-3 border-end">
+                            <label class="small text-muted fw-bold text-uppercase d-block mb-1"><?= _("Bénéficiaires Estimés") ?></label>
+                            <span class="h4 fw-bold mb-0"><?= format_N($gc['nbBeneficiaire']) ?></span>
+                        </div>
+                        <div class="col-md-6">
+                            <label class="small text-muted fw-bold text-uppercase d-block mb-1"><?= _("Provision Globale Garant (HT)") ?></label>
+                            <span class="h3 fw-bold text-primary mb-0"><?= format_N($gc['montantBudget']) ?></span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
 
-<input class="sr-only" type="text" id="idGc" name="idGc" value="<?= $this->nettoyer($gc['id']) ?>" >
-<input class="sr-only" type="text" id="paramFacGcProduit" name="paramFacGcProduit" value="<?= $paramFacGcProduit ?>" >
-<input class="sr-only" type="text" id="nomForm" name="nomForm" value="parametrefacturationgarant" >
-	
+        <div class="col-lg-12 mb-5">
+            <div class="d-flex justify-content-between align-items-center bg-white p-3 shadow-sm rounded-pill">
+                <button type="button" class="btn btn-light rounded-pill px-4 fw-bold text-muted shadow-xs" onClick="retour_fiche_garant();">
+                    <i class="fas fa-arrow-left me-2"></i><?= _("Retour Fiche") ?>
+                </button>
+                <button type="button" id="btn_enreg" class="btn btn-primary rounded-pill px-5 fw-bold shadow-sm" onClick="modifier_param_fact_garant('<?= $superUser ?>');">
+                    <i class="fas fa-edit me-2"></i><?= _("Modifier les Paramètres") ?>
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
 
-<table class="table table-responsive table-condensed" style='font-size:10pt;'>
-	<tbody>
-		<tr>
-			<td width="22%"> <?= _("Fraction Caution => Nb mois / 12") ?> </td>
-			<td>
-				<INPUT style='font-size:10pt;' class="form-control" TYPE="text" id="nbMoisCaution" NAME="nbMoisCaution" disabled
-				value="<?=format_N( $this->nettoyer($gc['nbMoisCaution'])) ?> " >
-			</td>
-			
-			<td colspan="2" width="5%"></td>
-			
-			<td width="22%"> <?= _("Seuil pour Complément Caution (%)") ?> </td>
-			<td> 
-				<INPUT style='font-size:10pt;'  class="form-control" id="seuilComplementCaution" NAME="seuilComplementCaution" 
-				value="<?= format_N($this->nettoyer($gc['seuilComplementCaution'])) ?>" disabled>
-			</td>
-		</tr>
-		
-		<tr>
-			<td > <?= _("Source Fond Sinistres") ?> </td>
-			<td> 
-				<select class="form-select" id="codeSourceFondGarantAppelFond" NAME="codeSourceFondGarantAppelFond"  style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($sourcefonds,$gc['codeSourceFondGarantAppelFond'],false); ?>						
-				</SELECT>
-			</td>
-		
-			<td colspan="2"></td>
-			
-			<td ><?= _("Périodicité Fond Sinistres") ?></td>
-			<td>
-				<select class="form-select" id="codePeriodiciteAppelFond" NAME="codePeriodiciteAppelFond" 
-					 style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($periodicitesappelfond,$gc['codePeriodiciteAppelFond'],false); ?>						
-				</SELECT>
-			</td>
-		</tr>
-		
-		<tr>
-			<td > <?= _("Assiette Fond Sinistres") ?> </td>
-			<td> 
-				<select class="form-select" id="codeAssietteFacturationGarantAppelFond" NAME="codeAssietteFacturationGarantAppelFond"  style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($assiettefonds,$gc['codeAssietteFacturationGarantAppelFond'],false); ?>						
-				</SELECT>
-			</td>
-			
-			<td colspan="2"></td>
-			
-			<td  > <?= _("Périodicité Facturation Déficit") ?> </td>
-			<td> 
-				<select class="form-select" id="codePeriodiciteFacturationDeficit" NAME="codePeriodiciteFacturationDeficit"  style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($periodicitesfactDeficit,$gc['codePeriodiciteFacturationDeficit'],false); ?>						
-				</SELECT>
-			</td>
-		</tr>
-					
-		<tr>
-			<td > <?= _("Source Fond Honoraires") ?> </td>
-			<td> 
-				<select class="form-select" id="codeSourceFondGarantHonoraire" NAME="codeSourceFondGarantHonoraire"  style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($sourcehonoraire,$gc['codeSourceFondGarantHonoraire'],false); ?>						
-				</SELECT>
-			</td>
-			
-			<td colspan="2"></td>
-			
-			<td ><?= _("Forfait Fond Honoraires (HT)") ?></td>
-			<td>
-				<INPUT  style='font-size:10pt;' class="form-control" TYPE="text" id="forfaitHonoraire" 
-				NAME="forfaitHonoraire" value="<?= format_N($this->nettoyer($gc['forfaitHonoraire'])) ?>" disabled >
-			</td>
-		</tr>
-		
-		<tr>
-			<td > <?= _("Assiette Fond Honoraires") ?> </td>
-			<td>
-				<select class="form-select" id="codeAssietteFacturationGarantHonoraire" NAME="codeAssietteFacturationGarantHonoraire"  style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($assiettehonoraire,$gc['codeAssietteFacturationGarantHonoraire'],false); ?>						
-				</SELECT>
-			</td>
-			
-			<td colspan="2"></td>
-			
-			<td > <?= _("Périodicité Fond Honoraires") ?> </td>
-			<td>
-				<select class="form-select" id="codePeriodiciteHonoraire" NAME="codePeriodiciteHonoraire" 
-				 style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($periodicites,$gc['codePeriodiciteHonoraire'],false); ?>						
-				</SELECT>
-			</td>
-		</tr>
-		
-		<tr>
-			<td > <?= _("Nombre Total Famille Estimé") ?> </td>
-			<td> <INPUT style='font-size:10pt;'  class="form-control" id="nbAdherent" NAME="nbAdherent" TYPE="text" value="<?= format_N($this->nettoyer($gc['nbAdherent'])) ?>" disabled></td>
-			
-			<td colspan="2"></td>
-			
-			<td > <?= _("Nombre Total Bénéficiaire Estimé") ?> </td>
-			<td> <INPUT style='font-size:10pt;'  class="form-control" id="nbBeneficiaire" NAME="nbBeneficiaire" TYPE="text" value="<?= format_N($this->nettoyer($gc['nbBeneficiaire'])) ?>" disabled></td>
-		</tr>	
-		
-		<tr>
-			<td > <?= _("Source Fond Caution Permanente") ?> </td>
-			<td> 
-				<select class="form-select" id="codeSourceFondGarantCaution" NAME="codeSourceFondGarantCaution"  style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($sourcecaution,$gc['codeSourceFondGarantCaution'],false); ?>						
-				</SELECT>
-			</td>
-			
-			<td colspan="2"></td>
-			
-			<td > <?= _("Forfait Caution Permanente (HT)") ?> </td>
-			<td >
-				<INPUT  style='font-size:10pt;' class="form-control majuscule" TYPE="text" id="forfaitCautionPermanant" 
-				NAME="forfaitCautionPermanant"  value="<?= format_N($this->nettoyer($gc['forfaitCautionPermanant'])) ?>" disabled>
-			</td>
-		</tr>
-		
-		<tr>
-			<td > <?= _("Assiette Fond Caution Permanente") ?> </td>
-			<td>
-				<select class="form-select" id="codeAssietteFacturationGarantCaution" NAME="codeAssietteFacturationGarantCaution"  style="font-size:12pt; height:30px;" disabled>
-					<?php liste_options($assiettecaution,$gc['codeAssietteFacturationGarantCaution'],false); ?>						
-				</SELECT>
-			</td>
-			
-			<td colspan="2"></td>
-			
-			<td ><?= _("Montant Provision Garant (HT)") ?></td>
-			<td >
-				<INPUT  style='font-size:10pt;' class="form-control" TYPE="text" name="montantBudget" id="montantBudget" class="form-control" 
-				value="<?= format_N($this->nettoyer($gc['montantBudget'])) ?>" disabled >
-			</td>
-		</tr>
-		
-		<tr>
-			<td > <?= _("Taux Tva (%)") ?> </td>
-			<td> <INPUT style='font-size:10pt;'  class="form-control" id="gcTauxTva" NAME="gcTauxTva" TYPE="number" value="<?= $this->nettoyer($gc['gcTauxTva']) ?>" disabled></td>
-			
-			<td colspan="2"></td>
-			
-			<td > <?= _("Taux Commission Primes (%)") ?> </td>
-			<td> <INPUT style='font-size:10pt;'  class="form-control" id="gcTauxCommissionGerant" NAME="gcTauxCommissionGerant" TYPE="number" value="<?= $this->nettoyer($gc['gcTauxCommissionGerant']) ?>" disabled></td>
-		</tr>	
-		
-		<tr>
-			<td > <?= _("Taux Commission Provision/Sinistres (%)") ?> </td>
-			<td> <INPUT style='font-size:10pt;'  class="form-control" id="gcTauxFraisReel" NAME="gcTauxFraisReel" TYPE="number" value="<?= $this->nettoyer($gc['gcTauxFraisReel']) ?>" disabled></td>
-			
-			<td colspan="2"></td>
-			
-			<td > <?= _("Taux Redressement (%)") ?> </td>
-			<td> <INPUT style='font-size:10pt;'  class="form-control" id="gcTauxRedressement" NAME="gcTauxRedressement" TYPE="number" step="1" value="<?= $this->nettoyer($gc['gcTauxRedressement']) ?>" disabled></td>
-		</tr>
-		
-		<tr> 
-			<td colspan="2"> <input id="btn_enreg" name="btn_enreg"  onClick="modifier_param_fact_garant('<?= $superUser ?>');" class = "form-control btn btn-primary" type="button" value="<?= _("Modifier") ?>" style='font-size:10pt;' > </td>
-			<td colspan="2"></td>
-			<td colspan="2"> <input class = "form-control btn btn-warning" type="button" value="<?= _("Annuler") ?>" onClick="javascript:retour_fiche_garant();" style='font-size:9pt;' > </td>
-		</tr>
-	</tbody>
-</table>
+<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; }
+    .border-primary-light { border-color: rgba(33, 46, 83, 0.1) !important; }
+    .form-select:disabled { opacity: 1; color: #212e53; cursor: default; font-weight: 700; padding: 0.375rem 0; }
+</style>
\ No newline at end of file