From 37c443fe6aeea835cf1415186ee4f9e844675dd9 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Fri, 17 Apr 2026 00:33:45 +0000
Subject: [PATCH] Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>
---
 src/components/app-shell.tsx | 22 +++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/components/app-shell.tsx b/src/components/app-shell.tsx
index d119f0c..b21433e 100644
--- a/src/components/app-shell.tsx
+++ b/src/components/app-shell.tsx
@@ -1,6 +1,7 @@
 import { Link, useLocation, useNavigate } from "@tanstack/react-router";
 import { useAuth } from "@/lib/auth";
 import { Button } from "@/components/ui/button";
+import { HeaderTimer } from "@/components/timer/header-timer";
 import {
   Briefcase,
   Users,
@@ -98,17 +99,24 @@ export function AppShell({ children }: { children: ReactNode }) {
       </aside>
 
       {/* Mobile top bar */}
-      <div className="md:hidden fixed top-0 inset-x-0 h-14 bg-sidebar text-sidebar-foreground border-b border-sidebar-border flex items-center justify-between px-4 z-30">
-        <Link to="/" className="flex items-center gap-2">
-          <Scale className="h-5 w-5" />
-          <span className="font-serif text-lg">Counsel</span>
+      <div className="md:hidden fixed top-0 inset-x-0 h-14 bg-sidebar text-sidebar-foreground border-b border-sidebar-border flex items-center justify-between px-4 z-30 gap-2">
+        <Link to="/" className="flex items-center gap-2 min-w-0">
+          <Scale className="h-5 w-5 shrink-0" />
+          <span className="font-serif text-lg truncate">Counsel</span>
         </Link>
-        <Button variant="ghost" size="sm" onClick={handleSignOut} className="text-sidebar-foreground">
-          <LogOut className="h-4 w-4" />
-        </Button>
+        <div className="flex items-center gap-2">
+          <HeaderTimer />
+          <Button variant="ghost" size="sm" onClick={handleSignOut} className="text-sidebar-foreground">
+            <LogOut className="h-4 w-4" />
+          </Button>
+        </div>
       </div>
 
       <main className="flex-1 min-w-0 md:ml-0 mt-14 md:mt-0">
+        {/* Desktop top bar with timer */}
+        <div className="hidden md:flex h-14 items-center justify-end gap-3 px-6 border-b bg-card">
+          <HeaderTimer />
+        </div>
         <div className="md:hidden flex overflow-x-auto gap-1 px-3 py-2 border-b bg-card">
           {NAV.filter((n) => !n.adminOnly || isAdmin).map((item) => {
             const active =