Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>

src/components/protected-layout.tsx

@@ -2,6 +2,7 @@ import { useEffect, type ReactNode } from "react";
 import { useNavigate } from "@tanstack/react-router";
 import { useAuth } from "@/lib/auth";
 import { AppShell } from "@/components/app-shell";
+import { TimerWidget } from "@/components/timer/timer-widget";
 import { Loader2 } from "lucide-react";
 
 export function ProtectedLayout({ children, adminOnly }: { children: ReactNode; adminOnly?: boolean }) {
@@ -25,5 +26,10 @@ export function ProtectedLayout({ children, adminOnly }: { children: ReactNode;
     );
   }
 
-  return <AppShell>{children}</AppShell>;
+  return (
+    <AppShell>
+      {children}
+      <TimerWidget />
+    </AppShell>
+  );
 }

src/components/timer/timer-widget.tsx

@@ -96,7 +96,7 @@ export function TimerWidget() {
             )}
           </div>
           {!active.caseId && (
-            <div className="mt-1 text-[10px] text-amber-600 dark:text-amber-400">Attach to a case to save as time entry.</div>
+            <div className="mt-1 text-[10px] text-destructive">Attach to a case to save as a time entry.</div>
           )}
         </div>
         <div className="flex gap-2 px-3 pb-3">