Date Picker Does Not Display Correctly on Mobile Devices

[shauryag2002]

Describe the bug
The date picker component does not render correctly on mobile devices. When selecting a date, the calendar appears out of alignment, leading to a poor user experience.

To Reproduce
Steps to reproduce the behavior:

1. Click on Patients from sidebar.
2. Now, click on any patient.
3. Click on the Date of onset date picker input field in small screens.
4. See responsiveness error of date picker overflowing.

Expected behavior
The date picker component should render correctly on mobile devices. When selecting a date, the calendar should appear aligned and fully visible within the viewport, providing a seamless user experience.

Before	After

Desktop (please complete the following information):

• OS: Windows
• Browser: Brave
• Version: 1.70.126

[shauryag2002]

I am working on this .

[shivankacker]

@shauryag2002 we are updating the date picker component in #8504
This issue will be covered by that PR. Thanks for taking the time out to contribute!