diff --git a/Vue/Listeavenant/index.php b/Vue/Listeavenant/index.php
index 9a6c38c..c826e1f 100644
--- a/Vue/Listeavenant/index.php
+++ b/Vue/Listeavenant/index.php
@@ -1,26 +1,28 @@
 <div id="div_avenant" class="card shadow-sm border-0 mb-4 animate__animated animate__fadeIn">
-    <h1 class="text-primary"><i class="fas fa-list-ul me-2"></i><?= _('Historique des Avenants') ?></h1>
-
-	<div class="card-header d-flex justify-content-between align-items-center py-3">
+    <div class="card-header bg-white py-3 d-flex justify-content-between align-items-center">
+        <h4 class="text-primary mb-0 fw-bold">
+            <i class="fas fa-history me-2"></i><?= _('Historique des Avenants') ?>
+        </h4>
         <div class="text-muted">
-			<span class="badge bg-light text-dark border ps-2">
-				<?= $_SESSION['nomClient_C'] ?> | <?= $police['numeroPolice'] ?>
-			</span>
-		</div>
+            <span class="badge bg-primary-subtle text-primary border border-primary-subtle px-3 py-2 rounded-pill">
+                <i class="fas fa-file-contract me-1"></i> <?= $_SESSION['nomClient_C'] ?> | <?= $police['numeroPolice'] ?>
+            </span>
+        </div>
     </div>
 
-    <div class="card-body p-0 mt-2">
+    <div class="card-body p-0">
         <div class="table-responsive">
-            <table class="table table-hover align-middle mb-0 tabliste compact" style="font-size: 0.9rem;">
-                <thead class="table-light">
-                    <tr class="text-muted small">
-                        <th class="ps-3 text-center" width="8%"><?= _("N°") ?></th>
+            <table class="table table-hover align-middle mb-0 tabliste compact" style="font-size: 0.85rem;">
+                <thead class="table-light text-secondary text-uppercase small">
+                    <tr>
+                        <th class="ps-4 text-center" width="8%"><?= _("N°") ?></th>
                         <th class="text-center" width="12%"><?= _("Effet") ?></th>
                         <th width="20%"><?= _("Type Mouvement") ?></th>
                         <th width="25%"><?= _("Commentaires") ?></th>
                         <th width="15%"><?= _("Saisie par") ?></th>
-                        <th class="text-center" width="10%"><?= _("Facturé") ?></th>
-                        <th class="text-center" width="10%"><?= _("RH") ?></th>
+                        <th class="text-center" width="8%"><?= _("Facturé") ?></th>
+                        <th class="text-center" width="8%"><?= _("RH") ?></th>
+                        <th class="text-center" width="10%"><?= _("Action") ?></th>
                     </tr>
                 </thead>
                 <tbody>
@@ -30,38 +32,51 @@
                         $isRH = ($avenant['ajoutClient'] == '1');
                     ?>
                     <tr>
-                        <td class="text-center fw-bold ps-3 text-secondary">
-                            <?= $this->nettoyer($avenant['numeroAvenant']) ?>
+                        <td class="text-center fw-bold ps-4 text-primary">
+                            #<?= $this->nettoyer($avenant['numeroAvenant']) ?>
                         </td>
-                        <td class="text-center fw-bold text-dark">
-                            <?= dateLang($this->nettoyer($avenant['dateEffet']), $_SESSION['lang']) ?>
+                        <td class="text-center fw-bold">
+                            <span class="text-dark"><i class="far fa-calendar-alt me-1 text-muted"></i><?= dateLang($this->nettoyer($avenant['dateEffet']), $_SESSION['lang']) ?></span>
                         </td>
                         <td>
-                            <div class="fw-bold"><?= $libelleAvenant ?></div>
-                            <div class="x-small text-muted" style="font-size: 0.75rem;">
-                                <?= dateheureLang($this->nettoyer($avenant['dateSysteme']), $_SESSION['lang']) ?>
+                            <div class="fw-bold text-dark"><?= $libelleAvenant ?></div>
+                            <div class="text-muted" style="font-size: 0.75rem;">
+                                <i class="far fa-clock me-1"></i><?= dateheureLang($this->nettoyer($avenant['dateSysteme']), $_SESSION['lang']) ?>
                             </div>
                         </td>
-                        <td class="text-muted small italic">
-                            <?= $this->nettoyer($avenant['motifavenant']) ?: '-' ?>
+                        <td class="text-muted italic small">
+                            <?= $this->nettoyer($avenant['motifavenant']) ?: '<span class="opacity-50">-</span>' ?>
                         </td>
-                        <td class="small">
-                            <?= $this->nettoyer($avenant['utilisateur']) ?>
+                        <td>
+                            <div class="d-flex align-items-center text-muted">
+                                <i class="fas fa-user-circle me-2"></i><?= $this->nettoyer($avenant['utilisateur']) ?>
+                            </div>
                         </td>
                         
                         <td class="text-center">
                             <?php if($isFacture): ?>
-                                <span class="badge bg-success px-3 py-2"><?= _("OUI") ?></span>
+                                <i class="fas fa-check-circle text-success fs-5" title="<?= _("Oui") ?>"></i>
                             <?php else: ?>
-                                <span class="badge bg-light text-muted border px-3 py-2"><?= _("NON") ?></span>
+                                <i class="fas fa-times-circle text-light fs-5" title="<?= _("Non") ?>"></i>
                             <?php endif; ?>
                         </td>
 
                         <td class="text-center">
                             <?php if($isRH): ?>
-                                <span class="badge bg-primary px-3 py-2"><?= _("OUI") ?></span>
+                                <i class="fas fa-user-check text-primary fs-5" title="<?= _("Oui") ?>"></i>
                             <?php else: ?>
-                                <span class="badge bg-light text-muted border px-3 py-2"><?= _("NON") ?></span>
+                                <i class="fas fa-minus text-light fs-5"></i>
+                            <?php endif; ?>
+                        </td>
+
+                        <td class="text-center pe-3">
+                            <?php if($isRH): ?>
+                                <button class="btn btn-sm btn-outline-primary fw-bold shadow-sm px-3" 
+                                        onclick="envoyer_notification_avenant('<?= $avenant['numeroAvenant'] ?>')">
+                                    <i class="fas fa-bell me-1"></i> <?= _("Notifier") ?>
+                                </button>
+                            <?php else: ?>
+                                <span class="text-muted small opacity-50"><?= _("N/A") ?></span>
                             <?php endif; ?>
                         </td>
                     </tr>
@@ -70,4 +85,7 @@
             </table>
         </div>
     </div>
+    <div class="card-footer bg-white border-0 py-3">
+        <small class="text-muted"><i class="fas fa-info-circle me-1"></i> <?= _("Seuls les avenants RH peuvent faire l'objet d'une notification.") ?></small>
+    </div>
 </div>
\ No newline at end of file