Style notification list items by read/unread status

Unread notifications (isNew=true) now show a secondaryContainer background,
bold title, and primary-colored icon per Material 3 guidelines. State changes
via mark-as-read/unread update the item's styling immediately in the All filter
view using mapItems with a copyWith, ensuring PagingStateBase's deep equality
check detects the change and triggers a rebuild.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/lib/model/notification.dart

@@ -27,6 +27,15 @@ class Notification {
       body = json['body'] as String,
       isNew = json['is_new'] as bool;
 
+  Notification copyWith({bool? isNew}) => Notification(
+    id: id,
+    title: title,
+    body: body,
+    notificationType: notificationType,
+    createdOn: createdOn,
+    isNew: isNew ?? this.isNew,
+  );
+
   Map<String, dynamic> toJson() => {
     'id': id,
     'created_on': createdOn.toUtc().toIso8601String(),

frontend/lib/notifications/notification_list.dart

@@ -60,6 +60,9 @@ class _NotificationListState extends State<NotificationList> {
       );
       return true;
     }
+    _pagingController.mapItems(
+      (n) => n.id == item.id ? n.copyWith(isNew: false) : n,
+    );
     return false;
   }
 
@@ -91,6 +94,9 @@ class _NotificationListState extends State<NotificationList> {
       );
       return true;
     }
+    _pagingController.mapItems(
+      (n) => n.id == item.id ? n.copyWith(isNew: true) : n,
+    );
     return false;
   }
 
@@ -170,9 +176,24 @@ class _NotificationListState extends State<NotificationList> {
                               child: Icon(Icons.done),
                             ),
                             child: ListTile(
-                              leading: Icon(item.notificationType.icon),
+                              tileColor: item.isNew
+                                  ? Theme.of(
+                                      context,
+                                    ).colorScheme.secondaryContainer
+                                  : null,
+                              leading: Icon(
+                                item.notificationType.icon,
+                                color: item.isNew
+                                    ? Theme.of(context).colorScheme.primary
+                                    : null,
+                              ),
                               title: Text(
                                 '${FriendlyDateFormatter().format(item.createdOn)} - ${item.title}',
+                                style: item.isNew
+                                    ? const TextStyle(
+                                        fontWeight: FontWeight.bold,
+                                      )
+                                    : null,
                               ),
                               subtitle: Text(item.body, maxLines: 5),
                               trailing: PopupMenuButton<String>(