From 77479d987d54a9d43dfebe462385c55b76c23d8a Mon Sep 17 00:00:00 2001
From: deveshanim3 <deveshsingh6986@gmail.com>
Date: Thu, 16 Apr 2026 03:52:44 +0530
Subject: [PATCH 1/2] fixed calendor modal stacking issue

---
 src/lib/components/DateTimeInput.svelte | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/lib/components/DateTimeInput.svelte b/src/lib/components/DateTimeInput.svelte
index 5d21288b..210ecbac 100644
--- a/src/lib/components/DateTimeInput.svelte
+++ b/src/lib/components/DateTimeInput.svelte
@@ -68,22 +68,23 @@
   })
 </script>
 
-<div class="relative grid grid-cols-2 gap-2" bind:this={element}>
-  <div class="relative">
+<div class="relative focus-within:z-50 grid grid-cols-2 gap-2" bind:this={element}>
+  <div class="relative group z-20">
     <DateInput format="yyyy-MM-dd" placeholder="" bind:value={date} />
-    <div class="absolute right-2 top-0 flex h-12 cursor-pointer items-center gap-2">
+    <div
+      class="absolute right-2 top-0 flex h-12 cursor-pointer items-center gap-2 opacity-100 group-focus-within:opacity-0 group-focus-within:pointer-events-none transition-opacity pointer-events-none">
       {#if date}
-        <Button onclick={clear} class="h-5">
+        <Button onclick={clear} class="h-5 pointer-events-auto">
           <Icon icon={CloseCircle} />
         </Button>
       {:else}
-        <Button onclick={focusDate} class="h-5">
+        <Button onclick={focusDate} class="h-5 pointer-events-auto">
           <Icon icon={CalendarMinimalistic} />
         </Button>
       {/if}
     </div>
   </div>
-  <label class="input input-bordered flex items-center">
+  <label class="input input-bordered flex items-center relative">
     <input
       list="time-options"
       class="grow"
-- 
2.52.0


From 222bed914fc3b0ab119a41b2b7e3de9039dd6a57 Mon Sep 17 00:00:00 2001
From: deveshanim3 <deveshsingh6986@gmail.com>
Date: Thu, 16 Apr 2026 17:17:17 +0530
Subject: [PATCH 2/2] changed z-index values according to tailwind config

---
 src/lib/components/DateTimeInput.svelte | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/DateTimeInput.svelte b/src/lib/components/DateTimeInput.svelte
index 210ecbac..3f181272 100644
--- a/src/lib/components/DateTimeInput.svelte
+++ b/src/lib/components/DateTimeInput.svelte
@@ -68,8 +68,8 @@
   })
 </script>
 
-<div class="relative focus-within:z-50 grid grid-cols-2 gap-2" bind:this={element}>
-  <div class="relative group z-20">
+<div class="relative focus-within:z-modal grid grid-cols-2 gap-2" bind:this={element}>
+  <div class="relative group z-popover">
     <DateInput format="yyyy-MM-dd" placeholder="" bind:value={date} />
     <div
       class="absolute right-2 top-0 flex h-12 cursor-pointer items-center gap-2 opacity-100 group-focus-within:opacity-0 group-focus-within:pointer-events-none transition-opacity pointer-events-none">
-- 
2.52.0