diff --git a/Bootstrap_new/css/theme-modern.css b/Bootstrap_new/css/theme-modern.css
index 01776f8b..bbef426e 100644
--- a/Bootstrap_new/css/theme-modern.css
+++ b/Bootstrap_new/css/theme-modern.css
@@ -1399,7 +1399,19 @@ select[class*="selectpicker"],
     to { opacity: 1; transform: translateY(0); }
 }
 
-#titre-page{
+#titre-page {
   color: var(--color-primary);
   letter-spacing: -0.5px;
+  font-family: 'DM Sans', sans-serif; /* Ou votre police SaaS */
+}
+
+/* On réduit la marge de la section pour coller davantage au contenu */
+.header-section {
+    width: 100%;
+    margin-bottom: 1.5rem !important; /* Ajustez cette valeur si c'est encore trop grand */
+}
+
+/* Ajustement des icônes pour plus de finesse */
+.icon-shape {
+    flex-shrink: 0;
 }
\ No newline at end of file
diff --git a/Vue/Autresparametresgeneraux/index.php b/Vue/Autresparametresgeneraux/index.php
index a386edbb..2fc7aa6b 100755
--- a/Vue/Autresparametresgeneraux/index.php
+++ b/Vue/Autresparametresgeneraux/index.php
@@ -2,15 +2,22 @@
     <input class="sr-only" type="text" id="idSocieteuser" name="idSocieteuser" value="<?= $this->nettoyer($societeuser['idSocieteuser']) ?>">
     <input class="sr-only" type="text" id="nomForm" name="nomForm" value="frmautreparametre">
 
-    <div class="d-flex flex-column flex-md-row align-items-md-center justify-content-between mb-4 gap-3 bg-white p-3 shadow-sm border-start border-primary border-4" style="border-radius: var(--radius-md);">
-        <div>
-            <h4 class="fw-bold mb-1" style="color: var(--color-primary); letter-spacing: -0.5px;"><?= _("Configuration Système") ?></h4>
-            <p class="text-muted small mb-0"><?= _("Filtrer et gérer les règles métiers du centre") ?></p>
-        </div>
-        
-        <div class="position-relative" style="min-width: 350px;">
-            <i class="fas fa-search position-absolute top-50 start-0 translate-middle-y ms-3 text-muted"></i>
-            <input type="text" id="globalSearch" class="form-control ps-5 border-2 rounded-pill shadow-none" placeholder="<?= _('Rechercher un paramètre (ex: SMS, prix, acte)...') ?>">
+    <div class="header-section mb-4">
+        <div class="d-flex flex-column flex-md-row align-items-md-center justify-content-between bg-white p-3 shadow-sm border-start border-info border-4" style="border-radius: var(--radius-md);">
+            <div class="d-flex align-items-center">
+                <div class="icon-shape bg-info-ghost text-info rounded-circle me-3" style="width: 50px; height: 50px; display: flex; align-items: center; justify-content: center;">
+                    <i class="fas fa-sliders-h fs-4"></i>
+                </div>
+                <div>
+                    <h4 id="titre-page" class="mb-0 fw-bold text-uppercase"><?= _("Règles Métiers") ?></h4>
+                    <p class="text-muted small mb-0"><?= _("Filtrer et gérer les paramètres opérationnels du centre") ?></p>
+                </div>
+            </div>
+
+            <div class="position-relative mt-3 mt-md-0" style="min-width: 300px;">
+                <i class="fas fa-search position-absolute top-50 start-0 translate-middle-y ms-3 text-muted"></i>
+                <input type="text" id="globalSearch" class="form-control ps-5 border-2 rounded-pill shadow-none" style="font-size: 0.85rem;" placeholder="<?= _('Rechercher un paramètre...') ?>">
+            </div>
         </div>
     </div>