@royaloperahouse/harmonic 0.15.0 → 0.17.0-a

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/CHANGELOG.md +0 -7
  2. package/README.md +252 -43
  3. package/dist/components/atoms/TextField/TextField.style.d.ts +1 -1
  4. package/dist/components/index.d.ts +2 -2
  5. package/dist/components/molecules/Card/Card.style.d.ts +1 -1
  6. package/dist/components/molecules/ContentSummary/ContentSummary.style.d.ts +1 -1
  7. package/dist/components/molecules/Information/Information.style.d.ts +1 -1
  8. package/dist/components/molecules/PageHeading/HighlightCarousel/HighlightCarousel.d.ts +4 -0
  9. package/dist/components/molecules/PageHeading/HighlightCarousel/HighlightCarousel.style.d.ts +14 -0
  10. package/dist/components/molecules/PageHeading/HighlightCarousel/index.d.ts +2 -0
  11. package/dist/components/molecules/PageHeading/index.d.ts +2 -2
  12. package/dist/components/molecules/Pagination/Pagination.style.d.ts +1 -1
  13. package/dist/components/molecules/PromoWithTags/PromoWithTags.style.d.ts +273 -3
  14. package/dist/components/molecules/PromoWithTitle/PromoWithTitle.style.d.ts +273 -3
  15. package/dist/components/molecules/index.d.ts +2 -2
  16. package/dist/components/organisms/Carousels/Carousel/Carousel.style.d.ts +271 -1
  17. package/dist/harmonic.cjs.development.js +126 -101
  18. package/dist/harmonic.cjs.development.js.map +1 -1
  19. package/dist/harmonic.cjs.production.min.js +1 -1
  20. package/dist/harmonic.cjs.production.min.js.map +1 -1
  21. package/dist/harmonic.esm.js +126 -101
  22. package/dist/harmonic.esm.js.map +1 -1
  23. package/dist/index.d.ts +2 -2
  24. package/dist/types/impactHeader.d.ts +2 -20
  25. package/dist/types/types.d.ts +0 -61
  26. package/package.json +1 -1
  27. package/README.GIT +0 -294
  28. package/dist/components/molecules/CastFilter/CastFilters.d.ts +0 -4
  29. package/dist/components/molecules/CastFilter/CastFilters.style.d.ts +0 -16
  30. package/dist/components/molecules/CastFilter/index.d.ts +0 -2
  31. package/dist/components/molecules/PageHeading/Highlight/Highlight.d.ts +0 -4
  32. package/dist/components/molecules/PageHeading/Highlight/Highlight.style.d.ts +0 -9
  33. package/dist/components/molecules/PageHeading/Highlight/index.d.ts +0 -2
@@ -7527,7 +7527,7 @@ var SwipeGridWrapper = /*#__PURE__*/styled(GridItem)(_templateObject9$4 || (_tem
7527
7527
 
7528
7528
  var _templateObject$O, _templateObject2$B;
7529
7529
  var SWIPE_SLIDE_CLASS_NAME = 'swipe-slide';
7530
- var SwipeContainer = /*#__PURE__*/styled.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n width: 100%;\n touch-action: pan-y;\n padding-inline-start: 2px;\n padding-block-start: 2px;\n"])));
7530
+ var SwipeContainer = /*#__PURE__*/styled.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n width: 100%;\n touch-action: pan-y;\n"])));
7531
7531
  var SwipeTrack = /*#__PURE__*/styled.div(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n transition: ", ";\n transform: translateX(", ");\n\n .", " {\n flex-shrink: 0;\n }\n"])), function (_ref) {
7532
7532
  var transitioning = _ref.transitioning;
7533
7533
  return transitioning ? 'transform 0.3s ease' : 'none';
@@ -9889,58 +9889,10 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
9889
9889
  })))))))))));
9890
9890
  };
9891
9891
 
9892
- var _templateObject$15, _templateObject2$Q, _templateObject3$E, _templateObject4$y;
9893
- var GRID = {
9894
- desktop: {
9895
- leftWithImage: '1 / 1 / 3 / 7',
9896
- leftNoImage: '1 / 1 / 3 / 12',
9897
- right: '1 / 7 / 3 / 17'
9898
- },
9899
- mobile: {
9900
- leftWithImage: '3 / 1 / 4 / 15',
9901
- leftNoImage: '1 / 1 / 3 / 15',
9902
- right: '2 / 1 / 3 / 15'
9903
- }
9904
- };
9905
- var HighlightPanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n background-color: ", ";\n color: var(--color-base-white);\n"])), function (_ref) {
9906
- var $background = _ref.$background;
9907
- return "var(--color-" + $background + ")";
9908
- });
9909
- var LeftPanel$1 = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
9910
- var hasImage = _ref2.hasImage;
9911
- return hasImage ? GRID.desktop.leftWithImage : GRID.desktop.leftNoImage;
9912
- }, devices.mobileAndTablet, function (_ref3) {
9913
- var hasImage = _ref3.hasImage;
9914
- return hasImage ? GRID.mobile.leftWithImage : GRID.mobile.leftNoImage;
9915
- });
9916
- var RightPanel$1 = /*#__PURE__*/styled.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--color-base-black);\n\n @media ", " {\n grid-area: ", ";\n }\n"])), GRID.desktop.right, devices.mobileAndTablet, GRID.mobile.right);
9917
- var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px 36px 36px 50px;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px 5px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
9918
-
9919
- var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
9920
- var _image$src, _image$alt;
9921
- var image = _ref.image,
9922
- children = _ref.children,
9923
- _ref$background = _ref.background,
9924
- background = _ref$background === void 0 ? 'base-black' : _ref$background,
9925
- className = _ref.className;
9926
- return /*#__PURE__*/React__default.createElement(HighlightPanelGrid, {
9927
- className: className,
9928
- "$background": background,
9929
- "data-testid": "highlight-heading-wrapper"
9930
- }, /*#__PURE__*/React__default.createElement(LeftPanel$1, {
9931
- hasImage: !!image
9932
- }, /*#__PURE__*/React__default.createElement(Wrapper$6, null, children)), image && (/*#__PURE__*/React__default.createElement(RightPanel$1, null, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
9933
- aspectRatio: AspectRatio['4:3']
9934
- }, /*#__PURE__*/React__default.createElement("img", {
9935
- src: (_image$src = image == null ? void 0 : image.src) != null ? _image$src : '',
9936
- alt: (_image$alt = image == null ? void 0 : image.alt) != null ? _image$alt : ''
9937
- })))));
9938
- };
9939
-
9940
- var _templateObject$16, _templateObject2$R, _templateObject3$F, _templateObject5$r, _templateObject6$k, _templateObject7$g, _templateObject8$c, _templateObject9$8, _templateObject0$7;
9941
- var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
9942
- var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
9943
- var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
9892
+ var _templateObject$15, _templateObject2$Q, _templateObject3$E, _templateObject5$r, _templateObject6$k, _templateObject7$g, _templateObject8$c, _templateObject9$8, _templateObject0$7;
9893
+ var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
9894
+ var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
9895
+ var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
9944
9896
  var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
9945
9897
  var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n width: 210px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n svg {\n width: 145px;\n }\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n\n svg {\n width: 180px;\n }\n }\n"])), function (_ref) {
9946
9898
  var invert = _ref.invert,
@@ -10161,13 +10113,86 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
10161
10113
  }), linkText))))));
10162
10114
  };
10163
10115
 
10164
- var _templateObject$17, _templateObject2$S, _templateObject3$G, _templateObject5$s, _templateObject6$l, _templateObject7$h, _templateObject8$d;
10116
+ var _templateObject$16, _templateObject2$R, _templateObject3$F, _templateObject4$y, _templateObject5$s, _templateObject6$l, _templateObject7$h;
10117
+ var HighlightsGrid$1 = /*#__PURE__*/styled(Grid)(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n user-select: none;\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
10118
+ var HighlightTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h1 {\n margin: 0 0 8px 0;\n }\n p {\n text-transform: uppercase;\n }\n"])));
10119
+ var HighlightTextWrapper = /*#__PURE__*/styled.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobile);
10120
+ var HighlightsInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: ", ";\n width: 100%;\n padding: 20px;\n }\n }\n"])), function (_ref) {
10121
+ var hasImages = _ref.hasImages;
10122
+ return hasImages ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
10123
+ }, devices.mobile, function (_ref2) {
10124
+ var hasImages = _ref2.hasImages;
10125
+ return hasImages ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
10126
+ });
10127
+ var HighlightsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--color-base-black);\n\n .swipe-slide {\n ", "\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 3 / 15;\n\n .swiper-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n"])), function (_ref3) {
10128
+ var hasMultipleImages = _ref3.hasMultipleImages;
10129
+ return hasMultipleImages ? 'width: calc(100% - 50px - var(--rotator-button-width)); -webkit-transform: translate3d(0, 0, 0);' : 'width: 100%';
10130
+ }, devices.mobile);
10131
+ var RotatorButtonsWrapperMobile$1 = /*#__PURE__*/styled.div(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin-bottom: 8px;\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\n & {\n display: flex;\n margin-left: 100px;\n align-self: center;\n justify-content: flex-end;\n }\n }\n"])), devices.mobile);
10132
+ var RotatorButtonsWrapper$1 = /*#__PURE__*/styled.div(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: 50px;\n top: calc(50% - calc(var(--rotator-button-width) / 2));\n z-index: 2;\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.mobileAndTablet);
10133
+
10134
+ var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
10135
+ var title = _ref.title,
10136
+ subtitle = _ref.subtitle,
10137
+ text = _ref.text,
10138
+ images = _ref.images;
10139
+ var headerImages = images || [];
10140
+ var hasImages = !!headerImages.length;
10141
+ var hasMultipleImages = headerImages.length > 1;
10142
+ var swipeRef = useRef(null);
10143
+ var onNext = function onNext() {
10144
+ var _swipeRef$current;
10145
+ return (_swipeRef$current = swipeRef.current) == null ? void 0 : _swipeRef$current.nextSlide();
10146
+ };
10147
+ var onPrev = function onPrev() {
10148
+ var _swipeRef$current2;
10149
+ return (_swipeRef$current2 = swipeRef.current) == null ? void 0 : _swipeRef$current2.prevSlide();
10150
+ };
10151
+ return /*#__PURE__*/React__default.createElement(HarmonicThemeProvider, {
10152
+ theme: ThemeType.Stream
10153
+ }, /*#__PURE__*/React__default.createElement(HighlightsGrid$1, null, hasImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapperMobile$1, null, hasMultipleImages && /*#__PURE__*/React__default.createElement(RotatorButtons, {
10154
+ onClickNext: onNext,
10155
+ onClickPrev: onPrev
10156
+ }))), /*#__PURE__*/React__default.createElement(HighlightsInfoWrapper, {
10157
+ hasImages: hasImages
10158
+ }, /*#__PURE__*/React__default.createElement(HighlightTitleWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
10159
+ size: "large",
10160
+ hierarchy: "h1"
10161
+ }, title), /*#__PURE__*/React__default.createElement(HarmonicOverline, {
10162
+ size: "large"
10163
+ }, subtitle)), text ? (/*#__PURE__*/React__default.createElement(HighlightTextWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, null, /*#__PURE__*/React__default.createElement("span", {
10164
+ dangerouslySetInnerHTML: {
10165
+ __html: text
10166
+ }
10167
+ })))) : null), hasImages && (/*#__PURE__*/React__default.createElement(HighlightsCarouselWrapper, {
10168
+ hasMultipleImages: hasMultipleImages
10169
+ }, hasMultipleImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$1, {
10170
+ "data-testid": "rotator-buttons"
10171
+ }, /*#__PURE__*/React__default.createElement(RotatorButtons, {
10172
+ onClickNext: onNext,
10173
+ onClickPrev: onPrev
10174
+ }))), /*#__PURE__*/React__default.createElement(Swipe, {
10175
+ infinite: hasMultipleImages,
10176
+ ref: swipeRef
10177
+ }, headerImages.map(function (image, index) {
10178
+ return /*#__PURE__*/React__default.createElement("div", {
10179
+ key: "carousel-image-" + index
10180
+ }, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
10181
+ aspectRatio: AspectRatio['4:3']
10182
+ }, /*#__PURE__*/React__default.createElement("img", {
10183
+ src: image.src,
10184
+ alt: image.alt
10185
+ })));
10186
+ }))))));
10187
+ };
10188
+
10189
+ var _templateObject$17, _templateObject2$S, _templateObject3$G, _templateObject5$t, _templateObject6$m, _templateObject7$i, _templateObject8$d;
10165
10190
  var linkButtonStyles = /*#__PURE__*/css(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n background: none;\n border: none;\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n font: inherit;\n padding: 0;\n\n span {\n height: 1.5em;\n width: 1.5em;\n\n svg > path {\n fill: var(--color-base-black);\n }\n }\n\n &:hover {\n outline: none;\n }\n"])));
10166
10191
  var PageNav = /*#__PURE__*/styled.a(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
10167
10192
  var PaginationLink = /*#__PURE__*/styled.a(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
10168
- var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: 0 auto;\n\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n\n li:first-child {\n margin-left: 0px;\n }\n"])));
10169
- var LastPageItem = /*#__PURE__*/styled.li(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10170
- var PreviousPageItem = /*#__PURE__*/styled.li(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10193
+ var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: 0 auto;\n\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n\n li:first-child {\n margin-left: 0px;\n }\n"])));
10194
+ var LastPageItem = /*#__PURE__*/styled.li(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10195
+ var PreviousPageItem = /*#__PURE__*/styled.li(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
10171
10196
  var TextLinkPagination = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: ", ";\n border-bottom: ", ";\n }\n\n :hover {\n cursor: pointer;\n color: var(--color-primary-red);\n border-bottom: 1px solid var(--color-primary-red);\n svg > path {\n fill: var(--color-base-black);\n }\n }\n"])), function (_ref) {
10172
10197
  var active = _ref.active;
10173
10198
  return active ? "var(--color-primary-red)" : 'inherit';
@@ -10320,14 +10345,14 @@ var Pagination = function Pagination(_ref) {
10320
10345
  }))))));
10321
10346
  };
10322
10347
 
10323
- var _templateObject$18, _templateObject2$T, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$m, _templateObject7$i;
10348
+ var _templateObject$18, _templateObject2$T, _templateObject3$H, _templateObject4$z, _templateObject5$u, _templateObject6$n, _templateObject7$j;
10324
10349
  var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n p {\n margin: 0;\n }\n\n grid-template-columns: 1fr 1fr 1fr;\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
10325
10350
  var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
10326
10351
  var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
10327
10352
  var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
10328
- var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
10329
- var PersonLink = /*#__PURE__*/styled.a(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
10330
- var ReplacementWrapper = /*#__PURE__*/styled.span(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
10353
+ var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
10354
+ var PersonLink = /*#__PURE__*/styled.a(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
10355
+ var ReplacementWrapper = /*#__PURE__*/styled.span(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
10331
10356
 
10332
10357
  var Person = function Person(_ref) {
10333
10358
  var person = _ref.person,
@@ -10518,7 +10543,7 @@ var CreditListing = function CreditListing(_ref) {
10518
10543
  }, creditEntries);
10519
10544
  };
10520
10545
 
10521
- var _templateObject$1a, _templateObject3$J, _templateObject4$B, _templateObject5$u, _templateObject6$n, _templateObject7$j, _templateObject8$e, _templateObject9$9, _templateObject0$8, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16;
10546
+ var _templateObject$1a, _templateObject3$J, _templateObject4$B, _templateObject5$v, _templateObject6$o, _templateObject7$k, _templateObject8$e, _templateObject9$9, _templateObject0$8, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16;
10522
10547
  var LENGTH_TEXT = 28;
10523
10548
  var LENGTH_TEXT_TABLET$1 = 12;
10524
10549
  var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
@@ -10566,9 +10591,9 @@ var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject4$B || (_te
10566
10591
  var mobileMarginBottom = _ref8.mobileMarginBottom;
10567
10592
  return mobileMarginBottom && "\n @media " + devices.mobile + " {\n margin-bottom: " + mobileMarginBottom + "px;\n }\n ";
10568
10593
  });
10569
- var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
10570
- var TextLinkWrapper$3 = /*#__PURE__*/styled.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
10571
- var ExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
10594
+ var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
10595
+ var TextLinkWrapper$3 = /*#__PURE__*/styled.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
10596
+ var ExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
10572
10597
  var IconWrapper$2 = /*#__PURE__*/styled.div(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n position: absolute;\n top: 25px;\n right: 35px;\n width: 24px;\n height: 24px;\n\n @media ", " {\n top: 30px;\n right: 30px;\n }\n\n @media ", " {\n top: 3px;\n right: 20px;\n }\n"])), devices.tablet, devices.mobile);
10573
10598
  var PrimaryButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
10574
10599
  var MobileTitleWrapper = /*#__PURE__*/styled.div(_templateObject0$8 || (_templateObject0$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin: 0 50px 0 20px;\n\n h2,\n h3 {\n margin: 0;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
@@ -10773,7 +10798,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
10773
10798
  }))));
10774
10799
  };
10775
10800
 
10776
- var _templateObject$1b, _templateObject2$V, _templateObject3$K, _templateObject4$C, _templateObject5$v, _templateObject6$o, _templateObject7$k;
10801
+ var _templateObject$1b, _templateObject2$V, _templateObject3$K, _templateObject4$C, _templateObject5$w, _templateObject6$p, _templateObject7$l;
10777
10802
  var LENGTH_TEXT$2 = 28;
10778
10803
  var LENGTH_TEXT_TABLET$2 = 10;
10779
10804
  var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n"])), function (_ref) {
@@ -10792,9 +10817,9 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$K ||
10792
10817
  return imageToLeft ? 'right' : 'left';
10793
10818
  }, devices.mobile);
10794
10819
  var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled(HarmonicHeader)(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
10795
- var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
10796
- var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
10797
- var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
10820
+ var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
10821
+ var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
10822
+ var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
10798
10823
  var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
10799
10824
  primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
10800
10825
  _ref5$tertiaryButtonT = _ref5.tertiaryButtonTextLength,
@@ -11149,7 +11174,7 @@ var SectionTitle = function SectionTitle(_ref) {
11149
11174
  }, description)))));
11150
11175
  };
11151
11176
 
11152
- var _templateObject$1g, _templateObject2$Y, _templateObject3$N, _templateObject4$D, _templateObject5$w, _templateObject6$p, _templateObject7$l, _templateObject8$f, _templateObject9$a, _templateObject0$9, _templateObject1$5;
11177
+ var _templateObject$1g, _templateObject2$Y, _templateObject3$N, _templateObject4$D, _templateObject5$x, _templateObject6$q, _templateObject7$m, _templateObject8$f, _templateObject9$a, _templateObject0$9, _templateObject1$5;
11153
11178
  var stateStyles = /*#__PURE__*/css(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &:focus,\n &.focus {\n outline: ", ";\n }\n\n &.disabled {\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n cursor: none;\n }\n"])), function (_ref) {
11154
11179
  var theme = _ref.theme;
11155
11180
  return "3px solid " + theme.colors.lapisLazuli;
@@ -11173,9 +11198,9 @@ var ArrowIcon = /*#__PURE__*/styled(Icon).attrs(function (_ref5) {
11173
11198
  color: theme.colors.black,
11174
11199
  title: 'Select Arrow'
11175
11200
  };
11176
- })(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
11177
- var Wrapper$7 = /*#__PURE__*/styled.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
11178
- var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
11201
+ })(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
11202
+ var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
11203
+ var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
11179
11204
  var Options = /*#__PURE__*/styled.div(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
11180
11205
  var Option = /*#__PURE__*/styled.li(_templateObject9$a || (_templateObject9$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
11181
11206
  var theme = _ref6.theme,
@@ -11483,7 +11508,7 @@ function Select(_ref3) {
11483
11508
  }
11484
11509
  setSelectedValue(options[0]);
11485
11510
  }, [options, resetWhenOptionsUpdate]);
11486
- return /*#__PURE__*/React__default.createElement(Wrapper$7, null, label !== '' && (/*#__PURE__*/React__default.createElement(BodyText, {
11511
+ return /*#__PURE__*/React__default.createElement(Wrapper$6, null, label !== '' && (/*#__PURE__*/React__default.createElement(BodyText, {
11487
11512
  level: 1,
11488
11513
  tag: "p",
11489
11514
  "data-testid": "select-label"
@@ -11669,7 +11694,7 @@ var SelectComponent$1 = function SelectComponent(_ref) {
11669
11694
  };
11670
11695
 
11671
11696
  var _templateObject$1i, _templateObject2$_;
11672
- var Wrapper$8 = /*#__PURE__*/styled.figure(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n margin: 0;\n\n ", " {\n height: calc(100% - 34px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n\n @media ", " {\n height: calc(100% - 30px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
11697
+ var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n margin: 0;\n\n ", " {\n height: calc(100% - 34px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n\n @media ", " {\n height: calc(100% - 30px);\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
11673
11698
  var _ref$aspectRatio = _ref.aspectRatio,
11674
11699
  aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
11675
11700
  return aspectRatio;
@@ -11757,7 +11782,7 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
11757
11782
  };
11758
11783
  return /*#__PURE__*/React__default.cloneElement(childElement, newProps);
11759
11784
  });
11760
- return /*#__PURE__*/React__default.createElement(Wrapper$8, {
11785
+ return /*#__PURE__*/React__default.createElement(Wrapper$7, {
11761
11786
  aspectRatio: aspectRatio,
11762
11787
  ref: wrapperRef,
11763
11788
  height: height
@@ -11768,13 +11793,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
11768
11793
  }, caption));
11769
11794
  };
11770
11795
 
11771
- var _templateObject$1j, _templateObject2$$, _templateObject3$P, _templateObject4$F, _templateObject5$x, _templateObject6$q;
11796
+ var _templateObject$1j, _templateObject2$$, _templateObject3$P, _templateObject4$F, _templateObject5$y, _templateObject6$r;
11772
11797
  var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n width: 100%;\n display: grid;\n grid-template-columns: repeat(7, minmax(0, 1fr));\n gap: 15px;\n min-height: 50px;\n"])));
11773
11798
  var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
11774
11799
  var StyledImage = /*#__PURE__*/styled.img(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
11775
11800
  var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
11776
- var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
11777
- var TitleWrapper$5 = /*#__PURE__*/styled.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
11801
+ var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
11802
+ var TitleWrapper$5 = /*#__PURE__*/styled.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
11778
11803
 
11779
11804
  var MiniCard = function MiniCard(_ref) {
11780
11805
  var _ref$title = _ref.title,
@@ -11812,7 +11837,7 @@ var MiniCard = function MiniCard(_ref) {
11812
11837
  }, title)))));
11813
11838
  };
11814
11839
 
11815
- var _templateObject$1k, _templateObject2$10, _templateObject3$Q, _templateObject4$G, _templateObject5$y;
11840
+ var _templateObject$1k, _templateObject2$10, _templateObject3$Q, _templateObject4$G, _templateObject5$z;
11816
11841
  var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
11817
11842
  var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n\n @media print {\n visibility: hidden;\n }\n"])));
11818
11843
  var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
@@ -11823,7 +11848,7 @@ var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$G || (_templat
11823
11848
  var isVisible = _ref2.isVisible;
11824
11849
  return isVisible ? 'visible' : 'hidden';
11825
11850
  });
11826
- var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
11851
+ var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
11827
11852
 
11828
11853
  var keyDown = function keyDown(e, toggleFunction) {
11829
11854
  if (e.key === 'Enter' || e.key === 'Space') {
@@ -11904,7 +11929,7 @@ var ReadMore = function ReadMore(_ref) {
11904
11929
  }, isFullTextOpen ? "" + hideText : "" + showMoreText))));
11905
11930
  };
11906
11931
 
11907
- var _templateObject$1l, _templateObject2$11, _templateObject3$R, _templateObject4$H, _templateObject5$z;
11932
+ var _templateObject$1l, _templateObject2$11, _templateObject3$R, _templateObject4$H, _templateObject5$A;
11908
11933
  var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
11909
11934
  var MenuList = /*#__PURE__*/styled.ul(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n }\n"])), Colors.LightGrey);
11910
11935
  var MobileButton = /*#__PURE__*/styled.button(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n"])), Colors.Black, Colors.White, Colors.DarkGrey);
@@ -11912,7 +11937,7 @@ var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$H || (_templateObject4$H
11912
11937
  var isActive = _ref.isActive;
11913
11938
  return isActive ? "var(--base-color-" + Colors.MidGrey + ")" : 'none';
11914
11939
  }, Colors.MidGrey);
11915
- var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
11940
+ var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
11916
11941
  var isOpen = _ref2.isOpen;
11917
11942
  return isOpen ? 'block' : 'none';
11918
11943
  }, Colors.White, Colors.DarkGrey, MenuItem$1);
@@ -12068,7 +12093,7 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
12068
12093
  });
12069
12094
  };
12070
12095
 
12071
- var _templateObject$1m, _templateObject2$12, _templateObject3$S, _templateObject4$I, _templateObject5$A, _templateObject6$r;
12096
+ var _templateObject$1m, _templateObject2$12, _templateObject3$S, _templateObject4$I, _templateObject5$B, _templateObject6$s;
12072
12097
  var Container$5 = /*#__PURE__*/styled.div(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
12073
12098
  var Sections = /*#__PURE__*/styled.div(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
12074
12099
  var Section = /*#__PURE__*/styled.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
@@ -12076,11 +12101,11 @@ var Section = /*#__PURE__*/styled.div(_templateObject3$S || (_templateObject3$S
12076
12101
  return "var(--base-color-" + color + ")";
12077
12102
  });
12078
12103
  var BottomLine = /*#__PURE__*/styled.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
12079
- var Text = /*#__PURE__*/styled.div(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
12104
+ var Text = /*#__PURE__*/styled.div(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
12080
12105
  var color = _ref2.color;
12081
12106
  return "var(--base-color-" + color + ")";
12082
12107
  });
12083
- var LabelText = /*#__PURE__*/styled.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
12108
+ var LabelText = /*#__PURE__*/styled.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
12084
12109
  var color = _ref3.color;
12085
12110
  return "var(--base-color-" + color + ")";
12086
12111
  });
@@ -12162,18 +12187,18 @@ var PasswordStrength = function PasswordStrength(_ref) {
12162
12187
  }, strengthLabel))));
12163
12188
  };
12164
12189
 
12165
- var _templateObject$1n, _templateObject2$13, _templateObject3$T, _templateObject4$J, _templateObject5$B, _templateObject6$s, _templateObject7$m, _templateObject8$g;
12190
+ var _templateObject$1n, _templateObject2$13, _templateObject3$T, _templateObject4$J, _templateObject5$C, _templateObject6$t, _templateObject7$n, _templateObject8$g;
12166
12191
  var TableContainer = /*#__PURE__*/styled.table(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
12167
12192
  var Container$6 = /*#__PURE__*/styled.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
12168
- var Wrapper$9 = /*#__PURE__*/styled.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
12193
+ var Wrapper$8 = /*#__PURE__*/styled.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
12169
12194
  var TableHeader = /*#__PURE__*/styled.th(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n text-transform: capitalize;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n white-space: nowrap;\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n @media ", " {\n &:last-child {\n white-space: nowrap;\n }\n }\n\n @media ", " {\n min-width: 150px;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
12170
12195
  return "calc(100% / " + (props.columns - 1) + ")";
12171
12196
  }, devices.tablet, devices.mobile);
12172
- var TableCell = /*#__PURE__*/styled.td(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n vertical-align: middle;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n min-width: 150px;\n }\n"])), function (props) {
12197
+ var TableCell = /*#__PURE__*/styled.td(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n vertical-align: middle;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n min-width: 150px;\n }\n"])), function (props) {
12173
12198
  return "calc(100% / " + (props.columns - 1) + ")";
12174
12199
  }, devices.mobile);
12175
- var PaginationWrapper = /*#__PURE__*/styled(Pagination)(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 40px;\n padding-bottom: 80px;\n\n @media ", " {\n padding-top: 24px;\n padding-bottom: 60px;\n }\n"])), devices.mobile);
12176
- var ScrollButtons = /*#__PURE__*/styled.div(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 60px 0 24px 0;\n\n div:hover {\n background-color: var(--color-base-light-grey);\n }\n\n > div > div {\n background-color: var(--color-base-light-grey);\n }\n\n svg path {\n fill: var(--color-base-black) !important;\n }\n"])));
12200
+ var PaginationWrapper = /*#__PURE__*/styled(Pagination)(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 40px;\n padding-bottom: 80px;\n\n @media ", " {\n padding-top: 24px;\n padding-bottom: 60px;\n }\n"])), devices.mobile);
12201
+ var ScrollButtons = /*#__PURE__*/styled.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 60px 0 24px 0;\n\n div:hover {\n background-color: var(--color-base-light-grey);\n }\n\n > div > div {\n background-color: var(--color-base-light-grey);\n }\n\n svg path {\n fill: var(--color-base-black) !important;\n }\n"])));
12177
12202
  var AriaDescription$2 = /*#__PURE__*/styled.span(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
12178
12203
 
12179
12204
  /* eslint-disable react/no-danger */
@@ -12347,7 +12372,7 @@ var Table = function Table(_ref) {
12347
12372
  } else {
12348
12373
  visibleRows = totalRows;
12349
12374
  }
12350
- return /*#__PURE__*/React__default.createElement(Wrapper$9, {
12375
+ return /*#__PURE__*/React__default.createElement(Wrapper$8, {
12351
12376
  className: className
12352
12377
  }, showScrollButtons && (/*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
12353
12378
  onClickPrev: handlePrev,
@@ -12377,8 +12402,8 @@ var Table = function Table(_ref) {
12377
12402
  }))));
12378
12403
  };
12379
12404
 
12380
- var _templateObject$1o, _templateObject2$14, _templateObject3$U, _templateObject4$K, _templateObject5$C, _templateObject6$t, _templateObject7$n, _templateObject8$h, _templateObject9$b, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
12381
- var Wrapper$a = /*#__PURE__*/styled('div')(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
12405
+ var _templateObject$1o, _templateObject2$14, _templateObject3$U, _templateObject4$K, _templateObject5$D, _templateObject6$u, _templateObject7$o, _templateObject8$h, _templateObject9$b, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
12406
+ var Wrapper$9 = /*#__PURE__*/styled('div')(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
12382
12407
  var theme = _ref.theme;
12383
12408
  return "var(--color-" + theme + ")";
12384
12409
  }, function (_ref2) {
@@ -12388,9 +12413,9 @@ var Wrapper$a = /*#__PURE__*/styled('div')(_templateObject$1o || (_templateObjec
12388
12413
  var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
12389
12414
  var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n position: relative;\n top: -25px;\n left: -20px;\n height: 52px;\n background: var(--color-base-white);\n display: inline-block;\n padding: 0 20px;\n\n @media ", " {\n top: -18px;\n height: 37px;\n padding: 0 13px;\n left: -13px;\n }\n"])), devices.mobile);
12390
12415
  var Error = /*#__PURE__*/styled.div(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
12391
- var Form = /*#__PURE__*/styled.form(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error);
12392
- var FormFooterWrapper = /*#__PURE__*/styled.div(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
12393
- var ServerError = /*#__PURE__*/styled.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
12416
+ var Form = /*#__PURE__*/styled.form(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error);
12417
+ var FormFooterWrapper = /*#__PURE__*/styled.div(_templateObject6$u || (_templateObject6$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
12418
+ var ServerError = /*#__PURE__*/styled.div(_templateObject7$o || (_templateObject7$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
12394
12419
  var CTALinkWrapper = /*#__PURE__*/styled.a(_templateObject8$h || (_templateObject8$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
12395
12420
  var ButtonWrapper$3 = /*#__PURE__*/styled.div(_templateObject9$b || (_templateObject9$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n all: unset;\n width: fit-content;\n color: var(--base-color-white);\n text-decoration: none;\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
12396
12421
  var FieldsWrapper = /*#__PURE__*/styled.div(_templateObject0$a || (_templateObject0$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 36px;\n\n @media ", " {\n grid-template-columns: 1fr;\n gap: 20px;\n }\n"])), devices.mobile);
@@ -12737,7 +12762,7 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
12737
12762
  useEffect(function () {
12738
12763
  setDropdownOpen(isOpened);
12739
12764
  }, [isOpened]);
12740
- return /*#__PURE__*/React__default.createElement(Wrapper$a, {
12765
+ return /*#__PURE__*/React__default.createElement(Wrapper$9, {
12741
12766
  theme: themeToColor(theme),
12742
12767
  className: className
12743
12768
  }, /*#__PURE__*/React__default.createElement(SignUpFormWrapper, null, isMobile && !isLoggedIn && !isSuccess ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(HiddenInstructions, {
@@ -12802,13 +12827,13 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
12802
12827
  }))))));
12803
12828
  };
12804
12829
 
12805
- var _templateObject$1p, _templateObject2$15, _templateObject4$L, _templateObject5$D;
12830
+ var _templateObject$1p, _templateObject2$15, _templateObject4$L, _templateObject5$E;
12806
12831
  var AnchorBarContainer = /*#__PURE__*/styled(Grid)(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n min-height: 70px;\n background: var(--color-base-white);\n z-index: ", ";\n align-content: center;\n border-bottom: 1px solid var(--color-base-light-grey);\n\n ", "\n\n @media ", " {\n min-height: 60px;\n }\n"])), zIndexes.anchor, function (_ref) {
12807
12832
  var withShadow = _ref.withShadow;
12808
12833
  return withShadow && css(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
12809
12834
  }, devices.mobile);
12810
12835
  var CloseButtonWrapper = /*#__PURE__*/styled.a(_templateObject4$L || (_templateObject4$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 24px;\n min-width: 24px;\n max-height: 24px;\n max-width: 24px;\n border: none;\n padding: 0;\n background: none;\n\n :hover {\n cursor: pointer;\n }\n\n @media ", " {\n min-height: 12px;\n min-width: 12px;\n max-height: 12px;\n max-width: 12px;\n }\n"])), devices.mobile);
12811
- var ContentWrapper$3 = /*#__PURE__*/styled.a(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
12836
+ var ContentWrapper$3 = /*#__PURE__*/styled.a(_templateObject5$E || (_templateObject5$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
12812
12837
 
12813
12838
  var AnchorBar = function AnchorBar(_ref) {
12814
12839
  var cta = _ref.cta,
@@ -13844,5 +13869,5 @@ var Quote = function Quote(_ref) {
13844
13869
  }, /*#__PURE__*/React__default.createElement("cite", null, attribution))))));
13845
13870
  };
13846
13871
 
13847
- export { Accordion, Accordions, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, MiniCard, MinimalCarousel, ModalWindow, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlight, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
13872
+ export { Accordion, Accordions, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, MiniCard, MinimalCarousel, ModalWindow, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlightCarousel, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
13848
13873
  //# sourceMappingURL=harmonic.esm.js.map