From 72a60f93fd065c7dc91ec4f7d936171a3087a9c9 Mon Sep 17 00:00:00 2001
From: Bohdan Triapitsyn <artmore@protonmail.com>
Date: Sat, 18 Jul 2026 00:56:32 +0300
Subject: [PATCH] fix: add shadow to chat input elements on mobile for visual
 consistency

Fix alignment of settings radio options when no description is present
---
 packages/ui/src/components/chat/ChatInput.tsx               | 6 +++---
 .../ui/src/components/sections/shared/SettingsSection.tsx   | 3 ++-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/ui/src/components/chat/ChatInput.tsx b/packages/ui/src/components/chat/ChatInput.tsx
index 5e28234f..a1a19b38 100644
--- a/packages/ui/src/components/chat/ChatInput.tsx
+++ b/packages/ui/src/components/chat/ChatInput.tsx
@@ -4976,7 +4976,7 @@ const ChatInputComponent: React.FC<ChatInputProps> = ({ onOpenSettings, scrollTo
                     />
                     <div className="flex items-center gap-2">
                         <div
-                            className="flex h-11 min-w-0 flex-1 items-center gap-x-0.5 rounded-full border border-border/80 pl-2 pr-1"
+                            className="flex h-11 min-w-0 flex-1 items-center gap-x-0.5 rounded-full border border-border/80 pl-2 pr-1 shadow-[0_4px_16px_-4px_rgb(0_0_0_/_0.12)]"
                             style={{ backgroundColor: currentTheme?.colors?.surface?.subtle }}
                         >
                             <MobileSessionPanelTrigger
@@ -5035,7 +5035,7 @@ const ChatInputComponent: React.FC<ChatInputProps> = ({ onOpenSettings, scrollTo
                         >
                             <button
                                 type="button"
-                                className="flex h-11 w-11 cursor-pointer items-center justify-center rounded-full border border-border/80 text-foreground"
+                                className="flex h-11 w-11 cursor-pointer items-center justify-center rounded-full border border-border/80 text-foreground shadow-[0_4px_16px_-4px_rgb(0_0_0_/_0.12)]"
                                 style={{ backgroundColor: currentTheme?.colors?.surface?.subtle }}
                                 onClick={handleMobileNewSession}
                                 disabled={newSessionDraftOpen}
@@ -5066,7 +5066,7 @@ const ChatInputComponent: React.FC<ChatInputProps> = ({ onOpenSettings, scrollTo
                         "flex flex-col relative overflow-visible",
                         isComposerExpanded && 'flex-1 min-h-0',
                         "border border-border/80",
-                        !isMobile && "shadow-[0_4px_16px_-4px_rgb(0_0_0_/_0.12)]",
+                        "shadow-[0_4px_16px_-4px_rgb(0_0_0_/_0.12)]",
                         "focus-within:ring-1",
                         inputMode === 'shell'
                             ? 'focus-within:ring-[var(--status-info)]'
diff --git a/packages/ui/src/components/sections/shared/SettingsSection.tsx b/packages/ui/src/components/sections/shared/SettingsSection.tsx
index 7cbdfbb4..d3ea47bd 100644
--- a/packages/ui/src/components/sections/shared/SettingsSection.tsx
+++ b/packages/ui/src/components/sections/shared/SettingsSection.tsx
@@ -450,7 +450,8 @@ export const SettingsRadioOption: React.FC<SettingsRadioOptionProps> = ({
   return (
     <div
       className={cn(
-        'flex cursor-pointer items-start gap-2 py-0.5',
+        'flex cursor-pointer gap-2 py-0.5',
+        description != null ? 'items-start' : 'items-center',
         disabled && 'cursor-not-allowed opacity-60',
         className,
       )}