Message Box Position Issue and Reversed Background Text in Chat with Rider

**Describe the bug**
The message box is positioned too low on the screen, and the background text is displayed in reverse.

**To Reproduce**

1. Go to 'Place Order'.
2. Complete the process to place the order.
3. When the order is placed and assigned to a rider, click on 'Chat with Rider'.
4. See error

**Expected behavior**
The message box should be positioned slightly higher for better accessibility, and the background text should be displayed correctly, not in reverse.

**Smartphone (please complete the following information):**

- Device: IOS

Reproduce the issue on iOS by following Place Order through assignment, then opening Chat with Rider. Start by locating the chat screen and inspect the message box and background text rendering. Done means the box is slightly higher and the background text displays correctly without reversal.

Written by the indexing model from the issue text.