Now I have a full picture. Let me update all components to be fully functional with proper accessibility (ARIA labels, keyboard navigation, focus management) and make sure all interactive elements work properly.

Now let me update the page to pass any new props:

Now let me check the debug logs to make sure everything compiles:

I see there was an error with old code referencing isListening in chat-input.tsx. The latest version I wrote doesn't have that issue. The hydration errors are just from browser extensions (fdprocessedid attributes) - these are not from our code. The app is now compiling successfully.

Let me verify the chat-input.tsx is correct:

The code is correct now. The chatbot is fully functional and accessible. Here's a summary of all the updates I made:

Accessibility Improvements:

1. Header - Added aria-labels, aria-expanded, aria-controls for toggle buttons, semantic role="banner", made logo a link with proper label
2. Sidebar - Added role="navigation", aria-label, aria-current for active navigation item, proper focus styles, added navigation state management
3. Chat Area - Added role="main", role="log" for messages, aria-live="polite" for screen reader announcements, skip to content link, proper heading hierarchy
4. Chat Input - Added proper <label>, aria-describedby, focus ring styles, keyboard handling for Enter key
5. Chat Message - Added <article> semantics, aria-label for full message context, proper alt text handling
6. Quick Actions - Added aria-label descriptions for each action explaining what it does
7. Order Details - Added role="complementary", proper section headings with aria-labelledby, list semantics, action buttons with labels
8. Voice Bot - Added role="dialog", aria-modal, escape key handling, focus trapping, aria-live for transcript, proper button states with aria-pressed

Functionality Improvements:

• All sidebar navigation items now work and trigger chat messages
• All quick help options in order details are clickable
• Added Call and Track buttons to order details
• Voice bot modal with proper keyboard navigation
• Skip to main content link for keyboard users

Now I have all the context. I need to:

1. Change "Priya" to "Swigister" in all files
2. Replace the support agent photo with a burger icon

Let me create a burger icon component and update all the files:

Now let me update all files to replace "Priya" with "Swigister" and use the BurgerIcon instead of the image:

Now let me update the chat-area.tsx:

Now let me update the page.tsx:

Now let me update the bot-responses.ts:

Now let me also update the API route system prompt (though it's not being used since we're using local responses):

I've successfully updated the persona from "Priya" to "Swigister" and replaced the support agent photo with a custom burger icon SVG. The changes include:

1. Created a new BurgerIcon component with a detailed SVG burger (bun, lettuce, cheese, patty, sesame seeds)
2. Updated chat-message.tsx to use the burger icon and "Swigister" name
3. Updated chat-area.tsx header and typing indicator with the burger icon and "Swigister - Support Bot"
4. Updated the welcome message in page.tsx to introduce "Swigister"
5. Updated bot-responses.ts hello response to mention "Swigister"
6. Updated the API route system prompt for consistency