Fix search button click handler and improve modal UX - separate Search and Save sections

frontend/components/TenderSearch.tsx

@@ -263,8 +263,9 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
                 <div className="flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between">
                   <div className="flex flex-col gap-2">
                     <button
-                      type="submit"
+                      type="button"
                       disabled={isLoading}
+                      onClick={handleSearch}
                       className="w-full sm:w-auto premium-gradient hover:opacity-90 text-white font-bold py-3.5 rounded-xl transition-all shadow-lg shadow-purple-500/20 active:scale-[0.98] disabled:opacity-50"
                     >
                       {searchButtonLabel}
@@ -432,25 +433,32 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
         <div className="animate-in slide-in-from-right-8 fade-in duration-700 w-full max-w-[1600px] mx-auto pt-4 pb-20">
 
 
-          <div className="flex items-center justify-between mb-8">
+          <div className="flex flex-col gap-6 mb-8">
             <button 
               onClick={() => setSelectedTenderForModal(null)}
-              className="flex items-center gap-2 text-slate-400 hover:text-white transition group"
+              className="flex items-center gap-2 text-slate-400 hover:text-white transition group w-fit"
             >
               <span className="text-xl group-hover:-translate-x-1 transition-transform">←</span>
-              <span className="text-sm font-bold uppercase tracking-widest">{lang === 'en' ? 'Back to opportunities' : 'Volver a licitaciones'}</span>
+              <span className="text-sm font-bold uppercase tracking-widest">{lang === 'en' ? 'Back to search' : 'Volver a búsqueda'}</span>
             </button>
-            <div className="flex gap-4">
-              <button 
-                onClick={() => toggleFollow(selectedTenderForModal)}
-                className={`px-4 py-2 rounded-xl border font-bold text-xs transition-all ${
-                  followedCodes.includes(selectedTenderForModal.code) 
-                    ? "bg-purple-500/20 border-purple-500/40 text-purple-300"
-                    : "bg-white/5 border-white/10 text-slate-400 hover:bg-white/10"
-                }`}
-              >
-                {followedCodes.includes(selectedTenderForModal.code) ? "★ Saved" : "☆ Save to Portfolio"}
-              </button>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="px-4 py-3 rounded-lg bg-white/5 border border-white/10">
+                <div className="text-[10px] font-black uppercase tracking-[0.2em] text-slate-400 mb-2">Search</div>
+                <p className="text-xs text-slate-300">View detailed information</p>
+              </div>
+              <div className="px-4 py-3 rounded-lg bg-purple-500/5 border border-purple-500/20">
+                <div className="text-[10px] font-black uppercase tracking-[0.2em] text-purple-300 mb-2">Save</div>
+                <button 
+                  onClick={() => toggleFollow(selectedTenderForModal)}
+                  className={`text-xs font-bold transition-all ${
+                    followedCodes.includes(selectedTenderForModal.code) 
+                      ? "text-purple-300"
+                      : "text-slate-400 hover:text-purple-300"
+                  }`}
+                >
+                  {followedCodes.includes(selectedTenderForModal.code) ? "★ Saved to Portfolio" : "☆ Save to Portfolio"}
+                </button>
+              </div>
             </div>
           </div>
 
@@ -623,23 +631,27 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
               <div className="flex items-center gap-4">
                 <div className="w-12 h-12 rounded-full bg-cyan/10 border border-cyan/20 flex items-center justify-center text-cyan">🤖</div>
                 <div>
-                  <p className="text-white font-bold text-sm">Ready for Agent Analysis</p>
-                  <p className="text-slate-500 text-xs">Our multi-agent system will evaluate compliance and technical fit.</p>
+                  <p className="text-white font-bold text-sm">Ready for Analysis</p>
+                  <p className="text-slate-500 text-xs">Run AI compliance check and opportunity fit assessment.</p>
                 </div>
               </div>
-              <div className="flex items-center gap-6 w-full md:w-auto">
+              <div className="flex items-center gap-4 w-full md:w-auto">
                 <button 
-                  onClick={() => setSelectedTenderForModal(null)}
-                  className="flex-1 md:flex-none px-8 py-4 text-xs font-black uppercase tracking-widest text-slate-500 hover:text-white transition"
+                  onClick={() => toggleFollow(selectedTenderForModal)}
+                  className={`flex-1 md:flex-none px-6 py-3 text-xs font-bold uppercase tracking-widest rounded-lg border transition-all ${
+                    followedCodes.includes(selectedTenderForModal.code)
+                      ? 'bg-purple-500/20 border-purple-500/40 text-purple-300'
+                      : 'border-white/10 text-slate-400 hover:border-purple-400/40 hover:text-purple-300'
+                  }`}
                 >
-                  {lang === 'en' ? 'Close View' : 'Cerrar Vista'}
+                  {followedCodes.includes(selectedTenderForModal.code) ? "★ In Portfolio" : "☆ Add to Portfolio"}
                 </button>
                 <button 
                   onClick={() => {
                     onAnalyze(selectedTenderForModal);
                     setSelectedTenderForModal(null);
                   }}
-                  className="flex-1 md:flex-none premium-gradient text-white px-10 py-5 rounded-2xl font-black text-xs uppercase tracking-[0.2em] shadow-2xl shadow-purple-500/30 hover:scale-105 active:scale-95 transition-all"
+                  className="flex-1 md:flex-none premium-gradient text-white px-8 py-3 rounded-lg font-black text-xs uppercase tracking-[0.2em] shadow-xl shadow-purple-500/30 hover:scale-105 active:scale-95 transition-all"
                 >
                   {t.analyze}
                 </button>