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/tickets/[id]/page.tsx

@@ -5,8 +5,9 @@ import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
 import { useParams, useRouter } from 'next/navigation';
 import api from '@/lib/api';
 import { useAuthStore } from '@/lib/store';
-import toast from 'react-hot-toast';
+import { toast } from 'react-toastify';
 import type { Ticket } from '@/types';
+import { Wrench, Briefcase } from 'lucide-react';
 
 const statusColors: Record<string, string> = {
   open: 'bg-yellow-100 text-yellow-700',
@@ -83,8 +84,8 @@ export default function TicketDetailPage() {
             <span className={`px-2 py-0.5 rounded-full text-xs font-medium ${statusColors[ticket.status]}`}>
               {ticket.status}
             </span>
-            <span className="text-xs text-gray-500">
-              {ticket.department === 'technical' ? '🔧 Technical' : '💼 Sales'}
+            <span className="text-xs text-gray-500 flex items-center gap-1">
+              {ticket.department === 'technical' ? <><Wrench className="w-3 h-3" /> Technical</> : <><Briefcase className="w-3 h-3" /> Sales</>}
             </span>
             <span className="text-xs text-gray-400">
               {new Date(ticket.createdAt).toLocaleString()}

frontend/src/app/dashboard/tickets/page.tsx

@@ -5,8 +5,9 @@ import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
 import Link from 'next/link';
 import api from '@/lib/api';
 import { useAuthStore } from '@/lib/store';
-import toast from 'react-hot-toast';
+import { toast } from 'react-toastify';
 import type { Ticket, CreateTicketDto, TicketDepartment, TicketPriority } from '@/types';
+import { Wrench, Briefcase, Ticket as TicketIcon, X } from 'lucide-react';
 
 const statusColors: Record<string, string> = {
   open: 'bg-yellow-100 text-yellow-700',
@@ -29,10 +30,10 @@ export default function TicketsPage() {
   // Staff can only create tickets to other departments
   const availableDepartments: { value: TicketDepartment; label: string }[] = [];
   if (user?.role !== 'technical') {
-    availableDepartments.push({ value: 'technical', label: '🔧 Technical Support' });
+    availableDepartments.push({ value: 'technical', label: 'Technical Support' });
   }
   if (user?.role !== 'sales') {
-    availableDepartments.push({ value: 'sales', label: '💼 Sales' });
+    availableDepartments.push({ value: 'sales', label: 'Sales' });
   }
   const canCreateTicket = availableDepartments.length > 0;
   const [form, setForm] = useState<CreateTicketDto>({
@@ -72,7 +73,7 @@ export default function TicketsPage() {
         </div>
         {canCreateTicket && (
           <button onClick={() => setShowCreate(!showCreate)} className="btn-primary">
-            {showCreate ? '✕ Cancel' : '+ New Ticket'}
+            {showCreate ? <><X className="w-4 h-4 inline" /> Cancel</> : '+ New Ticket'}
           </button>
         )}
       </div>
@@ -115,9 +116,9 @@ export default function TicketsPage() {
                 value={form.priority}
                 onChange={(e) => setForm({ ...form, priority: e.target.value as TicketPriority })}
               >
-                <option value="low">🟢 Low</option>
-                <option value="medium">🟡 Medium</option>
-                <option value="high">🔴 High</option>
+                <option value="low">Low</option>
+                <option value="medium">Medium</option>
+                <option value="high">High</option>
               </select>
             </div>
           </div>
@@ -149,7 +150,7 @@ export default function TicketsPage() {
         </div>
       ) : tickets.length === 0 ? (
         <div className="card p-12 text-center">
-          <span className="text-4xl">🎫</span>
+          <TicketIcon className="w-10 h-10 mx-auto text-gray-300" />
           <h3 className="mt-3 text-lg font-semibold text-gray-700">No tickets yet</h3>
           <p className="text-sm text-gray-500 mt-1">Create a ticket if you need help</p>
         </div>
@@ -173,7 +174,7 @@ export default function TicketsPage() {
                     </span>
                   </div>
                   <div className="flex items-center gap-3 mt-1.5 text-xs text-gray-500">
-                    <span>{ticket.department === 'technical' ? '🔧 Technical' : '💼 Sales'}</span>
+                    <span className="flex items-center gap-1">{ticket.department === 'technical' ? <><Wrench className="w-3 h-3" /> Technical</> : <><Briefcase className="w-3 h-3" /> Sales</>}</span>
                     <span>•</span>
                     <span>{new Date(ticket.createdAt).toLocaleDateString('en-US', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' })}</span>
                     <span>•</span>