From eca270ba9756c0b3c7ad9ed4bf0312aeb503c1ee Mon Sep 17 00:00:00 2001
From: Bohdan Triapitsyn <artmore@protonmail.com>
Date: Sat, 10 Jan 2026 11:01:16 +0200
Subject: [PATCH] feat: enhance TerminalViewport styling and hide system caret
 in terminal input

---
 packages/ui/src/components/terminal/TerminalViewport.tsx | 8 ++++++--
 packages/ui/src/index.css                                | 5 +++++
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/packages/ui/src/components/terminal/TerminalViewport.tsx b/packages/ui/src/components/terminal/TerminalViewport.tsx
index 70ec43b1..bb5b1f98 100644
--- a/packages/ui/src/components/terminal/TerminalViewport.tsx
+++ b/packages/ui/src/components/terminal/TerminalViewport.tsx
@@ -773,7 +773,7 @@ const TerminalViewport = React.forwardRef<TerminalController, TerminalViewportPr
     return (
       <div
         ref={containerRef}
-        className={cn('relative h-full w-full', className)}
+        className={cn('relative h-full w-full terminal-viewport-container', className)}
         style={{ backgroundColor: theme.background }}
         onClick={(event) => {
           if (enableTouchScroll) {
@@ -799,10 +799,14 @@ const TerminalViewport = React.forwardRef<TerminalController, TerminalViewportPr
               top: 0,
               width: 1,
               height: 1,
-              opacity: 0.001,
+              opacity: 0,
               zIndex: 1,
               background: 'transparent',
               color: 'transparent',
+              caretColor: 'transparent',
+              resize: 'none',
+              overflow: 'hidden',
+              whiteSpace: 'nowrap',
               border: 'none',
               padding: 0,
               margin: 0,
diff --git a/packages/ui/src/index.css b/packages/ui/src/index.css
index 304d42b3..4dd99e37 100644
--- a/packages/ui/src/index.css
+++ b/packages/ui/src/index.css
@@ -1518,3 +1518,8 @@ html:not(.dark) .chat-scroll {
   content-visibility: visible !important;
   contain-intrinsic-size: none !important;
 }
+
+/* Hide system caret in terminal - targets both Ghostty internal input and our custom touch input */
+.terminal-viewport-container textarea {
+  caret-color: transparent !important;
+}