Update app.py

app.py

@@ -9,23 +9,28 @@ st.set_page_config(
     layout="wide" # Optional: Use wide layout
 )
 
-# --- Custom CSS for Sticky Default Header (with !important) ---
+# --- Custom CSS to Fix Parent Overflow and Make Header Sticky ---
 st.markdown("""
 <style>
+    /* Target the main app container and ensure its overflow is visible */
+    /* This is crucial for sticky positioning of elements inside it relative to the viewport */
+    [data-testid="stApp"] {
+        overflow: visible !important; /* Force overflow to be visible */
+    }
+
     /* Target the default Streamlit header element */
     /* This is typically the <header> tag containing the title, menu, and status */
     header {
         position: sticky !important; /* Force sticky positioning */
         top: 0px !important;         /* Force sticking to the top edge */
         z-index: 999 !important;     /* Force a high z-index */
-        background-color: rgb(255, 255, 255) !important; /* Force background color */
-        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Add shadow (usually doesn't need !important) */
-        /* Ensure no conflicting height/overflow properties */
+        background-color: rgb(255, 255, 255) !important; /* Force background color (white or match Streamlit's default) */
+        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Add shadow */
         height: auto !important; /* Force height to adjust */
-        overflow: visible !important; /* Force overflow visible */
+        /* overflow: visible !important; /* This might also be needed on the header itself */
     }
 
-    /* Add padding to the main content area to prevent it from starting behind the fixed header */
+    /* Add padding to the main content area to prevent it from starting behind the sticky header */
     /* This targets the main container div where your app content and pages are rendered */
     /* Adjust this value based on the header's actual height after inspecting the deployed app */
     [data-testid="stAppViewContainer"] {
@@ -42,14 +47,6 @@ st.markdown("""
         padding-top: 1rem; /* Keep or adjust default Streamlit content padding */
     }
 
-    /* Ignore the data-testid="stMain" observation for the header stickiness,
-       as stMain is typically the main content area, not the header bar with status.
-       The sticky CSS should target the <header> tag.
-       If you confirmed the element you want sticky is truly not the <header> tag,
-       then the CSS selector above needs to be changed to target that specific element
-       and its parents examined for overflow/transform issues.
-    */
-
 </style>
 """, unsafe_allow_html=True)