diff --git a/Vue/Ajaxajouterbaremeaccessoiregarant/index.php b/Vue/Ajaxajouterbaremeaccessoiregarant/index.php
index 28cadf4c..2428d261 100755
--- a/Vue/Ajaxajouterbaremeaccessoiregarant/index.php
+++ b/Vue/Ajaxajouterbaremeaccessoiregarant/index.php
@@ -1,5 +1,5 @@
 <div class="card border-0 shadow-sm mb-4 border-start border-primary border-4 animate__animated animate__fadeIn">
-    <div class="card-header bg-wlight py-3 border-bottom">
+    <div class="card-header bg-light py-3 border-bottom">
         <h6 class="card-title mb-0 fw-bold text-primary text-uppercase small">
             <i class="fas fa-plus-circle me-2"></i><?= _("Ajouter des données") ?>
         </h6>
@@ -8,50 +8,55 @@
         <form id="formData">
             <div class="row g-3 mb-3">
                 <div class="col-md-4">
-                    <label class="form-label small fw-bold text-muted text-uppercase required"><?= _("Type Contrat") ?></label>
+                    <label class="form-label small fw-bold text-muted required"><?= _("Type Contrat") ?></label>
                     <div class="input-group">
                         <span class="input-group-text bg-light text-primary"><i class="fas fa-file-contract"></i></span>
-                        <select class="form-select" id="codeTypeContrat" name="codeTypeContrat" required autocomplete="off" onchange="javascript:affiche_prime_min_garant();">
+                        <select class="form-select border-2 border-start-0" 
+                                id="codeTypeContrat" 
+                                name="codeTypeContrat" 
+                                required autocomplete="off" 
+                                onchange="javascript:affiche_prime_min_garant();">
                             <?php liste_options($typecontrat, "", false); ?>
                         </select>
                     </div>
                 </div>
 
                 <div class="col-md-4">
-                    <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Prime Mini") ?></label>
+                    <label class="form-label small fw-bold text-muted"><?= _("Prime Mini") ?></label>
                     <div id="div_prime_mini">
                         <div class="input-group">
                             <span class="input-group-text bg-light"><i class="fas fa-arrow-down text-muted"></i></span>
-                            <input class="form-control text-center bg-light fw-bold" type="text" value="0" disabled>
+                            <input class="form-control text-center bg-light fw-bold border-2 border-start-0" 
+                                type="text" value="0" disabled>
                         </div>
                     </div>
                 </div>
 
                 <div class="col-md-4">
-                    <label class="form-label small fw-bold text-muted text-uppercase required"><?= _("Forfait") ?></label>
+                    <label class="form-label small fw-bold text-muted required"><?= _("Montant Accessoire") ?></label>
                     <div class="input-group">
                         <span class="input-group-text bg-light text-success"><i class="fas fa-money-bill-wave"></i></span>
-                        <input class="form-control text-center fw-bold" type="text" value="0" id="accessoireForfait" name="accessoireForfait" onkeyup="controle_numerique(this);" onblur="formatMonetaire(this);">
+                        <input class="form-control text-center fw-bold border-2 border-start-0" type="text" value="0" id="accessoireForfait" name="accessoireForfait" onkeyup="controle_numerique(this);" onblur="formatMonetaire(this);">
                     </div>
                 </div>
             </div>
 
             <div class="row g-3">
                 <div class="col-md-4">
-                    <label class="form-label small fw-bold text-muted text-uppercase required"><?= _("Application") ?></label>
+                    <label class="form-label small fw-bold text-muted required"><?= _("Application") ?></label>
                     <div class="input-group">
                         <span class="input-group-text bg-light text-primary"><i class="fas fa-cog"></i></span>
-                        <select class="form-select" id="codeApplication" name="codeApplication" required autocomplete="off" onchange="javascript:affiche_prime_min_garant();">
+                        <select class="form-select border-2 border-start-0" id="codeApplication" name="codeApplication" required autocomplete="off" onchange="javascript:affiche_prime_min_garant();">
                             <?php liste_options($application, "", false); ?>
                         </select>
                     </div>
                 </div>
 
                 <div class="col-md-4">
-                    <label class="form-label small fw-bold text-muted text-uppercase required"><?= _("Prime Maxi") ?></label>
+                    <label class="form-label small fw-bold text-muted required"><?= _("Prime Maxi") ?></label>
                     <div class="input-group">
                         <span class="input-group-text bg-light text-primary"><i class="fas fa-arrow-up"></i></span>
-                        <input class="form-control text-center fw-bold text-primary" type="text" value="0" id="primeMax" name="primeMax" required autocomplete="off" onkeyup="controle_numerique(this);" onblur="formatMonetaire(this);" onchange="controle_primeMax();">
+                        <input class="form-control text-center fw-bold text-primary border-2 border-start-0" type="text" value="0" id="primeMax" name="primeMax" required autocomplete="off" onkeyup="controle_numerique(this);" onblur="formatMonetaire(this);" onchange="controle_primeMax();">
                     </div>
                 </div>
 
@@ -65,25 +70,4 @@
             </div>
         </form>
     </div>
-</div>
-
-<style>
-    /* Style pour les labels obligatoires */
-    .form-label.required::after {
-        content: " *";
-        color: #dc3545;
-        font-weight: bold;
-    }
-    
-    /* Harmonisation des hauteurs des input-groups */
-    .input-group-text {
-        min-width: 45px;
-        justify-content: center;
-        border-color: #dee2e6;
-    }
-    
-    .form-control:focus, .form-select:focus {
-        border-color: #0d6efd;
-        box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.1);
-    }
-</style>
\ No newline at end of file
+</div>
\ No newline at end of file
diff --git a/Vue/Ajaxmodifierbaremeaccessoiregarant/index.php b/Vue/Ajaxmodifierbaremeaccessoiregarant/index.php
index 24cf699b..8683b807 100755
--- a/Vue/Ajaxmodifierbaremeaccessoiregarant/index.php
+++ b/Vue/Ajaxmodifierbaremeaccessoiregarant/index.php
@@ -1,53 +1,77 @@
-<form id="formData">
-	<legend id="titre_formData"><?= _("Modification des données") ?></legend>
-	<INPUT class="sr-only" TYPE="text" id = "id" name = "id" value="<?=$bareme['id']?>">
-	<INPUT class="sr-only" TYPE="text" id = "codeTypeContrat" name = "codeTypeContrat" value="<?=$bareme['codeTypeContrat']?>">
-	<INPUT class="sr-only" TYPE="text" id = "primeMin" name = "primeMin" value="<?=$bareme['primeMin']?>">
-	<INPUT class="sr-only" TYPE="text" id = "codeApplication" name = "codeApplication" value="<?=$bareme['codeApplication']?>">
-	<INPUT class="sr-only" TYPE="text" id = "primeMax" name = "primeMax" value="<?=$bareme['primeMax']?>">
+<div class="card border-0 shadow-sm mb-4 border-start border-warning border-4 animate__animated animate__fadeIn">
+    <div class="card-header bg-light py-3 border-bottom">
+        <h6 class="card-title mb-0 fw-bold text-warning text-uppercase small">
+            <i class="fas fa-edit me-2"></i><?= _("Modification des données") ?>
+        </h6>
+    </div>
+    <div class="card-body p-4">
+        <form id="formData">
+            <input class="sr-only" type="text" id="id" name="id" value="<?=$bareme['id']?>">
+            <input class="sr-only" type="text" id="codeTypeContrat" name="codeTypeContrat" value="<?=$bareme['codeTypeContrat']?>">
+            <input class="sr-only" type="text" id="primeMin" name="primeMin" value="<?=$bareme['primeMin']?>">
+            <input class="sr-only" type="text" id="codeApplication" name="codeApplication" value="<?=$bareme['codeApplication']?>">
+            <input class="sr-only" type="text" id="primeMax" name="primeMax" value="<?=$bareme['primeMax']?>">
 
-	<table class="table table-responsive table-condensed">
-		<tbody>	
-			<tr> 
-				<td width="10%" align="center" ><?= _("Type Contrat") ?></td>
-				<td>
-					<select class="form-select text-center" disabled>
-						<?php liste_options($typecontrat,$this->nettoyer($bareme['codeTypeContrat']),true); ?>						
-					</SELECT>						
-				</td>
-				
-				<td width="8%" align="center" ><?= _("Prime Mini") ?></td>
-				<td width="20%" >
-					<div id="div_prime_mini">
-						<INPUT class="form-control text-center" TYPE="text" disabled
-						 value="<?=format_N($this->nettoyer($bareme['primeMin']));?>" >
-					</div>
-				</td>
-				
-				<td width="8%" align="center"><?= _("Forfait") ?></td>
-				<td width="20%" >
-					<INPUT class="form-control" TYPE="text" id="accessoireForfait" NAME="accessoireForfait" 
-					value="<?=$bareme['accessoireForfait'];?>" >
-				</td>
-				
-			</tr>
-			<tr>
-				<td width="10%" align="center" ><?= _("Application") ?></td>
-				<td>
-					<select class="form-select text-center"  disabled>
-						<?php liste_options($application,$this->nettoyer($bareme['codeApplication']),true); ?>						
-					</SELECT>						
-				</td>
-				
-				<td width="8%" align="center" ><?= _("Prime Maxi") ?></td>
-				<td width="20%" >
-					<INPUT class="form-control text-center" TYPE="text" disabled 
-					value="<?=format_N($this->nettoyer($bareme['primeMax']));?>" >
-				</td>
-				
-				<td width="8%" align="center"><?= _("Taux") ?></td>
-				<td width="20%" ><INPUT class="form-control" TYPE="number" step="0.01" id="tauxAccessoire" min="0" NAME="tauxAccessoire" value="<?=number_format($bareme['tauxAccessoire'],2);?>" onBlur="controle_numerique(this);"></td>
-			</tr>
-		</tbody>
-	</table>	
-</form>
\ No newline at end of file
+            <div class="row g-3 mb-3">
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Type Contrat") ?></label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-light opacity-75"><i class="fas fa-lock text-muted"></i></span>
+                        <select class="form-select bg-light text-center" disabled>
+                            <?php liste_options($typecontrat, $this->nettoyer($bareme['codeTypeContrat']), true); ?>
+                        </select>
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Prime Mini") ?></label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-light opacity-75"><i class="fas fa-arrow-down text-muted"></i></span>
+                        <input class="form-control text-center bg-light fw-bold" type="text" disabled 
+                               value="<?=format_N($this->nettoyer($bareme['primeMin']));?>">
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted text-uppercase required"><?= _("Forfait") ?></label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-light text-success"><i class="fas fa-money-bill-wave"></i></span>
+                        <input class="form-control text-center fw-bold" type="text" id="accessoireForfait" name="accessoireForfait" 
+                               value="<?=$bareme['accessoireForfait'];?>" onkeyup="controle_numerique(this);" onblur="formatMonetaire(this);">
+                    </div>
+                </div>
+            </div>
+
+            <div class="row g-3">
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Application") ?></label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-light opacity-75"><i class="fas fa-lock text-muted"></i></span>
+                        <select class="form-select bg-light text-center" disabled>
+                            <?php liste_options($application, $this->nettoyer($bareme['codeApplication']), true); ?>
+                        </select>
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Prime Maxi") ?></label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-light opacity-75"><i class="fas fa-arrow-up text-muted"></i></span>
+                        <input class="form-control text-center bg-light fw-bold" type="text" disabled 
+                               value="<?=format_N($this->nettoyer($bareme['primeMax']));?>">
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted text-uppercase"><?= _("Taux (%)") ?></label>
+                    <div class="input-group">
+                        <span class="input-group-text bg-light text-info"><i class="fas fa-percentage"></i></span>
+                        <input class="form-control text-center fw-bold" type="number" step="0.01" min="0" 
+                               id="tauxAccessoire" name="tauxAccessoire" 
+                               value="<?=number_format($bareme['tauxAccessoire'], 2);?>" onBlur="controle_numerique(this);">
+                    </div>
+                </div>
+            </div>
+        </form>
+    </div>
+</div>
\ No newline at end of file