feat: update Toaster component to support mobile positioning

[BrayanMQ]

PR: Implement Responsive Toast Positioning

📝 Description

This PR implements responsive positioning for toast notifications. It ensures that toasts appear at the top of the screen on mobile devices to prevent interference with the bottom navigation bar, while maintaining the standard bottom-right position on desktop screens.

🔗 Related Issue

Closes #89

🏷️ Type of Change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Documentation update
• Refactoring (no functional changes)
• Performance improvement
• Dependency update

🔄 Changes Made

• Modified components/ui/sonner.tsx to include an isMobile state.
• Added a matchMedia listener to detect screen width changes (breakpoint at 768px).
• Set dynamic position for Sonner Toaster: top-right for mobile and bottom-right for desktop.
• Cleaned up manual prop drilling for position to use the internal responsive logic.

🧪 Testing

• Manual testing completed
• Unit tests added/updated
• Integration tests added/updated

Tested by:

1. Triggering toasts in desktop view (verified bottom-right).
2. Resizing the browser to mobile width and triggering toasts (verified top-right).
3. Confirming that mobile navigation is no longer obstructed by successful/error notifications.

✅ Checklist

• My code follows the project's code style guidelines
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have updated the documentation accordingly (if applicable)
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published

📸 Screens

2026-01-19.19-17-56.mp4

📌 Additional Notes

The breakpoint is set to 768px (standard md breakpoint) to ensure a consistent experience across most mobile and tablet devices.