From f9dfc2b012446b3c8b12bdb56f1ee2122bbf7441 Mon Sep 17 00:00:00 2001
From: David Montero Crespo <davidmonterocrespo24@gmail.com>
Date: Wed, 4 Mar 2026 23:40:17 -0300
Subject: [PATCH] fix: adjust z-index values for DynamicComponent and
 PinOverlay for improved layering

---
 frontend/src/components/DynamicComponent.tsx     | 2 +-
 frontend/src/components/simulator/PinOverlay.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/DynamicComponent.tsx b/frontend/src/components/DynamicComponent.tsx
index 23f3a1e..64948e9 100644
--- a/frontend/src/components/DynamicComponent.tsx
+++ b/frontend/src/components/DynamicComponent.tsx
@@ -228,7 +228,7 @@ export const DynamicComponent: React.FC<DynamicComponentProps> = ({
         borderRadius: '4px',
         padding: '4px',
         userSelect: 'none',
-        zIndex: isSelected ? 1000 : 1,
+        zIndex: isSelected ? 5 : 1,
         pointerEvents: 'auto',
         transform: properties.rotation ? `rotate(${properties.rotation}deg)` : undefined,
         transformOrigin: 'center center',
diff --git a/frontend/src/components/simulator/PinOverlay.tsx b/frontend/src/components/simulator/PinOverlay.tsx
index 8587989..4f0d113 100644
--- a/frontend/src/components/simulator/PinOverlay.tsx
+++ b/frontend/src/components/simulator/PinOverlay.tsx
@@ -50,7 +50,7 @@ export const PinOverlay: React.FC<PinOverlayProps> = ({
         left: `${componentX + 6}px`, // +6px for wrapper padding (4px padding + 2px border)
         top: `${componentY + 6}px`,
         pointerEvents: 'none',
-        zIndex: 1002, // Above property dialog (1001)
+        zIndex: 10, // Above wires (1) and components, below modals/dialogs (1000+)
       }}
     >
       {pins.map((pin) => {