From 0a27533262f3f6ad45bc20027075abdc7381b71c Mon Sep 17 00:00:00 2001
From: Lars <Lars@stommer.de>
Date: Mon, 13 Apr 2026 12:58:25 +0200
Subject: [PATCH] feat: Highlight failed nodes in WorkflowDebugPanel

- Failed nodes now have:
  - Red border (2px instead of 1px)
  - Light red background (#D85A3010)
  - Red shadow/glow effect

Makes it immediately obvious which nodes had errors.
---
 frontend/src/components/WorkflowDebugPanel.jsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/WorkflowDebugPanel.jsx b/frontend/src/components/WorkflowDebugPanel.jsx
index fa0175b..7f80c42 100644
--- a/frontend/src/components/WorkflowDebugPanel.jsx
+++ b/frontend/src/components/WorkflowDebugPanel.jsx
@@ -111,14 +111,18 @@ export default function WorkflowDebugPanel({ nodeStates }) {
           const label = getNodeLabel(node)
           const statusColor = getStatusColor(node.status)
 
+          const hasFailed = node.status === 'failed'
+          const hasError = node.error != null
+
           return (
             <div
               key={node.node_id}
               style={{
-                border: '1px solid var(--border)',
+                border: hasFailed ? '2px solid #D85A30' : '1px solid var(--border)',
                 borderRadius: '8px',
-                background: 'var(--bg)',
-                overflow: 'hidden'
+                background: hasFailed ? '#D85A3010' : 'var(--bg)',
+                overflow: 'hidden',
+                boxShadow: hasFailed ? '0 0 0 2px #D85A3020' : 'none'
               }}
             >
               {/* Node Header */}