From d97eb77569e7a7e4c16a204d2b1737c2dad14d10 Mon Sep 17 00:00:00 2001
From: Usman Baig <mubaig@pm.me>
Date: Wed, 25 Mar 2026 23:35:18 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20smooth=20close=20animation=20=E2=80=94?=
 =?UTF-8?q?=20opacity=20fade=20on=20exit=20only,=20instant=20on=20open?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/settings/unified/UnifiedSettingsModal.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/components/settings/unified/UnifiedSettingsModal.tsx b/components/settings/unified/UnifiedSettingsModal.tsx
index c03df70..0983523 100644
--- a/components/settings/unified/UnifiedSettingsModal.tsx
+++ b/components/settings/unified/UnifiedSettingsModal.tsx
@@ -376,8 +376,12 @@ export default function UnifiedSettingsModal() {
     <AnimatePresence>
       {isOpen && (
         <>
-          {/* Backdrop — no opacity animation to prevent chart flash through glass */}
-          <div
+          {/* Backdrop — instant appear, animated close */}
+          <motion.div
+            initial={{ opacity: 1 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            transition={{ duration: 0.15 }}
             className="fixed inset-0 z-[60] bg-black/60 backdrop-blur-sm"
             onClick={handleBackdropClick}
           />
@@ -385,8 +389,8 @@ export default function UnifiedSettingsModal() {
           {/* Modal */}
           <motion.div
             initial={{ scale: 0.97, y: 8 }}
-            animate={{ scale: 1, y: 0 }}
-            exit={{ scale: 0.97, y: 8 }}
+            animate={{ opacity: 1, scale: 1, y: 0 }}
+            exit={{ opacity: 0, scale: 0.97, y: 8 }}
             transition={{ type: 'spring', bounce: 0.15, duration: 0.35 }}
             className="fixed inset-0 z-[61] flex items-center justify-center p-4 pointer-events-none"
           >