Fix Toast Popup Overflow Issue in Prescriptions Mobile View

📌 Summary:

This MR fixes the toast notification overflow issue in the Prescriptions page on mobile view. After successfully adding a prescription, the toast popup was extending beyond the screen margins, making it partially invisible and affecting user experience.

The toast component has now been updated to be fully responsive and properly positioned within mobile screen boundaries.

🐞 Problem:

After adding a prescription successfully, a toast notification appears.

In mobile view, the toast:

• Overflowed beyond screen width
• Was partially cut off
• Did not respect mobile margins
• This reduced readability and created a poor user experience for volunteers using mobile devices.

✅ Changes Implemented

• Updated toast container styling for better responsiveness.
• Adjusted width and positioning for mobile breakpoints.
• Verified that toast remains fully visible across different screen sizes.

🎯 Result:

• Toast notifications are now fully visible on mobile devices.
• Improved readability and UI consistency.
• Better user experience for volunteers adding prescriptions on smaller screens.
• Responsive behavior aligned with mobile-first design principles.

🧪 Tested On:

• Mobile view
• Small screen widths (320px–480px)