From 63d84725d2084d014de6aa73e74ba77a7e343484 Mon Sep 17 00:00:00 2001
From: Antonella Sgarlatta <anto@standardnotes.com>
Date: Mon, 28 Jul 2025 00:33:22 -0300
Subject: [PATCH] fix: Fixes extra bottom padding in account modal

---
 .../javascripts/Components/Popover/MobilePopoverContent.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/web/src/javascripts/Components/Popover/MobilePopoverContent.tsx b/packages/web/src/javascripts/Components/Popover/MobilePopoverContent.tsx
index 01f93bd47..2d7ebbd4c 100644
--- a/packages/web/src/javascripts/Components/Popover/MobilePopoverContent.tsx
+++ b/packages/web/src/javascripts/Components/Popover/MobilePopoverContent.tsx
@@ -11,6 +11,7 @@ import { useMediaQuery, MutuallyExclusiveMediaQueryBreakpoints } from '@/Hooks/u
 import { SupportsPassiveListeners } from '@/Constants/Constants'
 import { useLifecycleAnimation } from '@/Hooks/useLifecycleAnimation'
 import { getScrollParent } from '@/Utils'
+import { useAvailableSafeAreaPadding } from '@/Hooks/useSafeAreaPadding'
 
 const DisableScroll = () => {
   useDisableBodyScrollOnMobile()
@@ -63,6 +64,8 @@ const MobilePopoverContent = ({
     },
   })
 
+  const { hasBottomInset } = useAvailableSafeAreaPadding()
+
   useEffect(() => {
     if (!element) {
       return
@@ -181,7 +184,8 @@ const MobilePopoverContent = ({
         <div
           ref={mergeRefs([setPopoverElement, addCloseMethod])}
           className={classNames(
-            'z-1 absolute bottom-0 flex max-h-[calc(100%_-_max(var(--safe-area-inset-top),2rem))] min-h-[40%] w-full flex-col rounded-t-xl bg-passive-5 pb-safe-bottom',
+            'z-1 absolute bottom-0 flex max-h-[calc(100%_-_max(var(--safe-area-inset-top),2rem))] min-h-[40%] w-full flex-col rounded-t-xl bg-passive-5',
+            hasBottomInset && 'pb-safe-bottom',
             forceFullHeightOnMobile && 'h-full',
           )}
           style={{