From 6ec05757a7fee72f1f2e911b78169b42514e7385 Mon Sep 17 00:00:00 2001
From: Michael Chihlas <michael@chihlas.com>
Date: Sun, 22 Mar 2026 02:26:25 -0400
Subject: [PATCH] fix: migrate 11 remaining files missed by component sweep

editor-ai, guides, maintenance, scripts, settings, NavItem,
and dashboard active-glow removal.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/src/components/dashboard/PerformanceCards.tsx   | 5 +----
 frontend/src/components/dashboard/QuickStats.tsx         | 2 +-
 frontend/src/components/editor-ai/AIPromptDialog.tsx     | 4 ++--
 frontend/src/components/editor-ai/ChatTab.tsx            | 2 +-
 frontend/src/components/guides/GuideCard.tsx             | 2 +-
 frontend/src/components/layout/NavItem.tsx               | 4 ++--
 frontend/src/components/maintenance/BatchLaunchModal.tsx | 2 +-
 frontend/src/components/maintenance/BatchStatusCard.tsx  | 2 +-
 frontend/src/components/scripts/ScriptConfigurePane.tsx  | 8 ++++----
 frontend/src/components/session/SessionFilters.tsx       | 2 +-
 frontend/src/components/settings/BrandingSettings.tsx    | 4 ++--
 11 files changed, 17 insertions(+), 20 deletions(-)

diff --git a/frontend/src/components/dashboard/PerformanceCards.tsx b/frontend/src/components/dashboard/PerformanceCards.tsx
index 66a0ad0f..6b18b1c9 100644
--- a/frontend/src/components/dashboard/PerformanceCards.tsx
+++ b/frontend/src/components/dashboard/PerformanceCards.tsx
@@ -70,10 +70,7 @@ export function PerformanceCards() {
         <button
           key={card.label}
           onClick={() => navigate(card.href)}
-          className={cn(
-            'card-interactive p-4 text-left fade-in',
-            i === 0 && 'active-glow'
-          )}
+          className="card-interactive p-4 text-left fade-in"
           style={{ animationDelay: `${400 + i * 60}ms` }}
         >
           <div className="flex items-center justify-between mb-2">
diff --git a/frontend/src/components/dashboard/QuickStats.tsx b/frontend/src/components/dashboard/QuickStats.tsx
index 7ed7b03b..12215a82 100644
--- a/frontend/src/components/dashboard/QuickStats.tsx
+++ b/frontend/src/components/dashboard/QuickStats.tsx
@@ -18,7 +18,7 @@ export function QuickStats({ stats }: QuickStatsProps) {
       {stats.map((stat, i) => (
         <div
           key={stat.label}
-          className={cn('card-interactive p-4 fade-in', i === 0 && 'active-glow')}
+          className={cn('card-interactive p-4 fade-in')}
           style={{ animationDelay: `${50 + i * 30}ms` }}
         >
           <p className="font-sans text-xs text-[0.625rem] font-medium uppercase tracking-widest text-[#848b9b]">
diff --git a/frontend/src/components/editor-ai/AIPromptDialog.tsx b/frontend/src/components/editor-ai/AIPromptDialog.tsx
index ad32fd54..f2ad60b3 100644
--- a/frontend/src/components/editor-ai/AIPromptDialog.tsx
+++ b/frontend/src/components/editor-ai/AIPromptDialog.tsx
@@ -50,7 +50,7 @@ export function AIPromptDialog({
       />
 
       {/* Dialog */}
-      <div className="glass-card-static relative w-full max-w-lg p-6 shadow-xl">
+      <div className="card-flat relative w-full max-w-lg p-6 shadow-xl">
         <div className="flex items-center gap-2 mb-4">
           <Sparkles className="h-5 w-5 text-primary" />
           <h2 className="text-lg font-heading font-semibold text-foreground">
@@ -90,7 +90,7 @@ export function AIPromptDialog({
           <button
             onClick={handleGenerate}
             disabled={!prompt.trim() || isGenerating}
-            className="flex items-center gap-2 rounded-[10px] bg-gradient-brand px-4 py-2 text-sm font-semibold text-brand-dark shadow-lg shadow-primary/20 hover:opacity-90 active:scale-[0.97] transition-all disabled:opacity-50"
+            className="flex items-center gap-2 rounded-lg bg-[#22d3ee] px-4 py-2 text-sm font-semibold text-white hover:brightness-110 active:scale-[0.98] transition-all disabled:opacity-50"
           >
             {isGenerating ? (
               <>
diff --git a/frontend/src/components/editor-ai/ChatTab.tsx b/frontend/src/components/editor-ai/ChatTab.tsx
index 7d760bd0..e6ae4834 100644
--- a/frontend/src/components/editor-ai/ChatTab.tsx
+++ b/frontend/src/components/editor-ai/ChatTab.tsx
@@ -84,7 +84,7 @@ export function ChatTab({ messages, input, onInputChange, onSend, isLoading }: C
           <button
             onClick={onSend}
             disabled={!input.trim() || isLoading}
-            className="bg-gradient-brand text-brand-dark p-2.5 rounded-xl hover:opacity-90 active:scale-[0.97] transition-all disabled:opacity-40"
+            className="bg-[#22d3ee] text-white p-2.5 rounded-xl hover:brightness-110 active:scale-[0.98] transition-all disabled:opacity-40"
           >
             <Send size={16} />
           </button>
diff --git a/frontend/src/components/guides/GuideCard.tsx b/frontend/src/components/guides/GuideCard.tsx
index c165017e..b0970d83 100644
--- a/frontend/src/components/guides/GuideCard.tsx
+++ b/frontend/src/components/guides/GuideCard.tsx
@@ -11,7 +11,7 @@ export function GuideCard({ guide }: GuideCardProps) {
   return (
     <Link
       to={`/guides/${guide.slug}`}
-      className="glass-card block rounded-2xl p-5 transition-all"
+      className="card-interactive block rounded-lg p-5 transition-all"
     >
       <div className="flex items-start gap-3.5">
         <div className="flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-primary/10">
diff --git a/frontend/src/components/layout/NavItem.tsx b/frontend/src/components/layout/NavItem.tsx
index cf05ee74..743b3db2 100644
--- a/frontend/src/components/layout/NavItem.tsx
+++ b/frontend/src/components/layout/NavItem.tsx
@@ -48,7 +48,7 @@ export function NavItem({ href, icon: Icon, label, badge, iconColor, matchPaths,
         title={label}
       >
         {isActive && (
-          <div className="absolute left-0 top-1/2 h-6 w-[3px] -translate-y-1/2 rounded-r-full bg-gradient-brand" />
+          <div className="absolute left-0 top-1/2 h-6 w-[3px] -translate-y-1/2 rounded-r-full bg-[#22d3ee]" />
         )}
         <Icon size={18} className={cn('shrink-0', isActive ? 'opacity-100' : 'opacity-70')} style={iconColor ? { color: iconColor } : undefined} />
         {badge !== undefined && badge !== 0 && badge !== 'dot' && (
@@ -76,7 +76,7 @@ export function NavItem({ href, icon: Icon, label, badge, iconColor, matchPaths,
       >
         {/* Active indicator bar */}
         {isActive && !isParentDimmed && (
-          <div className="absolute left-0 top-1/2 h-6 w-[3px] -translate-y-1/2 rounded-r-full bg-gradient-brand" />
+          <div className="absolute left-0 top-1/2 h-6 w-[3px] -translate-y-1/2 rounded-r-full bg-[#22d3ee]" />
         )}
 
         <Icon size={18} className={cn('shrink-0', isActive ? 'opacity-100' : 'opacity-70')} style={iconColor ? { color: iconColor } : undefined} />
diff --git a/frontend/src/components/maintenance/BatchLaunchModal.tsx b/frontend/src/components/maintenance/BatchLaunchModal.tsx
index 85669e9b..55fe5184 100644
--- a/frontend/src/components/maintenance/BatchLaunchModal.tsx
+++ b/frontend/src/components/maintenance/BatchLaunchModal.tsx
@@ -192,7 +192,7 @@ export function BatchLaunchModal({ treeId, treeName, onClose, onLaunched }: Batc
           <button
             onClick={handleLaunch}
             disabled={isLaunching || targets.length === 0}
-            className="rounded-lg bg-gradient-brand px-4 py-2 text-[0.875rem] font-medium text-white shadow-lg shadow-primary/20 hover:opacity-90 disabled:opacity-50"
+            className="rounded-lg bg-[#22d3ee] px-4 py-2 text-[0.875rem] font-medium text-white hover:brightness-110 disabled:opacity-50"
           >
             {isLaunching ? 'Launching\u2026' : targets.length > 0 ? `Launch ${targets.length} Sessions` : 'Launch'}
           </button>
diff --git a/frontend/src/components/maintenance/BatchStatusCard.tsx b/frontend/src/components/maintenance/BatchStatusCard.tsx
index 30844579..059bf097 100644
--- a/frontend/src/components/maintenance/BatchStatusCard.tsx
+++ b/frontend/src/components/maintenance/BatchStatusCard.tsx
@@ -132,7 +132,7 @@ export function BatchStatusCard({ session, targetLabel, treeId, batchId }: Batch
         {isNotStarted && (
           <button
             onClick={handleStart}
-            className="flex items-center gap-1.5 rounded-lg bg-gradient-brand px-3 py-1.5 text-[0.8125rem] font-medium text-white shadow-xs shadow-primary/20 hover:opacity-90 transition-opacity"
+            className="flex items-center gap-1.5 rounded-lg bg-[#22d3ee] px-3 py-1.5 text-[0.8125rem] font-medium text-white hover:brightness-110 transition-opacity"
           >
             <Play className="h-3.5 w-3.5" />
             Start
diff --git a/frontend/src/components/scripts/ScriptConfigurePane.tsx b/frontend/src/components/scripts/ScriptConfigurePane.tsx
index 5be4271c..d82fbc21 100644
--- a/frontend/src/components/scripts/ScriptConfigurePane.tsx
+++ b/frontend/src/components/scripts/ScriptConfigurePane.tsx
@@ -54,7 +54,7 @@ export function ScriptConfigurePane({ canGenerate, onBack }: Props) {
   // Loading state
   if (isLoadingDetail) {
     return (
-      <div className="glass-card-static h-full flex flex-col p-4 overflow-y-auto">
+      <div className="card-flat h-full flex flex-col p-4 overflow-y-auto">
         <button
           type="button"
           onClick={onBack}
@@ -73,7 +73,7 @@ export function ScriptConfigurePane({ canGenerate, onBack }: Props) {
   // First-selection failure state
   if (!selectedTemplate) {
     return (
-      <div className="glass-card-static h-full flex flex-col p-4 overflow-y-auto">
+      <div className="card-flat h-full flex flex-col p-4 overflow-y-auto">
         <button
           type="button"
           onClick={onBack}
@@ -95,7 +95,7 @@ export function ScriptConfigurePane({ canGenerate, onBack }: Props) {
   const extraTagCount = selectedTemplate.tags.length - 3
 
   return (
-    <div className="glass-card-static h-full flex flex-col p-4 overflow-y-auto">
+    <div className="card-flat h-full flex flex-col p-4 overflow-y-auto">
       {/* Back button */}
       <button
         type="button"
@@ -171,7 +171,7 @@ export function ScriptConfigurePane({ canGenerate, onBack }: Props) {
             type="button"
             onClick={() => generate()}
             disabled={isGenerating || !canGenerate}
-            className="w-full flex items-center justify-center gap-1.5 bg-gradient-brand text-[#101114] font-semibold text-sm px-4 py-2 rounded-[10px] hover:opacity-90 active:scale-[0.97] transition-all shadow-lg shadow-primary/20 disabled:opacity-50 disabled:cursor-not-allowed disabled:active:scale-100"
+            className="w-full flex items-center justify-center gap-1.5 bg-[#22d3ee] text-white font-semibold text-sm px-4 py-2 rounded-lg hover:brightness-110 active:scale-[0.98] transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:active:scale-100"
           >
             {isGenerating && <Loader2 size={14} className="animate-spin" />}
             Generate Script
diff --git a/frontend/src/components/session/SessionFilters.tsx b/frontend/src/components/session/SessionFilters.tsx
index fa7ee79a..944fc1ad 100644
--- a/frontend/src/components/session/SessionFilters.tsx
+++ b/frontend/src/components/session/SessionFilters.tsx
@@ -227,7 +227,7 @@ export function SessionFilters({ filters, onChange, onClear, trees }: SessionFil
                     setShowDatePicker(false)
                   }}
                   className={cn(
-                    'flex-1 rounded-md bg-gradient-brand px-3 py-1.5 text-sm font-medium text-white shadow-lg shadow-primary/20',
+                    'flex-1 rounded-md bg-[#22d3ee] px-3 py-1.5 text-sm font-medium text-white',
                     'hover:brightness-110'
                   )}
                 >
diff --git a/frontend/src/components/settings/BrandingSettings.tsx b/frontend/src/components/settings/BrandingSettings.tsx
index fd92dca0..47b1dcec 100644
--- a/frontend/src/components/settings/BrandingSettings.tsx
+++ b/frontend/src/components/settings/BrandingSettings.tsx
@@ -112,7 +112,7 @@ export function BrandingSettings({ teamId }: BrandingSettingsProps) {
 
   if (isLoading) {
     return (
-      <div className="glass-card-static p-4 sm:p-6">
+      <div className="card-flat p-4 sm:p-6">
         <div className="flex items-center gap-2">
           <Palette className="h-5 w-5 text-muted-foreground" />
           <h2 className="text-lg font-semibold text-foreground">Branding</h2>
@@ -127,7 +127,7 @@ export function BrandingSettings({ teamId }: BrandingSettingsProps) {
   const hasChanges = companyName !== (branding?.company_display_name || '') || logoFile !== null
 
   return (
-    <div className="glass-card-static p-4 sm:p-6">
+    <div className="card-flat p-4 sm:p-6">
       <div className="flex items-center gap-2">
         <Palette className="h-5 w-5 text-muted-foreground" />
         <h2 className="text-lg font-semibold text-foreground">Branding</h2>