The facility and appointment pages lack mobile responsiveness

[modamaan]

Describe the bug
The facility and appointment pages are not mobile responsive. When accessed on smaller screens, elements like buttons, text, overlapping, or not properly scaled, leading to a poor user experience.

To Reproduce
Steps to reproduce the behavior:

1. Go to 'appointments button on sidebar'
2. switch to mobile screen
3. See error

Expected behavior
The facility and appointment pages should be fully mobile responsive. On smaller screens, all elements should adjust seamlessly

Screenshots

screenshot 1

screenshot 2

Desktop (please complete the following information):

• OS: [windows]
• Browser [chrome]
• Version [131.0.6778.109]

Additional context
Add any other context about the problem here.

[modamaan]

@rithviknishad i would like to work on this

[modamaan]

problem3

[modamaan]

problem 4

[modamaan]

@rithviknishad can you please reopen the PR