From b6e882add2232eecb64ee5221b6981bb6787c54c Mon Sep 17 00:00:00 2001
From: Lukas <lukas.richter@maibornwolff.de>
Date: Mon, 16 Mar 2026 11:57:27 +0100
Subject: [PATCH] Add explicit text-foreground to ghost and outline button
 variants

Buttons should declare their own text color rather than relying on
inheritance, which breaks in contexts like native <dialog>. Remove
the text-foreground workaround from the dialog elements.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 apps/web/src/components/create-player-modal.tsx | 2 +-
 apps/web/src/components/player-management.tsx   | 2 +-
 apps/web/src/components/ui/button.tsx           | 5 +++--
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/components/create-player-modal.tsx b/apps/web/src/components/create-player-modal.tsx
index ff15571..8edae9f 100644
--- a/apps/web/src/components/create-player-modal.tsx
+++ b/apps/web/src/components/create-player-modal.tsx
@@ -106,7 +106,7 @@ export function CreatePlayerModal({
 	return (
 		<dialog
 			ref={dialogRef}
-			className="m-auto w-full max-w-md rounded-lg border border-border bg-card p-6 text-foreground shadow-xl backdrop:bg-black/50"
+			className="m-auto w-full max-w-md rounded-lg border border-border bg-card p-6 shadow-xl backdrop:bg-black/50"
 		>
 			<div className="mb-4 flex items-center justify-between">
 				<h2 className="font-semibold text-foreground text-lg">
diff --git a/apps/web/src/components/player-management.tsx b/apps/web/src/components/player-management.tsx
index 43c424b..9518b90 100644
--- a/apps/web/src/components/player-management.tsx
+++ b/apps/web/src/components/player-management.tsx
@@ -55,7 +55,7 @@ export function PlayerManagement({
 	return (
 		<dialog
 			ref={dialogRef}
-			className="m-auto w-full max-w-md rounded-lg border border-border bg-card p-6 text-foreground shadow-xl backdrop:bg-black/50"
+			className="m-auto w-full max-w-md rounded-lg border border-border bg-card p-6 shadow-xl backdrop:bg-black/50"
 		>
 			<div className="mb-4 flex items-center justify-between">
 				<h2 className="font-semibold text-foreground text-lg">
diff --git a/apps/web/src/components/ui/button.tsx b/apps/web/src/components/ui/button.tsx
index e63fd18..27670fa 100644
--- a/apps/web/src/components/ui/button.tsx
+++ b/apps/web/src/components/ui/button.tsx
@@ -9,8 +9,9 @@ const buttonVariants = cva(
 			variant: {
 				default: "bg-primary text-primary-foreground hover:bg-primary/90",
 				outline:
-					"border border-border bg-transparent hover:bg-hover-neutral-bg hover:text-hover-neutral",
-				ghost: "hover:bg-hover-neutral-bg hover:text-hover-neutral",
+					"border border-border bg-transparent text-foreground hover:bg-hover-neutral-bg hover:text-hover-neutral",
+				ghost:
+					"text-foreground hover:bg-hover-neutral-bg hover:text-hover-neutral",
 			},
 			size: {
 				default: "h-8 px-3 text-xs",