diff --git a/BOOKING_INTEGRATION.md b/BOOKING_INTEGRATION.md
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/api/ragbot/booking-suggestions/route.ts b/src/app/api/ragbot/booking-suggestions/route.ts
new file mode 100644
index 0000000..c106f8b
--- /dev/null
+++ b/src/app/api/ragbot/booking-suggestions/route.ts
@@ -0,0 +1,290 @@
+// src/app/api/ragbot/booking-suggestions/route.ts
+import { NextRequest, NextResponse } from 'next/server';
+import connectDB from '@/lib/db';
+import Department from '@/lib/models/departmentSchema';
+
+interface ServiceSchema {
+  id: string;
+  name: string;
+  description?: string;
+  category?: string;
+  isActive?: boolean;
+  processingTime?: string;
+  fee?: number;
+  requirements?: string[];
+}
+interface DepartmentData {
+  id: string;
+  departmentId: string;
+  name: string;
+  shortName: string;
+  description: string;
+  services?: ServiceData[];
+}
+
+interface ServiceData {
+  id: string;
+  name: string;
+  description?: string;
+  category?: string;
+  processingTime?: string;
+  fee?: number;
+  requirements?: string[];
+  departmentId?: string;
+  departmentName?: string;
+}
+
+interface BookingSuggestion {
+  type: 'department' | 'service';
+  id: string;
+  name: string;
+  description?: string;
+  departmentId?: string;
+  departmentName?: string;
+  category?: string;
+  fee?: number;
+  relevanceScore: number;
+}
+
+/**
+ * Server-side booking suggestions for the RAG bot
+ */
+export async function POST(request: NextRequest) {
+  try {
+    // Add proper error handling for JSON parsing
+    let body;
+    try {
+      body = await request.json();
+    } catch (jsonError) {
+      console.error('❌ Invalid JSON in request body:', jsonError);
+      return NextResponse.json(
+        { 
+          error: 'Invalid JSON in request body',
+          suggestions: [],
+          details: jsonError instanceof Error ? jsonError.message : 'Unknown JSON parsing error'
+        },
+        { status: 400 }
+      );
+    }
+
+    const { query } = body;
+
+    if (!query) {
+      return NextResponse.json(
+        { 
+          error: 'Query is required',
+          suggestions: []
+        },
+        { status: 400 }
+      );
+    }
+
+    console.log('🔍 Booking suggestions API called with query:', query);
+
+    await connectDB();
+
+    // Fetch departments with services
+    const departments = await Department.find(
+      { 
+        $or: [
+          { status: 'ACTIVE' },
+          { status: 'active' }
+        ]
+      },
+      {
+        _id: 1,
+        departmentId: 1,
+        name: 1,
+        shortName: 1,
+        description: 1,
+        services: 1
+      }
+    ).lean();
+
+    console.log('🏛️ Raw departments from DB:', departments.length);
+    console.log('📊 First department services:', departments[0]?.services?.length || 0);
+
+    // Transform data to match booking helper format
+    const departmentData: DepartmentData[] = departments.map(dept => ({
+      id: dept._id ? String(dept._id) : '',
+      departmentId: dept.departmentId || '',
+      name: dept.name || '',
+      shortName: dept.shortName || '',
+      description: dept.description || '',
+      services: (dept.services || [])
+        .filter((service: ServiceSchema) => service.isActive)
+        .map((service: ServiceSchema) => ({
+          id: service.id || '',
+          name: service.name || '',
+          description: service.description || '',
+          category: service.category || '',
+          processingTime: service.processingTime || '',
+          fee: service.fee || 0,
+          requirements: service.requirements || [],
+          departmentId: dept.departmentId || '',
+          departmentName: dept.name || ''
+        }))
+    }));
+
+    // Flatten all services
+    const services: ServiceData[] = departmentData.flatMap(dept => dept.services || []);
+
+    // Generate suggestions using server-side logic
+    const suggestions = generateBookingSuggestions(query, departmentData, services);
+
+    console.log('📊 Generated suggestions:', suggestions.length);
+    console.log('🎯 Suggestions:', suggestions);
+    console.log('🏛️ Departments found:', departmentData.length);
+    console.log('📋 Services found:', services.length);
+
+    return NextResponse.json({
+      success: true,
+      suggestions,
+      departments: departmentData,
+      services
+    });
+
+  } catch (error) {
+    console.error('Error generating booking suggestions:', error);
+    const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+    
+    return NextResponse.json(
+      { 
+        error: 'Internal server error',
+        details: errorMessage
+      },
+      { status: 500 }
+    );
+  }
+}
+
+/**
+ * Server-side suggestion logic (similar to client-side but optimized for server)
+ */
+function generateBookingSuggestions(
+  query: string, 
+  departments: DepartmentData[], 
+  services: ServiceData[]
+): BookingSuggestion[] {
+  const normalizedQuery = query.toLowerCase();
+  const suggestions: BookingSuggestion[] = [];
+
+  // Keywords mapping for better matching
+  const serviceKeywords: Record<string, string[]> = {
+    passport: ['passport', 'travel', 'immigration', 'visa', 'abroad', 'international'],
+    license: ['license', 'permit', 'driving', 'vehicle', 'motorcycle', 'car'],
+    certificate: ['certificate', 'birth', 'death', 'marriage', 'divorce', 'citizenship'],
+    registration: ['register', 'registration', 'business', 'company', 'organization'],
+    tax: ['tax', 'income', 'vat', 'customs', 'duty', 'revenue'],
+    education: ['education', 'school', 'university', 'degree', 'scholarship', 'student'],
+    health: ['health', 'medical', 'hospital', 'medicine', 'doctor', 'treatment'],
+    property: ['property', 'land', 'house', 'building', 'real estate', 'title'],
+    insurance: ['insurance', 'social security', 'pension', 'retirement', 'benefits'],
+    employment: ['employment', 'job', 'work', 'labor', 'salary', 'employee']
+  };
+
+  // Department keywords mapping
+  const departmentKeywords: Record<string, string[]> = {
+    immigration: ['immigration', 'passport', 'visa', 'travel', 'foreign'],
+    transport: ['transport', 'vehicle', 'driving', 'license', 'road'],
+    registrar: ['registrar', 'birth', 'death', 'marriage', 'certificate'],
+    revenue: ['revenue', 'tax', 'customs', 'duty', 'vat'],
+    education: ['education', 'ministry of education', 'school', 'university'],
+    health: ['health', 'ministry of health', 'medical', 'hospital'],
+    lands: ['lands', 'property', 'title', 'survey', 'real estate']
+  };
+
+  // Score services based on keyword matching
+  services.forEach(service => {
+    let relevanceScore = 0;
+    
+    // Direct name matching
+    if (service.name.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 10;
+    }
+    
+    // Description matching
+    if (service.description && service.description.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 7;
+    }
+    
+    // Category matching
+    if (service.category && service.category.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 5;
+    }
+    
+    // Keyword matching
+    Object.entries(serviceKeywords).forEach(([category, keywords]) => {
+      keywords.forEach(keyword => {
+        if (normalizedQuery.includes(keyword)) {
+          if (service.name.toLowerCase().includes(category)) {
+            relevanceScore += 8;
+          } else if (service.description?.toLowerCase().includes(category)) {
+            relevanceScore += 6;
+          } else if (service.category?.toLowerCase().includes(category)) {
+            relevanceScore += 4;
+          }
+        }
+      });
+    });
+    
+    if (relevanceScore > 0) {
+      suggestions.push({
+        type: 'service',
+        id: service.id,
+        name: service.name,
+        description: service.description,
+        departmentId: service.departmentId,
+        departmentName: service.departmentName,
+        category: service.category,
+        fee: service.fee,
+        relevanceScore
+      });
+    }
+  });
+
+  // Score departments based on keyword matching
+  departments.forEach(dept => {
+    let relevanceScore = 0;
+    
+    // Direct name matching
+    if (dept.name.toLowerCase().includes(normalizedQuery) || 
+        dept.shortName.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 8;
+    }
+    
+    // Description matching
+    if (dept.description && dept.description.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 6;
+    }
+    
+    // Keyword matching for departments
+    Object.entries(departmentKeywords).forEach(([category, keywords]) => {
+      keywords.forEach(keyword => {
+        if (normalizedQuery.includes(keyword)) {
+          if (dept.name.toLowerCase().includes(category) || 
+              dept.shortName.toLowerCase().includes(category)) {
+            relevanceScore += 7;
+          } else if (dept.description?.toLowerCase().includes(category)) {
+            relevanceScore += 5;
+          }
+        }
+      });
+    });
+    
+    if (relevanceScore > 0) {
+      suggestions.push({
+        type: 'department',
+        id: dept.departmentId,
+        name: dept.name,
+        description: dept.description,
+        relevanceScore
+      });
+    }
+  });
+
+  // Sort by relevance score and return top 5
+  return suggestions
+    .sort((a, b) => b.relevanceScore - a.relevanceScore)
+    .slice(0, 5);
+}
diff --git a/src/app/globals.css b/src/app/globals.css
index 83d8719..70c8651 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -621,4 +621,51 @@
   border: 2px solid #00ff00 !important;
   border-radius: 4px;
   box-shadow: 0 0 10px rgba(0, 255, 0, 0.5);
+}
+
+.markdown-content a {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  margin: 0 0.125rem;
+  padding: 0.25rem 0.5rem;
+  border-radius: 0.375rem;
+  background: linear-gradient(135deg, 
+    rgba(255, 199, 44, 0.1) 0%, 
+    rgba(255, 87, 34, 0.1) 100%);
+  border: 1px solid rgba(255, 199, 44, 0.3);
+  color: #FFC72C;
+  font-weight: 500;
+  font-size: 0.875rem;
+  text-decoration: none;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  backdrop-filter: blur(4px);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+.markdown-content a:hover {
+  color: #FF5722;
+  border-color: rgba(255, 87, 34, 0.5);
+  background: linear-gradient(135deg, 
+    rgba(255, 199, 44, 0.15) 0%, 
+    rgba(255, 87, 34, 0.15) 100%);
+  box-shadow: 0 4px 12px rgba(255, 199, 44, 0.2);
+  transform: translateY(-1px);
+}
+
+/* Dark mode adjustments */
+:root.dark .markdown-content a {
+  background: linear-gradient(135deg, 
+    rgba(255, 199, 44, 0.08) 0%, 
+    rgba(255, 87, 34, 0.08) 100%);
+  border-color: rgba(255, 199, 44, 0.25);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
+}
+
+:root.dark .markdown-content a:hover {
+  background: linear-gradient(135deg, 
+    rgba(255, 199, 44, 0.12) 0%, 
+    rgba(255, 87, 34, 0.12) 100%);
+  box-shadow: 0 4px 12px rgba(255, 199, 44, 0.15);
 }
\ No newline at end of file
diff --git a/src/app/ragbot/page.tsx b/src/app/ragbot/page.tsx
index 842f606..0830262 100644
--- a/src/app/ragbot/page.tsx
+++ b/src/app/ragbot/page.tsx
@@ -1,16 +1,17 @@
 // src/app/ragbot/page.tsx
 "use client";
-import React, { Suspense, useState, useEffect, useRef } from 'react';
+import React, { Suspense, useState, useEffect, useRef, useCallback } from 'react';
+import { useSearchParams, useRouter } from 'next/navigation';
 import UserDashboardLayout from '@/components/user/dashboard/UserDashboardLayout';
-import BookingChatManager from '@/components/user/chat/BookingChatManager';
-import { useRouter } from 'next/navigation';
+
+import { useAuth } from '@/lib/auth/AuthContext';
+import { Header } from '@/components/Header';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import rehypeHighlight from 'rehype-highlight';
 import rehypeRaw from 'rehype-raw';
 import 'highlight.js/styles/github-dark.css';
 
-// --- TYPES ---
 type Language = 'en' | 'si' | 'ta';
 
 interface DepartmentContact {
@@ -46,7 +47,7 @@ const chatTranslations: Record<Language, {
     relatedServices: string;
     howToApply: string;
     contactInfo: string;
-    waitForAgent: string;
+    bookAppointment: string;
   };
   contactDetails: string;
   sources: string;
@@ -64,7 +65,7 @@ const chatTranslations: Record<Language, {
       relatedServices: 'Related services for business registration',
       howToApply: 'How do I apply for a marriage certificate?',
       contactInfo: 'Contact info for Ministry of Education',
-      waitForAgent: 'Wait for Agent'
+      bookAppointment: 'Book an appointment with a government office'
     },
     contactDetails: 'Department Contacts',
     sources: 'Sources'
@@ -82,7 +83,7 @@ const chatTranslations: Record<Language, {
       relatedServices: 'ව්‍යාපාර ලියාපදිංචිය සඳහා අදාළ සේවා',
       howToApply: 'විවාහ සහතිකයක් සඳහා අයදුම් කරන්නේ කෙසේද?',
       contactInfo: 'අධ්‍යාපන අමාත්‍යාංශයේ සම්බන්ධතා තොරතුරු',
-      waitForAgent: 'නියෝජිතයෙකු සඳහා රැඳී සිටින්න'
+      bookAppointment: 'රජයේ කාර්යාලයක් සමඟ හමුවීමක් වෙන් කරන්න'
     },
     contactDetails: 'දෙපාර්තමේන්තු සම්බන්ධතා',
     sources: 'මූලාශ්‍ර'
@@ -100,14 +101,14 @@ const chatTranslations: Record<Language, {
       relatedServices: 'வணிகப் பதிவிற்கான தொடர்புடைய சேவைகள்',
       howToApply: 'திருமணச் சான்றிதழுக்கு நான் எப்படி விண்ணப்பிப்பது?',
       contactInfo: 'கல்வி அமைச்சுக்கான தொடர்புத் தகவல்',
-      waitForAgent: 'முகவருக்காக காத்திருங்கள்'
+      bookAppointment: 'அரசு அலுவலகத்துடன் சந்திப்பை முன்பதிவு செய்யுங்கள்'
     },
     contactDetails: 'துறை தொடர்புகள்',
     sources: 'ஆதாரங்கள்'
   }
 };
 
-// --- PREMIUM SVG ICON COMPONENTS ---
+// --- ICON COMPONENTS ---
 const SendIcon = (props: React.SVGProps<SVGSVGElement>) => (
   <svg {...props} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
     <line x1="22" y1="2" x2="11" y2="13"/>
@@ -115,6 +116,80 @@ const SendIcon = (props: React.SVGProps<SVGSVGElement>) => (
   </svg>
 );
 
+const HomeIcon = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg {...props} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+    <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
+    <polyline points="9,22 9,12 15,12 15,22"/>
+  </svg>
+);
+
+const DashboardIcon = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg {...props} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+    <rect width="7" height="9" x="3" y="3" rx="1"/>
+    <rect width="7" height="5" x="14" y="3" rx="1"/>
+    <rect width="7" height="9" x="14" y="12" rx="1"/>
+    <rect width="7" height="5" x="3" y="16" rx="1"/>
+  </svg>
+);
+
+const LoginIcon = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg {...props} xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+    <path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"/>
+    <polyline points="10,17 15,12 10,7"/>
+    <line x1="15" y1="12" x2="3" y2="12"/>
+  </svg>
+);
+
+// --- NAVIGATION COMPONENT ---
+const ChatbotNavigation = ({ isAuthenticated }: { isAuthenticated: boolean }) => {
+  const router = useRouter();
+
+  const handleHomeClick = () => {
+    router.push('/');
+  };
+
+  const handleDashboardClick = () => {
+    if (isAuthenticated) {
+      router.push('/user/dashboard');
+    } else {
+      router.push('/user/auth/login');
+    }
+  };
+
+  return (
+    <div className="fixed top-4 right-4 z-50 flex gap-2">
+      {/* Home Button */}
+      <button
+        onClick={handleHomeClick}
+        className="flex items-center gap-2 px-4 py-2 bg-white/90 dark:bg-gray-800/90 backdrop-blur-md border border-gray-200/50 dark:border-gray-700/50 rounded-lg shadow-lg hover:shadow-xl transition-all duration-200 hover:scale-105 text-gray-700 dark:text-gray-200"
+        title="Go to Home"
+      >
+        <HomeIcon className="w-4 h-4" />
+        <span className="text-sm font-medium">Home</span>
+      </button>
+
+      {/* Dashboard/Login Button */}
+      <button
+        onClick={handleDashboardClick}
+        className="flex items-center gap-2 px-4 py-2 bg-gradient-to-r from-[#FFC72C]/90 to-[#FF5722]/90 backdrop-blur-md border border-[#FFC72C]/50 rounded-lg shadow-lg hover:shadow-xl transition-all duration-200 hover:scale-105 text-white"
+        title={isAuthenticated ? "Go to Dashboard" : "Login to Dashboard"}
+      >
+        {isAuthenticated ? (
+          <>
+            <DashboardIcon className="w-4 h-4" />
+            <span className="text-sm font-medium">Dashboard</span>
+          </>
+        ) : (
+          <>
+            <LoginIcon className="w-4 h-4" />
+            <span className="text-sm font-medium">Login</span>
+          </>
+        )}
+      </button>
+    </div>
+  );
+};
+
 const SparklesIcon = (props: React.SVGProps<SVGSVGElement>) => (
   <svg {...props} xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
     <path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .962 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.582a.5.5 0 0 1 0 .962L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.962 0L9.937 15.5Z"/>
@@ -148,7 +223,7 @@ const RAGBotIcon = () => (
   </div>
 );
 
-// --- PREMIUM MESSAGE COMPONENTS ---
+// --- MESSAGE COMPONENTS ---
 const TimeAgo = ({ timestamp }: { timestamp: Date }) => {
   const [timeAgo, setTimeAgo] = useState('');
 
@@ -180,6 +255,13 @@ const TimeAgo = ({ timestamp }: { timestamp: Date }) => {
   return <span className="text-xs text-muted-foreground">{timeAgo}</span>;
 };
 
+const TopicTag = ({ text }: { text: string }) => (
+  <div className="inline-flex items-center px-3 py-1.5 bg-gradient-to-r from-[#FFC72C]/20 to-[#FF5722]/20 border border-[#FFC72C]/30 rounded-full text-sm font-medium text-[#FFC72C] backdrop-blur-sm">
+    <div className="w-2 h-2 bg-[#FFC72C] rounded-full mr-2 animate-pulse"></div>
+    {text}
+  </div>
+);
+
 const UserMessage = ({ text, timestamp = new Date() }: { text: string; timestamp?: Date }) => (
   <div className="flex justify-end my-6 animate-fade-in-up">
     <div className="max-w-2xl">
@@ -212,60 +294,59 @@ const TypingIndicator = ({ language = 'en', isBookingMode = false }: { language?
         </div>
         <div className="flex-1">
           <div className="bg-card/90 dark:bg-card/95 backdrop-blur-md p-6 rounded-2xl rounded-bl-lg shadow-glow border border-border/50 modern-card">
-            <div className="flex items-center space-x-1 text-muted-foreground">
-              <span className="animate-pulse">•</span>
-              <span className="animate-pulse" style={{animationDelay: '0.2s'}}>•</span>
-              <span className="animate-pulse" style={{animationDelay: '0.4s'}}>•</span>
-              <span className="ml-2 text-sm">{messages.analyzing}</span>
+            <div className="flex items-center gap-3">
+              <div className="flex gap-1">
+                <div className="w-2 h-2 bg-[#FFC72C] rounded-full animate-bounce" style={{animationDelay: '0ms'}}></div>
+                <div className="w-2 h-2 bg-[#FF5722] rounded-full animate-bounce" style={{animationDelay: '150ms'}}></div>
+                <div className="w-2 h-2 bg-[#8D153A] rounded-full animate-bounce" style={{animationDelay: '300ms'}}></div>
+              </div>
+              <span className="text-muted-foreground text-sm">{t.analyzing}</span>
             </div>
           </div>
-          <div className="text-xs text-muted-foreground mt-2">
-            {messages.preparing}
-          </div>
         </div>
       </div>
     </div>
   );
 };
 
-const ContactCard = ({ contact }: { contact: DepartmentContact }) => {
-    return (
-      <div className="bg-muted/20 dark:bg-muted/10 rounded-lg p-4 border border-border/30 transition-all hover:border-[#FF5722]/50">
-        <h4 className="font-semibold text-[#FFC72C] mb-2">{contact.name}</h4>
-        <div className="space-y-1 text-sm text-muted-foreground">
-          {contact.phone && <div>📞 {contact.phone}</div>}
-          {contact.email && <div>✉️ {contact.email}</div>}
-          {contact.website && <div>🌐 <a href={contact.website} target="_blank" rel="noopener noreferrer" className="text-[#FF5722] hover:underline">{contact.website}</a></div>}
-          {contact.address && <div>📍 {contact.address}</div>}
-        </div>
-      </div>
-    );
-  };
+const DepartmentContactCard = ({ contact }: { contact: DepartmentContact }) => (
+  <div className="bg-card/60 dark:bg-card/80 backdrop-blur-sm p-4 rounded-lg border border-border/30 hover:border-[#FFC72C]/50 transition-all duration-300 hover:scale-105 hover:shadow-lg">
+    <h4 className="font-semibold text-[#FFC72C] mb-2 text-sm">{contact.name}</h4>
+    <div className="space-y-1 text-xs text-muted-foreground">
+      {contact.phone && <p>📞 {contact.phone}</p>}
+      {contact.email && <p>✉️ {contact.email}</p>}
+      {contact.website && (
+        <p>🌐 <a href={contact.website} target="_blank" rel="noopener noreferrer" className="text-[#FFC72C] hover:text-[#FF5722] underline decoration-dotted underline-offset-2">{contact.website}</a></p>
+      )}
+    </div>
+  </div>
+);
+
+const SourcesSection = ({ sources, language = 'en' }: { sources: string[]; language?: Language }) => {
+  const t = chatTranslations[language];
   
-const SourcesSection = ({ sources, language }: { sources: string[]; language: Language }) => {
-    const t = chatTranslations[language];
-    
-    if (!sources || sources.length === 0) return null;
-    
-    return (
-      <div className="mt-4 pt-4 border-t border-white/10">
-        <h3 className="text-lg font-semibold text-[#FF5722] mb-2 mt-4">{t.sources}</h3>
-        <div className="space-y-1">
-          {sources.map((source, index) => (
-            <div key={index} className="text-sm">
-              <a 
-                href={source} 
-                target="_blank" 
-                rel="noopener noreferrer" 
-                className="text-[#FFC72C] underline hover:text-[#FF5722] transition-colors duration-200 flex items-center gap-1"
-              >
-                🔗 {new URL(source).hostname}
-              </a>
-            </div>
-          ))}
-        </div>
+  if (!sources || sources.length === 0) return null;
+  
+  return (
+    <div className="mt-6 pt-4 border-t border-border/20">
+      <h4 className="text-sm font-semibold text-[#FFC72C] mb-3 flex items-center gap-2">
+        📚 {t.sources}
+      </h4>
+      <div className="flex flex-wrap gap-2">
+        {sources.map((source, index) => (
+          <a
+            key={index}
+            href={source}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="inline-flex items-center px-3 py-1.5 bg-black/20 hover:bg-black/30 text-xs text-[#FFC72C] hover:text-[#FF5722] rounded-full border border-[#FFC72C]/20 hover:border-[#FFC72C]/40 transition-all duration-300 hover:scale-105 font-mono"
+          >
+            🔗 {new URL(source).hostname}
+          </a>
+        ))}
       </div>
-    );
+    </div>
+  );
 };
 
 const BotMessage = ({ message, language = 'en' }: { message: Message; language?: Language }) => {
@@ -287,94 +368,46 @@ const BotMessage = ({ message, language = 'en' }: { message: Message; language?:
                   h1: ({ children }) => <h1 className="text-2xl font-bold text-[#FFC72C] border-b-2 border-[#FFC72C] pb-2 mb-4 mt-6 first:mt-0">{children}</h1>,
                   h2: ({ children }) => <h2 className="text-xl font-semibold text-[#FFC72C] mb-3 mt-6">{children}</h2>,
                   h3: ({ children }) => <h3 className="text-lg font-semibold text-[#FF5722] mb-2 mt-4">{children}</h3>,
-                  h4: ({ children }) => <h4 className="text-base font-semibold text-[#FF5722] mb-2 mt-3">{children}</h4>,
                   p: ({ children }) => <p className="mb-4 leading-relaxed text-foreground">{children}</p>,
                   ul: ({ children }) => <ul className="list-disc pl-6 mb-4 space-y-1">{children}</ul>,
                   ol: ({ children }) => <ol className="list-decimal pl-6 mb-4 space-y-1">{children}</ol>,
                   li: ({ children }) => <li className="text-foreground leading-relaxed">{children}</li>,
                   strong: ({ children }) => <strong className="font-semibold text-[#FFC72C]">{children}</strong>,
-                  em: ({ children }) => <em className="italic opacity-90">{children}</em>,
-                  blockquote: ({ children }) => (
-                    <blockquote className="border-l-4 border-[#FFC72C] bg-[#FFC72C]/5 pl-4 py-3 my-4 italic rounded-r-lg">
-                      {children}
-                    </blockquote>
-                  ),
-                  code: ({ children, className, ...props }: React.ComponentProps<'code'>) => {
-                    const isInline = !className;
-                    if (isInline) {
-                      return (
-                        <code className="bg-black/30 text-[#FFC72C] px-2 py-1 rounded text-sm font-mono border border-white/10">
-                          {children}
-                        </code>
-                      );
-                    }
-                    return (
-                      <code className={className} {...props}>
-                        {children}
-                      </code>
-                    );
-                  },
-                  pre: ({ children }) => (
-                    <pre className="bg-black/40 border border-white/10 rounded-lg p-4 overflow-x-auto my-4 text-sm">
-                      {children}
-                    </pre>
-                  ),
-                  table: ({ children }) => (
-                    <div className="overflow-x-auto my-4">
-                      <table className="w-full border-collapse border border-white/20 rounded-lg overflow-hidden">
-                        {children}
-                      </table>
-                    </div>
-                  ),
-                  thead: ({ children }) => (
-                    <thead className="bg-[#FFC72C]/10">
-                      {children}
-                    </thead>
-                  ),
-                  th: ({ children }) => (
-                    <th className="border border-white/20 px-4 py-3 text-left font-semibold text-[#FFC72C]">
-                      {children}
-                    </th>
-                  ),
-                  td: ({ children }) => (
-                    <td className="border border-white/20 px-4 py-3 text-foreground">
-                      {children}
-                    </td>
-                  ),
-                  tr: ({ children, ...props }) => (
-                    <tr className="even:bg-white/5 hover:bg-white/10 transition-colors" {...props}>
-                      {children}
-                    </tr>
-                  ),
-                  a: ({ children, href }) => (
-                    <a 
-                      href={href} 
-                      className="text-[#FFC72C] underline hover:text-[#FF5722] transition-colors duration-200"
+                  a: ({ href, children }) => (
+                    <a
+                      href={href}
                       target="_blank"
                       rel="noopener noreferrer"
+                      className="inline-flex items-center gap-1 px-2 py-1 rounded-md bg-gradient-to-r from-[#FFC72C]/10 to-[#FF5722]/10 border border-[#FFC72C]/30 text-[#FFC72C] hover:text-[#FF5722] hover:border-[#FF5722]/50 transition-all duration-300 font-medium text-sm shadow-sm hover:shadow-md backdrop-blur-sm"
                     >
+                      <span className="text-xs">🔗</span>
                       {children}
+                      <span className="text-xs opacity-70">↗</span>
                     </a>
                   ),
                 }}
               >
                 {text}
               </ReactMarkdown>
-              {departmentContacts && departmentContacts.length > 0 && (
-                <div className="mt-6 pt-4 border-t border-white/10">
-                  <h3 className="text-lg font-semibold text-[#FF5722] mb-3 mt-4">{chatTranslations[language].contactDetails}</h3>
-                  <div className="grid gap-3">
-                    {departmentContacts.map((contact, index) => (
-                      <ContactCard key={index} contact={contact} />
-                    ))}
-                  </div>
-                </div>
-              )}
-              <SourcesSection sources={sources || []} language={language} />
             </div>
+
+            {departmentContacts && departmentContacts.length > 0 && (
+              <div className="mt-6 pt-4 border-t border-border/20">
+                <h4 className="text-sm font-semibold text-[#FFC72C] mb-3 flex items-center gap-2">
+                  🏛️ {chatTranslations[language].contactDetails}
+                </h4>
+                <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
+                  {departmentContacts.map((contact) => (
+                    <DepartmentContactCard key={contact.id} contact={contact} />
+                  ))}
+                </div>
+              </div>
+            )}
+
+            {sources && <SourcesSection sources={sources} language={language} />}
           </div>
-          <div className="text-xs text-muted-foreground mt-2">
-            GovLink Assistant • <TimeAgo timestamp={timestamp} />
+          <div className="mt-2">
+            <TimeAgo timestamp={timestamp} />
           </div>
         </div>
       </div>
@@ -382,65 +415,60 @@ const BotMessage = ({ message, language = 'en' }: { message: Message; language?:
   );
 };
 
-const TopicTag = ({ text }: { text: string }) => (
-  <div
-    className="inline-flex items-center px-4 py-2 rounded-full text-sm font-semibold tracking-wide select-none
-      bg-card/90 dark:bg-card/95 backdrop-blur-md border border-border/50 shadow-sm"
-  >
-    <span className="text-gradient">{text}</span>
-  </div>
-);
-
-const ChatInput = ({ onSendMessage, language = 'en', disabled = false }: { onSendMessage: (message: string) => void; language?: Language, disabled?: boolean }) => {
+// --- CHAT INPUT COMPONENT ---
+const ChatInput = ({ onSendMessage, language = 'en', disabled = false }: { onSendMessage: (message: string) => void; language?: Language; disabled?: boolean }) => {
   const [message, setMessage] = useState('');
-  const [isFocused, setIsFocused] = useState(false);
+  const textareaRef = useRef<HTMLTextAreaElement>(null);
   const t = chatTranslations[language];
 
-  const handleSend = () => {
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
     if (message.trim() && !disabled) {
       onSendMessage(message.trim());
       setMessage('');
+      if (textareaRef.current) {
+        textareaRef.current.style.height = 'auto';
+      }
     }
   };
 
-  const handleKeyPress = (e: React.KeyboardEvent) => {
+  const handleKeyDown = (e: React.KeyboardEvent) => {
     if (e.key === 'Enter' && !e.shiftKey) {
       e.preventDefault();
-      handleSend();
+      handleSubmit(e);
     }
   };
 
   return (
-    <div className="bg-background/95 dark:bg-card/95 backdrop-blur-md border-t border-border/50 p-4 sm:p-6 z-40">
-      <div className="container mx-auto max-w-4xl">
-        <div className={`relative transition-all duration-300 ${isFocused ? 'scale-[1.02]' : ''}`}>
-          <div className="relative bg-card/90 dark:bg-card/95 backdrop-blur-md rounded-2xl p-2 shadow-glow hover:shadow-2xl transition-all duration-500 border border-border/50 hover:border-[#FFC72C]/60 modern-card">
+    <div className="fixed bottom-0 left-0 right-0 z-50 border-t border-border/20 bg-background/95 dark:bg-background/95 backdrop-blur-md shadow-2xl">
+      <div className="max-w-4xl mx-auto p-4">
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <div className="relative bg-card/90 dark:bg-card/95 backdrop-blur-md border-2 border-border/50 hover:border-[#FFC72C]/70 rounded-xl p-1.5 transition-all duration-500 hover:shadow-2xl shadow-lg modern-card focus-within:border-[#FFC72C] focus-within:shadow-2xl">
             <textarea
+              ref={textareaRef}
               value={message}
               onChange={(e) => setMessage(e.target.value)}
-              onFocus={() => setIsFocused(true)}
-              onBlur={() => setIsFocused(false)}
-              onKeyPress={handleKeyPress}
-              className="w-full bg-transparent text-foreground placeholder-muted-foreground p-4 pr-16 rounded-xl resize-none focus:outline-none leading-relaxed border-none"
+              onKeyDown={handleKeyDown}
               placeholder={t.askFollowUp}
-              rows={1}
               disabled={disabled}
+              className="w-full bg-transparent text-foreground placeholder-muted-foreground p-3 pr-14 rounded-lg resize-none focus:outline-none text-base leading-relaxed border-none font-medium min-h-[50px] max-h-[200px] disabled:opacity-50 disabled:cursor-not-allowed"
+              rows={1}
               onInput={(e) => {
                 const target = e.target as HTMLTextAreaElement;
                 target.style.height = 'auto';
-                target.style.height = `${Math.max(target.scrollHeight, 60)}px`;
+                target.style.height = `${Math.max(target.scrollHeight, 50)}px`;
               }}
             />
-            <button 
-              onClick={handleSend}
-              className="absolute right-3 top-1/2 -translate-y-1/2 p-3 bg-gradient-to-r from-[#FFC72C] to-[#FF5722] hover:from-[#FF5722] hover:to-[#8D153A] rounded-xl transition-all duration-300 hover:scale-110 shadow-lg hover:shadow-2xl group disabled:opacity-50 disabled:cursor-not-allowed disabled:transform-none"
+            <button
+              type="submit"
               disabled={!message.trim() || disabled}
+              className="absolute right-3 top-1/2 -translate-y-1/2 p-2.5 bg-gradient-to-r from-[#FFC72C] via-[#FF5722] to-[#8D153A] hover:from-[#FF5722] hover:via-[#8D153A] hover:to-[#FFC72C] rounded-lg transition-all duration-300 hover:scale-110 shadow-xl group hover:shadow-2xl disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100"
             >
               <SendIcon className="h-5 w-5 text-white group-hover:translate-x-0.5 transition-transform duration-300" />
             </button>
           </div>
           
-          <div className="mt-4 flex flex-wrap gap-2 items-center">
+          <div className="flex flex-wrap gap-2 items-center">
             {Object.values(t.suggestions).slice(0, 4).map((suggestion, index) => (
               <button
                 key={index}
@@ -452,37 +480,179 @@ const ChatInput = ({ onSendMessage, language = 'en', disabled = false }: { onSen
               </button>
             ))}
           </div>
+        </form>
+      </div>
+    </div>
+  );
+};
+
+// --- VISITOR LAYOUT COMPONENT ---
+const VisitorLayout = ({ 
+  children, 
+  title, 
+  subtitle
+}: {
+  children: React.ReactNode;
+  title: React.ReactNode;
+  subtitle?: string;
+}) => {
+  const [showNotice, setShowNotice] = useState(true);
+  
+  return (
+    <div className="min-h-screen bg-background relative">
+      {/* Sri Lankan Background */}
+      <div className="fixed inset-0 pointer-events-none z-0 overflow-hidden">
+        <div className="absolute inset-0 bg-gradient-to-br from-background via-background to-background/95">
+          <div 
+            className="absolute inset-0 opacity-55 dark:opacity-15 bg-center bg-no-repeat bg-cover transition-opacity duration-1000"
+            style={{
+              backgroundImage: 'url("/2.png")',
+              backgroundPosition: 'center 20%',
+              filter: 'saturate(1.2) brightness(1.1)',
+            }}
+          />
+          <div className="absolute inset-0 bg-gradient-to-b from-background/20 via-transparent to-background/40 dark:from-background/40 dark:via-transparent dark:to-background/60" />
+        </div>
+        
+        {/* Lotus-inspired accent patterns */}
+        <div className="absolute top-0 left-0 w-full h-full">
+          <div className="absolute top-1/4 right-1/4 w-64 h-64 bg-[#FFC72C]/8 dark:bg-[#FFC72C]/4 rounded-full blur-3xl animate-pulse" style={{animationDuration: '8s'}} />
+          <div className="absolute bottom-1/4 left-1/4 w-80 h-80 bg-[#8D153A]/8 dark:bg-[#8D153A]/4 rounded-full blur-3xl animate-pulse" style={{animationDuration: '12s', animationDelay: '4s'}} />
+          <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-96 h-96 bg-[#FF5722]/6 dark:bg-[#FF5722]/3 rounded-full blur-3xl animate-pulse" style={{animationDuration: '10s', animationDelay: '2s'}} />
+        </div>
+      </div>
+
+      {/* Header */}
+      <Header />
+
+      {/* Visitor Notice */}
+      {showNotice && (
+        <div className="relative z-10 bg-gradient-to-r from-[#FFC72C]/10 to-[#FF5722]/10 border-b border-[#FFC72C]/20 backdrop-blur-sm">
+          <div className="max-w-7xl mx-auto px-4 py-3">
+            <div className="flex items-center justify-between">
+              <div className="flex items-center gap-3">
+                <div className="w-2 h-2 bg-[#FFC72C] rounded-full animate-pulse" />
+                <p className="text-sm text-foreground/80">
+                  <span className="font-medium">Visitor Mode:</span> You&apos;re using GovLink AI as a guest. 
+                  <a href="/user/auth/login" className="ml-1 text-[#FFC72C] hover:text-[#FF5722] font-medium underline decoration-dotted underline-offset-2">
+                    Login
+                  </a> for a personalized experience.
+                </p>
+              </div>
+              <button 
+                onClick={() => setShowNotice(false)}
+                className="text-foreground/60 hover:text-foreground/80 text-lg leading-none p-1"
+                aria-label="Close notice"
+              >
+                ×
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {/* Main Content */}
+      <div className="relative z-10 flex-1">
+        <div className="max-w-7xl mx-auto">
+          {/* Page Header */}
+          <div className="px-6 py-8 border-b border-border/20 backdrop-blur-sm bg-card/30">
+            <div className="max-w-4xl mx-auto text-center">
+              <h1 className="text-4xl font-bold mb-3">{title}</h1>
+              {subtitle && (
+                <p className="text-lg text-muted-foreground">{subtitle}</p>
+              )}
+            </div>
+          </div>
+
+          {/* Page Content */}
+          <div className="min-h-[calc(100vh-300px)]">
+            {children}
+          </div>
         </div>
       </div>
     </div>
   );
 };
 
-// --- MAIN CHAT PAGE COMPONENT ---
-export default function RAGBotPage() {
-  const router = useRouter();
+// --- CHAT CONTENT COMPONENT ---
+function ChatContent({ messages, isTyping, language = 'en', onSendMessage }: { 
+  messages: Message[]; 
+  isTyping: boolean; 
+  language: Language; 
+  onSendMessage: (message: string) => void; 
+}) {
+  const bottomRef = useRef<HTMLDivElement | null>(null);
+  const t = chatTranslations[language];
+
+  useEffect(() => {
+    setTimeout(() => {
+      bottomRef.current?.scrollIntoView({ behavior: 'smooth', block: 'end' });
+    }, 100);
+  }, [messages.length, isTyping]);
+
+  if (messages.length === 0) {
+    return (
+      <div className="max-w-4xl mx-auto space-y-6 py-8 px-4 text-center pb-48">
+        <div className="flex justify-center mb-4">
+          <RAGBotIcon />
+        </div>
+        <h2 className="text-3xl font-bold text-foreground">Welcome to {t.title}</h2>
+        <p className="text-muted-foreground max-w-2xl mx-auto">{t.subtitle}</p>
+        
+        <div className="mt-8 pt-6 border-t border-border/50">
+          <h3 className="text-lg font-semibold text-foreground mb-4">Try asking me about:</h3>
+          <div className="grid grid-cols-1 sm:grid-cols-2 gap-3 max-w-2xl mx-auto">
+            {Object.values(t.suggestions).slice(0, 4).map((question, index) => (
+              <button
+                key={index}
+                className="p-4 text-left bg-card/50 hover:bg-card/80 rounded-lg border border-border/50 transition-all duration-300 hover:border-[#FFC72C]/60 hover:scale-105"
+                onClick={() => onSendMessage(question)}
+              >
+                {question}
+              </button>
+            ))}
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="max-w-4xl mx-auto space-y-2 px-4 pb-48">
+      <div className="py-6 mb-2 flex justify-center">
+        <TopicTag text={t.chatStarted} />
+      </div>
+
+      {messages.map((message, index) => (
+        <div key={`${message.type}-${index}`}>
+          {message.type === 'user' ? (
+            <UserMessage text={message.text} timestamp={message.timestamp} />
+          ) : (
+            <BotMessage message={message} language={language} />
+          )}
+        </div>
+      ))}
+      
+      {isTyping && <TypingIndicator language={language} />}
+      <div ref={bottomRef} />
+    </div>
+  );
+}
+
+// --- MAIN COMPONENT ---
+function RAGBotPageContent() {
   const [messages, setMessages] = useState<Message[]>([]);
   const [isTyping, setIsTyping] = useState(false);
   const [currentLanguage, setCurrentLanguage] = useState<Language>('en');
   const [sessionId] = useState(`rag_session_${Date.now()}_${Math.random().toString(36).substring(7)}`);
-  const [lastUserMessage, setLastUserMessage] = useState<string>('');
-  const [isInBookingConversation, setIsInBookingConversation] = useState(false);
+  const initialQueryProcessedRef = useRef(false);
+  const lastProcessedQueryRef = useRef<string | null>(null);
+  const { user, isAuthenticated, isLoading } = useAuth();
+  const searchParams = useSearchParams();
   const t = chatTranslations[currentLanguage];
 
-  // Store session ID in sessionStorage for BookingChatManager to access
-  useEffect(() => {
-    if (typeof window !== 'undefined') {
-      sessionStorage.setItem('ragSessionId', sessionId);
-    }
-  }, [sessionId]);
-
-  const handleLanguageChange = (newLanguage: Language) => {
-    setCurrentLanguage(newLanguage);
-  };
-
-  const handleLoginRequired = () => {
-    router.push('/user/auth/login?redirect=/ragbot');
-  };
+  const handleSendMessage = useCallback(async (messageText: string) => {
+    if (!messageText.trim()) return;
 
   const handleBookingQuestionGenerated = (question: string) => {
     const botMessage: Message = {
@@ -556,8 +726,8 @@ export default function RAGBotPage() {
   // Handle booking conversation flow
   const handleBookingConversation = async (message: string): Promise<string> => {
     try {
-      // Send message to booking conversation handler API
-      const response = await fetch('/api/ragbot/booking-conversation', {
+      // Send message to RAG agent - it will handle booking through the booking_assistant tool
+      const response = await fetch('/api/ragbot/chat', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ 
@@ -647,123 +817,124 @@ export default function RAGBotPage() {
     } finally {
       setIsTyping(false);
     }
+  }, [sessionId]);
+
+  // Handle initial query from URL parameters
+  useEffect(() => {
+    const query = searchParams?.get('q');
+    if (query && 
+        !initialQueryProcessedRef.current && 
+        messages.length === 0 && 
+        lastProcessedQueryRef.current !== query) {
+      
+      console.log('Processing initial query from URL:', query);
+      initialQueryProcessedRef.current = true;
+      lastProcessedQueryRef.current = query;
+      
+      // Add a small delay to ensure the component is fully mounted
+      setTimeout(() => {
+        handleSendMessage(query);
+      }, 500);
+    }
+  }, [searchParams, messages.length, handleSendMessage]);
+
+  const handleLanguageChange = (newLanguage: Language) => {
+    setCurrentLanguage(newLanguage);
   };
 
-  return (
-    <UserDashboardLayout
-      title={
-        <span className="animate-title-wave">
-          <span className="text-foreground">{t.title.split(' ')[0]}</span>{' '}
-          <span className="text-gradient">
-            {t.title.split(' ')[1] || ''}
-          </span>
-        </span>
-      }
-      subtitle={t.subtitle}
-      language={currentLanguage}
-      onLanguageChange={handleLanguageChange}
-      size="dense"
-      contentMode="fill"
-      headerContent={<div className="hidden" aria-hidden="true" />}
-    >
-      <div className="grid grid-rows-[1fr_auto] h-full max-h-full">
-        <div className="min-h-0 overflow-y-auto overscroll-contain pr-1">
-          <Suspense fallback={
-            <div className="flex items-center justify-center py-20">
-              <div className="bg-card/90 dark:bg-card/95 backdrop-blur-md p-6 rounded-2xl shadow-glow modern-card">
-                <div className="flex items-center gap-3">
-                  <div className="w-6 h-6 border-2 border-[#FFC72C] border-t-transparent rounded-full animate-spin"></div>
-                  <span className="text-muted-foreground">Loading conversation...</span>
-                </div>
-              </div>
-            </div>
-          }>
-            <ChatContent 
-              messages={messages} 
-              isTyping={isTyping} 
-              language={currentLanguage} 
-              onSendMessage={handleSendMessage}
-              isInBookingMode={isInBookingConversation}
-            />
-          </Suspense>
-        </div>
-        <div>
-          <ChatInput onSendMessage={handleSendMessage} language={currentLanguage} disabled={isTyping} />
-          <BookingChatManager
-            onBookingQuestionGenerated={handleBookingQuestionGenerated}
-            onLoginRequired={handleLoginRequired}
-            language={currentLanguage}
-            lastUserMessage={lastUserMessage}
-            sessionId={sessionId}
-            messages={messages}
-          />
+  // Show loading state
+  if (isLoading) {
+    return (
+      <div className="min-h-screen bg-background flex items-center justify-center">
+        <div className="text-center">
+          <RAGBotIcon />
+          <p className="mt-4 text-muted-foreground">Loading...</p>
         </div>
       </div>
-    </UserDashboardLayout>
-  );
-};
-
-function ChatContent({ messages, isTyping, language = 'en', onSendMessage, isInBookingMode }: { 
-  messages: Message[]; 
-  isTyping: boolean; 
-  language: Language; 
-  onSendMessage: (message: string) => void; 
-  isInBookingMode?: boolean;
-}) {
-  const bottomRef = useRef<HTMLDivElement | null>(null);
-  const t = chatTranslations[language];
+    );
+  }
 
-  useEffect(() => {
-    setTimeout(() => {
-        bottomRef.current?.scrollIntoView({ behavior: 'smooth', block: 'end' });
-    }, 100);
-  }, [messages.length, isTyping]);
+  const titleElement = (
+    <span className="animate-title-wave">
+      <span className="text-foreground">{t.title.split(' ')[0]}</span>{' '}
+      <span className="text-gradient">
+        {t.title.split(' ')[1] || ''}
+      </span>
+    </span>
+  );
 
-  if (messages.length === 0) {
+  // Render based on authentication status
+  if (isAuthenticated && user) {
+    // Authenticated user - show full dashboard layout
     return (
-        <div className="max-w-4xl mx-auto space-y-6 py-8 px-4 text-center">
-            <div className="flex justify-center mb-4">
-                <RAGBotIcon />
-            </div>
-            <h2 className="text-3xl font-bold text-foreground">Welcome to {t.title}</h2>
-            <p className="text-muted-foreground max-w-2xl mx-auto">{t.subtitle}</p>
-            
-            <div className="mt-8 pt-6 border-t border-border/50">
-                <h3 className="text-lg font-semibold text-foreground mb-4">Try asking me about:</h3>
-                <div className="grid grid-cols-1 sm:grid-cols-2 gap-3 max-w-2xl mx-auto">
-                {Object.values(t.suggestions).slice(0, 4).map((question, index) => (
-                    <button
-                        key={index}
-                        className="p-4 text-left bg-card/50 hover:bg-card/80 rounded-lg border border-border/50 transition-all duration-300 hover:border-[#FFC72C]/60 hover:scale-105"
-                        onClick={() => onSendMessage(question)}
-                    >
-                        {question}
-                    </button>
-                ))}
+      <>
+        <ChatbotNavigation isAuthenticated={true} />
+        <UserDashboardLayout
+          title={titleElement}
+          subtitle={t.subtitle}
+          language={currentLanguage}
+          onLanguageChange={handleLanguageChange}
+        >
+          <div className="h-full overflow-y-auto overscroll-contain pr-1">
+            <Suspense fallback={
+              <div className="flex items-center justify-center py-20">
+                <div className="bg-card/90 dark:bg-card/95 backdrop-blur-md p-6 rounded-2xl shadow-glow modern-card">
+                  <div className="flex items-center gap-3">
+                    <div className="w-6 h-6 border-2 border-[#FFC72C] border-t-transparent rounded-full animate-spin"></div>
+                    <span className="text-muted-foreground">Loading conversation...</span>
+                  </div>
                 </div>
-            </div>
-        </div>
+              </div>
+            }>
+              <ChatContent messages={messages} isTyping={isTyping} language={currentLanguage} onSendMessage={handleSendMessage} />
+            </Suspense>
+          </div>
+        </UserDashboardLayout>
+        <ChatInput onSendMessage={handleSendMessage} language={currentLanguage} disabled={isTyping} />
+      </>
+    );
+  } else {
+    // Visitor - show visitor layout
+    return (
+      <>
+        <ChatbotNavigation isAuthenticated={false} />
+        <VisitorLayout
+          title={titleElement}
+          subtitle={t.subtitle}
+        >
+          <div className="overflow-y-auto overscroll-contain">
+            <Suspense fallback={
+              <div className="flex items-center justify-center py-20">
+                <div className="bg-card/90 dark:bg-card/95 backdrop-blur-md p-6 rounded-2xl shadow-glow modern-card">
+                  <div className="flex items-center gap-3">
+                    <div className="w-6 h-6 border-2 border-[#FFC72C] border-t-transparent rounded-full animate-spin"></div>
+                    <span className="text-muted-foreground">Loading conversation...</span>
+                  </div>
+                </div>
+              </div>
+            }>
+              <ChatContent messages={messages} isTyping={isTyping} language={currentLanguage} onSendMessage={handleSendMessage} />
+            </Suspense>
+          </div>
+        </VisitorLayout>
+        <ChatInput onSendMessage={handleSendMessage} language={currentLanguage} disabled={isTyping} />
+      </>
     );
   }
+}
 
+// --- MAIN EXPORT ---
+export default function RAGBotPage() {
   return (
-    <div className="max-w-4xl mx-auto space-y-2 px-4">
-      <div className="py-6 mb-2 flex justify-center">
-        <TopicTag text={t.chatStarted} />
-      </div>
-
-      {messages.map((message, index) => (
-        <div key={`${message.type}-${index}`}>
-          {message.type === 'user' ? (
-            <UserMessage text={message.text} timestamp={message.timestamp} />
-          ) : (
-            <BotMessage message={message} language={language} />
-          )}
+    <Suspense fallback={
+      <div className="min-h-screen bg-background flex items-center justify-center">
+        <div className="text-center">
+          <RAGBotIcon />
+          <p className="mt-4 text-muted-foreground">Loading...</p>
         </div>
-      ))}
-      
-      {isTyping && <TypingIndicator language={language} isBookingMode={isInBookingMode} />}
-      <div ref={bottomRef} />
-    </div>
+      </div>
+    }>
+      <RAGBotPageContent />
+    </Suspense>
   );
-}
\ No newline at end of file
+}
diff --git a/src/app/user/booking/new/page.tsx b/src/app/user/booking/new/page.tsx
index 71d587b..4209ea1 100644
--- a/src/app/user/booking/new/page.tsx
+++ b/src/app/user/booking/new/page.tsx
@@ -1,9 +1,9 @@
 // src/app/user/booking/new/page.tsx
 "use client";
 
-import React, { useMemo, useState, useCallback, useEffect } from "react";
+import React, { useMemo, useState, useCallback, useEffect, Suspense } from "react";
 import Link from "next/link";
-import { useRouter } from "next/navigation";
+import { useRouter, useSearchParams } from "next/navigation";
 import UserDashboardLayout from '@/components/user/dashboard/UserDashboardLayout';
 import { useAuth } from '@/lib/auth/AuthContext';
 import AppointmentSuccessCard from '@/components/user/AppointmentSuccessCard';
@@ -156,12 +156,6 @@ interface DocumentRequirement {
     description?: string;
 }
 
-// Error interface for proper typing
-interface ApiError extends Error {
-  status?: number;
-  code?: string;
-}
-
 // Custom Dropdown Component (keeping existing)
 const CustomDropdown = ({ 
     id, 
@@ -518,8 +512,9 @@ function mockAvailableSlots(agentId: string, date: string, baseSlots: string[]):
 }
 
 // MAIN PAGE COMPONENT
-export default function NewBookingPage() {
+function NewBookingPage() {
     const router = useRouter();
+    const searchParams = useSearchParams();
     const { user, isAuthenticated, isLoading } = useAuth();
     const [searchParams, setSearchParams] = useState<URLSearchParams | null>(null);
     
@@ -708,6 +703,75 @@ export default function NewBookingPage() {
         }
     }, [loadDepartments]);
 
+    // Track which fields were pre-filled from URL parameters
+    const [preFilledFields, setPreFilledFields] = useState<{ department: boolean; service: boolean }>({
+        department: false,
+        service: false
+    });
+    const [preFilledNames, setPreFilledNames] = useState<{ departmentName: string; serviceName: string }>({
+        departmentName: '',
+        serviceName: ''
+    });
+
+    // Handle URL parameters for pre-filling form
+    useEffect(() => {
+        const prefillDepartment = searchParams?.get('department');
+        const prefillService = searchParams?.get('service');
+
+        if (prefillDepartment || prefillService) {
+            console.log('🔗 Pre-filling form from URL params:', { 
+                department: prefillDepartment, 
+                service: prefillService 
+            });
+
+            // Wait for departments to load before pre-filling
+            if (departments.length > 0) {
+                // Find department name from ID
+                const selectedDepartment = departments.find(dept => dept.id === prefillDepartment);
+                const departmentName = selectedDepartment?.name || 'Unknown Department';
+
+                setForm(prev => ({
+                    ...prev,
+                    ...(prefillDepartment && { department: prefillDepartment }),
+                    ...(prefillService && { service: prefillService })
+                }));
+
+                // Track which fields were pre-filled
+                setPreFilledFields({
+                    department: !!prefillDepartment,
+                    service: !!prefillService
+                });
+
+                // Track the names for visual indicators
+                setPreFilledNames(prev => ({
+                    ...prev,
+                    departmentName: departmentName
+                }));
+
+                // Show success message with actual names
+                if (prefillDepartment || prefillService) {
+                    const prefilledItems = [];
+                    if (prefillDepartment) {
+                        prefilledItems.push(`Department: "${departmentName}"`);
+                    }
+                    if (prefillService) {
+                        prefilledItems.push('Service selection');
+                    }
+                    
+                    setSuccess(`✨ ${prefilledItems.join(' and ')} pre-filled from your RAG chatbot conversation! Your booking assistant has automatically selected the most relevant options for you.`);
+                    setTimeout(() => setSuccess(null), 8000); // Clear after 8 seconds
+                }
+
+                // If service ID is provided, load services for the department and then set the service
+                if (prefillService && prefillDepartment) {
+                    loadServices(prefillDepartment).then(() => {
+                        // This will be handled in the services loading effect
+                    });
+                }
+            }
+        }
+    }, [searchParams, departments, loadServices]);
+
     // Load services when department changes
     useEffect(() => {
         if (form.department) {
@@ -717,6 +781,40 @@ export default function NewBookingPage() {
         }
     }, [form.department, loadServices]);
 
+    // Handle service pre-filling after services are loaded
+    useEffect(() => {
+        const prefillService = searchParams?.get('service');
+        
+        if (prefillService && services.length > 0 && !form.service) {
+            // Find service name from ID
+            const selectedService = services.find(service => service.id === prefillService);
+            const serviceName = selectedService?.name || 'Unknown Service';
+
+            console.log('🎯 Setting pre-filled service:', { id: prefillService, name: serviceName });
+            
+            setForm(prev => ({
+                ...prev,
+                service: prefillService
+            }));
+
+            // Track the service name for visual indicators
+            setPreFilledNames(prev => ({
+                ...prev,
+                serviceName: serviceName
+            }));
+
+            // Update success message to include service name
+            const prefillDepartment = searchParams?.get('department');
+            if (prefillDepartment) {
+                const selectedDepartment = departments.find(dept => dept.id === prefillDepartment);
+                const departmentName = selectedDepartment?.name || 'Unknown Department';
+
+                setSuccess(`✨ Department: "${departmentName}" and Service: "${serviceName}" pre-filled from your RAG chatbot conversation! Your booking assistant has automatically selected the most relevant options for you.`);
+                setTimeout(() => setSuccess(null), 10000); // Clear after 10 seconds
+            }
+        }
+    }, [services, searchParams, departments, form.service]);
+
     // Load agents when department changes
     useEffect(() => {
         if (form.department) {
@@ -903,27 +1001,6 @@ export default function NewBookingPage() {
         setSubmitting(false);
     }
 
-    // Helper functions to get display names
-    const getDepartmentName = () => {
-        const department = departments.find(d => d.id === form.department);
-        return department ? department.name : '';
-    };
-
-    const getServiceName = () => {
-        const service = services.find(s => s.id === form.service);
-        return service ? service.name : '';
-    };
-
-    const getAgentName = () => {
-        const agent = agents.find(a => a.id === form.agent);
-        return agent ? agent.name : '';
-    };
-
-    const getAgentPosition = () => {
-        const agent = agents.find(a => a.id === form.agent);
-        return agent ? agent.position : '';
-    };
-
     const getSelectedDay = () => {
         const day = days.find(d => d.key === form.day);
         return day ? day.label : '';
@@ -980,7 +1057,14 @@ export default function NewBookingPage() {
                         {/* Step 1: Department & Service Selection */}
                         <Step icon={UserCheckIcon} title={t.step1Title} description={t.step1Desc}>
                             <div>
-                                <label htmlFor="department" className="block text-sm font-medium text-muted-foreground mb-2">{t.department}</label>
+                                <label htmlFor="department" className="block text-sm font-medium text-muted-foreground mb-2">
+                                    {t.department}
+                                    {preFilledFields.department && preFilledNames.departmentName && (
+                                        <span className="ml-2 inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-emerald-100 text-emerald-800 dark:bg-emerald-900/30 dark:text-emerald-400">
+                                            🤖 AI Selected: {preFilledNames.departmentName}
+                                        </span>
+                                    )}
+                                </label>
                                 <CustomDropdown
                                     id="department"
                                     name="department"
@@ -992,7 +1076,14 @@ export default function NewBookingPage() {
                                 />
                             </div>
                             <div>
-                                <label htmlFor="service" className="block text-sm font-medium text-muted-foreground mb-2">{t.service}</label>
+                                <label htmlFor="service" className="block text-sm font-medium text-muted-foreground mb-2">
+                                    {t.service}
+                                    {preFilledFields.service && preFilledNames.serviceName && (
+                                        <span className="ml-2 inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-emerald-100 text-emerald-800 dark:bg-emerald-900/30 dark:text-emerald-400">
+                                            🤖 AI Selected: {preFilledNames.serviceName}
+                                        </span>
+                                    )}
+                                </label>
                                 <CustomDropdown
                                     id="service"
                                     name="service"
@@ -1270,4 +1361,22 @@ export default function NewBookingPage() {
             </div>
         </UserDashboardLayout>
     );
+}
+
+// Wrapper component to handle Suspense for searchParams
+export default function NewBookingPageWrapper() {
+    return (
+        <Suspense fallback={
+            <UserDashboardLayout title="Book Appointment" subtitle="Schedule your appointment with government services">
+                <div className="min-h-screen flex items-center justify-center">
+                    <div className="text-center">
+                        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-[#FFC72C] mx-auto mb-4"></div>
+                        <p className="text-muted-foreground">Loading booking form...</p>
+                    </div>
+                </div>
+            </UserDashboardLayout>
+        }>
+            <NewBookingPage />
+        </Suspense>
+    );
 }
\ No newline at end of file
diff --git a/src/lib/ragAgent.ts b/src/lib/ragAgent.ts
index 71f609d..741b6f1 100644
--- a/src/lib/ragAgent.ts
+++ b/src/lib/ragAgent.ts
@@ -5,6 +5,7 @@ import { TavilySearch, TavilyCrawl, TavilyExtract } from "@langchain/tavily";
 import { MemorySaver } from "@langchain/langgraph";
 import { createReactAgent } from "@langchain/langgraph/prebuilt";
 import { createLocalDirectoryTool } from "./tools/localDirectoryTool";
+import { createBookingAssistantTool } from "./tools/bookingAssistantTool";
 
 interface SearchResult {
   url: string;
@@ -116,6 +117,7 @@ export class SriLankanGovRAGAgent {
     // Define tools for the agent - LOCAL DIRECTORY FIRST, then external tools
     const tools = [
       createLocalDirectoryTool(), // PRIORITY: Use local government directory first
+      createBookingAssistantTool(), // Booking assistance and form pre-filling
       this.tavilySearch,
       this.tavilyCrawl,
       this.tavilyExtract,
@@ -138,12 +140,24 @@ export class SriLankanGovRAGAgent {
 3. **Recommend relevant government departments** based on user queries
 4. **Provide step-by-step guidance** for government procedures
 5. **Include processing times, fees, and required documents** when available
+6. **You are to avoid answering any other questions that are not related to requesting information about the government or government services**. You should politely decline that your purpose is not to answer on such a question but government related queries
+7 **Kindly decline the offer to give a response when personally identifiable information (PII)** are present in the query, and instead let the use know about this and ask the user to issue the query without the PII again
 
 **AVAILABLE TOOLS (USE IN ORDER OF PRIORITY):**
 1. **local_government_directory** [HIGHEST PRIORITY] - Official verified government database with current departments and agents
-2. **tavily_search** - External search for current web information
-3. **tavily_crawl** - Deep crawl of government websites 
-4. **tavily_extract** - Extract specific information from websites
+2. **booking_assistant** [FOR BOOKING QUERIES] - Assists with appointment booking by providing department/service options and generating pre-filled booking URLs
+3. **tavily_search** - External search for current web information
+4. **tavily_crawl** - Deep crawl of government websites 
+5. **tavily_extract** - Extract specific information from websites
+
+**BOOKING ASSISTANCE WORKFLOW:**
+When users want to book appointments, schedule meetings, or reserve time slots:
+1. Use **booking_assistant** with action "suggest_from_query" to get smart suggestions based on their query
+2. If suggestions are found, present them to the user and ask them to choose
+3. If no suggestions match, use action "list_departments" to show all available departments
+4. Once user selects a department, use action "list_services" to show available services
+5. When user makes final selection, use action "generate_booking_url" to create a pre-filled booking link
+6. Guide the user to click the generated booking URL to complete their appointment booking
 
 **MANDATORY SEARCH STRATEGY:**
 1. **ALWAYS START** with local_government_directory for ANY government-related query. If asked for the available departmets, services, and support agents or government personnel do the same as well.
diff --git a/src/lib/tools/bookingAssistantTool.ts b/src/lib/tools/bookingAssistantTool.ts
new file mode 100644
index 0000000..1dc3472
--- /dev/null
+++ b/src/lib/tools/bookingAssistantTool.ts
@@ -0,0 +1,378 @@
+// src/lib/tools/bookingAssistantTool.ts
+import { DynamicStructuredTool } from "@langchain/core/tools";
+import { z } from "zod";
+import connectDB from '@/lib/db';
+import Department from '@/lib/models/departmentSchema';
+
+interface Service {
+  _id: string;
+  name: string;
+  description?: string;
+  isActive: boolean;
+}
+
+interface Department {
+  _id: string;
+  name: string;
+  services: Service[];
+  isActive: boolean;
+}
+
+interface ServiceData {
+  id: string;
+  name: string;
+  description?: string;
+  departmentId: string;
+  departmentName: string;
+}
+
+interface DepartmentData {
+  id: string;
+  departmentId: string;
+  name: string;
+  shortName: string;
+  description: string;
+  services: ServiceData[];
+}
+
+interface DepartmentListItem {
+  id: string;
+  departmentId: string;
+  name: string;
+  shortName: string;
+  description: string;
+  email: string;
+  phoneNumber: string;
+  isActive: boolean;
+}
+
+interface DepartmentWithServices {
+  _id: string;
+  name: string;
+  services?: Array<{
+    _id?: string;
+    id?: string;
+    name?: string;
+    description?: string;
+    isActive?: boolean;
+  }>;
+}
+
+interface BookingSuggestion {
+  departmentId: string;
+  departmentName: string;
+  serviceId?: string;
+  serviceName?: string;
+  confidence: number;
+  description?: string;
+}
+
+interface BookingToolResult {
+  success: boolean;
+  action: 'list_options' | 'generate_url' | 'suggest_services';
+  departments?: DepartmentListItem[];
+  services?: Service[];
+  suggestions?: BookingSuggestion[];
+  bookingUrl?: string;
+  message: string;
+}
+
+export class BookingAssistantTool extends DynamicStructuredTool {
+  constructor() {
+    super({
+      name: "booking_assistant",
+      description: `Assists users with booking appointments by providing department and service options, 
+      generating smart suggestions based on user queries, and creating pre-filled booking URLs.
+      Use this tool when users want to book appointments, schedule meetings, or reserve time slots.`,
+      schema: z.object({
+        action: z.enum(['list_departments', 'list_services', 'suggest_from_query', 'generate_booking_url'])
+          .describe("The action to perform"),
+        departmentId: z.string().optional()
+          .describe("Department ID when listing services or generating URL"),
+        serviceId: z.string().optional()
+          .describe("Service ID when generating booking URL"),
+        query: z.string().optional()
+          .describe("User's booking query for generating suggestions"),
+        userMessage: z.string().optional()
+          .describe("The user's original message to better understand intent")
+      }),
+      func: async ({ action, departmentId, serviceId, query, userMessage }) => {
+        try {
+          switch (action) {
+            case 'list_departments':
+              return await this.listDepartments();
+              
+            case 'list_services':
+              if (!departmentId) {
+                return this.createErrorResult("Department ID is required to list services");
+              }
+              return await this.listServices(departmentId);
+              
+            case 'suggest_from_query':
+              if (!query && !userMessage) {
+                return this.createErrorResult("Query or user message is required for suggestions");
+              }
+              return await this.generateSuggestions(query || userMessage || '');
+              
+            case 'generate_booking_url':
+              return this.generateBookingUrl(departmentId, serviceId);
+              
+            default:
+              return this.createErrorResult("Invalid action specified");
+          }
+        } catch (error) {
+          console.error("Booking assistant tool error:", error);
+          return this.createErrorResult(`Failed to process booking request: ${error instanceof Error ? error.message : 'Unknown error'}`);
+        }
+      }
+    });
+  }
+
+  private async listDepartments(): Promise<string> {
+    try {
+      await connectDB();
+      
+      // Query departments directly from database
+      const departments = await Department.find(
+        { 
+          $or: [
+            { status: 'ACTIVE' },
+            { status: 'active' }
+          ]
+        },
+        {
+          _id: 1,
+          departmentId: 1,
+          name: 1,
+          shortName: 1,
+          description: 1,
+          email: 1,
+          phoneNumber: 1,
+          address: 1,
+          workingHours: 1,
+          allowOnlineServices: 1,
+          requiresAppointment: 1
+        }
+      ).lean();
+
+      console.log('🏛️ Booking assistant: Found departments:', departments.length);
+
+      const transformedDepartments = departments.map(dept => ({
+        id: dept._id ? String(dept._id) : '',
+        departmentId: dept.departmentId || '',
+        name: dept.name || '',
+        shortName: dept.shortName || '',
+        description: dept.description || '',
+        email: dept.email || '',
+        phoneNumber: dept.phoneNumber || '',
+        isActive: true
+      }));
+
+      const result: BookingToolResult = {
+        success: true,
+        action: 'list_options',
+        departments: transformedDepartments,
+        message: `Found ${transformedDepartments.length} available departments for booking. Present these options to the user and ask them to choose.`
+      };
+
+      return JSON.stringify(result);
+    } catch (error) {
+      console.error('❌ Booking assistant: Error fetching departments:', error);
+      return this.createErrorResult(`Error fetching departments: ${error instanceof Error ? error.message : 'Unknown error'}`);
+    }
+  }
+
+  private async listServices(departmentId: string): Promise<string> {
+    try {
+      await connectDB();
+      
+      // Query department with services - handle both ObjectId and departmentId
+      const department = await Department.findOne({
+        $or: [
+          { _id: departmentId.match(/^[0-9a-fA-F]{24}$/) ? departmentId : null },
+          { departmentId: departmentId }
+        ]
+      }, {
+        _id: 1,
+        name: 1,
+        services: 1
+      }).lean() as DepartmentWithServices | null;
+
+      if (!department) {
+        return this.createErrorResult("Department not found");
+      }
+
+      const services = (department.services || [])
+        .filter((service: { isActive?: boolean }) => service.isActive)
+        .map((service: { id?: string; _id?: string; name?: string; description?: string }) => ({
+          _id: service.id || service._id || '',
+          name: service.name || '',
+          description: service.description || '',
+          isActive: true
+        }));
+
+      console.log('📋 Booking assistant: Found services:', services.length);
+
+      const result: BookingToolResult = {
+        success: true,
+        action: 'suggest_services',
+        services: services,
+        message: `Found ${services.length} available services in this department. Present these options to the user.`
+      };
+
+      return JSON.stringify(result);
+    } catch (error) {
+      console.error('❌ Booking assistant: Error fetching services:', error);
+      return this.createErrorResult(`Error fetching services: ${error instanceof Error ? error.message : 'Unknown error'}`);
+    }
+  }
+
+  private async generateSuggestions(query: string): Promise<string> {
+    try {
+      await connectDB();
+      
+      // Use the existing booking suggestions API logic
+      // Fetch departments with services
+      const departments = await Department.find(
+        { 
+          $or: [
+            { status: 'ACTIVE' },
+            { status: 'active' }
+          ]
+        },
+        {
+          _id: 1,
+          departmentId: 1,
+          name: 1,
+          shortName: 1,
+          description: 1,
+          services: 1
+        }
+      ).lean();
+
+      console.log('🔍 Booking assistant: Generating suggestions for query:', query);
+      console.log('🏛️ Booking assistant: Found departments for suggestions:', departments.length);
+
+      // Transform departments data
+      const departmentData = departments.map(dept => ({
+        id: dept._id ? String(dept._id) : '',
+        departmentId: dept.departmentId || '',
+        name: dept.name || '',
+        shortName: dept.shortName || '',
+        description: dept.description || '',
+        services: (dept.services || [])
+          .filter((service: { isActive?: boolean }) => service.isActive)
+          .map((service: { id?: string; _id?: string; name?: string; description?: string }) => ({
+            id: service.id || service._id || '',
+            name: service.name || '',
+            description: service.description || '',
+            departmentId: dept.departmentId || '',
+            departmentName: dept.name || ''
+          }))
+      }));
+
+      // Generate suggestions using simple keyword matching
+      const suggestions = this.generateBookingSuggestionsLogic(query, departmentData);
+
+      console.log('🎯 Booking assistant: Generated suggestions:', suggestions.length);
+
+      const result: BookingToolResult = {
+        success: true,
+        action: 'list_options',
+        suggestions: suggestions as BookingSuggestion[],
+        message: suggestions.length > 0 
+          ? `Based on your query "${query}", I found ${suggestions.length} relevant booking options. Let me present them to you.`
+          : `I couldn't find specific matches for "${query}". Let me show you all available departments so you can choose.`
+      };
+
+      return JSON.stringify(result);
+    } catch (error) {
+      console.error('❌ Booking assistant: Error generating suggestions:', error);
+      return this.createErrorResult(`Error generating suggestions: ${error instanceof Error ? error.message : 'Unknown error'}`);
+    }
+  }
+
+  private generateBookingUrl(departmentId?: string, serviceId?: string): string {
+    const baseUrl = process.env.NEXT_PUBLIC_APP_URL || `http://localhost:3002`;
+    const params = new URLSearchParams();
+    
+    if (departmentId) params.append('department', departmentId);
+    if (serviceId) params.append('service', serviceId);
+    
+    const bookingUrl = `${baseUrl}/user/booking/new${params.toString() ? `?${params.toString()}` : ''}`;
+    
+    const result: BookingToolResult = {
+      success: true,
+      action: 'generate_url',
+      bookingUrl,
+      message: `Perfect! I'll redirect you to the booking form with your selections pre-filled. Click the link below to proceed with your appointment booking.`
+    };
+
+    return JSON.stringify(result);
+  }
+
+  private generateBookingSuggestionsLogic(query: string, departments: DepartmentData[]): BookingSuggestion[] {
+    const normalizedQuery = query.toLowerCase();
+    const suggestions: BookingSuggestion[] = [];
+
+    // Simple keyword matching for common services
+    const keywordMap: Record<string, string[]> = {
+      passport: ['passport', 'travel', 'immigration', 'visa'],
+      license: ['license', 'permit', 'driving', 'vehicle'],
+      certificate: ['certificate', 'birth', 'death', 'marriage'],
+      registration: ['register', 'business', 'company'],
+      tax: ['tax', 'income', 'revenue']
+    };
+
+    // Check each department and its services
+    departments.forEach(dept => {
+      dept.services?.forEach((service: ServiceData) => {
+        let score = 0;
+        
+        // Check service name match
+        if (service.name && service.name.toLowerCase().includes(normalizedQuery)) {
+          score += 0.8;
+        }
+        
+        // Check keyword matches
+        Object.entries(keywordMap).forEach(([, keywords]) => {
+          keywords.forEach(keyword => {
+            if (normalizedQuery.includes(keyword) && 
+                (service.name?.toLowerCase().includes(keyword) || 
+                 dept.name?.toLowerCase().includes(keyword))) {
+              score += 0.6;
+            }
+          });
+        });
+
+        if (score > 0.5) {
+          suggestions.push({
+            departmentId: dept.id,
+            departmentName: dept.name,
+            serviceId: service.id,
+            serviceName: service.name,
+            confidence: score,
+            description: service.description || `${service.name} service from ${dept.name}`
+          });
+        }
+      });
+    });
+
+    // Sort by confidence and return top 5
+    return suggestions
+      .sort((a, b) => b.confidence - a.confidence)
+      .slice(0, 5);
+  }
+
+  private createErrorResult(message: string): string {
+    const result: BookingToolResult = {
+      success: false,
+      action: 'list_options',
+      message
+    };
+    return JSON.stringify(result);
+  }
+}
+
+// Export the factory function
+export const createBookingAssistantTool = () => new BookingAssistantTool();
diff --git a/src/lib/utils/bookingHelper.ts b/src/lib/utils/bookingHelper.ts
new file mode 100644
index 0000000..24a6c0f
--- /dev/null
+++ b/src/lib/utils/bookingHelper.ts
@@ -0,0 +1,339 @@
+// src/lib/utils/bookingHelper.ts
+
+interface Department {
+  id: string;
+  departmentId: string;
+  name: string;
+  shortName: string;
+  description: string;
+  services?: Service[];
+}
+
+interface Service {
+  id: string;
+  name: string;
+  description?: string;
+  category?: string;
+  processingTime?: string;
+  fee?: number;
+  requirements?: string[];
+  departmentId?: string;
+  departmentName?: string;
+}
+
+interface BookingSuggestion {
+  type: 'department' | 'service';
+  id: string;
+  name: string;
+  description?: string;
+  departmentId?: string;
+  departmentName?: string;
+  category?: string;
+  fee?: number;
+  relevanceScore: number;
+}
+
+export type { BookingSuggestion };
+
+/**
+ * Fetches all departments with their services for booking suggestions
+ */
+export async function fetchBookingData(baseUrl: string = ''): Promise<{ departments: Department[]; services: Service[] }> {
+  try {
+    const response = await fetch(`${baseUrl}/api/user/departments?includeServices=true`, {
+      method: 'GET',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      // Note: This will work for server-side calls, client-side calls need different auth handling
+    });
+
+    if (!response.ok) {
+      throw new Error(`Failed to fetch departments: ${response.status}`);
+    }
+
+    const data = await response.json();
+    
+    if (!data.success || !data.data) {
+      throw new Error('Invalid response format');
+    }
+
+    const departments: Department[] = data.data;
+    
+    // Flatten all services from all departments
+    const services: Service[] = departments.flatMap(dept => 
+      (dept.services || []).map(service => ({
+        ...service,
+        departmentId: dept.departmentId,
+        departmentName: dept.name
+      }))
+    );
+
+    return { departments, services };
+  } catch (error) {
+    console.error('Error fetching booking data:', error);
+    return { departments: [], services: [] };
+  }
+}
+
+/**
+ * Analyzes user query and suggests relevant departments and services
+ */
+export function suggestBookingOptions(
+  query: string, 
+  departments: Department[], 
+  services: Service[]
+): BookingSuggestion[] {
+  const normalizedQuery = query.toLowerCase();
+  const suggestions: BookingSuggestion[] = [];
+
+  // Keywords mapping for better matching
+  const serviceKeywords: Record<string, string[]> = {
+    passport: ['passport', 'travel', 'immigration', 'visa', 'abroad', 'international'],
+    license: ['license', 'permit', 'driving', 'vehicle', 'motorcycle', 'car'],
+    certificate: ['certificate', 'birth', 'death', 'marriage', 'divorce', 'citizenship'],
+    registration: ['register', 'registration', 'business', 'company', 'organization'],
+    tax: ['tax', 'income', 'vat', 'customs', 'duty', 'revenue'],
+    education: ['education', 'school', 'university', 'degree', 'scholarship', 'student'],
+    health: ['health', 'medical', 'hospital', 'medicine', 'doctor', 'treatment'],
+    property: ['property', 'land', 'house', 'building', 'real estate', 'title'],
+    insurance: ['insurance', 'social security', 'pension', 'retirement', 'benefits'],
+    employment: ['employment', 'job', 'work', 'labor', 'salary', 'employee']
+  };
+
+  // Department keywords mapping
+  const departmentKeywords: Record<string, string[]> = {
+    immigration: ['immigration', 'passport', 'visa', 'travel', 'foreign'],
+    transport: ['transport', 'vehicle', 'driving', 'license', 'road'],
+    registrar: ['registrar', 'birth', 'death', 'marriage', 'certificate'],
+    revenue: ['revenue', 'tax', 'customs', 'duty', 'vat'],
+    education: ['education', 'ministry of education', 'school', 'university'],
+    health: ['health', 'ministry of health', 'medical', 'hospital'],
+    lands: ['lands', 'property', 'title', 'survey', 'real estate']
+  };
+
+  // Score services based on keyword matching
+  services.forEach(service => {
+    let relevanceScore = 0;
+    
+    // Direct name matching
+    if (service.name.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 10;
+    }
+    
+    // Description matching
+    if (service.description && service.description.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 7;
+    }
+    
+    // Category matching
+    if (service.category && service.category.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 5;
+    }
+    
+    // Keyword matching
+    Object.entries(serviceKeywords).forEach(([category, keywords]) => {
+      keywords.forEach(keyword => {
+        if (normalizedQuery.includes(keyword)) {
+          if (service.name.toLowerCase().includes(category)) {
+            relevanceScore += 8;
+          } else if (service.description?.toLowerCase().includes(category)) {
+            relevanceScore += 6;
+          } else if (service.category?.toLowerCase().includes(category)) {
+            relevanceScore += 4;
+          }
+        }
+      });
+    });
+    
+    if (relevanceScore > 0) {
+      suggestions.push({
+        type: 'service',
+        id: service.id,
+        name: service.name,
+        description: service.description,
+        departmentId: service.departmentId,
+        departmentName: service.departmentName,
+        category: service.category,
+        fee: service.fee,
+        relevanceScore
+      });
+    }
+  });
+
+  // Score departments based on keyword matching
+  departments.forEach(dept => {
+    let relevanceScore = 0;
+    
+    // Direct name matching
+    if (dept.name.toLowerCase().includes(normalizedQuery) || 
+        dept.shortName.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 8;
+    }
+    
+    // Description matching
+    if (dept.description && dept.description.toLowerCase().includes(normalizedQuery)) {
+      relevanceScore += 6;
+    }
+    
+    // Keyword matching for departments
+    Object.entries(departmentKeywords).forEach(([category, keywords]) => {
+      keywords.forEach(keyword => {
+        if (normalizedQuery.includes(keyword)) {
+          if (dept.name.toLowerCase().includes(category) || 
+              dept.shortName.toLowerCase().includes(category)) {
+            relevanceScore += 7;
+          } else if (dept.description?.toLowerCase().includes(category)) {
+            relevanceScore += 5;
+          }
+        }
+      });
+    });
+    
+    if (relevanceScore > 0) {
+      suggestions.push({
+        type: 'department',
+        id: dept.departmentId,
+        name: dept.name,
+        description: dept.description,
+        relevanceScore
+      });
+    }
+  });
+
+  // Sort by relevance score and return top 5
+  return suggestions
+    .sort((a, b) => b.relevanceScore - a.relevanceScore)
+    .slice(0, 5);
+}
+
+/**
+ * Formats booking suggestions into a user-friendly message
+ */
+export function formatBookingSuggestions(suggestions: BookingSuggestion[]): string {
+  if (suggestions.length === 0) {
+    return `🔍 **I found your booking request!**
+
+I'd be happy to help you book an appointment. However, I need a bit more information about what specific service you're looking for. 
+
+📋 **Available Services Include:**
+• Passport & Immigration Services
+• Driving License & Vehicle Registration  
+• Birth/Marriage/Death Certificates
+• Business Registration
+• Tax & Revenue Services
+• Educational Certificates
+• Property & Land Services
+
+**Could you please tell me more specifically what you need assistance with?** For example:
+• "I need to renew my passport"
+• "I want to register a new business"
+• "I need a birth certificate"
+
+This will help me suggest the most relevant department and services for your appointment! 🎯`;
+  }
+
+  let message = `🎯 **Perfect! I found some great options for your appointment:**\n\n`;
+  
+  // Group suggestions by type
+  const serviceSuggestions = suggestions.filter(s => s.type === 'service');
+  const departmentSuggestions = suggestions.filter(s => s.type === 'department');
+  
+  if (serviceSuggestions.length > 0) {
+    message += `📋 **Recommended Services:**\n`;
+    serviceSuggestions.forEach((suggestion, index) => {
+      message += `${index + 1}. **${suggestion.name}**\n`;
+      if (suggestion.departmentName) {
+        message += `   📍 Department: ${suggestion.departmentName}\n`;
+      }
+      if (suggestion.description) {
+        message += `   📝 ${suggestion.description}\n`;
+      }
+      if (suggestion.fee && suggestion.fee > 0) {
+        message += `   💰 Fee: LKR ${suggestion.fee}\n`;
+      }
+      message += `\n`;
+    });
+  }
+  
+  if (departmentSuggestions.length > 0) {
+    message += `🏛️ **Relevant Departments:**\n`;
+    departmentSuggestions.forEach((suggestion, index) => {
+      message += `${index + 1}. **${suggestion.name}**\n`;
+      if (suggestion.description) {
+        message += `   📝 ${suggestion.description}\n`;
+      }
+      message += `\n`;
+    });
+  }
+  
+  message += `✨ **Ready to book?** Just tell me which option you'd like, and I'll redirect you to the booking form with everything pre-filled!\n\n`;
+  message += `Example: "I want option 1" or "Book ${serviceSuggestions[0]?.name || departmentSuggestions[0]?.name}"\n\n`;
+  message += `[🔗 **Or click here to see all booking options**](/user/booking/new)`;
+  
+  return message;
+}
+
+/**
+ * Generates booking URL with pre-filled parameters
+ */
+export function generateBookingUrl(departmentId?: string, serviceId?: string): string {
+  const params = new URLSearchParams();
+  
+  if (departmentId) {
+    params.set('department', departmentId);
+  }
+  
+  if (serviceId) {
+    params.set('service', serviceId);
+  }
+  
+  const queryString = params.toString();
+  return `/user/booking/new${queryString ? `?${queryString}` : ''}`;
+}
+
+/**
+ * Parses user selection from booking suggestions
+ */
+export function parseBookingSelection(
+  userMessage: string, 
+  previousSuggestions: BookingSuggestion[]
+): { departmentId?: string; serviceId?: string } | null {
+  const normalizedMessage = userMessage.toLowerCase();
+  
+  // Check for option number selection (e.g., "option 1", "1", "first one")
+  const optionMatch = normalizedMessage.match(/(?:option\s*)?(\d+)|(?:first|second|third|fourth|fifth)/);
+  if (optionMatch) {
+    let optionIndex = 0;
+    
+    if (optionMatch[1]) {
+      optionIndex = parseInt(optionMatch[1]) - 1;
+    } else {
+      const wordToNumber: Record<string, number> = {
+        'first': 0, 'second': 1, 'third': 2, 'fourth': 3, 'fifth': 4
+      };
+      const word = optionMatch[0];
+      optionIndex = wordToNumber[word] ?? 0;
+    }
+    
+    if (optionIndex >= 0 && optionIndex < previousSuggestions.length) {
+      const selected = previousSuggestions[optionIndex];
+      return {
+        departmentId: selected.departmentId || (selected.type === 'department' ? selected.id : undefined),
+        serviceId: selected.type === 'service' ? selected.id : undefined
+      };
+    }
+  }
+  
+  // Check for direct name matching
+  for (const suggestion of previousSuggestions) {
+    if (normalizedMessage.includes(suggestion.name.toLowerCase())) {
+      return {
+        departmentId: suggestion.departmentId || (suggestion.type === 'department' ? suggestion.id : undefined),
+        serviceId: suggestion.type === 'service' ? suggestion.id : undefined
+      };
+    }
+  }
+  
+  return null;
+}