Looking at the screenshot, I can see the delete confirmation dialog where the red button's text "确认删除" is not visible - the text appears to be the same color as the background. Let me check the AlertDialog and Button components to understand the styling issue:

Now I understand the issue. The AlertDialogAction uses buttonVariants() which defaults to variant: 'default' (primary colors), and my custom classes are being overridden. I can see the Button component has a destructive variant that already sets text-white. Let me read the template-manager.tsx and fix it properly by using the buttonVariants with the destructive variant:

I see the issue now. The AlertDialogAction component uses buttonVariants() which has a default variant with bg-primary text-primary-foreground. My custom bg-red-600 text-white classes are being overridden by the default button styles due to CSS specificity.

Looking at the Button component, I see there's already a destructive variant: 'bg-destructive text-white hover:bg-destructive/90'. The problem is that AlertDialogAction doesn't accept a variant prop directly - it uses buttonVariants() without parameters.

I need to import buttonVariants and use it with the destructive variant to ensure proper styling:

Fixed the delete confirmation button by importing buttonVariants from the Button component and using it with the destructive variant. The Button component's destructive variant already has text-white defined, which ensures the text will always be visible against the red background. This approach properly overrides the default button styles instead of relying on conflicting class names.

Looking at the image, I can see two issues:

1. The dialog's "确认删除" button is completely red with invisible text (text color same as background)
2. The trash icon button on the left template list also has styling issues

The problem is that AlertDialogAction already internally calls buttonVariants() and merges with my className, causing CSS conflicts. The text-white class is being overridden. Let me fix this by using inline style to force the text color:

Now I see the full code. The issue is that AlertDialogAction uses cn(buttonVariants(), className) - it applies the default buttonVariants first, then my className. But CSS class order in Tailwind can be tricky. Let me check the Button component's destructive variant: