@cleartrip/ct-design-header 1.2.0-SNAPSHOT-rnwStable4Dec25v3.0 → 1.2.0-SNAPSHOT-041225.0

package/dist/ct-design-header.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('react'), require('@cleartrip/ct-design-container'), require('@cleartrip/ct-design-typography'), require('@cleartrip/ct-design-button'), require('@cleartrip/ct-design-divider'), require('@cleartrip/ct-design-icons'), require('@emotion/styled'), require('@emotion/react')) :
-    typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', 'react', '@cleartrip/ct-design-container', '@cleartrip/ct-design-typography', '@cleartrip/ct-design-button', '@cleartrip/ct-design-divider', '@cleartrip/ct-design-icons', '@emotion/styled', '@emotion/react'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.CTDesignSystemHeader = {}, global.jsxRuntime, global.React, global.ctDesignContainer, global.ctDesignTypography, global.ctDesignButton, global.ctDesignDivider, global.ctDesignIcons, global.styled, global.react$1));
-})(this, (function (exports, jsxRuntime, react, ctDesignContainer, ctDesignTypography, ctDesignButton, ctDesignDivider, ctDesignIcons, styled, react$1) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('react'), require('@cleartrip/ct-design-container'), require('@cleartrip/ct-design-typography'), require('@cleartrip/ct-design-button'), require('@cleartrip/ct-design-divider'), require('@cleartrip/ct-design-icons'), require('styled-components')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', 'react', '@cleartrip/ct-design-container', '@cleartrip/ct-design-typography', '@cleartrip/ct-design-button', '@cleartrip/ct-design-divider', '@cleartrip/ct-design-icons', 'styled-components'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.CTDesignSystemHeader = {}, global.jsxRuntime, global.React, global.ctDesignContainer, global.ctDesignTypography, global.ctDesignButton, global.ctDesignDivider, global.ctDesignIcons, global.styled));
+})(this, (function (exports, jsxRuntime, react, ctDesignContainer, ctDesignTypography, ctDesignButton, ctDesignDivider, ctDesignIcons, styled) { 'use strict';
 
     function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -61,531 +61,713 @@
     var OFFERS_URL = 'all-offers/?categories=flights';
     var MY_TRIPS_URL = '/account/trips';
     var SUPPORT_URL = '/support';
-    var NAVBAR_OPTIONS = [
-        {
-            lefticon: ctDesignIcons.Offers,
-            text: 'Offers',
-            ravenActionName: 'offers',
-            isHoverable: false,
-            isClickable: true,
-            link: OFFERS_URL,
-        },
-        {
-            lefticon: ctDesignIcons.BusinessBag,
-            text: 'Business',
-            ravenActionName: 'business',
-            rightIcon: ctDesignIcons.ChevronDown,
-            isHoverable: true,
-        },
-        {
-            lefticon: ctDesignIcons.MyTrips,
-            text: 'My Trips',
-            ravenActionName: 'mytrips',
-            isHoverable: false,
-            isClickable: true,
-            link: MY_TRIPS_URL,
-        },
-        {
-            lefticon: ctDesignIcons.SupportIcon,
-            text: 'Support',
-            ravenActionName: 'support',
-            isHoverable: false,
-            isClickable: true,
-            link: SUPPORT_URL,
-        },
-    ];
+    var NAVBAR_OPTIONS = [{
+      lefticon: ctDesignIcons.Offers,
+      text: 'Offers',
+      ravenActionName: 'offers',
+      isHoverable: false,
+      isClickable: true,
+      link: OFFERS_URL
+    }, {
+      lefticon: ctDesignIcons.BusinessBag,
+      text: 'Business',
+      ravenActionName: 'business',
+      rightIcon: ctDesignIcons.ChevronDown,
+      isHoverable: true
+    }, {
+      lefticon: ctDesignIcons.MyTrips,
+      text: 'My Trips',
+      ravenActionName: 'mytrips',
+      isHoverable: false,
+      isClickable: true,
+      link: MY_TRIPS_URL
+    }, {
+      lefticon: ctDesignIcons.SupportIcon,
+      text: 'Support',
+      ravenActionName: 'support',
+      isHoverable: false,
+      isClickable: true,
+      link: SUPPORT_URL
+    }];
     var LOBS = {
-        FLIGHTS: 'Flights',
-        HOTELS: 'Hotels',
-        TRAIN: 'Trains',
-        PACKAGES: 'Packages',
-        BUSES: 'Buses',
+      FLIGHTS: 'Flights',
+      HOTELS: 'Hotels',
+      TRAIN: 'Trains',
+      HOLIDAYS: 'Holidays',
+      BUSES: 'Buses'
     };
-    var LOB_DATA = [
-        {
-            title: LOBS.FLIGHTS,
-            image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Flights.png?cache=true',
-            link: '/flights',
-        },
-        {
-            title: LOBS.HOTELS,
-            image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Hotels.png?cache=true',
-            link: '/hotels',
-        },
-        {
-            title: LOBS.BUSES,
-            image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Buses.png?cache=true',
-            link: '/bus',
-        },
-        {
-            title: LOBS.PACKAGES,
-            image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Packages.png?cache=true',
-            link: '/holidays',
-        },
-    ];
-    var bdConfig = [
-        {
-            title: 'AgentBox',
-            subtitle: 'For travel agents',
-            details: 'One-stop travel solution offering the best deals to our travel agency partners',
-            link: 'https://agency.cleartrip.com',
-        },
-        {
-            title: 'OutOfOffice',
-            subtitle: 'For startups, corporates and SMEs',
-            details: 'Manage corporate business travel, smartly',
-            link: 'https://ooo.cleartrip.com/',
-            ravenActionName: 'ooo',
-        },
-        {
-            title: 'MICE',
-            subtitle: 'For corporate events',
-            details: 'An end-to-end management solution for all your corporate events',
-            link: 'https://business.cleartrip.com/',
-        },
-        {
-            title: 'API',
-            subtitle: 'For developers',
-            details: 'Unlock seamless integration and scale with our powerful, reliable APIs',
-            link: 'https://business.cleartrip.com/api-customers/more-details',
-        },
-    ];
+    var LOB_DATA = [{
+      title: LOBS.FLIGHTS,
+      image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Flights.png?cache=true',
+      link: '/flights'
+    }, {
+      title: LOBS.HOTELS,
+      image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Hotels.png?cache=true',
+      link: '/hotels'
+    }, {
+      title: LOBS.BUSES,
+      image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Buses.png?cache=true',
+      link: '/bus'
+    }, {
+      title: LOBS.HOLIDAYS,
+      image: 'https://rukmini-ct.flixcart.com/f_auto,w_32,h_32,dpr_4/offermgmt-prod/offermgmt/images/banner/Navbar_Packages.png?cache=true',
+      link: '/holidays'
+    }];
+    var bdConfig = [{
+      title: 'AgentBox',
+      subtitle: 'For travel agents',
+      details: 'One-stop travel solution offering the best deals to our travel agency partners',
+      link: 'https://agency.cleartrip.com'
+    }, {
+      title: 'OutOfOffice',
+      subtitle: 'For startups, corporates and SMEs',
+      details: 'Manage corporate business travel, smartly',
+      link: 'https://ooo.cleartrip.com/',
+      ravenActionName: 'ooo'
+    }, {
+      title: 'MICE',
+      subtitle: 'For corporate events',
+      details: 'An end-to-end management solution for all your corporate events',
+      link: 'https://business.cleartrip.com/'
+    }, {
+      title: 'API',
+      subtitle: 'For developers',
+      details: 'Unlock seamless integration and scale with our powerful, reliable APIs',
+      link: 'https://business.cleartrip.com/api-customers/more-details'
+    }];
     var BUSINESS_DROPDOWN_HEADING = 'Other business services';
     exports.RAVEN_PAGE_NAMES = void 0;
     (function (RAVEN_PAGE_NAMES) {
-        RAVEN_PAGE_NAMES["UNIFIED_HOME"] = "unified_homepage";
-        RAVEN_PAGE_NAMES["HOTELS_HOME"] = "hotel_home";
-        RAVEN_PAGE_NAMES["FLIGHTS_HOME"] = "flights_home";
+      RAVEN_PAGE_NAMES["UNIFIED_HOME"] = "unified_homepage";
+      RAVEN_PAGE_NAMES["HOTELS_HOME"] = "hotel_home";
+      RAVEN_PAGE_NAMES["FLIGHTS_HOME"] = "flights_home";
     })(exports.RAVEN_PAGE_NAMES || (exports.RAVEN_PAGE_NAMES = {}));
     var RAVEN_PLATFORMS;
     (function (RAVEN_PLATFORMS) {
-        RAVEN_PLATFORMS["DESKTOP"] = "desktop";
+      RAVEN_PLATFORMS["DESKTOP"] = "desktop";
     })(RAVEN_PLATFORMS || (RAVEN_PLATFORMS = {}));
     var LOG_IN_TEXT = 'Log in';
     var THEME_CONFIG = {
-        NOVAC: {
-            headerBackground: 'transparent',
-            hoverColor: '#FDBA12',
-            logoFill: '#FFF',
-            fkcompanyColor: '#FFF',
-            typographyColor: '#FFF',
-            loginButtonColorVariant: ctDesignButton.ButtonColor.NEUTRAL,
-        },
-        DEFAULT: {
-            headerBackground: '#FFFFFF',
-            hoverColor: '#FF4F17',
-            logoFill: '#FF4F17',
-            fkcompanyColor: '#1A1A1A',
-            typographyColor: '#1A1A1A',
-            loginButtonColorVariant: ctDesignButton.ButtonColor.PRIMARY,
-        },
+      NOVAC: {
+        headerBackground: 'transparent',
+        hoverColor: '#FDBA12',
+        logoFill: '#FFF',
+        fkcompanyColor: '#FFF',
+        typographyColor: '#FFF',
+        loginButtonColorVariant: ctDesignButton.ButtonColor.NEUTRAL
+      },
+      DEFAULT: {
+        headerBackground: '#FFFFFF',
+        hoverColor: '#FF4F17',
+        logoFill: '#FF4F17',
+        fkcompanyColor: '#1A1A1A',
+        typographyColor: '#1A1A1A',
+        loginButtonColorVariant: ctDesignButton.ButtonColor.PRIMARY
+      }
     };
 
     var HeaderContext = react.createContext(undefined);
     var useHeaderContext = function () {
-        var context = react.useContext(HeaderContext);
-        if (!context) {
-            throw new Error('useHeaderContext must be used within a HeaderProvider');
-        }
-        return context;
+      var context = react.useContext(HeaderContext);
+      if (!context) {
+        throw new Error('useHeaderContext must be used within a HeaderProvider');
+      }
+      return context;
     };
     var HeaderProvider = function (_a) {
-        var value = _a.value, children = _a.children;
-        return jsxRuntime.jsx(HeaderContext.Provider, __assign({ value: value }, { children: children }));
+      var value = _a.value,
+        children = _a.children;
+      return jsxRuntime.jsx(HeaderContext.Provider, __assign({
+        value: value
+      }, {
+        children: children
+      }));
+    };
+
+    var stringifyPayload = function (payload) {
+      var keys = Object.keys(payload);
+      var numericValues = [];
+      keys.forEach(function (key) {
+        if (numericValues.includes(key)) {
+          payload[key] = Number(payload[key]);
+        } else {
+          payload[key] = '' + payload[key];
+        }
+      });
+      return payload;
+    };
+    var isServer = function () {
+      return typeof window === 'undefined' || !window;
+    };
+    var getQueryParam = function (queryParam) {
+      if (isServer()) {
+        return '';
+      }
+      var urlParams = new URLSearchParams(window.location.search);
+      return urlParams.get(queryParam);
+    };
+    var ravenLoyaltyTypes = function (loyaltyType) {
+      switch (loyaltyType) {
+        case 'FkVip':
+          return 'fk_vip';
+        case 'FkPremium':
+          return 'fk_plus_premium';
+        case 'InsiderIcon':
+          return 'myntra_insidericon';
+        case 'InsiderElite':
+          return 'myntra_insiderelite';
+        default:
+          return '';
+      }
+    };
+    var ravenSDKTrigger = function (isUserLoggedIn, eventName, ravenPayload, customRavenPayload, ravenPushCallback, pageName) {
+      var _a;
+      if (typeof ravenPushCallback !== 'function') {
+        console.error('ravenPushCallback is not provided or is not a function');
+        return;
+      }
+      var commonPayload = {
+        page_name: pageName,
+        platform: RAVEN_PLATFORMS.DESKTOP,
+        login_status: isUserLoggedIn ? 'yes' : 'no',
+        domain: (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.hostname
+      };
+      var newRavenPayload = stringifyPayload(ravenPayload);
+      var parsedCustomRavenPayload = stringifyPayload(customRavenPayload);
+      var finalPayload = __assign(__assign(__assign({}, commonPayload), newRavenPayload), parsedCustomRavenPayload);
+      try {
+        if (ravenPushCallback.length === 1) {
+          ravenPushCallback({
+            eventName: eventName,
+            eventData: finalPayload
+          });
+        } else {
+          ravenPushCallback(eventName, finalPayload);
+        }
+      } catch (err) {
+        console.error(err);
+        return;
+      }
     };
 
     var LobsHeader = function () {
-        var selectedLOB = useHeaderContext().selectedLOB;
-        return (jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '16px', background: '#F7FAFF', top: '64px', zIndex: 2, css: {
-                gap: 24,
-            } }, { children: LOB_DATA.map(function (item, index) {
-                var title = item.title, link = item.link, image = item.image;
-                var isSelected = selectedLOB === title;
-                return (jsxRuntime.jsx("a", __assign({ href: isSelected ? undefined : link, style: { textDecoration: 'none', pointerEvents: isSelected ? 'none' : 'auto' } }, { children: jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', width: '116px', height: '48px', justifyContent: 'center', cursor: 'pointer', css: {
-                            gap: 8,
-                            background: isSelected ? '#FFFFFF' : 'transparent',
-                            border: isSelected ? '1px solid #E6E6E6' : '',
-                            borderRadius: '40px',
-                            padding: '8px 16px 8px 8px',
-                            transition: 'background 0.2s ease',
-                        } }, { children: [jsxRuntime.jsx("img", { src: image, alt: title, width: 32, height: 32 }), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: isSelected ? ctDesignTypography.TypographyVariant.HM3 : ctDesignTypography.TypographyVariant.B1, isClickable: true }, { children: title }))] }), index) })));
-            }) })));
+      var _a = useHeaderContext(),
+        selectedLOB = _a.selectedLOB,
+        isUserLoggedIn = _a.isUserLoggedIn,
+        ravenEventName = _a.ravenEventName,
+        ravenPageName = _a.ravenPageName,
+        _b = _a.ravenPayload,
+        ravenPayload = _b === void 0 ? {} : _b,
+        ravenPushCallback = _a.ravenPushCallback;
+      var handleClick = function (title, isSelected) {
+        if (!isSelected) {
+          var payload = {
+            action_name: "".concat(title.toLowerCase(), "_tab_click"),
+            action_type: 'click'
+          };
+          ravenSDKTrigger(isUserLoggedIn, ravenEventName, payload, ravenPayload, ravenPushCallback, ravenPageName);
+        }
+      };
+      return jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        padding: '16px',
+        background: '#F7FAFF',
+        top: '64px',
+        zIndex: 2,
+        css: {
+          gap: 24
+        }
+      }, {
+        children: LOB_DATA.map(function (item, index) {
+          var title = item.title,
+            link = item.link,
+            image = item.image;
+          var isSelected = selectedLOB === title;
+          return jsxRuntime.jsx("a", __assign({
+            href: isSelected ? undefined : link,
+            style: {
+              textDecoration: 'none',
+              pointerEvents: isSelected ? 'none' : 'auto'
+            },
+            onClick: function () {
+              return handleClick(title, isSelected);
+            }
+          }, {
+            children: jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+              display: 'flex',
+              alignItems: 'center',
+              width: '116px',
+              height: '48px',
+              justifyContent: 'center',
+              cursor: 'pointer',
+              css: {
+                gap: 8,
+                background: isSelected ? '#FFFFFF' : 'transparent',
+                border: isSelected ? '1px solid #E6E6E6' : '',
+                borderRadius: '40px',
+                padding: '8px 16px 8px 8px',
+                transition: 'background 0.2s ease'
+              }
+            }, {
+              children: [jsxRuntime.jsx("img", {
+                src: image,
+                alt: title,
+                width: 32,
+                height: 32
+              }), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+                variant: isSelected ? ctDesignTypography.TypographyVariant.HM3 : ctDesignTypography.TypographyVariant.B1,
+                isClickable: true
+              }, {
+                children: title
+              }))]
+            }))
+          }), index);
+        })
+      }));
     };
 
     var useDelayedUnmount = function (show, unmountDelay) {
-        var _a = react.useState(show), showComponent = _a[0], setShowComponent = _a[1];
-        var timerRef = react.useRef();
-        react.useEffect(function () {
-            if (!show) {
-                timerRef.current = setTimeout(function () {
-                    setShowComponent(false);
-                }, unmountDelay);
-            }
-            else {
-                setShowComponent(show);
-            }
-            return function () {
-                (timerRef === null || timerRef === void 0 ? void 0 : timerRef.current) && clearTimeout(timerRef.current);
-            };
-        }, [show]);
-        return showComponent;
+      var _a = react.useState(show),
+        showComponent = _a[0],
+        setShowComponent = _a[1];
+      var timerRef = react.useRef();
+      react.useEffect(function () {
+        if (!show) {
+          timerRef.current = setTimeout(function () {
+            setShowComponent(false);
+          }, unmountDelay);
+        } else {
+          setShowComponent(show);
+        }
+        return function () {
+          (timerRef === null || timerRef === void 0 ? void 0 : timerRef.current) && clearTimeout(timerRef.current);
+        };
+      }, [show]);
+      return showComponent;
     };
     var useMountTransition = function (isMounted, unmountDelay) {
-        var _a = react.useState(false), hasTransitionedIn = _a[0], setHasTransitionedIn = _a[1];
-        var timeoutIdRef = react.useRef();
-        react.useEffect(function () {
-            if (isMounted && !hasTransitionedIn) {
-                setTimeout(function () {
-                    setHasTransitionedIn(true);
-                }, 0);
-            }
-            else if (!isMounted && hasTransitionedIn) {
-                timeoutIdRef.current = setTimeout(function () { return setHasTransitionedIn(false); }, unmountDelay);
-            }
-            return function () {
-                if (timeoutIdRef && timeoutIdRef.current) {
-                    clearTimeout(timeoutIdRef.current);
-                }
-            };
-        }, [unmountDelay, isMounted]);
-        return hasTransitionedIn;
+      var _a = react.useState(false),
+        hasTransitionedIn = _a[0],
+        setHasTransitionedIn = _a[1];
+      var timeoutIdRef = react.useRef();
+      react.useEffect(function () {
+        if (isMounted && !hasTransitionedIn) {
+          setTimeout(function () {
+            setHasTransitionedIn(true);
+          }, 0);
+        } else if (!isMounted && hasTransitionedIn) {
+          timeoutIdRef.current = setTimeout(function () {
+            return setHasTransitionedIn(false);
+          }, unmountDelay);
+        }
+        return function () {
+          if (timeoutIdRef && timeoutIdRef.current) {
+            clearTimeout(timeoutIdRef.current);
+          }
+        };
+      }, [unmountDelay, isMounted]);
+      return hasTransitionedIn;
     };
 
     function HeaderAnimatedMask(_a) {
-        var children = _a.children, onMaskClick = _a.onMaskClick, show = _a.show, marginTop = _a.marginTop, handleDropdownMouseEnter = _a.handleDropdownMouseEnter, handleDropdownMouseLeave = _a.handleDropdownMouseLeave;
-        react.useEffect(function () {
-            if (show) {
-                document.body.style.overflow = 'hidden';
-            }
-            return function () {
-                document.body.style.overflow = 'initial';
-            };
-        }, [show]);
-        var showFlagProxy = useDelayedUnmount(show, 300);
-        var triggerTransition = useMountTransition(show, 100);
-        var triggerOpenTransition = triggerTransition;
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [showFlagProxy && (jsxRuntime.jsx(ctDesignContainer.Container, { id: 'mask-container', css: {
-                        position: 'fixed',
-                        backgroundColor: '#000',
-                        opacity: triggerOpenTransition ? 0.4 : 0,
-                        width: '100%',
-                        height: '100vh',
-                        left: 0,
-                        top: marginTop || 0,
-                        zIndex: 9,
-                        transition: 'opacity 300ms ease-in',
-                    }, onClick: onMaskClick })), showFlagProxy && (jsxRuntime.jsx(ctDesignContainer.Container, __assign({ onMouseEnter: handleDropdownMouseEnter, onMouseLeave: handleDropdownMouseLeave }, { children: children })))] }));
+      var children = _a.children,
+        onMaskClick = _a.onMaskClick,
+        show = _a.show,
+        marginTop = _a.marginTop,
+        handleDropdownMouseEnter = _a.handleDropdownMouseEnter,
+        handleDropdownMouseLeave = _a.handleDropdownMouseLeave;
+      react.useEffect(function () {
+        if (show) {
+          document.body.style.overflow = 'hidden';
+        }
+        return function () {
+          document.body.style.overflow = 'initial';
+        };
+      }, [show]);
+      var showFlagProxy = useDelayedUnmount(show, 300);
+      var triggerTransition = useMountTransition(show, 100);
+      var triggerOpenTransition = triggerTransition;
+      return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [showFlagProxy && jsxRuntime.jsx(ctDesignContainer.Container, {
+          id: 'mask-container',
+          css: {
+            position: 'fixed',
+            backgroundColor: '#000',
+            opacity: triggerOpenTransition ? 0.4 : 0,
+            width: '100%',
+            height: '100vh',
+            left: 0,
+            top: marginTop || 0,
+            zIndex: 9,
+            transition: 'opacity 300ms ease-in'
+          },
+          onClick: onMaskClick
+        }), showFlagProxy && jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          onMouseEnter: handleDropdownMouseEnter,
+          onMouseLeave: handleDropdownMouseLeave
+        }, {
+          children: children
+        }))]
+      });
     }
 
     var MIN_CLOSE_DELAY = 150;
     var useHoverDropdown = function (_a) {
-        var _b = _a === void 0 ? {} : _a, _c = _b.closeDelay, closeDelayArg = _c === void 0 ? 0 : _c, _d = _b.openDelay, openDelay = _d === void 0 ? 500 : _d;
-        var closeDelay = Math.max(closeDelayArg, MIN_CLOSE_DELAY);
-        var _e = react.useState(false), isDropdownVisible = _e[0], setIsDropdownVisible = _e[1];
-        var _f = react.useState(null), hoveredElemIndex = _f[0], setHoveredElemIndex = _f[1];
-        var timeoutRef = react.useRef(null);
-        var openTimeoutRef = react.useRef(null);
-        var cancelElementHover = react.useRef(false);
-        var handleOnMouseEnter = react.useCallback(function (index) {
-            if (timeoutRef.current)
-                clearTimeout(timeoutRef.current);
-            if (openTimeoutRef.current)
-                clearTimeout(openTimeoutRef.current);
-            cancelElementHover.current = false;
-            openTimeoutRef.current = setTimeout(function () {
-                setIsDropdownVisible(true);
-                if (!cancelElementHover.current) {
-                    setHoveredElemIndex(index);
-                }
-            }, openDelay);
-        }, [openDelay]);
-        var handleOnMouseLeave = react.useCallback(function () {
-            cancelElementHover.current = true;
-            timeoutRef.current = setTimeout(function () {
-                setIsDropdownVisible(false);
-                setHoveredElemIndex(null);
-            }, closeDelay);
-        }, [closeDelay]);
-        var handleDropdownMouseEnter = react.useCallback(function () {
-            if (timeoutRef.current)
-                clearTimeout(timeoutRef.current);
-        }, []);
-        var handleDropdownMouseLeave = react.useCallback(function () {
-            cancelElementHover.current = true;
-            (timeoutRef === null || timeoutRef === void 0 ? void 0 : timeoutRef.current) && clearTimeout(timeoutRef.current);
-            timeoutRef.current = setTimeout(function () {
-                setIsDropdownVisible(false);
-                setHoveredElemIndex(null);
-            }, closeDelay);
-        }, []);
-        react.useEffect(function () {
-            var handleMouseLeaveWindow = function (event) {
-                if (event.clientY <= 0) {
-                    setIsDropdownVisible(false);
-                    setHoveredElemIndex(null);
-                }
-            };
-            window.addEventListener('mouseleave', handleMouseLeaveWindow);
-            return function () {
-                window.removeEventListener('mouseleave', handleMouseLeaveWindow);
-            };
-        }, []);
-        return {
-            isDropdownVisible: isDropdownVisible,
-            hoveredElemIndex: hoveredElemIndex,
-            handleOnMouseEnter: handleOnMouseEnter,
-            handleOnMouseLeave: handleOnMouseLeave,
-            handleDropdownMouseEnter: handleDropdownMouseEnter,
-            handleDropdownMouseLeave: handleDropdownMouseLeave,
+      var _b = _a === void 0 ? {} : _a,
+        _c = _b.closeDelay,
+        closeDelayArg = _c === void 0 ? 0 : _c,
+        _d = _b.openDelay,
+        openDelay = _d === void 0 ? 500 : _d;
+      var closeDelay = Math.max(closeDelayArg, MIN_CLOSE_DELAY);
+      var _e = react.useState(false),
+        isDropdownVisible = _e[0],
+        setIsDropdownVisible = _e[1];
+      var _f = react.useState(null),
+        hoveredElemIndex = _f[0],
+        setHoveredElemIndex = _f[1];
+      var timeoutRef = react.useRef(null);
+      var openTimeoutRef = react.useRef(null);
+      var cancelElementHover = react.useRef(false);
+      var handleOnMouseEnter = react.useCallback(function (index) {
+        if (timeoutRef.current) clearTimeout(timeoutRef.current);
+        if (openTimeoutRef.current) clearTimeout(openTimeoutRef.current);
+        cancelElementHover.current = false;
+        openTimeoutRef.current = setTimeout(function () {
+          setIsDropdownVisible(true);
+          if (!cancelElementHover.current) {
+            setHoveredElemIndex(index);
+          }
+        }, openDelay);
+      }, [openDelay]);
+      var handleOnMouseLeave = react.useCallback(function () {
+        cancelElementHover.current = true;
+        timeoutRef.current = setTimeout(function () {
+          setIsDropdownVisible(false);
+          setHoveredElemIndex(null);
+        }, closeDelay);
+      }, [closeDelay]);
+      var handleDropdownMouseEnter = react.useCallback(function () {
+        if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      }, []);
+      var handleDropdownMouseLeave = react.useCallback(function () {
+        cancelElementHover.current = true;
+        (timeoutRef === null || timeoutRef === void 0 ? void 0 : timeoutRef.current) && clearTimeout(timeoutRef.current);
+        timeoutRef.current = setTimeout(function () {
+          setIsDropdownVisible(false);
+          setHoveredElemIndex(null);
+        }, closeDelay);
+      }, []);
+      react.useEffect(function () {
+        var handleMouseLeaveWindow = function (event) {
+          if (event.clientY <= 0) {
+            setIsDropdownVisible(false);
+            setHoveredElemIndex(null);
+          }
+        };
+        window.addEventListener('mouseleave', handleMouseLeaveWindow);
+        return function () {
+          window.removeEventListener('mouseleave', handleMouseLeaveWindow);
         };
+      }, []);
+      return {
+        isDropdownVisible: isDropdownVisible,
+        hoveredElemIndex: hoveredElemIndex,
+        handleOnMouseEnter: handleOnMouseEnter,
+        handleOnMouseLeave: handleOnMouseLeave,
+        handleDropdownMouseEnter: handleDropdownMouseEnter,
+        handleDropdownMouseLeave: handleDropdownMouseLeave
+      };
     };
 
     var useDropdownAnimation = function (isOpen) {
-        var containerRef = react.useRef(null);
-        var openDropdown = function () {
+      var containerRef = react.useRef(null);
+      var openDropdown = function () {
+        if (containerRef.current) {
+          var fullHeight_1 = containerRef.current.scrollHeight;
+          containerRef.current.style.maxHeight = "".concat(fullHeight_1 / 2, "px");
+          containerRef.current.style.opacity = '0';
+          requestAnimationFrame(function () {
             if (containerRef.current) {
-                var fullHeight_1 = containerRef.current.scrollHeight;
-                containerRef.current.style.maxHeight = "".concat(fullHeight_1 / 2, "px");
-                containerRef.current.style.opacity = '0';
-                requestAnimationFrame(function () {
-                    if (containerRef.current) {
-                        containerRef.current.style.transition = 'max-height 0.3s ease-in-out, opacity 0.3s ease-in-out';
-                        containerRef.current.style.maxHeight = "".concat(fullHeight_1, "px");
-                        containerRef.current.style.opacity = '1';
-                    }
-                });
-            }
-        };
-        var closeDropdown = function () {
-            if (containerRef.current) {
-                var fullHeight = containerRef.current.scrollHeight;
-                containerRef.current.style.transition = 'max-height 0.3s ease-in-out, opacity 0.3s ease-in-out';
-                containerRef.current.style.maxHeight = "".concat(fullHeight / 2, "px");
-                containerRef.current.style.opacity = '0';
-                setTimeout(function () {
-                    if (containerRef.current) {
-                        containerRef.current.style.maxHeight = '0px';
-                    }
-                }, 300);
-            }
-        };
-        react.useEffect(function () {
-            if (isOpen) {
-                openDropdown();
+              containerRef.current.style.transition = 'max-height 0.3s ease-in-out, opacity 0.3s ease-in-out';
+              containerRef.current.style.maxHeight = "".concat(fullHeight_1, "px");
+              containerRef.current.style.opacity = '1';
             }
-            else {
-                closeDropdown();
-            }
-        }, [isOpen]);
-        return { containerRef: containerRef };
-    };
-
-    var stringifyPayload = function (payload) {
-        var keys = Object.keys(payload);
-        var numericValues = [];
-        keys.forEach(function (key) {
-            if (numericValues.includes(key)) {
-                payload[key] = Number(payload[key]);
-            }
-            else {
-                payload[key] = '' + payload[key];
-            }
-        });
-        return payload;
-    };
-    var isServer = function () {
-        return typeof window === 'undefined' || !window;
-    };
-    var getQueryParam = function (queryParam) {
-        if (isServer()) {
-            return '';
+          });
         }
-        var urlParams = new URLSearchParams(window.location.search);
-        return urlParams.get(queryParam);
-    };
-    var ravenLoyaltyTypes = function (loyaltyType) {
-        switch (loyaltyType) {
-            case 'FkVip':
-                return 'fk_vip';
-            case 'FkPremium':
-                return 'fk_plus_premium';
-            case 'InsiderIcon':
-                return 'myntra_insidericon';
-            case 'InsiderElite':
-                return 'myntra_insiderelite';
-            default:
-                return '';
-        }
-    };
-    var ravenSDKTrigger = function (isUserLoggedIn, eventName, ravenPayload, customRavenPayload, ravenPushCallback, pageName) {
-        var _a;
-        if (typeof ravenPushCallback !== 'function') {
-            console.error('ravenPushCallback is not provided or is not a function');
-            return;
-        }
-        var commonPayload = {
-            page_name: pageName,
-            platform: RAVEN_PLATFORMS.DESKTOP,
-            login_status: isUserLoggedIn ? 'yes' : 'no',
-            domain: (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.host,
-        };
-        var newRavenPayload = stringifyPayload(ravenPayload);
-        var parsedCustomRavenPayload = stringifyPayload(customRavenPayload);
-        var finalPayload = __assign(__assign(__assign({}, commonPayload), newRavenPayload), parsedCustomRavenPayload);
-        try {
-            if (ravenPushCallback.length === 1) {
-                ravenPushCallback({ eventName: eventName, eventData: finalPayload });
-            }
-            else {
-                ravenPushCallback(eventName, finalPayload);
+      };
+      var closeDropdown = function () {
+        if (containerRef.current) {
+          var fullHeight = containerRef.current.scrollHeight;
+          containerRef.current.style.transition = 'max-height 0.3s ease-in-out, opacity 0.3s ease-in-out';
+          containerRef.current.style.maxHeight = "".concat(fullHeight / 2, "px");
+          containerRef.current.style.opacity = '0';
+          setTimeout(function () {
+            if (containerRef.current) {
+              containerRef.current.style.maxHeight = '0px';
             }
+          }, 300);
         }
-        catch (err) {
-            console.error(err);
-            return;
+      };
+      react.useEffect(function () {
+        if (isOpen) {
+          openDropdown();
+        } else {
+          closeDropdown();
         }
+      }, [isOpen]);
+      return {
+        containerRef: containerRef
+      };
     };
 
     var accountOptionHoverStyles = {
-        transition: 'background-color 0.2s ease-in-out',
-        '&:hover': {
-            backgroundColor: '#ECF3FF',
-        },
+      transition: 'background-color 0.2s ease-in-out',
+      '&:hover': {
+        backgroundColor: '#ECF3FF'
+      }
     };
     var logoutButtonHoverStyles = {
-        transition: 'background-color 0.2s ease-in-out',
-        '&:hover': {
-            backgroundColor: '#FBEFEF',
-        },
+      transition: 'background-color 0.2s ease-in-out',
+      '&:hover': {
+        backgroundColor: '#FBEFEF'
+      }
     };
-    var moveRight = react$1.keyframes(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n  from {\n    transform: translateX(-20px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"], ["\n  from {\n    transform: translateX(-20px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"])));
-    var moveRightAgain = react$1.keyframes(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  from {\n    transform: translateX(-20.01px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"], ["\n  from {\n    transform: translateX(-20.01px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"])));
+    var moveRight = styled.keyframes(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n  from {\n    transform: translateX(-20px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"], ["\n  from {\n    transform: translateX(-20px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"])));
+    var moveRightAgain = styled.keyframes(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  from {\n    transform: translateX(-20.01px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"], ["\n  from {\n    transform: translateX(-20.01px);\n  }\n  to {\n    transform: translateX(0px);\n  }\n"])));
     var arrowContainerStyles = {
-        display: 'flex',
-        backgroundColor: 'black',
-        transition: 'background-color 200ms ease',
-        'flex-direction': 'row',
-        justifyContent: 'center',
-        width: '20px',
-        height: '20px',
-        overflow: 'hidden',
-        borderRadius: '50%',
+      display: 'flex',
+      backgroundColor: 'black',
+      transition: 'background-color 200ms ease',
+      'flex-direction': 'row',
+      justifyContent: 'center',
+      width: '20px',
+      height: '20px',
+      overflow: 'hidden',
+      borderRadius: '50%'
     };
     var getLoginButtonBgColorStyles = function (saleThemeEnabled) {
-        if (saleThemeEnabled) {
-            return {
-                backgroundColor: 'transparent !important',
-                '&:hover': {
-                    backgroundColor: 'rgba(255, 255, 255, 0.25)!important',
-                },
-            };
-        }
-        else {
-            return {
-                backgroundColor: 'transparent !important',
-                '&:hover': {
-                    backgroundColor: '#F3F3F3 !important',
-                },
-            };
-        }
+      if (saleThemeEnabled) {
+        return {
+          backgroundColor: 'transparent !important',
+          '&:hover': {
+            backgroundColor: 'rgba(255, 255, 255, 0.25)!important'
+          }
+        };
+      } else {
+        return {
+          backgroundColor: 'transparent !important',
+          '&:hover': {
+            backgroundColor: '#F3F3F3 !important'
+          }
+        };
+      }
     };
     var templateObject_1$1, templateObject_2;
 
     var AnimatedArrow = function () {
-        return (jsxRuntime.jsx(ctDesignContainer.Container, __assign({ className: 'bd-arrow-container-js', css: arrowContainerStyles }, { children: __spreadArray([], Array(3), true).map(function (_, index) { return (jsxRuntime.jsx(ctDesignContainer.Container, __assign({ className: 'bd-arrow-wrapper-js', display: 'flex', alignItems: 'center' }, { children: jsxRuntime.jsx(ctDesignIcons.ArrowRight, {}) }), index)); }) })));
+      return jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+        className: 'bd-arrow-container-js',
+        css: arrowContainerStyles
+      }, {
+        children: __spreadArray([], Array(3), true).map(function (_, index) {
+          return jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+            className: 'bd-arrow-wrapper-js',
+            display: 'flex',
+            alignItems: 'center'
+          }, {
+            children: jsxRuntime.jsx(ctDesignIcons.ArrowRight, {})
+          }), index);
+        })
+      }));
     };
-    var BDHoverContainer = styled__default.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  cursor: pointer;\n  width: 200px;\n  &:hover {\n    .bd-arrow-container-js {\n      background-color: rgba(255, 79, 23, 1);\n      transition: color 200ms ease;\n    }\n    .bd-arrow-wrapper-js {\n      animation: ", " 200ms linear;\n      display: flex;\n    }\n    .color-orange-on-hover-js {\n      color: rgba(255, 79, 23, 1);\n      transition: background-color 200ms ease;\n    }\n  }\n  &:not(:hover) .bd-arrow-wrapper-js {\n    animation: ", " 200ms linear backwards;\n  }\n"], ["\n  cursor: pointer;\n  width: 200px;\n  &:hover {\n    .bd-arrow-container-js {\n      background-color: rgba(255, 79, 23, 1);\n      transition: color 200ms ease;\n    }\n    .bd-arrow-wrapper-js {\n      animation: ", " 200ms linear;\n      display: flex;\n    }\n    .color-orange-on-hover-js {\n      color: rgba(255, 79, 23, 1);\n      transition: background-color 200ms ease;\n    }\n  }\n  &:not(:hover) .bd-arrow-wrapper-js {\n    animation: ", " 200ms linear backwards;\n  }\n"])), moveRight, moveRightAgain);
+    var BDHoverContainer = /*#__PURE__*/styled__default.default.div.withConfig({
+      displayName: "BusinessDropdown__BDHoverContainer",
+      componentId: "sc-1tsshe4-0"
+    })(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  cursor: pointer;\n  width: 200px;\n  &:hover {\n    .bd-arrow-container-js {\n      background-color: rgba(255, 79, 23, 1);\n      transition: color 200ms ease;\n    }\n    .bd-arrow-wrapper-js {\n      animation: ", " 200ms linear;\n      display: flex;\n    }\n    .color-orange-on-hover-js {\n      color: rgba(255, 79, 23, 1);\n      transition: background-color 200ms ease;\n    }\n  }\n  &:not(:hover) .bd-arrow-wrapper-js {\n    animation: ", " 200ms linear backwards;\n  }\n"], ["\n  cursor: pointer;\n  width: 200px;\n  &:hover {\n    .bd-arrow-container-js {\n      background-color: rgba(255, 79, 23, 1);\n      transition: color 200ms ease;\n    }\n    .bd-arrow-wrapper-js {\n      animation: ", " 200ms linear;\n      display: flex;\n    }\n    .color-orange-on-hover-js {\n      color: rgba(255, 79, 23, 1);\n      transition: background-color 200ms ease;\n    }\n  }\n  &:not(:hover) .bd-arrow-wrapper-js {\n    animation: ", " 200ms linear backwards;\n  }\n"])), moveRight, moveRightAgain);
     var BusinessDropdownContent = function (_a) {
-        var isOpen = _a.isOpen;
-        var _b = useHeaderContext(), isUserLoggedIn = _b.isUserLoggedIn, ravenPushCallback = _b.ravenPushCallback, ravenPageName = _b.ravenPageName, ravenEventName = _b.ravenEventName, loyaltyType = _b.loyaltyType, _c = _b.ravenPayload, ravenPayload = _c === void 0 ? {} : _c;
-        var _d = react.useState(0), leftPosition = _d[0], setLeftPosition = _d[1];
-        var containerRef = useDropdownAnimation(isOpen).containerRef;
-        react.useEffect(function () {
-            var updatePosition = function () {
-                if (containerRef.current) {
-                    var screenWidth = window.innerWidth;
-                    var containerWidth = containerRef.current.offsetWidth || 0;
-                    var newLeft = (screenWidth - containerWidth) / 2;
-                    if (newLeft !== leftPosition) {
-                        setLeftPosition(newLeft);
+      var isOpen = _a.isOpen;
+      var _b = useHeaderContext(),
+        isUserLoggedIn = _b.isUserLoggedIn,
+        ravenPushCallback = _b.ravenPushCallback,
+        ravenPageName = _b.ravenPageName,
+        ravenEventName = _b.ravenEventName,
+        loyaltyType = _b.loyaltyType,
+        _c = _b.ravenPayload,
+        ravenPayload = _c === void 0 ? {} : _c;
+      var _d = react.useState(0),
+        leftPosition = _d[0],
+        setLeftPosition = _d[1];
+      var containerRef = useDropdownAnimation(isOpen).containerRef;
+      react.useEffect(function () {
+        var updatePosition = function () {
+          if (containerRef.current) {
+            var screenWidth = window.innerWidth;
+            var containerWidth = containerRef.current.offsetWidth || 0;
+            var newLeft = (screenWidth - containerWidth) / 2;
+            if (newLeft !== leftPosition) {
+              setLeftPosition(newLeft);
+            }
+          }
+        };
+        updatePosition();
+        window.addEventListener('resize', updatePosition);
+        return function () {
+          return window.removeEventListener('resize', updatePosition);
+        };
+      }, [containerRef, leftPosition]);
+      var handleBusinessDropdownClick = react.useCallback(function (link, title, ravenActionName) {
+        var _a;
+        var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
+        var actionName = ravenActionName ? "".concat(ravenActionName, "_business_click") : title ? "".concat(title.toLowerCase(), "_business_click") : '';
+        var defaultPayload = {
+          action_name: actionName,
+          action_type: 'click',
+          u_utm_source: utmSource,
+          loyalty_type: ravenLoyaltyTypes(loyaltyType)
+        };
+        if (link) {
+          ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
+          window.location.href = link;
+        }
+      }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName, loyaltyType]);
+      return jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+        ref: containerRef,
+        backgroundColor: '#fff',
+        top: '76px',
+        position: 'fixed',
+        left: "".concat(leftPosition, "px"),
+        borderRadius: 24,
+        boxShadow: '0px 8px 24px 0px rgba(26, 26, 26, 0.10)',
+        width: 'fit-content',
+        zIndex: 1002,
+        css: {
+          overflow: 'hidden',
+          opacity: 0
+        }
+      }, {
+        children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          padding: '20px 24px 20px 24px',
+          backgroundColor: '#FFF1EC'
+        }, {
+          children: jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+            variant: 'HM2'
+          }, {
+            children: BUSINESS_DROPDOWN_HEADING
+          }))
+        })), jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          flexDirection: 'row',
+          padding: '24px',
+          columnGap: '48px',
+          width: 'fit-content'
+        }, {
+          children: bdConfig.map(function (_a) {
+            var title = _a.title,
+              subtitle = _a.subtitle,
+              details = _a.details,
+              link = _a.link,
+              ravenActionName = _a.ravenActionName;
+            return jsxRuntime.jsxs(BDHoverContainer, __assign({
+              className: 'bd-hover-container-js',
+              onClick: function () {
+                return handleBusinessDropdownClick(link, title, ravenActionName);
+              }
+            }, {
+              children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+                display: 'flex',
+                flexDirection: 'column',
+                rowGap: '4px'
+              }, {
+                children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+                  display: 'flex',
+                  flexDirection: 'row',
+                  alignItems: 'center',
+                  columnGap: '8px'
+                }, {
+                  children: [jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+                    variant: 'HM2',
+                    className: 'color-orange-on-hover-js',
+                    css: {
+                      transition: 'color 200ms ease'
                     }
+                  }, {
+                    children: title
+                  })), jsxRuntime.jsx(AnimatedArrow, {})]
+                })), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+                  variant: 'B3',
+                  css: {
+                    marginTop: '4px',
+                    opacity: 0.75
+                  }
+                }, {
+                  children: subtitle
+                }))]
+              })), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+                variant: 'P3',
+                color: 'subheading',
+                css: {
+                  marginTop: '12px'
                 }
-            };
-            updatePosition();
-            window.addEventListener('resize', updatePosition);
-            return function () { return window.removeEventListener('resize', updatePosition); };
-        }, [containerRef, leftPosition]);
-        var handleBusinessDropdownClick = react.useCallback(function (link, title, ravenActionName) {
-            var _a;
-            var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
-            var actionName = ravenActionName
-                ? "".concat(ravenActionName, "_business_click")
-                : title
-                    ? "".concat(title.toLowerCase(), "_business_click")
-                    : '';
-            var defaultPayload = {
-                action_name: actionName,
-                action_type: 'click',
-                u_utm_source: utmSource,
-                loyalty_type: ravenLoyaltyTypes(loyaltyType),
-            };
-            if (link) {
-                ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
-                window.location.href = link;
-            }
-        }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName, loyaltyType]);
-        return (jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ ref: containerRef, backgroundColor: '#fff', top: '76px', position: 'fixed', left: "".concat(leftPosition, "px"), borderRadius: 24, boxShadow: '0px 8px 24px 0px rgba(26, 26, 26, 0.10)', width: 'fit-content', zIndex: 1002, css: {
-                overflow: 'hidden',
-                opacity: 0,
-            } }, { children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({ padding: '20px 24px 20px 24px', backgroundColor: '#FFF1EC' }, { children: jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'HM2' }, { children: BUSINESS_DROPDOWN_HEADING })) })), jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', padding: '24px', columnGap: '48px', width: 'fit-content' }, { children: bdConfig.map(function (_a) {
-                        var title = _a.title, subtitle = _a.subtitle, details = _a.details, link = _a.link, ravenActionName = _a.ravenActionName;
-                        return (jsxRuntime.jsxs(BDHoverContainer, __assign({ className: 'bd-hover-container-js', onClick: function () { return handleBusinessDropdownClick(link, title, ravenActionName); } }, { children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'column', rowGap: '4px' }, { children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', alignItems: 'center', columnGap: '8px' }, { children: [jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'HM2', className: 'color-orange-on-hover-js', css: { transition: 'color 200ms ease' } }, { children: title })), jsxRuntime.jsx(AnimatedArrow, {})] })), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'B3', css: { marginTop: '4px', opacity: 0.75 } }, { children: subtitle }))] })), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'P3', color: 'subheading', css: { marginTop: '12px' } }, { children: details }))] }), title));
-                    }) }))] })));
+              }, {
+                children: details
+              }))]
+            }), title);
+          })
+        }))]
+      }));
     };
     var templateObject_1;
 
-    var ACCOUNT_OPTIONS_POPUP_CONFIG = [
-        {
-            text: 'My Profile',
-            icon: jsxRuntime.jsx(ctDesignIcons.MyAccount, { width: 24, height: 24 }),
-            redirectionLink: '/accounts/profile',
-        },
-        {
-            text: 'My Trips',
-            icon: jsxRuntime.jsx(ctDesignIcons.MyTrips, { width: 24, height: 24 }),
-            redirectionLink: '/accounts/trips',
-        },
-        {
-            text: 'Saved Cards',
-            icon: jsxRuntime.jsx(ctDesignIcons.SavedCard, {}),
-            redirectionLink: '/accounts/expressway',
-        },
-        {
-            text: 'Saved Travellers',
-            icon: jsxRuntime.jsx(ctDesignIcons.Travellers, { width: 24, height: 24 }),
-            redirectionLink: '/account/travellers',
-        },
-        {
-            text: 'Hi-Five',
-            icon: jsxRuntime.jsx(ctDesignIcons.HiFive, {}),
-            redirectionLink: '/accounts/hi-five?src=fh',
-        },
-        {
-            text: 'Wallet',
-            icon: jsxRuntime.jsx(ctDesignIcons.Wallet, { width: 24, height: 24 }),
-            redirectionLink: '/accounts/wallet',
-        },
-        {
-            text: 'Settings',
-            icon: jsxRuntime.jsx(ctDesignIcons.SettingsCog, { width: 24, height: 24 }),
-            redirectionLink: '/account/settings',
-        },
-        {
-            text: 'Privacy Rights',
-            icon: jsxRuntime.jsx(ctDesignIcons.PrivacyRights, {}),
-            redirectionLink: 'accounts/personal-data-dashboard',
-        },
-    ];
+    var ACCOUNT_OPTIONS_POPUP_CONFIG = [{
+      text: 'My Profile',
+      icon: jsxRuntime.jsx(ctDesignIcons.MyAccount, {
+        width: 24,
+        height: 24
+      }),
+      redirectionLink: '/accounts/profile'
+    }, {
+      text: 'My Trips',
+      icon: jsxRuntime.jsx(ctDesignIcons.MyTrips, {
+        width: 24,
+        height: 24
+      }),
+      redirectionLink: '/accounts/trips'
+    }, {
+      text: 'Saved Cards',
+      icon: jsxRuntime.jsx(ctDesignIcons.SavedCard, {}),
+      redirectionLink: '/accounts/expressway'
+    }, {
+      text: 'Saved Travellers',
+      icon: jsxRuntime.jsx(ctDesignIcons.Travellers, {
+        width: 24,
+        height: 24
+      }),
+      redirectionLink: '/account/travellers'
+    }, {
+      text: 'Hi-Five',
+      icon: jsxRuntime.jsx(ctDesignIcons.HiFive, {}),
+      redirectionLink: '/accounts/hi-five?src=fh'
+    }, {
+      text: 'Wallet',
+      icon: jsxRuntime.jsx(ctDesignIcons.Wallet, {
+        width: 24,
+        height: 24
+      }),
+      redirectionLink: '/accounts/wallet'
+    }, {
+      text: 'Settings',
+      icon: jsxRuntime.jsx(ctDesignIcons.SettingsCog, {
+        width: 24,
+        height: 24
+      }),
+      redirectionLink: '/account/settings'
+    }, {
+      text: 'Privacy Rights',
+      icon: jsxRuntime.jsx(ctDesignIcons.PrivacyRights, {}),
+      redirectionLink: 'accounts/personal-data-dashboard'
+    }];
     var SIGN_OUT_TEXT = 'Logout';
     var MY_ACCOUNT_TEXT = 'My Account';
     var LOGGEDIN_USER_TEXT = 'You are logged in with';
@@ -594,326 +776,816 @@
     var ACCOUNT_OPTIONS_CONTAINER_WIDTH = 328;
 
     var LoyaltyChip = function (_a) {
-        var icon = _a.icon, borderGradient = _a.borderGradient, backgroundGradient = _a.backgroundGradient, handleChipClick = _a.handleChipClick, chevronFillColor = _a.chevronFillColor;
-        var _b = useHeaderContext(), loyaltyType = _b.loyaltyType, isUserLoggedIn = _b.isUserLoggedIn, ravenPushCallback = _b.ravenPushCallback, ravenPageName = _b.ravenPageName, _c = _b.ravenPayload, ravenPayload = _c === void 0 ? {} : _c, ravenEventName = _b.ravenEventName;
-        var _d = react.useState(false), isHovered = _d[0], setIsHovered = _d[1];
-        var handleClick = react.useCallback(function () {
-            var _a;
-            if (handleChipClick) {
-                handleChipClick();
-            }
-            else {
-                var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
-                var defaultPayload = {
-                    action_name: "loyalty_account_click",
-                    action_type: 'click',
-                    u_utm_source: utmSource,
-                    loyaltyType: ravenLoyaltyTypes(loyaltyType),
-                };
-                ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
-                window.location.href = '/all-offers/loyalty-october';
-            }
-        }, [handleChipClick, loyaltyType, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
-        return (jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', position: 'relative', alignItems: 'center', justifyContent: 'center', borderRadius: '8px', cursor: 'pointer', paddingLeft: '8px', paddingRight: isHovered ? '4px' : '8px', css: {
-                overflow: 'hidden',
-                height: 32,
-                paddingLeft: 8,
-                transition: 'padding-right 0.2s ease-in-out',
-            }, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onClick: handleClick }, { children: [jsxRuntime.jsx(ctDesignContainer.Container, { css: {
-                        content: '""',
-                        position: 'absolute',
-                        inset: 0,
-                        borderRadius: 'inherit',
-                        background: backgroundGradient,
-                        zIndex: -2,
-                    } }), jsxRuntime.jsx(ctDesignContainer.Container, { css: {
-                        content: '""',
-                        position: 'absolute',
-                        inset: 0,
-                        borderRadius: 'inherit',
-                        padding: '1px',
-                        background: borderGradient,
-                        WebkitMask: 'linear-gradient(white, white) content-box, linear-gradient(white, white)',
-                        WebkitMaskComposite: 'destination-out',
-                        maskComposite: 'exclude',
-                        zIndex: -1,
-                    } }), jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', position: 'relative' }, { children: icon })), jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', css: {
-                        overflow: 'hidden',
-                        maxWidth: isHovered ? 16 : 0,
-                        transition: 'max-width 0.2s ease-in-out, opacity 0.2s ease-in-out',
-                        opacity: isHovered ? 0.5 : 0,
-                    } }, { children: jsxRuntime.jsx(ctDesignIcons.HeaderChevronRight, { color: chevronFillColor }) }))] })));
+      var icon = _a.icon,
+        borderGradient = _a.borderGradient,
+        backgroundGradient = _a.backgroundGradient,
+        handleChipClick = _a.handleChipClick,
+        chevronFillColor = _a.chevronFillColor;
+      var _b = useHeaderContext(),
+        loyaltyType = _b.loyaltyType,
+        isUserLoggedIn = _b.isUserLoggedIn,
+        ravenPushCallback = _b.ravenPushCallback,
+        ravenPageName = _b.ravenPageName,
+        _c = _b.ravenPayload,
+        ravenPayload = _c === void 0 ? {} : _c,
+        ravenEventName = _b.ravenEventName;
+      var _d = react.useState(false),
+        isHovered = _d[0],
+        setIsHovered = _d[1];
+      var handleClick = react.useCallback(function () {
+        var _a;
+        if (handleChipClick) {
+          handleChipClick();
+        } else {
+          var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
+          var defaultPayload = {
+            action_name: "loyalty_account_click",
+            action_type: 'click',
+            u_utm_source: utmSource,
+            loyaltyType: ravenLoyaltyTypes(loyaltyType)
+          };
+          ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
+          window.location.href = '/all-offers/loyalty-october';
+        }
+      }, [handleChipClick, loyaltyType, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
+      return jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+        display: 'flex',
+        position: 'relative',
+        alignItems: 'center',
+        justifyContent: 'center',
+        borderRadius: '8px',
+        cursor: 'pointer',
+        paddingLeft: '8px',
+        paddingRight: isHovered ? '4px' : '8px',
+        css: {
+          overflow: 'hidden',
+          height: 32,
+          paddingLeft: 8,
+          transition: 'padding-right 0.2s ease-in-out'
+        },
+        onMouseEnter: function () {
+          return setIsHovered(true);
+        },
+        onMouseLeave: function () {
+          return setIsHovered(false);
+        },
+        onClick: handleClick
+      }, {
+        children: [jsxRuntime.jsx(ctDesignContainer.Container, {
+          css: {
+            content: '""',
+            position: 'absolute',
+            inset: 0,
+            borderRadius: 'inherit',
+            background: backgroundGradient,
+            zIndex: -2
+          }
+        }), jsxRuntime.jsx(ctDesignContainer.Container, {
+          css: {
+            content: '""',
+            position: 'absolute',
+            inset: 0,
+            borderRadius: 'inherit',
+            padding: '1px',
+            background: borderGradient,
+            WebkitMask: 'linear-gradient(white, white) content-box, linear-gradient(white, white)',
+            WebkitMaskComposite: 'destination-out',
+            maskComposite: 'exclude',
+            zIndex: -1
+          }
+        }), jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          alignItems: 'center',
+          position: 'relative'
+        }, {
+          children: icon
+        })), jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          alignItems: 'center',
+          css: {
+            overflow: 'hidden',
+            maxWidth: isHovered ? 16 : 0,
+            transition: 'max-width 0.2s ease-in-out, opacity 0.2s ease-in-out',
+            opacity: isHovered ? 0.5 : 0
+          }
+        }, {
+          children: jsxRuntime.jsx(ctDesignIcons.HeaderChevronRight, {
+            color: chevronFillColor
+          })
+        }))]
+      }));
     };
 
     exports.LOBS_VALUES = void 0;
     (function (LOBS_VALUES) {
-        LOBS_VALUES["FLIGHTS"] = "Flights";
-        LOBS_VALUES["HOTELS"] = "Hotels";
-        LOBS_VALUES["BUSES"] = "Buses";
-        LOBS_VALUES["TRAINS"] = "Trains";
-        LOBS_VALUES["PACKAGES"] = "Packages";
+      LOBS_VALUES["FLIGHTS"] = "Flights";
+      LOBS_VALUES["HOTELS"] = "Hotels";
+      LOBS_VALUES["BUSES"] = "Buses";
+      LOBS_VALUES["TRAINS"] = "Trains";
+      LOBS_VALUES["HOLIDAYS"] = "Holidays";
     })(exports.LOBS_VALUES || (exports.LOBS_VALUES = {}));
 
     exports.LoyaltyType = void 0;
     (function (LoyaltyType) {
-        LoyaltyType["FkVip"] = "FkVip";
-        LoyaltyType["FkPremium"] = "FkPremium";
-        LoyaltyType["InsiderIcon"] = "InsiderIcon";
-        LoyaltyType["InsiderElite"] = "InsiderElite";
-        LoyaltyType["CtLoyalty"] = "CtLoyalty";
+      LoyaltyType["FkVip"] = "FkVip";
+      LoyaltyType["FkPremium"] = "FkPremium";
+      LoyaltyType["InsiderIcon"] = "InsiderIcon";
+      LoyaltyType["InsiderElite"] = "InsiderElite";
+      LoyaltyType["CtLoyalty"] = "CtLoyalty";
     })(exports.LoyaltyType || (exports.LoyaltyType = {}));
 
     var _a;
-    var LOYALTY_DATA = (_a = {},
-        _a[exports.LoyaltyType.FkVip] = {
-            icon: jsxRuntime.jsx(ctDesignIcons.FkBlackIcon, {}),
-            borderGradient: 'linear-gradient(217.07deg, #0B182A 19.65%, #434E57 54.8%, #595952 89.95%)',
-            backgroundGradient: 'linear-gradient(217.07deg, #0B182A 19.65%, #434E57 54.8%, #595952 89.95%)',
-            chevronFillColor: '#FFF',
-        },
-        _a[exports.LoyaltyType.FkPremium] = {
-            icon: jsxRuntime.jsx(ctDesignIcons.FkGold, {}),
-            borderGradient: 'linear-gradient(230.68deg, rgba(243, 179, 39, 0) 10.1%, #F3B327 45.74%)',
-            backgroundGradient: '#191717',
-            chevronFillColor: '#FFF',
-        },
-        _a[exports.LoyaltyType.InsiderIcon] = {
-            icon: jsxRuntime.jsx(ctDesignIcons.InsiderIcon, {}),
-            borderGradient: 'linear-gradient(230.68deg, rgba(208, 175, 101, 0) 10.1%, #D0AF65 45.74%)',
-            backgroundGradient: 'linear-gradient(111deg, #2E3042 0%, #1A1C23 100%)',
-            chevronFillColor: '#FFF',
+    var LOYALTY_DATA = (_a = {}, _a[exports.LoyaltyType.FkVip] = {
+      icon: jsxRuntime.jsx(ctDesignIcons.FkBlackIcon, {}),
+      borderGradient: 'linear-gradient(217.07deg, #0B182A 19.65%, #434E57 54.8%, #595952 89.95%)',
+      backgroundGradient: 'linear-gradient(217.07deg, #0B182A 19.65%, #434E57 54.8%, #595952 89.95%)',
+      chevronFillColor: '#FFF'
+    }, _a[exports.LoyaltyType.FkPremium] = {
+      icon: jsxRuntime.jsx(ctDesignIcons.FkGold, {}),
+      borderGradient: 'linear-gradient(230.68deg, rgba(243, 179, 39, 0) 10.1%, #F3B327 45.74%)',
+      backgroundGradient: '#191717',
+      chevronFillColor: '#FFF'
+    }, _a[exports.LoyaltyType.InsiderIcon] = {
+      icon: jsxRuntime.jsx(ctDesignIcons.InsiderIcon, {}),
+      borderGradient: 'linear-gradient(230.68deg, rgba(208, 175, 101, 0) 10.1%, #D0AF65 45.74%)',
+      backgroundGradient: 'linear-gradient(111deg, #2E3042 0%, #1A1C23 100%)',
+      chevronFillColor: '#FFF'
+    }, _a[exports.LoyaltyType.InsiderElite] = {
+      icon: jsxRuntime.jsx(ctDesignIcons.InsiderElite, {}),
+      borderGradient: 'linear-gradient(230.68deg, rgba(208, 175, 101, 0) 10.1%, #D0AF65 45.74%)',
+      backgroundGradient: 'linear-gradient(111deg, #2E3042 0%, #1A1C23 100%)',
+      chevronFillColor: '#FFF'
+    }, _a[exports.LoyaltyType.CtLoyalty] = {
+      icon: jsxRuntime.jsx(ctDesignIcons.CtLoyalty, {}),
+      borderGradient: 'linear-gradient(230.68deg, rgba(243, 179, 39, 0) 10.1%, #F3B327 45.74%)',
+      backgroundGradient: 'linear-gradient(110.82deg, #FFF9EC 0%, #FEE3A8 100%)',
+      chevronFillColor: '#1A1A1A'
+    }, _a);
+
+    var ExpandableItem = function (_a) {
+      var icon = _a.icon,
+        handleChipClick = _a.handleChipClick,
+        value = _a.value,
+        type = _a.type;
+      var _b = useHeaderContext(),
+        loyaltyType = _b.loyaltyType,
+        isUserLoggedIn = _b.isUserLoggedIn,
+        ravenPushCallback = _b.ravenPushCallback,
+        ravenPageName = _b.ravenPageName,
+        ravenEventName = _b.ravenEventName,
+        _c = _b.ravenPayload,
+        ravenPayload = _c === void 0 ? {} : _c;
+      var _d = react.useState(false),
+        isHovered = _d[0],
+        setIsHovered = _d[1];
+      var handleDefaultClick = react.useCallback(function () {
+        var _a;
+        if (handleChipClick) {
+          handleChipClick();
+        } else {
+          var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
+          var defaultPayload = {
+            action_name: "".concat(type, "_account_click"),
+            action_type: 'click',
+            u_utm_source: utmSource,
+            loyaltyType: ravenLoyaltyTypes(loyaltyType)
+          };
+          ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
+          var redirectUrls = {
+            supercoin: '/all-offers/supercoins/',
+            wallet: '/accounts/wallet'
+          };
+          if (redirectUrls[type]) {
+            window.location.href = redirectUrls[type];
+          }
+        }
+      }, [handleChipClick, type, loyaltyType, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
+      return jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        borderRadius: '8px',
+        cursor: 'pointer',
+        css: {
+          height: 32,
+          paddingLeft: 8,
+          paddingRight: isHovered ? 4 : 8,
+          transition: 'padding-right 0.2s ease-in-out',
+          background: isHovered ? '#ffd7ca' : '#ffe6df'
         },
-        _a[exports.LoyaltyType.InsiderElite] = {
-            icon: jsxRuntime.jsx(ctDesignIcons.InsiderElite, {}),
-            borderGradient: 'linear-gradient(230.68deg, rgba(208, 175, 101, 0) 10.1%, #D0AF65 45.74%)',
-            backgroundGradient: 'linear-gradient(111deg, #2E3042 0%, #1A1C23 100%)',
-            chevronFillColor: '#FFF',
+        onMouseEnter: function () {
+          return setIsHovered(true);
         },
-        _a[exports.LoyaltyType.CtLoyalty] = {
-            icon: jsxRuntime.jsx(ctDesignIcons.CtLoyalty, {}),
-            borderGradient: 'linear-gradient(230.68deg, rgba(243, 179, 39, 0) 10.1%, #F3B327 45.74%)',
-            backgroundGradient: 'linear-gradient(110.82deg, #FFF9EC 0%, #FEE3A8 100%)',
-            chevronFillColor: '#1A1A1A',
+        onMouseLeave: function () {
+          return setIsHovered(false);
         },
-        _a);
-
-    var ExpandableItem = function (_a) {
-        var icon = _a.icon, handleChipClick = _a.handleChipClick, value = _a.value, type = _a.type;
-        var _b = useHeaderContext(), loyaltyType = _b.loyaltyType, isUserLoggedIn = _b.isUserLoggedIn, ravenPushCallback = _b.ravenPushCallback, ravenPageName = _b.ravenPageName, ravenEventName = _b.ravenEventName, _c = _b.ravenPayload, ravenPayload = _c === void 0 ? {} : _c;
-        var _d = react.useState(false), isHovered = _d[0], setIsHovered = _d[1];
-        var handleDefaultClick = react.useCallback(function () {
-            var _a;
-            if (handleChipClick) {
-                handleChipClick();
-            }
-            else {
-                var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
-                var defaultPayload = {
-                    action_name: "".concat(type, "_account_click"),
-                    action_type: 'click',
-                    u_utm_source: utmSource,
-                    loyaltyType: ravenLoyaltyTypes(loyaltyType),
-                };
-                ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
-                var redirectUrls = {
-                    supercoin: '/all-offers/supercoins/',
-                    wallet: '/accounts/wallet',
-                };
-                if (redirectUrls[type]) {
-                    window.location.href = redirectUrls[type];
-                }
-            }
-        }, [
-            handleChipClick,
-            type,
-            loyaltyType,
-            isUserLoggedIn,
-            ravenEventName,
-            ravenPayload,
-            ravenPushCallback,
-            ravenPageName,
-        ]);
-        return (jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', justifyContent: 'center', borderRadius: '8px', cursor: 'pointer', css: {
-                height: 32,
-                paddingLeft: 8,
-                paddingRight: isHovered ? 4 : 8,
-                transition: 'padding-right 0.2s ease-in-out',
-                background: isHovered ? '#ffd7ca' : '#ffe6df',
-            }, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onClick: handleDefaultClick }, { children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', css: { gap: '4px' } }, { children: [icon, jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'B3', isClickable: true }, { children: value }))] })), jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', css: {
-                        overflow: 'hidden',
-                        maxWidth: isHovered ? 16 : 0,
-                        transition: 'max-width 0.2s ease-in-out, opacity 0.2s ease-in-out',
-                        opacity: isHovered ? 1 : 0,
-                    } }, { children: jsxRuntime.jsx(ctDesignIcons.HeaderChevronRight, {}) }))] })));
+        onClick: handleDefaultClick
+      }, {
+        children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          alignItems: 'center',
+          css: {
+            gap: '4px'
+          }
+        }, {
+          children: [icon, jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+            variant: 'B3',
+            isClickable: true
+          }, {
+            children: value
+          }))]
+        })), jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          alignItems: 'center',
+          css: {
+            overflow: 'hidden',
+            maxWidth: isHovered ? 16 : 0,
+            transition: 'max-width 0.2s ease-in-out, opacity 0.2s ease-in-out',
+            opacity: isHovered ? 1 : 0
+          }
+        }, {
+          children: jsxRuntime.jsx(ctDesignIcons.HeaderChevronRight, {})
+        }))]
+      }));
     };
     var RewardsSection = function () {
-        var _a;
-        var _b = useHeaderContext(), selectedLoyaltyType = _b.loyaltyType, _c = _b.fkSupercoinBurnBalance, superCoinBalance = _c === void 0 ? 0 : _c, _d = _b.walletBalance, walletBalance = _d === void 0 ? 0 : _d, loyaltyLoading = _b.loyaltyLoading, superCoinsLoading = _b.superCoinsLoading, walletLoading = _b.walletLoading, walletChipClick = _b.walletChipClick, supercoinsChipClick = _b.supercoinsChipClick, loyaltyChipClick = _b.loyaltyChipClick, hideWalletChip = _b.hideWalletChip, hideSupercoinsChip = _b.hideSupercoinsChip, hideLoyaltyChip = _b.hideLoyaltyChip;
-        var shouldShowLoyalty = loyaltyLoading || (selectedLoyaltyType && LOYALTY_DATA[selectedLoyaltyType] && !hideLoyaltyChip);
-        var shouldShowSupercoin = superCoinsLoading || !hideSupercoinsChip;
-        var shouldShowWallet = walletLoading || !hideWalletChip;
-        if (!shouldShowLoyalty && !shouldShowSupercoin && !shouldShowWallet) {
-            return null;
+      var _a;
+      var _b = useHeaderContext(),
+        selectedLoyaltyType = _b.loyaltyType,
+        _c = _b.fkSupercoinBurnBalance,
+        superCoinBalance = _c === void 0 ? 0 : _c,
+        _d = _b.walletBalance,
+        walletBalance = _d === void 0 ? 0 : _d,
+        loyaltyLoading = _b.loyaltyLoading,
+        superCoinsLoading = _b.superCoinsLoading,
+        walletLoading = _b.walletLoading,
+        walletChipClick = _b.walletChipClick,
+        supercoinsChipClick = _b.supercoinsChipClick,
+        loyaltyChipClick = _b.loyaltyChipClick,
+        hideWalletChip = _b.hideWalletChip,
+        hideSupercoinsChip = _b.hideSupercoinsChip,
+        hideLoyaltyChip = _b.hideLoyaltyChip;
+      var shouldShowLoyalty = loyaltyLoading || selectedLoyaltyType && LOYALTY_DATA[selectedLoyaltyType] && !hideLoyaltyChip;
+      var shouldShowSupercoin = superCoinsLoading || !hideSupercoinsChip;
+      var shouldShowWallet = walletLoading || !hideWalletChip;
+      if (!shouldShowLoyalty && !shouldShowSupercoin && !shouldShowWallet) {
+        return null;
+      }
+      return jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+        display: 'flex',
+        padding: '0 16px 16px 16px',
+        justifyContent: 'flex-start',
+        css: {
+          alignSelf: 'stretch',
+          gap: '4px'
         }
-        return (jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', padding: '0 16px 16px 16px', justifyContent: 'flex-start', css: { alignSelf: 'stretch', gap: '4px' } }, { children: [loyaltyLoading ? (jsxRuntime.jsx(ctDesignContainer.Container, { width: '50px', height: '32px', borderRadius: '8px', backgroundColor: '#efefef' })) : (selectedLoyaltyType &&
-                    LOYALTY_DATA[selectedLoyaltyType] &&
-                    !hideLoyaltyChip && (jsxRuntime.jsx(LoyaltyChip, { icon: LOYALTY_DATA[selectedLoyaltyType].icon, borderGradient: LOYALTY_DATA[selectedLoyaltyType].borderGradient, backgroundGradient: LOYALTY_DATA[selectedLoyaltyType].backgroundGradient, chevronFillColor: ((_a = LOYALTY_DATA[selectedLoyaltyType]) === null || _a === void 0 ? void 0 : _a.chevronFillColor) || '#FFF', handleChipClick: loyaltyChipClick }))), superCoinsLoading ? (jsxRuntime.jsx(ctDesignContainer.Container, { width: '50px', height: '32px', borderRadius: '8px', backgroundColor: '#efefef' })) : (!hideSupercoinsChip && (jsxRuntime.jsx(ExpandableItem, { icon: jsxRuntime.jsx(ctDesignIcons.Supercoin, { width: 20, height: 20 }), value: superCoinBalance, handleChipClick: supercoinsChipClick, type: 'supercoin' }))), walletLoading ? (jsxRuntime.jsx(ctDesignContainer.Container, { width: '50px', height: '32px', borderRadius: '8px', backgroundColor: '#efefef' })) : (!hideWalletChip && (jsxRuntime.jsx(ExpandableItem, { icon: jsxRuntime.jsx(ctDesignIcons.Wallet, { width: 20, height: 20 }), value: walletBalance, handleChipClick: walletChipClick, type: 'wallet' })))] })));
+      }, {
+        children: [loyaltyLoading ? jsxRuntime.jsx(ctDesignContainer.Container, {
+          width: '50px',
+          height: '32px',
+          borderRadius: '8px',
+          backgroundColor: '#efefef'
+        }) : selectedLoyaltyType && LOYALTY_DATA[selectedLoyaltyType] && !hideLoyaltyChip && jsxRuntime.jsx(LoyaltyChip, {
+          icon: LOYALTY_DATA[selectedLoyaltyType].icon,
+          borderGradient: LOYALTY_DATA[selectedLoyaltyType].borderGradient,
+          backgroundGradient: LOYALTY_DATA[selectedLoyaltyType].backgroundGradient,
+          chevronFillColor: ((_a = LOYALTY_DATA[selectedLoyaltyType]) === null || _a === void 0 ? void 0 : _a.chevronFillColor) || '#FFF',
+          handleChipClick: loyaltyChipClick
+        }), superCoinsLoading ? jsxRuntime.jsx(ctDesignContainer.Container, {
+          width: '50px',
+          height: '32px',
+          borderRadius: '8px',
+          backgroundColor: '#efefef'
+        }) : !hideSupercoinsChip && jsxRuntime.jsx(ExpandableItem, {
+          icon: jsxRuntime.jsx(ctDesignIcons.Supercoin, {
+            width: 20,
+            height: 20
+          }),
+          value: superCoinBalance,
+          handleChipClick: supercoinsChipClick,
+          type: 'supercoin'
+        }), walletLoading ? jsxRuntime.jsx(ctDesignContainer.Container, {
+          width: '50px',
+          height: '32px',
+          borderRadius: '8px',
+          backgroundColor: '#efefef'
+        }) : !hideWalletChip && jsxRuntime.jsx(ExpandableItem, {
+          icon: jsxRuntime.jsx(ctDesignIcons.Wallet, {
+            width: 20,
+            height: 20
+          }),
+          value: walletBalance,
+          handleChipClick: walletChipClick,
+          type: 'wallet'
+        })]
+      }));
     };
 
     var AccountDropdownContent = function (_a) {
-        var isOpen = _a.isOpen;
-        var _b = useHeaderContext(), handleLogoutClick = _b.handleLogoutClick, userName = _b.userName, userMobileNumber = _b.userMobileNumber, countryCode = _b.countryCode, userDetailsLoading = _b.userDetailsLoading, loyaltyType = _b.loyaltyType, isUserLoggedIn = _b.isUserLoggedIn, ravenEventName = _b.ravenEventName, ravenPageName = _b.ravenPageName, _c = _b.ravenPayload, ravenPayload = _c === void 0 ? {} : _c, ravenPushCallback = _b.ravenPushCallback;
-        var containerRef = useDropdownAnimation(isOpen).containerRef;
-        var _d = react.useMemo(function () { return ({
+      var isOpen = _a.isOpen;
+      var _b = useHeaderContext(),
+        handleLogoutClick = _b.handleLogoutClick,
+        userName = _b.userName,
+        userMobileNumber = _b.userMobileNumber,
+        countryCode = _b.countryCode,
+        userDetailsLoading = _b.userDetailsLoading,
+        loyaltyType = _b.loyaltyType,
+        isUserLoggedIn = _b.isUserLoggedIn,
+        ravenEventName = _b.ravenEventName,
+        ravenPageName = _b.ravenPageName,
+        _c = _b.ravenPayload,
+        ravenPayload = _c === void 0 ? {} : _c,
+        ravenPushCallback = _b.ravenPushCallback;
+      var containerRef = useDropdownAnimation(isOpen).containerRef;
+      var _d = react.useMemo(function () {
+          return {
             userGreeting: userName ? "Hello ".concat(userName, "!") : '',
-            phoneNumber: countryCode && userMobileNumber ? "".concat(countryCode, " ").concat(userMobileNumber) : '',
-        }); }, [userName, userMobileNumber, countryCode]), userGreeting = _d.userGreeting, phoneNumber = _d.phoneNumber;
-        var generateRavenPayload = function (actionName) {
-            var _a;
-            return ({
-                action_name: actionName.toLowerCase().replace(/[\s-]/g, '') + '_account_click',
-                action_type: 'click',
-                u_utm_source: (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic',
-                loyalty_type: ravenLoyaltyTypes(loyaltyType),
-            });
+            phoneNumber: countryCode && userMobileNumber ? "".concat(countryCode, " ").concat(userMobileNumber) : ''
+          };
+        }, [userName, userMobileNumber, countryCode]),
+        userGreeting = _d.userGreeting,
+        phoneNumber = _d.phoneNumber;
+      var generateRavenPayload = function (actionName) {
+        var _a;
+        return {
+          action_name: actionName.toLowerCase().replace(/[\s-]/g, '') + '_account_click',
+          action_type: 'click',
+          u_utm_source: (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic',
+          loyalty_type: ravenLoyaltyTypes(loyaltyType)
         };
-        var handleAccountOptionsClick = react.useCallback(function (text, redirectLink) {
-            ravenSDKTrigger(isUserLoggedIn, ravenEventName, generateRavenPayload(text), ravenPayload, ravenPushCallback, ravenPageName);
-            window.location.href = redirectLink;
-        }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
-        react.useCallback(function () {
-            ravenSDKTrigger(isUserLoggedIn, ravenEventName, generateRavenPayload(SIGN_OUT_TEXT), ravenPayload, ravenPushCallback, ravenPageName);
-            handleLogoutClick();
-        }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName, handleLogoutClick]);
-        var positionAccountOptionsDiv = react.useCallback(function () {
-            var headerAccBtn = document.getElementById(HEADER_ACCOUNTS_OPTIONS_OPEN_BTN_ID);
-            var accountOptionsElem = document.getElementById(ACCOUNT_OPTIONS_CONTAINER_ID);
-            if (headerAccBtn && accountOptionsElem) {
-                var headerBtnRight = headerAccBtn.getBoundingClientRect().right;
-                accountOptionsElem.style.left = "".concat(headerBtnRight - ACCOUNT_OPTIONS_CONTAINER_WIDTH, "px");
-            }
-        }, []);
-        react.useEffect(function () {
-            positionAccountOptionsDiv();
-        }, [positionAccountOptionsDiv]);
-        var renderUserData = function () {
-            var renderContent = function (loading, content, variant, color) { return (jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: variant, color: color }, { children: loading ? (jsxRuntime.jsx(ctDesignContainer.Container, { height: variant === 'HM3' ? '18px' : '12px', width: variant === 'HM3' ? '140px' : '200px', backgroundColor: '#efefef', borderRadius: '8px' })) : (content) }))); };
-            return (jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'column', css: { gap: '4px' } }, { children: userGreeting ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [renderContent(userDetailsLoading, userGreeting, 'HM3', 'primary'), renderContent(userDetailsLoading, "".concat(LOGGEDIN_USER_TEXT, " ").concat(phoneNumber), 'P3', 'subheading')] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [renderContent(userDetailsLoading, LOGGEDIN_USER_TEXT, 'P3', 'subheading'), renderContent(userDetailsLoading, phoneNumber, 'HM3', 'primary')] })) })));
+      };
+      var handleAccountOptionsClick = react.useCallback(function (text, redirectLink) {
+        ravenSDKTrigger(isUserLoggedIn, ravenEventName, generateRavenPayload(text), ravenPayload, ravenPushCallback, ravenPageName);
+        window.location.href = redirectLink;
+      }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
+      react.useCallback(function () {
+        ravenSDKTrigger(isUserLoggedIn, ravenEventName, generateRavenPayload(SIGN_OUT_TEXT), ravenPayload, ravenPushCallback, ravenPageName);
+        handleLogoutClick();
+      }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName, handleLogoutClick]);
+      var positionAccountOptionsDiv = react.useCallback(function () {
+        var headerAccBtn = document.getElementById(HEADER_ACCOUNTS_OPTIONS_OPEN_BTN_ID);
+        var accountOptionsElem = document.getElementById(ACCOUNT_OPTIONS_CONTAINER_ID);
+        if (headerAccBtn && accountOptionsElem) {
+          var headerBtnRight = headerAccBtn.getBoundingClientRect().right;
+          accountOptionsElem.style.left = "".concat(headerBtnRight - ACCOUNT_OPTIONS_CONTAINER_WIDTH, "px");
+        }
+      }, []);
+      react.useEffect(function () {
+        positionAccountOptionsDiv();
+      }, [positionAccountOptionsDiv]);
+      var renderUserData = function () {
+        var renderContent = function (loading, content, variant, color) {
+          return jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+            variant: variant,
+            color: color
+          }, {
+            children: loading ? jsxRuntime.jsx(ctDesignContainer.Container, {
+              height: variant === 'HM3' ? '18px' : '12px',
+              width: variant === 'HM3' ? '140px' : '200px',
+              backgroundColor: '#efefef',
+              borderRadius: '8px'
+            }) : content
+          }));
         };
-        return (jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ id: ACCOUNT_OPTIONS_CONTAINER_ID, ref: containerRef, display: 'flex', flexDirection: 'column', borderRadius: '16px', zIndex: 1002, top: '76px', position: 'fixed', css: { opacity: 0, overflow: 'hidden' }, width: "".concat(ACCOUNT_OPTIONS_CONTAINER_WIDTH, "px"), background: '#FFF1EC' }, { children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({ padding: '16px', height: '76px' }, { children: renderUserData() })), jsxRuntime.jsx(RewardsSection, {}), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'column', padding: '8px', backgroundColor: 'white', rowGap: '8px', css: {
-                        borderBottomLeftRadius: 12,
-                        borderBottomRightRadius: 12,
-                    } }, { children: [ACCOUNT_OPTIONS_POPUP_CONFIG.map(function (_a) {
-                            var text = _a.text, icon = _a.icon, redirectionLink = _a.redirectionLink;
-                            return (jsxRuntime.jsx(ctDesignContainer.Container, __assign({ padding: '8px', borderRadius: '8px', cursor: 'pointer', onClick: function () { return handleAccountOptionsClick(text, redirectionLink); }, css: accountOptionHoverStyles }, { children: jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', cursor: 'pointer', css: { columnGap: '8px' } }, { children: [icon, jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'P1', css: { display: 'flex', alignItems: 'center', cursor: 'pointer' } }, { children: text }))] })) }), "account-option-".concat(text)));
-                        }), jsxRuntime.jsx(ctDesignDivider.Divider, { css: {
-                                borderBottom: '1px dashed #E6E6E6',
-                            } }), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', padding: '8px', borderRadius: '8px', cursor: 'pointer', columnGap: '8px', onClick: handleLogoutClick, css: logoutButtonHoverStyles }, { children: [jsxRuntime.jsx(ctDesignIcons.Signout, { height: 24, width: 24 }), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'P1', css: { display: 'flex', alignItems: 'center', cursor: 'pointer' }, color: 'warning' }, { children: SIGN_OUT_TEXT }))] }))] }))] })));
+        return jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          flexDirection: 'column',
+          css: {
+            gap: '4px'
+          }
+        }, {
+          children: userGreeting ? jsxRuntime.jsxs(jsxRuntime.Fragment, {
+            children: [renderContent(userDetailsLoading, userGreeting, 'HM3', 'primary'), renderContent(userDetailsLoading, "".concat(LOGGEDIN_USER_TEXT, " ").concat(phoneNumber), 'P3', 'subheading')]
+          }) : jsxRuntime.jsxs(jsxRuntime.Fragment, {
+            children: [renderContent(userDetailsLoading, LOGGEDIN_USER_TEXT, 'P3', 'subheading'), renderContent(userDetailsLoading, phoneNumber, 'HM3', 'primary')]
+          })
+        }));
+      };
+      return jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+        id: ACCOUNT_OPTIONS_CONTAINER_ID,
+        ref: containerRef,
+        display: 'flex',
+        flexDirection: 'column',
+        borderRadius: '16px',
+        zIndex: 1002,
+        top: '76px',
+        position: 'fixed',
+        css: {
+          opacity: 0,
+          overflow: 'hidden'
+        },
+        width: "".concat(ACCOUNT_OPTIONS_CONTAINER_WIDTH, "px"),
+        background: '#FFF1EC'
+      }, {
+        children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          padding: '16px',
+          height: '76px'
+        }, {
+          children: renderUserData()
+        })), jsxRuntime.jsx(RewardsSection, {}), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          flexDirection: 'column',
+          padding: '8px',
+          backgroundColor: 'white',
+          rowGap: '8px',
+          css: {
+            borderBottomLeftRadius: 12,
+            borderBottomRightRadius: 12
+          }
+        }, {
+          children: [ACCOUNT_OPTIONS_POPUP_CONFIG.map(function (_a) {
+            var text = _a.text,
+              icon = _a.icon,
+              redirectionLink = _a.redirectionLink;
+            return jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+              padding: '8px',
+              borderRadius: '8px',
+              cursor: 'pointer',
+              onClick: function () {
+                return handleAccountOptionsClick(text, redirectionLink);
+              },
+              css: accountOptionHoverStyles
+            }, {
+              children: jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+                display: 'flex',
+                cursor: 'pointer',
+                css: {
+                  columnGap: '8px'
+                }
+              }, {
+                children: [icon, jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+                  variant: 'P1',
+                  css: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    cursor: 'pointer'
+                  }
+                }, {
+                  children: text
+                }))]
+              }))
+            }), "account-option-".concat(text));
+          }), jsxRuntime.jsx(ctDesignDivider.Divider, {
+            css: {
+              borderBottom: '1px dashed #E6E6E6'
+            }
+          }), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+            display: 'flex',
+            padding: '8px',
+            borderRadius: '8px',
+            cursor: 'pointer',
+            columnGap: '8px',
+            onClick: handleLogoutClick,
+            css: logoutButtonHoverStyles
+          }, {
+            children: [jsxRuntime.jsx(ctDesignIcons.Signout, {
+              height: 24,
+              width: 24
+            }), jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+              variant: 'P1',
+              css: {
+                display: 'flex',
+                alignItems: 'center',
+                cursor: 'pointer'
+              },
+              color: 'warning'
+            }, {
+              children: SIGN_OUT_TEXT
+            }))]
+          }))]
+        }))]
+      }));
     };
 
     var UserAccount = function () {
-        var _a = useHeaderContext(), isNovacThemeEnabled = _a.isNovacThemeEnabled, ravenEventName = _a.ravenEventName, _b = _a.ravenPayload, ravenPayload = _b === void 0 ? {} : _b, ravenPushCallback = _a.ravenPushCallback, isUserLoggedIn = _a.isUserLoggedIn, loyaltyType = _a.loyaltyType, ravenPageName = _a.ravenPageName;
-        var _c = useHoverDropdown({ openDelay: 0 }), isDropdownVisible = _c.isDropdownVisible, handleOnMouseEnter = _c.handleOnMouseEnter, handleOnMouseLeave = _c.handleOnMouseLeave, handleDropdownMouseEnter = _c.handleDropdownMouseEnter, handleDropdownMouseLeave = _c.handleDropdownMouseLeave;
-        var _d = react.useState(false), scrolled = _d[0], setScrolled = _d[1];
-        react.useEffect(function () {
-            var handleScroll = function () {
-                setScrolled(window.scrollY >= 50);
-            };
-            window.addEventListener('scroll', handleScroll);
-            return function () { return window.removeEventListener('scroll', handleScroll); };
-        }, []);
-        var theme = isNovacThemeEnabled && !scrolled ? THEME_CONFIG.NOVAC : THEME_CONFIG.DEFAULT;
-        var hoverColor = theme.hoverColor, typographyColor = theme.typographyColor;
-        var triggerRavenEventOnHover = react.useCallback(function () {
-            var _a;
-            var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
-            var defaultPayload = {
-                action_name: "".concat(MY_ACCOUNT_TEXT.toLowerCase().replace(/[\s-]/g, ''), "_header_hover"),
-                action_type: 'hover',
-                u_utm_source: utmSource,
-                loyalty_type: ravenLoyaltyTypes(loyaltyType),
-            };
-            ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
-        }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName, loyaltyType]);
-        return (jsxRuntime.jsxs(ctDesignContainer.Container, { children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', padding: '8px 12px', alignItems: 'center', borderRadius: '12px', height: '100%', cursor: 'pointer', css: { columnGap: 8, height: 64 }, onMouseEnter: function () {
-                        handleOnMouseEnter(0);
-                        triggerRavenEventOnHover();
-                    }, onMouseLeave: handleOnMouseLeave, id: HEADER_ACCOUNTS_OPTIONS_OPEN_BTN_ID }, { children: [jsxRuntime.jsx(ctDesignIcons.MyAccount, { color: isDropdownVisible ? hoverColor : typographyColor }), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', alignItems: 'center' }, { children: [jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'B2', css: { cursor: 'pointer' }, colorCode: isDropdownVisible ? hoverColor : typographyColor }, { children: MY_ACCOUNT_TEXT })), jsxRuntime.jsx(ctDesignIcons.ChevronDown, { width: 20, height: 20, fill: isDropdownVisible ? hoverColor : typographyColor })] }))] })), jsxRuntime.jsx(HeaderAnimatedMask, __assign({ show: isDropdownVisible, marginTop: '64px', handleDropdownMouseEnter: handleDropdownMouseEnter, handleDropdownMouseLeave: handleDropdownMouseLeave, onMaskClick: handleDropdownMouseLeave }, { children: jsxRuntime.jsx(AccountDropdownContent, { isOpen: isDropdownVisible }) }))] }));
+      var _a = useHeaderContext(),
+        isNovacThemeEnabled = _a.isNovacThemeEnabled,
+        ravenEventName = _a.ravenEventName,
+        _b = _a.ravenPayload,
+        ravenPayload = _b === void 0 ? {} : _b,
+        ravenPushCallback = _a.ravenPushCallback,
+        isUserLoggedIn = _a.isUserLoggedIn,
+        loyaltyType = _a.loyaltyType,
+        ravenPageName = _a.ravenPageName;
+      var _c = useHoverDropdown({
+          openDelay: 0
+        }),
+        isDropdownVisible = _c.isDropdownVisible,
+        handleOnMouseEnter = _c.handleOnMouseEnter,
+        handleOnMouseLeave = _c.handleOnMouseLeave,
+        handleDropdownMouseEnter = _c.handleDropdownMouseEnter,
+        handleDropdownMouseLeave = _c.handleDropdownMouseLeave;
+      var _d = react.useState(false),
+        scrolled = _d[0],
+        setScrolled = _d[1];
+      react.useEffect(function () {
+        var handleScroll = function () {
+          setScrolled(window.scrollY >= 50);
+        };
+        window.addEventListener('scroll', handleScroll);
+        return function () {
+          return window.removeEventListener('scroll', handleScroll);
+        };
+      }, []);
+      var theme = isNovacThemeEnabled && !scrolled ? THEME_CONFIG.NOVAC : THEME_CONFIG.DEFAULT;
+      var hoverColor = theme.hoverColor,
+        typographyColor = theme.typographyColor;
+      var triggerRavenEventOnHover = react.useCallback(function () {
+        var _a;
+        var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
+        var defaultPayload = {
+          action_name: "".concat(MY_ACCOUNT_TEXT.toLowerCase().replace(/[\s-]/g, ''), "_header_hover"),
+          action_type: 'hover',
+          u_utm_source: utmSource,
+          loyalty_type: ravenLoyaltyTypes(loyaltyType)
+        };
+        ravenSDKTrigger(isUserLoggedIn, ravenEventName, defaultPayload, ravenPayload, ravenPushCallback, ravenPageName);
+      }, [isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName, loyaltyType]);
+      return jsxRuntime.jsxs(ctDesignContainer.Container, {
+        children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          padding: '8px 12px',
+          alignItems: 'center',
+          borderRadius: '12px',
+          height: '100%',
+          cursor: 'pointer',
+          css: {
+            columnGap: 8,
+            height: 64
+          },
+          onMouseEnter: function () {
+            handleOnMouseEnter(0);
+            triggerRavenEventOnHover();
+          },
+          onMouseLeave: handleOnMouseLeave,
+          id: HEADER_ACCOUNTS_OPTIONS_OPEN_BTN_ID
+        }, {
+          children: [jsxRuntime.jsx(ctDesignIcons.MyAccount, {
+            color: isDropdownVisible ? hoverColor : typographyColor
+          }), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+            display: 'flex',
+            flexDirection: 'row',
+            alignItems: 'center'
+          }, {
+            children: [jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+              variant: 'B2',
+              css: {
+                cursor: 'pointer'
+              },
+              colorCode: isDropdownVisible ? hoverColor : typographyColor
+            }, {
+              children: MY_ACCOUNT_TEXT
+            })), jsxRuntime.jsx(ctDesignIcons.ChevronDown, {
+              width: 20,
+              height: 20,
+              fill: isDropdownVisible ? hoverColor : typographyColor
+            })]
+          }))]
+        })), jsxRuntime.jsx(HeaderAnimatedMask, __assign({
+          show: isDropdownVisible,
+          marginTop: '64px',
+          handleDropdownMouseEnter: handleDropdownMouseEnter,
+          handleDropdownMouseLeave: handleDropdownMouseLeave,
+          onMaskClick: handleDropdownMouseLeave
+        }, {
+          children: jsxRuntime.jsx(AccountDropdownContent, {
+            isOpen: isDropdownVisible
+          })
+        }))]
+      });
     };
 
     var Header = function (props) {
-        return (jsxRuntime.jsx(HeaderProvider, __assign({ value: props }, { children: jsxRuntime.jsx(HeaderContent, {}) })));
+      return jsxRuntime.jsx(HeaderProvider, __assign({
+        value: props
+      }, {
+        children: jsxRuntime.jsx(HeaderContent, {})
+      }));
     };
     var HeaderContent = function () {
-        var _a;
-        var _b = useHeaderContext(), onLoginButtonClick = _b.onLoginButtonClick, _c = _b.showAllLobs, showAllLobs = _c === void 0 ? false : _c, isUserLoggedIn = _b.isUserLoggedIn, loyaltyType = _b.loyaltyType, _d = _b.isNovacThemeEnabled, isNovacThemeEnabled = _d === void 0 ? false : _d, _e = _b.ravenPayload, ravenPayload = _e === void 0 ? {} : _e, ravenPushCallback = _b.ravenPushCallback, ravenPageName = _b.ravenPageName, ravenEventName = _b.ravenEventName;
-        var _f = react.useState(false), scrolled = _f[0], setScrolled = _f[1];
-        react.useEffect(function () {
-            var handleScroll = function () {
-                setScrolled(window.scrollY >= 50);
-            };
-            window.addEventListener('scroll', handleScroll);
-            return function () { return window.removeEventListener('scroll', handleScroll); };
-        }, []);
-        var headerTheme = isNovacThemeEnabled && !scrolled ? THEME_CONFIG.NOVAC : THEME_CONFIG.DEFAULT;
-        var headerBackground = headerTheme.headerBackground, logoFill = headerTheme.logoFill, loginButtonColorVariant = headerTheme.loginButtonColorVariant, hoverColor = headerTheme.hoverColor, fkcompanyColor = headerTheme.fkcompanyColor, typographyColor = headerTheme.typographyColor;
-        var _g = useHoverDropdown({
-            openDelay: 0,
-        }), isDropdownVisible = _g.isDropdownVisible, hoveredElemIndex = _g.hoveredElemIndex, handleOnMouseEnter = _g.handleOnMouseEnter, handleOnMouseLeave = _g.handleOnMouseLeave, handleDropdownMouseEnter = _g.handleDropdownMouseEnter, handleDropdownMouseLeave = _g.handleDropdownMouseLeave;
-        var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
-        var createPayload = react.useCallback(function (actionName, actionType) { return ({
-            action_name: actionName,
-            action_type: actionType,
-            u_utm_source: utmSource,
-            loyalty_type: ravenLoyaltyTypes(loyaltyType),
-        }); }, [utmSource, loyaltyType]);
-        var handleNavbarOptionsClick = react.useCallback(function (option) {
-            if (option.isClickable && option.link) {
-                var actionName = "".concat(option.text.toLowerCase().replace(/\s/g, ''), "_header_click");
-                var payload = createPayload(actionName, 'click');
-                ravenSDKTrigger(isUserLoggedIn, ravenEventName, payload, ravenPayload, ravenPushCallback, ravenPageName);
-                window.location.href = option.link;
+      var _a;
+      var _b = useHeaderContext(),
+        onLoginButtonClick = _b.onLoginButtonClick,
+        _c = _b.showAllLobs,
+        showAllLobs = _c === void 0 ? false : _c,
+        isUserLoggedIn = _b.isUserLoggedIn,
+        loyaltyType = _b.loyaltyType,
+        _d = _b.isNovacThemeEnabled,
+        isNovacThemeEnabled = _d === void 0 ? false : _d,
+        _e = _b.ravenPayload,
+        ravenPayload = _e === void 0 ? {} : _e,
+        ravenPushCallback = _b.ravenPushCallback,
+        ravenPageName = _b.ravenPageName,
+        ravenEventName = _b.ravenEventName;
+      var _f = react.useState(false),
+        scrolled = _f[0],
+        setScrolled = _f[1];
+      react.useEffect(function () {
+        var handleScroll = function () {
+          setScrolled(window.scrollY >= 50);
+        };
+        window.addEventListener('scroll', handleScroll);
+        return function () {
+          return window.removeEventListener('scroll', handleScroll);
+        };
+      }, []);
+      var headerTheme = isNovacThemeEnabled && !scrolled ? THEME_CONFIG.NOVAC : THEME_CONFIG.DEFAULT;
+      var headerBackground = headerTheme.headerBackground,
+        logoFill = headerTheme.logoFill,
+        loginButtonColorVariant = headerTheme.loginButtonColorVariant,
+        hoverColor = headerTheme.hoverColor,
+        fkcompanyColor = headerTheme.fkcompanyColor,
+        typographyColor = headerTheme.typographyColor;
+      var _g = useHoverDropdown({
+          openDelay: 0
+        }),
+        isDropdownVisible = _g.isDropdownVisible,
+        hoveredElemIndex = _g.hoveredElemIndex,
+        handleOnMouseEnter = _g.handleOnMouseEnter,
+        handleOnMouseLeave = _g.handleOnMouseLeave,
+        handleDropdownMouseEnter = _g.handleDropdownMouseEnter,
+        handleDropdownMouseLeave = _g.handleDropdownMouseLeave;
+      var utmSource = (_a = getQueryParam('utm_source')) !== null && _a !== void 0 ? _a : 'organic';
+      var createPayload = react.useCallback(function (actionName, actionType) {
+        return {
+          action_name: actionName,
+          action_type: actionType,
+          u_utm_source: utmSource,
+          loyalty_type: ravenLoyaltyTypes(loyaltyType)
+        };
+      }, [utmSource, loyaltyType]);
+      var handleNavbarOptionsClick = react.useCallback(function (option) {
+        if (option.isClickable && option.link) {
+          var actionName = "".concat(option.text.toLowerCase().replace(/\s/g, ''), "_header_click");
+          var payload = createPayload(actionName, 'click');
+          ravenSDKTrigger(isUserLoggedIn, ravenEventName, payload, ravenPayload, ravenPushCallback, ravenPageName);
+          window.location.href = option.link;
+        }
+      }, [createPayload, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
+      var handleHomeClick = react.useCallback(function () {
+        var payload = createPayload('home_header_click', 'click');
+        ravenSDKTrigger(isUserLoggedIn, ravenEventName, payload, ravenPayload, ravenPushCallback, ravenPageName);
+        window.location.href = '/';
+      }, [createPayload, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
+      var triggerRavenEventOnHover = react.useCallback(function (option) {
+        var actionName = "".concat(option.text.toLowerCase().replace(/\s/g, ''), "_header_hover");
+        var payload = createPayload(actionName, 'hover');
+        ravenSDKTrigger(isUserLoggedIn, ravenEventName, payload, ravenPayload, ravenPushCallback, ravenPageName);
+      }, [createPayload, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
+      return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+          display: 'flex',
+          top: 0,
+          position: 'sticky',
+          width: '100%',
+          alignItems: 'center',
+          justifyContent: 'center',
+          zIndex: 1000,
+          height: '64px',
+          background: headerBackground,
+          css: {
+            gap: '24px',
+            flexShrink: 0,
+            borderBottom: headerBackground === 'transparent' ? '' : '1px solid #E6E6E6',
+            transition: 'background-color 0.3s ease-in-out, border-bottom 0.3s ease-in-out'
+          }
+        }, {
+          children: jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            padding: '0 28px',
+            flex: 1,
+            css: {
+              gap: '24px',
+              maxWidth: 1440
             }
-        }, [createPayload, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
-        var handleHomeClick = react.useCallback(function () {
-            var payload = createPayload('home_header_click', 'click');
-            ravenSDKTrigger(isUserLoggedIn, ravenEventName, payload, ravenPayload, ravenPushCallback, ravenPageName);
-            window.location.href = '/';
-        }, [createPayload, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
-        var triggerRavenEventOnHover = react.useCallback(function (option) {
-            var actionName = "".concat(option.text.toLowerCase().replace(/\s/g, ''), "_header_hover");
-            var payload = createPayload(actionName, 'hover');
-            ravenSDKTrigger(isUserLoggedIn, ravenEventName, payload, ravenPayload, ravenPushCallback, ravenPageName);
-        }, [createPayload, isUserLoggedIn, ravenEventName, ravenPayload, ravenPushCallback, ravenPageName]);
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', top: 0, position: 'sticky', width: '100%', alignItems: 'center', justifyContent: 'center', zIndex: 1000, height: '64px', background: headerBackground, css: {
-                        gap: '24px',
-                        flexShrink: 0,
-                        borderBottom: headerBackground === 'transparent' ? '' : '1px solid #E6E6E6',
-                        transition: 'background-color 0.3s ease-in-out, border-bottom 0.3s ease-in-out',
-                    } }, { children: jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '0 28px', flex: 1, css: {
-                            gap: '24px',
-                            maxWidth: 1440,
-                        } }, { children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center', cursor: 'pointer', onClick: handleHomeClick }, { children: [jsxRuntime.jsx(ctDesignIcons.CTLogo, { fillColor: logoFill }), jsxRuntime.jsx(ctDesignDivider.Divider, { css: {
-                                            width: 12,
-                                            marginLeft: 2,
-                                            marginRight: 2,
-                                            transform: 'rotate(90deg)',
-                                            borderBottom: '1px solid #e0e0e0',
-                                        } }), jsxRuntime.jsx(ctDesignIcons.Fkcompany, { color: fkcompanyColor })] })), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center', columnGap: '24px' }, { children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center', columnGap: '4px' }, { children: NAVBAR_OPTIONS.map(function (option, index) {
-                                            var text = option.text, LeftIcon = option.lefticon, RightIcon = option.rightIcon, isHoverable = option.isHoverable;
-                                            var isHovered = hoveredElemIndex === index;
-                                            return (jsxRuntime.jsxs(ctDesignContainer.Container, { children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ onMouseEnter: function () {
-                                                            handleOnMouseEnter(index);
-                                                            if (option.isHoverable) {
-                                                                triggerRavenEventOnHover(option);
-                                                            }
-                                                        }, onMouseLeave: handleOnMouseLeave, display: 'flex', flexDirection: 'row', alignItems: 'center', padding: '8px 12px 8px 12px', cursor: 'pointer', position: 'relative', columnGap: 8, height: '64px', onClick: function () { return handleNavbarOptionsClick(option); } }, { children: [jsxRuntime.jsx(LeftIcon, { color: isHovered ? hoverColor : typographyColor }), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', alignItems: 'center' }, { children: [jsxRuntime.jsx(ctDesignTypography.Typography, __assign({ variant: 'B2', colorCode: isHovered ? hoverColor : typographyColor, isClickable: true }, { children: text })), RightIcon && (jsxRuntime.jsx(RightIcon, { width: 20, height: 20, fill: isHovered ? hoverColor : typographyColor }))] }))] }), "nav-option-".concat(index)), jsxRuntime.jsx(HeaderAnimatedMask, __assign({ show: hoveredElemIndex === index && isHoverable && isDropdownVisible, marginTop: '64px', handleDropdownMouseEnter: handleDropdownMouseEnter, handleDropdownMouseLeave: handleDropdownMouseLeave, onMaskClick: handleDropdownMouseLeave }, { children: jsxRuntime.jsx(BusinessDropdownContent, { isOpen: hoveredElemIndex === index && isHoverable && isDropdownVisible }) }))] }));
-                                        }) })), isUserLoggedIn && (jsxRuntime.jsx(ctDesignDivider.Divider, { css: {
-                                            width: 12,
-                                            margin: '0 -18px',
-                                            transform: 'rotate(90deg)',
-                                            borderBottom: '1px solid #e0e0e0',
-                                        } })), jsxRuntime.jsx(ctDesignContainer.Container, { children: isUserLoggedIn ? (jsxRuntime.jsx(ctDesignContainer.Container, __assign({ display: 'flex', flexDirection: 'row', alignItems: 'center' }, { children: jsxRuntime.jsx(UserAccount, {}) }))) : (jsxRuntime.jsx(ctDesignButton.Button, __assign({ onClick: onLoginButtonClick, css: __assign({ width: 153, height: 40 }, getLoginButtonBgColorStyles(headerBackground === 'transparent')), loading: false, color: loginButtonColorVariant, variant: ctDesignButton.ButtonVariant.OUTLINE }, { children: LOG_IN_TEXT }))) })] }))] })) })), showAllLobs && jsxRuntime.jsx(LobsHeader, {})] }));
+          }, {
+            children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+              display: 'flex',
+              flexDirection: 'row',
+              alignItems: 'center',
+              justifyContent: 'center',
+              cursor: 'pointer',
+              onClick: handleHomeClick
+            }, {
+              children: [jsxRuntime.jsx(ctDesignIcons.CTLogo, {
+                fillColor: logoFill
+              }), jsxRuntime.jsx(ctDesignDivider.Divider, {
+                css: {
+                  width: 12,
+                  marginLeft: 2,
+                  marginRight: 2,
+                  transform: 'rotate(90deg)',
+                  borderBottom: '1px solid #e0e0e0'
+                }
+              }), jsxRuntime.jsx(ctDesignIcons.Fkcompany, {
+                color: fkcompanyColor
+              })]
+            })), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+              display: 'flex',
+              flexDirection: 'row',
+              alignItems: 'center',
+              justifyContent: 'center',
+              columnGap: '24px'
+            }, {
+              children: [jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+                display: 'flex',
+                flexDirection: 'row',
+                alignItems: 'center',
+                justifyContent: 'center',
+                columnGap: '4px'
+              }, {
+                children: NAVBAR_OPTIONS.map(function (option, index) {
+                  var text = option.text,
+                    LeftIcon = option.lefticon,
+                    RightIcon = option.rightIcon,
+                    isHoverable = option.isHoverable;
+                  var isHovered = hoveredElemIndex === index;
+                  return jsxRuntime.jsxs(ctDesignContainer.Container, {
+                    children: [jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+                      onMouseEnter: function () {
+                        handleOnMouseEnter(index);
+                        if (option.isHoverable) {
+                          triggerRavenEventOnHover(option);
+                        }
+                      },
+                      onMouseLeave: handleOnMouseLeave,
+                      display: 'flex',
+                      flexDirection: 'row',
+                      alignItems: 'center',
+                      padding: '8px 12px 8px 12px',
+                      cursor: 'pointer',
+                      position: 'relative',
+                      columnGap: 8,
+                      height: '64px',
+                      onClick: function () {
+                        return handleNavbarOptionsClick(option);
+                      }
+                    }, {
+                      children: [jsxRuntime.jsx(LeftIcon, {
+                        color: isHovered ? hoverColor : typographyColor
+                      }), jsxRuntime.jsxs(ctDesignContainer.Container, __assign({
+                        display: 'flex',
+                        flexDirection: 'row',
+                        alignItems: 'center'
+                      }, {
+                        children: [jsxRuntime.jsx(ctDesignTypography.Typography, __assign({
+                          variant: 'B2',
+                          colorCode: isHovered ? hoverColor : typographyColor,
+                          isClickable: true
+                        }, {
+                          children: text
+                        })), RightIcon && jsxRuntime.jsx(RightIcon, {
+                          width: 20,
+                          height: 20,
+                          fill: isHovered ? hoverColor : typographyColor
+                        })]
+                      }))]
+                    }), "nav-option-".concat(index)), jsxRuntime.jsx(HeaderAnimatedMask, __assign({
+                      show: hoveredElemIndex === index && isHoverable && isDropdownVisible,
+                      marginTop: '64px',
+                      handleDropdownMouseEnter: handleDropdownMouseEnter,
+                      handleDropdownMouseLeave: handleDropdownMouseLeave,
+                      onMaskClick: handleDropdownMouseLeave
+                    }, {
+                      children: jsxRuntime.jsx(BusinessDropdownContent, {
+                        isOpen: hoveredElemIndex === index && isHoverable && isDropdownVisible
+                      })
+                    }))]
+                  });
+                })
+              })), isUserLoggedIn && jsxRuntime.jsx(ctDesignDivider.Divider, {
+                css: {
+                  width: 12,
+                  margin: '0 -18px',
+                  transform: 'rotate(90deg)',
+                  borderBottom: '1px solid #e0e0e0'
+                }
+              }), jsxRuntime.jsx(ctDesignContainer.Container, {
+                children: isUserLoggedIn ? jsxRuntime.jsx(ctDesignContainer.Container, __assign({
+                  display: 'flex',
+                  flexDirection: 'row',
+                  alignItems: 'center'
+                }, {
+                  children: jsxRuntime.jsx(UserAccount, {})
+                })) : jsxRuntime.jsx(ctDesignButton.Button, __assign({
+                  onClick: onLoginButtonClick,
+                  css: __assign({
+                    width: 153,
+                    height: 40
+                  }, getLoginButtonBgColorStyles(headerBackground === 'transparent')),
+                  loading: false,
+                  color: loginButtonColorVariant,
+                  variant: ctDesignButton.ButtonVariant.OUTLINE
+                }, {
+                  children: LOG_IN_TEXT
+                }))
+              })]
+            }))]
+          }))
+        })), showAllLobs && jsxRuntime.jsx(LobsHeader, {})]
+      });
     };
 
     exports.Header = Header;