Chatbot UI: improve conversation flow with auto-scroll and scroll-to-bottom button

[PRAteek-singHWY]

Summary

This PR enhances the Chatbot UI by improving scroll behavior, conversation readability, and the initial landing experience. It builds directly on the changes introduced in #698 and is intended to be reviewed after that PR.

What changed

• Added a scroll-to-bottom button that appears when the user scrolls away from the latest message.
• Ensured automatic scrolling to the latest message whenever a new message is sent or received.
• Isolated scrolling strictly to the chat message area to avoid page-level scroll jumps.
• Refined the landing state UI to feel more inviting and guide users toward asking questions.
• Improved spacing, layout balance, and visual hierarchy for better readability across screen sizes.

Files changed

• application/frontend/src/pages/chatbot/chatbot.tsx
• application/frontend/src/pages/chatbot/chatbot.scss

Dependency

• This PR depends on Chatbot UI: isolate message scrolling, stabilize input, and improve conversation readability #698 – Chatbot UI: isolate message scrolling, stabilize input, and improve conversation readability and should be reviewed and merged first.

Demo

A short screen recording is attached to demonstrate:

• Scroll-to-bottom behavior on both Mobile and Desktop an dtabbekt devices
• Auto-scroll on new messages
• Button placement and visibility
• Overall conversation flow and landing experience

Screen.Recording.2026-01-06.at.03.19.29.mp4

Notes

• No backend or API logic is modified.
• Changes are limited to UI/UX improvements for the chatbot experience.