Améliorations diverses

frontend/src/components/InvMensuelTable.jsx

@@ -12,20 +12,6 @@ function startOfMonth(Y, M) {
   return `${Y}-${String(M).padStart(2,'0')}-01`;
 }
 
-const STATUT_BG = {
-  en_cours:  'var(--b-en_cours-bg)',
-  rembourse: 'var(--b-rembourse-bg)',
-  en_retard: 'var(--b-en_retard-bg)',
-  procedure: 'var(--b-procedure-bg)',
-  cloture:   'var(--surface-2)',
-};
-const STATUT_FG = {
-  en_cours:  'var(--b-en_cours-fg)',
-  rembourse: 'var(--b-rembourse-fg)',
-  en_retard: 'var(--b-en_retard-fg)',
-  procedure: 'var(--b-procedure-fg)',
-  cloture:   'var(--text-muted)',
-};
 
 export default function InvMensuelTable({ rows, allRembs, allReinvests, year, originFrom }) {
   const navigate     = useNavigate();
@@ -125,11 +111,7 @@ export default function InvMensuelTable({ rows, allRembs, allReinvests, year, or
           </tr>
           <tr>
             <th className="tip-th-name tip-th-name-amber" style={{ minWidth: '22ch', maxWidth: '40ch' }}>Investissement</th>
-            <th style={{
-              padding: '7px 10px', background: 'var(--surface-2)', color: 'var(--text)',
-              fontWeight: 600, fontSize: 'var(--fs-xs)', textAlign: 'left',
-              borderRight: '1px solid var(--border)', whiteSpace: 'nowrap',
-            }}>Statut</th>
+            <th className="tip-th-name" style={{ minWidth: 'unset', position: 'static', fontSize: 'var(--fs-xs)', textAlign: 'left' }}>Statut</th>
             {MOIS_LONG.map((m, i) => (
               <th key={m}
                 className={`tip-th-month${displayYear === currentYear && i === currentMonth - 1 ? ' tip-th-month-current' : ''}`}>
@@ -148,14 +130,7 @@ export default function InvMensuelTable({ rows, allRembs, allReinvests, year, or
                 {inv.nom_projet || '—'}
               </td>
               <td style={{ padding: '8px 10px', whiteSpace: 'nowrap', borderRight: '1px solid var(--border)' }}>
-                <span style={{
-                  display: 'inline-block', padding: '2px 8px', borderRadius: 4,
-                  fontSize: 'var(--fs-xs)', fontWeight: 600,
-                  background: STATUT_BG[inv.statut] || 'var(--surface-2)',
-                  color: STATUT_FG[inv.statut] || 'var(--text-muted)',
-                }}>
-                  {fmtStatut(inv.statut)}
-                </span>
+                <span className={`badge ${inv.statut}`}>{fmtStatut(inv.statut)}</span>
               </td>
               {months.map((v, mi) => {
                 const curClass = displayYear === currentYear && mi === currentMonth - 1 ? ' tip-col-current' : '';