@hhgtech/hhg-components 1.29.496 → 1.29.497-beta-2

package/build/{index-0ea4630a.js → index-70a13e5e.js}

@@ -1,54 +1,72 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-e25a257c.js');
+var tslib_es6 = require('./tslib.es6-c7597004.js');
 var React = require('react');
-var index$8 = require('./index-3e1b0155.js');
-var index$3 = require('./index-5013f4ef.js');
-var normalizeLink = require('./normalizeLink-ab0a8c63.js');
-var dataTransform = require('./dataTransform-a9b22fa9.js');
+var index$b = require('./index-1a194279.js');
+var index$3 = require('./index-d665bdfc.js');
+var normalizeLink = require('./normalizeLink-04d86416.js');
+var dataTransform = require('./dataTransform-103e8d12.js');
 var core = require('@hhgtech/icons/core');
-require('./translationsContext-4546c7ee.js');
+require('./translationsContext-c1cfbf39.js');
 var styled = require('@emotion/styled');
-var index = require('./index-5a54147a.js');
+var index = require('./index-f30b1ecc.js');
 var miscTheme = require('./miscTheme.js');
-var navigationProfileButton = require('./index-d1026f64.js');
+var navigationProfileButton = require('./index-e8eeb1bd.js');
 var other = require('@hhgtech/icons/other');
 var core$1 = require('@mantine/core');
-var index$d = require('./index-eaeac711.js');
+var index$d = require('./index-ecae0e01.js');
 var throttle = require('lodash/throttle');
 require('@mantine/dates');
-var index$a = require('./index-363a0347.js');
-var index$5 = require('./index-89820ca0.js');
-require('./index-aa5fe0cf.js');
-var index$4 = require('./index-238dc63b.js');
-var index$2 = require('./index-2b79ceb9.js');
-require('./index-4dc265ad.js');
-require('./index.styles-938ccf7f.js');
+var index$9 = require('./index-1775bf2e.js');
+var index$6 = require('./index-dbfb6960.js');
+require('./index-bea5f83c.js');
+var index$4 = require('./index-532cfe4d.js');
+var index$2 = require('./index-ea8225c7.js');
+require('./index-1979af8a.js');
+require('./index.styles-9bc9873f.js');
 require('@mantine/hooks');
-var utils = require('./utils-eecade99.js');
-require('./index-5a332e06.js');
-var constants = require('./constants-87fc7417.js');
-var store = require('./store-216083ce.js');
-var constants$1 = require('./constants-fd110f81.js');
-var index$1 = require('./index-3335bd7f.js');
-var index$7 = require('./index-89912766.js');
-var index$6 = require('./index-04143336.js');
-var useIsInit = require('./useIsInit-d47520be.js');
+var utils = require('./utils-7048e6ec.js');
+require('./index-528160c9.js');
+var constants = require('./constants-19cb75a0.js');
+var store = require('./store-7a36fbb1.js');
+var index$5 = require('./index-d9648de2.js');
+var index$1 = require('./index-132d1f06.js');
+var useIsInit = require('./useIsInit-2c86cf8d.js');
+var constants$1 = require('./constants-f8e7f557.js');
 var miscDefaultClassWrapper = require('./miscDefaultClassWrapper.js');
-var index$9 = require('./index-9fc9836c.js');
+var index$7 = require('./index-dc1a2b0d.js');
+var index$8 = require('./index-ec052e28.js');
 var formatString = require('string-format');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
+var index$a = require('./index-c200a2ed.js');
 var dayjs = require('dayjs');
 var relativeTime = require('dayjs/plugin/relativeTime');
-var index$b = require('./index-45d5e9da.js');
-var index$c = require('./index-3544e59b.js');
-var Locale = require('./Locale-5af0fa60.js');
+var index$c = require('./index-f41deb5e.js');
+var Locale = require('./Locale-efad4cbe.js');
 var debounce = require('lodash/debounce');
-var core$2 = require('./core-15f67a58.js');
+var core$2 = require('./core-9ecd7074.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefault(React);
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 var throttle__default = /*#__PURE__*/_interopDefault(throttle);
 var formatString__default = /*#__PURE__*/_interopDefault(formatString);
@@ -56,6 +74,15 @@ var dayjs__default = /*#__PURE__*/_interopDefault(dayjs);
 var relativeTime__default = /*#__PURE__*/_interopDefault(relativeTime);
 var debounce__default = /*#__PURE__*/_interopDefault(debounce);
 
+const HamburgerWhite = (props) => (React__namespace.createElement("svg", Object.assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+    React__namespace.createElement("path", { d: "M4 12H20", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+    React__namespace.createElement("path", { d: "M4 7H20", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+    React__namespace.createElement("path", { d: "M4 17H20", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })));
+
+const StarPair = (props) => (React__namespace.createElement("svg", Object.assign({ width: "22", height: "28", viewBox: "0 0 22 28", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+    React__namespace.createElement("path", { d: "M6.35278 10.7516C6.42759 10.976 6.63881 11.1279 6.87534 11.1279C7.11187 11.1279 7.322 10.976 7.39791 10.7516C7.68947 9.87691 8.37585 9.19053 9.25054 8.89896C9.47497 8.82415 9.62679 8.61403 9.62679 8.3775C9.62679 8.14097 9.47497 7.93084 9.25054 7.85603C8.37585 7.56446 7.68947 6.87809 7.39791 6.00339C7.24719 5.55453 6.5046 5.55453 6.35388 6.00339C6.06231 6.87809 5.37594 7.56446 4.50125 7.85603C4.27682 7.93084 4.125 8.14097 4.125 8.3775C4.125 8.61403 4.27682 8.82415 4.50125 8.89896C5.37565 9.19043 6.06193 9.87699 6.35278 10.7516Z", fill: "#2743AD" }),
+    React__namespace.createElement("path", { d: "M20.1723 14.3286L18.5342 13.6789C16.821 12.9995 15.4655 11.6411 14.7897 9.92641L14.1396 8.27697C13.9232 7.72994 13.0262 7.72994 12.8097 8.27697L12.1597 9.92641C11.4839 11.6411 10.1284 12.9995 8.41517 13.6789L6.77705 14.3286C6.5044 14.4367 6.32422 14.7016 6.32422 14.9952C6.32422 15.2888 6.50345 15.5537 6.77705 15.6618L8.41517 16.3115C10.1284 16.991 11.4839 18.3494 12.1597 20.064L12.8097 21.7135C12.9175 21.987 13.1815 22.1668 13.4742 22.1668C13.7669 22.1668 14.031 21.987 14.1387 21.7135L14.7888 20.064C15.4646 18.3494 16.8201 16.991 18.5333 16.3115L20.1714 15.6618C20.444 15.5537 20.6242 15.2888 20.6242 14.9952C20.6242 14.7016 20.4459 14.4367 20.1723 14.3286Z", fill: "#2743AD" })));
+
 const StyleInput = styled__default["default"](index.Input) `
   .mantine-Input-input {
     border-radius: 40px;
@@ -87,7 +114,7 @@ const StyleInput = styled__default["default"](index.Input) `
 
 const HHG_SEARCH_BACK_KEY = 'hhg_search_history';
 const SearchInput = ({ id, isMobile = false, isHomepage = false, projectType, isRedirectSearchPage = false, }) => {
-    const { locale, siteType } = React.useContext(navigationProfileButton.NavigationContext);
+    const { locale, siteType, isWinCashBackTheme: winCashBackTheme, } = React.useContext(navigationProfileButton.NavigationContext);
     const [keyword, setKeyword] = React.useState('');
     const [eventCategoryTracking, setEventCategoryTracking] = React.useState('Search From Another Page');
     const { t } = index$1.useTranslations();
@@ -132,13 +159,13 @@ const SearchInput = ({ id, isMobile = false, isHomepage = false, projectType, is
             setKeyword(searchValue);
         }
     }, []);
-    return isMobile && !isHomepage ? (React__default["default"].createElement(index$2.Button, { variant: "tertiary", style: {
+    return isMobile && !isHomepage ? (React__namespace["default"].createElement(index$2.Button, { variant: "tertiary", style: {
             padding: '6px',
         }, size: "sm", onClick: goBack },
-        React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", style: {
+        React__namespace["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", style: {
                 verticalAlign: 'bottom',
             } },
-            React__default["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.3097 9.06111C3.3097 5.88483 5.88458 3.30994 9.06087 3.30994C12.2372 3.30994 14.812 5.88483 14.812 9.06111C14.812 12.2374 12.2372 14.8123 9.06087 14.8123C5.88458 14.8123 3.3097 12.2374 3.3097 9.06111ZM9.06087 1.66675C4.97707 1.66675 1.6665 4.97732 1.6665 9.06111C1.6665 13.1449 4.97707 16.4555 9.06087 16.4555C10.8067 16.4555 12.4112 15.8505 13.6761 14.8387L16.9305 18.0931C17.2514 18.4139 17.7716 18.4139 18.0924 18.0931C18.4133 17.7722 18.4133 17.252 18.0924 16.9312L14.8381 13.6768C15.8501 12.4118 16.4552 10.8071 16.4552 9.06111C16.4552 4.97732 13.1447 1.66675 9.06087 1.66675Z", fill: "#8C8C8C" })))) : (React__default["default"].createElement(StyleInput, { className: "fake-search-input", name: 'search-input-menu-service' + id, size: "md", "data-event-category": eventCategoryTracking, "data-event-action": "Search", "data-event-label": keyword, placeholder: siteType === 'marryBaby'
+            React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.3097 9.06111C3.3097 5.88483 5.88458 3.30994 9.06087 3.30994C12.2372 3.30994 14.812 5.88483 14.812 9.06111C14.812 12.2374 12.2372 14.8123 9.06087 14.8123C5.88458 14.8123 3.3097 12.2374 3.3097 9.06111ZM9.06087 1.66675C4.97707 1.66675 1.6665 4.97732 1.6665 9.06111C1.6665 13.1449 4.97707 16.4555 9.06087 16.4555C10.8067 16.4555 12.4112 15.8505 13.6761 14.8387L16.9305 18.0931C17.2514 18.4139 17.7716 18.4139 18.0924 18.0931C18.4133 17.7722 18.4133 17.252 18.0924 16.9312L14.8381 13.6768C15.8501 12.4118 16.4552 10.8071 16.4552 9.06111C16.4552 4.97732 13.1447 1.66675 9.06087 1.66675Z", fill: "#8C8C8C" })))) : (React__namespace["default"].createElement(StyleInput, { className: "fake-search-input", name: 'search-input-menu-service' + id, size: "md", "data-event-category": eventCategoryTracking, "data-event-action": "Search", "data-event-label": keyword, placeholder: siteType === 'marryBaby'
             ? t('navigation.search.input.placeholder')
             : t('home.search', {
                 site: index$3.LOCALE_SPECS[locale || 'en-PH']
@@ -150,16 +177,16 @@ const SearchInput = ({ id, isMobile = false, isHomepage = false, projectType, is
             if ((isMobile && isHomepage) || isRedirectSearchPage) {
                 goToSearchPage('');
             }
-        }, rightSection: keyword ? (React__default["default"].createElement("div", { className: "close-icon-wrapper", onClick: () => setKeyword(''), "data-event-category": "Search Page", "data-event-action": "Delete Search" },
-            React__default["default"].createElement(core.Close, { size: 17, color: miscTheme.theme.colors.white }))) : (''), icon: React__default["default"].createElement("a", { "data-event-category": "Search Button", "data-event-action": "Click", className: "search-icon-btn", onClick: () => {
+        }, rightSection: keyword ? (React__namespace["default"].createElement("div", { className: "close-icon-wrapper", onClick: () => setKeyword(''), "data-event-category": "Search Page", "data-event-action": "Delete Search" },
+            React__namespace["default"].createElement(core.Close, { size: 17, color: miscTheme.theme.colors.white }))) : winCashBackTheme ? (React__namespace["default"].createElement(StarPair, { className: "star-pair-icon" })) : (''), icon: React__namespace["default"].createElement("a", { "data-event-category": "Search Button", "data-event-action": "Click", className: "search-icon-btn", onClick: () => {
                 if ((isMobile && isHomepage) || isRedirectSearchPage) {
                     goToSearchPage('');
                 }
             } },
-            React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", style: {
+            React__namespace["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", style: {
                     verticalAlign: 'bottom',
                 } },
-                React__default["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.3097 9.06111C3.3097 5.88483 5.88458 3.30994 9.06087 3.30994C12.2372 3.30994 14.812 5.88483 14.812 9.06111C14.812 12.2374 12.2372 14.8123 9.06087 14.8123C5.88458 14.8123 3.3097 12.2374 3.3097 9.06111ZM9.06087 1.66675C4.97707 1.66675 1.6665 4.97732 1.6665 9.06111C1.6665 13.1449 4.97707 16.4555 9.06087 16.4555C10.8067 16.4555 12.4112 15.8505 13.6761 14.8387L16.9305 18.0931C17.2514 18.4139 17.7716 18.4139 18.0924 18.0931C18.4133 17.7722 18.4133 17.252 18.0924 16.9312L14.8381 13.6768C15.8501 12.4118 16.4552 10.8071 16.4552 9.06111C16.4552 4.97732 13.1447 1.66675 9.06087 1.66675Z", fill: "#8C8C8C" }))) }));
+                React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.3097 9.06111C3.3097 5.88483 5.88458 3.30994 9.06087 3.30994C12.2372 3.30994 14.812 5.88483 14.812 9.06111C14.812 12.2374 12.2372 14.8123 9.06087 14.8123C5.88458 14.8123 3.3097 12.2374 3.3097 9.06111ZM9.06087 1.66675C4.97707 1.66675 1.6665 4.97732 1.6665 9.06111C1.6665 13.1449 4.97707 16.4555 9.06087 16.4555C10.8067 16.4555 12.4112 15.8505 13.6761 14.8387L16.9305 18.0931C17.2514 18.4139 17.7716 18.4139 18.0924 18.0931C18.4133 17.7722 18.4133 17.252 18.0924 16.9312L14.8381 13.6768C15.8501 12.4118 16.4552 10.8071 16.4552 9.06111C16.4552 4.97732 13.1447 1.66675 9.06087 1.66675Z", fill: "#8C8C8C" }))) }));
 };
 
 const getEcomUrl = ({ path, locale, }) => {
@@ -185,10 +212,10 @@ const CartBadge = (_a) => {
         styles,
         classNames,
     });
-    return typeof count !== 'undefined' ? (React__default["default"].createElement(core$1.Box, Object.assign({ component: "a", href: getEcomUrl({ path: 'CART', locale }), className: cx(classes.root, className) }, boxProps),
-        React__default["default"].createElement(core$1.Indicator, { withBorder: true, color: 'red', size: 20, disabled: count === 0, label: React__default["default"].createElement(index$4.Text, { className: classes.iconText, size: "s5" }, count > 99 ? '99+' : count) },
-            React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
-                React__default["default"].createElement("path", { d: "M5.308 21.5q-.748 0-1.278-.53a1.74 1.74 0 0 1-.53-1.278V8.308q0-.75.53-1.278.53-.53 1.278-.53H7.5q0-1.873 1.313-3.187Q10.127 2 12 2t3.187 1.313T16.5 6.5h2.192q.749 0 1.278.53.53.53.53 1.278v11.384q0 .749-.53 1.278-.53.53-1.278.53zm0-1.5h13.384a.3.3 0 0 0 .212-.096.3.3 0 0 0 .096-.212V8.308a.3.3 0 0 0-.096-.212.3.3 0 0 0-.212-.096H5.308a.3.3 0 0 0-.212.096.3.3 0 0 0-.096.212v11.384q0 .116.096.212a.3.3 0 0 0 .212.096M9 6.5h6q0-1.25-.875-2.125A2.9 2.9 0 0 0 12 3.5q-1.25 0-2.125.875A2.9 2.9 0 0 0 9 6.5m2.985 7q1.695 0 3.047-1.148 1.35-1.148 1.335-2.606a.74.74 0 0 0-.207-.528.7.7 0 0 0-.527-.218.7.7 0 0 0-.471.182 1 1 0 0 0-.295.506 2.8 2.8 0 0 1-1.036 1.665 2.9 2.9 0 0 1-1.846.647 2.93 2.93 0 0 1-1.854-.647A2.73 2.73 0 0 1 9.1 9.688q-.086-.34-.278-.514A.66.66 0 0 0 8.367 9a.72.72 0 0 0-.534.218.72.72 0 0 0-.216.528q0 1.457 1.336 2.606 1.335 1.148 3.032 1.148", fill: "#2D87F3" }))))) : null;
+    return typeof count !== 'undefined' ? (React__namespace["default"].createElement(core$1.Box, Object.assign({ component: "a", href: getEcomUrl({ path: 'CART', locale }), className: cx(classes.root, className) }, boxProps),
+        React__namespace["default"].createElement(core$1.Indicator, { withBorder: true, color: 'red', size: 20, disabled: count === 0, label: React__namespace["default"].createElement(index$4.Text, { className: classes.iconText, size: "s5" }, count > 99 ? '99+' : count) },
+            React__namespace["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
+                React__namespace["default"].createElement("path", { d: "M5.308 21.5q-.748 0-1.278-.53a1.74 1.74 0 0 1-.53-1.278V8.308q0-.75.53-1.278.53-.53 1.278-.53H7.5q0-1.873 1.313-3.187Q10.127 2 12 2t3.187 1.313T16.5 6.5h2.192q.749 0 1.278.53.53.53.53 1.278v11.384q0 .749-.53 1.278-.53.53-1.278.53zm0-1.5h13.384a.3.3 0 0 0 .212-.096.3.3 0 0 0 .096-.212V8.308a.3.3 0 0 0-.096-.212.3.3 0 0 0-.212-.096H5.308a.3.3 0 0 0-.212.096.3.3 0 0 0-.096.212v11.384q0 .116.096.212a.3.3 0 0 0 .212.096M9 6.5h6q0-1.25-.875-2.125A2.9 2.9 0 0 0 12 3.5q-1.25 0-2.125.875A2.9 2.9 0 0 0 9 6.5m2.985 7q1.695 0 3.047-1.148 1.35-1.148 1.335-2.606a.74.74 0 0 0-.207-.528.7.7 0 0 0-.527-.218.7.7 0 0 0-.471.182 1 1 0 0 0-.295.506 2.8 2.8 0 0 1-1.036 1.665 2.9 2.9 0 0 1-1.846.647 2.93 2.93 0 0 1-1.854-.647A2.73 2.73 0 0 1 9.1 9.688q-.086-.34-.278-.514A.66.66 0 0 0 8.367 9a.72.72 0 0 0-.534.218.72.72 0 0 0-.216.528q0 1.457 1.336 2.606 1.335 1.148 3.032 1.148", fill: "#2D87F3" }))))) : null;
 };
 
 const StyledDisplayWrapper = styled__default["default"].div `
@@ -200,232 +227,38 @@ const StyledDisplayWrapper = styled__default["default"].div `
 const DisplayWrapper = ({ forceDisplay, mediaQueryKey, children, className, style, }) => {
     // use CSS to display or not
     const [lowerBoundValue, upperBoundValue] = React.useMemo(() => utils.getBoundariesFromMediaQueryKey(mediaQueryKey), [mediaQueryKey]);
-    return (React__default["default"].createElement(StyledDisplayWrapper, { lowerBound: forceDisplay ? 0 : lowerBoundValue, upperBound: forceDisplay ? 0 : upperBoundValue, className: className, style: style }, children));
-};
-
-var styles$2 = {"menuContainer":"y5VJdvw","menuIcon":"oVhOSCy","menuIconWrapper":"pX8OXTM"};
-
-function ClosePopupIcon({ className }) {
-    return (React__default["default"].createElement("div", null,
-        React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", className: className },
-            React__default["default"].createElement("path", { d: "M18 6L6 18M18 18L6 6", stroke: "#3E3F58", strokeWidth: "1.3", strokeLinecap: "round" }))));
-}
-
-function HamburgerIcon({ siteType, enableSearch, className, style, }) {
-    if (siteType === 'helloSites') {
-        return (React__default["default"].createElement("div", { className: "hamburger-container" },
-            React__default["default"].createElement("img", { "data-list-type": "Header", "data-content-type": "Navigation", "data-content-topic": "Hamburger", src: enableSearch
-                    ? index$5.CommonGAssets.getAssetPath('hamburgerMenuNewWithSearch.svg')
-                    : index$5.CommonGAssets.getAssetPath('hamburgerMenuNew.svg'), style: Object.assign({ width: '24px', height: '24px' }, style), alt: "home", className: className, loading: "lazy" })));
-    }
-    /** Marry Baby */
-    return (React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", className: className },
-        React__default["default"].createElement("path", { d: "M3.35 15a.65.65 0 0 1 .65-.65h10a.65.65 0 1 1 0 1.3H4a.65.65 0 0 1-.65-.65m0-6A.65.65 0 0 1 4 8.35h16a.65.65 0 1 1 0 1.3H4A.65.65 0 0 1 3.35 9", fill: "#3E3F58" })));
-}
-
-const StyledMasterMenuContainer = styled__default["default"].div `
-  position: fixed;
-  z-index: 201;
-  top: calc(100% - 1px);
-  width: 100%;
-  height: calc(100vh - var(--header-bottom));
-  overflow-x: hidden;
-  overflow-y: auto;
-  background: white;
-  display: flex;
-  flex-direction: column;
-  padding-bottom: 0;
-  left: 0;
-  .hhgcomp-navigation-popupwrapper-menuwrapper {
-    position: unset;
-  }
-`;
-styled__default["default"].div `
-  padding: 16px;
-  padding-bottom: 12px;
-  .fake-search-input {
-    pointer-events: none;
-    input {
-      line-height: 20px;
-      padding-top: 10px;
-      padding-bottom: 10px;
-    }
-  }
-  &[data-theme='marryBaby'] {
-    input {
-      background: ${miscTheme.theme.mbColors.lightGray};
-      border-radius: 16px;
-      border: none;
-    }
-  }
-`;
-const StyledWrapper = styled__default["default"].div `
-  display: block;
-  overflow-y: auto;
-  flex: 1;
-  padding-bottom: 16px;
-  &::-webkit-scrollbar {
-    width: 0;
-    display: none;
-  }
-`;
-const StyleWrapperSearch = styled__default["default"].div `
-  padding: 0 16px;
-`;
-
-const Phone = (_a) => {
-    var { size = 24, color = miscTheme.theme.colors.neutral600 } = _a, rest = tslib_es6.__rest(_a, ["size", "color"]);
-    return (React__default["default"].createElement("svg", Object.assign({ width: size, height: size, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, rest),
-        React__default["default"].createElement("path", { d: "M6.088 18.75q-.63 0-1.068-.437a1.45 1.45 0 0 1-.438-1.07V2.757q0-.63.438-1.068a1.45 1.45 0 0 1 1.068-.438h7.82q.633 0 1.07.438.437.437.437 1.068v14.488q0 .63-.437 1.069a1.45 1.45 0 0 1-1.07.437zm3.91-1.859a.7.7 0 0 0 .522-.216.7.7 0 0 0 .216-.521.7.7 0 0 0-.216-.522.7.7 0 0 0-.521-.215.7.7 0 0 0-.522.215.7.7 0 0 0-.215.522.7.7 0 0 0 .215.521.7.7 0 0 0 .522.216m-4.166-3.333h8.333V4.792H5.832z", fill: color })));
+    return (React__namespace["default"].createElement(StyledDisplayWrapper, { lowerBound: forceDisplay ? 0 : lowerBoundValue, upperBound: forceDisplay ? 0 : upperBoundValue, className: className, style: style }, children));
 };
 
-const StyledItemGridLeft = styled__default["default"].div `
-  padding-right: 1rem;
-  background: #ffffff;
-  padding: 5px 15px;
-  ${utils.MediaQueries.mbUp} {
-    border-right: 1px solid #e4e8ec;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-  }
-`;
-const StyledItem$6 = styled__default["default"].a `
-  padding: 10px 0;
-  position: relative;
-
-  display: flex;
-  align-items: center;
-  &[data-is-mobile-tool='true'] {
-    align-items: flex-start;
-    .name,
-    .phone-icon {
-      margin-top: 4px;
-    }
-  }
-  text-decoration: none;
-  color: ${miscTheme.theme.colors.gray800};
-  * {
-    pointer-events: none;
-  }
-  .name {
-    font-size: 16px;
-    font-weight: 400;
-  }
-
-  &[data-theme='marryBaby']:hover,
-  &[data-theme='marryBaby'][data-active='true'] {
-    p {
-      color: ${miscTheme.theme.mbColors.pink};
-    }
-    .icon {
-      background-color: ${miscTheme.theme.mbColors.lightPink};
-    }
-  }
-  &[data-theme='helloSites']:hover,
-  &[data-theme='helloSites'][data-active='true'] {
-    p {
-      color: ${miscTheme.theme.colors.primaryActive};
-    }
-  }
-  a {
-  }
-
-  &[data-theme='marryBaby'] {
-    .icon {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      max-width: 40px;
-      width: 100%;
-      height: 40px;
-      border-radius: 50%;
-      background-color: ${miscTheme.theme.mbColors.lightGray};
-      img {
-        border-radius: 50%;
-      }
-    }
-  }
-`;
-const StyledHeading$1 = styled__default["default"].div `
-  margin: 15px 0;
-  ${utils.MediaQueries.mbDown} {
-    display: none;
-  }
-`;
-const StyledIconNav = styled__default["default"].div `
-  display: flex;
-  position: absolute;
-  right: 0;
-  ${utils.MediaQueries.mbUp} {
-    &.arrow-icon {
-      display: none;
-    }
-  }
-`;
-const StyledItemAll = styled__default["default"].div `
-  display: flex;
-  align-items: center;
-  color: ${miscTheme.theme.colors.primaryBase};
-  font-size: ${miscTheme.theme.sizes.fsParagraph4};
-  font-weight: ${miscTheme.theme.sizes.fwBold};
-  line-height: 24px;
-  font-size: 14px;
-  font-weight: 600;
-  &[data-theme='marryBaby'] {
-    color: ${miscTheme.theme.mbColors.pink};
-  }
-`;
-const StyledImageWrapper = styled__default["default"].div `
-  display: flex;
-  align-items: center;
-  margin-left: 10px;
-`;
-const StyledViewMore$1 = styled__default["default"].a `
-  border: 1px solid ${miscTheme.theme.colors.primaryBase};
-  &[data-theme='marryBaby'] {
-    border: 1px solid ${miscTheme.theme.mbColors.pink};
-
-    svg path {
-      stroke: ${miscTheme.theme.mbColors.pink};
-    }
-  }
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 6px;
-  border-radius: 5px;
-  margin-top: 20px;
-  ${utils.MediaQueries.mbDown} {
-    display: none;
-  }
-`;
-
-var styles$1 = {"menuIconWrapper":"wnUb-dV","menuButton":"cjbOxWe","itemNavButton":"-sx0jrx","scale":"EDlp5Zf"};
+var styles$2 = {"menuIconWrapper":"wnUb-dV","menuButton":"cjbOxWe","itemNavButton":"-sx0jrx","scale":"EDlp5Zf"};
 
 const ItemMenu = ({ item, menu }) => {
+    const { isWinCashBackTheme: winCashBackTheme } = React.useContext(navigationProfileButton.NavigationContext);
     const { containerRef, onButtonMouseDown, onClose } = navigationProfileButton.useCSSFocusPopupHelper({
         allowBgScroll: true,
     });
     const isInit = useIsInit.useIsInit();
     if (!item.popupType && item.link) {
-        return (React__default["default"].createElement(NewWrapper, { isNew: item.isNew },
-            React__default["default"].createElement("a", { className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''}`, tabIndex: 0, href: item.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link },
-                React__default["default"].createElement("div", { "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, className: styles$1.menuButton }, item.name))));
+        return (React__namespace["default"].createElement(NewWrapper, { isNew: item.isNew },
+            React__namespace["default"].createElement("a", { className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''}`, tabIndex: 0, href: item.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link },
+                React__namespace["default"].createElement("div", { "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, className: styles$2.menuButton }, item.name))));
     }
-    return (React__default["default"].createElement(NewWrapper, { isNew: item.isNew },
-        React__default["default"].createElement("div", { ref: containerRef, className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''}`, tabIndex: 0, key: item.id, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link },
-            React__default["default"].createElement("div", { "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, onMouseDown: onButtonMouseDown, className: styles$1.menuButton },
+    return (React__namespace["default"].createElement(NewWrapper, { isNew: item.isNew },
+        React__namespace["default"].createElement("div", { ref: containerRef, className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''}`, tabIndex: 0, key: item.id, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, style: { borderBottom: winCashBackTheme ? 'none' : undefined } },
+            React__namespace["default"].createElement("div", { "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, onMouseDown: onButtonMouseDown, className: styles$2.menuButton, style: { color: winCashBackTheme ? 'white' : undefined } },
                 item.name,
-                item.popupType && (React__default["default"].createElement(React__default["default"].Fragment, null, (item === null || item === void 0 ? void 0 : item.icon) ? (React__default["default"].createElement("div", { className: "wrapper-menu-icon" },
-                    React__default["default"].createElement("div", { className: "origin-icon" }, item.icon),
-                    React__default["default"].createElement("div", { className: "close-icon", onClick: onClose },
-                        React__default["default"].createElement(core.Close, { size: 16 })))) : (React__default["default"].createElement("div", { className: styles$1.menuIconWrapper },
-                    React__default["default"].createElement("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none" },
-                        React__default["default"].createElement("path", { d: "M11.5 7.5L9 10L6.5 7.5", stroke: "#202135", strokeWidth: "1.33", strokeLinecap: "round", strokeLinejoin: "round" }))))))),
-            React__default["default"].isValidElement(menu)
-                ? React__default["default"].cloneElement(menu, {
+                item.popupType && (React__namespace["default"].createElement(React__namespace["default"].Fragment, null, (item === null || item === void 0 ? void 0 : item.icon) ? (React__namespace["default"].createElement("div", { className: "wrapper-menu-icon" },
+                    React__namespace["default"].createElement("div", { className: "origin-icon", style: {
+                            filter: winCashBackTheme
+                                ? 'brightness(0) invert(1)'
+                                : undefined,
+                        } }, item.icon),
+                    React__namespace["default"].createElement("div", { className: "close-icon", onClick: onClose },
+                        React__namespace["default"].createElement(core.Close, { size: 16, color: winCashBackTheme ? 'white' : undefined })))) : (React__namespace["default"].createElement("div", { className: styles$2.menuIconWrapper },
+                    React__namespace["default"].createElement("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none" },
+                        React__namespace["default"].createElement("path", { d: "M11.5 7.5L9 10L6.5 7.5", stroke: winCashBackTheme ? 'white' : '#202135', strokeWidth: "1.33", strokeLinecap: "round", strokeLinejoin: "round" }))))))),
+            React__namespace["default"].isValidElement(menu)
+                ? React__namespace["default"].cloneElement(menu, {
                     onClose,
                 })
                 : null)));
@@ -433,59 +266,13 @@ const ItemMenu = ({ item, menu }) => {
 const NewWrapper = ({ isNew, children, }) => {
     const { t } = index$1.useTranslations();
     if (isNew) {
-        return (React__default["default"].createElement(index$6.Indicator, { color: "green", label: t('home.navigator.menuItem.new'), size: 20, styles: {
+        return (React__namespace["default"].createElement(index$5.Indicator, { color: "green", label: t('home.navigator.menuItem.new'), size: 20, styles: {
                 root: {
                     paddingRight: 10,
                 },
             } }, children));
     }
-    return React__default["default"].createElement(React__default["default"].Fragment, null, children);
-};
-
-const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuItems, headingTitle, activeItem, }) => {
-    const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
-    const { t } = index$1.useTranslations();
-    const theme = core$1.useMantineTheme();
-    return (React__default["default"].createElement(StyledItemGridLeft, null,
-        React__default["default"].createElement("div", null,
-            React__default["default"].createElement(StyledHeading$1, null,
-                React__default["default"].createElement(index$7.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, headingTitle)), menuItems === null || menuItems === void 0 ? void 0 :
-            menuItems.slice(0, 6).map((item, index) => {
-                const href = (item === null || item === void 0 ? void 0 : item.link)
-                    ? (item === null || item === void 0 ? void 0 : item.link.startsWith('http'))
-                        ? item === null || item === void 0 ? void 0 : item.link
-                        : `${UrlFE}/${item === null || item === void 0 ? void 0 : item.link.split('/').filter(Boolean).join('/')}/`
-                    : '/';
-                return (React__default["default"].createElement(StyledItem$6, Object.assign({ className: core$1.clsx('iconMenu', `itemMenu-${item.id}`), "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": href, "data-is-heading-category": false, "data-active": item.id && item.id === activeItem, "data-is-mobile-tool": item.isMobileAppTool, href: href }, (!index$8.isInternalLink(href) && {
-                    target: '_blank',
-                }), { "data-theme": siteType, key: index, onClick: onClosePopup }),
-                    React__default["default"].createElement("div", { className: "icon" },
-                        React__default["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.thumbnail || '/images/avatar.jpg', style: {
-                                width: 32,
-                                height: 32,
-                                maxWidth: 32,
-                                maxHeight: 32,
-                                overflow: 'hidden',
-                            } })),
-                    React__default["default"].createElement(NewWrapper, { isNew: item.isNew },
-                        React__default["default"].createElement("div", { style: {
-                                padding: '0 0.4rem',
-                                paddingRight: item.isNew ? 10 : 0,
-                            } },
-                            React__default["default"].createElement("p", { className: "name" }, item.name),
-                            item.isMobileAppTool && (React__default["default"].createElement(index$4.Text, { size: "n1", color: theme.fn.primaryColor(), weight: "regular" }, t('home.calcWithApp'))))),
-                    item.isMobileAppTool && (React__default["default"].createElement(StyledIconNav, null,
-                        React__default["default"].createElement(Phone, { className: "phone-icon", size: 16 }))),
-                    React__default["default"].createElement(StyledIconNav, { className: "arrow-icon" },
-                        React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('chevronRight.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" }))));
-            })),
-        titleBtnViewMore && (React__default["default"].createElement(StyledViewMore$1, { "data-theme": siteType, style: { textDecoration: 'none' }, href: hrefViewMore, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": hrefViewMore },
-            React__default["default"].createElement(StyledItemAll, { onClick: onClosePopup, "data-theme": siteType, "data-is-heading-category": false },
-                titleBtnViewMore,
-                React__default["default"].createElement(StyledImageWrapper, null,
-                    React__default["default"].createElement("img", { className: "svg", src: siteType === 'marryBaby'
-                            ? index$5.CommonGAssets.getAssetPath('chevronRightPink.svg')
-                            : index$5.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))))));
+    return React__namespace["default"].createElement(React__namespace["default"].Fragment, null, children);
 };
 
 const StyledContainerItems$5 = styled__default["default"].div `
@@ -585,7 +372,7 @@ const StyledContentWrapper$2 = miscDefaultClassWrapper.setDefaultClass(styled__d
       gap: 4px;
     }
   `, 'hhgcomp-navigation-menucareitem-contentwrapper');
-const StyledItem$5 = styled__default["default"].a `
+const StyledItem$6 = styled__default["default"].a `
   text-decoration: none;
   border-radius: 4px;
   background: ${miscTheme.theme.colors.white};
@@ -656,17 +443,17 @@ const Item$4 = ({ item, index = 0 }) => {
     if (!item)
         return null;
     const href = `${statics.CARE_URL_FE}/${(_a = constants$1.LOCALIZED_SLUGS[locale]) === null || _a === void 0 ? void 0 : _a.HOSPITAL}/${item.slug}-${item.id}`;
-    return (React__default["default"].createElement(StyledItem$5, { key: item.id, href: href, "data-event-category": "Hamburger Navigation", "data-event-action": `Care Click ${index + 1}`, "data-event-label": href },
-        React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('navCareCardBg.svg'), alt: "", className: "bg-svg", loading: "lazy" }),
-        React__default["default"].createElement(StyledImageCard$3, null,
-            React__default["default"].createElement(StyledImageCardInner, null,
-                React__default["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.logo || '/images/avatar.jpg' }))),
-        React__default["default"].createElement(StyledContentWrapper$2, null,
-            React__default["default"].createElement(StyledTitle$5, null, item.name),
-            React__default["default"].createElement(StyledDes$2, null, item.description),
-            React__default["default"].createElement(StyledBtnView$2, null,
+    return (React__namespace["default"].createElement(StyledItem$6, { key: item.id, href: href, "data-event-category": "Hamburger Navigation", "data-event-action": `Care Click ${index + 1}`, "data-event-label": href },
+        React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('navCareCardBg.svg'), alt: "", className: "bg-svg", loading: "lazy" }),
+        React__namespace["default"].createElement(StyledImageCard$3, null,
+            React__namespace["default"].createElement(StyledImageCardInner, null,
+                React__namespace["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.logo || '/images/avatar.jpg' }))),
+        React__namespace["default"].createElement(StyledContentWrapper$2, null,
+            React__namespace["default"].createElement(StyledTitle$5, null, item.name),
+            React__namespace["default"].createElement(StyledDes$2, null, item.description),
+            React__namespace["default"].createElement(StyledBtnView$2, null,
                 t('home.seeMore'),
-                React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
+                React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
                         width: '16px',
                         height: '16px',
                         marginTop: '3px',
@@ -742,18 +529,18 @@ const StyledLeft = styled__default["default"].div `
 
 const SpotlightNoData = ({ title, link, description, cta, icon }) => {
     const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(StyledContainerNoPosts, { "data-theme": siteType },
-        React__default["default"].createElement(StyledLeft, null,
-            React__default["default"].createElement("img", { src: siteType === 'marryBaby'
-                    ? index$5.CommonGAssets.getAssetPath('navMBSpotlightBgNoData.svg')
-                    : index$5.CommonGAssets.getAssetPath('navSpotlightBgNoData.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
-            React__default["default"].createElement(StyledContentLeft, null, icon && React__default["default"].createElement("img", { src: icon, width: 64, height: 64, loading: "lazy" }))),
-        React__default["default"].createElement("div", null,
-            title && React__default["default"].createElement(StyledTitle$4, null, title),
-            description && React__default["default"].createElement(StyledDescription, null, description),
-            cta && (React__default["default"].createElement("div", null,
-                React__default["default"].createElement("a", { href: link },
-                    React__default["default"].createElement(index$9.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, cta)))))));
+    return (React__namespace["default"].createElement(StyledContainerNoPosts, { "data-theme": siteType },
+        React__namespace["default"].createElement(StyledLeft, null,
+            React__namespace["default"].createElement("img", { src: siteType === 'marryBaby'
+                    ? index$6.CommonGAssets.getAssetPath('navMBSpotlightBgNoData.svg')
+                    : index$6.CommonGAssets.getAssetPath('navSpotlightBgNoData.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
+            React__namespace["default"].createElement(StyledContentLeft, null, icon && React__namespace["default"].createElement("img", { src: icon, width: 64, height: 64, loading: "lazy" }))),
+        React__namespace["default"].createElement("div", null,
+            title && React__namespace["default"].createElement(StyledTitle$4, null, title),
+            description && React__namespace["default"].createElement(StyledDescription, null, description),
+            cta && (React__namespace["default"].createElement("div", null,
+                React__namespace["default"].createElement("a", { href: link },
+                    React__namespace["default"].createElement(index$7.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, cta)))))));
 };
 
 const StyledItemGridRight = styled__default["default"].div `
@@ -773,11 +560,11 @@ const StyledItemGridRight = styled__default["default"].div `
     }
   }
 `;
-const StyledHeading = styled__default["default"].div `
+const StyledHeading$1 = styled__default["default"].div `
   margin: 15px 0;
   display: flex;
 `;
-const StyledViewMore = styled__default["default"].a `
+const StyledViewMore$1 = styled__default["default"].a `
   padding-left: 10px;
   display: flex;
   align-items: center;
@@ -798,42 +585,31 @@ const StyledViewMore = styled__default["default"].a `
 
 const Spotlights = ({ title, viewMore, children, link, dataEventAction = '', }) => {
     const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(StyledItemGridRight, null,
-        React__default["default"].createElement(StyledHeading, null,
-            React__default["default"].createElement(index$7.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, title),
-            viewMore && (React__default["default"].createElement(StyledViewMore, { "data-event-category": "Hamburger Navigation", "data-event-action": dataEventAction, "data-event-label": link, href: link, "data-theme": siteType },
+    return (React__namespace["default"].createElement(StyledItemGridRight, null,
+        React__namespace["default"].createElement(StyledHeading$1, null,
+            React__namespace["default"].createElement(index$8.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, title),
+            viewMore && (React__namespace["default"].createElement(StyledViewMore$1, { "data-event-category": "Hamburger Navigation", "data-event-action": dataEventAction, "data-event-label": link, href: link, "data-theme": siteType },
                 viewMore,
-                React__default["default"].createElement("img", { src: siteType === 'marryBaby'
-                        ? index$5.CommonGAssets.getAssetPath('chevronRightPink.svg')
-                        : index$5.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))),
+                React__namespace["default"].createElement("img", { src: siteType === 'marryBaby'
+                        ? index$6.CommonGAssets.getAssetPath('chevronRightPink.svg')
+                        : index$6.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))),
         children));
 };
 
 const CareSpotlights = ({ spotlights = [], hrefViewMore }) => {
     const { t } = index$1.useTranslations();
     const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlightHospitals') }, spotlights.length !== 0 ? (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(StyledContainerItems$5, null, spotlights === null || spotlights === void 0 ? void 0 : spotlights.slice(0, 3).map((s, index) => (React__default["default"].createElement(Item$4, { key: index, index: index, item: s })))),
-        React__default["default"].createElement("div", { style: {
+    return (React__namespace["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlightHospitals') }, spotlights.length !== 0 ? (React__namespace["default"].createElement(React__namespace["default"].Fragment, null,
+        React__namespace["default"].createElement(StyledContainerItems$5, null, spotlights === null || spotlights === void 0 ? void 0 : spotlights.slice(0, 3).map((s, index) => (React__namespace["default"].createElement(Item$4, { key: index, index: index, item: s })))),
+        React__namespace["default"].createElement("div", { style: {
                 position: 'absolute',
                 bottom: '6px',
                 right: '1rem',
             } },
-            React__default["default"].createElement("a", { href: hrefViewMore },
-                React__default["default"].createElement(index$9.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, t('home.navigator.menu.care.homeButton')))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.care.noDatas.title'), description: t('home.navigator.menu.care.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.care.homeButton'), icon: index$5.CommonGAssets.getAssetPath('community.svg') }))));
+            React__namespace["default"].createElement("a", { href: hrefViewMore },
+                React__namespace["default"].createElement(index$7.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, t('home.navigator.menu.care.homeButton')))))) : (React__namespace["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.care.noDatas.title'), description: t('home.navigator.menu.care.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.care.homeButton'), icon: index$6.CommonGAssets.getAssetPath('community.svg') }))));
 };
 
-const StyledContainerItems$4 = styled__default["default"].div `
-  display: grid;
-
-  grid-template-columns: repeat(4, 1fr);
-  gap: 24px;
-  ${utils.MediaQueries.tdDown} {
-    gap: 12px;
-    grid-template-columns: 1fr;
-  }
-`;
-
 const TOGETHER_PATHS = {
     COMMUNITIES: 'community?website_url={websiteUrl}',
     MENU_TOPIC: 'topic?community_id={communityId}&website_url={websiteUrl}',
@@ -1014,7 +790,7 @@ const formatVideoItem = (data) => {
         videoId: data.video_id || '',
         url: data.video_url || '',
         title: data.video_title || '',
-        type: data.type || index$a.VideoType.VIDEO,
+        type: data.type || index$9.VideoType.VIDEO,
         totalView: data.total_view || 0,
         description: data.description || '',
         createTime: data.create_time || '',
@@ -1073,28 +849,251 @@ function hsbToRgb(h, s, b) {
     return [255 * f(5), 255 * f(3), 255 * f(1)];
 }
 
-const StyledItem$4 = styled__default["default"].a `
-  position: relative;
-  width: 100%;
-  display: flex;
-  align-items: center;
-  text-decoration: none;
+var styles$1 = {"gridContainer":"q3nL5cp","container":"_2DNf80G","closeWrapper":"Q-glX-n"};
 
-  * {
-    pointer-events: none;
-  }
-`;
-const StyledImageCard$2 = styled__default["default"].div `
-  border-radius: 5px;
-  display: block;
-  overflow: hidden;
-  padding-top: 140%;
-  width: 100%;
-  position: relative;
-  height: 0;
-  img {
-    position: absolute;
-    width: 100%;
+const BtnClosePopup = ({ onClosePopup }) => {
+    return (React__namespace["default"].createElement("div", { className: `${styles$1.closeWrapper} close-btn`, onClick: onClosePopup },
+        React__namespace["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
+            React__namespace["default"].createElement("path", { d: "M18 6L6 18M18 18L6 6", stroke: "#3E3F58", strokeWidth: "1.3", strokeLinecap: "round" }))));
+};
+
+const PopupWrapper = ({ onClosePopup, isDisplay, children, isNavMenu, hideCloseBtn, stylesContainer, }) => {
+    return (React__namespace["default"].createElement("div", { className: "hhgcomp-navigation-popupwrapper-menuwrapper top-menu-health-tools", "data-is-display": !!isDisplay, "data-is-nav-menu": !!isNavMenu },
+        React__namespace["default"].createElement(index$a.Container, { className: "hhgcomp-navigation-popupwrapper-menuwrapper-child" },
+            !hideCloseBtn && (React__namespace["default"].createElement("div", { className: styles$1.container },
+                React__namespace["default"].createElement(BtnClosePopup, { onClosePopup: onClosePopup }))),
+            React__namespace["default"].createElement(index$a.Container, { className: styles$1.gridContainer, style: stylesContainer }, children))));
+};
+
+const Phone = (_a) => {
+    var { size = 24, color = miscTheme.theme.colors.neutral600 } = _a, rest = tslib_es6.__rest(_a, ["size", "color"]);
+    return (React__namespace["default"].createElement("svg", Object.assign({ width: size, height: size, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, rest),
+        React__namespace["default"].createElement("path", { d: "M6.088 18.75q-.63 0-1.068-.437a1.45 1.45 0 0 1-.438-1.07V2.757q0-.63.438-1.068a1.45 1.45 0 0 1 1.068-.438h7.82q.633 0 1.07.438.437.437.437 1.068v14.488q0 .63-.437 1.069a1.45 1.45 0 0 1-1.07.437zm3.91-1.859a.7.7 0 0 0 .522-.216.7.7 0 0 0 .216-.521.7.7 0 0 0-.216-.522.7.7 0 0 0-.521-.215.7.7 0 0 0-.522.215.7.7 0 0 0-.215.522.7.7 0 0 0 .215.521.7.7 0 0 0 .522.216m-4.166-3.333h8.333V4.792H5.832z", fill: color })));
+};
+
+const StyledItemGridLeft = styled__default["default"].div `
+  padding-right: 1rem;
+  background: #ffffff;
+  padding: 5px 15px;
+  ${utils.MediaQueries.mbUp} {
+    border-right: 1px solid #e4e8ec;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+  }
+`;
+const StyledItem$5 = styled__default["default"].a `
+  padding: 10px 0;
+  position: relative;
+
+  display: flex;
+  align-items: center;
+  &[data-is-mobile-tool='true'] {
+    align-items: flex-start;
+    .name,
+    .phone-icon {
+      margin-top: 4px;
+    }
+  }
+  text-decoration: none;
+  color: ${miscTheme.theme.colors.gray800};
+  * {
+    pointer-events: none;
+  }
+  .name {
+    font-size: 16px;
+    font-weight: 400;
+  }
+
+  &[data-theme='marryBaby']:hover,
+  &[data-theme='marryBaby'][data-active='true'] {
+    p {
+      color: ${miscTheme.theme.mbColors.pink};
+    }
+    .icon {
+      background-color: ${miscTheme.theme.mbColors.lightPink};
+    }
+  }
+  &[data-theme='helloSites']:hover,
+  &[data-theme='helloSites'][data-active='true'] {
+    p {
+      color: ${miscTheme.theme.colors.primaryActive};
+    }
+  }
+  a {
+  }
+
+  &[data-theme='marryBaby'] {
+    .icon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      max-width: 40px;
+      width: 100%;
+      height: 40px;
+      border-radius: 50%;
+      background-color: ${miscTheme.theme.mbColors.lightGray};
+      img {
+        border-radius: 50%;
+      }
+    }
+  }
+`;
+const StyledHeading = styled__default["default"].div `
+  margin: 15px 0;
+  ${utils.MediaQueries.mbDown} {
+    display: none;
+  }
+`;
+const StyledIconNav = styled__default["default"].div `
+  display: flex;
+  position: absolute;
+  right: 0;
+  ${utils.MediaQueries.mbUp} {
+    &.arrow-icon {
+      display: none;
+    }
+  }
+`;
+const StyledItemAll = styled__default["default"].div `
+  display: flex;
+  align-items: center;
+  color: ${miscTheme.theme.colors.primaryBase};
+  font-size: ${miscTheme.theme.sizes.fsParagraph4};
+  font-weight: ${miscTheme.theme.sizes.fwBold};
+  line-height: 24px;
+  font-size: 14px;
+  font-weight: 600;
+  &[data-theme='marryBaby'] {
+    color: ${miscTheme.theme.mbColors.pink};
+  }
+`;
+const StyledImageWrapper = styled__default["default"].div `
+  display: flex;
+  align-items: center;
+  margin-left: 10px;
+`;
+const StyledViewMore = styled__default["default"].a `
+  border: 1px solid ${miscTheme.theme.colors.primaryBase};
+  &[data-theme='marryBaby'] {
+    border: 1px solid ${miscTheme.theme.mbColors.pink};
+
+    svg path {
+      stroke: ${miscTheme.theme.mbColors.pink};
+    }
+  }
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 6px;
+  border-radius: 5px;
+  margin-top: 20px;
+  ${utils.MediaQueries.mbDown} {
+    display: none;
+  }
+`;
+
+const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuItems, headingTitle, activeItem, }) => {
+    const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
+    const { t } = index$1.useTranslations();
+    const theme = core$1.useMantineTheme();
+    return (React__namespace["default"].createElement(StyledItemGridLeft, null,
+        React__namespace["default"].createElement("div", null,
+            React__namespace["default"].createElement(StyledHeading, null,
+                React__namespace["default"].createElement(index$8.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, headingTitle)), menuItems === null || menuItems === void 0 ? void 0 :
+            menuItems.slice(0, 6).map((item, index) => {
+                const href = (item === null || item === void 0 ? void 0 : item.link)
+                    ? (item === null || item === void 0 ? void 0 : item.link.startsWith('http'))
+                        ? item === null || item === void 0 ? void 0 : item.link
+                        : `${UrlFE}/${item === null || item === void 0 ? void 0 : item.link.split('/').filter(Boolean).join('/')}/`
+                    : '/';
+                return (React__namespace["default"].createElement(StyledItem$5, Object.assign({ className: core$1.clsx('iconMenu', `itemMenu-${item.id}`), "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": href, "data-is-heading-category": false, "data-active": item.id && item.id === activeItem, "data-is-mobile-tool": item.isMobileAppTool, href: href }, (!index$b.isInternalLink(href) && {
+                    target: '_blank',
+                }), { "data-theme": siteType, key: index, onClick: onClosePopup }),
+                    React__namespace["default"].createElement("div", { className: "icon" },
+                        React__namespace["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.thumbnail || '/images/avatar.jpg', style: {
+                                width: 32,
+                                height: 32,
+                                maxWidth: 32,
+                                maxHeight: 32,
+                                overflow: 'hidden',
+                            } })),
+                    React__namespace["default"].createElement(NewWrapper, { isNew: item.isNew },
+                        React__namespace["default"].createElement("div", { style: {
+                                padding: '0 0.4rem',
+                                paddingRight: item.isNew ? 10 : 0,
+                            } },
+                            React__namespace["default"].createElement("p", { className: "name" }, item.name),
+                            item.isMobileAppTool && (React__namespace["default"].createElement(index$4.Text, { size: "n1", color: theme.fn.primaryColor(), weight: "regular" }, t('home.calcWithApp'))))),
+                    item.isMobileAppTool && (React__namespace["default"].createElement(StyledIconNav, null,
+                        React__namespace["default"].createElement(Phone, { className: "phone-icon", size: 16 }))),
+                    React__namespace["default"].createElement(StyledIconNav, { className: "arrow-icon" },
+                        React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('chevronRight.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" }))));
+            })),
+        titleBtnViewMore && (React__namespace["default"].createElement(StyledViewMore, { "data-theme": siteType, style: { textDecoration: 'none' }, href: hrefViewMore, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": hrefViewMore },
+            React__namespace["default"].createElement(StyledItemAll, { onClick: onClosePopup, "data-theme": siteType, "data-is-heading-category": false },
+                titleBtnViewMore,
+                React__namespace["default"].createElement(StyledImageWrapper, null,
+                    React__namespace["default"].createElement("img", { className: "svg", src: siteType === 'marryBaby'
+                            ? index$6.CommonGAssets.getAssetPath('chevronRightPink.svg')
+                            : index$6.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))))));
+};
+
+const MenuCareList = ({ careSpecialties = [], isOpen, onClose, spotlights = [], }) => {
+    var _a;
+    const { t } = index$1.useTranslations();
+    const { locale, configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
+    return (React__namespace["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
+        React__namespace["default"].createElement(Categories, { headingTitle: t('home.navigator.menuItem.specialties'), hrefViewMore: `${statics.CARE_URL_FE}/`, UrlFE: statics.CARE_URL_FE, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allSpecialties'), menuItems: (careSpecialties === null || careSpecialties === void 0 ? void 0 : careSpecialties.map((specialty) => {
+                if (!specialty)
+                    return {};
+                return {
+                    name: String(specialty.name) || '',
+                    link: getCareSearchUrl({
+                        type: 'DOCTOR',
+                        specialtySlug: specialty.slug,
+                        locale,
+                    }),
+                    thumbnail: (specialty === null || specialty === void 0 ? void 0 : specialty.thumbnail) || '',
+                };
+            })) || [] }),
+        React__namespace["default"].createElement(CareSpotlights, { spotlights: spotlights, hrefViewMore: `${statics.CARE_URL_FE}/${(_a = constants$1.LOCALIZED_SLUGS[locale]) === null || _a === void 0 ? void 0 : _a.SPECIALTIES}/` })));
+};
+
+const StyledContainerItems$4 = styled__default["default"].div `
+  display: grid;
+
+  grid-template-columns: repeat(4, 1fr);
+  gap: 24px;
+  ${utils.MediaQueries.tdDown} {
+    gap: 12px;
+    grid-template-columns: 1fr;
+  }
+`;
+
+const StyledItem$4 = styled__default["default"].a `
+  position: relative;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  text-decoration: none;
+
+  * {
+    pointer-events: none;
+  }
+`;
+const StyledImageCard$2 = styled__default["default"].div `
+  border-radius: 5px;
+  display: block;
+  overflow: hidden;
+  padding-top: 140%;
+  width: 100%;
+  position: relative;
+  height: 0;
+  img {
+    position: absolute;
+    width: 100%;
     height: 100%;
     display: block;
     object-fit: cover;
@@ -1178,28 +1177,44 @@ const Item$3 = ({ item, index = 0 }) => {
         'data-event-action': `Spotlight Click ${index + 1}`,
         'data-event-label': item.link,
     };
-    return (React__default["default"].createElement(StyledItem$4, Object.assign({ key: item.id }, linkProps),
-        React__default["default"].createElement(StyledImageCard$2, null,
-            React__default["default"].createElement("img", { loading: "lazy", alt: item.title, src: item.banner || '/images/notFound-min-small.jpg' })),
-        React__default["default"].createElement("div", { style: {
+    return (React__namespace["default"].createElement(StyledItem$4, Object.assign({ key: item.id }, linkProps),
+        React__namespace["default"].createElement(StyledImageCard$2, null,
+            React__namespace["default"].createElement("img", { loading: "lazy", alt: item.title, src: item.banner || '/images/notFound-min-small.jpg' })),
+        React__namespace["default"].createElement("div", { style: {
                 display: 'flex',
                 flexDirection: 'column',
                 gap: 8,
             } },
-            React__default["default"].createElement(StyledTitle$3, null, item.title),
-            !!item.buttonDisplay && (React__default["default"].createElement(StyledButton, Object.assign({ bgColor: item.buttonDisplay.button_background_color, textColor: item.buttonDisplay.button_text_color }, linkProps), item.buttonDisplay.button_label)))));
+            React__namespace["default"].createElement(StyledTitle$3, null, item.title),
+            !!item.buttonDisplay && (React__namespace["default"].createElement(StyledButton, Object.assign({ bgColor: item.buttonDisplay.button_background_color, textColor: item.buttonDisplay.button_text_color }, linkProps), item.buttonDisplay.button_label)))));
 };
 
 const CategorySpotlights = ({ spotlightsList = [], hrefViewMore }) => {
     const { t } = index$1.useTranslations();
     const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlights'), viewMore: t('home.navigator.menu.spotlights.seeAll'), link: hrefViewMore, dataEventAction: "Spotlight See More Click" }, spotlightsList.length !== 0 ? (React__default["default"].createElement(StyledContainerItems$4, null, spotlightsList === null || spotlightsList === void 0 ? void 0 : spotlightsList.slice(0, 4).map((spotlight, index) => (React__default["default"].createElement(Item$3, { key: index, index: index, item: {
+    return (React__namespace["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlights'), viewMore: t('home.navigator.menu.spotlights.seeAll'), link: hrefViewMore, dataEventAction: "Spotlight See More Click" }, spotlightsList.length !== 0 ? (React__namespace["default"].createElement(StyledContainerItems$4, null, spotlightsList === null || spotlightsList === void 0 ? void 0 : spotlightsList.slice(0, 4).map((spotlight, index) => (React__namespace["default"].createElement(Item$3, { key: index, index: index, item: {
             id: spotlight.id,
             link: statics.HOME_PAGE_URL + spotlight.permalink,
             title: spotlight.name,
             banner: spotlight.image,
             buttonDisplay: spotlight.buttonDisplay,
-        } }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.category.noDatas.cta'), icon: index$5.CommonGAssets.getAssetPath('Spotlight.svg') }))));
+        } }))))) : (React__namespace["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.category.noDatas.cta'), icon: index$6.CommonGAssets.getAssetPath('Spotlight.svg') }))));
+};
+
+const MenuCategoriesList = ({ categories = [], spotlightsList = [], onClose, isOpen, }) => {
+    const { t } = index$1.useTranslations();
+    const { locale, configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
+    return (React__namespace["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
+        React__namespace["default"].createElement(Categories, { hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/categories/`, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allCategories'), menuItems: (categories === null || categories === void 0 ? void 0 : categories.map((cat) => {
+                if (!cat)
+                    return {};
+                return {
+                    name: cat.displayName || null,
+                    link: (cat === null || cat === void 0 ? void 0 : cat.customizedUrl) || (cat === null || cat === void 0 ? void 0 : cat.permalink) || '/',
+                    thumbnail: cat.iconUrl || null,
+                };
+            })) || [], headingTitle: t('home.navigator.menuItem.healthCategories') }),
+        React__namespace["default"].createElement(CategorySpotlights, { spotlightsList: spotlightsList, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/spotlight/` })));
 };
 
 const StyledContainerItems$3 = styled__default["default"].div `
@@ -1334,81 +1349,46 @@ const Item$2 = ({ post, index = 0 }) => {
             : null
         : null;
     const timeText = cleanedTimeDate ? dayjs__default["default"](cleanedTimeDate).toNow(true) : time;
-    return (React__default["default"].createElement(StyledItem$3, { href: postUrl, "data-event-category": "Hamburger Navigation", "data-event-action": `Together Click ${index + 1}`, "data-event-label": postUrl },
-        React__default["default"].createElement(StyledContent$1, null,
-            React__default["default"].createElement(StyledInfoUser, null,
-                React__default["default"].createElement(index$b.UserAvatar, { avatar: (_b = post.author) === null || _b === void 0 ? void 0 : _b.avatar, username: ((_c = post.author) === null || _c === void 0 ? void 0 : _c.name) || ((_d = post.author) === null || _d === void 0 ? void 0 : _d.username) }),
-                React__default["default"].createElement(StyledWrapInfo, null,
-                    React__default["default"].createElement(StyledName, { "data-theme": siteType }, (_e = post.author) === null || _e === void 0 ? void 0 : _e.name),
-                    React__default["default"].createElement(StyledInfo, null,
-                        React__default["default"].createElement(StyledCategory, { "data-event-category": "Hamburger Navigation", "data-event-action": `Topic Click ${index + 1}`, "data-event-label": communityUrl, onClick: (e) => {
+    return (React__namespace["default"].createElement(StyledItem$3, { href: postUrl, "data-event-category": "Hamburger Navigation", "data-event-action": `Together Click ${index + 1}`, "data-event-label": postUrl },
+        React__namespace["default"].createElement(StyledContent$1, null,
+            React__namespace["default"].createElement(StyledInfoUser, null,
+                React__namespace["default"].createElement(index$c.UserAvatar, { avatar: (_b = post.author) === null || _b === void 0 ? void 0 : _b.avatar, username: ((_c = post.author) === null || _c === void 0 ? void 0 : _c.name) || ((_d = post.author) === null || _d === void 0 ? void 0 : _d.username) }),
+                React__namespace["default"].createElement(StyledWrapInfo, null,
+                    React__namespace["default"].createElement(StyledName, { "data-theme": siteType }, (_e = post.author) === null || _e === void 0 ? void 0 : _e.name),
+                    React__namespace["default"].createElement(StyledInfo, null,
+                        React__namespace["default"].createElement(StyledCategory, { "data-event-category": "Hamburger Navigation", "data-event-action": `Topic Click ${index + 1}`, "data-event-label": communityUrl, onClick: (e) => {
                                 e.preventDefault();
                                 location.href = communityUrl;
                             }, "data-theme": siteType }, (_f = post.community) === null || _f === void 0 ? void 0 : _f.name),
-                        React__default["default"].createElement(StyledDot, null, "\u2022"),
-                        React__default["default"].createElement(StyledModifiedTime, { "data-theme": siteType }, timeText)))),
-            React__default["default"].createElement(StyledTitle$2, null, post.title)),
-        !!((_g = post.photos) === null || _g === void 0 ? void 0 : _g.length) && (React__default["default"].createElement(StyledImage, { loading: "lazy", src: post.photos[0] }))));
+                        React__namespace["default"].createElement(StyledDot, null, "\u2022"),
+                        React__namespace["default"].createElement(StyledModifiedTime, { "data-theme": siteType }, timeText)))),
+            React__namespace["default"].createElement(StyledTitle$2, null, post.title)),
+        !!((_g = post.photos) === null || _g === void 0 ? void 0 : _g.length) && (React__namespace["default"].createElement(StyledImage, { loading: "lazy", src: post.photos[0] }))));
 };
 
 const CommunitySpotlights = ({ spotlights = [] }) => {
     const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
     const { t } = index$1.useTranslations();
-    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.trendingPosts'), viewMore: t('home.navigator.menu.trendingPosts.seeMore'), link: normalizeLink.normalizeLink(statics.TOGETHER_URL_FE), dataEventAction: "Together See More Click" }, spotlights.length !== 0 ? (React__default["default"].createElement(StyledContainerItems$3, null, spotlights === null || spotlights === void 0 ? void 0 : spotlights.slice(0, 4).map((p, index) => (React__default["default"].createElement(Item$2, { index: index, post: p, key: p.id }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.together.noPosts.title'), description: t('home.navigator.menu.together.noPosts.description'), link: `${statics.HOME_PAGE_URL}/community/`, cta: t('home.navigator.menu.together.noPosts.cta'), icon: index$5.CommonGAssets.getAssetPath('community.svg') }))));
-};
-
-const StyledContainerItems$2 = styled__default["default"].div `
-  display: grid;
-
-  grid-template-columns: repeat(3, 1fr);
-  gap: 24px;
-  margin-bottom: 3.5rem;
-  ${utils.MediaQueries.tdDown} {
-    grid-template-columns: repeat(1, 1fr);
-  }
-`;
-
-const StyledItem$2 = styled__default["default"].a `
-  text-decoration: none;
-  display: flex;
-  align-items: center;
-`;
-
-const Item$1 = ({ item, index = 0 }) => {
-    if (!item)
-        return null;
-    return (React__default["default"].createElement(StyledItem$2, { href: item.url, "data-event-category": "Hamburger Navigation", "data-event-action": `Care Click ${index + 1}`, "data-event-label": item.url },
-        React__default["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.featuredImage || '/images/avatar.jpg', style: {
-                width: '40px',
-                height: '40px',
-            } }),
-        React__default["default"].createElement(index$4.Text, { size: "p2", weight: "regular", style: {
-                marginLeft: 16,
-            } }, item.name),
-        React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
-                width: '20px',
-                height: '20px',
-                marginLeft: 'auto',
-            }, loading: "lazy" })));
+    return (React__namespace["default"].createElement(Spotlights, { title: t('home.navigator.menu.trendingPosts'), viewMore: t('home.navigator.menu.trendingPosts.seeMore'), link: normalizeLink.normalizeLink(statics.TOGETHER_URL_FE), dataEventAction: "Together See More Click" }, spotlights.length !== 0 ? (React__namespace["default"].createElement(StyledContainerItems$3, null, spotlights === null || spotlights === void 0 ? void 0 : spotlights.slice(0, 4).map((p, index) => (React__namespace["default"].createElement(Item$2, { index: index, post: p, key: p.id }))))) : (React__namespace["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.together.noPosts.title'), description: t('home.navigator.menu.together.noPosts.description'), link: `${statics.HOME_PAGE_URL}/community/`, cta: t('home.navigator.menu.together.noPosts.cta'), icon: index$6.CommonGAssets.getAssetPath('community.svg') }))));
 };
 
-const EcomSpotlights = ({ helpfulUrls = [], }) => {
+const MenuCommunitiesList = ({ communities = [], onClose, isOpen, spotlights = [], }) => {
     const { t } = index$1.useTranslations();
-    // const { siteType } = useContext(NavigationContext)
-    if (!helpfulUrls.length)
-        return null;
-    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlightEcom') }, helpfulUrls.length !== 0 ? (React__default["default"].createElement(StyledContainerItems$2, null, helpfulUrls === null || helpfulUrls === void 0 ? void 0 : helpfulUrls.slice(0, 5).map((s, index) => (React__default["default"].createElement(Item$1, { key: index, index: index, item: s }))))) : (React__default["default"].createElement(React__default["default"].Fragment, null)
-    // <SpotlightNoData
-    //   title={t('home.navigator.menu.ecom.noDatas.title')}
-    //   description={t('home.navigator.menu.ecom.noDatas.description')}
-    //   link={hrefViewMore}
-    //   cta={t('home.navigator.menu.ecom.homeButton')}
-    //   icon={CommonGAssets.getAssetPath('ecom.svg')}
-    // />
-    )));
+    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
+    return (React__namespace["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
+        React__namespace["default"].createElement(Categories, { hrefViewMore: normalizeLink.normalizeLink(statics.TOGETHER_URL_FE), UrlFE: normalizeLink.normalizeLinkSlash(statics.TOGETHER_URL_FE), onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allCommunities'), menuItems: (communities === null || communities === void 0 ? void 0 : communities.map((community) => {
+                if (!community)
+                    return {};
+                return {
+                    name: community.name || '',
+                    link: community.slug || '/',
+                    thumbnail: community.thumbnail || '',
+                };
+            })) || [], headingTitle: t('home.navigator.menuItem.allCommunitiesheadingTitle') }),
+        React__namespace["default"].createElement(CommunitySpotlights, { spotlights: spotlights })));
 };
 
-const StyledContainerItems$1 = styled__default["default"].div `
+const StyledContainerItems$2 = styled__default["default"].div `
   display: grid;
 
   grid-template-columns: repeat(3, 1fr);
@@ -1421,13 +1401,13 @@ const StyledContainerItems$1 = styled__default["default"].div `
 
 const AppIcon = (_a) => {
     var { size = 24, color = '#2D87F3' } = _a, rest = tslib_es6.__rest(_a, ["size", "color"]);
-    return (React__default["default"].createElement("svg", Object.assign({ width: size, height: size, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, rest),
-        React__default["default"].createElement("rect", { width: "20", height: "20", rx: "4", fill: color }),
-        React__default["default"].createElement("path", { d: "M9.12 6.005c0-.088-.005-.181-.012-.27-.022-.611-.623-1.071-1.208-1.046-.69.04-.839 1.007-.248 1.297.09.047.115.088.105.172v5.048c.004.064-.016.096-.077.122-.63.274-.474 1.276.233 1.304.583.03 1.16-.453 1.195-1.044q.012-.135.013-.272c0-1.77.013-3.54 0-5.311m-3.093 5.34c-.109-.048-.144-.108-.132-.232V6.117c.009-.114.103-.108.176-.165.544-.357.313-1.249-.346-1.264h-.023c-.659 0-1.172.546-1.172 1.194q-.002 2.09.004 4.177l.003 1.396c0 .62.527 1.175 1.15 1.175.68 0 .989-.978.34-1.285m7.299-1.489a.623.623 0 1 1-1.247 0 .623.623 0 0 1 1.247 0", fill: "#fff" }),
-        React__default["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.927 9.821c0 1.338.925 2.46 2.162 2.743-.089 1.583-2.049 1.657-3.22 1.47a2.5 2.5 0 0 1-.716-.225 1.3 1.3 0 0 1-.614-.68c-.057-.142-.093-.293-.158-.431a.58.58 0 0 0-.674-.346.59.59 0 0 0-.462.603c.017.415.192.827.44 1.156.26.354.607.625 1.058.827.636.29 1.336.375 2.03.375.774 0 1.591-.132 2.267-.53.643-.38 1.25-.878 1.263-2.217a2.81 2.81 0 0 0 2.17-2.745c0-1.55-1.244-2.811-2.773-2.811S9.927 8.27 9.927 9.82m4.275 0c0 .841-.674 1.525-1.502 1.525a1.515 1.515 0 0 1-1.502-1.525c0-.84.674-1.525 1.502-1.525a1.516 1.516 0 0 1 1.502 1.525", fill: "#fff" })));
+    return (React__namespace["default"].createElement("svg", Object.assign({ width: size, height: size, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, rest),
+        React__namespace["default"].createElement("rect", { width: "20", height: "20", rx: "4", fill: color }),
+        React__namespace["default"].createElement("path", { d: "M9.12 6.005c0-.088-.005-.181-.012-.27-.022-.611-.623-1.071-1.208-1.046-.69.04-.839 1.007-.248 1.297.09.047.115.088.105.172v5.048c.004.064-.016.096-.077.122-.63.274-.474 1.276.233 1.304.583.03 1.16-.453 1.195-1.044q.012-.135.013-.272c0-1.77.013-3.54 0-5.311m-3.093 5.34c-.109-.048-.144-.108-.132-.232V6.117c.009-.114.103-.108.176-.165.544-.357.313-1.249-.346-1.264h-.023c-.659 0-1.172.546-1.172 1.194q-.002 2.09.004 4.177l.003 1.396c0 .62.527 1.175 1.15 1.175.68 0 .989-.978.34-1.285m7.299-1.489a.623.623 0 1 1-1.247 0 .623.623 0 0 1 1.247 0", fill: "#fff" }),
+        React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.927 9.821c0 1.338.925 2.46 2.162 2.743-.089 1.583-2.049 1.657-3.22 1.47a2.5 2.5 0 0 1-.716-.225 1.3 1.3 0 0 1-.614-.68c-.057-.142-.093-.293-.158-.431a.58.58 0 0 0-.674-.346.59.59 0 0 0-.462.603c.017.415.192.827.44 1.156.26.354.607.625 1.058.827.636.29 1.336.375 2.03.375.774 0 1.591-.132 2.267-.53.643-.38 1.25-.878 1.263-2.217a2.81 2.81 0 0 0 2.17-2.745c0-1.55-1.244-2.811-2.773-2.811S9.927 8.27 9.927 9.82m4.275 0c0 .841-.674 1.525-1.502 1.525a1.515 1.515 0 0 1-1.502-1.525c0-.84.674-1.525 1.502-1.525a1.516 1.516 0 0 1 1.502 1.525", fill: "#fff" })));
 };
 
-const StyledItem$1 = styled__default["default"].a `
+const StyledItem$2 = styled__default["default"].a `
   text-decoration: none;
   border-radius: 4px;
   background: ${miscTheme.theme.colors.primary50};
@@ -1538,7 +1518,7 @@ const StyledContentWrapper$1 = styled__default["default"].div `
   }
 `;
 
-const Item = ({ item, index = 0 }) => {
+const Item$1 = ({ item, index = 0 }) => {
     const { t } = index$1.useTranslations();
     const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
     if (!item)
@@ -1548,22 +1528,22 @@ const Item = ({ item, index = 0 }) => {
             ? item.link
             : `${statics.HOME_PAGE_URL}${item.link}`
         : undefined;
-    return (React__default["default"].createElement(StyledItem$1, { href: link, "data-event-category": "Hamburger Navigation", "data-event-action": `Engage Click ${index + 1}`, "data-event-label": link },
-        item.isMobileAppTool && React__default["default"].createElement(Phone, { size: 20, className: "phone-badge" }),
-        React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('navToolCardBg.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
-        React__default["default"].createElement(StyledContentWrapper$1, null,
-            React__default["default"].createElement(StyledTitle$1, null, item.title),
-            React__default["default"].createElement(StyledDes$1, null, item.subtitle),
-            React__default["default"].createElement(StyledBtnView$1, null, item.isMobileAppTool ? (React__default["default"].createElement(React__default["default"].Fragment, null,
-                React__default["default"].createElement(AppIcon, { size: 16 }),
-                t('home.calcWithApp'))) : (React__default["default"].createElement(React__default["default"].Fragment, null,
+    return (React__namespace["default"].createElement(StyledItem$2, { href: link, "data-event-category": "Hamburger Navigation", "data-event-action": `Engage Click ${index + 1}`, "data-event-label": link },
+        item.isMobileAppTool && React__namespace["default"].createElement(Phone, { size: 20, className: "phone-badge" }),
+        React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('navToolCardBg.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
+        React__namespace["default"].createElement(StyledContentWrapper$1, null,
+            React__namespace["default"].createElement(StyledTitle$1, null, item.title),
+            React__namespace["default"].createElement(StyledDes$1, null, item.subtitle),
+            React__namespace["default"].createElement(StyledBtnView$1, null, item.isMobileAppTool ? (React__namespace["default"].createElement(React__namespace["default"].Fragment, null,
+                React__namespace["default"].createElement(AppIcon, { size: 16 }),
+                t('home.calcWithApp'))) : (React__namespace["default"].createElement(React__namespace["default"].Fragment, null,
                 t('home.seeMore'),
-                React__default["default"].createElement(other.ArrowRight, { size: 18, useCurrentColor: true }))))),
-        React__default["default"].createElement(StyledImageCard$1, null,
-            React__default["default"].createElement("img", { loading: "lazy", alt: item.title, src: item.icon || '/images/avatar.jpg' }))));
+                React__namespace["default"].createElement(other.ArrowRight, { size: 18, useCurrentColor: true }))))),
+        React__namespace["default"].createElement(StyledImageCard$1, null,
+            React__namespace["default"].createElement("img", { loading: "lazy", alt: item.title, src: item.icon || '/images/avatar.jpg' }))));
 };
 
-const StyledItem = styled__default["default"].a `
+const StyledItem$1 = styled__default["default"].a `
   text-decoration: none;
   border-radius: 12px;
 
@@ -1747,117 +1727,402 @@ const StyledContent = styled__default["default"].div `
   ${utils.MediaQueries.tdUp} {
     gap: 8px;
   }
-  ${utils.MediaQueries.tdDown} {
-    gap: 4px;
-    flex: 1;
-    padding-left: 16px;
+  ${utils.MediaQueries.tdDown} {
+    gap: 4px;
+    flex: 1;
+    padding-left: 16px;
+  }
+`;
+const StyledWrapName = styled__default["default"].div `
+  display: flex;
+  flex-direction: row;
+  flex: 1;
+  z-index: 1;
+  ${utils.MediaQueries.tdUp} {
+    gap: 8px;
+    justify-content: flex-end;
+    align-items: flex-end;
+  }
+  ${utils.MediaQueries.tdDown} {
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: flex-start;
+  }
+`;
+
+const ItemMarryBaby = ({ item, index = 0, color }) => {
+    const { t } = index$1.useTranslations();
+    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
+    if (!item)
+        return null;
+    const link = item.link
+        ? item.link.startsWith('http')
+            ? item.link
+            : `${statics.HOME_PAGE_URL}${item.link}`
+        : undefined;
+    const renderIcon = () => (React__namespace["default"].createElement(StyledImageCard, null,
+        React__namespace["default"].createElement("img", { loading: "lazy", alt: item.title, src: item.icon || '/images/avatar.jpg' })));
+    const renderName = () => (React__namespace["default"].createElement(StyledWrapName, null,
+        React__namespace["default"].createElement(StyledContent, null,
+            React__namespace["default"].createElement(StyledTitle, null, item.title),
+            React__namespace["default"].createElement(StyledDes, null, item.subtitle)),
+        React__namespace["default"].createElement(StyledBtnView, null,
+            React__namespace["default"].createElement("div", { className: "mobile-only" }, t('home.seeMore')),
+            React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('arrowRightGray.svg'), style: {
+                    width: '12px',
+                    height: '12px',
+                    marginTop: '2px',
+                    marginLeft: '5px',
+                }, loading: "lazy" }))));
+    return (React__namespace["default"].createElement(StyledItem$1, { href: link, "data-event-category": "Hamburger Navigation", "data-event-action": `Engage Click ${index + 1}`, "data-event-label": link, "data-color": color },
+        React__namespace["default"].createElement("svg", { className: "bg-svg", width: "74", height: "121", viewBox: "0 0 74 121", fill: "none" },
+            React__namespace["default"].createElement("path", { d: "M58.5713 53.428C40.6466 70.0213 12.9929 71.0875 -7.00506 84.9856C-24.9277 97.4005 -38.3893 120.472 -60.213 120.346C-73.3615 120.271 -84.9289 110.925 -91.9303 99.8138C-101.443 84.7327 -103.994 64.0482 -93.916 49.3276C-81.8133 31.6505 -56.6933 28.1101 -41.7246 12.7895C-35.4351 6.35117 -31.2212 -1.90115 -24.8564 -8.25051C-7.17639 -25.9054 34.9604 -29.7543 56.852 -16.9562C80.9056 -2.89888 77.046 36.3304 58.5713 53.428Z", strokeWidth: "0" })),
+        React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('navMBCardDotBg.svg'), className: "dot-svg", loading: "lazy", alt: "" }),
+        React__namespace["default"].createElement(StyledContentWrapper, null,
+            React__namespace["default"].createElement("div", { className: "mobile-only" }, renderIcon()),
+            React__namespace["default"].createElement("div", { className: "desktop-only" }, renderName())),
+        React__namespace["default"].createElement("div", { className: "mobile-only" }, renderName()),
+        React__namespace["default"].createElement("div", { className: "desktop-only" }, renderIcon())));
+};
+
+const ToolSpotlights = ({ hrefViewMore, spotlightHealthTools = [] }) => {
+    const { t } = index$1.useTranslations();
+    const marryBabyCardColor = ['pink', 'orange', 'green'];
+    const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
+    return (React__namespace["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlightTools') },
+        spotlightHealthTools.length !== 0 && (React__namespace["default"].createElement(StyledContainerItems$2, null, spotlightHealthTools === null || spotlightHealthTools === void 0 ? void 0 : spotlightHealthTools.slice(0, 3).map((item, index) => siteType === 'marryBaby' ? (React__namespace["default"].createElement(ItemMarryBaby, { key: index, index: index, item: item, color: marryBabyCardColor[index] })) : (React__namespace["default"].createElement(Item$1, { key: index, index: index, item: item }))))),
+        spotlightHealthTools.length === 0 && (React__namespace["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.healthTools.noDatas.title'), description: t('home.navigator.menu.healthTools.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.healthTools.noDatas.cta'), icon: index$6.CommonGAssets.getAssetPath('community.svg') }))));
+};
+
+const MenuHealthToolsList = ({ locale, onClose, isOpen, spotlightHealthTools = [], healthTools = [], }) => {
+    var _a;
+    const { t } = index$1.useTranslations();
+    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
+    const hrefViewMore = `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`;
+    return (React__namespace["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
+        React__namespace["default"].createElement(Categories, { hrefViewMore: hrefViewMore, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, headingTitle: t('home.navigator.menuItem.healthToolsList'), titleBtnViewMore: t('home.navigator.menuItem.allHealthTools'), menuItems: healthTools.map((t) => ({
+                name: t.title,
+                link: t.link
+                    ? t.link.startsWith('http')
+                        ? t.link
+                        : `${statics.HOME_PAGE_URL}${t.link}`
+                    : undefined,
+                thumbnail: t.icon,
+                isMobileAppTool: t.isMobileAppTool,
+            })) }),
+        React__namespace["default"].createElement(ToolSpotlights, { spotlightHealthTools: spotlightHealthTools, hrefViewMore: hrefViewMore })));
+};
+
+const StyledContainerItems$1 = styled__default["default"].div `
+  display: grid;
+
+  grid-template-columns: repeat(4, 1fr);
+  gap: 24px;
+  ${utils.MediaQueries.tdDown} {
+    gap: 12px;
+    grid-template-columns: 1fr;
+  }
+`;
+
+const VideoSpotlights = ({ spotlightsList = [], layout = 'default', }) => {
+    const { t } = index$1.useTranslations();
+    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
+    return (React__namespace["default"].createElement(Spotlights, { title: t('home.navigator.menu.lastestVideos') }, spotlightsList.length !== 0 ? (React__namespace["default"].createElement(StyledContainerItems$1, null, spotlightsList === null || spotlightsList === void 0 ? void 0 : spotlightsList.slice(0, 4).map((video, index) => (React__namespace["default"].createElement(index$b.VideoItem, { key: index, data: Object.assign(Object.assign({}, video), { type: index$9.VideoType.SHORTS }), layout: layout === 'default' ? 'overlay' : 'horizon', dataEventCategory: "Hamburger Navigation", dataEventAction: `Video Click ${index + 1}` }))))) : (React__namespace["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: `${statics.VIDEO_URL_FE}/`, cta: t('home.navigator.menu.category.noDatas.cta'), icon: index$6.CommonGAssets.getAssetPath('Spotlight.svg') }))));
+};
+
+const MenuVideoList = ({ spotlightsList = [], onClose, isOpen }) => {
+    const { t } = index$1.useTranslations();
+    const { locale, configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
+    const listing = React.useMemo(() => [
+        {
+            name: t('home.navigator.menu.videos'),
+            link: `${statics.VIDEO_URL_FE}/video/`,
+            thumbnail: index$6.CommonGAssets.getAssetPath('nav-icons/video.svg'),
+        },
+        {
+            name: t('home.navigator.menu.shorts'),
+            link: `${statics.VIDEO_URL_FE}/short/`,
+            thumbnail: index$6.CommonGAssets.getAssetPath('nav-icons/short.svg'),
+        },
+        // {
+        //   name: t('home.navigator.menu.podcasts'),
+        //   link: `${statics.VIDEO_URL_FE}/podcast/`,
+        //   thumbnail: CommonGAssets.getAssetPath('nav-icons/podcast.svg'),
+        // },
+    ], []);
+    return (React__namespace["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
+        React__namespace["default"].createElement(Categories, { hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/videos/`, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allVideos'), menuItems: listing, headingTitle: t('home.navigator.menuItem.videoCategories') }),
+        React__namespace["default"].createElement(VideoSpotlights, { spotlightsList: spotlightsList })));
+};
+
+styled__default["default"].div `
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 24px;
+  ${utils.MediaQueries.tdDown} {
+    gap: 12px;
+    grid-template-columns: 1fr;
+  }
+`;
+const StyleButton = styled__default["default"](index$2.Button) `
+  border: 1px solid ${miscTheme.theme.colors.white} !important;
+  .mantine-Button-leftIcon {
+    width: 24px;
+    height: 24px;
+  }
+`;
+const StyleWrapperIcon = styled__default["default"].div `
+  width: 20px;
+  height: 20px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  border-radius: 5px;
+  background: linear-gradient(
+      180deg,
+      rgba(255, 255, 255, 0.1) 15.1%,
+      rgba(0, 0, 0, 0.01) 100%
+    ),
+    linear-gradient(180deg, #65b5ff 0%, #2685f1 100%);
+  background-blend-mode: soft-light, normal;
+`;
+
+const InitialCart = () => (React__namespace["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", width: "512", height: "512", style: {
+        width: '100%',
+        height: '100%',
+        contentVisibility: 'visible',
+    }, viewBox: "0 0 512 512" },
+    React__namespace["default"].createElement("defs", null,
+        React__namespace["default"].createElement("clipPath", { id: "__lottie_element_2" },
+            React__namespace["default"].createElement("path", { d: "M0 0h512v512H0z" })),
+        React__namespace["default"].createElement("path", { fill: "#FFF", d: "m139 0-13 174h244l-30 292 165 1 4-466z", opacity: "1", id: "__lottie_element_6", display: "block" }),
+        React__namespace["default"].createElement("mask", { id: "__lottie_element_6_1", "mask-type": "alpha" },
+            React__namespace["default"].createElement("use", { xlinkHref: "#__lottie_element_6" }))),
+    React__namespace["default"].createElement("g", { clipPath: "url(#__lottie_element_2)" },
+        React__namespace["default"].createElement("path", { fill: "#2B62CD", d: "m430 181-40 41-111-120a18 18 0 0 1-5-13c0-5 2-9 5-13l6-5a18 18 0 0 1 25-1zm-348 0 40 41 111-120a18 18 0 0 0 0-26l-6-5a18 18 0 0 0-25-1z", display: "block" }),
+        React__namespace["default"].createElement("g", { display: "block" },
+            React__namespace["default"].createElement("path", { fill: "#2D87F3", d: "M385 427H125c-4 0-9-1-13-5a20 20 0 0 1-6-12L88 239h335l-18 171a20 20 0 0 1-7 12c-3 4-8 5-13 5" }),
+            React__namespace["default"].createElement("path", { fill: "#2B62CD", d: "m160 402-5-2a6 6 0 0 1-1-4l-8-114v-2a6 6 0 0 1 3-4 6 6 0 0 1 5 0 6 6 0 0 1 4 5l8 115-1 2a6 6 0 0 1-1 2 6 6 0 0 1-4 2m61 0-5-2a6 6 0 0 1-1-4l-2-114c0-2 0-3 2-5a6 6 0 0 1 4-1l4 1a6 6 0 0 1 2 4l2 115a6 6 0 0 1-2 4 6 6 0 0 1-4 2zm131 0a6 6 0 0 1-5-4l-1-2 8-115a6 6 0 0 1 2-4l2-1a6 6 0 0 1 2 0 6 6 0 0 1 5 2 6 6 0 0 1 1 4l-8 114a6 6 0 0 1-6 6m-61 0a6 6 0 0 1-6-6l2-114 2-5a6 6 0 0 1 4-1 6 6 0 0 1 5 1 6 6 0 0 1 1 5l-2 114a6 6 0 0 1-1 4 6 6 0 0 1-5 2" }),
+            React__namespace["default"].createElement("path", { fill: "#91CAFF", d: "M424 243H88a20 20 0 0 1-21-18l-3-28a20 20 0 0 1 20-23h344a20 20 0 0 1 20 23l-3 28a20 20 0 0 1-21 18" })),
+        React__namespace["default"].createElement("g", { mask: "url(#__lottie_element_6_1)", display: "block" },
+            React__namespace["default"].createElement("path", { fill: "#FFC326", d: "m294 198-16 123a5 5 0 0 1-5 5h-80l-4-2a5 5 0 0 1-1-4l15-115h1z" }),
+            React__namespace["default"].createElement("path", { fill: "#FFD658", d: "M272 189c0 3 0 7 2 10a12 12 0 0 0 10 6h-81l-3-1c-3-1-5-3-6-5a15 15 0 0 1 5-19 17 17 0 0 1 9-3h80c-4 0-7 1-9 3a15 15 0 0 0-7 9" }),
+            React__namespace["default"].createElement("path", { fill: "#FEA21E", d: "M277 326h-4c3 0 5-2 5-4l15-115 1-9v1l-1 1a9 9 0 0 1-5 4 11 11 0 0 1-8 0c-3-1-5-3-6-5-4-7-2-15 5-19 2-2 5-3 9-3h1c4 0 7 2 10 4l6 9 1 11 14 119-1 4z" }),
+            React__namespace["default"].createElement("path", { fill: "#FC7419", d: "M303 310v-74a3 3 0 1 0-5 0v74l-21 16h38l4-2zm-5-109a13 13 0 0 1-5 6l1-9c0-1 0 0 0 0 0-3-1-6-4-7a4 4 0 0 0-5 1v1c0 2-1 3-2 3a3 3 0 0 1-3-2l1-4a9 9 0 0 1 11-4c3 1 5 3 6 6v9" })),
+        React__namespace["default"].createElement("g", { display: "block" },
+            React__namespace["default"].createElement("path", { fill: "#FFC326", d: "m460 330-16 123a5 5 0 0 1-5 5h-80l-4-2a5 5 0 0 1-1-4l15-115h1z" }),
+            React__namespace["default"].createElement("path", { fill: "#FFD658", d: "M438 321c0 3 0 6 2 9a12 12 0 0 0 10 7h-81l-3-1c-3-1-5-3-6-6a15 15 0 0 1 5-18 17 17 0 0 1 9-3h80c-4 0-7 1-9 3a15 15 0 0 0-7 9" }),
+            React__namespace["default"].createElement("path", { fill: "#FEA21E", d: "M443 458h-4c3 0 5-2 5-5l15-114 1-9v1l-1 1a9 9 0 0 1-5 4 11 11 0 0 1-8 0c-3-1-5-3-6-6-4-6-2-14 5-18 2-2 5-3 9-3h1c4 0 7 2 10 4s5 5 6 9l1 11 14 119-1 4z" }),
+            React__namespace["default"].createElement("path", { fill: "#FC7419", d: "M469 442v-74a3 3 0 1 0-5 0v74l-21 16h38l4-2zm-5-109a13 13 0 0 1-5 6l1-9c0-1 0 0 0 0 0-3-1-6-4-7a4 4 0 0 0-4 1l-1 1-2 3a3 3 0 0 1-3-3l1-3a9 9 0 0 1 11-4c3 1 5 3 6 5 1 3 2 7 0 10" })))));
+
+const InitialDoctor = () => (React__namespace["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "512", height: "512", style: {
+        width: '100%',
+        height: '100%',
+        contentVisibility: 'visible',
+    }, viewBox: "0 0 512 512" },
+    React__namespace["default"].createElement("defs", null,
+        React__namespace["default"].createElement("clipPath", { id: "__lottie_element_23" },
+            React__namespace["default"].createElement("path", { d: "M0 0h512v512H0z" }))),
+    React__namespace["default"].createElement("g", { clipPath: "url(#__lottie_element_23)" },
+        React__namespace["default"].createElement("g", { display: "block" },
+            React__namespace["default"].createElement("path", { fill: "#1B3250", d: "M430 332c-13-17-52-37-42-63 16-41-9-72-28-84-22-14-23-43-30-66-15-50-53-73-103-73s-88 21-103 71c-7 22-7 53-29 67-19 12-61 41-45 82 10 26-15 52-28 69-39 53 13 89 72 98l255 2c59-9 120-50 81-103" }),
+            React__namespace["default"].createElement("path", { fill: "#FFB497", d: "M120 202c-11 4-13 17-10 29a29 29 0 0 0 14 17 29 29 0 0 0 22 3l-8-49a25 25 0 0 0-18 0" }),
+            React__namespace["default"].createElement("path", { fill: "#FF977B", d: "M147 235a5 5 0 0 1-4-2c-6-8-17-8-17-8a5 5 0 0 1-4-2 5 5 0 0 1 0-7l4-1c1 0 16 0 25 11a5 5 0 0 1-4 9" }),
+            React__namespace["default"].createElement("path", { fill: "#FFB497", d: "M332 202a25 25 0 0 0-18 0l-8 49a29 29 0 0 0 22-3c7-3 12-10 14-17 3-12 1-25-10-29" }),
+            React__namespace["default"].createElement("path", { fill: "#FF977B", d: "M305 235a5 5 0 0 1-5-3 5 5 0 0 1 1-6c9-11 24-11 25-11a5 5 0 0 1 5 5 5 5 0 0 1-5 5s-11 0-17 8a5 5 0 0 1-4 2" }),
+            React__namespace["default"].createElement("path", { fill: "#E3F2FF", d: "M366 452H86a3 3 0 0 1-4-4c5-19 19-47 37-65a153 153 0 0 1 42-28l1-1a85 85 0 0 1 29-19h70a84 84 0 0 1 29 19l1 1a153 153 0 0 1 42 28c18 18 32 46 37 65a3 3 0 0 1-1 3 3 3 0 0 1-3 1" }),
+            React__namespace["default"].createElement("path", { fill: "#FCCAAF", d: "M261 335c-25 32-48 32-70 0l5-10v-1a45 45 0 0 0 2-13h56a48 48 0 0 0 2 13v1l5 10" }),
+            React__namespace["default"].createElement("path", { fill: "#2D87F3", d: "M281 452H175c-14-93 16-117 16-117 7 9 20 15 35 15s28-6 35-15c0 0 9 12 16 37 5 20 6 60 4 80" }),
+            React__namespace["default"].createElement("path", { fill: "#BCDEFF", d: "M191 335a84 84 0 0 0-30 19 53 53 0 0 0-13 28c0 3 11 1 16 0h1v1c-13 8-17 19-16 25 2 15 6 30 13 44h26s-12-72 3-117m96 48a1 1 0 0 1 0-1h1c1 0 0 0 0 0 5 1 16 3 16 0a53 53 0 0 0-13-28 83 83 0 0 0-30-19c15 45 3 117 3 117h26a157 157 0 0 0 13-44c1-6-3-17-16-25" }),
+            React__namespace["default"].createElement("path", { fill: "#FF977B", d: "M256 325c-20 18-40 18-60 0v-1a46 46 0 0 0 2-13h56a48 48 0 0 0 2 13v1" }),
+            React__namespace["default"].createElement("path", { fill: "#FCCAAF", d: "M314 205c-3 54-17 80-39 96-14 11-37 24-49 24s-35-13-49-24c-22-16-36-42-39-96 52-21 30-127 85-99a7 7 0 0 0 6 0c55-28 33 78 85 99" }),
+            React__namespace["default"].createElement("path", { fill: "#FFB497", d: "M221 106c-27-12-34 12-43 40-7 25-16 54-41 63l1 3c43 0 71-62 83-106" })),
+        React__namespace["default"].createElement("path", { fill: "#FF977B", d: "M233 233a5 5 0 0 0-4 2l-3 1-3-1a5 5 0 0 0-2-2 5 5 0 0 0-4 0 5 5 0 0 0-3 5c0 6 9 8 12 8s12-2 12-8a5 5 0 0 0-2-3 5 5 0 0 0-3-2", display: "block" }),
+        React__namespace["default"].createElement("path", { fill: "#1B3250", d: "m261 199 9-5a27 27 0 0 1 11-1c4 0 7 0 11 2l8 4a2 2 0 0 1 1 2 2 2 0 0 1 0 1h-1l-10-1h-9a20 20 0 0 0-7 2 65 65 0 0 0-7 4 5 5 0 0 1-4 1 5 5 0 0 1-3-2 5 5 0 0 1-1-2 5 5 0 0 1 2-5", display: "block" }),
+        React__namespace["default"].createElement("path", { fill: "#284A75", d: "M280 218a9 9 0 1 0 0-19 9 9 0 0 0 0 19", display: "block" }),
+        React__namespace["default"].createElement("path", { fill: "#1B3250", d: "m192 210-7-4-7-2h-9l-9 1a2 2 0 0 1-2-1v-1l1-1 9-4c3-2 6-2 10-2 4-1 7 0 11 1l9 5a5 5 0 0 1 2 3v4a5 5 0 0 1-7 2l-1-1", display: "block" }),
+        React__namespace["default"].createElement("path", { fill: "#284A75", d: "M184 218a9 9 0 1 0 0-19 9 9 0 0 0 0 19", display: "block" }),
+        React__namespace["default"].createElement("g", { fill: "#FFF", display: "block" },
+            React__namespace["default"].createElement("path", { d: "m216 213-4-1a5 5 0 0 1-1-3v-4a5 5 0 0 1 3-2 33 33 0 0 1 24 0 5 5 0 0 1 3 7 5 5 0 0 1-3 2h-3a23 23 0 0 0-18 1h-1" }),
+            React__namespace["default"].createElement("path", { d: "M183 249a38 38 0 0 1-35-23 38 38 0 0 1-2-22 38 38 0 0 1 11-19 38 38 0 0 1 19-11c7-1 15 0 22 2a38 38 0 0 1 16 14 38 38 0 0 1 7 21 38 38 0 0 1-11 27 38 38 0 0 1-27 11m0-65a27 27 0 0 0-25 17 27 27 0 0 0-2 15 27 27 0 0 0 8 14 27 27 0 0 0 42-4c3-4 4-9 4-15a27 27 0 0 0-8-19 27 27 0 0 0-19-8zm86 65a38 38 0 0 1-35-24 38 38 0 0 1 27-51 38 38 0 0 1 39 16 38 38 0 0 1 6 21 38 38 0 0 1-11 27 38 38 0 0 1-26 11m0-65a27 27 0 0 0-25 17 27 27 0 0 0-2 15 27 27 0 0 0 8 14 27 27 0 0 0 46-19 27 27 0 0 0-8-19 27 27 0 0 0-19-8z" })),
+        React__namespace["default"].createElement("path", { d: "m205 180-2-1c-10-4-39-9-47-1a5 5 0 0 1-3 2 5 5 0 0 1-4-2 5 5 0 0 1-2-3l1-4c14-15 52-4 59-1a5 5 0 0 1 3 6 5 5 0 0 1-2 3l-3 1zm42 0-3-1a5 5 0 0 1-1-7 5 5 0 0 1 2-2c7-3 45-14 59 1a5 5 0 0 1 1 4l-2 3a5 5 0 0 1-4 2l-3-2c-8-8-37-3-47 1l-2 1", fill: "#284A75", display: "block" }),
+        React__namespace["default"].createElement("path", { fill: "#FF886C", d: "M208 260a4 4 0 0 0-3 1 4 4 0 0 0-1 3c2 8 6 19 22 19s21-11 22-19a4 4 0 0 0-4-4l-18-1-18 1", display: "block" }),
+        React__namespace["default"].createElement("g", { display: "block" },
+            React__namespace["default"].createElement("g", { fill: "#FFF" },
+                React__namespace["default"].createElement("path", { d: "M469 405a85 85 0 1 1-170 0 85 85 0 0 1 170 0" }),
+                React__namespace["default"].createElement("path", { d: "M469 405a85 85 0 1 1-170 0 85 85 0 0 1 170 0" })),
+            React__namespace["default"].createElement("path", { fill: "#E4E8EC", d: "M384 480a75 75 0 1 0 0-149 75 75 0 0 0 0 149m0 11a85 85 0 1 0 0-171 85 85 0 0 0 0 171" }),
+            React__namespace["default"].createElement("path", { fill: "#FFF", d: "M469 405a85 85 0 1 1-170 0 85 85 0 0 1 170 0" }),
+            React__namespace["default"].createElement("path", { fill: "#E4E8EC", d: "M384 480a75 75 0 1 0 0-149 75 75 0 0 0 0 149m0 11a85 85 0 1 0 0-171 85 85 0 0 0 0 171" }),
+            React__namespace["default"].createElement("path", { fill: "#FF6F4D", d: "M389 358h-11a17 17 0 0 0-12 5 17 17 0 0 0-5 12v3l-1 3a4 4 0 0 1-3 1h-3a17 17 0 0 0-17 17v12a17 17 0 0 0 17 17h3a4 4 0 0 1 4 3v3a17 17 0 0 0 17 17h11c5 0 9-2 12-5s5-7 5-12v-3a4 4 0 0 1 4-3h3c4 0 9-2 12-5s5-8 5-12v-12c0-5-2-9-5-12a17 17 0 0 0-12-5h-3a4 4 0 0 1-4-4v-3a17 17 0 0 0-5-12 17 17 0 0 0-12-5" })))));
+
+const MenuViewMore = ({ menuItems = [], isOpen, onClose }) => {
+    const { locale, configs: { enableAppIntroPage }, } = React.useContext(navigationProfileButton.NavigationContext);
+    const ecomNavItem = menuItems.find((m) => m.id === 'ecom');
+    const careNavItem = menuItems.find((m) => m.id === 'care');
+    return (React__namespace["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true, hideCloseBtn: true, stylesContainer: {
+            display: 'flex',
+            gap: 0,
+            padding: 0,
+        } },
+        ecomNavItem && (React__namespace["default"].createElement("a", { tabIndex: 0, href: ecomNavItem.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": ecomNavItem.link },
+            React__namespace["default"].createElement(StyleButton, { variant: "tertiary", leftIcon: React__namespace["default"].createElement(InitialCart, null) }, ecomNavItem.name))),
+        careNavItem && (React__namespace["default"].createElement("a", { tabIndex: 0, href: careNavItem.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": careNavItem.link },
+            React__namespace["default"].createElement(StyleButton, { variant: "tertiary", leftIcon: React__namespace["default"].createElement(InitialDoctor, null) }, careNavItem.name))),
+        enableAppIntroPage && (React__namespace["default"].createElement("a", { tabIndex: 0, href: "https://applink.hellobacsi.com/o9Q88rQh7Mb", "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": `https://applink.hellobacsi.com/o9Q88rQh7Mb` },
+            React__namespace["default"].createElement(StyleButton, { variant: "tertiary", leftIcon: React__namespace["default"].createElement(StyleWrapperIcon, null,
+                    React__namespace["default"].createElement(core.Logo, { width: 16, height: 15 })) }, `${index$3.LOCALE_SPECS[locale || 'en-PH'].SITE_NAME_FORMATTED} App`)))));
+};
+
+var styles = {"menuContainer":"y5VJdvw","menuIcon":"oVhOSCy","menuIconWrapper":"pX8OXTM"};
+
+function ClosePopupIcon({ className }) {
+    return (React__namespace["default"].createElement("div", null,
+        React__namespace["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", className: className },
+            React__namespace["default"].createElement("path", { d: "M18 6L6 18M18 18L6 6", stroke: "#3E3F58", strokeWidth: "1.3", strokeLinecap: "round" }))));
+}
+
+function HamburgerIcon({ siteType, enableSearch, className, style, }) {
+    const { isWinCashBackTheme } = React.useContext(navigationProfileButton.NavigationContext);
+    if (siteType === 'helloSites') {
+        return (React__namespace["default"].createElement("div", { className: "hamburger-container" }, isWinCashBackTheme ? (React__namespace["default"].createElement(HamburgerWhite, { className: className })) : (React__namespace["default"].createElement("img", { "data-list-type": "Header", "data-content-type": "Navigation", "data-content-topic": "Hamburger", src: enableSearch
+                ? index$6.CommonGAssets.getAssetPath('hamburgerMenuNewWithSearch.svg')
+                : index$6.CommonGAssets.getAssetPath('hamburgerMenuNew.svg'), style: Object.assign({ width: '24px', height: '24px' }, style), alt: "home", className: className, loading: "lazy" }))));
+    }
+    /** Marry Baby */
+    return (React__namespace["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", className: className },
+        React__namespace["default"].createElement("path", { d: "M3.35 15a.65.65 0 0 1 .65-.65h10a.65.65 0 1 1 0 1.3H4a.65.65 0 0 1-.65-.65m0-6A.65.65 0 0 1 4 8.35h16a.65.65 0 1 1 0 1.3H4A.65.65 0 0 1 3.35 9", fill: "#3E3F58" })));
+}
+
+const StyledMasterMenuContainer = styled__default["default"].div `
+  position: fixed;
+  z-index: 201;
+  top: calc(100% - 1px);
+  width: 100%;
+  height: calc(100vh - var(--header-bottom));
+  overflow-x: hidden;
+  overflow-y: auto;
+  background: white;
+  display: flex;
+  flex-direction: column;
+  padding-bottom: 0;
+  left: 0;
+  .hhgcomp-navigation-popupwrapper-menuwrapper {
+    position: unset;
+  }
+`;
+styled__default["default"].div `
+  padding: 16px;
+  padding-bottom: 12px;
+  .fake-search-input {
+    pointer-events: none;
+    input {
+      line-height: 20px;
+      padding-top: 10px;
+      padding-bottom: 10px;
+    }
+  }
+  &[data-theme='marryBaby'] {
+    input {
+      background: ${miscTheme.theme.mbColors.lightGray};
+      border-radius: 16px;
+      border: none;
+    }
   }
 `;
-const StyledWrapName = styled__default["default"].div `
-  display: flex;
-  flex-direction: row;
+const StyledWrapper = styled__default["default"].div `
+  display: block;
+  overflow-y: auto;
   flex: 1;
-  z-index: 1;
-  ${utils.MediaQueries.tdUp} {
-    gap: 8px;
-    justify-content: flex-end;
-    align-items: flex-end;
-  }
-  ${utils.MediaQueries.tdDown} {
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: flex-start;
+  padding-bottom: 16px;
+  &::-webkit-scrollbar {
+    width: 0;
+    display: none;
   }
+`;
+const StyleWrapperSearch = styled__default["default"].div `
+  padding: 0 16px;
 `;
 
-const ItemMarryBaby = ({ item, index = 0, color }) => {
-    const { t } = index$1.useTranslations();
-    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    if (!item)
-        return null;
-    const link = item.link
-        ? item.link.startsWith('http')
-            ? item.link
-            : `${statics.HOME_PAGE_URL}${item.link}`
-        : undefined;
-    const renderIcon = () => (React__default["default"].createElement(StyledImageCard, null,
-        React__default["default"].createElement("img", { loading: "lazy", alt: item.title, src: item.icon || '/images/avatar.jpg' })));
-    const renderName = () => (React__default["default"].createElement(StyledWrapName, null,
-        React__default["default"].createElement(StyledContent, null,
-            React__default["default"].createElement(StyledTitle, null, item.title),
-            React__default["default"].createElement(StyledDes, null, item.subtitle)),
-        React__default["default"].createElement(StyledBtnView, null,
-            React__default["default"].createElement("div", { className: "mobile-only" }, t('home.seeMore')),
-            React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('arrowRightGray.svg'), style: {
-                    width: '12px',
-                    height: '12px',
-                    marginTop: '2px',
-                    marginLeft: '5px',
-                }, loading: "lazy" }))));
-    return (React__default["default"].createElement(StyledItem, { href: link, "data-event-category": "Hamburger Navigation", "data-event-action": `Engage Click ${index + 1}`, "data-event-label": link, "data-color": color },
-        React__default["default"].createElement("svg", { className: "bg-svg", width: "74", height: "121", viewBox: "0 0 74 121", fill: "none" },
-            React__default["default"].createElement("path", { d: "M58.5713 53.428C40.6466 70.0213 12.9929 71.0875 -7.00506 84.9856C-24.9277 97.4005 -38.3893 120.472 -60.213 120.346C-73.3615 120.271 -84.9289 110.925 -91.9303 99.8138C-101.443 84.7327 -103.994 64.0482 -93.916 49.3276C-81.8133 31.6505 -56.6933 28.1101 -41.7246 12.7895C-35.4351 6.35117 -31.2212 -1.90115 -24.8564 -8.25051C-7.17639 -25.9054 34.9604 -29.7543 56.852 -16.9562C80.9056 -2.89888 77.046 36.3304 58.5713 53.428Z", strokeWidth: "0" })),
-        React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('navMBCardDotBg.svg'), className: "dot-svg", loading: "lazy", alt: "" }),
-        React__default["default"].createElement(StyledContentWrapper, null,
-            React__default["default"].createElement("div", { className: "mobile-only" }, renderIcon()),
-            React__default["default"].createElement("div", { className: "desktop-only" }, renderName())),
-        React__default["default"].createElement("div", { className: "mobile-only" }, renderName()),
-        React__default["default"].createElement("div", { className: "desktop-only" }, renderIcon())));
-};
-
-const ToolSpotlights = ({ hrefViewMore, spotlightHealthTools = [] }) => {
-    const { t } = index$1.useTranslations();
-    const marryBabyCardColor = ['pink', 'orange', 'green'];
-    const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlightTools') },
-        spotlightHealthTools.length !== 0 && (React__default["default"].createElement(StyledContainerItems$1, null, spotlightHealthTools === null || spotlightHealthTools === void 0 ? void 0 : spotlightHealthTools.slice(0, 3).map((item, index) => siteType === 'marryBaby' ? (React__default["default"].createElement(ItemMarryBaby, { key: index, index: index, item: item, color: marryBabyCardColor[index] })) : (React__default["default"].createElement(Item, { key: index, index: index, item: item }))))),
-        spotlightHealthTools.length === 0 && (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.healthTools.noDatas.title'), description: t('home.navigator.menu.healthTools.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.healthTools.noDatas.cta'), icon: index$5.CommonGAssets.getAssetPath('community.svg') }))));
-};
-
 const StyledContainerItems = styled__default["default"].div `
   display: grid;
 
-  grid-template-columns: repeat(4, 1fr);
+  grid-template-columns: repeat(3, 1fr);
   gap: 24px;
+  margin-bottom: 3.5rem;
   ${utils.MediaQueries.tdDown} {
-    gap: 12px;
-    grid-template-columns: 1fr;
+    grid-template-columns: repeat(1, 1fr);
   }
 `;
 
-const VideoSpotlights = ({ spotlightsList = [], layout = 'default', }) => {
+const StyledItem = styled__default["default"].a `
+  text-decoration: none;
+  display: flex;
+  align-items: center;
+`;
+
+const Item = ({ item, index = 0 }) => {
+    if (!item)
+        return null;
+    return (React__namespace["default"].createElement(StyledItem, { href: item.url, "data-event-category": "Hamburger Navigation", "data-event-action": `Care Click ${index + 1}`, "data-event-label": item.url },
+        React__namespace["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.featuredImage || '/images/avatar.jpg', style: {
+                width: '40px',
+                height: '40px',
+            } }),
+        React__namespace["default"].createElement(index$4.Text, { size: "p2", weight: "regular", style: {
+                marginLeft: 16,
+            } }, item.name),
+        React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
+                width: '20px',
+                height: '20px',
+                marginLeft: 'auto',
+            }, loading: "lazy" })));
+};
+
+const EcomSpotlights = ({ helpfulUrls = [], }) => {
     const { t } = index$1.useTranslations();
-    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.lastestVideos') }, spotlightsList.length !== 0 ? (React__default["default"].createElement(StyledContainerItems, null, spotlightsList === null || spotlightsList === void 0 ? void 0 : spotlightsList.slice(0, 4).map((video, index) => (React__default["default"].createElement(index$8.VideoItem, { key: index, data: Object.assign(Object.assign({}, video), { type: index$a.VideoType.SHORTS }), layout: layout === 'default' ? 'overlay' : 'horizon', dataEventCategory: "Hamburger Navigation", dataEventAction: `Video Click ${index + 1}` }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: `${statics.VIDEO_URL_FE}/`, cta: t('home.navigator.menu.category.noDatas.cta'), icon: index$5.CommonGAssets.getAssetPath('Spotlight.svg') }))));
+    // const { siteType } = useContext(NavigationContext)
+    if (!helpfulUrls.length)
+        return null;
+    return (React__namespace["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlightEcom') }, helpfulUrls.length !== 0 ? (React__namespace["default"].createElement(StyledContainerItems, null, helpfulUrls === null || helpfulUrls === void 0 ? void 0 : helpfulUrls.slice(0, 5).map((s, index) => (React__namespace["default"].createElement(Item, { key: index, index: index, item: s }))))) : (React__namespace["default"].createElement(React__namespace["default"].Fragment, null)
+    // <SpotlightNoData
+    //   title={t('home.navigator.menu.ecom.noDatas.title')}
+    //   description={t('home.navigator.menu.ecom.noDatas.description')}
+    //   link={hrefViewMore}
+    //   cta={t('home.navigator.menu.ecom.homeButton')}
+    //   icon={CommonGAssets.getAssetPath('ecom.svg')}
+    // />
+    )));
 };
 
 const MenuServiceList = ({ closePopup, menuItems = [], projectType, isHomepage = false, }) => {
     var _a, _b;
     const { siteType, ssrMenuContent: { categories, healthTools, care, together, ecom, videos }, activeMenuService, configs: { statics }, locale, customClasses, } = React.useContext(navigationProfileButton.NavigationContext);
     const { t } = index$1.useTranslations();
-    return (React__default["default"].createElement(StyledMasterMenuContainer, { className: customClasses.categoriesMenu, id: "categories-menu" },
-        !isHomepage && (React__default["default"].createElement(StyleWrapperSearch, null,
-            React__default["default"].createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: false, isRedirectSearchPage: true }))),
-        React__default["default"].createElement(StyledWrapper, null,
-            React__default["default"].createElement(Categories, { UrlFE: statics.HOME_PAGE_URL, titleBtnViewMore: t('home.navigator.menuItem.allCategories'), menuItems: menuItems, headingTitle: t('home.navigator.menuItem.healthCategories'), onClosePopup: closePopup, activeItem: activeMenuService }),
-            activeMenuService === 'categories' && (React__default["default"].createElement(CategorySpotlights, { spotlightsList: (categories === null || categories === void 0 ? void 0 : categories.spotlights) || [], hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/spotlight/` })),
-            activeMenuService === 'tools' && (React__default["default"].createElement(ToolSpotlights, { spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}` })),
-            activeMenuService === 'care' && (React__default["default"].createElement(CareSpotlights, { spotlights: care === null || care === void 0 ? void 0 : care.spotlights, hrefViewMore: `${statics.CARE_URL_FE}/${(_b = constants$1.LOCALIZED_SLUGS[locale]) === null || _b === void 0 ? void 0 : _b.SPECIALTIES}` })),
-            activeMenuService === 'together' && (React__default["default"].createElement(CommunitySpotlights, { spotlights: together === null || together === void 0 ? void 0 : together.spotlights })),
-            activeMenuService === 'ecom' && (React__default["default"].createElement(EcomSpotlights, { helpfulUrls: ecom === null || ecom === void 0 ? void 0 : ecom.helpfulUrls })),
-            activeMenuService === 'video' && (React__default["default"].createElement(VideoSpotlights, { spotlightsList: videos === null || videos === void 0 ? void 0 : videos.spotlights, layout: "stack" })))));
+    return (React__namespace["default"].createElement(StyledMasterMenuContainer, { className: customClasses.categoriesMenu, id: "categories-menu" },
+        !isHomepage && (React__namespace["default"].createElement(StyleWrapperSearch, null,
+            React__namespace["default"].createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: false, isRedirectSearchPage: true }))),
+        React__namespace["default"].createElement(StyledWrapper, null,
+            React__namespace["default"].createElement(Categories, { UrlFE: statics.HOME_PAGE_URL, titleBtnViewMore: t('home.navigator.menuItem.allCategories'), menuItems: menuItems, headingTitle: t('home.navigator.menuItem.healthCategories'), onClosePopup: closePopup, activeItem: activeMenuService }),
+            activeMenuService === 'categories' && (React__namespace["default"].createElement(CategorySpotlights, { spotlightsList: (categories === null || categories === void 0 ? void 0 : categories.spotlights) || [], hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/spotlight/` })),
+            activeMenuService === 'tools' && (React__namespace["default"].createElement(ToolSpotlights, { spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}` })),
+            activeMenuService === 'care' && (React__namespace["default"].createElement(CareSpotlights, { spotlights: care === null || care === void 0 ? void 0 : care.spotlights, hrefViewMore: `${statics.CARE_URL_FE}/${(_b = constants$1.LOCALIZED_SLUGS[locale]) === null || _b === void 0 ? void 0 : _b.SPECIALTIES}` })),
+            activeMenuService === 'together' && (React__namespace["default"].createElement(CommunitySpotlights, { spotlights: together === null || together === void 0 ? void 0 : together.spotlights })),
+            activeMenuService === 'ecom' && (React__namespace["default"].createElement(EcomSpotlights, { helpfulUrls: ecom === null || ecom === void 0 ? void 0 : ecom.helpfulUrls })),
+            activeMenuService === 'video' && (React__namespace["default"].createElement(VideoSpotlights, { spotlightsList: videos === null || videos === void 0 ? void 0 : videos.spotlights, layout: "stack" })))));
 };
 
 const HamburgerMenu = ({ menuItems, isHomepage, projectType }) => {
     const { siteType } = React.useContext(navigationProfileButton.NavigationContext);
     const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = navigationProfileButton.useCSSFocusPopupHelper();
-    return (React__default["default"].createElement(DisplayWrapper, { mediaQueryKey: "mbDown" },
-        React__default["default"].createElement("header", { className: styles$2.menuContainer },
-            React__default["default"].createElement("div", { className: styles$2.menuIcon, ref: containerRef, role: "button", tabIndex: 0, onBlur: onContainerBlur, onFocus: onContainerFocus },
-                React__default["default"].createElement("div", { className: styles$2.menuIconWrapper, onMouseDown: onButtonMouseDown, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": "Hamburger Navigation URL" },
-                    React__default["default"].createElement(ClosePopupIcon, { className: "mobile-close-icon" }),
-                    React__default["default"].createElement(HamburgerIcon, { siteType: siteType, enableSearch: false, className: "mobile-hamburger-icon" })),
-                React__default["default"].createElement(MenuServiceList, { menuItems: menuItems, isHomepage: isHomepage, projectType: projectType, closePopup: onClose })))));
+    return (React__namespace["default"].createElement(DisplayWrapper, { mediaQueryKey: "mbDown" },
+        React__namespace["default"].createElement("header", { className: styles.menuContainer },
+            React__namespace["default"].createElement("div", { className: styles.menuIcon, ref: containerRef, role: "button", tabIndex: 0, onBlur: onContainerBlur, onFocus: onContainerFocus },
+                React__namespace["default"].createElement("div", { className: styles.menuIconWrapper, onMouseDown: onButtonMouseDown, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": "Hamburger Navigation URL" },
+                    React__namespace["default"].createElement(ClosePopupIcon, { className: "mobile-close-icon" }),
+                    React__namespace["default"].createElement(HamburgerIcon, { siteType: siteType, enableSearch: false, className: "mobile-hamburger-icon" })),
+                React__namespace["default"].createElement(MenuServiceList, { menuItems: menuItems, isHomepage: isHomepage, projectType: projectType, closePopup: onClose })))));
 };
 
 const StyledHeaderWrapper = styled__default["default"].div `
@@ -1869,9 +2134,18 @@ const StyledHeaderWrapper = styled__default["default"].div `
 
   transition: height 0.3s, transform 0.3s;
 
+  &[data-win-cash-back-theme='true'] {
+    background-color: ${miscTheme.theme.colors.blue900};
+  }
+
   &[data-site-type='helloSites'] {
     border-bottom: 1px solid ${miscTheme.theme.colors.neutral100};
   }
+
+  &[data-site-type='helloSites'][data-win-cash-back-theme='true'] {
+    border-bottom: none;
+  }
+
   &[data-sponsored='true'] {
     border-bottom: none;
   }
@@ -1951,10 +2225,16 @@ const StyledHeader = styled__default["default"].div `
   ${utils.MediaQueries.mbDown} {
     position: relative;
     height: 56px;
-    background: white;
+    background: ${miscTheme.theme.colors.white};
     gap: 2px;
   }
 
+  &[data-win-cash-back-theme='true'] {
+    ${utils.MediaQueries.mbDown} {
+      background: ${miscTheme.theme.colors.blue900};
+    }
+  }
+
   &[data-site-type='marryBaby'] {
     width: 100%;
     margin: 0 auto;
@@ -2078,239 +2358,6 @@ const StyleButtonAiChat = styled__default["default"](index$2.Button) `
   }
 `;
 
-var styles = {"gridContainer":"q3nL5cp","container":"_2DNf80G","closeWrapper":"Q-glX-n"};
-
-const BtnClosePopup = ({ onClosePopup }) => {
-    return (React__default["default"].createElement("div", { className: `${styles.closeWrapper} close-btn`, onClick: onClosePopup },
-        React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
-            React__default["default"].createElement("path", { d: "M18 6L6 18M18 18L6 6", stroke: "#3E3F58", strokeWidth: "1.3", strokeLinecap: "round" }))));
-};
-
-const PopupWrapper = ({ onClosePopup, isDisplay, children, isNavMenu, hideCloseBtn, stylesContainer, }) => {
-    return (React__default["default"].createElement("div", { className: "hhgcomp-navigation-popupwrapper-menuwrapper top-menu-health-tools", "data-is-display": !!isDisplay, "data-is-nav-menu": !!isNavMenu },
-        React__default["default"].createElement(index$c.Container, { className: "hhgcomp-navigation-popupwrapper-menuwrapper-child" },
-            !hideCloseBtn && (React__default["default"].createElement("div", { className: styles.container },
-                React__default["default"].createElement(BtnClosePopup, { onClosePopup: onClosePopup }))),
-            React__default["default"].createElement(index$c.Container, { className: styles.gridContainer, style: stylesContainer }, children))));
-};
-
-const MenuCareList = ({ careSpecialties = [], isOpen, onClose, spotlights = [], }) => {
-    var _a;
-    const { t } = index$1.useTranslations();
-    const { locale, configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
-        React__default["default"].createElement(Categories, { headingTitle: t('home.navigator.menuItem.specialties'), hrefViewMore: `${statics.CARE_URL_FE}/`, UrlFE: statics.CARE_URL_FE, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allSpecialties'), menuItems: (careSpecialties === null || careSpecialties === void 0 ? void 0 : careSpecialties.map((specialty) => {
-                if (!specialty)
-                    return {};
-                return {
-                    name: String(specialty.name) || '',
-                    link: getCareSearchUrl({
-                        type: 'DOCTOR',
-                        specialtySlug: specialty.slug,
-                        locale,
-                    }),
-                    thumbnail: (specialty === null || specialty === void 0 ? void 0 : specialty.thumbnail) || '',
-                };
-            })) || [] }),
-        React__default["default"].createElement(CareSpotlights, { spotlights: spotlights, hrefViewMore: `${statics.CARE_URL_FE}/${(_a = constants$1.LOCALIZED_SLUGS[locale]) === null || _a === void 0 ? void 0 : _a.SPECIALTIES}/` })));
-};
-
-const MenuCategoriesList = ({ categories = [], spotlightsList = [], onClose, isOpen, }) => {
-    const { t } = index$1.useTranslations();
-    const { locale, configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
-        React__default["default"].createElement(Categories, { hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/categories/`, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allCategories'), menuItems: (categories === null || categories === void 0 ? void 0 : categories.map((cat) => {
-                if (!cat)
-                    return {};
-                return {
-                    name: cat.displayName || null,
-                    link: (cat === null || cat === void 0 ? void 0 : cat.customizedUrl) || (cat === null || cat === void 0 ? void 0 : cat.permalink) || '/',
-                    thumbnail: cat.iconUrl || null,
-                };
-            })) || [], headingTitle: t('home.navigator.menuItem.healthCategories') }),
-        React__default["default"].createElement(CategorySpotlights, { spotlightsList: spotlightsList, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/spotlight/` })));
-};
-
-const MenuCommunitiesList = ({ communities = [], onClose, isOpen, spotlights = [], }) => {
-    const { t } = index$1.useTranslations();
-    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
-        React__default["default"].createElement(Categories, { hrefViewMore: normalizeLink.normalizeLink(statics.TOGETHER_URL_FE), UrlFE: normalizeLink.normalizeLinkSlash(statics.TOGETHER_URL_FE), onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allCommunities'), menuItems: (communities === null || communities === void 0 ? void 0 : communities.map((community) => {
-                if (!community)
-                    return {};
-                return {
-                    name: community.name || '',
-                    link: community.slug || '/',
-                    thumbnail: community.thumbnail || '',
-                };
-            })) || [], headingTitle: t('home.navigator.menuItem.allCommunitiesheadingTitle') }),
-        React__default["default"].createElement(CommunitySpotlights, { spotlights: spotlights })));
-};
-
-const MenuHealthToolsList = ({ locale, onClose, isOpen, spotlightHealthTools = [], healthTools = [], }) => {
-    var _a;
-    const { t } = index$1.useTranslations();
-    const { configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    const hrefViewMore = `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`;
-    return (React__default["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
-        React__default["default"].createElement(Categories, { hrefViewMore: hrefViewMore, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, headingTitle: t('home.navigator.menuItem.healthToolsList'), titleBtnViewMore: t('home.navigator.menuItem.allHealthTools'), menuItems: healthTools.map((t) => ({
-                name: t.title,
-                link: t.link
-                    ? t.link.startsWith('http')
-                        ? t.link
-                        : `${statics.HOME_PAGE_URL}${t.link}`
-                    : undefined,
-                thumbnail: t.icon,
-                isMobileAppTool: t.isMobileAppTool,
-            })) }),
-        React__default["default"].createElement(ToolSpotlights, { spotlightHealthTools: spotlightHealthTools, hrefViewMore: hrefViewMore })));
-};
-
-const MenuVideoList = ({ spotlightsList = [], onClose, isOpen }) => {
-    const { t } = index$1.useTranslations();
-    const { locale, configs: { statics }, } = React.useContext(navigationProfileButton.NavigationContext);
-    const listing = React.useMemo(() => [
-        {
-            name: t('home.navigator.menu.videos'),
-            link: `${statics.VIDEO_URL_FE}/video/`,
-            thumbnail: index$5.CommonGAssets.getAssetPath('nav-icons/video.svg'),
-        },
-        {
-            name: t('home.navigator.menu.shorts'),
-            link: `${statics.VIDEO_URL_FE}/short/`,
-            thumbnail: index$5.CommonGAssets.getAssetPath('nav-icons/short.svg'),
-        },
-        // {
-        //   name: t('home.navigator.menu.podcasts'),
-        //   link: `${statics.VIDEO_URL_FE}/podcast/`,
-        //   thumbnail: CommonGAssets.getAssetPath('nav-icons/podcast.svg'),
-        // },
-    ], []);
-    return (React__default["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
-        React__default["default"].createElement(Categories, { hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/videos/`, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allVideos'), menuItems: listing, headingTitle: t('home.navigator.menuItem.videoCategories') }),
-        React__default["default"].createElement(VideoSpotlights, { spotlightsList: spotlightsList })));
-};
-
-styled__default["default"].div `
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 24px;
-  ${utils.MediaQueries.tdDown} {
-    gap: 12px;
-    grid-template-columns: 1fr;
-  }
-`;
-const StyleButton = styled__default["default"](index$2.Button) `
-  border: 1px solid ${miscTheme.theme.colors.white} !important;
-  .mantine-Button-leftIcon {
-    width: 24px;
-    height: 24px;
-  }
-`;
-const StyleWrapperIcon = styled__default["default"].div `
-  width: 20px;
-  height: 20px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  border-radius: 5px;
-  background: linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.1) 15.1%,
-      rgba(0, 0, 0, 0.01) 100%
-    ),
-    linear-gradient(180deg, #65b5ff 0%, #2685f1 100%);
-  background-blend-mode: soft-light, normal;
-`;
-
-const InitialCart = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", width: "512", height: "512", style: {
-        width: '100%',
-        height: '100%',
-        contentVisibility: 'visible',
-    }, viewBox: "0 0 512 512" },
-    React__default["default"].createElement("defs", null,
-        React__default["default"].createElement("clipPath", { id: "__lottie_element_2" },
-            React__default["default"].createElement("path", { d: "M0 0h512v512H0z" })),
-        React__default["default"].createElement("path", { fill: "#FFF", d: "m139 0-13 174h244l-30 292 165 1 4-466z", opacity: "1", id: "__lottie_element_6", display: "block" }),
-        React__default["default"].createElement("mask", { id: "__lottie_element_6_1", "mask-type": "alpha" },
-            React__default["default"].createElement("use", { xlinkHref: "#__lottie_element_6" }))),
-    React__default["default"].createElement("g", { clipPath: "url(#__lottie_element_2)" },
-        React__default["default"].createElement("path", { fill: "#2B62CD", d: "m430 181-40 41-111-120a18 18 0 0 1-5-13c0-5 2-9 5-13l6-5a18 18 0 0 1 25-1zm-348 0 40 41 111-120a18 18 0 0 0 0-26l-6-5a18 18 0 0 0-25-1z", display: "block" }),
-        React__default["default"].createElement("g", { display: "block" },
-            React__default["default"].createElement("path", { fill: "#2D87F3", d: "M385 427H125c-4 0-9-1-13-5a20 20 0 0 1-6-12L88 239h335l-18 171a20 20 0 0 1-7 12c-3 4-8 5-13 5" }),
-            React__default["default"].createElement("path", { fill: "#2B62CD", d: "m160 402-5-2a6 6 0 0 1-1-4l-8-114v-2a6 6 0 0 1 3-4 6 6 0 0 1 5 0 6 6 0 0 1 4 5l8 115-1 2a6 6 0 0 1-1 2 6 6 0 0 1-4 2m61 0-5-2a6 6 0 0 1-1-4l-2-114c0-2 0-3 2-5a6 6 0 0 1 4-1l4 1a6 6 0 0 1 2 4l2 115a6 6 0 0 1-2 4 6 6 0 0 1-4 2zm131 0a6 6 0 0 1-5-4l-1-2 8-115a6 6 0 0 1 2-4l2-1a6 6 0 0 1 2 0 6 6 0 0 1 5 2 6 6 0 0 1 1 4l-8 114a6 6 0 0 1-6 6m-61 0a6 6 0 0 1-6-6l2-114 2-5a6 6 0 0 1 4-1 6 6 0 0 1 5 1 6 6 0 0 1 1 5l-2 114a6 6 0 0 1-1 4 6 6 0 0 1-5 2" }),
-            React__default["default"].createElement("path", { fill: "#91CAFF", d: "M424 243H88a20 20 0 0 1-21-18l-3-28a20 20 0 0 1 20-23h344a20 20 0 0 1 20 23l-3 28a20 20 0 0 1-21 18" })),
-        React__default["default"].createElement("g", { mask: "url(#__lottie_element_6_1)", display: "block" },
-            React__default["default"].createElement("path", { fill: "#FFC326", d: "m294 198-16 123a5 5 0 0 1-5 5h-80l-4-2a5 5 0 0 1-1-4l15-115h1z" }),
-            React__default["default"].createElement("path", { fill: "#FFD658", d: "M272 189c0 3 0 7 2 10a12 12 0 0 0 10 6h-81l-3-1c-3-1-5-3-6-5a15 15 0 0 1 5-19 17 17 0 0 1 9-3h80c-4 0-7 1-9 3a15 15 0 0 0-7 9" }),
-            React__default["default"].createElement("path", { fill: "#FEA21E", d: "M277 326h-4c3 0 5-2 5-4l15-115 1-9v1l-1 1a9 9 0 0 1-5 4 11 11 0 0 1-8 0c-3-1-5-3-6-5-4-7-2-15 5-19 2-2 5-3 9-3h1c4 0 7 2 10 4l6 9 1 11 14 119-1 4z" }),
-            React__default["default"].createElement("path", { fill: "#FC7419", d: "M303 310v-74a3 3 0 1 0-5 0v74l-21 16h38l4-2zm-5-109a13 13 0 0 1-5 6l1-9c0-1 0 0 0 0 0-3-1-6-4-7a4 4 0 0 0-5 1v1c0 2-1 3-2 3a3 3 0 0 1-3-2l1-4a9 9 0 0 1 11-4c3 1 5 3 6 6v9" })),
-        React__default["default"].createElement("g", { display: "block" },
-            React__default["default"].createElement("path", { fill: "#FFC326", d: "m460 330-16 123a5 5 0 0 1-5 5h-80l-4-2a5 5 0 0 1-1-4l15-115h1z" }),
-            React__default["default"].createElement("path", { fill: "#FFD658", d: "M438 321c0 3 0 6 2 9a12 12 0 0 0 10 7h-81l-3-1c-3-1-5-3-6-6a15 15 0 0 1 5-18 17 17 0 0 1 9-3h80c-4 0-7 1-9 3a15 15 0 0 0-7 9" }),
-            React__default["default"].createElement("path", { fill: "#FEA21E", d: "M443 458h-4c3 0 5-2 5-5l15-114 1-9v1l-1 1a9 9 0 0 1-5 4 11 11 0 0 1-8 0c-3-1-5-3-6-6-4-6-2-14 5-18 2-2 5-3 9-3h1c4 0 7 2 10 4s5 5 6 9l1 11 14 119-1 4z" }),
-            React__default["default"].createElement("path", { fill: "#FC7419", d: "M469 442v-74a3 3 0 1 0-5 0v74l-21 16h38l4-2zm-5-109a13 13 0 0 1-5 6l1-9c0-1 0 0 0 0 0-3-1-6-4-7a4 4 0 0 0-4 1l-1 1-2 3a3 3 0 0 1-3-3l1-3a9 9 0 0 1 11-4c3 1 5 3 6 5 1 3 2 7 0 10" })))));
-
-const InitialDoctor = () => (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "512", height: "512", style: {
-        width: '100%',
-        height: '100%',
-        contentVisibility: 'visible',
-    }, viewBox: "0 0 512 512" },
-    React__default["default"].createElement("defs", null,
-        React__default["default"].createElement("clipPath", { id: "__lottie_element_23" },
-            React__default["default"].createElement("path", { d: "M0 0h512v512H0z" }))),
-    React__default["default"].createElement("g", { clipPath: "url(#__lottie_element_23)" },
-        React__default["default"].createElement("g", { display: "block" },
-            React__default["default"].createElement("path", { fill: "#1B3250", d: "M430 332c-13-17-52-37-42-63 16-41-9-72-28-84-22-14-23-43-30-66-15-50-53-73-103-73s-88 21-103 71c-7 22-7 53-29 67-19 12-61 41-45 82 10 26-15 52-28 69-39 53 13 89 72 98l255 2c59-9 120-50 81-103" }),
-            React__default["default"].createElement("path", { fill: "#FFB497", d: "M120 202c-11 4-13 17-10 29a29 29 0 0 0 14 17 29 29 0 0 0 22 3l-8-49a25 25 0 0 0-18 0" }),
-            React__default["default"].createElement("path", { fill: "#FF977B", d: "M147 235a5 5 0 0 1-4-2c-6-8-17-8-17-8a5 5 0 0 1-4-2 5 5 0 0 1 0-7l4-1c1 0 16 0 25 11a5 5 0 0 1-4 9" }),
-            React__default["default"].createElement("path", { fill: "#FFB497", d: "M332 202a25 25 0 0 0-18 0l-8 49a29 29 0 0 0 22-3c7-3 12-10 14-17 3-12 1-25-10-29" }),
-            React__default["default"].createElement("path", { fill: "#FF977B", d: "M305 235a5 5 0 0 1-5-3 5 5 0 0 1 1-6c9-11 24-11 25-11a5 5 0 0 1 5 5 5 5 0 0 1-5 5s-11 0-17 8a5 5 0 0 1-4 2" }),
-            React__default["default"].createElement("path", { fill: "#E3F2FF", d: "M366 452H86a3 3 0 0 1-4-4c5-19 19-47 37-65a153 153 0 0 1 42-28l1-1a85 85 0 0 1 29-19h70a84 84 0 0 1 29 19l1 1a153 153 0 0 1 42 28c18 18 32 46 37 65a3 3 0 0 1-1 3 3 3 0 0 1-3 1" }),
-            React__default["default"].createElement("path", { fill: "#FCCAAF", d: "M261 335c-25 32-48 32-70 0l5-10v-1a45 45 0 0 0 2-13h56a48 48 0 0 0 2 13v1l5 10" }),
-            React__default["default"].createElement("path", { fill: "#2D87F3", d: "M281 452H175c-14-93 16-117 16-117 7 9 20 15 35 15s28-6 35-15c0 0 9 12 16 37 5 20 6 60 4 80" }),
-            React__default["default"].createElement("path", { fill: "#BCDEFF", d: "M191 335a84 84 0 0 0-30 19 53 53 0 0 0-13 28c0 3 11 1 16 0h1v1c-13 8-17 19-16 25 2 15 6 30 13 44h26s-12-72 3-117m96 48a1 1 0 0 1 0-1h1c1 0 0 0 0 0 5 1 16 3 16 0a53 53 0 0 0-13-28 83 83 0 0 0-30-19c15 45 3 117 3 117h26a157 157 0 0 0 13-44c1-6-3-17-16-25" }),
-            React__default["default"].createElement("path", { fill: "#FF977B", d: "M256 325c-20 18-40 18-60 0v-1a46 46 0 0 0 2-13h56a48 48 0 0 0 2 13v1" }),
-            React__default["default"].createElement("path", { fill: "#FCCAAF", d: "M314 205c-3 54-17 80-39 96-14 11-37 24-49 24s-35-13-49-24c-22-16-36-42-39-96 52-21 30-127 85-99a7 7 0 0 0 6 0c55-28 33 78 85 99" }),
-            React__default["default"].createElement("path", { fill: "#FFB497", d: "M221 106c-27-12-34 12-43 40-7 25-16 54-41 63l1 3c43 0 71-62 83-106" })),
-        React__default["default"].createElement("path", { fill: "#FF977B", d: "M233 233a5 5 0 0 0-4 2l-3 1-3-1a5 5 0 0 0-2-2 5 5 0 0 0-4 0 5 5 0 0 0-3 5c0 6 9 8 12 8s12-2 12-8a5 5 0 0 0-2-3 5 5 0 0 0-3-2", display: "block" }),
-        React__default["default"].createElement("path", { fill: "#1B3250", d: "m261 199 9-5a27 27 0 0 1 11-1c4 0 7 0 11 2l8 4a2 2 0 0 1 1 2 2 2 0 0 1 0 1h-1l-10-1h-9a20 20 0 0 0-7 2 65 65 0 0 0-7 4 5 5 0 0 1-4 1 5 5 0 0 1-3-2 5 5 0 0 1-1-2 5 5 0 0 1 2-5", display: "block" }),
-        React__default["default"].createElement("path", { fill: "#284A75", d: "M280 218a9 9 0 1 0 0-19 9 9 0 0 0 0 19", display: "block" }),
-        React__default["default"].createElement("path", { fill: "#1B3250", d: "m192 210-7-4-7-2h-9l-9 1a2 2 0 0 1-2-1v-1l1-1 9-4c3-2 6-2 10-2 4-1 7 0 11 1l9 5a5 5 0 0 1 2 3v4a5 5 0 0 1-7 2l-1-1", display: "block" }),
-        React__default["default"].createElement("path", { fill: "#284A75", d: "M184 218a9 9 0 1 0 0-19 9 9 0 0 0 0 19", display: "block" }),
-        React__default["default"].createElement("g", { fill: "#FFF", display: "block" },
-            React__default["default"].createElement("path", { d: "m216 213-4-1a5 5 0 0 1-1-3v-4a5 5 0 0 1 3-2 33 33 0 0 1 24 0 5 5 0 0 1 3 7 5 5 0 0 1-3 2h-3a23 23 0 0 0-18 1h-1" }),
-            React__default["default"].createElement("path", { d: "M183 249a38 38 0 0 1-35-23 38 38 0 0 1-2-22 38 38 0 0 1 11-19 38 38 0 0 1 19-11c7-1 15 0 22 2a38 38 0 0 1 16 14 38 38 0 0 1 7 21 38 38 0 0 1-11 27 38 38 0 0 1-27 11m0-65a27 27 0 0 0-25 17 27 27 0 0 0-2 15 27 27 0 0 0 8 14 27 27 0 0 0 42-4c3-4 4-9 4-15a27 27 0 0 0-8-19 27 27 0 0 0-19-8zm86 65a38 38 0 0 1-35-24 38 38 0 0 1 27-51 38 38 0 0 1 39 16 38 38 0 0 1 6 21 38 38 0 0 1-11 27 38 38 0 0 1-26 11m0-65a27 27 0 0 0-25 17 27 27 0 0 0-2 15 27 27 0 0 0 8 14 27 27 0 0 0 46-19 27 27 0 0 0-8-19 27 27 0 0 0-19-8z" })),
-        React__default["default"].createElement("path", { d: "m205 180-2-1c-10-4-39-9-47-1a5 5 0 0 1-3 2 5 5 0 0 1-4-2 5 5 0 0 1-2-3l1-4c14-15 52-4 59-1a5 5 0 0 1 3 6 5 5 0 0 1-2 3l-3 1zm42 0-3-1a5 5 0 0 1-1-7 5 5 0 0 1 2-2c7-3 45-14 59 1a5 5 0 0 1 1 4l-2 3a5 5 0 0 1-4 2l-3-2c-8-8-37-3-47 1l-2 1", fill: "#284A75", display: "block" }),
-        React__default["default"].createElement("path", { fill: "#FF886C", d: "M208 260a4 4 0 0 0-3 1 4 4 0 0 0-1 3c2 8 6 19 22 19s21-11 22-19a4 4 0 0 0-4-4l-18-1-18 1", display: "block" }),
-        React__default["default"].createElement("g", { display: "block" },
-            React__default["default"].createElement("g", { fill: "#FFF" },
-                React__default["default"].createElement("path", { d: "M469 405a85 85 0 1 1-170 0 85 85 0 0 1 170 0" }),
-                React__default["default"].createElement("path", { d: "M469 405a85 85 0 1 1-170 0 85 85 0 0 1 170 0" })),
-            React__default["default"].createElement("path", { fill: "#E4E8EC", d: "M384 480a75 75 0 1 0 0-149 75 75 0 0 0 0 149m0 11a85 85 0 1 0 0-171 85 85 0 0 0 0 171" }),
-            React__default["default"].createElement("path", { fill: "#FFF", d: "M469 405a85 85 0 1 1-170 0 85 85 0 0 1 170 0" }),
-            React__default["default"].createElement("path", { fill: "#E4E8EC", d: "M384 480a75 75 0 1 0 0-149 75 75 0 0 0 0 149m0 11a85 85 0 1 0 0-171 85 85 0 0 0 0 171" }),
-            React__default["default"].createElement("path", { fill: "#FF6F4D", d: "M389 358h-11a17 17 0 0 0-12 5 17 17 0 0 0-5 12v3l-1 3a4 4 0 0 1-3 1h-3a17 17 0 0 0-17 17v12a17 17 0 0 0 17 17h3a4 4 0 0 1 4 3v3a17 17 0 0 0 17 17h11c5 0 9-2 12-5s5-7 5-12v-3a4 4 0 0 1 4-3h3c4 0 9-2 12-5s5-8 5-12v-12c0-5-2-9-5-12a17 17 0 0 0-12-5h-3a4 4 0 0 1-4-4v-3a17 17 0 0 0-5-12 17 17 0 0 0-12-5" })))));
-
-const MenuViewMore = ({ menuItems = [], isOpen, onClose }) => {
-    const { locale, configs: { enableAppIntroPage }, } = React.useContext(navigationProfileButton.NavigationContext);
-    const ecomNavItem = menuItems.find((m) => m.id === 'ecom');
-    const careNavItem = menuItems.find((m) => m.id === 'care');
-    return (React__default["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true, hideCloseBtn: true, stylesContainer: {
-            display: 'flex',
-            gap: 0,
-            padding: 0,
-        } },
-        ecomNavItem && (React__default["default"].createElement("a", { tabIndex: 0, href: ecomNavItem.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": ecomNavItem.link },
-            React__default["default"].createElement(StyleButton, { variant: "tertiary", leftIcon: React__default["default"].createElement(InitialCart, null) }, ecomNavItem.name))),
-        careNavItem && (React__default["default"].createElement("a", { tabIndex: 0, href: careNavItem.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": careNavItem.link },
-            React__default["default"].createElement(StyleButton, { variant: "tertiary", leftIcon: React__default["default"].createElement(InitialDoctor, null) }, careNavItem.name))),
-        enableAppIntroPage && (React__default["default"].createElement("a", { tabIndex: 0, href: "https://applink.hellobacsi.com/o9Q88rQh7Mb", "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": `https://applink.hellobacsi.com/o9Q88rQh7Mb` },
-            React__default["default"].createElement(StyleButton, { variant: "tertiary", leftIcon: React__default["default"].createElement(StyleWrapperIcon, null,
-                    React__default["default"].createElement(core.Logo, { width: 16, height: 15 })) }, `${index$3.LOCALE_SPECS[locale || 'en-PH'].SITE_NAME_FORMATTED} App`)))));
-};
-
 const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent, subHead, projectType, customClasses, }) => {
     var _a, _b, _c, _d;
     const { siteType, isMobile = false, locale, sitewideBanner, sitewideBannerShown = true, sponsorComponent, isHomepage = false, 
@@ -2328,7 +2375,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
     // enableProfileEcom,
      }, userState: { userInfo }, onLogout, 
     // userProfileRouterPush,
-    isUserLoading, slot, } = React.useContext(navigationProfileButton.NavigationContext);
+    isUserLoading, slot, isWinCashBackTheme: winCashBackTheme, } = React.useContext(navigationProfileButton.NavigationContext);
     const { triggerLogin } = store.useSSOV2Store();
     const { SSO_URL, HOME_PAGE_URL } = statics;
     const isSponsored = !!sponsorComponent;
@@ -2384,49 +2431,49 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
             scrolling();
     }, [isMobile]);
     const isShowingSiteWideBanner = sitewideBannerShown && !!sitewideBanner;
-    return (React__default["default"].createElement(StyledHeaderWrapper, { "data-site-type": siteType, "data-sponsored": isSponsored, "data-sitewide-banner-shown": isShowingSiteWideBanner, "data-header-type": "home", "data-collapsed": isCollapsed, "data-is-displayed": true, id: "site-header", ref: headerRef, className: customClasses.wrapper },
+    return (React__namespace["default"].createElement(StyledHeaderWrapper, { "data-site-type": siteType, "data-sponsored": isSponsored, "data-sitewide-banner-shown": isShowingSiteWideBanner, "data-header-type": "home", "data-collapsed": isCollapsed, "data-is-displayed": true, "data-win-cash-back-theme": winCashBackTheme, id: "site-header", ref: headerRef, className: customClasses.wrapper },
         sitewideBanner,
-        React__default["default"].createElement(StyledHeader, { className: customClasses.header, "data-site-type": siteType },
-            React__default["default"].createElement(StyledLeftGroup, { className: customClasses.leftGroup, "data-site-type": siteType },
-                isMobile && (React__default["default"].createElement(HamburgerMenu, { menuItems: menuItems.filter((m) => !!m.link), isHomepage: isHomepage, projectType: projectType })),
-                logoComponent || (React__default["default"].createElement("a", { style: {
+        React__namespace["default"].createElement(StyledHeader, { className: customClasses.header, "data-site-type": siteType, "data-win-cash-back-theme": winCashBackTheme },
+            React__namespace["default"].createElement(StyledLeftGroup, { className: customClasses.leftGroup, "data-site-type": siteType },
+                isMobile && (React__namespace["default"].createElement(HamburgerMenu, { menuItems: menuItems.filter((m) => !!m.link), isHomepage: isHomepage, projectType: projectType })),
+                logoComponent || (React__namespace["default"].createElement("a", { style: {
                         flexShrink: 0,
                     }, href: HOME_PAGE_URL },
-                    React__default["default"].createElement("div", null,
-                        React__default["default"].createElement(index$d.Logo, { style: {
+                    React__namespace["default"].createElement("div", null,
+                        React__namespace["default"].createElement(index$d.Logo, { style: {
                                 display: 'flex',
-                            }, type: logoType, badge: locale === 'id-ID' && (React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('sehat-badge.png'), width: "56", height: "23", loading: "lazy" })), dateForSeasonal: new Date(), locale: locale, key: typeof window !== 'undefined' ? 'client' : 'server' })))),
-                !isMobile && (React__default["default"].createElement(React__default["default"].Fragment, null, siteType === 'marryBaby' ? (React__default["default"].createElement(NavigationMenu, { menuItems: menuItems, originalMenuItems: menuItems, className: customClasses.navMenu })) : (enableSearchBar && (React__default["default"].createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile })))))),
-            React__default["default"].createElement(StyledRightGroup, { className: customClasses.rightGroup, "data-site-type": siteType },
-                !isMobile && siteType !== 'marryBaby' && (React__default["default"].createElement(NavigationMenu, { menuItems: menuItems.filter((m) => locale === Locale.LOCALE.Vietnam
+                            }, type: logoType, badge: locale === 'id-ID' && (React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('sehat-badge.png'), width: "56", height: "23", loading: "lazy" })), dateForSeasonal: new Date(), locale: locale, key: typeof window !== 'undefined' ? 'client' : 'server', isLightLogo: winCashBackTheme })))),
+                !isMobile && (React__namespace["default"].createElement(React__namespace["default"].Fragment, null, siteType === 'marryBaby' ? (React__namespace["default"].createElement(NavigationMenu, { menuItems: menuItems, originalMenuItems: menuItems, className: customClasses.navMenu })) : (enableSearchBar && (React__namespace["default"].createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile })))))),
+            React__namespace["default"].createElement(StyledRightGroup, { className: customClasses.rightGroup, "data-site-type": siteType },
+                !isMobile && siteType !== 'marryBaby' && (React__namespace["default"].createElement(NavigationMenu, { menuItems: menuItems.filter((m) => locale === Locale.LOCALE.Vietnam
                         ? m.id !== 'ecom' && m.id !== 'care'
                         : true), originalMenuItems: menuItems, className: customClasses.navMenu })),
-                React__default["default"].createElement(StyledProfileNavGroup, null,
+                React__namespace["default"].createElement(StyledProfileNavGroup, null,
                     languageMenu,
-                    enableNavChatbotAi && (React__default["default"].createElement(core$1.Box, { component: "a", href: `${normalizeLink.getCurrentBaseUrl(locale)}/ai-doctor`, "data-event-category": "Chatbot AI", "data-event-action": "Open", "data-event-label": "Hamburger Navigation", className: "ai-doctor-nav-item" },
-                        React__default["default"].createElement(StyleButtonAiChat, { variant: "tertiary", leftIcon: React__default["default"].createElement(other.ChatAi, { size: 18, color: "#2F8AF2" }), size: "md", className: "ai-doctor-btn" }, (_b = index$3.LOCALE_SPECS[locale]) === null || _b === void 0 ? void 0 :
+                    enableNavChatbotAi && (React__namespace["default"].createElement(core$1.Box, { component: "a", href: `${normalizeLink.getCurrentBaseUrl(locale)}/ai-doctor`, "data-event-category": "Chatbot AI", "data-event-action": "Open", "data-event-label": "Hamburger Navigation", className: "ai-doctor-nav-item" },
+                        React__namespace["default"].createElement(StyleButtonAiChat, { variant: "tertiary", leftIcon: React__namespace["default"].createElement(other.ChatAi, { size: 18, color: "#2F8AF2" }), size: "md", className: "ai-doctor-btn" }, (_b = index$3.LOCALE_SPECS[locale]) === null || _b === void 0 ? void 0 :
                             _b.SITE_NAME,
                             " AI"))),
-                    enableNavClinityDownload && (React__default["default"].createElement(core$1.Box, { component: "a", href: `${(_c = index$3.STATIC_PAGES[locale]) === null || _c === void 0 ? void 0 : _c.CLINITY_DOWNLOAD_LINK}`, target: "_blank", "data-event-category": "Hamburger Navigation", "data-event-action": "Download Clinity", "data-event-label": `${(_d = index$3.STATIC_PAGES[locale]) === null || _d === void 0 ? void 0 : _d.CLINITY_DOWNLOAD_LINK}`, "data-cart-menu": true },
-                        React__default["default"].createElement("img", { src: index$5.CommonGAssets.getAssetPath('clinity-download.png'), alt: "Clinity", className: "clinity-logo", style: { display: 'block' } }))),
+                    enableNavClinityDownload && (React__namespace["default"].createElement(core$1.Box, { component: "a", href: `${(_c = index$3.STATIC_PAGES[locale]) === null || _c === void 0 ? void 0 : _c.CLINITY_DOWNLOAD_LINK}`, target: "_blank", "data-event-category": "Hamburger Navigation", "data-event-action": "Download Clinity", "data-event-label": `${(_d = index$3.STATIC_PAGES[locale]) === null || _d === void 0 ? void 0 : _d.CLINITY_DOWNLOAD_LINK}`, "data-cart-menu": true },
+                        React__namespace["default"].createElement("img", { src: index$6.CommonGAssets.getAssetPath('clinity-download.png'), alt: "Clinity", className: "clinity-logo", style: { display: 'block' } }))),
                     slot,
-                    React__default["default"].createElement(navigationProfileButton.NavigationProfileButton, { userInfo: userInfo, siteType: siteType, onLoginClick: onLoginClick || goToLogin, 
+                    React__namespace["default"].createElement(navigationProfileButton.NavigationProfileButton, { userInfo: userInfo, siteType: siteType, onLoginClick: onLoginClick || goToLogin, 
                         // SSO_URL={normalizeLink(statics.SSO_URL)}
                         currentUrl: currentUrl, onLogout: onLogout, isLoading: isUserLoading, locale: locale, enableAppIntroPage: enableAppIntroPage, isMobile: isMobile, className: customClasses.profileBtn }),
-                    cartNumber !== undefined && (React__default["default"].createElement(React__default["default"].Fragment, null,
-                        !isMobile && (React__default["default"].createElement("hr", { style: {
+                    cartNumber !== undefined && (React__namespace["default"].createElement(React__namespace["default"].Fragment, null,
+                        !isMobile && (React__namespace["default"].createElement("hr", { style: {
                                 height: 20,
                                 width: 0,
                                 border: 'none',
                                 borderLeft: '1px solid #E4E8EC',
                             } })),
-                        React__default["default"].createElement(CartBadge, { "data-cart-menu": "true", "data-event-category": "Ecommerce", "data-event-action": "Cart Click", "data-event-label": currentUrl, count: cartNumber, locale: locale })))))),
-        isMobile && isHomepage && (React__default["default"].createElement(StyleWrapperNavigtionSearch, null,
-            React__default["default"].createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile, isHomepage: isHomepage }))),
+                        React__namespace["default"].createElement(CartBadge, { "data-cart-menu": "true", "data-event-category": "Ecommerce", "data-event-action": "Cart Click", "data-event-label": currentUrl, count: cartNumber, locale: locale })))))),
+        isMobile && isHomepage && (React__namespace["default"].createElement(StyleWrapperNavigtionSearch, { style: { padding: winCashBackTheme ? '12px 16px' : undefined } },
+            React__namespace["default"].createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile, isHomepage: isHomepage }))),
         sponsorComponent
-            ? !React__default["default"].isValidElement(sponsorComponent)
+            ? !React__namespace["default"].isValidElement(sponsorComponent)
                 ? sponsorComponent
-                : React__default["default"].cloneElement(sponsorComponent, {
+                : React__namespace["default"].cloneElement(sponsorComponent, {
                     isCollapsed,
                     locale,
                     isMobile,
@@ -2434,12 +2481,12 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
             : null,
         subHead && subHead));
 };
-const NavigtionSearch = ({ siteType, projectType, isMobile = false, isHomepage = false, isRedirectSearchPage = false, }) => (React__default["default"].createElement(DisplayWrapper, { mediaQueryKey: "mbUp", className: `${siteType === 'marryBaby' ? 'marry-baby' : ''} ${isHomepage ? 'block-show' : ''}` },
-    React__default["default"].createElement(SearchInput, { id: "desktop", projectType: projectType, isMobile: isMobile, isHomepage: isHomepage, isRedirectSearchPage: isRedirectSearchPage })));
+const NavigtionSearch = ({ siteType, projectType, isMobile = false, isHomepage = false, isRedirectSearchPage = false, }) => (React__namespace["default"].createElement(DisplayWrapper, { mediaQueryKey: "mbUp", className: `${siteType === 'marryBaby' ? 'marry-baby' : ''} ${isHomepage ? 'block-show' : ''}` },
+    React__namespace["default"].createElement(SearchInput, { id: "desktop", projectType: projectType, isMobile: isMobile, isHomepage: isHomepage, isRedirectSearchPage: isRedirectSearchPage })));
 const NavigationMenu = ({ menuItems, originalMenuItems, className, }) => {
     const { siteType, locale, ssrMenuContent: { categories, healthTools, care, together, videos }, } = React.useContext(navigationProfileButton.NavigationContext);
-    return (React__default["default"].createElement(DisplayWrapper, { className: className, mediaQueryKey: "mbUp", style: { height: '100%' } },
-        React__default["default"].createElement(StyledWrapMenuItems, { "data-site-type": siteType }, menuItems === null || menuItems === void 0 ? void 0 : menuItems.map((menuItem, index) => (React__default["default"].createElement(ItemMenu, { key: index, item: menuItem, menu: menuItem.popupType === 'categories' ? (React__default["default"].createElement(MenuCategoriesList, { categories: categories === null || categories === void 0 ? void 0 : categories.items, spotlightsList: categories === null || categories === void 0 ? void 0 : categories.spotlights })) : menuItem.popupType === 'tools' ? (React__default["default"].createElement(MenuHealthToolsList, { locale: locale, healthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.items, spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights })) : menuItem.popupType === 'together' ? (React__default["default"].createElement(MenuCommunitiesList, { communities: together === null || together === void 0 ? void 0 : together.items, spotlights: together === null || together === void 0 ? void 0 : together.spotlights })) : menuItem.popupType === 'care' ? (React__default["default"].createElement(MenuCareList, { careSpecialties: care === null || care === void 0 ? void 0 : care.items, spotlights: care === null || care === void 0 ? void 0 : care.spotlights })) : menuItem.popupType === 'video' ? (React__default["default"].createElement(MenuVideoList, { spotlightsList: videos === null || videos === void 0 ? void 0 : videos.spotlights })) : menuItem.popupType === 'other' ? (React__default["default"].createElement(MenuViewMore, { menuItems: originalMenuItems })) : null }))))));
+    return (React__namespace["default"].createElement(DisplayWrapper, { className: className, mediaQueryKey: "mbUp", style: { height: '100%' } },
+        React__namespace["default"].createElement(StyledWrapMenuItems, { "data-site-type": siteType }, menuItems === null || menuItems === void 0 ? void 0 : menuItems.map((menuItem, index) => (React__namespace["default"].createElement(ItemMenu, { key: index, item: menuItem, menu: menuItem.popupType === 'categories' ? (React__namespace["default"].createElement(MenuCategoriesList, { categories: categories === null || categories === void 0 ? void 0 : categories.items, spotlightsList: categories === null || categories === void 0 ? void 0 : categories.spotlights })) : menuItem.popupType === 'tools' ? (React__namespace["default"].createElement(MenuHealthToolsList, { locale: locale, healthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.items, spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights })) : menuItem.popupType === 'together' ? (React__namespace["default"].createElement(MenuCommunitiesList, { communities: together === null || together === void 0 ? void 0 : together.items, spotlights: together === null || together === void 0 ? void 0 : together.spotlights })) : menuItem.popupType === 'care' ? (React__namespace["default"].createElement(MenuCareList, { careSpecialties: care === null || care === void 0 ? void 0 : care.items, spotlights: care === null || care === void 0 ? void 0 : care.spotlights })) : menuItem.popupType === 'video' ? (React__namespace["default"].createElement(MenuVideoList, { spotlightsList: videos === null || videos === void 0 ? void 0 : videos.spotlights })) : menuItem.popupType === 'other' ? (React__namespace["default"].createElement(MenuViewMore, { menuItems: originalMenuItems })) : null }))))));
 };
 
 const useHeaderHeight = ({ hasSponsoredBanners, isSponsored, isShowingSiteWideBanner, isMobile, }) => {
@@ -2554,8 +2601,8 @@ const useNavServices = () => {
                 link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/categories/`,
                 niceName: '',
                 thumbnail: isMarryBaby
-                    ? index$5.CommonGAssets.getAssetPath('categories-mb.svg')
-                    : index$5.CommonGAssets.getAssetPath('nav-icons/discover.svg'),
+                    ? index$6.CommonGAssets.getAssetPath('categories-mb.svg')
+                    : index$6.CommonGAssets.getAssetPath('nav-icons/discover.svg'),
                 popupType: 'categories',
             });
         enableNavVideo &&
@@ -2564,7 +2611,7 @@ const useNavServices = () => {
                 id: 'video',
                 link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/videos/`,
                 niceName: '',
-                thumbnail: index$5.CommonGAssets.getAssetPath('nav-icons/video.svg'),
+                thumbnail: index$6.CommonGAssets.getAssetPath('nav-icons/video.svg'),
                 popupType: 'video',
             });
         enableNavHealthTools &&
@@ -2573,8 +2620,8 @@ const useNavServices = () => {
                 id: 'tools',
                 link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`,
                 thumbnail: isMarryBaby
-                    ? index$5.CommonGAssets.getAssetPath('healthtools-mb.svg')
-                    : index$5.CommonGAssets.getAssetPath('nav-icons/health-tools.svg'),
+                    ? index$6.CommonGAssets.getAssetPath('healthtools-mb.svg')
+                    : index$6.CommonGAssets.getAssetPath('nav-icons/health-tools.svg'),
                 popupType: 'tools',
             });
         enableNavTogether &&
@@ -2583,8 +2630,8 @@ const useNavServices = () => {
                 id: 'together',
                 link: normalizeLink.normalizeLinkSlash(statics.TOGETHER_URL_FE + '/'),
                 thumbnail: isMarryBaby
-                    ? index$5.CommonGAssets.getAssetPath('community-mb.svg')
-                    : index$5.CommonGAssets.getAssetPath('nav-icons/community.svg'),
+                    ? index$6.CommonGAssets.getAssetPath('community-mb.svg')
+                    : index$6.CommonGAssets.getAssetPath('nav-icons/community.svg'),
                 popupType: 'together',
             });
         enableNavEcom &&
@@ -2592,7 +2639,7 @@ const useNavServices = () => {
                 name: t('home.navigator.menuItem.helloEcom'),
                 id: 'ecom',
                 link: normalizeLink.normalizeLinkSlash(statics.HOME_PAGE_URL + '/shop/'),
-                thumbnail: index$5.CommonGAssets.getAssetPath('nav-icons/shop.svg'),
+                thumbnail: index$6.CommonGAssets.getAssetPath('nav-icons/shop.svg'),
                 popupType: null,
             });
         enableNavCare &&
@@ -2600,7 +2647,7 @@ const useNavServices = () => {
                 name: t('home.navigator.menuItem.helloCare'),
                 id: 'care',
                 link: normalizeLink.normalizeLinkSlash(statics.HOME_PAGE_URL + '/care/'),
-                thumbnail: index$5.CommonGAssets.getAssetPath('nav-icons/care.svg'),
+                thumbnail: index$6.CommonGAssets.getAssetPath('nav-icons/care.svg'),
                 popupType: null,
             });
         enableNavViewMore &&
@@ -2610,7 +2657,7 @@ const useNavServices = () => {
                 link: '',
                 thumbnail: '',
                 popupType: 'other',
-                icon: (React__default["default"].createElement(HamburgerIcon, { siteType: siteType, enableSearch: false, style: {
+                icon: (React__namespace["default"].createElement(HamburgerIcon, { siteType: siteType, enableSearch: false, style: {
                         width: '16px',
                         height: '16px',
                     }, className: "mobile-hamburger-icon" })),
@@ -2661,18 +2708,24 @@ const _NavigationV2 = (props) => {
         hasSponsoredBanners,
         isMobile,
     });
-    return (React__default["default"].createElement(StyledContainer, { id: "navigation-v2", style: {
+    React.useEffect(() => {
+        document.documentElement.style.setProperty('--header-height', `${headerHeight}px`);
+        return () => {
+            document.documentElement.style.removeProperty('--header-height');
+        };
+    }, [headerHeight]);
+    return (React__namespace["default"].createElement(StyledContainer, { id: "navigation-v2", style: {
             '--default-header-height': defaultHeaderHeight + 'px',
             '--header-height': `calc(${headerHeight}px - var(--amp-site-wide-closed), 64px)`,
             '--header-bottom': headerBottom + 'px',
         }, className: className },
-        React__default["default"].createElement("section", { ref: headerRef },
-            React__default["default"].createElement(NavigationBar, { menuItems: services, onTopBarAppears: onTopBarAppears, logoComponent: logoComponent, subHead: subHead, projectType: projectType, languageMenu: React__default["default"].createElement(index$8.LanguageSwitcher, { languageOptions: languageOptions, locale: locale }), customClasses: customClasses }))));
+        React__namespace["default"].createElement("section", { ref: headerRef },
+            React__namespace["default"].createElement(NavigationBar, { menuItems: services, onTopBarAppears: onTopBarAppears, logoComponent: logoComponent, subHead: subHead, projectType: projectType, languageMenu: React__namespace["default"].createElement(index$b.LanguageSwitcher, { languageOptions: languageOptions, locale: locale }), customClasses: customClasses }))));
 };
 const NavigationV2 = (props) => {
     const propsWithDefaultValues = Object.assign({ siteType: 'helloSites', projectType: 'discover', locale: 'vi-VN', activeMenuService: 'categories', ssrMenuContent: {} }, props);
-    return (React__default["default"].createElement(navigationProfileButton.NavigationProvider, Object.assign({}, propsWithDefaultValues),
-        React__default["default"].createElement(_NavigationV2, Object.assign({}, propsWithDefaultValues))));
+    return (React__namespace["default"].createElement(navigationProfileButton.NavigationProvider, Object.assign({}, propsWithDefaultValues),
+        React__namespace["default"].createElement(_NavigationV2, Object.assign({}, propsWithDefaultValues))));
 };
 const getNavMenuContent = (locale) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
@@ -2741,7 +2794,9 @@ const getNavMenuContentWithCache = (locale) => tslib_es6.__awaiter(void 0, void
 });
 
 exports.HHG_SEARCH_BACK_KEY = HHG_SEARCH_BACK_KEY;
+exports.HamburgerWhite = HamburgerWhite;
 exports.NavigationV2 = NavigationV2;
+exports.StarPair = StarPair;
 exports.getNavMenuContent = getNavMenuContent;
 exports.getNavMenuContentWithCache = getNavMenuContentWithCache;
 exports.getTogetherUserPostsApiPath = getTogetherUserPostsApiPath;