From 3599630cd79a72d628c01583e360b39c8aacba79 Mon Sep 17 00:00:00 2001
From: Areeb Sajjad <89740222+asajjad2@users.noreply.github.com>
Date: Thu, 26 Feb 2026 06:19:18 +0500
Subject: [PATCH] fix: allow configure modal overflow to prevent datepicker
 clipping (#2901)

---
 src/generic/configure-modal/ConfigureModal.jsx  | 2 +-
 src/generic/configure-modal/ConfigureModal.scss | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/generic/configure-modal/ConfigureModal.jsx b/src/generic/configure-modal/ConfigureModal.jsx
index d41458b8a..cf5cb6038 100644
--- a/src/generic/configure-modal/ConfigureModal.jsx
+++ b/src/generic/configure-modal/ConfigureModal.jsx
@@ -277,7 +277,7 @@ const ConfigureModal = ({
       onClose={onClose}
       hasCloseButton
       isFullscreenOnMobile
-      isOverflowVisible={false}
+      isOverflowVisible
     >
       <div data-testid="configure-modal">
         <ModalDialog.Header className="configure-modal__header">
diff --git a/src/generic/configure-modal/ConfigureModal.scss b/src/generic/configure-modal/ConfigureModal.scss
index 9a0eb6474..f9331fcdb 100644
--- a/src/generic/configure-modal/ConfigureModal.scss
+++ b/src/generic/configure-modal/ConfigureModal.scss
@@ -4,6 +4,10 @@
     position: static;
   }
 
+  .react-datepicker-popper {
+    z-index: 10;
+  }
+
   .w-7rem {
     width: 7.2rem;
   }