From 0eb725b56e97dac0279fa214c821d293e03d8a4e Mon Sep 17 00:00:00 2001
From: KONE SOREL <skone@ebene.info>
Date: Mon, 16 Mar 2026 13:27:34 +0000
Subject: [PATCH] dfgh

---
 Vue/Ajaxprimelienparente/trancheage.php     |  2 +-
 Vue/Ajaxprimelienparente/typetrancheage.php | 49 ++++++++++++++-------
 2 files changed, 35 insertions(+), 16 deletions(-)

diff --git a/Vue/Ajaxprimelienparente/trancheage.php b/Vue/Ajaxprimelienparente/trancheage.php
index 293a4781..d8036630 100755
--- a/Vue/Ajaxprimelienparente/trancheage.php
+++ b/Vue/Ajaxprimelienparente/trancheage.php
@@ -1,5 +1,5 @@
 <div id="div_trancheage_content" class="animate__animated animate__fadeIn">
-    <div class="row g-3">
+    <div class="row g-2">
         <div id="div_prime_lien" class="col-lg-8">
             <div class="table-responsive border rounded shadow-sm bg-white">
                 <table id="tab_prime_categorie" class="table table-hover align-middle mb-0" style="font-size: 8pt;">
diff --git a/Vue/Ajaxprimelienparente/typetrancheage.php b/Vue/Ajaxprimelienparente/typetrancheage.php
index 7a0ce7f6..e0ef109b 100755
--- a/Vue/Ajaxprimelienparente/typetrancheage.php
+++ b/Vue/Ajaxprimelienparente/typetrancheage.php
@@ -1,16 +1,35 @@
-<table class="table table-responsive table-condensed">
-	<tbody>	
-		<tr> 
-			<td width="10%" class="required"><?= _("Type Tranche Âge")?></td>
-            <td  >
-				<select class="form-control selectpicker" data-live-search="true" id="codeEnteteTrancheAge" NAME="codeEnteteTrancheAge" required AUTOCOMPLETE="OFF" autofocus onChange="javascript:trancheage();" style="font-size:12pt;">
-					<?php liste_options($typesTranches,""); ?>						
-				</SELECT>
-			</td>
-			
-		</tr>
-	</tbody>
-</table>
-<div id="div_trancheage" class="col-12">			
-
+<div class="card border-0 shadow-sm mb-3 animate__animated animate__fadeIn">
+    <div class="card-body p-3 bg-primary-ghost-light">
+        <div class="row align-items-center">
+            <div class="col-md-3">
+                <label class="form-label small fw-bold text-muted text-uppercase mb-md-0">
+                    <?= _("Catégorie Tranche d'Âge") ?> <span class="text-danger">*</span>
+                </label>
+            </div>
+            <div class="col-md-7">
+                <div class="input-group">
+                    <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-calendar-alt text-primary"></i></span>
+                    <select class="form-control selectpicker border-2 border-start-0 shadow-none" 
+                            data-live-search="true" 
+                            id="codeEnteteTrancheAge" 
+                            name="codeEnteteTrancheAge" 
+                            required 
+                            onchange="trancheage();">
+                        <?php liste_options($typesTranches, ""); ?>
+                    </select>
+                </div>
+            </div>
+        </div>
+    </div>
 </div>
+
+<div id="div_trancheage" class="mt-3"></div>
+
+<style>
+    .bg-primary-ghost-light { background-color: rgba(33, 46, 83, 0.02) !important; }
+    /* Correction visuelle pour le selectpicker dans un input-group */
+    .bootstrap-select.form-control.border-2 {
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+    }
+</style>