fix(chat): place browser hint between header actions

src/app/chat/components/chat-header.tsx

@@ -12,12 +12,19 @@ import { BackButton } from "@/app/_components";
 import { ROUTES } from "@/router/routes";
 import { useAppNavigator } from "@/router/use-app-navigator";
 
+import { BrowserHintOverlay } from "./browser-hint-overlay";
+
 export interface ChatHeaderProps {
   isGuest: boolean;
   offerBanner?: ReactNode;
+  showBrowserHint?: boolean;
 }
 
-export function ChatHeader({ isGuest, offerBanner }: ChatHeaderProps) {
+export function ChatHeader({
+  isGuest,
+  offerBanner,
+  showBrowserHint = false,
+}: ChatHeaderProps) {
   const navigator = useAppNavigator();
 
   return (
@@ -43,7 +50,7 @@ export function ChatHeader({ isGuest, offerBanner }: ChatHeaderProps) {
       )}
 
       {!isGuest ? (
-        <div className="flex items-center justify-between px-(--spacing-md,12px) py-(--spacing-sm,8px)">
+        <div className="grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-(--spacing-sm,8px) px-(--spacing-md,12px) py-(--spacing-sm,8px)">
           <BackButton
             href={ROUTES.splash}
             variant="dark"
@@ -51,6 +58,10 @@ export function ChatHeader({ isGuest, offerBanner }: ChatHeaderProps) {
             analyticsKey="chat.back_to_home"
           />
 
+          <div className="flex min-w-0 justify-center">
+            {showBrowserHint ? <BrowserHintOverlay /> : null}
+          </div>
+
           <button
             type="button"
             data-analytics-key="chat.open_menu"