diff --git a/src/features/chat/components/SuggestionChips.tsx b/src/features/chat/components/SuggestionChips.tsx
index cf14d93..8759cfe 100644
--- a/src/features/chat/components/SuggestionChips.tsx
+++ b/src/features/chat/components/SuggestionChips.tsx
@@ -9,14 +9,21 @@ interface SuggestionChipsProps {
 
 export function SuggestionChips({ options, onSelect, className }: SuggestionChipsProps) {
   return (
-    <div className={cn('flex flex-wrap gap-2', className)}>
+    <div
+      className={cn(
+        'flex gap-2 overflow-x-auto pb-1 -mb-1 scrollbar-hide',
+        // Wrap on desktop, scroll on mobile
+        'sm:flex-wrap',
+        className,
+      )}
+    >
       {options.map((option) => (
         <button
           key={option.value}
           type="button"
           onClick={() => onSelect(option.value, option.label)}
           className={cn(
-            'px-3 py-1.5 text-sm rounded-full border transition-colors',
+            'px-3 py-1.5 text-sm rounded-full border transition-colors whitespace-nowrap shrink-0',
             'bg-background hover:bg-accent/10 hover:border-accent/50',
             'focus:outline-none focus:ring-2 focus:ring-accent focus:ring-offset-2',
           )}
diff --git a/src/styles/global.css b/src/styles/global.css
index 5392e3a..fd4bf78 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -43,3 +43,14 @@
     }
   }
 }
+
+@layer utilities {
+  /* Hide scrollbar while maintaining scroll functionality */
+  .scrollbar-hide {
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+  }
+  .scrollbar-hide::-webkit-scrollbar {
+    display: none;
+  }
+}