diff --git a/src/App.tsx b/src/App.tsx
index 80766187..9698bda3 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -50,7 +50,6 @@ import { UpdateBanner } from './components/UpdateBanner'
 import { FlatVaultMigrationBanner } from './components/FlatVaultMigrationBanner'
 import { useFlatVaultMigration } from './hooks/useFlatVaultMigration'
 import { invoke } from '@tauri-apps/api/core'
-import { invoke } from '@tauri-apps/api/core'
 import { isTauri, mockInvoke } from './mock-tauri'
 import type { SidebarSelection, InboxPeriod } from './types'
 import type { NoteListItem } from './utils/ai-context'
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 5f205399..7880ecdb 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -290,10 +290,10 @@ export const Sidebar = memo(function Sidebar({
       <nav className="flex-1 overflow-y-auto">
         {/* Top nav */}
         <div className="border-b border-border" data-testid="sidebar-top-nav" style={{ padding: '4px 6px' }}>
-          <NavItem icon={Tray} label="Inbox" count={inboxCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'inbox' })} badgeClassName="text-muted-foreground" badgeStyle={{ background: 'var(--muted)' }} onClick={() => onSelect({ kind: 'filter', filter: 'inbox' })} />
-          <NavItem icon={FileText} label="All Notes" count={activeCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'all' })} badgeClassName="bg-primary text-primary-foreground" onClick={() => onSelect({ kind: 'filter', filter: 'all' })} />
-          <NavItem icon={Archive} label="Archive" count={archivedCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'archived' })} badgeClassName="text-muted-foreground" badgeStyle={{ background: 'var(--muted)' }} onClick={() => onSelect({ kind: 'filter', filter: 'archived' })} />
-          <NavItem icon={Trash} label="Trash" count={trashedCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'trash' })} activeClassName="bg-destructive/10 text-destructive" badgeClassName="text-muted-foreground" badgeStyle={{ background: 'var(--muted)' }} onClick={() => onSelect({ kind: 'filter', filter: 'trash' })} />
+          <NavItem icon={Tray} label="Inbox" count={inboxCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'inbox' })} badgeClassName="text-muted-foreground" badgeStyle={{ background: 'var(--muted)' }} activeBadgeClassName="bg-primary text-primary-foreground" onClick={() => onSelect({ kind: 'filter', filter: 'inbox' })} />
+          <NavItem icon={FileText} label="All Notes" count={activeCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'all' })} badgeClassName="text-muted-foreground" badgeStyle={{ background: 'var(--muted)' }} activeBadgeClassName="bg-primary text-primary-foreground" onClick={() => onSelect({ kind: 'filter', filter: 'all' })} />
+          <NavItem icon={Archive} label="Archive" count={archivedCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'archived' })} badgeClassName="text-muted-foreground" badgeStyle={{ background: 'var(--muted)' }} activeBadgeClassName="bg-primary text-primary-foreground" onClick={() => onSelect({ kind: 'filter', filter: 'archived' })} />
+          <NavItem icon={Trash} label="Trash" count={trashedCount} isActive={isSelectionActive(selection, { kind: 'filter', filter: 'trash' })} activeClassName="bg-destructive/10 text-destructive" badgeClassName="text-muted-foreground" badgeStyle={{ background: 'var(--muted)' }} activeBadgeClassName="bg-destructive text-destructive-foreground" onClick={() => onSelect({ kind: 'filter', filter: 'trash' })} />
         </div>
 
         {/* Sections header + visibility popover */}
diff --git a/src/components/SidebarParts.tsx b/src/components/SidebarParts.tsx
index e5a42349..16484daf 100644
--- a/src/components/SidebarParts.tsx
+++ b/src/components/SidebarParts.tsx
@@ -27,7 +27,7 @@ export function isSelectionActive(current: SidebarSelection, check: SidebarSelec
 
 // --- NavItem ---
 
-export function NavItem({ icon: Icon, label, count, isActive, activeClassName = 'bg-primary/10 text-primary', badgeClassName, badgeStyle, onClick, disabled, disabledTooltip, compact }: {
+export function NavItem({ icon: Icon, label, count, isActive, activeClassName = 'bg-primary/10 text-primary', badgeClassName, badgeStyle, activeBadgeClassName, activeBadgeStyle, onClick, disabled, disabledTooltip, compact }: {
   icon: ComponentType<IconProps>
   label: string
   count?: number
@@ -35,6 +35,8 @@ export function NavItem({ icon: Icon, label, count, isActive, activeClassName =
   activeClassName?: string
   badgeClassName?: string
   badgeStyle?: React.CSSProperties
+  activeBadgeClassName?: string
+  activeBadgeStyle?: React.CSSProperties
   onClick?: () => void
   disabled?: boolean
   disabledTooltip?: string
@@ -43,6 +45,8 @@ export function NavItem({ icon: Icon, label, count, isActive, activeClassName =
   const iconSize = compact ? 14 : 16
   const textClass = compact ? 'text-[12px]' : 'text-[13px]'
   const padding = compact ? '4px 16px' : '6px 16px'
+  const resolvedBadgeClass = isActive && activeBadgeClassName ? activeBadgeClassName : badgeClassName
+  const resolvedBadgeStyle = isActive && activeBadgeStyle ? activeBadgeStyle : badgeStyle
 
   if (disabled) {
     return (
@@ -58,10 +62,10 @@ export function NavItem({ icon: Icon, label, count, isActive, activeClassName =
       style={{ padding, borderRadius: 4 }}
       onClick={onClick}
     >
-      <Icon size={iconSize} />
+      <Icon size={iconSize} weight={isActive ? 'fill' : 'regular'} />
       <span className={cn("flex-1 font-medium", textClass)}>{label}</span>
       {count !== undefined && count > 0 && (
-        <span className={cn("flex items-center justify-center", badgeClassName)} style={{ height: compact ? 18 : 20, borderRadius: 9999, padding: '0 6px', fontSize: 10, ...badgeStyle }}>
+        <span className={cn("flex items-center justify-center", resolvedBadgeClass)} style={{ height: compact ? 18 : 20, borderRadius: 9999, padding: '0 6px', fontSize: 10, ...resolvedBadgeStyle }}>
           {count}
         </span>
       )}