From 97db95243aaa3e998823a79cc791ff70e1cc417e Mon Sep 17 00:00:00 2001
From: Ajax Davis <thomasalwyndavis@gmail.com>
Date: Thu, 4 Dec 2025 18:49:59 +1000
Subject: [PATCH] fix: use lighter background for tool detail modal
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Change modal from bg-background to bg-white/dark:bg-gray-900
- Makes modal stand out clearly from the app background
- Provides better visual hierarchy

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 apps/playground/src/components/sidebar/ToolsSidebar.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/playground/src/components/sidebar/ToolsSidebar.tsx b/apps/playground/src/components/sidebar/ToolsSidebar.tsx
index 55541fc..0fcd797 100644
--- a/apps/playground/src/components/sidebar/ToolsSidebar.tsx
+++ b/apps/playground/src/components/sidebar/ToolsSidebar.tsx
@@ -116,7 +116,7 @@ export function ToolsSidebar(): React.ReactElement {
           tabIndex={0}
           aria-label="Close modal"
         >
-          <div className="relative mx-4 max-h-[90vh] w-full max-w-2xl overflow-y-auto rounded-lg border border-border bg-background p-6 shadow-xl">
+          <div className="relative mx-4 max-h-[90vh] w-full max-w-2xl overflow-y-auto rounded-lg border border-border bg-white dark:bg-gray-900 p-6 shadow-xl">
             {/* Close button */}
             <button
               type="button"