From 1a7468d718e67ca37c082f3f8ccb2d57511e0d19 Mon Sep 17 00:00:00 2001
From: caty21 <caty21@users.noreply.github.com>
Date: Sat, 27 Jun 2026 19:27:19 +0200
Subject: [PATCH] =?UTF-8?q?fix:=20bloc=20convergence=20toujours=20visible?=
 =?UTF-8?q?=20pour=20EUR/AUD=20(=C3=A9tat=20Neutre)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

État neutre (dir=neutral ET mispricDir=neutral) : fond bg-slate-800/40
border-slate-700/30 était quasi-invisible sur bg-slate-900.
Fix : fond bg-slate-800/60 border-slate-600/40 + labels Fond./Marché
en text-slate-400 (au lieu de 500) + flèches "—" en text-slate-500.
Refacto en IIFE pour clarifier la logique de couleur.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 components/CurrencyCard.tsx | 44 ++++++++++++++++++++++++++-----------
 1 file changed, 31 insertions(+), 13 deletions(-)

diff --git a/components/CurrencyCard.tsx b/components/CurrencyCard.tsx
index f1b8a76..470db08 100644
--- a/components/CurrencyCard.tsx
+++ b/components/CurrencyCard.tsx
@@ -1335,19 +1335,37 @@ export default function CurrencyCard({
               <>
 
                 {/* ── Convergence / Divergence macro ↔ marché ─────────────── */}
-                <div className={`rounded-lg border px-2.5 py-1.5 flex items-center gap-1.5 text-[10px] ${
-                  bothOpposed ? "bg-amber-500/8 border-amber-500/25"
-                  : bothAligned ? sigBg(divergenceSignal)
-                  : "bg-slate-800/40 border-slate-700/30"
-                }`}>
-                  <span className="text-slate-500 shrink-0 text-[9px] uppercase tracking-wider">Fond.</span>
-                  <span className={`font-black text-[13px] leading-none ${sigColor(dir)}`}>{dir === "bullish" ? "↑" : dir === "bearish" ? "↓" : "—"}</span>
-                  <span className={`font-bold flex-1 text-center ${bothOpposed ? "text-amber-400" : sigColor(divergenceSignal)}`}>
-                    {bothOpposed ? "⚠ Divergence" : bothAligned ? (divergenceSignal === "bullish" ? "✓ Convergence ↑" : "✓ Convergence ↓") : dir !== "neutral" ? "Macro seule" : mispricDir !== "neutral" ? "Signaux seuls" : "Neutre"}
-                  </span>
-                  <span className={`font-black text-[13px] leading-none ${sigColor(mispricDir)}`}>{mispricDir === "bullish" ? "↑" : mispricDir === "bearish" ? "↓" : "—"}</span>
-                  <span className="text-slate-500 shrink-0 text-[9px] uppercase tracking-wider">Marché</span>
-                </div>
+                {(() => {
+                  const isNeutral = dir === "neutral" && mispricDir === "neutral";
+                  const verdictText = bothOpposed ? "⚠ Divergence"
+                    : bothAligned ? (divergenceSignal === "bullish" ? "✓ Convergence ↑" : "✓ Convergence ↓")
+                    : dir !== "neutral" ? "Macro seule"
+                    : mispricDir !== "neutral" ? "Signaux seuls"
+                    : "Neutre";
+                  const containerCls = bothOpposed
+                    ? "bg-amber-500/10 border-amber-500/30"
+                    : bothAligned
+                    ? sigBg(divergenceSignal)
+                    : isNeutral
+                    ? "bg-slate-800/60 border-slate-600/40"
+                    : "bg-slate-800/50 border-slate-600/30";
+                  const verdictCls = bothOpposed ? "text-amber-400"
+                    : isNeutral ? "text-slate-400"
+                    : sigColor(divergenceSignal);
+                  return (
+                    <div className={`rounded-lg border px-2.5 py-1.5 flex items-center gap-1.5 text-[10px] ${containerCls}`}>
+                      <span className="text-slate-400 shrink-0 text-[9px] uppercase tracking-wider font-semibold">Fond.</span>
+                      <span className={`font-black text-[13px] leading-none ${dir === "neutral" ? "text-slate-500" : sigColor(dir)}`}>
+                        {dir === "bullish" ? "↑" : dir === "bearish" ? "↓" : "—"}
+                      </span>
+                      <span className={`font-bold flex-1 text-center ${verdictCls}`}>{verdictText}</span>
+                      <span className={`font-black text-[13px] leading-none ${mispricDir === "neutral" ? "text-slate-500" : sigColor(mispricDir)}`}>
+                        {mispricDir === "bullish" ? "↑" : mispricDir === "bearish" ? "↓" : "—"}
+                      </span>
+                      <span className="text-slate-400 shrink-0 text-[9px] uppercase tracking-wider font-semibold">Marché</span>
+                    </div>
+                  );
+                })()}
 
                 {/* ── Slider macro : Mon. / Infl. / Cro. / Empl. ───────────── */}
                 {(() => {