From 9f1a43095e9bbf3fc42cff1b6309a330b8b9f2d2 Mon Sep 17 00:00:00 2001
From: shinalok <shinalok357@gmail.com>
Date: Tue, 2 Jun 2026 18:28:51 +0900
Subject: [PATCH] fix: remove blue focus-within border from all Gradio wraps
 globally

Root cause: .wrap:focus-within sets box-shadow+border-color via
--input-shadow-focus / --input-border-color-focus on ALL components.

Fix:
- .wrap:focus-within -> box-shadow:none, border-color:primary globally
- .pill-input .wrap:focus-within -> restore blue glow for input only
- .block:focus-within -> outline/shadow/border reset
- Simplify .pill-input textarea:focus to just remove outline

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app.py | 23 +++++++++++++++++------
 1 file changed, 17 insertions(+), 6 deletions(-)

diff --git a/app.py b/app.py
index fc7ba46..b36ff96 100644
--- a/app.py
+++ b/app.py
@@ -463,10 +463,23 @@ _JS = """
 _CUSTOM_CSS = """
 footer { display: none !important; }
 
-/* Gradio 기본 focus 테두리 전역 제거 */
-.gradio-container *:focus:not(button):not(a):not(select) { outline: none !important; }
-.gradio-container .block:focus,
-.gradio-container .block:focus-within { box-shadow: none !important; border-color: var(--border-color-primary) !important; }
+/* Gradio .wrap:focus-within 전역 제거 (모든 컴포넌트 파란 테두리 원인) */
+.wrap:focus-within {
+    box-shadow: none !important;
+    border-color: var(--border-color-primary) !important;
+}
+/* pill-input wrap에만 포커스 스타일 복원 */
+.pill-input .wrap:focus-within {
+    border-color: #3b82f6 !important;
+    box-shadow: 0 0 0 3px rgba(59,130,246,.10) !important;
+}
+/* block, container 레벨 focus-within도 제거 */
+.gradio-container .block:focus-within,
+.gradio-container .block:focus {
+    box-shadow: none !important;
+    border-color: var(--border-color-primary) !important;
+    outline: none !important;
+}
 
 /* ── 전체 레이아웃 (D4-1) ── */
 .app-layout {
@@ -553,9 +566,7 @@ footer { display: none !important; }
     line-height: 1.5 !important;
 }
 .pill-input textarea:focus {
-    border-color: #3b82f6 !important;
     outline: none !important;
-    box-shadow: 0 0 0 3px rgba(59,130,246,.12) !important;
 }
 .pill-send-btn { align-self: center !important; }
 .pill-send-btn button {