From 5aa4e15922cb4ccfabf15b642f8efd3b913b3933 Mon Sep 17 00:00:00 2001
From: Jan-Henrik Bruhn <jan-henrik.bruhn@offis.de>
Date: Mon, 22 Dec 2025 12:00:54 +0100
Subject: [PATCH] fix: Improve destructive Alert variant styling
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Update the destructive variant to use proper danger colors (light red background with dark red text in light mode, dark red background with light text in dark mode) instead of the previous white background with red text.

This allows semantic use of variant="destructive" throughout the app without custom styling overrides.

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

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
---
 src/components/FileUpload.tsx | 7 ++-----
 src/components/ui/alert.tsx   | 2 +-
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index 5c05105..eb65511 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -386,11 +386,8 @@ export function FileUpload() {
           )}
 
           {pesData && boundsCheck.error && (
-            <Alert
-              variant="destructive"
-              className="bg-danger-100 dark:bg-danger-900/20 border-danger-200 dark:border-danger-800"
-            >
-              <AlertDescription className="text-danger-900 dark:text-danger-100 text-sm">
+            <Alert variant="destructive">
+              <AlertDescription>
                 <strong>Pattern too large:</strong> {boundsCheck.error}
               </AlertDescription>
             </Alert>
diff --git a/src/components/ui/alert.tsx b/src/components/ui/alert.tsx
index aa7de24..b0c828f 100644
--- a/src/components/ui/alert.tsx
+++ b/src/components/ui/alert.tsx
@@ -10,7 +10,7 @@ const alertVariants = cva(
       variant: {
         default: "bg-card text-card-foreground",
         destructive:
-          "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90",
+          "bg-danger-100 dark:bg-danger-900/20 border-danger-200 dark:border-danger-800 text-danger-900 dark:text-danger-100 [&>svg]:text-current *:data-[slot=alert-description]:text-danger-900 dark:*:data-[slot=alert-description]:text-danger-100",
       },
     },
     defaultVariants: {