fix: decouple portfolio toggle from row click and add explicit view button

frontend/components/TenderSearch.tsx

@@ -160,32 +160,44 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
           <thead className="bg-white/5 text-slate-500 uppercase text-[10px] font-bold border-b border-white/5">
             <tr>
               <th className="px-6 py-5 w-[60px] text-center"></th>
-              <th className="px-6 py-5 w-[100px]">ID</th>
-              <th className="px-6 py-5 w-[300px]">Opportunity</th>
+              <th className="px-6 py-5 w-[120px]">ID</th>
+              <th className="px-6 py-5">Opportunity</th>
               <th className="px-6 py-5 w-[200px]">Buyer</th>
               <th className="px-6 py-5 text-center w-[120px]">Status</th>
+              <th className="px-6 py-5 w-[100px] text-center">Action</th>
             </tr>
           </thead>
           <tbody className="divide-y divide-white/5">
             {filteredTenders.map((item) => (
-              <tr key={item.code} className="hover:bg-white/[0.04] transition-colors group cursor-pointer" onClick={() => setSelectedTenderForModal(item)}>
+              <tr key={item.code} className="hover:bg-white/[0.04] transition-colors group">
                 <td className="px-4 py-5 text-center">
                   <button 
-                    onClick={(e) => {
+                    onPointerDown={(e) => {
                       e.stopPropagation();
+                      console.log("[Portfolio] Toggling follow for:", item.code);
                       toggleFollow(item);
                     }}
-                    className={`text-xl transition-all hover:scale-125 active:scale-90 ${followedCodes.includes(item.code) ? 'text-amber-400 drop-shadow-[0_0_10px_rgba(251,191,36,0.5)]' : 'text-white/10 hover:text-white/30'}`}
+                    className={`text-xl transition-all hover:scale-125 active:scale-90 p-2 cursor-pointer relative z-50 ${followedCodes.includes(item.code) ? 'text-amber-400 drop-shadow-[0_0_10px_rgba(251,191,36,0.6)]' : 'text-white/30 hover:text-white/60'}`}
                   >
                     {followedCodes.includes(item.code) ? "★" : "☆"}
                   </button>
                 </td>
                 <td className="px-6 py-5 font-mono text-purple-400 text-[10px]">{item.code}</td>
-                <td className="px-6 py-5"><div className="font-bold text-white truncate text-xs">{item.name}</div></td>
+                <td className="px-6 py-5">
+                   <div className="font-bold text-white truncate text-xs max-w-[400px]" title={item.name}>{item.name}</div>
+                </td>
                 <td className="px-6 py-5 text-slate-400 text-[11px] truncate">{item.buyer}</td>
                 <td className="px-6 py-5 text-center">
                   <span className={`inline-block rounded-full px-3 py-1 text-[9px] font-black uppercase ${item.status.toLowerCase().includes('publicada') ? 'bg-green-500/10 text-green-400' : 'bg-slate-800 text-slate-500'}`}>{item.status}</span>
                 </td>
+                <td className="px-6 py-5 text-center">
+                   <button 
+                     onClick={() => setSelectedTenderForModal(item)}
+                     className="px-4 py-2 rounded-xl bg-purple-500/10 border border-purple-500/20 text-[10px] font-black text-purple-400 hover:bg-purple-500 hover:text-white transition-all uppercase tracking-widest"
+                   >
+                     View
+                   </button>
+                </td>
               </tr>
             ))}
           </tbody>