diff --git a/app/templates/patching_iexec.html b/app/templates/patching_iexec.html
index 99214e2..a14bb06 100644
--- a/app/templates/patching_iexec.html
+++ b/app/templates/patching_iexec.html
@@ -111,10 +111,27 @@
 </div>
 
 {# ─── Détails par serveur (panneau pliable) ─── #}
-<div class="card p-3 mb-4" id="details-card" style="display:none;">
-    <h3 class="text-sm font-bold text-cyber-accent mb-2">Détails du dernier check</h3>
-    <pre id="details-pane" class="bg-cyber-bg p-2 text-[11px] whitespace-pre-wrap overflow-x-auto" style="max-height:400px;"></pre>
+<div class="card mb-4" id="details-card" style="display:none;">
+    <div class="flex justify-between items-center p-3 border-b border-cyber-border cursor-pointer"
+         onclick="toggleDetails()">
+        <h3 class="text-sm font-bold text-cyber-accent">
+            <span id="details-arrow">▾</span> Détails du dernier check
+        </h3>
+        <button onclick="event.stopPropagation(); document.getElementById('details-card').style.display='none';"
+                class="text-xs text-gray-500 hover:text-cyber-accent">✕ Fermer</button>
+    </div>
+    <pre id="details-pane" class="bg-cyber-bg p-2 text-[11px] whitespace-pre-wrap overflow-x-auto"
+         style="max-height:400px;"></pre>
 </div>
+<script>
+function toggleDetails(){
+    const pane = document.getElementById('details-pane');
+    const arr = document.getElementById('details-arrow');
+    const collapsed = pane.style.display === 'none';
+    pane.style.display = collapsed ? '' : 'none';
+    arr.textContent = collapsed ? '▾' : '▸';
+}
+</script>
 
 {# ─── Terminal style log dry-run / patch ─── #}
 <div class="card p-2 mb-4" id="term-card" style="display:none;">