From bd2d0017740afd7e96be786ec220a950b2bde563 Mon Sep 17 00:00:00 2001
From: npeter83 <npeter83+claude@gmail.com>
Date: Sun, 9 Aug 2026 01:22:14 +0200
Subject: [PATCH] =?UTF-8?q?fix(theme):=20R10=20S1=20follow-ups=20=E2=80=94?=
 =?UTF-8?q?=20dedicated=20info=20token=20+=20restore=20collapsed=20hovers?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add --info/--info-fg (blue; dark #60a5fa / light #2563eb) so info notifications
  stop borrowing --accent, which collided with a status colour in schemes whose
  accent shares its hue (YouTube red = error, Slate orange = warn, Matrix/Forest
  green = success). Toaster info tone accent -> info.
- Restore hover feedback the codemod flattened: 'bg-X ... hover:bg-X' /
  'text-X ... hover:text-X' collapsed to a no-op once both shades mapped to one
  shadeless token. Reuse the house hover:opacity-{80,90} idiom (ConfirmProvider
  danger button, DownloadCenter error link).
---
 frontend/src/components/ConfirmProvider.tsx | 2 +-
 frontend/src/components/DownloadCenter.tsx  | 2 +-
 frontend/src/components/Toaster.tsx         | 2 +-
 frontend/src/index.css                      | 8 +++++++-
 4 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/ConfirmProvider.tsx b/frontend/src/components/ConfirmProvider.tsx
index 28d0ac39..277be749 100644
--- a/frontend/src/components/ConfirmProvider.tsx
+++ b/frontend/src/components/ConfirmProvider.tsx
@@ -118,7 +118,7 @@ export function ConfirmProvider({ children }: { children: ReactNode }) {
                   multi ? "w-full" : ""
                 } ${
                   c.danger
-                    ? "bg-danger text-danger-fg hover:bg-danger"
+                    ? "bg-danger text-danger-fg hover:opacity-90"
                     : "bg-accent text-accent-fg hover:opacity-90"
                 }`}
               >
diff --git a/frontend/src/components/DownloadCenter.tsx b/frontend/src/components/DownloadCenter.tsx
index 41a868cb..1b4975cb 100644
--- a/frontend/src/components/DownloadCenter.tsx
+++ b/frontend/src/components/DownloadCenter.tsx
@@ -253,7 +253,7 @@ function DownloadRow({
           {job.status === "error" ? (
             <button
               onClick={() => onShowError?.(job)}
-              className="text-danger hover:text-danger inline-flex items-center gap-1 truncate"
+              className="text-danger hover:opacity-80 inline-flex items-center gap-1 truncate"
               title={t("downloads.errors.fail.title")}
             >
               · {t(`downloads.errors.fail.cat.${job.error_code || "unknown"}.short`)}
diff --git a/frontend/src/components/Toaster.tsx b/frontend/src/components/Toaster.tsx
index d87af574..32fa398d 100644
--- a/frontend/src/components/Toaster.tsx
+++ b/frontend/src/components/Toaster.tsx
@@ -4,7 +4,7 @@ import { AlertCircle, AlertTriangle, CheckCircle2, Info, X, XCircle } from "luci
 import { dismiss, getActiveToasts, subscribe, type NotifLevel } from "../lib/notifications";
 
 export const LEVEL_STYLE: Record<NotifLevel, { icon: typeof Info; color: string; bar: string }> = {
-  info: { icon: Info, color: "text-accent", bar: "bg-accent" },
+  info: { icon: Info, color: "text-info", bar: "bg-info" },
   success: { icon: CheckCircle2, color: "text-success", bar: "bg-success" },
   warning: { icon: AlertTriangle, color: "text-warn", bar: "bg-warn" },
   error: { icon: AlertCircle, color: "text-danger", bar: "bg-danger" },
diff --git a/frontend/src/index.css b/frontend/src/index.css
index b836f451..75cf0660 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -4,7 +4,7 @@
    bg-{status} fill always has a readable text-{status}-fg partner available
    (Tailwind v4 only emits a utility when it sees it used; success-fg has no fill
    consumer today). Keeps the semantic token set complete + future-proof. */
-@source inline("text-danger-fg text-warn-fg text-success-fg");
+@source inline("text-danger-fg text-warn-fg text-success-fg text-info-fg");
 
 /* `inline` is load-bearing: the color vars (--bg/--accent/… below) are redefined at
    runtime per html[data-scheme]/[data-theme], so utilities must inline the value and
@@ -20,6 +20,8 @@
   --color-muted: var(--muted);
   --color-accent: var(--accent);
   --color-accent-fg: var(--accent-fg);
+  --color-info: var(--info);
+  --color-info-fg: var(--info-fg);
   --color-danger: var(--danger);
   --color-danger-fg: var(--danger-fg);
   --color-warn: var(--warn);
@@ -683,6 +685,8 @@ html[data-theme="dark"] {
   --warn-fg: #1f1400;
   --success: #34d399;
   --success-fg: #052016;
+  --info: #60a5fa;
+  --info-fg: #08172e;
 }
 html[data-theme="light"] {
   --danger: #dc2626;
@@ -691,6 +695,8 @@ html[data-theme="light"] {
   --warn-fg: #ffffff;
   --success: #047857;
   --success-fg: #ffffff;
+  --info: #2563eb;
+  --info-fg: #ffffff;
 }
 
 /* Toast auto-dismiss countdown bar (shrinks left-to-right to zero) */