Student Profile Modal - Copy this React, Tailwind Component to your project

Design a modern, user friendly student profile modal. The modal should display the following student details: Student Name Role Number Student ID Class Name Avatar (profile picture) Mobile Number Registration Number Admission Date (in readable format) Religion Blood Group Gender Status (Active/Inactive) Design guidelines: Clean, minimal, and modern layout with light colors and whitespace. Display the avatar prominently at the top, followed by essential information (name, role number, student ID). Group information into sections (e.g., personal, academic, and contact details). Include "Close" and "Edit" buttons for easy interaction. Use subtle animations for modal transitions (e.g., fade in). Ensure responsiveness for both desktop and mobile views. Important details like the student name, class, and contact information should be easy to scan. Icons can be used for details like contact info and status indicators. Bonus: Add a light/dark mode toggle. Optionally, make contact details clickable icons (e.g., call, message). Target audience: School administrators viewing student profiles.