Update src/components/Navigation.tsx

src/components/Navigation.tsx

@@ -1,13 +1,14 @@
 import React from 'react';
-import { ShoppingBag, ChevronLeft, Zap } from 'lucide-react';
+import { ShoppingBag, ChevronLeft, Zap, BatteryLow, BatteryFull } from 'lucide-react';
 import { APP_NAME } from '../constants';
 
 interface NavigationProps {
   onBack?: () => void;
   showBack: boolean;
+  cooldown?: number;
 }
 
-const Navigation: React.FC<NavigationProps> = ({ onBack, showBack }) => {
+const Navigation: React.FC<NavigationProps> = ({ onBack, showBack, cooldown = 0 }) => {
   return (
     <nav className="sticky top-0 z-50 bg-white border-b border-gray-100 shadow-sm h-16 flex items-center px-4 justify-between">
       <div className="flex items-center gap-2">
@@ -28,10 +29,17 @@ const Navigation: React.FC<NavigationProps> = ({ onBack, showBack }) => {
       </div>
       
       <div className="flex items-center gap-4">
-         <div className="hidden md:flex items-center gap-2 px-3 py-1.5 bg-brand-50 rounded-full border border-brand-100">
-            <Zap className="w-3 h-3 text-brand-500 fill-brand-500" />
-            <span className="text-[10px] font-bold text-brand-600 uppercase tracking-tighter">Free AI Tier</span>
-         </div>
+         {cooldown > 0 ? (
+           <div className="flex items-center gap-2 px-3 py-1.5 bg-amber-50 rounded-full border border-amber-100">
+              <BatteryLow className="w-3 h-3 text-amber-500" />
+              <span className="text-[10px] font-bold text-amber-600 uppercase tracking-tighter">Cooling {cooldown}s</span>
+           </div>
+         ) : (
+           <div className="flex items-center gap-2 px-3 py-1.5 bg-emerald-50 rounded-full border border-emerald-100">
+              <BatteryFull className="w-3 h-3 text-emerald-500" />
+              <span className="text-[10px] font-bold text-emerald-600 uppercase tracking-tighter">Ready</span>
+           </div>
+         )}
          <div className="w-8 h-8 bg-gray-200 rounded-full overflow-hidden border border-gray-300">
             <img src="https://picsum.photos/100/100" alt="Profile" className="w-full h-full object-cover" />
          </div>