refactor: migrate from react-hot-toast to react-toastify and replace all emoji icons with Lucide React

- Replaced react-hot-toast with react-toastify (ToastContainer in providers.tsx)
- Removed @heroicons/react dependency
- Added lucide-react for consistent SVG icon system
- Migrated all 18 frontend pages from emoji icons to Lucide components
- Updated sidebar navigation, login/register, dashboard, apps, deploy,
  tickets, admin users/clusters/pools pages
- All emoji indicators (status, runtime, actions) now use proper SVG icons
- Build passes with zero TypeScript errors

frontend/src/app/dashboard/page.tsx

@@ -2,9 +2,11 @@
 
 import { useQuery } from '@tanstack/react-query';
 import Link from 'next/link';
+import type { ReactNode } from 'react';
 import api from '@/lib/api';
 import { useAuthStore } from '@/lib/store';
 import type { Application } from '@/types';
+import { Rocket, Package, Circle, Hexagon } from 'lucide-react';
 
 const statusColors: Record<string, string> = {
   running: 'bg-emerald-100 text-emerald-700',
@@ -16,9 +18,14 @@ const statusColors: Record<string, string> = {
   stopped: 'bg-gray-100 text-gray-600',
 };
 
-const statusIcons: Record<string, string> = {
-  running: '🟢', pending: '🟡', building: '🔵', deploying: '🔵',
-  failed: '🔴', build_failed: '🔴', stopped: '⚪',
+const statusIcons: Record<string, ReactNode> = {
+  running: <Circle className="w-3 h-3 fill-emerald-500 text-emerald-500" />,
+  pending: <Circle className="w-3 h-3 fill-amber-500 text-amber-500" />,
+  building: <Circle className="w-3 h-3 fill-blue-500 text-blue-500" />,
+  deploying: <Circle className="w-3 h-3 fill-blue-500 text-blue-500" />,
+  failed: <Circle className="w-3 h-3 fill-red-500 text-red-500" />,
+  build_failed: <Circle className="w-3 h-3 fill-red-500 text-red-500" />,
+  stopped: <Circle className="w-3 h-3 fill-gray-400 text-gray-400" />,
 };
 
 export default function DashboardPage() {
@@ -41,7 +48,7 @@ export default function DashboardPage() {
       {/* Welcome */}
       <div>
         <h1 className="page-title">
-          Welcome back, {user?.firstName}! 👋
+          Welcome back, {user?.firstName}!
         </h1>
         <p className="page-subtitle">
           Here&apos;s an overview of your applications.
@@ -75,7 +82,7 @@ export default function DashboardPage() {
         <div className="page-header mb-4">
           <h2 className="text-lg font-semibold text-gray-900">Recent Applications</h2>
           <Link href="/dashboard/deploy" className="btn-primary text-sm">
-            🚀 New Application
+            <Rocket className="w-4 h-4 mr-1 inline" /> New Application
           </Link>
         </div>
 
@@ -94,13 +101,13 @@ export default function DashboardPage() {
           </div>
         ) : apps.length === 0 ? (
           <div className="card text-center py-16">
-            <div className="text-5xl mb-4">📦</div>
+            <Package className="w-12 h-12 mx-auto mb-4 text-gray-300" />
             <p className="text-gray-600 text-lg font-medium">No applications yet</p>
             <p className="text-gray-400 mt-1 text-sm">
               Deploy your first application to get started.
             </p>
-            <Link href="/dashboard/deploy" className="btn-primary mt-6 inline-flex">
-              🚀 Deploy your first app
+            <Link href="/dashboard/deploy" className="btn-primary mt-6 inline-flex items-center gap-1">
+              <Rocket className="w-4 h-4" /> Deploy your first app
             </Link>
           </div>
         ) : (
@@ -115,8 +122,8 @@ export default function DashboardPage() {
                   className="card-hover flex items-center justify-between group"
                 >
                   <div className="flex items-center gap-4">
-                    <div className="w-11 h-11 rounded-xl bg-primary-50 flex items-center justify-center text-lg shrink-0">
-                      {app.runtime === 'nodejs' ? '🟩' : '🟧'}
+                    <div className="w-11 h-11 rounded-xl bg-primary-50 flex items-center justify-center shrink-0">
+                      <Hexagon className={`w-5 h-5 ${app.runtime === 'nodejs' ? 'text-green-600' : 'text-orange-500'}`} />
                     </div>
                     <div className="min-w-0">
                       <h3 className="font-semibold text-gray-900 group-hover:text-primary-700 transition-colors truncate">
@@ -129,7 +136,7 @@ export default function DashboardPage() {
                     </div>
                   </div>
                   <div className="flex items-center gap-2 shrink-0">
-                    <span className="text-sm">{statusIcons[status]}</span>
+                    {statusIcons[status]}
                     <span className={`badge ${statusColors[status] || 'badge-gray'}`}>
                       {status}
                     </span>