From dcaf1331068061bed81a68de2a717a50bf67e61e Mon Sep 17 00:00:00 2001
From: 3clyp50 <real.eclypso@gmail.com>
Date: Tue, 27 Jan 2026 22:07:05 +0100
Subject: [PATCH] prevent nested selection; css polish

---
 .../action-buttons/simple-action-buttons.css  | 13 +++++++---
 webui/css/messages.css                        | 17 ------------
 webui/js/messages.js                          | 26 +++++++++++--------
 3 files changed, 24 insertions(+), 32 deletions(-)

diff --git a/webui/components/messages/action-buttons/simple-action-buttons.css b/webui/components/messages/action-buttons/simple-action-buttons.css
index 83450cc5a..f914ef8ba 100644
--- a/webui/components/messages/action-buttons/simple-action-buttons.css
+++ b/webui/components/messages/action-buttons/simple-action-buttons.css
@@ -59,20 +59,25 @@
   width: 100%;
 }
 
+.code-block-wrapper > .step-action-buttons,
+.message-markdown-table-wrap > .step-action-buttons {
+  padding-top: 0;
+}
+
 /* ===========================================
    Hover behavior - Pointer devices
    =========================================== */
 
-.device-pointer .message-user:hover .step-action-buttons,
-.device-pointer .message-agent-response:hover .step-action-buttons,
+.device-pointer .message-user:hover > .step-action-buttons,
+.device-pointer .message-agent-response:hover > .step-action-buttons,
 .device-pointer .process-step:hover > .process-step-detail .step-action-buttons {
   opacity: 1;
   pointer-events: auto;
 }
 
 /* Code blocks and tables: show copy button on hover */
-.device-pointer .code-block-wrapper:hover .step-action-buttons,
-.device-pointer .message-markdown-table-wrap:hover .step-action-buttons {
+.device-pointer .code-block-wrapper:hover > .step-action-buttons,
+.device-pointer .message-markdown-table-wrap:hover > .step-action-buttons {
   opacity: 1;
   pointer-events: auto;
 }
diff --git a/webui/css/messages.css b/webui/css/messages.css
index 30a9fffc6..176ae987d 100644
--- a/webui/css/messages.css
+++ b/webui/css/messages.css
@@ -732,23 +732,6 @@
   border-radius: 0.3em;
 }
 
-/* Code block and table copy buttons */
-.code-block-wrapper,
-.message-markdown-table-wrap {
-  position: relative;
-}
-
-.overlay-actions {
-  position: absolute;
-  top: 0;
-  right: 0;
-  background: var(--color-panel);
-  border-radius: var(--border-radius-sm);
-  z-index: 1;
-  padding: 2px !important;
-  gap: 0 !important;
-}
-
 .msg-content hr {
   border: 0;
   border-top: 1px solid var(--color-border);
diff --git a/webui/js/messages.js b/webui/js/messages.js
index c254f5c99..348248fa6 100644
--- a/webui/js/messages.js
+++ b/webui/js/messages.js
@@ -671,7 +671,7 @@ function drawStandaloneMessage({
   // Render action buttons: get/create container, clear, append
   const actionButtonsContainer = ensureChild(
     messageDiv,
-    ".step-action-buttons",
+    ":scope > .step-action-buttons",
     "div",
     "step-action-buttons",
   );
@@ -975,9 +975,10 @@ export function drawMessageResponse({
         createActionButton("copy", "", () => copyToClipboard(responseText)),
       ].filter(Boolean)
     : [];
+  // Look for direct child only to avoid finding nested code block buttons
   const actionButtonsContainer = ensureChild(
     messageDiv,
-    ".step-action-buttons",
+    ":scope > .step-action-buttons",
     "div",
     "step-action-buttons",
   );
@@ -1114,9 +1115,10 @@ export function drawMessageUser({
         createActionButton("copy", "", () => copyToClipboard(userText)),
       ].filter(Boolean)
     : [];
+  // Look for direct child only to avoid finding nested code block buttons
   const actionButtonsContainer = ensureChild(
     messageDiv,
-    ".step-action-buttons",
+    ":scope > .step-action-buttons",
     "div",
     "step-action-buttons",
   );
@@ -1909,11 +1911,12 @@ function adjustMarkdownRender(element) {
   const tables = element.querySelectorAll("table");
   tables.forEach((el) => {
     const wrapper = wrapElement(el, "message-markdown-table-wrap");
-    const copyBtn = createActionButton("copy", "", () =>
-      copyToClipboard(extractTableTSV(el))
+    const actionsDiv = document.createElement("div");
+    actionsDiv.className = "step-action-buttons";
+    actionsDiv.appendChild(
+      createActionButton("copy", "", () => copyToClipboard(extractTableTSV(el)))
     );
-    copyBtn.classList.add("step-action-buttons", "overlay-actions");
-    wrapper.appendChild(copyBtn);
+    wrapper.appendChild(actionsDiv);
   });
 
   // find all code blocks
@@ -1921,11 +1924,12 @@ function adjustMarkdownRender(element) {
   codeElements.forEach((code) => {
     const pre = code.parentNode;
     const wrapper = wrapElement(pre, "code-block-wrapper");
-    const copyBtn = createActionButton("copy", "", () =>
-      copyToClipboard(code.textContent)
+    const actionsDiv = document.createElement("div");
+    actionsDiv.className = "step-action-buttons";
+    actionsDiv.appendChild(
+      createActionButton("copy", "", () => copyToClipboard(code.textContent))
     );
-    copyBtn.classList.add("step-action-buttons", "overlay-actions");
-    wrapper.appendChild(copyBtn);
+    wrapper.appendChild(actionsDiv);
   });
 
   // find all images