diff --git a/components/AIAssist.tsx b/components/AIAssist.tsx
index 32c58dd..acf1bc3 100644
--- a/components/AIAssist.tsx
+++ b/components/AIAssist.tsx
@@ -1213,14 +1213,13 @@ export default function AIAssist({ vibeMode = false }: { vibeMode?: boolean } =
                                 </div>
                                 <div className="flex flex-wrap justify-center gap-2">
                                     {["Forex traders in Singapore", "SaaS founders in UAE", "Fitness influencers on Instagram", "Crypto YouTubers in Latin America", "Marketing agencies in Southeast Asia"].map((label: string) => (
-                                        <Badge
+                                        <div
                                             key={label}
-                                            variant="secondary"
-                                            className="px-3 py-1.5 rounded-full cursor-pointer hover:bg-emerald-600 hover:text-white transition-all text-[10px] font-bold border border-slate-600/30 text-slate-900 dark:text-white shadow-sm"
+                                            className="px-3 py-1.5 rounded-full cursor-pointer hover:bg-emerald-600 hover:text-white transition-all text-[10px] font-bold border border-black/20 text-black bg-white/90 shadow-sm"
                                             onClick={() => setInput(label)}
                                         >
                                             {label}
-                                        </Badge>
+                                        </div>
                                     ))}
                                 </div>
                             </div>
@@ -1240,9 +1239,8 @@ export default function AIAssist({ vibeMode = false }: { vibeMode?: boolean } =
                                 </p>
                                 <div className="mt-10 flex flex-wrap justify-center gap-3">
                                     {t.suggestions.map((chip: any) => (
-                                        <Badge
+                                        <div
                                             key={chip.label}
-                                            variant="secondary"
                                             className="px-4 py-2 rounded-full cursor-pointer hover:bg-blue-600 hover:text-white transition-all text-[11px] font-black border-transparent shadow-sm"
                                             onClick={() => {
                                                 setCurrentAgent(chip.agent);
@@ -1250,7 +1248,7 @@ export default function AIAssist({ vibeMode = false }: { vibeMode?: boolean } =
                                             }}
                                         >
                                             {chip.label}
-                                        </Badge>
+                                        </div>
                                     ))}
                                 </div>
                             </div>
@@ -1327,7 +1325,7 @@ export default function AIAssist({ vibeMode = false }: { vibeMode?: boolean } =
                                                         <p className="text-[11px] font-bold text-slate-500 uppercase mb-1">{t.techStack}</p>
                                                         <div className="flex flex-wrap gap-1">
                                                             {aiPlan.techStack?.map((t_stack: string) => (
-                                                                <Badge key={t_stack} variant="outline" className="text-[9px] border-blue-500/30 text-blue-300 px-1.5 py-0">{t_stack}</Badge>
+                                                                <Badge variant="outline" className="text-[9px] border-blue-500/30 text-blue-300 px-1.5 py-0">{t_stack}</Badge>
                                                             ))}
                                                         </div>
                                                     </div>
@@ -1367,7 +1365,6 @@ export default function AIAssist({ vibeMode = false }: { vibeMode?: boolean } =
 
                                     {msg.role === "assistant" && msg.preview && !(assistStep === "preview" && i === aiAssistHistory.length - 1 && !isProcessing) && (
                                         <Button
-                                            variant="secondary"
                                             size="sm"
                                             className="mt-5 w-full bg-blue-50 dark:bg-blue-900/30 border border-blue-200/60 dark:border-blue-800 text-blue-700 dark:text-blue-200 font-black uppercase tracking-[0.1em] text-[10px] rounded-2xl h-11 hover:scale-[1.02] active:scale-[0.98] transition-all"
                                             onClick={() => {
@@ -1657,9 +1654,9 @@ export default function AIAssist({ vibeMode = false }: { vibeMode?: boolean } =
                                         {currentPreviewData?.isStreaming ? t.neuralLinkActive : t.syncComplete}
                                     </span>
                                 </div>
-                                <Badge variant="outline" className="text-[9px] border-blue-900 text-blue-200/50 font-black">
+                                <div className="text-[9px] border-blue-900 text-blue-200/50 font-black">
                                     {currentPreviewData?.language?.toUpperCase()} UTF-8
-                                </Badge>
+                                </div>
                             </div>
                         </Card>
                     </div>