From 496b06fe9eb66802651ebf941e831282a9417230 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Tue, 30 Sep 2025 21:21:05 +0000
Subject: [PATCH] Refactor search result display

---
 src/components/search/AutocompleteSearch.tsx | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/search/AutocompleteSearch.tsx b/src/components/search/AutocompleteSearch.tsx
index 06fbf4e9..374f9b4f 100644
--- a/src/components/search/AutocompleteSearch.tsx
+++ b/src/components/search/AutocompleteSearch.tsx
@@ -275,18 +275,18 @@ export function AutocompleteSearch({
                 ) : (
                   <>
                     <div className="flex-1 min-w-0">
-                      <div className="flex flex-col sm:flex-row sm:items-center gap-1.5 sm:gap-2">
-                        <div className="flex items-center gap-1.5 sm:gap-2 min-w-0">
-                          <span className="font-semibold text-foreground text-sm sm:text-base line-clamp-1">{item.title}</span>
+                      <div className="flex flex-col gap-1">
+                        <span className="font-semibold text-foreground text-sm sm:text-base line-clamp-1">{item.title}</span>
+                        <div className="flex items-center gap-1.5 flex-wrap">
                           <Badge variant="outline" className={`text-[10px] sm:text-xs font-medium whitespace-nowrap ${getTypeColor(item.type)}`}>
                             {getTypeLabel(item.type)}
                           </Badge>
+                          {item.subtitle && (
+                            <Badge variant="secondary" className="text-[10px] sm:text-xs whitespace-nowrap">
+                              {item.subtitle}
+                            </Badge>
+                          )}
                         </div>
-                        {item.subtitle && (
-                          <Badge variant="secondary" className="text-[10px] sm:text-xs whitespace-nowrap w-fit">
-                            {item.subtitle}
-                          </Badge>
-                        )}
                       </div>
                     </div>
                     {((item as SearchResult).rating ?? 0) > 0 && (