---
name: feedback_tip_td_closed
description: Règle de grisage des cellules hors-période dans les tableaux mensuels tip-table
metadata: 
  node_type: memory
  type: feedback
  originSessionId: b8b23026-381b-4ec2-b150-02080d5f4720
---

Toute nouvelle page ou composant utilisant un tableau `tip-table` avec des données par investissement doit griser les cellules hors-période via la classe `.tip-td-closed`.

**Règle :** Rendre `<td className="tip-td-closed" />` (sans contenu, sans tiret) quand :
- Le mois est **avant** le début de l'investissement (date_souscription ou premier paiement)
- Le mois est **après** le dernier remboursement pour les prêts `statut === 'rembourse'`

**Pattern de détection :**
```js
// Avant (via date_souscription)
const subYear = Number(inv.date_souscription?.slice(0, 4));
const subMo   = Number(inv.date_souscription?.slice(5, 7)) - 1;
const isBefore = subYear > displayYear || (subYear === displayYear && mi < subMo);

// Après (via lastRembDateMap)
const isAfter = inv.statut === 'rembourse' && lastDate && (() => {
  const lastYear = Number(lastDate.slice(0, 4));
  const lastMo   = Number(lastDate.slice(5, 7)) - 1;
  if (lastYear < displayYear) return true;
  if (lastYear === displayYear) return mi > lastMo;
  return false;
})();
```

**CSS défini dans styles.css :**
```css
.tip-td-closed { background: var(--surface-2) !important; }
.tip-td-closed.tip-col-current { background: rgba(109,40,217,0.045) !important; }
```
La surbrillance du mois courant reste prioritaire grâce au double sélecteur.

**Why:** Demande utilisateur pour indiquer visuellement qu'il n'y a rien à attendre sur ces mois.
**How to apply:** Appliquer dans tout nouveau tableau mensuel tip-table dès sa création. Déjà présent dans Plateformes.jsx (onglets Remboursements + Dépôts/Retraits) et InvMensuelTable.jsx.
