From b6bcc4100ec626dd8a4a58578031b4121fce762f Mon Sep 17 00:00:00 2001
From: Johnny shultz <John.Shultz@safelite.com>
Date: Wed, 10 Sep 2025 14:36:46 -0400
Subject: [PATCH] CASH-1365

CASH-1365 made global change to make header sticky like heritage
---
 .../funnel-header/funnel-header.vue           | 21 +++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/fmg-components/funnel-header/funnel-header.vue b/src/fmg-components/funnel-header/funnel-header.vue
index f4ece2932..6f42172ab 100644
--- a/src/fmg-components/funnel-header/funnel-header.vue
+++ b/src/fmg-components/funnel-header/funnel-header.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="funnel-header" v-if="imageSrc">
+    <div class="funnel-header" :class="{ scrolled: isScrolled }" v-if="imageSrc">
         <div class="d-flex w-100">
             <progress-bar :page="$route.name" />
         </div>
@@ -61,6 +61,7 @@ export default {
             sierraChatOpen: false,
             salesforceChatOpen: false,
             isSalesforceTransferInProgress: false,
+            isScrolled: false,
         };
     },
     props: {
@@ -185,6 +186,12 @@ export default {
             }
         };
         window.addEventListener("salesforce-chat-visibility", this._handleSalesforceChatOpened);
+
+        // Add scroll listener for header shadow effect
+        this._handleScroll = () => {
+            this.isScrolled = window.scrollY > 0;
+        };
+        window.addEventListener("scroll", this._handleScroll);
     },
     beforeUnmount() {
         window.removeEventListener("sierra-chat-closed", this._handleSierraChatClosed);
@@ -195,6 +202,7 @@ export default {
         );
         window.removeEventListener("sierra-chat-transfer", this._handleSierraToSalesforceTransfer);
         window.removeEventListener("salesforce-chat-visibility", this._handleSalesforceChatOpened);
+        window.removeEventListener("scroll", this._handleScroll);
     },
 };
 </script>
@@ -209,9 +217,18 @@ export default {
             padding: 2rem 0.75rem;
         }
     }
-    position: relative;
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+    background-color: white;
+    box-shadow: none;
+    transition: box-shadow 0.3s ease-in-out;
     padding: 0;
 
+    &.scrolled {
+        box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
+    }
+
     .button-container {
         &.webchat {
             margin-right: 0.875rem;