@royaloperahouse/chord 2.4.2 → 2.4.3-b-chord-development

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.
@@ -1549,13 +1549,15 @@ var Tickets = (function (_ref) {
1549
1549
 
1550
1550
  var Wheelchair = (function (_ref) {
1551
1551
  var _ref$color = _ref.color,
1552
- color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
1552
+ color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
1553
+ ariaLabel = _ref.ariaLabel;
1553
1554
  return /*#__PURE__*/React.createElement("svg", {
1554
1555
  width: "100%",
1555
1556
  height: "100%",
1556
1557
  viewBox: "0 0 24 24",
1557
1558
  fill: "none",
1558
- xmlns: "http://www.w3.org/2000/svg"
1559
+ xmlns: "http://www.w3.org/2000/svg",
1560
+ "aria-label": ariaLabel
1559
1561
  }, /*#__PURE__*/React.createElement("path", {
1560
1562
  d: "M8.4 18.8c-1.1 0-2.2-.4-3-1.1-.8-.8-1.3-1.8-1.3-2.9-.1-1.6.9-3.2 2.3-3.9l-.4-1c-1.9.9-3 2.8-3 4.9.1 2.8 2.4 5.1 5.3 5.1h.2c2.6-.1 4.7-2.1 5.1-4.6l-1.1-.1c-.3 2-2 3.6-4.1 3.6ZM9.8 4.5c1.2 0 2.2-1 2.2-2.2C12 1.1 11 .1 9.8.1c-1.2 0-2.2 1-2.2 2.2 0 1.2.9 2.2 2.2 2.2Zm0-3.3c.6 0 1.1.5 1.1 1.1 0 .6-.5 1.1-1.1 1.1-.6 0-1.1-.5-1.1-1.1 0-.6.5-1.1 1.1-1.1Zm4.9 12c-.3-.5-.9-.8-1.6-.8h-2.6V6.3c0-.6-.5-1.2-1.1-1.2H6.2c-.5.1-.9.5-.9 1v3.2h1.1V6.2l2.9.1v7.2h3.8c.3 0 .5.1.6.3l3.4 5.4.9-.6-3.3-5.4Z",
1561
1563
  fill: color
@@ -2436,7 +2438,8 @@ var Icon = /*#__PURE__*/React.memo(function (_ref) {
2436
2438
  color = _ref.color,
2437
2439
  iconName = _ref.iconName,
2438
2440
  title = _ref.title,
2439
- direction = _ref.direction;
2441
+ direction = _ref.direction,
2442
+ ariaLabel = _ref.ariaLabel;
2440
2443
  var IconComponent = IconLibrary[iconName];
2441
2444
  return /*#__PURE__*/React.createElement(Wrapper, {
2442
2445
  className: className,
@@ -2444,7 +2447,8 @@ var Icon = /*#__PURE__*/React.memo(function (_ref) {
2444
2447
  title: title,
2445
2448
  direction: direction
2446
2449
  }, /*#__PURE__*/React.createElement(IconComponent, {
2447
- color: color
2450
+ color: color,
2451
+ ariaLabel: ariaLabel
2448
2452
  }));
2449
2453
  });
2450
2454
  Icon.displayName = 'Icon';
@@ -2472,14 +2476,21 @@ var Button = function Button(_ref) {
2472
2476
  };
2473
2477
 
2474
2478
  var _templateObject$4;
2475
- var PrimaryButtonWrapper = /*#__PURE__*/styled__default(Button)(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n border-color: ", ";\n"])), function (_ref) {
2479
+ var PrimaryButtonWrapper = /*#__PURE__*/styled__default(Button)(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n border-color: ", ";\n pointer-events: ", ";\n"])), function (_ref) {
2480
+ var _theme$colors;
2481
+
2476
2482
  var bgColor = _ref.bgColor,
2477
2483
  theme = _ref.theme;
2478
- return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.primary;
2484
+ return bgColor ? "var(--base-color-" + bgColor + ")" : theme == null ? void 0 : (_theme$colors = theme.colors) == null ? void 0 : _theme$colors.primary;
2479
2485
  }, function (_ref2) {
2486
+ var _theme$colors2;
2487
+
2480
2488
  var bgColor = _ref2.bgColor,
2481
2489
  theme = _ref2.theme;
2482
- return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.primary;
2490
+ return bgColor ? "var(--base-color-" + bgColor + ")" : theme == null ? void 0 : (_theme$colors2 = theme.colors) == null ? void 0 : _theme$colors2.primary;
2491
+ }, function (_ref3) {
2492
+ var disabled = _ref3.disabled;
2493
+ return disabled ? 'none' : 'auto';
2483
2494
  });
2484
2495
 
2485
2496
  (function (CarouselType) {
@@ -2529,9 +2540,16 @@ var AspectRatioWidth;
2529
2540
 
2530
2541
  var PrimaryButton = function PrimaryButton(_ref) {
2531
2542
  var children = _ref.children,
2532
- props = _objectWithoutPropertiesLoose(_ref, ["children"]);
2543
+ disabled = _ref.disabled,
2544
+ props = _objectWithoutPropertiesLoose(_ref, ["children", "disabled", "color", "bgColor"]);
2533
2545
 
2534
- return /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
2546
+ return disabled ? /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
2547
+ color: exports.Colors.Black,
2548
+ bgColor: exports.Colors.MidGrey,
2549
+ disabled: true,
2550
+ "aria-disabled": "true",
2551
+ role: "button"
2552
+ }, props), children) : /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
2535
2553
  color: exports.Colors.White
2536
2554
  }, props), children);
2537
2555
  };
@@ -2773,7 +2791,39 @@ var GridItem = /*#__PURE__*/styled__default.div(_templateObject$a || (_templateO
2773
2791
  });
2774
2792
 
2775
2793
  var _templateObject$b;
2776
- var ImageAspectRatioWrapper = /*#__PURE__*/styled__default.div(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
2794
+ /**
2795
+ * # IMPORTANT
2796
+ * Please use the `<GridItem />` component instead of this component if possible.
2797
+ * This component was introduced due to incompatibilities between versions of the Chord library.
2798
+ */
2799
+
2800
+ var GridItemLegacy = /*#__PURE__*/styled__default.div(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", " / span\n ", ";\n\n @media ", " {\n & {\n grid-column: ", " /\n span ", ";\n }\n }\n\n @media ", " {\n & {\n grid-column: ", " / span\n ", ";\n }\n }\n"])), function (_ref) {
2801
+ var columnStartDesktop = _ref.columnStartDesktop;
2802
+ return columnStartDesktop;
2803
+ }, function (_ref2) {
2804
+ var _ref2$columnSpanDeskt = _ref2.columnSpanDesktop,
2805
+ columnSpanDesktop = _ref2$columnSpanDeskt === void 0 ? 1 : _ref2$columnSpanDeskt;
2806
+ return columnSpanDesktop;
2807
+ }, devices.mobile, function (_ref3) {
2808
+ var columnStartDevice = _ref3.columnStartDevice,
2809
+ columnStartSmallDevice = _ref3.columnStartSmallDevice;
2810
+ return columnStartSmallDevice != null ? columnStartSmallDevice : columnStartDevice;
2811
+ }, function (_ref4) {
2812
+ var _ref4$columnSpanDevic = _ref4.columnSpanDevice,
2813
+ columnSpanDevice = _ref4$columnSpanDevic === void 0 ? 1 : _ref4$columnSpanDevic,
2814
+ columnSpanSmallDevice = _ref4.columnSpanSmallDevice;
2815
+ return columnSpanSmallDevice != null ? columnSpanSmallDevice : columnSpanDevice;
2816
+ }, devices.tablet, function (_ref5) {
2817
+ var columnStartDevice = _ref5.columnStartDevice;
2818
+ return columnStartDevice;
2819
+ }, function (_ref6) {
2820
+ var _ref6$columnSpanDevic = _ref6.columnSpanDevice,
2821
+ columnSpanDevice = _ref6$columnSpanDevic === void 0 ? 1 : _ref6$columnSpanDevic;
2822
+ return columnSpanDevice;
2823
+ });
2824
+
2825
+ var _templateObject$c;
2826
+ var ImageAspectRatioWrapper = /*#__PURE__*/styled__default.div(_templateObject$c || (_templateObject$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
2777
2827
  var _ref$aspectRatio = _ref.aspectRatio,
2778
2828
  aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
2779
2829
  return aspectRatio;
@@ -2791,8 +2841,8 @@ var ImageAspectRatioWrapper = /*#__PURE__*/styled__default.div(_templateObject$b
2791
2841
  return aspectRatio;
2792
2842
  });
2793
2843
 
2794
- var _templateObject$c, _templateObject2$3, _templateObject3$2, _templateObject4$1, _templateObject5;
2795
- var ProgressView = /*#__PURE__*/styled__default.div(_templateObject$c || (_templateObject$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: ", ";\n width: 100%;\n display: flex;\n flex-direction: row;\n"])), function (_ref) {
2844
+ var _templateObject$d, _templateObject2$3, _templateObject3$2, _templateObject4$1, _templateObject5;
2845
+ var ProgressView = /*#__PURE__*/styled__default.div(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: ", ";\n width: 100%;\n display: flex;\n flex-direction: row;\n"])), function (_ref) {
2796
2846
  var height = _ref.height;
2797
2847
  return height ? height + "px" : '6px';
2798
2848
  });
@@ -2875,13 +2925,13 @@ var Progress = function Progress(_ref) {
2875
2925
  }, renderSteps()));
2876
2926
  };
2877
2927
 
2878
- var _templateObject$d, _templateObject2$4, _templateObject3$3;
2879
- var RadioContainer = /*#__PURE__*/styled__default.div(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"])));
2928
+ var _templateObject$e, _templateObject2$4, _templateObject3$3;
2929
+ var RadioContainer = /*#__PURE__*/styled__default.div(_templateObject$e || (_templateObject$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"])));
2880
2930
  var RadioLine = /*#__PURE__*/styled__default.div(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 20px;\n grid-template-columns: 1.15em 1fr;\n user-select: none;\n cursor: pointer;\n color: black;\n\n &:focus {\n outline: none;\n }\n\n input[type='radio'] {\n cursor: pointer;\n appearance: none;\n background-color: #ffffff00;\n margin: 0;\n color: black;\n width: 20px;\n height: 20px;\n border: 1px solid black;\n border-radius: 50%;\n position: relative;\n place-content: center;\n display: block;\n }\n\n input[type='radio']::before {\n content: '';\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background-color: #ffffff00;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n input[type='radio']:checked::before {\n background-color: black;\n }\n"])));
2881
2931
  var RadioError = /*#__PURE__*/styled__default.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-errorstate);\n"])));
2882
2932
 
2883
- var _templateObject$e;
2884
- var Wrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$e || (_templateObject$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-", ");\n font-feature-settings: var(--font-feature-settings-", ");\n font-size: var(--font-size-", "-", ");\n font-weight: var(--font-weight-", "-", ");\n letter-spacing: var(--letter-spacing-", "-", ");\n line-height: var(--line-height-", "-", ");\n text-transform: var(--text-transform-", ");\n word-break: var(--word-break-", ");\n margin: var(--margin-", "-", ");\n"])), function (_ref) {
2933
+ var _templateObject$f;
2934
+ var Wrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-", ");\n font-feature-settings: var(--font-feature-settings-", ");\n font-size: var(--font-size-", "-", ");\n font-weight: var(--font-weight-", "-", ");\n letter-spacing: var(--letter-spacing-", "-", ");\n line-height: var(--line-height-", "-", ");\n text-transform: var(--text-transform-", ");\n word-break: var(--word-break-", ");\n margin: var(--margin-", "-", ");\n"])), function (_ref) {
2885
2935
  var typography = _ref.typography;
2886
2936
  return typography;
2887
2937
  }, function (_ref2) {
@@ -3038,8 +3088,8 @@ var Radio = function Radio(_ref) {
3038
3088
  }, error)));
3039
3089
  };
3040
3090
 
3041
- var _templateObject$f, _templateObject2$5, _templateObject3$4, _templateObject4$2, _templateObject5$1, _templateObject6;
3042
- var Container = /*#__PURE__*/styled__default.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
3091
+ var _templateObject$g, _templateObject2$5, _templateObject3$4, _templateObject4$2, _templateObject5$1, _templateObject6;
3092
+ var Container = /*#__PURE__*/styled__default.div(_templateObject$g || (_templateObject$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
3043
3093
  var Radio$1 = /*#__PURE__*/styled__default.div(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
3044
3094
  var error = _ref.error,
3045
3095
  darkMode = _ref.darkMode,
@@ -3147,8 +3197,8 @@ var Radio2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
3147
3197
  }, error)));
3148
3198
  });
3149
3199
 
3150
- var _templateObject$g, _templateObject2$6, _templateObject3$5;
3151
- var ButtonsContainer = /*#__PURE__*/styled__default.div(_templateObject$g || (_templateObject$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n"])));
3200
+ var _templateObject$h, _templateObject2$6, _templateObject3$5;
3201
+ var ButtonsContainer = /*#__PURE__*/styled__default.div(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n"])));
3152
3202
  var IconWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$6 || (_templateObject2$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n display: flex;\n align-items: center;\n width: var(--rotator-button-width);\n height: var(--rotator-button-width);\n background-color: var(--base-color-lightgrey);\n color: var(--base-color-black);\n\n svg {\n width: var(--rotator-button-icon-width);\n height: var(--rotator-button-icon-width);\n }\n\n svg path {\n fill: var(--base-color-black);\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n\n @media ", " {\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n\n :hover {\n cursor: default;\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n }\n"])), function (_ref) {
3153
3203
  var theme = _ref.theme;
3154
3204
  return theme.colors.primary;
@@ -3219,8 +3269,8 @@ var RotatorButtons = function RotatorButtons(_ref) {
3219
3269
  }, renderNextIcon()));
3220
3270
  };
3221
3271
 
3222
- var _templateObject$h;
3223
- var SecondaryLogoWrapper = /*#__PURE__*/styled__default.svg(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n path {\n fill: var(--base-color-", ");\n }\n"])), function (_ref) {
3272
+ var _templateObject$i;
3273
+ var SecondaryLogoWrapper = /*#__PURE__*/styled__default.svg(_templateObject$i || (_templateObject$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n path {\n fill: var(--base-color-", ");\n }\n"])), function (_ref) {
3224
3274
  var fillColor = _ref.fillColor;
3225
3275
  return fillColor;
3226
3276
  });
@@ -3244,8 +3294,8 @@ var SecondaryLogo = function SecondaryLogo(_ref) {
3244
3294
  })));
3245
3295
  };
3246
3296
 
3247
- var _templateObject$i, _templateObject2$7;
3248
- var SectionSplitterContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$i || (_templateObject$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 4px;\n"])));
3297
+ var _templateObject$j, _templateObject2$7;
3298
+ var SectionSplitterContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 4px;\n"])));
3249
3299
  var Splitter = /*#__PURE__*/styled__default.div(_templateObject2$7 || (_templateObject2$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n height: 4px;\n background: var(--base-color-lightgrey);\n"])));
3250
3300
 
3251
3301
  var SectionSplitter = function SectionSplitter(_ref) {
@@ -3264,8 +3314,8 @@ var SectionSplitter = function SectionSplitter(_ref) {
3264
3314
  }, /*#__PURE__*/React__default.createElement(Splitter, null)));
3265
3315
  };
3266
3316
 
3267
- var _templateObject$j;
3268
- var SponsorLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n width: 172px;\n"])));
3317
+ var _templateObject$k;
3318
+ var SponsorLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n width: 172px;\n"])));
3269
3319
 
3270
3320
  var SponsorLogo = function SponsorLogo(_ref) {
3271
3321
  var _ref$colorLogo = _ref.colorLogo,
@@ -3475,8 +3525,8 @@ var SponsorLogo = function SponsorLogo(_ref) {
3475
3525
  })))));
3476
3526
  };
3477
3527
 
3478
- var _templateObject$k, _templateObject2$8;
3479
- var CustomImage = /*#__PURE__*/styled__default.img(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: 100px;\n max-width: auto;\n\n @media ", " {\n max-height: 55px;\n }\n\n @media ", " {\n max-height: 45px;\n }\n"])), devices.tablet, devices.mobile);
3528
+ var _templateObject$l, _templateObject2$8;
3529
+ var CustomImage = /*#__PURE__*/styled__default.img(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: 100px;\n max-width: auto;\n\n @media ", " {\n max-height: 55px;\n }\n\n @media ", " {\n max-height: 45px;\n }\n"])), devices.tablet, devices.mobile);
3480
3530
  var SponsorshipStyledIframe = /*#__PURE__*/styled__default.div(_templateObject2$8 || (_templateObject2$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: transparent;\n height: 80px;\n margin: 0px;\n overflow: hidden;\n padding: 0;\n width: 80px;\n\n & > iframe {\n border: 0;\n display: block;\n margin: 0px;\n padding: 0px;\n overflow: hidden;\n width: 100%;\n height: 100%;\n }\n\n @media ", " {\n & {\n height: 40px;\n width: 40px;\n }\n & iframe {\n height: 80px;\n transform: scale(0.5) translate(-40px, -40px);\n width: 80px;\n }\n }\n"])), devices.mobile);
3481
3531
 
3482
3532
  var DEFAULT_SPONSORSHIP_IFRAME = 'https://static.roh.org.uk/rolex/v4/rolex.html?size=80';
@@ -3509,8 +3559,8 @@ var Sponsorship = function Sponsorship(_ref) {
3509
3559
  }));
3510
3560
  };
3511
3561
 
3512
- var _templateObject$l, _templateObject2$9;
3513
- var TabText = /*#__PURE__*/styled__default.a(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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-black);\n margin-right: 0px;\n margin-top: 5px;\n text-decoration: none;\n text-transform: uppercase;\n\n ", "\n\n @media ", " {\n ", "\n }\n"])), function (props) {
3562
+ var _templateObject$m, _templateObject2$9;
3563
+ var TabText = /*#__PURE__*/styled__default.a(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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-black);\n margin-right: 0px;\n margin-top: 5px;\n text-decoration: none;\n text-transform: uppercase;\n\n ", "\n\n @media ", " {\n ", "\n }\n"])), function (props) {
3514
3564
  if (props.withIcon === 'left') {
3515
3565
  return "margin-left: 5px;";
3516
3566
  }
@@ -3609,8 +3659,8 @@ var Tab = function Tab(_ref) {
3609
3659
  }));
3610
3660
  };
3611
3661
 
3612
- var _templateObject$m, _templateObject2$a;
3613
- var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: ", ";\n font-family: var(--font-family-navigation);\n font-size: var(--font-size-navigation);\n font-weight: var(--font-weight-navigation);\n line-height: var(--line-height-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n text-transform: var(--text-transform-navigation);\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n border-bottom: ", ";\n ", "\n\n @media ", ", ", " {\n &:hover {\n color: var(--base-color-", ");\n border-bottom: 1px solid var(--base-color-", ");\n\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n }\n"])), function (_ref) {
3662
+ var _templateObject$n, _templateObject2$a;
3663
+ var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: ", ";\n font-family: var(--font-family-navigation);\n font-size: var(--font-size-navigation);\n font-weight: var(--font-weight-navigation);\n line-height: var(--line-height-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n text-transform: var(--text-transform-navigation);\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n border-bottom: ", ";\n ", "\n\n @media ", ", ", " {\n &:hover {\n color: var(--base-color-", ");\n border-bottom: 1px solid var(--base-color-", ");\n\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n }\n"])), function (_ref) {
3614
3664
  var iconName = _ref.iconName;
3615
3665
  return iconName ? 'calc(var(--text-link-underline-offset) - 4px) 0' : 'var(--text-link-underline-offset) 0';
3616
3666
  }, function (_ref2) {
@@ -3661,8 +3711,8 @@ var TabLink = function TabLink(_ref) {
3661
3711
  })) : null, children);
3662
3712
  };
3663
3713
 
3664
- var _templateObject$n, _templateObject2$b, _templateObject3$6, _templateObject4$3;
3665
- var TextAreaWrapper = /*#__PURE__*/styled__default.div(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n"])), function (_ref) {
3714
+ var _templateObject$o, _templateObject2$b, _templateObject3$6, _templateObject4$3;
3715
+ var TextAreaWrapper = /*#__PURE__*/styled__default.div(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n"])), function (_ref) {
3666
3716
  var width = _ref.width;
3667
3717
  return width ? width + "px;" : '100%;';
3668
3718
  }, function (_ref2) {
@@ -3785,8 +3835,8 @@ var TextArea = function TextArea(_ref) {
3785
3835
  }, error))));
3786
3836
  };
3787
3837
 
3788
- var _templateObject$o, _templateObject2$c, _templateObject3$7, _templateObject4$4, _templateObject5$2, _templateObject6$1;
3789
- var Container$1 = /*#__PURE__*/styled__default.div(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
3838
+ var _templateObject$p, _templateObject2$c, _templateObject3$7, _templateObject4$4, _templateObject5$2, _templateObject6$1;
3839
+ var Container$1 = /*#__PURE__*/styled__default.div(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
3790
3840
  var InputWrapper = /*#__PURE__*/styled__default.div(_templateObject2$c || (_templateObject2$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n"])), function (_ref) {
3791
3841
  var width = _ref.width;
3792
3842
  if (!width) return 'none';
@@ -3912,8 +3962,8 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
3912
3962
  }, error)));
3913
3963
  });
3914
3964
 
3915
- var _templateObject$p, _templateObject2$d, _templateObject3$8, _templateObject4$5, _templateObject5$3;
3916
- var TextFieldContainer = /*#__PURE__*/styled__default.div(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
3965
+ var _templateObject$q, _templateObject2$d, _templateObject3$8, _templateObject4$5, _templateObject5$3;
3966
+ var TextFieldContainer = /*#__PURE__*/styled__default.div(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
3917
3967
  var textStyles = /*#__PURE__*/styled.css(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n"])), function (_ref) {
3918
3968
  var theme = _ref.theme;
3919
3969
  return theme.fonts.desktop.weights.body[1];
@@ -3986,8 +4036,8 @@ var TextFieldLegacy = function TextFieldLegacy(_ref) {
3986
4036
  }, error) : null);
3987
4037
  };
3988
4038
 
3989
- var _templateObject$q, _templateObject2$e;
3990
- var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n padding-bottom: ", ";\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n"])), function (_ref) {
4039
+ var _templateObject$r, _templateObject2$e;
4040
+ var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n padding-bottom: ", ";\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n"])), function (_ref) {
3991
4041
  var iconName = _ref.iconName;
3992
4042
  return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--text-link-underline-offset)';
3993
4043
  }, function (_ref2) {
@@ -4023,8 +4073,8 @@ var TextLogoProduct;
4023
4073
  TextLogoProduct["Cinema"] = "CINEMA";
4024
4074
  })(TextLogoProduct || (TextLogoProduct = {}));
4025
4075
 
4026
- var _templateObject$r, _templateObject2$f, _templateObject3$9, _templateObject4$6;
4027
- var TickboxError = /*#__PURE__*/styled__default.div(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-block: 20px;\n color: var(--base-color-", ");\n"])), function (_ref) {
4076
+ var _templateObject$s, _templateObject2$f, _templateObject3$9, _templateObject4$6;
4077
+ var TickboxError = /*#__PURE__*/styled__default.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-block: 20px;\n color: var(--base-color-", ");\n"])), function (_ref) {
4028
4078
  var dark = _ref.dark;
4029
4079
  return dark ? 'white' : 'errorstate';
4030
4080
  });
@@ -4145,8 +4195,8 @@ var Tickbox = function Tickbox(_ref) {
4145
4195
  }, error)));
4146
4196
  };
4147
4197
 
4148
- var _templateObject$s, _templateObject2$g, _templateObject3$a, _templateObject4$7, _templateObject5$4, _templateObject6$2;
4149
- var Container$2 = /*#__PURE__*/styled__default.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
4198
+ var _templateObject$t, _templateObject2$g, _templateObject3$a, _templateObject4$7, _templateObject5$4, _templateObject6$2;
4199
+ var Container$2 = /*#__PURE__*/styled__default.div(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
4150
4200
  var Tickbox$1 = /*#__PURE__*/styled__default.div(_templateObject2$g || (_templateObject2$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
4151
4201
  var error = _ref.error,
4152
4202
  darkMode = _ref.darkMode,
@@ -4256,8 +4306,8 @@ var Tickbox2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
4256
4306
  }, error)));
4257
4307
  });
4258
4308
 
4259
- var _templateObject$t, _templateObject2$h, _templateObject3$b, _templateObject4$8, _templateObject5$5, _templateObject6$3, _templateObject7, _templateObject8;
4260
- var TimerWrapper = /*#__PURE__*/styled__default.div(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n"])), function (_ref) {
4309
+ var _templateObject$u, _templateObject2$h, _templateObject3$b, _templateObject4$8, _templateObject5$5, _templateObject6$3, _templateObject7, _templateObject8;
4310
+ var TimerWrapper = /*#__PURE__*/styled__default.div(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n"])), function (_ref) {
4261
4311
  var color = _ref.color;
4262
4312
  return color;
4263
4313
  });
@@ -4365,8 +4415,8 @@ var Timer = function Timer(_ref) {
4365
4415
  }));
4366
4416
  };
4367
4417
 
4368
- var _templateObject$u;
4369
- var TypeTagsContainer = /*#__PURE__*/styled__default.ul(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\n & li {\n display: inline-block;\n margin: 0;\n }\n\n & li:before {\n content: '\u2014';\n margin: 0 0.5em;\n }\n\n & li:first-child:before {\n display: none;\n }\n"])));
4418
+ var _templateObject$v;
4419
+ var TypeTagsContainer = /*#__PURE__*/styled__default.ul(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\n & li {\n display: inline-block;\n margin: 0;\n }\n\n & li:before {\n content: '\u2014';\n margin: 0 0.5em;\n }\n\n & li:first-child:before {\n display: none;\n }\n"])));
4370
4420
 
4371
4421
  var TypeTags = function TypeTags(_ref) {
4372
4422
  var list = _ref.list;
@@ -5108,8 +5158,8 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
5108
5158
  }
5109
5159
  });
5110
5160
 
5111
- var _templateObject$v, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$6, _templateObject6$4, _templateObject7$1, _templateObject8$1, _templateObject9, _templateObject10;
5112
- var VideoPlayButton = /*#__PURE__*/styled__default.button(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background-color: #fff;\n border: none;\n padding: 12px;\n cursor: pointer;\n"])));
5161
+ var _templateObject$w, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$6, _templateObject6$4, _templateObject7$1, _templateObject8$1, _templateObject9, _templateObject10;
5162
+ var VideoPlayButton = /*#__PURE__*/styled__default.button(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background-color: #fff;\n border: none;\n padding: 12px;\n cursor: pointer;\n"])));
5113
5163
  var VideoFullscreenButton = /*#__PURE__*/styled__default.button(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 56px;\n height: 36px;\n background-color: rgb(26, 26, 26, 0.6);\n border-radius: 5px;\n padding: 5px 14px;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n"])));
5114
5164
  var VideoControlsWrapper = /*#__PURE__*/styled__default.div(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 0;\n width: 100%;\n"])));
5115
5165
  var VideoControlsInnerWrapper = /*#__PURE__*/styled__default.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 40px 17px 30px;\n"])));
@@ -5328,8 +5378,8 @@ var VideoControls = function VideoControls(_ref2) {
5328
5378
  })));
5329
5379
  };
5330
5380
 
5331
- var _templateObject$w, _templateObject2$j, _templateObject3$d, _templateObject4$a, _templateObject5$7;
5332
- var StepperWrapper = /*#__PURE__*/styled__default.div(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: left;\n align-items: left;\n"])));
5381
+ var _templateObject$x, _templateObject2$j, _templateObject3$d, _templateObject4$a, _templateObject5$7;
5382
+ var StepperWrapper = /*#__PURE__*/styled__default.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: left;\n align-items: left;\n"])));
5333
5383
  var StepperError = /*#__PURE__*/styled__default.div(_templateObject2$j || (_templateObject2$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n margin-block: 15px 0;\n\n * {\n margin: 0;\n }\n"])), function (_ref) {
5334
5384
  var darkMode = _ref.darkMode;
5335
5385
  return darkMode ? 'white' : 'errorstate';
@@ -5556,8 +5606,8 @@ var Component = function Component(_ref) {
5556
5606
  }, error)));
5557
5607
  };
5558
5608
 
5559
- var _templateObject$x, _templateObject2$k, _templateObject3$e, _templateObject4$b, _templateObject5$8, _templateObject6$5, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11;
5560
- var NavigationWrapper = /*#__PURE__*/styled__default.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n ", "\n }\n"])), devices.mobileAndTablet, function (_ref) {
5609
+ var _templateObject$y, _templateObject2$k, _templateObject3$e, _templateObject4$b, _templateObject5$8, _templateObject6$5, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11;
5610
+ var NavigationWrapper = /*#__PURE__*/styled__default.div(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n ", "\n }\n"])), devices.mobileAndTablet, function (_ref) {
5561
5611
  var isMenuOpen = _ref.isMenuOpen;
5562
5612
  return isMenuOpen && "\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: " + zIndexes.overlay + ";\n background-color: var(--base-color-white);\n overflow-y: auto;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n ";
5563
5613
  });
@@ -5581,8 +5631,8 @@ var NavContainer = /*#__PURE__*/styled__default.div(_templateObject9$1 || (_temp
5581
5631
  var NavContainerGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 3 / span 14;\n }\n"])), devices.desktop);
5582
5632
  var NavTopContainer = /*#__PURE__*/styled__default.div(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 26px;\n right: 50px;\n top: 20px;\n position: absolute;\n\n @media ", " {\n margin-top: 1px;\n position: inherit;\n }\n"])), devices.mobileAndTablet);
5583
5633
 
5584
- var _templateObject$y;
5585
- var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 66px;\n height: auto;\n cursor: pointer;\n & img {\n width: auto;\n height: 100%;\n }\n"])));
5634
+ var _templateObject$z;
5635
+ var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 66px;\n height: auto;\n cursor: pointer;\n & img {\n width: auto;\n height: 100%;\n }\n"])));
5586
5636
 
5587
5637
  var Logo = function Logo(_ref) {
5588
5638
  var _ref$id = _ref.id,
@@ -5614,11 +5664,11 @@ var Logo = function Logo(_ref) {
5614
5664
  }))));
5615
5665
  };
5616
5666
 
5617
- var _templateObject$z;
5618
- var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 16px;\n justify-content: flex-end;\n height: 26px;\n\n @media ", " {\n column-gap: 8px;\n }\n"])), devices.mobile);
5667
+ var _templateObject$A;
5668
+ var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$A || (_templateObject$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 16px;\n justify-content: flex-end;\n height: 26px;\n\n @media ", " {\n column-gap: 8px;\n }\n"])), devices.mobile);
5619
5669
 
5620
- var _templateObject$A, _templateObject2$l, _templateObject3$f, _templateObject4$c;
5621
- var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$A || (_templateObject$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && a {\n color: var(--base-color-", ");\n }\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n\n ", "\n"])), function (_ref) {
5670
+ var _templateObject$B, _templateObject2$l, _templateObject3$f, _templateObject4$c;
5671
+ var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && a {\n color: var(--base-color-", ");\n }\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n\n ", "\n"])), function (_ref) {
5622
5672
  var selected = _ref.selected,
5623
5673
  colorPrimary = _ref.colorPrimary;
5624
5674
 
@@ -5806,8 +5856,8 @@ var Basket$1 = function Basket(_ref) {
5806
5856
  }, expiryTime ? basketText : text) : ''));
5807
5857
  };
5808
5858
 
5809
- var _templateObject$B, _templateObject2$m;
5810
- var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n"])), function (_ref) {
5859
+ var _templateObject$C, _templateObject2$m;
5860
+ var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n"])), function (_ref) {
5811
5861
  var selected = _ref.selected,
5812
5862
  colorPrimary = _ref.colorPrimary;
5813
5863
 
@@ -6099,8 +6149,8 @@ var NavTop = function NavTop(_ref) {
6099
6149
  }));
6100
6150
  };
6101
6151
 
6102
- var _templateObject$C, _templateObject2$n, _templateObject3$g, _templateObject4$d;
6103
- var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
6152
+ var _templateObject$D, _templateObject2$n, _templateObject3$g, _templateObject4$d;
6153
+ var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
6104
6154
  var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$n || (_templateObject2$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n\n @media ", " {\n column-gap: 15px;\n }\n\n @media ", ", ", " {\n div:last-child > div {\n right: 1px;\n }\n }\n\n @media ", " {\n ", "\n }\n"])), devices.desktop, devices.desktop, devices.largeDesktop, devices.mobileAndTablet, function (props) {
6105
6155
  if (props.showMenu) {
6106
6156
  return "\n display: flex;\n flex-direction: column;\n row-gap: 32px;\n ";
@@ -6242,8 +6292,8 @@ var Tabs = function Tabs(_ref) {
6242
6292
  }, "MENU"))));
6243
6293
  };
6244
6294
 
6245
- var _templateObject$D, _templateObject2$o, _templateObject3$h, _templateObject5$9, _templateObject6$6, _templateObject7$3;
6246
- var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 64px;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n background-color: var(--base-color-transparent);\n\n @media ", " {\n column-gap: 12px;\n }\n"])), devices.mobile);
6295
+ var _templateObject$E, _templateObject2$o, _templateObject3$h, _templateObject5$9, _templateObject6$6, _templateObject7$3;
6296
+ var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$E || (_templateObject$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 64px;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n background-color: var(--base-color-transparent);\n\n @media ", " {\n column-gap: 12px;\n }\n"])), devices.mobile);
6247
6297
  var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$o || (_templateObject2$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n"])));
6248
6298
  var SvgContainerClose = /*#__PURE__*/styled__default.div(_templateObject3$h || (_templateObject3$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n\n :hover {\n cursor: pointer;\n && svg path {\n fill: var(--base-color-navigation);\n }\n }\n"])));
6249
6299
  var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: blue;\n width: 100%;\n\n input {\n font-size: var(--font-size-search);\n font-family: var(--font-family-search);\n border: none;\n border-radius: 0;\n outline: none;\n outline-color: var(--base-color-white);\n height: 48px;\n box-sizing: border-box;\n width: 100%;\n -webkit-appearance: none;\n\n &.search-input {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n @media ", " {\n column-gap: 24px;\n }\n }\n"])), devices.mobile);
@@ -6480,16 +6530,16 @@ var Navigation = function Navigation(_ref) {
6480
6530
  })))));
6481
6531
  };
6482
6532
 
6483
- var _templateObject$E, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$a, _templateObject6$7;
6484
- var FooterSection = /*#__PURE__*/styled__default.section(_templateObject$E || (_templateObject$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n"])));
6533
+ var _templateObject$F, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$a, _templateObject6$7;
6534
+ var FooterSection = /*#__PURE__*/styled__default.section(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n"])));
6485
6535
  var FooterContainer = /*#__PURE__*/styled__default.div(_templateObject2$p || (_templateObject2$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-height);\n padding-top: var(--footer-padding-top);\n padding-bottom: var(--footer-padding-bottom);\n display: grid;\n grid-template-rows:\n min-content var(--footer-vertical-spacing-lg) min-content var(--footer-vertical-spacing-lg) min-content var(\n --footer-vertical-spacing-sm\n )\n min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2'\n '.'\n 'row3'\n '.'\n 'row4';\n"])));
6486
6536
  var PolicyLinksRow = /*#__PURE__*/styled__default.div(_templateObject3$i || (_templateObject3$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row1;\n justify-self: center;\n\n @media ", " {\n & {\n justify-self: start;\n grid-area: row2;\n }\n }\n"])), devices.mobile);
6487
6537
  var ContactNewsletterRow = /*#__PURE__*/styled__default.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row2;\n\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), devices.mobile);
6488
6538
  var ArtsLogoRow = /*#__PURE__*/styled__default.div(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row3;\n justify-self: center;\n\n @media ", " {\n justify-self: start;\n }\n"])), devices.mobile);
6489
6539
  var AdditionalInfo = /*#__PURE__*/styled__default.p(_templateObject6$7 || (_templateObject6$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row4;\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-3);\n line-height: var(--line-height-body-3);\n text-align: center;\n margin: 0;\n padding: 0;\n\n @media ", " {\n text-align: left;\n }\n"])), devices.mobile);
6490
6540
 
6491
- var _templateObject$F, _templateObject2$q, _templateObject3$j;
6492
- var PolicyLinksList = /*#__PURE__*/styled__default.ul(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 auto;\n padding: 0;\n list-style: none;\n display: flex;\n gap: var(--footer-items-gap);\n\n @media ", " {\n & {\n margin: 0;\n flex-direction: column;\n }\n }\n"])), devices.mobile);
6541
+ var _templateObject$G, _templateObject2$q, _templateObject3$j;
6542
+ var PolicyLinksList = /*#__PURE__*/styled__default.ul(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 auto;\n padding: 0;\n list-style: none;\n display: flex;\n gap: var(--footer-items-gap);\n\n @media ", " {\n & {\n margin: 0;\n flex-direction: column;\n }\n }\n"])), devices.mobile);
6493
6543
  var PolicyLinkItem = /*#__PURE__*/styled__default.li(_templateObject2$q || (_templateObject2$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n text-align: center;\n\n @media ", " {\n & {\n text-align: left;\n }\n }\n"])), devices.mobile);
6494
6544
  var PolicyLink = /*#__PURE__*/styled__default.a(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: fit-content;\n text-decoration: none;\n text-transform: uppercase;\n color: var(--base-color-white);\n cursor: pointer;\n"])));
6495
6545
 
@@ -6507,8 +6557,8 @@ var PolicyLinks = function PolicyLinks(_ref) {
6507
6557
  }));
6508
6558
  };
6509
6559
 
6510
- var _templateObject$G, _templateObject2$r, _templateObject3$k, _templateObject4$f, _templateObject5$b, _templateObject6$8, _templateObject7$4, _templateObject8$3;
6511
- var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: calc(50% - 1px) 2px calc(50% - 1px);\n grid-template-rows: 100px;\n gap: 0;\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content min-content;\n gap: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
6560
+ var _templateObject$H, _templateObject2$r, _templateObject3$k, _templateObject4$f, _templateObject5$b, _templateObject6$8, _templateObject7$4, _templateObject8$3;
6561
+ var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$H || (_templateObject$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: calc(50% - 1px) 2px calc(50% - 1px);\n grid-template-rows: 100px;\n gap: 0;\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content min-content;\n gap: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
6512
6562
  var ContactNewsletterSeparator = /*#__PURE__*/styled__default.div(_templateObject2$r || (_templateObject2$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2;\n justify-self: center;\n height: 100%;\n border: 1px solid var(--base-color-white);\n\n @media ", " {\n & {\n grid-column: auto;\n display: none;\n }\n }\n"])), devices.mobile);
6513
6563
  var SignUpWrapper = /*#__PURE__*/styled__default.div(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n padding-top: 9px;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
6514
6564
  var SignUpText = /*#__PURE__*/styled__default.p(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-2);\n line-height: var(--line-height-body-2);\n width: 60%;\n margin: 0 auto;\n height: 60px;\n text-align: center;\n\n @media ", " {\n & {\n width: 100%;\n height: auto;\n text-align: left;\n font-size: 14px;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
@@ -6579,9 +6629,9 @@ var Footer = function Footer(_ref) {
6579
6629
  }, additionalInfo)))));
6580
6630
  };
6581
6631
 
6582
- var _templateObject$H, _templateObject2$s, _templateObject3$l, _templateObject4$g, _templateObject5$c, _templateObject6$9;
6632
+ var _templateObject$I, _templateObject2$s, _templateObject3$l, _templateObject4$g, _templateObject5$c, _templateObject6$9;
6583
6633
  var LIST_ITEM_GAP = 32;
6584
- var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$H || (_templateObject$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
6634
+ var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
6585
6635
  var bottomBorder = _ref.bottomBorder;
6586
6636
  return bottomBorder ? '2px solid var(--base-color-light-grey)' : 'none';
6587
6637
  }, zIndexes.anchor);
@@ -6845,8 +6895,8 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
6845
6895
  })) : null) : null))));
6846
6896
  };
6847
6897
 
6848
- var _templateObject$I, _templateObject2$t, _templateObject3$m, _templateObject4$h, _templateObject6$a, _templateObject7$5, _templateObject8$4, _templateObject9$2, _templateObject10$2;
6849
- var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
6898
+ var _templateObject$J, _templateObject2$t, _templateObject3$m, _templateObject4$h, _templateObject6$a, _templateObject7$5, _templateObject8$4, _templateObject9$2, _templateObject10$2;
6899
+ var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
6850
6900
  var sticky = _ref.sticky;
6851
6901
  return sticky ? 'sticky' : 'initial';
6852
6902
  }, zIndexes.anchor);
@@ -6906,8 +6956,8 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
6906
6956
  }, message)));
6907
6957
  };
6908
6958
 
6909
- var _templateObject$J, _templateObject2$u, _templateObject3$n, _templateObject4$i, _templateObject5$d, _templateObject6$b, _templateObject7$6, _templateObject8$5;
6910
- var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-lightgrey);\n padding: 40px;\n\n display: block;\n position: relative;\n\n @media ", " {\n margin-top: 0;\n padding: 40px 20px;\n }\n"])), devices.tablet);
6959
+ var _templateObject$K, _templateObject2$u, _templateObject3$n, _templateObject4$i, _templateObject5$d, _templateObject6$b, _templateObject7$6, _templateObject8$5;
6960
+ var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-lightgrey);\n padding: 40px;\n\n display: block;\n position: relative;\n\n @media ", " {\n margin-top: 0;\n padding: 40px 20px;\n }\n"])), devices.tablet);
6911
6961
  var PromoLabelWrapper = /*#__PURE__*/styled__default.div(_templateObject2$u || (_templateObject2$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-self: flex-end;\n height: 15px;\n"])));
6912
6962
  var PromoLabel = /*#__PURE__*/styled__default.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n color: ", ";\n padding: 6px 8px;\n width: fit-content;\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n right: 20px;\n top: 0;\n width: auto;\n margin: auto;\n font-family: var(--font-family-header);\n font-feature-settings: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n font-size: var(--font-size-overline-2);\n line-height: 12px;\n text-align: center;\n letter-spacing: 1px;\n text-transform: uppercase;\n"])), function (_ref) {
6913
6963
  var theme = _ref.theme;
@@ -6987,8 +7037,8 @@ var UpsellCard = function UpsellCard(_ref) {
6987
7037
  }), link && /*#__PURE__*/React__default.createElement(ButtonContainer, null, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, link), truncate(link.text, LENGTH_SMALL_TEXT)))));
6988
7038
  };
6989
7039
 
6990
- var _templateObject$K;
6991
- var Wrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 75px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n padding-left: 0;\n padding-right: 0;\n }\n\n @media ", " {\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.tablet, devices.mobile);
7040
+ var _templateObject$L;
7041
+ var Wrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 75px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n padding-left: 0;\n padding-right: 0;\n }\n\n @media ", " {\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.tablet, devices.mobile);
6992
7042
 
6993
7043
  var UpsellCards = function UpsellCards(_ref) {
6994
7044
  var upsellCards = _ref.upsellCards;
@@ -7006,20 +7056,26 @@ var UpsellCards = function UpsellCards(_ref) {
7006
7056
  }));
7007
7057
  };
7008
7058
 
7009
- var _templateObject$L, _templateObject2$v, _templateObject3$o;
7010
- var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: ", ";\n padding: 80px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding-top: 2.5em;\n padding-left: 0;\n padding-right: 0;\n padding-bottom: 2.5em;\n }\n }\n\n @media ", " {\n & {\n padding: 25px;\n padding-top: 2.5em;\n }\n }\n"])), function (_ref) {
7059
+ var _templateObject$M, _templateObject2$v, _templateObject3$o;
7060
+ var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: ", ";\n padding: 80px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding-top: 2.5em;\n padding-left: 0;\n padding-right: 0;\n padding-bottom: 2.5em;\n }\n }\n\n @media ", " {\n & {\n padding: 25px;\n padding-top: 2.5em;\n }\n }\n"])), function (_ref) {
7011
7061
  var theme = _ref.theme;
7012
7062
  return theme.colors.primary;
7013
7063
  }, devices.mobile, devices.tablet);
7014
7064
  var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$v || (_templateObject2$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n }\n"])), devices.mobile);
7015
7065
  var TextContainer = /*#__PURE__*/styled__default.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 2.5em;\n div > :first-child {\n margin-top: 1.5em;\n }\n\n @media ", " {\n margin-top: 0;\n div > :first-child {\n margin-top: 0.5em;\n }\n }\n\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n & {\n div > :first-child {\n margin-top: 1em;\n }\n }\n }\n"])), devices.tablet, devices.mobile);
7016
7066
 
7017
- var _templateObject$M, _templateObject2$w, _templateObject3$p, _templateObject4$j, _templateObject5$e;
7018
- var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
7067
+ var _templateObject$N, _templateObject2$w, _templateObject3$p, _templateObject4$j, _templateObject5$e;
7068
+ var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
7019
7069
  var LineContainer = /*#__PURE__*/styled__default.div(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-lightgrey);\n width: 100%;\n"])));
7020
- var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n"])), devices.mobile);
7070
+ var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n visibility: ", ";\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n \n @media print { \n visibility: visible;\n }\n}\n"])), function (_ref) {
7071
+ var isVisible = _ref.isVisible;
7072
+ return isVisible ? 'visible' : 'hidden';
7073
+ }, devices.mobile);
7021
7074
  var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n\n && h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n div {\n margin: 21px 20px;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n @media ", " {\n margin: 12px 20px 12px 0px;\n }\n }\n\n && svg {\n width: var(--navigation-middle-gap);\n height: var(--navigation-middle-gap);\n margin-right: 20px;\n\n @media ", " {\n margin-right: 0px;\n }\n }\n\n :hover {\n cursor: pointer;\n }\n"])), devices.mobile, devices.mobile);
7022
- var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s 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\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), devices.mobile);
7075
+ var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s 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 max-height: ", ";\n\n @media print {\n max-height: 500px;\n }\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\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (_ref2) {
7076
+ var textHeight = _ref2.textHeight;
7077
+ return textHeight;
7078
+ }, devices.mobile);
7023
7079
 
7024
7080
  var Accordion = function Accordion(_ref) {
7025
7081
  var _ref$title = _ref.title,
@@ -7050,11 +7106,7 @@ var Accordion = function Accordion(_ref) {
7050
7106
  setIconName = _useState3[1]; // Contents children visibility is set to prevent it from being keyboard tabbable when the accordion is closed
7051
7107
 
7052
7108
 
7053
- var _useState4 = React.useState(initOpen ? {
7054
- visibility: 'visible'
7055
- } : {
7056
- visibility: 'hidden'
7057
- }),
7109
+ var _useState4 = React.useState(initOpen),
7058
7110
  childrenVisibility = _useState4[0],
7059
7111
  setChildrenVisibility = _useState4[1];
7060
7112
 
@@ -7070,11 +7122,7 @@ var Accordion = function Accordion(_ref) {
7070
7122
  setOpenAccordion(!openAccordion);
7071
7123
  setTextHeight(openAccordion ? '0px' : content.current.scrollHeight + "px");
7072
7124
  setIconName(openAccordion ? 'Expand' : 'Detract');
7073
- setChildrenVisibility(openAccordion ? {
7074
- visibility: 'hidden'
7075
- } : {
7076
- visibility: 'visible'
7077
- });
7125
+ setChildrenVisibility(!openAccordion);
7078
7126
  };
7079
7127
 
7080
7128
  var keyDown = function keyDown(e) {
@@ -7084,7 +7132,9 @@ var Accordion = function Accordion(_ref) {
7084
7132
  };
7085
7133
 
7086
7134
  var Standfirst = function Standfirst() {
7087
- return visibleStandfirst ? /*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer, null, visibleStandfirst)) : null;
7135
+ return visibleStandfirst ? /*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
7136
+ isVisible: childrenVisibility
7137
+ }, visibleStandfirst)) : null;
7088
7138
  };
7089
7139
 
7090
7140
  var contentContainerId = title + "-accordion-content";
@@ -7134,18 +7184,16 @@ var Accordion = function Accordion(_ref) {
7134
7184
  })), visibleStandfirst && /*#__PURE__*/React__default.createElement(Standfirst, null), /*#__PURE__*/React__default.createElement(ContentContainer, {
7135
7185
  "data-testid": "richcontainer",
7136
7186
  ref: content,
7137
- style: {
7138
- maxHeight: "" + textHeight
7139
- },
7187
+ textHeight: textHeight,
7140
7188
  id: contentContainerId,
7141
7189
  "aria-live": "polite"
7142
7190
  }, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
7143
- style: childrenVisibility
7191
+ isVisible: childrenVisibility
7144
7192
  }, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
7145
7193
  };
7146
7194
 
7147
- var _templateObject$N;
7148
- var AccordionsContainer = /*#__PURE__*/styled__default.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
7195
+ var _templateObject$O;
7196
+ var AccordionsContainer = /*#__PURE__*/styled__default.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
7149
7197
 
7150
7198
  var Accordions = function Accordions(_ref) {
7151
7199
  var _ref$items = _ref.items,
@@ -7163,7 +7211,8 @@ var Accordions = function Accordions(_ref) {
7163
7211
  visibleStandfirst: accordion.visibleStandfirst,
7164
7212
  contentType: accordion.contentType,
7165
7213
  displayLevel: accordion.displayLevel,
7166
- semanticLevel: accordion.semanticLevel
7214
+ semanticLevel: accordion.semanticLevel,
7215
+ initOpen: accordion.initOpen
7167
7216
  }, accordion.children);
7168
7217
  }));
7169
7218
  };
@@ -7177,8 +7226,8 @@ var Theme = function Theme(_ref) {
7177
7226
  }, children);
7178
7227
  };
7179
7228
 
7180
- var _templateObject$O, _templateObject2$x, _templateObject3$q;
7181
- var AnnouncementBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 28px 0;\n background-color: ", ";\n color: var(--base-color-white);\n\n @media ", " {\n padding: 20px 0;\n }\n"])), function (_ref) {
7229
+ var _templateObject$P, _templateObject2$x, _templateObject3$q;
7230
+ var AnnouncementBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 28px 0;\n background-color: ", ";\n color: var(--base-color-white);\n\n @media ", " {\n padding: 20px 0;\n }\n"])), function (_ref) {
7182
7231
  var theme = _ref.theme;
7183
7232
  return theme.colors.primary;
7184
7233
  }, devices.mobile);
@@ -7220,8 +7269,8 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
7220
7269
  }))))));
7221
7270
  };
7222
7271
 
7223
- var _templateObject$P;
7224
- var AuxiliaryButtonWrapper = /*#__PURE__*/styled__default(Button)(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n height: 20px;\n border: none;\n padding: 0;\n font-family: var(--font-family-buttons);\n font-size: var(--button-font-size);\n font-weight: var(--button-font-weight);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n cursor: pointer;\n text-decoration: none;\n box-sizing: border-box;\n\n .auxiliaryButtonIcon {\n width: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])), function (_ref) {
7272
+ var _templateObject$Q;
7273
+ var AuxiliaryButtonWrapper = /*#__PURE__*/styled__default(Button)(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n height: 20px;\n border: none;\n padding: 0;\n font-family: var(--font-family-buttons);\n font-size: var(--button-font-size);\n font-weight: var(--button-font-weight);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n cursor: pointer;\n text-decoration: none;\n box-sizing: border-box;\n\n .auxiliaryButtonIcon {\n width: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])), function (_ref) {
7225
7274
  var bgColor = _ref.bgColor,
7226
7275
  theme = _ref.theme;
7227
7276
  return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.auxiliaryButton;
@@ -7242,11 +7291,11 @@ var AuxiliaryButton = function AuxiliaryButton(_ref) {
7242
7291
  }), children);
7243
7292
  };
7244
7293
 
7245
- var _templateObject$Q, _templateObject2$y, _templateObject3$r, _templateObject4$k, _templateObject5$f, _templateObject6$c, _templateObject7$7, _templateObject8$6, _templateObject9$3, _templateObject10$3, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
7294
+ var _templateObject$R, _templateObject2$y, _templateObject3$r, _templateObject4$k, _templateObject5$f, _templateObject6$c, _templateObject7$7, _templateObject8$6, _templateObject9$3, _templateObject10$3, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
7246
7295
  var LENGTH_LARGE_TEXT = 28;
7247
7296
  var LENGTH_SMALL_TEXT$1 = 19;
7248
7297
  var LENGTH_TEXT_TABLET = 10;
7249
- var CardContainer = /*#__PURE__*/styled__default.div(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n position: relative;\n ", "\n\n .targetLink {\n text-decoration: none;\n color: inherit;\n }\n"])), function (_ref) {
7298
+ var CardContainer = /*#__PURE__*/styled__default.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n position: relative;\n ", "\n\n .targetLink {\n text-decoration: none;\n color: inherit;\n }\n"])), function (_ref) {
7250
7299
  var isCardClickable = _ref.isCardClickable;
7251
7300
  return isCardClickable ? 'pointer' : 'default';
7252
7301
  }, function (_ref2) {
@@ -7528,9 +7577,9 @@ var Card = function Card(_ref) {
7528
7577
  dangerouslySetInnerHTML: {
7529
7578
  __html: truncatedText
7530
7579
  }
7531
- }), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
7580
+ }))), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
7532
7581
  level: 1
7533
- }, highlightText)))), auxiliaryCTA && /*#__PURE__*/React__default.createElement(ExtraActionsContainer, {
7582
+ }, highlightText)), auxiliaryCTA && /*#__PURE__*/React__default.createElement(ExtraActionsContainer, {
7534
7583
  fullWidth: fullWidth
7535
7584
  }, /*#__PURE__*/React__default.createElement(AuxiliaryButton, Object.assign({}, auxiliaryCTA), auxiliaryCTA.text)), links && /*#__PURE__*/React__default.createElement(ButtonsContainer$1, {
7536
7585
  ref: node,
@@ -7544,8 +7593,8 @@ var Card = function Card(_ref) {
7544
7593
  }, firstButton && /*#__PURE__*/React__default.createElement(FirstButtonComponent, Object.assign({}, restFirstButton), primaryButtonTextTruncate), secondButton && /*#__PURE__*/React__default.createElement(SecondButtonComponent, Object.assign({}, restSecondButton), tertiaryButtonTextTruncate)));
7545
7594
  };
7546
7595
 
7547
- var _templateObject$R, _templateObject2$z;
7548
- var CardsContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n @media ", " {\n grid-row-gap: var(--cards-spacing-stack);\n }\n"])), devices.mobile);
7596
+ var _templateObject$S, _templateObject2$z;
7597
+ var CardsContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n @media ", " {\n grid-row-gap: var(--cards-spacing-stack);\n }\n"])), devices.mobile);
7549
7598
  var GridItemContainer = /*#__PURE__*/styled__default(GridItem)(_templateObject2$z || (_templateObject2$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 1 / span 14;\n }\n"])), devices.mobile);
7550
7599
 
7551
7600
  var Cards = function Cards(_ref) {
@@ -7591,8 +7640,8 @@ var Cards = function Cards(_ref) {
7591
7640
  }));
7592
7641
  };
7593
7642
 
7594
- var _templateObject$S, _templateObject2$A, _templateObject3$s, _templateObject4$l, _templateObject5$g;
7595
- var ContentWrapper = /*#__PURE__*/styled__default.div(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > div {\n margin-bottom: 2px;\n\n &:first-child {\n margin-bottom: 4px;\n\n @media ", " {\n margin-bottom: 6px;\n }\n }\n }\n\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobile, devices.mobileAndTablet);
7643
+ var _templateObject$T, _templateObject2$A, _templateObject3$s, _templateObject4$l, _templateObject5$g;
7644
+ var ContentWrapper = /*#__PURE__*/styled__default.div(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > div {\n margin-bottom: 2px;\n\n &:first-child {\n margin-bottom: 4px;\n\n @media ", " {\n margin-bottom: 6px;\n }\n }\n }\n\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobile, devices.mobileAndTablet);
7596
7645
  var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject2$A || (_templateObject2$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n padding: 30px 0;\n\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])), function (_ref) {
7597
7646
  var hideBottomBorder = _ref.hideBottomBorder;
7598
7647
  return "border-bottom: " + (hideBottomBorder ? 'none' : '2px solid var(--base-color-midgrey)') + ";";
@@ -7660,8 +7709,8 @@ var ContactCard = function ContactCard(_ref) {
7660
7709
  }, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString)))))));
7661
7710
  };
7662
7711
 
7663
- var _templateObject$T, _templateObject2$B, _templateObject3$t, _templateObject4$m, _templateObject5$h, _templateObject6$d, _templateObject7$8;
7664
- var BodyTextRelative = /*#__PURE__*/styled__default(BodyText)(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
7712
+ var _templateObject$U, _templateObject2$B, _templateObject3$t, _templateObject4$m, _templateObject5$h, _templateObject6$d, _templateObject7$8;
7713
+ var BodyTextRelative = /*#__PURE__*/styled__default(BodyText)(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
7665
7714
  var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n justify-items: start;\n align-items: center;\n margin: 20px 0;\n gap: 24px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
7666
7715
  return props.clickable ? 'pointer' : 'default';
7667
7716
  }, devices.mobile);
@@ -7743,8 +7792,8 @@ var ContentSummary = function ContentSummary(_ref) {
7743
7792
  }), link.text)));
7744
7793
  };
7745
7794
 
7746
- var _templateObject$U, _templateObject2$C, _templateObject3$u, _templateObject4$n, _templateObject5$i;
7747
- var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(12, minmax(0, 1fr));\n gap: var(--grid-column-gap);\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content 24px min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2';\n }\n }\n"])), function (_ref) {
7795
+ var _templateObject$V, _templateObject2$C, _templateObject3$u, _templateObject4$n, _templateObject5$i;
7796
+ var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(12, minmax(0, 1fr));\n gap: var(--grid-column-gap);\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content 24px min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2';\n }\n }\n"])), function (_ref) {
7748
7797
  var imageToLeft = _ref.imageToLeft;
7749
7798
  return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
7750
7799
  }, devices.mobile);
@@ -7821,8 +7870,8 @@ var BackgroundColour;
7821
7870
  BackgroundColour["White"] = "white";
7822
7871
  })(BackgroundColour || (BackgroundColour = {}));
7823
7872
 
7824
- var _templateObject$V, _templateObject2$D, _templateObject3$v, _templateObject4$o;
7825
- var InfoContent = /*#__PURE__*/styled__default('div')(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n -webkit-letter-spacing: var(--letter-spacing-altHeader-6);\n -moz-letter-spacing: var(--letter-spacing-altHeader-6);\n -ms-letter-spacing: var(--letter-spacing-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n word-break: var(--word-break-altHeader);\n"])));
7873
+ var _templateObject$W, _templateObject2$D, _templateObject3$v, _templateObject4$o;
7874
+ var InfoContent = /*#__PURE__*/styled__default('div')(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n -webkit-letter-spacing: var(--letter-spacing-altHeader-6);\n -moz-letter-spacing: var(--letter-spacing-altHeader-6);\n -ms-letter-spacing: var(--letter-spacing-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n word-break: var(--word-break-altHeader);\n"])));
7826
7875
  var InfoTitle = /*#__PURE__*/styled__default('div')(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
7827
7876
  var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 32px 0;\n\n ", "}\n"])), function (props) {
7828
7877
  if (!props.infoThemed) {
@@ -7948,8 +7997,8 @@ var Information = function Information(_ref) {
7948
7997
  }))));
7949
7998
  };
7950
7999
 
7951
- var _templateObject$W, _templateObject2$E, _templateObject3$w, _templateObject4$p, _templateObject5$j, _templateObject6$e, _templateObject7$9, _templateObject8$7;
7952
- var PageHeadingWrapper = /*#__PURE__*/styled__default.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n ", ";\n\n h2 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
8000
+ var _templateObject$X, _templateObject2$E, _templateObject3$w, _templateObject4$p, _templateObject5$j, _templateObject6$e, _templateObject7$9, _templateObject8$7;
8001
+ var PageHeadingWrapper = /*#__PURE__*/styled__default.div(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n ", ";\n\n // remove spacing above/below for all semantic levels of the title\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
7953
8002
  var theme = _ref.theme;
7954
8003
  return theme.colors.primary;
7955
8004
  }, function (_ref2) {
@@ -8049,8 +8098,8 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
8049
8098
  })));
8050
8099
  };
8051
8100
 
8052
- var _templateObject$X, _templateObject2$F, _templateObject3$x, _templateObject4$q, _templateObject5$k, _templateObject6$f, _templateObject7$a, _templateObject8$8;
8053
- var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n position: relative;\n display: flex;\n background: var(--base-color-black);\n\n @media ", " {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n }\n"])), devices.mobile);
8101
+ var _templateObject$Y, _templateObject2$F, _templateObject3$x, _templateObject4$q, _templateObject5$k, _templateObject6$f, _templateObject7$a, _templateObject8$8;
8102
+ var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n position: relative;\n display: flex;\n background: var(--base-color-black);\n\n @media ", " {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n }\n"])), devices.mobile);
8054
8103
  var ImpactHeaderImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$F || (_templateObject2$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n overflow: hidden;\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n img {\n width: 100%;\n filter: brightness(0.7);\n opacity: 0.95;\n }\n\n @media ", " {\n height: fit-content;\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n\n img {\n height: 100%;\n object-fit: cover;\n }\n }\n"])), devices.mobile);
8055
8104
  var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n align-self: center;\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo logo logo . . . . .'\n '. . . text text text text text text text text text text . . .'\n '. . . button button button button button button button button button button . . .';\n\n @media ", " {\n & {\n height: 100%;\n grid-template-rows: 1fr max-content 1fr;\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .';\n }\n }\n\n @media ", " {\n align-content: center;\n\n & {\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. . text text text text text text text text text text . .'\n '. . button button button button button button button button button button . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
8056
8105
  var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
@@ -8123,8 +8172,8 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
8123
8172
  }, "Scroll Down")) : null);
8124
8173
  };
8125
8174
 
8126
- var _templateObject$Y, _templateObject2$G, _templateObject3$y, _templateObject4$r, _templateObject5$l;
8127
- var PanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
8175
+ var _templateObject$Z, _templateObject2$G, _templateObject3$y, _templateObject4$r, _templateObject5$l;
8176
+ var PanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
8128
8177
  var color = _ref.color;
8129
8178
  return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === exports.Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
8130
8179
  }, devices.mobileAndTablet);
@@ -8168,8 +8217,8 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
8168
8217
  }))));
8169
8218
  };
8170
8219
 
8171
- var _templateObject$Z;
8172
- var StreamWrapper = /*#__PURE__*/styled__default.div(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
8220
+ var _templateObject$_;
8221
+ var StreamWrapper = /*#__PURE__*/styled__default.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
8173
8222
 
8174
8223
  var PageHeadingStream = function PageHeadingStream(_ref) {
8175
8224
  var link = _ref.link,
@@ -8189,8 +8238,8 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
8189
8238
  }))));
8190
8239
  };
8191
8240
 
8192
- var _templateObject$_, _templateObject2$H, _templateObject3$z, _templateObject5$m, _templateObject6$g, _templateObject7$b, _templateObject8$9, _templateObject9$4, _templateObject10$4;
8193
- var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-overline-4);\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);
8241
+ var _templateObject$$, _templateObject2$H, _templateObject3$z, _templateObject5$m, _templateObject6$g, _templateObject7$b, _templateObject8$9, _templateObject9$4, _templateObject10$4;
8242
+ var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-overline-4);\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);
8194
8243
  var BrandingTextBody = /*#__PURE__*/styled__default.p(_templateObject2$H || (_templateObject2$H = /*#__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"])));
8195
8244
  var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
8196
8245
  var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$m || (_templateObject5$m = /*#__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);
@@ -8316,7 +8365,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
8316
8365
  var isIOS = function isIOS() {
8317
8366
  try {
8318
8367
  console.warn('Do not use this on server side rendering, it may throw an error.');
8319
- if (typeof navigator === undefined) return false;
8368
+ if (typeof navigator === 'undefined') return false;
8320
8369
  return ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) || // iPad on iOS 13 detection
8321
8370
  navigator.userAgent.includes('Mac') && 'ontouchend' in document;
8322
8371
  } catch (e) {
@@ -8332,7 +8381,7 @@ var useIOS = function useIOS() {
8332
8381
  setIOS = _useState[1];
8333
8382
 
8334
8383
  React.useEffect(function () {
8335
- if (typeof navigator === undefined) return;
8384
+ if (typeof navigator === 'undefined') return;
8336
8385
  setIOS(isIOS());
8337
8386
  }, []);
8338
8387
  return IOS;
@@ -8518,8 +8567,8 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
8518
8567
  }), linkText))));
8519
8568
  };
8520
8569
 
8521
- var _templateObject$$, _templateObject2$I, _templateObject3$A, _templateObject4$s;
8522
- var MorePages = /*#__PURE__*/styled__default.span(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n pointer-events: none;\n"])));
8570
+ var _templateObject$10, _templateObject2$I, _templateObject3$A, _templateObject4$s;
8571
+ var MorePages = /*#__PURE__*/styled__default.span(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n pointer-events: none;\n"])));
8523
8572
  var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 40px;\n margin-bottom: 40px;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: 1px solid rgba(0, 0, 0, 0);\n }\n"]))); // PageNumber extends bodyText but uses subtitle-1 font size
8524
8573
 
8525
8574
  var PageNumber = /*#__PURE__*/styled__default.a(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: inherit;\n margin: 0;\n border-bottom: 1px solid transparent;\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n :hover {\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n /* active state - string used because react returns error for bool */\n ", "\n"])), function (_ref) {
@@ -8595,8 +8644,8 @@ var Pagination = function Pagination(_ref) {
8595
8644
  }))));
8596
8645
  };
8597
8646
 
8598
- var _templateObject$10, _templateObject2$J, _templateObject3$B, _templateObject4$t, _templateObject5$n, _templateObject6$h;
8599
- var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$10 || (_templateObject$10 = /*#__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);
8647
+ var _templateObject$11, _templateObject2$J, _templateObject3$B, _templateObject4$t, _templateObject5$n, _templateObject6$h;
8648
+ var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$11 || (_templateObject$11 = /*#__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);
8600
8649
  var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$J || (_templateObject2$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
8601
8650
  var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
8602
8651
  var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
@@ -8652,11 +8701,11 @@ var PeopleListing = function PeopleListing(_ref) {
8652
8701
  }));
8653
8702
  };
8654
8703
 
8655
- var _templateObject$11, _templateObject2$K, _templateObject3$C, _templateObject4$u;
8656
- var ReplacementWrapper = /*#__PURE__*/styled__default.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
8704
+ var _templateObject$12, _templateObject2$K, _templateObject3$C, _templateObject4$u;
8705
+ var ReplacementWrapper = /*#__PURE__*/styled__default.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
8657
8706
  var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n"])));
8658
- var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 25px;\n margin-bottom: 3px;\n }\n"])));
8659
- var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
8707
+ var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 1.5;\n margin-bottom: 4px;\n }\n"])));
8708
+ var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n"])));
8660
8709
 
8661
8710
  var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
8662
8711
  return array.reduce(function (acc, item) {
@@ -8667,12 +8716,18 @@ var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop)
8667
8716
  var concatenateMusicTitle = function concatenateMusicTitle(musicTitle) {
8668
8717
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, musicTitle.map(function (title, index) {
8669
8718
  if (musicTitle.length > 1 && index === musicTitle.length - 1) {
8670
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i", null, title));
8719
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i", {
8720
+ key: index
8721
+ }, title));
8671
8722
  } else if (index > 0) {
8672
- return /*#__PURE__*/React__default.createElement("i", null, ", ", title);
8723
+ return /*#__PURE__*/React__default.createElement("i", {
8724
+ key: index
8725
+ }, ", ", title);
8673
8726
  }
8674
8727
 
8675
- return /*#__PURE__*/React__default.createElement("i", null, title);
8728
+ return /*#__PURE__*/React__default.createElement("i", {
8729
+ key: index
8730
+ }, title);
8676
8731
  }));
8677
8732
  };
8678
8733
 
@@ -8724,14 +8779,14 @@ var CreditListing = function CreditListing(_ref) {
8724
8779
  }));
8725
8780
  };
8726
8781
 
8727
- var _templateObject$12, _templateObject2$L, _templateObject3$D, _templateObject4$v, _templateObject5$o, _templateObject6$i, _templateObject7$c, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$2, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
8782
+ var _templateObject$13, _templateObject2$L, _templateObject3$D, _templateObject4$v, _templateObject5$o, _templateObject6$i, _templateObject7$c, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$2, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
8728
8783
  var LENGTH_TEXT = 28;
8729
8784
  var LENGTH_TEXT_TABLET$1 = 12;
8730
8785
  var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
8731
8786
  var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
8732
8787
  var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
8733
8788
  var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
8734
- var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$12 || (_templateObject$12 = /*#__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\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
8789
+ var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$13 || (_templateObject$13 = /*#__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\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
8735
8790
  var imageToLeft = _ref.imageToLeft;
8736
8791
  return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
8737
8792
  }, devices.tablet, function (_ref2) {
@@ -9002,10 +9057,10 @@ var PromoWithTags = function PromoWithTags(_ref) {
9002
9057
  }))));
9003
9058
  };
9004
9059
 
9005
- var _templateObject$13, _templateObject2$M, _templateObject3$E, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d;
9060
+ var _templateObject$14, _templateObject2$M, _templateObject3$E, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d;
9006
9061
  var LENGTH_TEXT$2 = 28;
9007
9062
  var LENGTH_TEXT_TABLET$2 = 10;
9008
- var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$13 || (_templateObject$13 = /*#__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) {
9063
+ var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$14 || (_templateObject$14 = /*#__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) {
9009
9064
  var imageToLeft = _ref.imageToLeft;
9010
9065
  return imageToLeft ? "'left left left left left left left left . right right right right right . .'" : "'. . left left left left left . right right right right right right right right'";
9011
9066
  }, devices.tablet, function (_ref2) {
@@ -9058,8 +9113,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$d ||
9058
9113
  return '';
9059
9114
  });
9060
9115
 
9061
- var _templateObject$14;
9062
- var VideoContainer = /*#__PURE__*/styled__default.div(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
9116
+ var _templateObject$15;
9117
+ var VideoContainer = /*#__PURE__*/styled__default.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
9063
9118
  var _ref$aspectRatio = _ref.aspectRatio,
9064
9119
  aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
9065
9120
  return aspectRatio;
@@ -9263,8 +9318,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
9263
9318
  }, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate) : null) : null));
9264
9319
  };
9265
9320
 
9266
- var _templateObject$15;
9267
- var RadioGroupContainer = /*#__PURE__*/styled__default.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
9321
+ var _templateObject$16;
9322
+ var RadioGroupContainer = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
9268
9323
 
9269
9324
  /**
9270
9325
  * DEPRECATED. Use RadioGroup2 instead
@@ -9322,8 +9377,8 @@ var RadioGroup = function RadioGroup(_ref) {
9322
9377
  })));
9323
9378
  };
9324
9379
 
9325
- var _templateObject$16, _templateObject2$N, _templateObject3$F;
9326
- var Container$3 = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
9380
+ var _templateObject$17, _templateObject2$N, _templateObject3$F;
9381
+ var Container$3 = /*#__PURE__*/styled__default.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
9327
9382
  var RadioGroup$1 = /*#__PURE__*/styled__default.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
9328
9383
  var horizontalMode = _ref.horizontalMode;
9329
9384
  if (horizontalMode) return 'row';
@@ -9412,8 +9467,8 @@ var RadioGroup2 = function RadioGroup2(_ref) {
9412
9467
  }, error)));
9413
9468
  };
9414
9469
 
9415
- var _templateObject$17, _templateObject2$O, _templateObject3$G;
9416
- var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-lightgrey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
9470
+ var _templateObject$18, _templateObject2$O, _templateObject3$G;
9471
+ var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-lightgrey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
9417
9472
  var ContentContainer$3 = /*#__PURE__*/styled__default.div(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\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"])));
9418
9473
  var SvgContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
9419
9474
 
@@ -9477,8 +9532,8 @@ var StatusBanner = function StatusBanner(_ref) {
9477
9532
  })))));
9478
9533
  };
9479
9534
 
9480
- var _templateObject$18;
9481
- var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n font-size: var(--font-size-title-description);\n line-height: var(--line-height-title-description);\n margin-block-start: 0;\n }\n"])), devices.mobile);
9535
+ var _templateObject$19;
9536
+ var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n font-size: var(--font-size-title-description);\n line-height: var(--line-height-title-description);\n margin-block-start: 0;\n }\n"])), devices.mobile);
9482
9537
 
9483
9538
  var SectionTitle = function SectionTitle(_ref) {
9484
9539
  var title = _ref.title,
@@ -9506,8 +9561,8 @@ var SectionTitle = function SectionTitle(_ref) {
9506
9561
  }, description))));
9507
9562
  };
9508
9563
 
9509
- var _templateObject$19, _templateObject2$P, _templateObject3$H, _templateObject4$x, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject10$6, _templateObject11$3;
9510
- var stateStyles = /*#__PURE__*/styled.css(_templateObject$19 || (_templateObject$19 = /*#__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) {
9564
+ var _templateObject$1a, _templateObject2$P, _templateObject3$H, _templateObject4$x, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject10$6, _templateObject11$3;
9565
+ var stateStyles = /*#__PURE__*/styled.css(_templateObject$1a || (_templateObject$1a = /*#__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) {
9511
9566
  var theme = _ref.theme;
9512
9567
  return "3px solid " + theme.colors.lapisLazuli;
9513
9568
  }, function (_ref2) {
@@ -9929,8 +9984,8 @@ function Select(_ref3) {
9929
9984
  }))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
9930
9985
  }
9931
9986
 
9932
- var _templateObject$1a, _templateObject2$Q, _templateObject3$I, _templateObject4$y;
9933
- var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
9987
+ var _templateObject$1b, _templateObject2$Q, _templateObject3$I, _templateObject4$y;
9988
+ var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
9934
9989
  var SelectWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .chord-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n .chord-select__control--is-focused {\n border-color: var(--base-color-darkgrey);\n box-shadow: ", ";\n }\n .chord-select__control--menu-is-open {\n .chord-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n .chord-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--base-color-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n .chord-select__single-value,\n .chord-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n }\n .chord-select__placeholder {\n color: var(--base-color-darkgrey);\n }\n .chord-select__single-value {\n color: var(--base-color-black);\n }\n .chord-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n .chord-select--is-disabled {\n .chord-select__control {\n border: 1px solid var(--base-color-lightgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__indicator,\n .chord-select__single-value {\n color: var(--base-color-darkgrey);\n }\n }\n .chord-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--base-color-darkgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__menu-list {\n padding-top: 0;\n padding-bottom: 0;\n }\n .chord-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n &:active,\n &.chord-select__option--is-focused {\n background: var(--base-color-midgrey);\n }\n }\n .chord-select__option--is-selected {\n color: var(--base-color-black);\n background: none;\n }\n .chord-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n }\n .chord-select__menu-notice {\n padding: 20px 20px;\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\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 color: var(--base-color-black);\n text-align: left;\n }\n .chord-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
9935
9990
  var width = _ref.width;
9936
9991
  if (!width) return 'none';
@@ -10069,8 +10124,8 @@ var SelectComponent$1 = function SelectComponent(_ref) {
10069
10124
  })));
10070
10125
  };
10071
10126
 
10072
- var _templateObject$1b;
10073
- var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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 h2,\n h3,\n h4 {\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 margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\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 margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 12px;\n margin-right: 8px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
10127
+ var _templateObject$1c;
10128
+ var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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 h2,\n h3,\n h4 {\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 margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\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 margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 12px;\n margin-right: 8px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
10074
10129
  var theme = _ref.theme;
10075
10130
  return theme.colors.primary;
10076
10131
  });
@@ -10098,8 +10153,8 @@ var TextOnly = function TextOnly(_ref) {
10098
10153
  })));
10099
10154
  };
10100
10155
 
10101
- var _templateObject$1c, _templateObject2$R;
10102
- var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n height: 100%;\n width: fit-content;\n\n ", " {\n height: calc(100% - 12px - var(--line-height-body-2));\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), ImageAspectRatioWrapper, function (_ref) {
10156
+ var _templateObject$1d, _templateObject2$R;
10157
+ var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n height: 100%;\n width: fit-content;\n\n ", " {\n height: calc(100% - 12px - var(--line-height-body-2));\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), ImageAspectRatioWrapper, function (_ref) {
10103
10158
  var _ref$aspectRatio = _ref.aspectRatio,
10104
10159
  aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
10105
10160
  return aspectRatio;
@@ -10147,8 +10202,8 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
10147
10202
  }, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
10148
10203
  };
10149
10204
 
10150
- var _templateObject$1d, _templateObject2$S, _templateObject3$J;
10151
- var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
10205
+ var _templateObject$1e, _templateObject2$S, _templateObject3$J;
10206
+ var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
10152
10207
  var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
10153
10208
  var displayAttribution = _ref.displayAttribution;
10154
10209
  return "display: " + (displayAttribution ? 'block' : 'none') + ";";
@@ -10177,8 +10232,8 @@ var Quote = function Quote(_ref) {
10177
10232
  }, attribution))));
10178
10233
  };
10179
10234
 
10180
- var _templateObject$1e, _templateObject2$T, _templateObject3$K, _templateObject4$z, _templateObject5$r, _templateObject6$l;
10181
- var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1e || (_templateObject$1e = /*#__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"])));
10235
+ var _templateObject$1f, _templateObject2$T, _templateObject3$K, _templateObject4$z, _templateObject5$r, _templateObject6$l;
10236
+ var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__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"])));
10182
10237
  var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
10183
10238
  var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
10184
10239
  var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
@@ -10221,8 +10276,8 @@ var MiniCard = function MiniCard(_ref) {
10221
10276
  }, title)))));
10222
10277
  };
10223
10278
 
10224
- var _templateObject$1f, _templateObject2$U, _templateObject3$L, _templateObject4$A;
10225
- var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__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"])));
10279
+ var _templateObject$1g, _templateObject2$U, _templateObject3$L, _templateObject4$A;
10280
+ var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1g || (_templateObject$1g = /*#__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"])));
10226
10281
  var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n"])));
10227
10282
  var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
10228
10283
  var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__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"])));
@@ -10323,15 +10378,113 @@ var ReadMore = function ReadMore(_ref) {
10323
10378
  }, isFullTextOpen ? "" + hideText : "" + showMoreText)));
10324
10379
  };
10325
10380
 
10326
- var _templateObject$1g, _templateObject2$V, _templateObject3$M, _templateObject4$B, _templateObject5$s;
10327
- var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
10328
- var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$V || (_templateObject2$V = /*#__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"])), exports.Colors.LightGrey);
10329
- var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$M || (_templateObject3$M = /*#__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"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey);
10330
- var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$B || (_templateObject4$B = /*#__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 text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), exports.Colors.Black, function (_ref) {
10381
+ var _templateObject$1h, _templateObject2$V, _templateObject3$M, _templateObject4$B, _templateObject5$s, _templateObject6$m;
10382
+ var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
10383
+ var Sections = /*#__PURE__*/styled__default.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
10384
+ var Section = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
10385
+ var color = _ref.color;
10386
+ return "var(--base-color-" + color + ")";
10387
+ });
10388
+ var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
10389
+ var Text = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
10390
+ var color = _ref2.color;
10391
+ return "var(--base-color-" + color + ")";
10392
+ });
10393
+ var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
10394
+ var color = _ref3.color;
10395
+ return "var(--base-color-" + color + ")";
10396
+ });
10397
+
10398
+ /**
10399
+ * Password strength indicator component.
10400
+ * This renders some number of lines (6 by default)
10401
+ * which should become active when the user improves
10402
+ * the strength of the entered password.
10403
+ *
10404
+ * ## Sections
10405
+ * To set number of sections it should be passed
10406
+ * as `sections` prop.
10407
+ *
10408
+ * ## Active section
10409
+ * To set number of active sections it should be passed
10410
+ * as `activeSections` prop.
10411
+ *
10412
+ * ## Colors
10413
+ * Color of every element can be controlled by properties:
10414
+ * `sectionsColor`, `activeSectionsColor`,
10415
+ * `textColor`, `strengthLabelColor`.
10416
+ *
10417
+ * ## Text
10418
+ * `text` prop is used to render some message.
10419
+ * For example error (together with proper red color)
10420
+ * or some password requirement. It can be empty.
10421
+ *
10422
+ * ## Strength label
10423
+ * `strengthLabel` prop is used to render strength characteristic
10424
+ * of entered password. For example: `weak`, `normal`, `strong`, etc.
10425
+ * It can be empty.
10426
+ */
10427
+
10428
+ var PasswordStrength = function PasswordStrength(_ref) {
10429
+ var _ref$sections = _ref.sections,
10430
+ sections = _ref$sections === void 0 ? 6 : _ref$sections,
10431
+ _ref$activeSections = _ref.activeSections,
10432
+ activeSections = _ref$activeSections === void 0 ? 0 : _ref$activeSections,
10433
+ _ref$sectionsColor = _ref.sectionsColor,
10434
+ sectionsColor = _ref$sectionsColor === void 0 ? exports.Colors.MidGrey : _ref$sectionsColor,
10435
+ _ref$activeSectionsCo = _ref.activeSectionsColor,
10436
+ activeSectionsColor = _ref$activeSectionsCo === void 0 ? exports.Colors.Black : _ref$activeSectionsCo,
10437
+ _ref$text = _ref.text,
10438
+ text = _ref$text === void 0 ? '' : _ref$text,
10439
+ _ref$textColor = _ref.textColor,
10440
+ textColor = _ref$textColor === void 0 ? exports.Colors.Black : _ref$textColor,
10441
+ _ref$strengthLabel = _ref.strengthLabel,
10442
+ strengthLabel = _ref$strengthLabel === void 0 ? '' : _ref$strengthLabel,
10443
+ _ref$strengthLabelCol = _ref.strengthLabelColor,
10444
+ strengthLabelColor = _ref$strengthLabelCol === void 0 ? exports.Colors.Black : _ref$strengthLabelCol;
10445
+
10446
+ var setSectionColor = function setSectionColor(index) {
10447
+ return index < activeSections ? activeSectionsColor : sectionsColor;
10448
+ };
10449
+
10450
+ var setSectionDataTestId = function setSectionDataTestId(index) {
10451
+ return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
10452
+ };
10453
+
10454
+ return /*#__PURE__*/React__default.createElement(Container$5, {
10455
+ "data-testid": "password-strength-container"
10456
+ }, /*#__PURE__*/React__default.createElement(Sections, {
10457
+ "data-testid": "password-strength-sections"
10458
+ }, Array.from({
10459
+ length: sections
10460
+ }, function (_section, i) {
10461
+ return /*#__PURE__*/React__default.createElement(Section, {
10462
+ key: i,
10463
+ color: setSectionColor(i),
10464
+ "data-testid": setSectionDataTestId(i)
10465
+ });
10466
+ })), /*#__PURE__*/React__default.createElement(BottomLine, null, /*#__PURE__*/React__default.createElement(Text, {
10467
+ color: textColor,
10468
+ "data-testid": "password-strength-text"
10469
+ }, /*#__PURE__*/React__default.createElement(AltHeader, {
10470
+ level: 6
10471
+ }, text)), /*#__PURE__*/React__default.createElement(LabelText, {
10472
+ color: strengthLabelColor,
10473
+ "data-testid": "password-strength-label"
10474
+ }, /*#__PURE__*/React__default.createElement(Overline, {
10475
+ level: 2
10476
+ }, strengthLabel))));
10477
+ };
10478
+
10479
+ var _templateObject$1i, _templateObject2$W, _templateObject3$N, _templateObject4$C, _templateObject5$t;
10480
+ var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
10481
+ var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$W || (_templateObject2$W = /*#__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"])), exports.Colors.LightGrey);
10482
+ var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$N || (_templateObject3$N = /*#__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"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey);
10483
+ var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$C || (_templateObject4$C = /*#__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 text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), exports.Colors.Black, function (_ref) {
10331
10484
  var isActive = _ref.isActive;
10332
10485
  return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
10333
10486
  }, exports.Colors.MidGrey);
10334
- var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$s || (_templateObject5$s = /*#__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) {
10487
+ var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$t || (_templateObject5$t = /*#__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) {
10335
10488
  var isOpen = _ref2.isOpen;
10336
10489
  return isOpen ? 'block' : 'none';
10337
10490
  }, exports.Colors.White, exports.Colors.DarkGrey, MenuItem$1);
@@ -10501,106 +10654,8 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
10501
10654
  });
10502
10655
  };
10503
10656
 
10504
- var _templateObject$1h, _templateObject2$W, _templateObject3$N, _templateObject4$C, _templateObject5$t, _templateObject6$m;
10505
- var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
10506
- var Sections = /*#__PURE__*/styled__default.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
10507
- var Section = /*#__PURE__*/styled__default.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
10508
- var color = _ref.color;
10509
- return "var(--base-color-" + color + ")";
10510
- });
10511
- var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
10512
- var Text = /*#__PURE__*/styled__default.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
10513
- var color = _ref2.color;
10514
- return "var(--base-color-" + color + ")";
10515
- });
10516
- var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
10517
- var color = _ref3.color;
10518
- return "var(--base-color-" + color + ")";
10519
- });
10520
-
10521
- /**
10522
- * Password strength indicator component.
10523
- * This renders some number of lines (6 by default)
10524
- * which should become active when the user improves
10525
- * the strength of the entered password.
10526
- *
10527
- * ## Sections
10528
- * To set number of sections it should be passed
10529
- * as `sections` prop.
10530
- *
10531
- * ## Active section
10532
- * To set number of active sections it should be passed
10533
- * as `activeSections` prop.
10534
- *
10535
- * ## Colors
10536
- * Color of every element can be controlled by properties:
10537
- * `sectionsColor`, `activeSectionsColor`,
10538
- * `textColor`, `strengthLabelColor`.
10539
- *
10540
- * ## Text
10541
- * `text` prop is used to render some message.
10542
- * For example error (together with proper red color)
10543
- * or some password requirement. It can be empty.
10544
- *
10545
- * ## Strength label
10546
- * `strengthLabel` prop is used to render strength characteristic
10547
- * of entered password. For example: `weak`, `normal`, `strong`, etc.
10548
- * It can be empty.
10549
- */
10550
-
10551
- var PasswordStrength = function PasswordStrength(_ref) {
10552
- var _ref$sections = _ref.sections,
10553
- sections = _ref$sections === void 0 ? 6 : _ref$sections,
10554
- _ref$activeSections = _ref.activeSections,
10555
- activeSections = _ref$activeSections === void 0 ? 0 : _ref$activeSections,
10556
- _ref$sectionsColor = _ref.sectionsColor,
10557
- sectionsColor = _ref$sectionsColor === void 0 ? exports.Colors.MidGrey : _ref$sectionsColor,
10558
- _ref$activeSectionsCo = _ref.activeSectionsColor,
10559
- activeSectionsColor = _ref$activeSectionsCo === void 0 ? exports.Colors.Black : _ref$activeSectionsCo,
10560
- _ref$text = _ref.text,
10561
- text = _ref$text === void 0 ? '' : _ref$text,
10562
- _ref$textColor = _ref.textColor,
10563
- textColor = _ref$textColor === void 0 ? exports.Colors.Black : _ref$textColor,
10564
- _ref$strengthLabel = _ref.strengthLabel,
10565
- strengthLabel = _ref$strengthLabel === void 0 ? '' : _ref$strengthLabel,
10566
- _ref$strengthLabelCol = _ref.strengthLabelColor,
10567
- strengthLabelColor = _ref$strengthLabelCol === void 0 ? exports.Colors.Black : _ref$strengthLabelCol;
10568
-
10569
- var setSectionColor = function setSectionColor(index) {
10570
- return index < activeSections ? activeSectionsColor : sectionsColor;
10571
- };
10572
-
10573
- var setSectionDataTestId = function setSectionDataTestId(index) {
10574
- return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
10575
- };
10576
-
10577
- return /*#__PURE__*/React__default.createElement(Container$5, {
10578
- "data-testid": "password-strength-container"
10579
- }, /*#__PURE__*/React__default.createElement(Sections, {
10580
- "data-testid": "password-strength-sections"
10581
- }, Array.from({
10582
- length: sections
10583
- }, function (_section, i) {
10584
- return /*#__PURE__*/React__default.createElement(Section, {
10585
- key: i,
10586
- color: setSectionColor(i),
10587
- "data-testid": setSectionDataTestId(i)
10588
- });
10589
- })), /*#__PURE__*/React__default.createElement(BottomLine, null, /*#__PURE__*/React__default.createElement(Text, {
10590
- color: textColor,
10591
- "data-testid": "password-strength-text"
10592
- }, /*#__PURE__*/React__default.createElement(AltHeader, {
10593
- level: 6
10594
- }, text)), /*#__PURE__*/React__default.createElement(LabelText, {
10595
- color: strengthLabelColor,
10596
- "data-testid": "password-strength-label"
10597
- }, /*#__PURE__*/React__default.createElement(Overline, {
10598
- level: 2
10599
- }, strengthLabel))));
10600
- };
10601
-
10602
- var _templateObject$1i, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$u, _templateObject6$n, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7;
10603
- var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
10657
+ var _templateObject$1j, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$u, _templateObject6$n, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7, _templateObject11$4;
10658
+ var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
10604
10659
  var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
10605
10660
  var Wrapper$7 = /*#__PURE__*/styled__default.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
10606
10661
  var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-subtitle-2);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n padding: 30px 30px 30px 0;\n text-align: left;\n text-transform: uppercase;\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 padding: 20px 20px 20px 0;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
@@ -10619,14 +10674,73 @@ var PageNumber$1 = /*#__PURE__*/styled__default.button(_templateObject8$c || (_t
10619
10674
  });
10620
10675
  var Next = /*#__PURE__*/styled__default.span(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n width: 25px;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n span {\n height: 1.5em;\n svg > path {\n fill: var(--base-color-dark-grey);\n }\n }\n"])));
10621
10676
  var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject10$7 || (_templateObject10$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 0 0 24px 0;\n\n div:hover {\n background-color: var(--base-color-light-grey);\n }\n\n > div > div {\n background-color: var(--base-color-light-grey);\n }\n\n svg path {\n fill: var(--base-color-black) !important;\n }\n"])));
10677
+ var AriaDescription = /*#__PURE__*/styled__default.span(_templateObject11$4 || (_templateObject11$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
10622
10678
 
10623
- var Table = function Table(_ref) {
10624
- var columns = _ref.columns,
10625
- headings = _ref.headings,
10626
- children = _ref.children,
10627
- lineColors = _ref.lineColors,
10628
- rowsPerPage = _ref.rowsPerPage,
10629
- pagination = _ref.pagination;
10679
+ var Content = function Content(_ref) {
10680
+ var content = _ref.content;
10681
+ return typeof content === 'string' ? /*#__PURE__*/React__default.createElement("div", {
10682
+ dangerouslySetInnerHTML: {
10683
+ __html: content
10684
+ }
10685
+ }) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, content);
10686
+ };
10687
+
10688
+ var Cell = function Cell(_ref2) {
10689
+ var cell = _ref2.cell,
10690
+ cellIndex = _ref2.cellIndex,
10691
+ columns = _ref2.columns;
10692
+ return /*#__PURE__*/React__default.createElement(TableCell, {
10693
+ key: cellIndex,
10694
+ columns: columns,
10695
+ role: "gridcell"
10696
+ }, /*#__PURE__*/React__default.createElement(Content, {
10697
+ content: cell
10698
+ }));
10699
+ };
10700
+
10701
+ var Row = function Row(_ref3) {
10702
+ var row = _ref3.row,
10703
+ rowIndex = _ref3.rowIndex,
10704
+ columns = _ref3.columns,
10705
+ lineColor = _ref3.lineColor;
10706
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
10707
+ key: rowIndex
10708
+ }, /*#__PURE__*/React__default.createElement("tr", null, row.map(function (cell, index) {
10709
+ return /*#__PURE__*/React__default.createElement(Cell, {
10710
+ key: index,
10711
+ cell: cell,
10712
+ cellIndex: index,
10713
+ columns: columns
10714
+ });
10715
+ })), /*#__PURE__*/React__default.createElement("tr", {
10716
+ "aria-hidden": "true"
10717
+ }, /*#__PURE__*/React__default.createElement("td", {
10718
+ colSpan: columns,
10719
+ "aria-hidden": "true"
10720
+ }, /*#__PURE__*/React__default.createElement(LineContainer$1, {
10721
+ lineColor: lineColor
10722
+ }))));
10723
+ };
10724
+
10725
+ var scrollTable = function scrollTable(tableRef, direction) {
10726
+ if (tableRef.current) {
10727
+ var currentScroll = tableRef.current.scrollLeft;
10728
+ var scrollAmount = direction === 'left' ? -300 : 300;
10729
+ tableRef.current.scrollTo({
10730
+ left: currentScroll + scrollAmount,
10731
+ behavior: 'smooth'
10732
+ });
10733
+ }
10734
+ };
10735
+
10736
+ var Table = function Table(_ref4) {
10737
+ var columns = _ref4.columns,
10738
+ headings = _ref4.headings,
10739
+ children = _ref4.children,
10740
+ lineColors = _ref4.lineColors,
10741
+ rowsPerPage = _ref4.rowsPerPage,
10742
+ pagination = _ref4.pagination,
10743
+ description = _ref4.description;
10630
10744
 
10631
10745
  var _useState = React.useState(0),
10632
10746
  currentPage = _useState[0],
@@ -10636,121 +10750,71 @@ var Table = function Table(_ref) {
10636
10750
  showScrollButtons = _useState2[0],
10637
10751
  setShowScrollButtons = _useState2[1];
10638
10752
 
10639
- var Content = function Content(_ref2) {
10640
- var content = _ref2.content;
10641
- return typeof content === 'string' ? /*#__PURE__*/React__default.createElement("div", {
10642
- dangerouslySetInnerHTML: {
10643
- __html: content
10644
- }
10645
- }) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, content);
10646
- };
10647
-
10648
- var Cell = function Cell(_ref3) {
10649
- var cell = _ref3.cell,
10650
- cellIndex = _ref3.cellIndex,
10651
- columns = _ref3.columns;
10652
- return /*#__PURE__*/React__default.createElement(TableCell, {
10653
- key: cellIndex,
10654
- columns: columns
10655
- }, /*#__PURE__*/React__default.createElement(Content, {
10656
- content: cell
10657
- }));
10658
- };
10659
-
10660
- var Row = function Row(_ref4) {
10661
- var row = _ref4.row,
10662
- rowIndex = _ref4.rowIndex,
10663
- columns = _ref4.columns,
10664
- lineColor = _ref4.lineColor;
10665
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
10666
- key: rowIndex
10667
- }, /*#__PURE__*/React__default.createElement("tr", null, row.map(function (cell, index) {
10668
- return /*#__PURE__*/React__default.createElement(Cell, {
10669
- key: index,
10670
- cell: cell,
10671
- cellIndex: index,
10672
- columns: columns
10673
- });
10674
- })), /*#__PURE__*/React__default.createElement("tr", null, /*#__PURE__*/React__default.createElement("td", {
10675
- colSpan: columns
10676
- }, /*#__PURE__*/React__default.createElement(LineContainer$1, {
10677
- lineColor: lineColor,
10678
- role: "presentation"
10679
- }))));
10680
- };
10681
-
10682
10753
  var lineColor = lineColors != null ? lineColors : exports.Colors.Cinema;
10683
10754
  var tableRef = React.useRef(null);
10684
- React.useEffect(function () {
10685
- if (tableRef.current) {
10686
- tableRef.current.scrollTo(0, 0);
10687
- }
10688
- }, [children]);
10689
-
10690
- var horizontalScroll = function horizontalScroll() {
10691
- if (tableRef.current) {
10692
- setShowScrollButtons(tableRef.current.scrollWidth > tableRef.current.clientWidth);
10693
- }
10694
- };
10755
+ React.useLayoutEffect(function () {
10756
+ var horizontalScroll = function horizontalScroll() {
10757
+ if (tableRef.current) {
10758
+ setShowScrollButtons(tableRef.current.scrollWidth > tableRef.current.clientWidth);
10759
+ }
10760
+ };
10695
10761
 
10696
- React.useEffect(function () {
10697
10762
  horizontalScroll();
10698
10763
  window.addEventListener('resize', horizontalScroll);
10764
+ console.log('~~~ horizontal Scroll ~~~');
10699
10765
  return function () {
10700
10766
  return window.removeEventListener('resize', horizontalScroll);
10701
10767
  };
10702
10768
  }, []);
10703
-
10704
- var scrollTable = function scrollTable(direction) {
10705
- if (tableRef.current) {
10706
- var currentScroll = tableRef.current.scrollLeft;
10707
- var scrollAmount = direction === 'left' ? -300 : 300;
10708
- tableRef.current.scrollTo({
10709
- left: currentScroll + scrollAmount,
10710
- behavior: 'smooth'
10711
- });
10712
- }
10713
- };
10714
-
10715
- var totalRows = Array.isArray(children) ? children.length : 0;
10769
+ var totalRows = Array.isArray(children) ? children.length + 1 : 1;
10716
10770
  var totalPages = pagination ? Math.ceil(totalRows / rowsPerPage) : 1;
10717
- var currentRows = pagination ? Array.isArray(children) ? children.slice(currentPage * rowsPerPage, (currentPage + 1) * rowsPerPage) : [] : children;
10718
10771
  var pageNumbers = Array.from({
10719
10772
  length: totalPages
10720
10773
  }, function (_, i) {
10721
10774
  return i;
10722
10775
  });
10723
10776
  var reducedPageNumbers = reducePages(pageNumbers, currentPage);
10777
+ var currentRows = pagination ? Array.isArray(children) ? children.slice(currentPage * rowsPerPage, (currentPage + 1) * rowsPerPage) : [] : children;
10778
+ var visibleRows = pagination ? Array.isArray(currentRows) ? currentRows.length + 1 : 0 : totalRows;
10724
10779
  return /*#__PURE__*/React__default.createElement(Wrapper$7, null, showScrollButtons && /*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
10725
10780
  onClickPrev: function onClickPrev() {
10726
- return scrollTable('left');
10781
+ return scrollTable(tableRef, 'left');
10727
10782
  },
10728
10783
  onClickNext: function onClickNext() {
10729
- return scrollTable('right');
10784
+ return scrollTable(tableRef, 'right');
10730
10785
  }
10731
10786
  })), /*#__PURE__*/React__default.createElement(Container$6, {
10732
10787
  role: "table",
10733
10788
  tabIndex: 0,
10734
- ref: tableRef
10735
- }, /*#__PURE__*/React__default.createElement(TableContainer, null, /*#__PURE__*/React__default.createElement("thead", null, /*#__PURE__*/React__default.createElement("tr", null, /*#__PURE__*/React__default.createElement("td", {
10736
- colSpan: columns
10737
- }, /*#__PURE__*/React__default.createElement(LineContainer$1, {
10738
- lineColor: lineColor,
10739
- role: "presentation"
10740
- })))), /*#__PURE__*/React__default.createElement("thead", null, /*#__PURE__*/React__default.createElement("tr", null, headings && headings.map(function (heading, index) {
10789
+ ref: tableRef,
10790
+ "aria-rowcount": totalRows,
10791
+ "aria-colcount": columns
10792
+ }, /*#__PURE__*/React__default.createElement(AriaDescription, {
10793
+ id: "table-description"
10794
+ }, description, " visible rows: ", visibleRows), /*#__PURE__*/React__default.createElement(TableContainer, null, /*#__PURE__*/React__default.createElement("thead", {
10795
+ role: "rowgroup"
10796
+ }, ' ', /*#__PURE__*/React__default.createElement("tr", {
10797
+ role: "columnheader"
10798
+ }, headings && headings.map(function (heading, index) {
10741
10799
  return /*#__PURE__*/React__default.createElement(TableHeader, {
10742
10800
  key: index,
10743
10801
  role: "columnheader",
10802
+ scope: "col",
10744
10803
  columns: columns
10745
10804
  }, /*#__PURE__*/React__default.createElement(Content, {
10746
10805
  content: heading
10747
10806
  }));
10748
- }))), /*#__PURE__*/React__default.createElement("tr", null, /*#__PURE__*/React__default.createElement("td", {
10749
- colSpan: columns
10807
+ })), /*#__PURE__*/React__default.createElement("tr", {
10808
+ "aria-hidden": "true"
10809
+ }, ' ', /*#__PURE__*/React__default.createElement("td", {
10810
+ colSpan: columns,
10811
+ "aria-hidden": "true"
10750
10812
  }, /*#__PURE__*/React__default.createElement(LineContainer$1, {
10751
10813
  lineColor: lineColor,
10752
10814
  role: "presentation"
10753
- }))), /*#__PURE__*/React__default.createElement("tbody", null, Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
10815
+ })))), /*#__PURE__*/React__default.createElement("tbody", {
10816
+ role: "rowgroup"
10817
+ }, ' ', Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
10754
10818
  return /*#__PURE__*/React__default.createElement(Row, {
10755
10819
  key: rowIndex,
10756
10820
  row: row,
@@ -10758,7 +10822,9 @@ var Table = function Table(_ref) {
10758
10822
  columns: columns,
10759
10823
  lineColor: lineColor
10760
10824
  });
10761
- }))), pagination && totalPages > 1 && /*#__PURE__*/React__default.createElement(Pagination$1, null, currentPage > 0 && /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber$1, {
10825
+ }))), pagination && totalPages > 1 && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(AriaDescription, {
10826
+ id: "pagination-description"
10827
+ }, "Table pagination: current page ", currentPage + 1, " of ", totalPages), /*#__PURE__*/React__default.createElement(Pagination$1, null, currentPage > 0 && /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber$1, {
10762
10828
  key: "previous-page",
10763
10829
  onClick: function onClick() {
10764
10830
  return setCurrentPage(currentPage - 1);
@@ -10793,7 +10859,7 @@ var Table = function Table(_ref) {
10793
10859
  }, /*#__PURE__*/React__default.createElement(Next, null, /*#__PURE__*/React__default.createElement(Icon, {
10794
10860
  iconName: "DropdownArrow",
10795
10861
  direction: "up"
10796
- })))))));
10862
+ }))))))));
10797
10863
  };
10798
10864
 
10799
10865
  var UpsellSection = function UpsellSection(_ref) {
@@ -10884,8 +10950,8 @@ var LiveChat = function LiveChat() {
10884
10950
  });
10885
10951
  };
10886
10952
 
10887
- var _templateObject$1j, _templateObject2$Y;
10888
- var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
10953
+ var _templateObject$1k, _templateObject2$Y;
10954
+ var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
10889
10955
  var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
10890
10956
  var hideBottomBorder = _ref.hideBottomBorder;
10891
10957
  return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-lightgrey);';
@@ -10914,8 +10980,8 @@ var StickyBar = function StickyBar(_ref) {
10914
10980
  }, children)));
10915
10981
  };
10916
10982
 
10917
- var _templateObject$1k, _templateObject2$Z, _templateObject3$P, _templateObject4$E;
10918
- var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
10983
+ var _templateObject$1l, _templateObject2$Z, _templateObject3$P, _templateObject4$E;
10984
+ var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
10919
10985
  var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
10920
10986
  var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
10921
10987
  var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
@@ -11038,8 +11104,8 @@ var ModalWindow = function ModalWindow(_ref) {
11038
11104
  })), /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, children))), /*#__PURE__*/React__default.createElement(ScrollLock, null)));
11039
11105
  };
11040
11106
 
11041
- var _templateObject$1l;
11042
- var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
11107
+ var _templateObject$1m;
11108
+ var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
11043
11109
  var theme = _ref.theme;
11044
11110
  return theme.colors.primary;
11045
11111
  }, function (_ref2) {
@@ -12000,6 +12066,7 @@ exports.Footer = Footer;
12000
12066
  exports.GlobalStyles = GlobalStyles;
12001
12067
  exports.Grid = Grid;
12002
12068
  exports.GridItem = GridItem;
12069
+ exports.GridItemLegacy = GridItemLegacy;
12003
12070
  exports.Header = Header;
12004
12071
  exports.Icon = Icon;
12005
12072
  exports.ImageAspectRatioWrapper = ImageAspectRatioWrapper;