Modal - Copy this React, Tailwind Component to your project

Design a modern, user friendly modal UI to display attendance terminal information with the following details: Device Name: My Device Device IP: 192.168.1.8 Device Port: 4370 Status: Disconnected/Connected (show status with color or icon) Enable Status: Active/Inactive User Count: 0 Last Disconnected At: October 23, 2024, 05:25 AM (in readable format) Device Time: Display in human readable date and time format Created At: Date of creation, formatted for readability Last Updated At: Date of last update, formatted for readability Design guidelines: Use a clean, modern design with whitespace to make each detail easy to read. Group key information into sections, such as Device Info, Status, and Timestamps. Display the status clearly with a color coded label or icon (e.g., green for "connected," red for "disconnected"). Include "Close" and "Edit" buttons with a modern, accessible style. Ensure the modal is responsive for desktop and mobile use. Include icons where helpful, such as status indicators for quick scanning. Ensure high contrast for accessibility, with easy to read text and clear visual elements. Bonus: Add a theme toggle for light/dark mode. Include optional tooltips for fields with technical terms like Device IP and Device Port. Target audience: System administrators or IT staff managing attendance terminals.