Mav-Mobile-UI/src/components/UI/ModalComponent.tsx

import type React from "react";
import Modal from "react-modal";

type ModalComponentProps = {
  isModalOpen: boolean;
  children: React.ReactNode;
  close: () => void;
};

const ModalComponent = ({
  isModalOpen,
  children,
  close,
}: ModalComponentProps) => {
  return (
    <Modal
      isOpen={isModalOpen}
      onRequestClose={close}
      className="bg-[#1e2a38] p-6 rounded-lg shadow-lg max-w-[90%] mx-auto mt-[1%] md:w-[80%] md:h-[90%] z-[100] overflow-y-auto max-h-screen"
      overlayClassName="fixed inset-0 bg-[#1e2a38]/70 flex justify-center items-start z-100"
    >
      {children}
    </Modal>
  );
};

export default ModalComponent;