feat: trocar cores da topbar de primary-foreground para foreground

Links, triggers, ícones e ações passam a usar text-foreground
e hover:bg-foreground/10, removendo o override de CSS vars.
Logo text usa dark:invert ao invés de invert sempre.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

components/topbar/app-topbar.tsx

@@ -29,7 +29,7 @@ export function AppTopbar({
 	notificationsSnapshot,
 }: AppTopbarProps) {
 	return (
-		<header className="fixed top-0 left-0 right-0 z-50 bg-primary shadow-md h-14 shrink-0 flex items-center">
+		<header className="fixed top-0 left-0 right-0 z-50 bg-primary h-14 shrink-0 flex items-center shadow-md">
 			<div className="w-full max-w-8xl mx-auto px-4 flex items-center gap-3 h-full">
 				{/* Logo */}
 				<Link
@@ -49,7 +49,7 @@ export function AppTopbar({
 						alt="OpenMonetis"
 						width={90}
 						height={28}
-						className="object-contain invert hidden sm:block"
+						className="object-contain dark:invert hidden sm:block"
 						priority
 					/>
 				</Link>
@@ -57,22 +57,8 @@ export function AppTopbar({
 				{/* Navigation */}
 				<TopNavMenu preLancamentosCount={preLancamentosCount} />
 
-				{/* Right-side actions — CSS vars overridden so icons render light on primary bg */}
-				<div
-					className="ml-auto flex items-center gap-1"
-					style={
-						{
-							"--foreground": "var(--primary-foreground)",
-							"--muted-foreground":
-								"color-mix(in oklch, var(--primary-foreground) 70%, transparent)",
-							"--accent":
-								"color-mix(in oklch, var(--primary-foreground) 15%, transparent)",
-							"--accent-foreground": "var(--primary-foreground)",
-							"--border":
-								"color-mix(in oklch, var(--primary-foreground) 30%, transparent)",
-						} as React.CSSProperties
-					}
-				>
+				{/* Right-side actions */}
+				<div className="ml-auto flex items-center gap-1">
 					<NotificationBell
 						notifications={notificationsSnapshot.notifications}
 						totalCount={notificationsSnapshot.totalCount}
@@ -83,12 +69,12 @@ export function AppTopbar({
 					<AnimatedThemeToggler />
 					<span
 						aria-hidden
-						className="h-5 w-px bg-primary-foreground/30 mx-1 hidden sm:block"
+						className="h-5 w-px bg-foreground/20 mx-1 hidden sm:block"
 					/>
 					<FeedbackDialog />
 				</div>
 
-				{/* User avatar — outside the var-override div so dropdown stays normal */}
+				{/* User avatar */}
 				<TopbarUser user={user} pagadorAvatarUrl={pagadorAvatarUrl} />
 			</div>
 		</header>