fix: Restore logic and implement mobile responsiveness

frontend/app/page.tsx

@@ -29,6 +29,7 @@ type Tab = (typeof tabs)[number];
 export default function HomePage() {
   const [activeTab, setActiveTab] = useState<Tab>("Dashboard");
   const [showSync, setShowSync] = useState(true);
+  const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
   const [tenders, setTenders] = useState<Tender[]>([]);
   const [selectedTender, setSelectedTender] = useState<Tender | null>(null);
   const [companyProfile, setCompanyProfile] = useState<CompanyProfileType>({
@@ -123,27 +124,52 @@ export default function HomePage() {
   return (
     <div className="min-h-screen">
       {showSync && <GlobalSync onComplete={() => setShowSync(false)} />}
-      <div className="mx-auto flex min-h-screen max-w-[1500px] gap-8 px-8 py-6">
-        <Sidebar
-          tabs={tabs}
-          activeTab={activeTab}
-          onTabSelect={setActiveTab}
-          status={status}
-        />
+      
+      {/* Mobile Header */}
+      <div className="md:hidden flex items-center justify-between px-6 py-4 bg-black/40 backdrop-blur-lg border-b border-white/5 sticky top-0 z-50">
+        <div className="flex items-center gap-2">
+          <div className="w-8 h-8 premium-gradient rounded-lg flex items-center justify-center text-white font-bold text-sm shadow-lg shadow-purple-500/20">A</div>
+          <span className="font-bold text-white text-sm tracking-tight">AndesOps AI</span>
+        </div>
+        <button 
+          onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
+          className="p-2 text-white bg-white/5 rounded-lg border border-white/10 active:scale-95 transition-all"
+        >
+          {isMobileMenuOpen ? "✕" : "☰"}
+        </button>
+      </div>
+
+      <div className="mx-auto flex flex-col md:flex-row min-h-screen max-w-[1500px] gap-4 md:gap-8 px-4 md:px-8 py-4 md:py-6">
+        <div className={`${isMobileMenuOpen ? "fixed inset-0 z-[60] flex" : "hidden"} md:block md:sticky md:top-6 md:h-[calc(100vh-3rem)]`}>
+          {isMobileMenuOpen && (
+            <div className="absolute inset-0 bg-black/80 backdrop-blur-sm md:hidden" onClick={() => setIsMobileMenuOpen(false)} />
+          )}
+          <div className="relative z-10 w-72 md:w-auto h-full md:h-auto">
+            <Sidebar
+              tabs={tabs}
+              activeTab={activeTab}
+              onTabSelect={(tab) => {
+                setActiveTab(tab);
+                setIsMobileMenuOpen(false);
+              }}
+              status={status}
+            />
+          </div>
+        </div>
         
-        <main className="flex-1 flex flex-col gap-6 overflow-hidden">
+        <main className="flex-1 flex flex-col gap-6 overflow-hidden w-full">
           {/* Dashboard Header */}
-          <header className="flex items-center justify-between px-2">
+          <header className="flex flex-col md:flex-row md:items-center justify-between gap-4 px-2">
             <div>
-              <h2 className="text-3xl font-bold text-white mb-1">{activeTab}</h2>
-              <p className="text-slate-500 text-sm">
+              <h2 className="text-2xl md:text-3xl font-bold text-white mb-1">{activeTab}</h2>
+              <p className="text-slate-500 text-xs md:text-sm">
                 {activeTab === "Dashboard" && "Overview of your tender ecosystem."}
                 {activeTab === "Tender Search" && "Explore new opportunities from the market."}
                 {activeTab === "Agent Analysis" && "Deep-dive into tender documentation."}
                 {activeTab === "My Portfolio" && "Manage your followed opportunities."}
               </p>
             </div>
-            <div className="flex items-center gap-4">
+            <div className="hidden md:flex items-center gap-4">
               <div className="flex -space-x-3">
                 {[1, 2, 3].map(i => (
                   <div key={i} className="w-8 h-8 rounded-full border-2 border-[#030303] bg-slate-800 flex items-center justify-center text-[10px] font-bold text-slate-400">