[WIP] Improve styles and enhance overall user experience

[Copilot]

• Fix message bubble colors (replaced harsh yellow #FFF123 with pleasant WhatsApp-style colors)
• Improve contact selection styling (better contrast with blue theme)
• Add proper spacing and padding throughout
• Style the filter input with Material Design components
• Add visual polish to contact list (borders, hover effects)
• Make message area look like a proper chat interface with bubbles
• Improve settings page layout with card-based design
• Add better labels and context to country select dropdown
• Enhance overall color scheme and typography
• Add responsive improvements for mobile devices
• Add icons to file upload buttons
• Improve button hover effects and transitions
• Add custom scrollbar styling
• Polish header and footer appearance

Original prompt

Styles need serious work and overall UX is clunky

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[coderabbitai]

Important

Review skipped

Bot user detected.

To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}