Order Tracking Page - Copy this React, Tailwind Component to your project
Create an order tracking page featuring a clean, modern layout that seamlessly integrates into a responsive design, ensuring optimal functionality across devices. At the top, include a prominent header with the title "Track Your Order" in bold, inviting typography. Below this, place a simple input field where users can enter their order number, accompanied by a clear "Track" button styled to match the overall aesthetic. Ensure the input field is wide enough for easy readability, with placeholder text guiding users on the format of the order number. Below the input, display a status area that dynamically updates to show the current status of the order—whether it's processing, shipped, or delivered—using color coded indicators (e.g., red for processing, yellow for shipped, green for delivered). Include a brief summary of the expected delivery date and tracking history, ensuring all elements are harmoniously aligned and visually accessible. The page should be fully reactive, adapting gracefully to both desktop and mobile views, with a smooth transition effect when the order status updates.
