From f0e9de8c12e44121fe93bafb7bceb8dcc13642a6 Mon Sep 17 00:00:00 2001
From: Lucio Lelii <lucio.lelii@isti.cnr.it>
Date: Wed, 30 Sep 2026 12:44:44 +0200
Subject: [PATCH] style(container): clarify double border

---
 .../nodes/container-node/container-node.css   | 26 ++++++++++++++++---
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/app/shared/nodes/container-node/container-node.css b/src/app/shared/nodes/container-node/container-node.css
index 3766e18..58159ff 100644
--- a/src/app/shared/nodes/container-node/container-node.css
+++ b/src/app/shared/nodes/container-node/container-node.css
@@ -13,12 +13,22 @@
   border-radius: 16px;
   background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
   color: #0f172a;
-  /* The inset line is the Container's visual distinction from ordinary nodes. */
-  box-shadow: inset 0 0 0 1px #e2e8f0, 0 10px 24px rgba(15, 23, 42, 0.12);
+  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
   /* Ports deliberately project beyond the card edge, like Generic nodes; clipping hides them. */
   overflow: visible;
 }
 
+/* A clearly separated inner contour makes Containers recognizable at a glance. */
+.container-node::before {
+  content: '';
+  position: absolute;
+  inset: 4px;
+  z-index: 30;
+  border: 1px solid #cbd5e1;
+  border-radius: 12px;
+  pointer-events: none;
+}
+
 .container-node__focus-backdrop {
   position: fixed;
   inset: 0;
@@ -133,12 +143,20 @@
 
 :host.selected .container-node {
   border-color: #2563eb;
-  box-shadow: inset 0 0 0 1px #bfdbfe, 0 0 0 3px rgba(37, 99, 235, 0.24), 0 12px 28px rgba(15, 23, 42, 0.16);
+  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.24), 0 12px 28px rgba(15, 23, 42, 0.16);
+}
+
+:host.selected .container-node::before {
+  border-color: #93c5fd;
 }
 
 :host.validation-highlighted .container-node {
   border-color: #dc2626;
-  box-shadow: inset 0 0 0 1px #fecaca, 0 0 0 3px rgba(220, 38, 38, 0.18), 0 18px 38px rgba(127, 29, 29, 0.16);
+  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18), 0 18px 38px rgba(127, 29, 29, 0.16);
+}
+
+:host.validation-highlighted .container-node::before {
+  border-color: #fca5a5;
 }
 
 .container-node__lane-chip {