From e33c6c06eed13522803d34a8a11325cd5bdfefda Mon Sep 17 00:00:00 2001
From: spencrmartin <spencermartin@squareup.com>
Date: Fri, 13 Feb 2026 13:10:11 -0500
Subject: [PATCH] fix: Force user message text to use inverse color in all
 themes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add CSS rule: .user-message and .user-message * use color-text-inverse
- Use !important to override any prose or markdown styles
- Ensures user bubble text is always readable on inverse background
- Fixes issue where dark mode themes showed primary text on light bubble
- Now properly uses black text on light bubble (light mode)
- And white text on dark bubble (dark mode)

In dark mode with custom themes:
- User bubble background: color-background-inverse (light)
- User bubble text: color-text-inverse (dark) ✓

Consistent and readable across all themes!
---
 ui/desktop/src/styles/main.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/ui/desktop/src/styles/main.css b/ui/desktop/src/styles/main.css
index e1769773ae..20d888fe43 100644
--- a/ui/desktop/src/styles/main.css
+++ b/ui/desktop/src/styles/main.css
@@ -576,6 +576,11 @@ p > code.bg-inline-code {
   margin-bottom: 0 !important;
 }
 
+.user-message,
+.user-message * {
+  color: var(--color-text-inverse) !important;
+}
+
 .scrollbar-thin {
   scrollbar-width: thin;
 }