Changes

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

src/components/app-shell.tsx

@@ -8,7 +8,6 @@ import {
   Receipt,
   ShieldCheck,
   LogOut,
-  Scale,
   LayoutDashboard,
   Calendar as CalendarIcon,
   CheckSquare,
@@ -30,6 +29,7 @@ import { HeaderTimer } from "@/components/timer/header-timer";
 import { QuickAddTime, QuickAddExpense } from "@/components/quick-add/quick-add";
 import { DateCalculator } from "@/components/date-calculator";
 import { NotificationBell } from "@/components/notifications/notification-bell";
+import { JusticeIcon } from "@/components/justice-icon";
 
 interface NavItem {
   to: string;
@@ -77,8 +77,8 @@ export function AppShell({ children }: { children: ReactNode }) {
       {/* Sidebar */}
       <aside className="hidden md:flex w-64 flex-col bg-sidebar text-sidebar-foreground border-r border-sidebar-border">
         <div className="px-6 py-5 border-b border-sidebar-border flex items-center gap-2.5">
-          <div className="h-9 w-9 rounded-md bg-sidebar-primary flex items-center justify-center">
-            <Scale className="h-5 w-5 text-sidebar-primary-foreground" />
+          <div className="h-9 w-9 rounded-md bg-sidebar-primary flex items-center justify-center p-1">
+            <JusticeIcon className="h-full w-full" invert />
           </div>
           <div className="leading-tight">
             <div className="font-serif text-lg">Stage Law Firm, PLLC</div>
@@ -128,7 +128,7 @@ export function AppShell({ children }: { children: ReactNode }) {
       {/* 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" />
+          <JusticeIcon className="h-5 w-5" invert />
           <span className="font-serif text-lg">Counsel</span>
         </Link>
         <Button variant="ghost" size="sm" onClick={handleSignOut} className="text-sidebar-foreground">

src/components/justice-icon.tsx

@@ -0,0 +1,19 @@
+import justiceImg from "@/assets/justice-icon.png";
+import { cn } from "@/lib/utils";
+
+interface JusticeIconProps {
+  className?: string;
+  /** When true, inverts the image to render white (for dark backgrounds). */
+  invert?: boolean;
+  alt?: string;
+}
+
+export function JusticeIcon({ className, invert = false, alt = "Lady Justice" }: JusticeIconProps) {
+  return (
+    <img
+      src={justiceImg}
+      alt={alt}
+      className={cn("object-contain", invert && "invert", className)}
+    />
+  );
+}