From 044f5fd0308733f36331ffe018047a29edbc928f Mon Sep 17 00:00:00 2001
From: spencrmartin <spencermartin@squareup.com>
Date: Thu, 25 Sep 2025 13:29:19 -0400
Subject: [PATCH] Fix holographic text effect by using WebkitTextFillColor

- Changed from rgba(0,0,0,0) back to transparent for cleaner text hiding
- Added WebkitTextFillColor: transparent to eliminate text visibility artifacts
- Should maintain blue selection highlighting while removing ghost text effect
---
 ui/desktop/src/components/RichChatInput.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/ui/desktop/src/components/RichChatInput.tsx b/ui/desktop/src/components/RichChatInput.tsx
index 00c31e99a1..2d0437024f 100644
--- a/ui/desktop/src/components/RichChatInput.tsx
+++ b/ui/desktop/src/components/RichChatInput.tsx
@@ -964,7 +964,7 @@ export const RichChatInput = forwardRef<RichChatInputRef, RichChatInputProps>(({
           border: 'none',
           outline: 'none',
           resize: 'none',
-          color: 'rgba(0, 0, 0, 0)', // Fully transparent text but allows selection
+          color: 'transparent', // Use CSS transparent instead of rgba
           caretColor: 'transparent', // Hide caret (we show our own)
           pointerEvents: 'auto', // Ensure it can receive mouse events
           fontFamily: 'Cash Sans, sans-serif', // Match exact font
@@ -975,6 +975,7 @@ export const RichChatInput = forwardRef<RichChatInputRef, RichChatInputProps>(({
           boxSizing: 'border-box',
           whiteSpace: 'pre-wrap', // Match visual display
           wordWrap: 'break-word',
+          WebkitTextFillColor: 'transparent', // Webkit-specific transparent text
         }}
         rows={rows}
       />