@sunrise-upc/sales-static-components 3.7.8-beta.3 → 3.7.9

package/dist/esm/components/StageTeaserV3/PromoBubble/PromoBubble.css

@@ -0,0 +1,338 @@
+.PromoBubble-module__promoBubbleHolder___hDOD4 {
+  position: absolute !important;
+  z-index: 20 !important;
+  font-feature-settings: "liga" off, "clig" off;
+  --primary-bubble-size: 160px;
+  --secondary-bubble-size: 120px;
+  --secondary-bubble-top: 114px;
+  --secondary-bubble-left: 84px;
+  --cluster-width: 204px;
+  --cluster-height: 234px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 4px;
+  --promo-percent-padding-x: 10px;
+  --primary-top-text-size: 18px;
+  --primary-top-text-line-height: 20px;
+  --promo-text-size: 18px;
+  --promo-text-line-height: 20px;
+  --secondary-promo-text-size: 14px;
+  --secondary-promo-text-line-height: 16px;
+  --promo-bubble-edge-offset: 16px;
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4 {
+    --promo-bubble-edge-offset: 8px;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeLarge___E-R25 {
+  --primary-bubble-size: 160px;
+  --secondary-bubble-size: 120px;
+  --secondary-bubble-top: 114px;
+  --secondary-bubble-left: 84px;
+  --cluster-width: 204px;
+  --cluster-height: 234px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 6px;
+  --promo-percent-padding-x: 10px;
+  --primary-top-text-size: 18px;
+  --primary-top-text-line-height: 20px;
+  --promo-text-size: 18px;
+  --promo-text-line-height: 20px;
+  --secondary-promo-text-size: 14px;
+  --secondary-promo-text-line-height: 16px;
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeLarge___E-R25 {
+    --primary-bubble-size: 120px;
+    --secondary-bubble-size: 90px;
+    --secondary-bubble-top: 86px;
+    --secondary-bubble-left: 63px;
+    --cluster-width: 153px;
+    --cluster-height: 176px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 3px;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeLarge___E-R25 {
+    --primary-bubble-size: 94px;
+    --secondary-bubble-size: 70px;
+    --secondary-bubble-top: 67px;
+    --secondary-bubble-left: 49px;
+    --cluster-width: 119px;
+    --cluster-height: 137px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 0;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeMedium___SD-mD {
+  --primary-bubble-size: 120px;
+  --secondary-bubble-size: 90px;
+  --secondary-bubble-top: 86px;
+  --secondary-bubble-left: 63px;
+  --cluster-width: 153px;
+  --cluster-height: 176px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 3px;
+  --promo-percent-padding-x: 6px;
+  --primary-top-text-size: 14px;
+  --primary-top-text-line-height: 16px;
+  --promo-text-size: 14px;
+  --promo-text-line-height: 16px;
+  --secondary-promo-text-size: 12px;
+  --secondary-promo-text-line-height: 13px;
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeMedium___SD-mD {
+    --primary-bubble-size: 90px;
+    --secondary-bubble-size: 68px;
+    --secondary-bubble-top: 65px;
+    --secondary-bubble-left: 47px;
+    --cluster-width: 115px;
+    --cluster-height: 133px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 2px;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeMedium___SD-mD {
+    --primary-bubble-size: 70px;
+    --secondary-bubble-size: 53px;
+    --secondary-bubble-top: 51px;
+    --secondary-bubble-left: 37px;
+    --cluster-width: 90px;
+    --cluster-height: 104px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 0;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeSmall___B2EAm {
+  --primary-bubble-size: 80px;
+  --secondary-bubble-size: 60px;
+  --secondary-bubble-top: 57px;
+  --secondary-bubble-left: 42px;
+  --cluster-width: 102px;
+  --cluster-height: 117px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 2px;
+  --promo-percent-padding-x: 4px;
+  --primary-top-text-size: 10px;
+  --primary-top-text-line-height: 11px;
+  --promo-text-size: 10px;
+  --promo-text-line-height: 11px;
+  --secondary-promo-text-size: 9px;
+  --secondary-promo-text-line-height: 10px;
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeSmall___B2EAm {
+    --primary-bubble-size: 60px;
+    --secondary-bubble-size: 45px;
+    --secondary-bubble-top: 43px;
+    --secondary-bubble-left: 32px;
+    --cluster-width: 77px;
+    --cluster-height: 88px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 1px;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeSmall___B2EAm {
+    --primary-bubble-size: 60px;
+    --secondary-bubble-size: 45px;
+    --secondary-bubble-top: 43px;
+    --secondary-bubble-left: 32px;
+    --cluster-width: 77px;
+    --cluster-height: 88px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 0;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__primaryOnlyBubble___QyYeE {
+  --cluster-width: var(--primary-bubble-size);
+  --cluster-height: var(--primary-bubble-size);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopLeft___Es3Bw, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopRight___sFKo0, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomLeft___9sckM, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomRight___I3l3q {
+  width: var(--cluster-width);
+  height: var(--cluster-height);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopLeft___Es3Bw, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopRight___sFKo0 {
+  top: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomLeft___9sckM, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomRight___I3l3q {
+  bottom: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopLeft___Es3Bw, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomLeft___9sckM {
+  left: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopRight___sFKo0, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomRight___I3l3q {
+  right: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+  top: var(--bubble-y-wide, 0);
+  left: var(--bubble-x-wide, 0);
+  width: var(--cluster-width);
+  height: var(--cluster-height);
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+    top: var(--bubble-y-desktop);
+    left: var(--bubble-x-desktop);
+  }
+}
+@media only screen and (min-width: 768px) and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+    top: var(--bubble-y-tab);
+    left: var(--bubble-x-tab);
+  }
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+    top: var(--bubble-y-mobile);
+    left: var(--bubble-x-mobile);
+  }
+}
+
+.PromoBubble-module__promoBubble___BXY2r {
+  display: flex;
+  text-align: center;
+  padding: 0;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: var(--bubble-gap);
+  flex-shrink: 0;
+  border-radius: 50%;
+  position: absolute;
+}
+
+.PromoBubble-module__primaryPromoBubble___xp3yo {
+  width: var(--primary-bubble-size);
+  height: var(--primary-bubble-size);
+  left: var(--primary-bubble-left);
+  background: var(--primary-colour-ice-white, #ffffff);
+  z-index: 1;
+}
+
+.PromoBubble-module__primaryWithSecondaryBubble___9Pj2e {
+  background: var(--primary-colour-ice-white, #ffffff);
+  z-index: 1;
+}
+
+.PromoBubble-module__secondaryPromoBubble___-xl08 {
+  width: var(--secondary-bubble-size);
+  height: var(--secondary-bubble-size);
+  top: var(--secondary-bubble-top);
+  left: var(--secondary-bubble-left);
+  color: #ffffff;
+  background: var(--primary-colour-grey-dusk-grey-600, #3d3935);
+}
+
+.PromoBubble-module__primaryTopText___iFsCC {
+  font-size: var(--primary-top-text-size);
+  line-height: var(--primary-top-text-line-height);
+  font-weight: 400;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__primaryTopText___iFsCC {
+    font-size: 14px;
+  }
+}
+
+.PromoBubble-module__promoPercent___X296J {
+  font-size: 52px;
+  line-height: 1em;
+  font-weight: 700;
+  padding: 0 var(--promo-percent-padding-x);
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__promoPercent___X296J {
+    font-size: 24px;
+    line-height: 32px;
+  }
+}
+@media only screen and (min-width: 768px) and (max-width: 1023px) {
+  .PromoBubble-module__promoPercent___X296J {
+    font-size: 42px;
+  }
+}
+@media only screen and (min-width: 2000px) {
+  .PromoBubble-module__promoPercent___X296J {
+    font-size: 42px;
+  }
+}
+
+.PromoBubble-module__strikethroughPrimary___DyGUf {
+  position: relative;
+  isolation: isolate;
+}
+
+.PromoBubble-module__strikethroughPrimary___DyGUf::after {
+  content: "";
+  position: absolute;
+  left: 10px;
+  right: 10px;
+  top: 50%;
+  height: 2px;
+  transform: translateY(-50%);
+  background: var(--strike-color, currentColor);
+  pointer-events: none;
+}
+
+.PromoBubble-module__strikethroughPrimaryDiagonal___Y1Z3B {
+  position: relative;
+  isolation: isolate;
+}
+
+.PromoBubble-module__strikethroughPrimaryDiagonal___Y1Z3B::after {
+  content: "";
+  position: absolute;
+  left: 10px;
+  right: 10px;
+  top: 0;
+  bottom: 0;
+  --strike-thickness: clamp(1px, 0.08em, 3px);
+  --strike-feather: clamp(0.4px, 0.03em, 1px);
+  background: linear-gradient(to top left, transparent calc(50% - var(--strike-thickness) - var(--strike-feather)), color-mix(in srgb, var(--strike-color, currentColor) 0%, transparent) calc(50% - var(--strike-thickness)), var(--strike-color, currentColor) 50%, color-mix(in srgb, var(--strike-color, currentColor) 0%, transparent) calc(50% + var(--strike-thickness)), transparent calc(50% + var(--strike-thickness) + var(--strike-feather)));
+  opacity: 0.95;
+  pointer-events: none;
+}
+
+.PromoBubble-module__promoText___WEaSM {
+  font-size: var(--promo-text-size);
+  line-height: var(--promo-text-line-height);
+  font-weight: 500;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__promoText___WEaSM {
+    font-size: 14px;
+  }
+}
+
+.PromoBubble-module__secondaryPromoPercent___Lqu2P {
+  font-size: 34px;
+  line-height: 1em;
+  font-weight: 700;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__secondaryPromoPercent___Lqu2P {
+    font-size: 21px;
+  }
+}
+@media only screen and (min-width: 768px) and (max-width: 1023px) {
+  .PromoBubble-module__secondaryPromoPercent___Lqu2P {
+    font-size: 26px;
+  }
+}
+
+.PromoBubble-module__secondaryPromoText___N7tCv {
+  overflow-wrap: break-word;
+  font-size: var(--secondary-promo-text-size);
+  line-height: var(--secondary-promo-text-line-height);
+  font-weight: 500;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__secondaryPromoText___N7tCv {
+    font-size: 12px;
+    line-height: 12px;
+  }
+}

package/dist/esm/components/StageTeaserV3/PromoBubble/PromoBubble.js

@@ -0,0 +1,3 @@
+import './PromoBubble.css';
+import{jsxs as o,jsx as i}from"react/jsx-runtime";import{useRef as l,useEffect as e}from"react";import r from"fitty";import n from"./PromoBubble.module.scss.js";const t=({content:t})=>{var d,u,s,a,m,c,v,b,p,y,x,g,h,T,S,z,f,P,j;const $=l(null),O=l(null),k=l(null),B=null!==(d=null==t?void 0:t.bubbleSize)&&void 0!==d?d:"large",N=!!(null===(u=null==t?void 0:t.primaryTopText)||void 0===u?void 0:u.length)||!!(null===(s=null==t?void 0:t.primarytext)||void 0===s?void 0:s.length)||!!(null===(a=null==t?void 0:t.secondarytext)||void 0===a?void 0:a.length),C=!!(null===(m=null==t?void 0:t.secondPrimaryText)||void 0===m?void 0:m.length)||!!(null===(c=null==t?void 0:t.secondSecondaryText)||void 0===c?void 0:c.length),A="string"==typeof(null==t?void 0:t.strikethroughColor)?null==t?void 0:t.strikethroughColor:null===(v=null==t?void 0:t.strikethroughColor)||void 0===v?void 0:v.color,L="small"===B?{primaryTopText:{minSize:8,maxSize:12},primaryText:{minSize:12,maxSize:26},secondaryPrimaryText:{minSize:10,maxSize:18}}:"medium"===B?{primaryTopText:{minSize:10,maxSize:14},primaryText:{minSize:14,maxSize:38},secondaryPrimaryText:{minSize:10,maxSize:26}}:{primaryTopText:{minSize:12,maxSize:18},primaryText:{minSize:16,maxSize:52},secondaryPrimaryText:{minSize:12,maxSize:34}},X=o=>{if(null==o||""===o)return;if("number"==typeof o)return`${o}px`;const i=o.trim();return/^-?\d+(\.\d+)?$/.test(i)?`${i}px`:i},Y=null!==(b=X(null==t?void 0:t.wideX))&&void 0!==b?b:24,w=null!==(p=X(null==t?void 0:t.wideY))&&void 0!==p?p:24,R=null!==(y=X(null==t?void 0:t.desktopX))&&void 0!==y?y:24,D=null!==(x=X(null==t?void 0:t.desktopY))&&void 0!==x?x:24,E=null!==(g=X(null==t?void 0:t.tabX))&&void 0!==g?g:16,H=null!==(h=X(null==t?void 0:t.tabY))&&void 0!==h?h:16,M=null!==(T=X(null==t?void 0:t.mobileX))&&void 0!==T?T:16,W=null!==(S=X(null==t?void 0:t.mobileY))&&void 0!==S?S:16,q="top-left"===(null==t?void 0:t.position)?n.posTopLeft:"top-right"===(null==t?void 0:t.position)?n.posTopRight:"bottom-left"===(null==t?void 0:t.position)?n.posBottomLeft:"bottom-right"===(null==t?void 0:t.position)?n.posBottomRight:"xy-pos"===(null==t?void 0:t.position)?n.posXY:"",F="small"===B?n.sizeSmall:"medium"===B?n.sizeMedium:n.sizeLarge,G=C?"":n.primaryOnlyBubble,I=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},Y?{"--bubble-x-wide":Y}:{}),w?{"--bubble-y-wide":w}:{}),R?{"--bubble-x-desktop":R}:{}),D?{"--bubble-y-desktop":D}:{}),E?{"--bubble-x-tab":E}:{}),H?{"--bubble-y-tab":H}:{}),M?{"--bubble-x-mobile":M}:{}),W?{"--bubble-y-mobile":W}:{});return e(()=>{const o=[];if($.current){const i=r($.current,Object.assign(Object.assign({},L.primaryTopText),{multiLine:!0}));Array.isArray(i)?o.push(...i):o.push(i)}if(O.current){const i=r(O.current,Object.assign(Object.assign({},L.primaryText),{multiLine:!0}));Array.isArray(i)?o.push(...i):o.push(i)}if(k.current){const i=r(k.current,Object.assign(Object.assign({},L.secondaryPrimaryText),{multiLine:!0}));Array.isArray(i)?o.push(...i):o.push(i)}return()=>{o.forEach(o=>o.unsubscribe())}},[null==t?void 0:t.primaryTopText,null==t?void 0:t.primarytext,null==t?void 0:t.secondPrimaryText,null==t?void 0:t.secondSecondaryText]),N||C?o("div",{className:`${n.promoBubbleHolder} ${q} ${F} ${G}`,style:I,children:[N&&o("div",{className:`${n.promoBubble} ${n.primaryPromoBubble} ${C?n.primaryWithSecondaryBubble:""} ${q}`,style:{backgroundColor:null===(z=null==t?void 0:t.bgcolor)||void 0===z?void 0:z.color,color:null===(f=null==t?void 0:t.textcolor)||void 0===f?void 0:f.color},children:[(null==t?void 0:t.primaryTopText)?i("div",{className:n.primaryTopText,ref:$,children:null==t?void 0:t.primaryTopText}):null,(null==t?void 0:t.primarytext)?i("div",{className:`${n.promoPercent} ${(null==t?void 0:t.diagonalStrikethroughPrimary)?n.strikethroughPrimaryDiagonal:(null==t?void 0:t.strikethroughPrimary)?n.strikethroughPrimary:""}`,ref:O,style:A?{"--strike-color":A}:void 0,children:null==t?void 0:t.primarytext}):null,(null==t?void 0:t.secondarytext)?i("div",{className:n.promoText,children:null==t?void 0:t.secondarytext}):null]}),C&&o("div",{className:`${n.promoBubble} ${n.secondaryPromoBubble} ${q}`,style:{backgroundColor:null===(P=null==t?void 0:t.secondaryBgColor)||void 0===P?void 0:P.color,color:null===(j=null==t?void 0:t.secondaryTextColor)||void 0===j?void 0:j.color},children:[(null==t?void 0:t.secondPrimaryText)?i("div",{className:n.secondaryPromoPercent,ref:k,children:null==t?void 0:t.secondPrimaryText}):null,(null==t?void 0:t.secondSecondaryText)?i("div",{className:n.secondaryPromoText,children:null==t?void 0:t.secondSecondaryText}):null]})]}):null};export{t as default};
+//# sourceMappingURL=PromoBubble.js.map

package/dist/esm/components/StageTeaserV3/PromoBubble/PromoBubble.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromoBubble.js","sources":["../../../../../../src/components/StageTeaserV3/PromoBubble/PromoBubble.tsx"],"sourcesContent":[null],"names":["PromoBubble","content","primaryTopTextRef","useRef","promoPercentRef","secondaryPromoPercentRef","bubbleSize","_a","hasPrimary","_b","primaryTopText","length","_c","primarytext","_d","secondarytext","hasSecondary","_e","secondPrimaryText","_f","secondSecondaryText","strikeColor","strikethroughColor","_g","color","fittyConfig","minSize","maxSize","primaryText","secondaryPrimaryText","normalizeCoordinate","value","trimmedValue","trim","test","wideX","_h","wideY","_j","desktopX","_k","desktopY","_l","tabX","_m","tabY","_o","mobileX","_p","mobileY","_q","positionClass","position","Styles","posTopLeft","posTopRight","posBottomLeft","posBottomRight","posXY","bubbleSizeClass","sizeSmall","sizeMedium","sizeLarge","clusterClass","primaryOnlyBubble","holderStyle","Object","assign","useEffect","instances","current","instance","fitty","multiLine","Array","isArray","push","forEach","unsubscribe","_jsxs","className","promoBubbleHolder","style","children","promoBubble","primaryPromoBubble","primaryWithSecondaryBubble","backgroundColor","_r","bgcolor","_s","textcolor","_jsx","ref","promoPercent","diagonalStrikethroughPrimary","strikethroughPrimaryDiagonal","strikethroughPrimary","undefined","promoText","secondaryPromoBubble","_t","secondaryBgColor","_u","secondaryTextColor","secondaryPromoPercent","secondaryPromoText"],"mappings":"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"}

package/dist/esm/components/StageTeaserV3/PromoBubble/PromoBubble.module.scss.css

@@ -0,0 +1,338 @@
+.PromoBubble-module__promoBubbleHolder___hDOD4 {
+  position: absolute !important;
+  z-index: 20 !important;
+  font-feature-settings: "liga" off, "clig" off;
+  --primary-bubble-size: 160px;
+  --secondary-bubble-size: 120px;
+  --secondary-bubble-top: 114px;
+  --secondary-bubble-left: 84px;
+  --cluster-width: 204px;
+  --cluster-height: 234px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 4px;
+  --promo-percent-padding-x: 10px;
+  --primary-top-text-size: 18px;
+  --primary-top-text-line-height: 20px;
+  --promo-text-size: 18px;
+  --promo-text-line-height: 20px;
+  --secondary-promo-text-size: 14px;
+  --secondary-promo-text-line-height: 16px;
+  --promo-bubble-edge-offset: 16px;
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4 {
+    --promo-bubble-edge-offset: 8px;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeLarge___E-R25 {
+  --primary-bubble-size: 160px;
+  --secondary-bubble-size: 120px;
+  --secondary-bubble-top: 114px;
+  --secondary-bubble-left: 84px;
+  --cluster-width: 204px;
+  --cluster-height: 234px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 6px;
+  --promo-percent-padding-x: 10px;
+  --primary-top-text-size: 18px;
+  --primary-top-text-line-height: 20px;
+  --promo-text-size: 18px;
+  --promo-text-line-height: 20px;
+  --secondary-promo-text-size: 14px;
+  --secondary-promo-text-line-height: 16px;
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeLarge___E-R25 {
+    --primary-bubble-size: 120px;
+    --secondary-bubble-size: 90px;
+    --secondary-bubble-top: 86px;
+    --secondary-bubble-left: 63px;
+    --cluster-width: 153px;
+    --cluster-height: 176px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 3px;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeLarge___E-R25 {
+    --primary-bubble-size: 94px;
+    --secondary-bubble-size: 70px;
+    --secondary-bubble-top: 67px;
+    --secondary-bubble-left: 49px;
+    --cluster-width: 119px;
+    --cluster-height: 137px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 0;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeMedium___SD-mD {
+  --primary-bubble-size: 120px;
+  --secondary-bubble-size: 90px;
+  --secondary-bubble-top: 86px;
+  --secondary-bubble-left: 63px;
+  --cluster-width: 153px;
+  --cluster-height: 176px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 3px;
+  --promo-percent-padding-x: 6px;
+  --primary-top-text-size: 14px;
+  --primary-top-text-line-height: 16px;
+  --promo-text-size: 14px;
+  --promo-text-line-height: 16px;
+  --secondary-promo-text-size: 12px;
+  --secondary-promo-text-line-height: 13px;
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeMedium___SD-mD {
+    --primary-bubble-size: 90px;
+    --secondary-bubble-size: 68px;
+    --secondary-bubble-top: 65px;
+    --secondary-bubble-left: 47px;
+    --cluster-width: 115px;
+    --cluster-height: 133px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 2px;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeMedium___SD-mD {
+    --primary-bubble-size: 70px;
+    --secondary-bubble-size: 53px;
+    --secondary-bubble-top: 51px;
+    --secondary-bubble-left: 37px;
+    --cluster-width: 90px;
+    --cluster-height: 104px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 0;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeSmall___B2EAm {
+  --primary-bubble-size: 80px;
+  --secondary-bubble-size: 60px;
+  --secondary-bubble-top: 57px;
+  --secondary-bubble-left: 42px;
+  --cluster-width: 102px;
+  --cluster-height: 117px;
+  --primary-bubble-left: 0px;
+  --bubble-gap: 2px;
+  --promo-percent-padding-x: 4px;
+  --primary-top-text-size: 10px;
+  --primary-top-text-line-height: 11px;
+  --promo-text-size: 10px;
+  --promo-text-line-height: 11px;
+  --secondary-promo-text-size: 9px;
+  --secondary-promo-text-line-height: 10px;
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeSmall___B2EAm {
+    --primary-bubble-size: 60px;
+    --secondary-bubble-size: 45px;
+    --secondary-bubble-top: 43px;
+    --secondary-bubble-left: 32px;
+    --cluster-width: 77px;
+    --cluster-height: 88px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 1px;
+  }
+}
+@media only screen and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__sizeSmall___B2EAm {
+    --primary-bubble-size: 60px;
+    --secondary-bubble-size: 45px;
+    --secondary-bubble-top: 43px;
+    --secondary-bubble-left: 32px;
+    --cluster-width: 77px;
+    --cluster-height: 88px;
+    --primary-bubble-left: 0px;
+    --bubble-gap: 0;
+  }
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__primaryOnlyBubble___QyYeE {
+  --cluster-width: var(--primary-bubble-size);
+  --cluster-height: var(--primary-bubble-size);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopLeft___Es3Bw, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopRight___sFKo0, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomLeft___9sckM, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomRight___I3l3q {
+  width: var(--cluster-width);
+  height: var(--cluster-height);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopLeft___Es3Bw, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopRight___sFKo0 {
+  top: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomLeft___9sckM, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomRight___I3l3q {
+  bottom: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopLeft___Es3Bw, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomLeft___9sckM {
+  left: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posTopRight___sFKo0, .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posBottomRight___I3l3q {
+  right: var(--promo-bubble-edge-offset);
+}
+.PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+  top: var(--bubble-y-wide, 0);
+  left: var(--bubble-x-wide, 0);
+  width: var(--cluster-width);
+  height: var(--cluster-height);
+}
+@media only screen and (min-width: 1024px) and (max-width: 1920px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+    top: var(--bubble-y-desktop);
+    left: var(--bubble-x-desktop);
+  }
+}
+@media only screen and (min-width: 768px) and (max-width: 1023px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+    top: var(--bubble-y-tab);
+    left: var(--bubble-x-tab);
+  }
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__promoBubbleHolder___hDOD4.PromoBubble-module__posXY___NGXhl {
+    top: var(--bubble-y-mobile);
+    left: var(--bubble-x-mobile);
+  }
+}
+
+.PromoBubble-module__promoBubble___BXY2r {
+  display: flex;
+  text-align: center;
+  padding: 0;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: var(--bubble-gap);
+  flex-shrink: 0;
+  border-radius: 50%;
+  position: absolute;
+}
+
+.PromoBubble-module__primaryPromoBubble___xp3yo {
+  width: var(--primary-bubble-size);
+  height: var(--primary-bubble-size);
+  left: var(--primary-bubble-left);
+  background: var(--primary-colour-ice-white, #ffffff);
+  z-index: 1;
+}
+
+.PromoBubble-module__primaryWithSecondaryBubble___9Pj2e {
+  background: var(--primary-colour-ice-white, #ffffff);
+  z-index: 1;
+}
+
+.PromoBubble-module__secondaryPromoBubble___-xl08 {
+  width: var(--secondary-bubble-size);
+  height: var(--secondary-bubble-size);
+  top: var(--secondary-bubble-top);
+  left: var(--secondary-bubble-left);
+  color: #ffffff;
+  background: var(--primary-colour-grey-dusk-grey-600, #3d3935);
+}
+
+.PromoBubble-module__primaryTopText___iFsCC {
+  font-size: var(--primary-top-text-size);
+  line-height: var(--primary-top-text-line-height);
+  font-weight: 400;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__primaryTopText___iFsCC {
+    font-size: 14px;
+  }
+}
+
+.PromoBubble-module__promoPercent___X296J {
+  font-size: 52px;
+  line-height: 1em;
+  font-weight: 700;
+  padding: 0 var(--promo-percent-padding-x);
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__promoPercent___X296J {
+    font-size: 24px;
+    line-height: 32px;
+  }
+}
+@media only screen and (min-width: 768px) and (max-width: 1023px) {
+  .PromoBubble-module__promoPercent___X296J {
+    font-size: 42px;
+  }
+}
+@media only screen and (min-width: 2000px) {
+  .PromoBubble-module__promoPercent___X296J {
+    font-size: 42px;
+  }
+}
+
+.PromoBubble-module__strikethroughPrimary___DyGUf {
+  position: relative;
+  isolation: isolate;
+}
+
+.PromoBubble-module__strikethroughPrimary___DyGUf::after {
+  content: "";
+  position: absolute;
+  left: 10px;
+  right: 10px;
+  top: 50%;
+  height: 2px;
+  transform: translateY(-50%);
+  background: var(--strike-color, currentColor);
+  pointer-events: none;
+}
+
+.PromoBubble-module__strikethroughPrimaryDiagonal___Y1Z3B {
+  position: relative;
+  isolation: isolate;
+}
+
+.PromoBubble-module__strikethroughPrimaryDiagonal___Y1Z3B::after {
+  content: "";
+  position: absolute;
+  left: 10px;
+  right: 10px;
+  top: 0;
+  bottom: 0;
+  --strike-thickness: clamp(1px, 0.08em, 3px);
+  --strike-feather: clamp(0.4px, 0.03em, 1px);
+  background: linear-gradient(to top left, transparent calc(50% - var(--strike-thickness) - var(--strike-feather)), color-mix(in srgb, var(--strike-color, currentColor) 0%, transparent) calc(50% - var(--strike-thickness)), var(--strike-color, currentColor) 50%, color-mix(in srgb, var(--strike-color, currentColor) 0%, transparent) calc(50% + var(--strike-thickness)), transparent calc(50% + var(--strike-thickness) + var(--strike-feather)));
+  opacity: 0.95;
+  pointer-events: none;
+}
+
+.PromoBubble-module__promoText___WEaSM {
+  font-size: var(--promo-text-size);
+  line-height: var(--promo-text-line-height);
+  font-weight: 500;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__promoText___WEaSM {
+    font-size: 14px;
+  }
+}
+
+.PromoBubble-module__secondaryPromoPercent___Lqu2P {
+  font-size: 34px;
+  line-height: 1em;
+  font-weight: 700;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__secondaryPromoPercent___Lqu2P {
+    font-size: 21px;
+  }
+}
+@media only screen and (min-width: 768px) and (max-width: 1023px) {
+  .PromoBubble-module__secondaryPromoPercent___Lqu2P {
+    font-size: 26px;
+  }
+}
+
+.PromoBubble-module__secondaryPromoText___N7tCv {
+  overflow-wrap: break-word;
+  font-size: var(--secondary-promo-text-size);
+  line-height: var(--secondary-promo-text-line-height);
+  font-weight: 500;
+}
+@media only screen and (max-width: 767px) {
+  .PromoBubble-module__secondaryPromoText___N7tCv {
+    font-size: 12px;
+    line-height: 12px;
+  }
+}