From b0d8b664da4b42b2ea07b913bda4062904605a34 Mon Sep 17 00:00:00 2001
From: Mohan K <mohan.k@cavininfotech.com>
Date: Tue, 28 Jul 2026 14:07:04 +0530
Subject: [PATCH] Fix sticky header overlap by using correct bg variable

---
 ui/src/components/EventTimeline.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/src/components/EventTimeline.jsx b/ui/src/components/EventTimeline.jsx
index 0a5d96b..4bab4dd 100644
--- a/ui/src/components/EventTimeline.jsx
+++ b/ui/src/components/EventTimeline.jsx
@@ -57,7 +57,7 @@ export default function EventTimeline() {
 
   const renderTimeline = (zone, zoneEvents) => (
     <div className="glass-panel" style={{ flex: 1, overflowY: 'auto', maxHeight: '70vh' }}>
-      <h2 style={{ position: 'sticky', top: 0, background: 'var(--bg)', paddingBottom: '1rem', borderBottom: '1px solid rgba(255,255,255,0.1)', zIndex: 10 }}>
+      <h2 style={{ position: 'sticky', top: 0, background: 'var(--bg-color)', paddingBottom: '1rem', paddingTop: '1rem', marginTop: '-1rem', borderBottom: '1px solid rgba(255,255,255,0.1)', zIndex: 10 }}>
         {zone} Timeline
       </h2>
       <div style={{ marginTop: '1rem' }}>