[Security Solution ] Fixes Timeline Unsaved changes badge color as …

…per EUI recs (#207351)

## Summary

Handles
-  #205733

||Before|After|
|---|---|---|
|Light theme| <video
src="https://github.com/user-attachments/assets/b8b89b2f-3c4f-40c1-b5b9-88a1044208cf"
/>| <video
src="https://github.com/user-attachments/assets/33495309-c672-47c1-9f0d-e26892b62ef6"
/>|
| Borealis Timeline Minimized |
![image](https://github.com/user-attachments/assets/e07d0672-95ad-4e98-9695-c33064f5cc7d)|
![image](https://github.com/user-attachments/assets/98dfc8d4-27e0-4e6a-82c0-117117c820d4)
|
| Borealis Timeline Maximized ( remains unchanged ) |
![image](https://github.com/user-attachments/assets/0e685d86-30d5-4fa0-8ed9-87ce98bac8a7)
|
![image](https://github.com/user-attachments/assets/978a9269-9180-4f92-96e9-257d0ae475e9)
|

x-pack/solutions/security/plugins/security_solution/public/timelines/components/save_status/index.tsx

@@ -43,17 +43,23 @@ export const TimelineSaveStatus = React.memo<TimelineSaveStatusProps>(({ timelin
     changed = false,
     status,
     updated,
+    show,
   } = useDeepEqualSelector((state) =>
-    pick(['changed', 'status', 'updated'], getTimeline(state, timelineId) ?? timelineDefaults)
+    pick(
+      ['changed', 'status', 'updated', 'show'],
+      getTimeline(state, timelineId) ?? timelineDefaults
+    )
   );
 
   const isDraft = status === TimelineStatusEnum.draft;
 
+  const badgeColor = useMemo(() => (show ? 'warning' : 'default'), [show]);
+
   let statusContent: React.ReactNode;
   if (isDraft || !updated) {
-    statusContent = <EuiBadge color="warning">{UNSAVED}</EuiBadge>;
+    statusContent = <EuiBadge color={badgeColor}>{UNSAVED}</EuiBadge>;
   } else if (changed) {
-    statusContent = <EuiBadge color="warning">{UNSAVED_CHANGES}</EuiBadge>;
+    statusContent = <EuiBadge color={badgeColor}>{UNSAVED_CHANGES}</EuiBadge>;
   }
 
   if (!statusContent) return null;