fix: improve user message visibility with distinctive theme-aware colors

.changeset/fix-user-message-visibility.md

@@ -0,0 +1,5 @@
+---
+"kilo-code": patch
+---
+
+Fix user message visibility by using distinctive theme-aware colors

webview-ui/src/components/chat/ChatRow.tsx

@@ -1356,13 +1356,14 @@ export const ChatRowContent = ({
 								<User className="w-4 shrink-0" aria-label="User icon" />
 								<span style={{ fontWeight: "bold" }}>{t("chat:feedback.youSaid")}</span>
 							</div>
+							{/* kilocode_change: distinctive user message styling with theme-aware colors for better visibility */}
 							<div
 								className={cn(
 									"ml-6 border rounded-sm whitespace-pre-wrap",
 									isEditing ? "overflow-visible" : "overflow-hidden", // kilocode_change
 									isEditing
 										? "bg-vscode-editor-background text-vscode-editor-foreground"
-										: "cursor-text p-1 bg-vscode-sideBar-background text-vscode-foreground", // kilocode_change
+										: "cursor-text p-1 bg-vscode-editor-background text-vscode-editor-foreground border-vscode-editorGroup-border", // kilocode_change
 								)}>
 								{isEditing ? (
 									<div className="flex flex-col gap-2">