diff --git a/attached_assets/image_1758463993565.png b/attached_assets/image_1758463993565.png
new file mode 100644
index 00000000..acda0a96
Binary files /dev/null and b/attached_assets/image_1758463993565.png differ
diff --git a/backend/templates/components/layout/enhanced_header.html b/backend/templates/components/layout/enhanced_header.html
index 7652b797..43f73a5d 100644
--- a/backend/templates/components/layout/enhanced_header.html
+++ b/backend/templates/components/layout/enhanced_header.html
@@ -428,20 +428,22 @@ Includes: Browse menu, advanced search, theme toggle, user dropdown, mobile menu
   <!-- Mobile Search Bar -->
   <div class="md:hidden border-t bg-background">
     <div class="px-4 py-3">
-      <div class="relative max-w-full">
-        <i class="fas fa-search absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground z-10"></i>
-        <input
-          type="search"
-          placeholder="Search parks, rides..."
-          class="w-full pl-10 pr-16 h-10 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
-          hx-get="{% url 'search:search' %}"
-          hx-trigger="input changed delay:300ms"
-          hx-target="#mobile-search-results"
-          hx-include="this"
-          name="q"
-        />
-        <button type="submit" class="absolute right-2 top-1/2 transform -translate-y-1/2 inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-8 px-2">
-          <i class="fas fa-search h-3 w-3"></i>
+      <div class="flex items-center gap-2 w-full">
+        <div class="relative flex-1">
+          <i class="fas fa-search absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground"></i>
+          <input
+            type="search"
+            placeholder="Search parks, rides..."
+            class="w-full pl-10 pr-3 h-10 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+            hx-get="{% url 'search:search' %}"
+            hx-trigger="input changed delay:300ms"
+            hx-target="#mobile-search-results"
+            hx-include="this"
+            name="q"
+          />
+        </div>
+        <button type="submit" class="flex-shrink-0 inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-10 w-10">
+          <i class="fas fa-search h-4 w-4"></i>
         </button>
       </div>
       <div id="mobile-search-results" class="mt-2"></div>