diff --git a/app/globals.css b/app/globals.css
index 4005365b..ed77a1b3 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -160,40 +160,6 @@
     box-sizing: border-box;
   }
 
-  .mobile-chat-input-area {
-    height: 70px;
-    padding: 10px;
-    background-color: hsl(var(--background));
-    /* border-top: 1px solid hsl(var(--border)); */ /* Removed for cleaner separation */
-    border-bottom: 1px solid hsl(var(--border)); /* Added for separation from messages area below */
-    box-sizing: border-box;
-    /* z-index: 30; */ /* No longer needed as it's in flow */
-    display: flex;
-    align-items: center;
-  }
-
-  .mobile-chat-input {
-    /* position: relative; */ /* No longer fixed to bottom */
-    /* bottom: 0; */
-    /* left: 0; */ /* Handled by parent flex */
-    /* right: 0; */ /* Handled by parent flex */
-    width: 100%; /* Ensure it takes full width of its container */
-    padding: 10px;
-    background-color: hsl(var(--background));
-    /* border-top: 1px solid hsl(var(--border)); */ /* Removed to avoid double border */
-    /* z-index: 30; */ /* No longer needed */
-  }
-
-  .mobile-chat-input input {
-    width: 100%;
-    padding: 8px;
-    border: 1px solid hsl(var(--input));
-    border-radius: var(--radius);
-    background-color: hsl(var(--input));
-    color: hsl(var(--foreground));
-    box-sizing: border-box;
-  }
-
   .mobile-icons-bar-content .icon-button {
     display: flex;
     align-items: center;
@@ -210,23 +176,6 @@
     background-color: hsl(var(--secondary-foreground));
     color: hsl(var(--secondary));
   }
-
-  .mobile-chat-input .icon-button {
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-    background-color: transparent;
-    border: none;
-    cursor: pointer;
-  }
-
-  .mobile-chat-input .icon-button.paperclip {
-    right: 40px;
-  }
-
-  .mobile-chat-input .icon-button.arrow-right {
-    right: 10px;
-  }
 }
 
 /* Added for MapboxDraw controls */
diff --git a/components/chat-panel.tsx b/components/chat-panel.tsx
index c5268ead..b665dfaa 100644
--- a/components/chat-panel.tsx
+++ b/components/chat-panel.tsx
@@ -88,14 +88,14 @@ export function ChatPanel({ messages, input, setInput }: ChatPanelProps) {
       className={cn(
         'flex flex-col items-start',
         isMobile
-          ? 'w-full h-full'
+          ? 'w-auto'
           : 'sticky bottom-0 bg-background z-10 w-full border-t border-border px-2 py-3 md:px-4'
       )}
     >
       <form
         ref={formRef}
         onSubmit={handleSubmit}
-        className={cn('max-w-full w-full', isMobile ? 'px-2 pb-2 pt-1 h-full flex flex-col justify-center' : '')}
+        className={cn('max-w-full w-full', isMobile ? 'px-2 pb-2 pt-1 flex flex-col justify-center' : '')}
       >
         <div
           className={cn(
diff --git a/components/chat.tsx b/components/chat.tsx
index 34e92244..e86bf1f6 100644
--- a/components/chat.tsx
+++ b/components/chat.tsx
@@ -80,10 +80,9 @@ export function Chat({ id }: ChatProps) {
             {activeView ? <SettingsView /> : <Mapbox />}
           </div>
           <div className="mobile-icons-bar">
-            <MobileIconsBar />
-          </div>
-          <div className="mobile-chat-input-area">
-            <ChatPanel messages={messages} input={input} setInput={setInput} />
+            <MobileIconsBar>
+              <ChatPanel messages={messages} input={input} setInput={setInput} />
+            </MobileIconsBar>
           </div>
           <div className="mobile-chat-messages-area">
             {showEmptyScreen ? (
diff --git a/components/mobile-icons-bar.tsx b/components/mobile-icons-bar.tsx
index a5a2af9a..f2630837 100644
--- a/components/mobile-icons-bar.tsx
+++ b/components/mobile-icons-bar.tsx
@@ -18,7 +18,9 @@ import { History } from '@/components/history'
 import { MapToggle } from './map-toggle'
 import { ModeToggle } from './mode-toggle'
 
-export const MobileIconsBar: React.FC = () => {
+export const MobileIconsBar: React.FC<{ children?: React.ReactNode }> = ({
+  children
+}) => {
   const [, setMessages] = useUIState<typeof AI>()
   const { clearChat } = useActions()
 
@@ -53,6 +55,7 @@ export const MobileIconsBar: React.FC = () => {
       </Button>
       <History location="header" />
       <ModeToggle />
+      {children}
     </div>
   )
 }