fansunited-widgets-cdn 0.0.85 → 0.0.86-RC1

package/chunks/OverlayLeadAfterCollection-DnqztPJ5-CpELr0AC.js

@@ -0,0 +1,896 @@
+import { j as n, B as i } from "./main-XP7dqk6g.js";
+import { o as z, Y as $, K as B, J as K, Z as Y, e as A, r as _, C as Z, n as E, m as X, j as G, y as J, u as ee } from "./Portal-BWqqFvVm-TuHZWjxn.js";
+import { v as V, z as ne, W as ie, B as le } from "./NotFoundSkeleton-BYJTzYJR-Be3R34nS.js";
+import { T as j } from "./Button-BV7YIFkS.js";
+const oe = (e) => {
+  var a, r, x;
+  return {
+    // Mobile headline with image background
+    mobileHeadlineWithImage: {
+      display: e.isMobile ? "flex" : "none",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "10px",
+      backgroundImage: `url(${e.finalImage})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      borderTopLeftRadius: "5px",
+      borderTopRightRadius: "5px",
+      position: "relative",
+      minHeight: "210px",
+      overflow: "hidden",
+      height: "auto",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        width: "100%",
+        height: "100%",
+        background: e.imageBackgroundGradient,
+        borderTopLeftRadius: "5px",
+        borderTopRightRadius: "5px"
+      }
+    },
+    // Content inside mobile headline with image
+    mobileHeadlineContent: {
+      zIndex: 1,
+      p: e.spacingScale.xl,
+      gap: e.spacingScale["2xl"],
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between"
+    },
+    // Mobile headline without image
+    mobileHeadlineWithoutImage: {
+      display: e.isMobile ? "flex" : "none",
+      flex: "0.5",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      p: e.spacingScale.lg,
+      gap: e.spacingScale["2xl"]
+    },
+    // Headline typography (mobile with image)
+    headlineTypographyMobileImage: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      fontSize: "0.75em",
+      color: ((a = e.brandingColors) == null ? void 0 : a.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      textAlign: "center"
+    },
+    // Headline typography (mobile without image & desktop)
+    headlineTypography: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      textTransform: "uppercase",
+      fontSize: "0.75em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilySecondary,
+      textAlign: "center"
+    },
+    // Title typography (mobile with image)
+    titleTypographyMobileImage: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      fontSize: "1.5em",
+      letterSpacing: "0.15px",
+      color: ((r = e.brandingColors) == null ? void 0 : r.contentColor) || e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: "center"
+    },
+    // Title typography (mobile without image)
+    titleTypography: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      fontSize: "1.5em",
+      color: e.textColor,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Description typography (mobile with image)
+    descriptionTypographyMobileImage: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      fontSize: "1.25em",
+      letterSpacing: "0.15px",
+      color: ((x = e.brandingColors) == null ? void 0 : x.secondaryColor) || e.darkTextColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: "center"
+    },
+    // Description typography (mobile without image)
+    descriptionTypography: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilyPrimary,
+      textAlign: e.isMobile ? "center" : "left"
+    },
+    // Desktop title typography
+    titleTypographyDesktop: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      fontSize: "1.5em",
+      color: e.textColor,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Desktop description typography
+    descriptionTypographyDesktop: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      color: e.secondaryColor,
+      opacity: e.opacity,
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Image container (left position)
+    imageContainerLeft: {
+      display: e.isMobile ? "none" : "block",
+      flex: "0.3",
+      borderTopLeftRadius: e.borderRadius.md,
+      borderBottomLeftRadius: e.borderRadius.md,
+      overflow: "hidden",
+      height: "auto",
+      position: "relative"
+    },
+    // Image container (right position)
+    imageContainerRight: {
+      display: e.isMobile ? "none" : "block",
+      flex: "0.3",
+      borderTopRightRadius: "5px",
+      borderBottomRightRadius: "5px",
+      overflow: "hidden",
+      height: "auto",
+      position: "relative"
+    },
+    // Main content area
+    mainContentArea: {
+      flex: e.isMobile ? "1" : e.finalImage ? "0.7" : "1",
+      display: e.isMobile ? "none" : "flex",
+      flexDirection: "column",
+      p: e.spacingScale.md,
+      gap: e.spacingScale["2xl"]
+    },
+    // Desktop headline container
+    desktopHeadlineContainer: {
+      display: e.isMobile ? "none" : "flex",
+      flexDirection: "column",
+      gap: e.spacingScale.xl,
+      textAlign: "center"
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    // Sign in button container
+    signInButtonContainer: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      alignItems: "center",
+      gap: e.spacingScale["2xl"]
+    },
+    // Branding container
+    brandingContainer: {
+      px: e.spacingScale.md
+    },
+    image: {
+      width: "100%",
+      height: "100%",
+      objectFit: "cover"
+    }
+  };
+}, ge = ({
+  entity: e,
+  headline: a,
+  finalImage: r,
+  imagePosition: x = "left",
+  signInContent: y,
+  brandingContent: f,
+  rulesDisplay: b
+}) => {
+  var p, u;
+  const s = z(), d = $(), m = B(), h = K().primary, g = K().secondary, v = Y(), c = ((p = e.branding) == null ? void 0 : p.colors) || null, o = ((u = e.branding) == null ? void 0 : u.urls) || null, S = (c == null ? void 0 : c.contentColor) || A().textColor, t = (c == null ? void 0 : c.secondaryColor) || A().textColor, P = (c == null ? void 0 : c.backgroundColor) || A().surfaceVariant, F = "60%", W = _(
+    Z.STANDARD
+  ), l = oe({
+    finalImage: r,
+    spacingScale: m,
+    borderRadius: v,
+    fontFamilyPrimary: h,
+    fontFamilySecondary: g,
+    textColor: S,
+    secondaryColor: t,
+    bgcolor: E(P || ""),
+    opacity: F,
+    brandingColors: c,
+    darkTextColor: d.colorSchemes.dark.textColor,
+    imageBackgroundGradient: W,
+    isMobile: s
+  }), C = X(
+    o == null ? void 0 : o.primaryUrl,
+    o == null ? void 0 : o.secondaryUrl,
+    "image"
+  ), R = (I, T) => typeof window > "u" ? C ? /* @__PURE__ */ n.jsx(
+    i,
+    {
+      component: "a",
+      href: C,
+      target: "_blank",
+      sx: T,
+      children: I
+    }
+  ) : /* @__PURE__ */ n.jsx(i, { sx: T, children: I }) : C ? /* @__PURE__ */ n.jsx(
+    i,
+    {
+      sx: { ...T, cursor: "pointer" },
+      onClick: () => window.open(C, "_blank"),
+      children: I
+    }
+  ) : /* @__PURE__ */ n.jsx(i, { sx: T, children: I });
+  return /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+    r ? R(
+      /* @__PURE__ */ n.jsxs(i, { sx: l.mobileHeadlineContent, children: [
+        /* @__PURE__ */ n.jsxs(i, { children: [
+          /* @__PURE__ */ n.jsxs(i, { sx: { display: "flex", alignItems: "center", gap: m["3xs"] }, children: [
+            /* @__PURE__ */ n.jsx(
+              j,
+              {
+                level: "body-sm",
+                sx: l.headlineTypographyMobileImage,
+                children: a
+              }
+            ),
+            /* @__PURE__ */ n.jsx(
+              V,
+              {
+                rulesDisplay: b,
+                rules: e.rules || ""
+              }
+            )
+          ] }),
+          /* @__PURE__ */ n.jsxs(i, { sx: l.contentContainer, children: [
+            /* @__PURE__ */ n.jsx(
+              j,
+              {
+                level: "body-lg",
+                sx: l.titleTypographyMobileImage,
+                children: e.title
+              }
+            ),
+            /* @__PURE__ */ n.jsx(
+              j,
+              {
+                level: "body-md",
+                sx: l.descriptionTypographyMobileImage,
+                children: G(e.description)
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ n.jsxs(i, { sx: l.signInButtonContainer, children: [
+          y,
+          f
+        ] })
+      ] }),
+      l.mobileHeadlineWithImage
+    ) : /* @__PURE__ */ n.jsxs(i, { sx: l.mobileHeadlineWithoutImage, children: [
+      /* @__PURE__ */ n.jsxs(i, { children: [
+        /* @__PURE__ */ n.jsxs(i, { sx: { display: "flex", alignItems: "center", gap: m["3xs"] }, children: [
+          /* @__PURE__ */ n.jsx(j, { level: "body-sm", sx: l.headlineTypography, children: a }),
+          /* @__PURE__ */ n.jsx(
+            V,
+            {
+              rulesDisplay: b,
+              rules: e.rules || ""
+            }
+          )
+        ] }),
+        /* @__PURE__ */ n.jsxs(i, { sx: l.contentContainer, children: [
+          /* @__PURE__ */ n.jsx(j, { level: "h4", sx: l.titleTypography, children: e.title }),
+          /* @__PURE__ */ n.jsx(j, { level: "body-md", sx: l.descriptionTypography, children: G(e.description) })
+        ] })
+      ] }),
+      /* @__PURE__ */ n.jsxs(i, { sx: l.signInButtonContainer, children: [
+        y,
+        f
+      ] })
+    ] }),
+    r && x === "left" && /* @__PURE__ */ n.jsx(i, { sx: l.imageContainerLeft, children: /* @__PURE__ */ n.jsx("img", { src: r, alt: "Illustration", style: l.image }) }),
+    /* @__PURE__ */ n.jsx(i, { sx: l.mainContentArea, children: /* @__PURE__ */ n.jsxs(i, { sx: l.desktopHeadlineContainer, children: [
+      /* @__PURE__ */ n.jsxs(i, { sx: { display: "flex", flexDirection: "column", alignItems: "center", gap: m["3xs"] }, children: [
+        /* @__PURE__ */ n.jsxs(i, { sx: { display: "flex", alignItems: "center", gap: m["3xs"] }, children: [
+          /* @__PURE__ */ n.jsx(j, { level: "body-sm", sx: l.headlineTypography, children: a }),
+          /* @__PURE__ */ n.jsx(
+            V,
+            {
+              rulesDisplay: b,
+              rules: e.rules || ""
+            }
+          )
+        ] }),
+        /* @__PURE__ */ n.jsxs(i, { sx: l.contentContainer, children: [
+          /* @__PURE__ */ n.jsx(j, { level: "h4", sx: l.titleTypographyDesktop, children: e.title }),
+          /* @__PURE__ */ n.jsx(
+            j,
+            {
+              level: "body-md",
+              sx: l.descriptionTypographyDesktop,
+              children: G(e.description)
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ n.jsx(i, { sx: l.signInButtonContainer, children: y }),
+      f
+    ] }) }),
+    r && x === "right" && /* @__PURE__ */ n.jsx(i, { sx: l.imageContainerRight, children: /* @__PURE__ */ n.jsx("img", { src: r, alt: "Illustration", style: l.image }) })
+  ] });
+}, te = (e) => ({
+  // Main headline section with background image
+  headlineSection: {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "space-between",
+    gap: "10px",
+    flex: "0.5",
+    backgroundImage: `url(${e.finalImage})`,
+    backgroundSize: "cover",
+    backgroundPosition: "center",
+    borderTopLeftRadius: e.borderRadius.md,
+    borderTopRightRadius: e.isMobile ? e.borderRadius.md : 0,
+    borderBottomLeftRadius: e.isMobile ? 0 : e.borderRadius.md,
+    overflow: "hidden",
+    height: "auto",
+    position: "relative",
+    minHeight: e.isMobile ? "210px" : "430px",
+    "&::before": {
+      content: '""',
+      position: "absolute",
+      width: "100%",
+      height: "100%",
+      borderTopLeftRadius: "5px",
+      borderTopRightRadius: "5px"
+    }
+  },
+  // Main content area
+  mainContentArea: {
+    flex: "0.5",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    p: e.spacingScale.lg
+  },
+  headlineContent: {
+    zIndex: 1,
+    height: "100%",
+    p: e.spacingScale.xl,
+    gap: e.spacingScale.xl,
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "space-between"
+  },
+  // Headline text
+  headlineText: {
+    fontWeight: 500,
+    lineHeight: "166%",
+    letterSpacing: "1px",
+    fontSize: "0.75em",
+    color: e.secondaryColor,
+    opacity: "70%",
+    textTransform: "uppercase",
+    fontFamily: e.fontFamilySecondary,
+    textAlign: e.isMobile ? "center" : "left"
+  },
+  // Title text
+  titleText: {
+    fontWeight: 700,
+    lineHeight: "133%",
+    fontSize: "1.5em",
+    letterSpacing: "0.15px",
+    color: e.contentColor,
+    fontFamily: e.fontFamilyPrimary,
+    textAlign: e.isMobile ? "center" : "left"
+  },
+  // Description text
+  descriptionText: {
+    fontWeight: 400,
+    lineHeight: "140%",
+    fontSize: "1.25em",
+    letterSpacing: "0.15px",
+    color: e.secondaryColor,
+    opacity: "70%",
+    fontFamily: e.fontFamilyPrimary,
+    textAlign: e.isMobile ? "center" : "left"
+  },
+  ctaWrapper: {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "space-between",
+    alignItems: "center",
+    gap: e.spacingScale["2xl"]
+  },
+  // Content container
+  contentContainer: {
+    display: "flex",
+    flexDirection: "column",
+    gap: e.spacingScale["3xs"]
+  }
+}), pe = ({
+  entity: e,
+  headline: a,
+  finalImage: r,
+  signInContent: x,
+  brandingContent: y,
+  rulesDisplay: f
+}) => {
+  var b;
+  const p = z(), u = $(), s = B(), d = K().primary, m = K().secondary, h = Y(), g = ((b = e.branding) == null ? void 0 : b.colors) || null, v = (g == null ? void 0 : g.contentColor) || u.colorSchemes.dark.textColor, c = (g == null ? void 0 : g.secondaryColor) || u.colorSchemes.dark.textColor, o = te({
+    finalImage: r,
+    spacingScale: s,
+    borderRadius: h,
+    fontFamilyPrimary: d,
+    fontFamilySecondary: m,
+    secondaryColor: c,
+    contentColor: v,
+    isMobile: p
+  });
+  return /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+    /* @__PURE__ */ n.jsx(i, { sx: o.headlineSection, children: /* @__PURE__ */ n.jsxs(i, { sx: o.headlineContent, children: [
+      /* @__PURE__ */ n.jsxs(i, { sx: { display: "flex", flexDirection: "column", alignItems: p ? "center" : "flex-start", gap: s["3xs"] }, children: [
+        /* @__PURE__ */ n.jsxs(i, { sx: { display: "flex", alignItems: "center", gap: s["3xs"] }, children: [
+          /* @__PURE__ */ n.jsx(j, { sx: o.headlineText, children: a }),
+          /* @__PURE__ */ n.jsx(
+            V,
+            {
+              rulesDisplay: f,
+              rules: e.rules || ""
+            }
+          )
+        ] }),
+        /* @__PURE__ */ n.jsxs(i, { sx: o.contentContainer, children: [
+          /* @__PURE__ */ n.jsx(j, { sx: o.titleText, children: e.title }),
+          /* @__PURE__ */ n.jsx(j, { sx: o.descriptionText, children: G(e.description) })
+        ] })
+      ] }),
+      p ? /* @__PURE__ */ n.jsx(n.Fragment, {}) : y
+    ] }) }),
+    /* @__PURE__ */ n.jsx(i, { sx: o.mainContentArea, children: /* @__PURE__ */ n.jsxs(i, { sx: o.ctaWrapper, children: [
+      x,
+      p && y
+    ] }) })
+  ] });
+}, ae = (e) => {
+  var a;
+  return {
+    // Main container with background overlay
+    mainContainer: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      gap: "40px",
+      p: e.spacingScale.xl,
+      boxShadow: "md",
+      border: (a = e.brandingColors) != null && a.borderColor ? `${e.borderSize} solid ${e.brandingColors.borderColor}` : "none",
+      overflow: "hidden",
+      backgroundImage: e.backgroundImage,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      position: "relative",
+      borderRadius: e.mdBorderRadius,
+      minHeight: "250px",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        background: e.imageBackgroundGradient,
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        borderRadius: "inherit",
+        zIndex: 0
+      }
+    },
+    // Headline section wrapper
+    headlineSection: {
+      display: "flex",
+      justifyContent: "space-between",
+      flex: "1 0 0",
+      alignSelf: "stretch"
+    },
+    // Headline content container
+    headlineContent: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "flex-start",
+      flex: "1 0 0",
+      gap: "16px"
+    },
+    // Headline content with z-index
+    headlineContentInner: {
+      zIndex: 10
+    },
+    headlineText: {
+      fontWeight: 500,
+      lineHeight: "166%",
+      letterSpacing: "1px",
+      textAlign: e.isMobile ? "center" : "left",
+      color: e.secondaryColor,
+      opacity: "70%",
+      textTransform: "uppercase",
+      fontFamily: e.fontFamilySecondary,
+      fontSize: "0.75em"
+    },
+    // Content container
+    contentContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: e.spacingScale["3xs"]
+    },
+    titleText: {
+      fontWeight: 700,
+      lineHeight: "133%",
+      letterSpacing: "0px",
+      textAlign: e.isMobile ? "center" : "left",
+      fontSize: "1.5em",
+      color: e.darkTextColor,
+      fontFamily: e.fontFamilyPrimary
+    },
+    descriptionText: {
+      fontWeight: 400,
+      lineHeight: "140%",
+      letterSpacing: "0.15px",
+      fontSize: "1.25em",
+      textAlign: e.isMobile ? "center" : "left",
+      color: e.secondaryColor,
+      opacity: "70%",
+      fontFamily: e.fontFamilyPrimary
+    },
+    // Bottom container
+    bottomContainer: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      flexDirection: e.isMobile ? "column-reverse" : "row",
+      gap: e.spacingScale.md
+    },
+    // Sign-in wrapper to always position at flex-end
+    signInWrapper: {
+      display: "flex",
+      justifyContent: "flex-end",
+      flex: 1
+    }
+  };
+}, xe = ({
+  entity: e,
+  headline: a,
+  backgroundImage: r,
+  imageBackgroundGradient: x,
+  signInContent: y,
+  brandingContent: f,
+  rulesDisplay: b
+}) => {
+  var p;
+  const u = z(), s = $(), d = B(), m = ((p = e.branding) == null ? void 0 : p.colors) || null, h = (m == null ? void 0 : m.contentColor) || s.colorSchemes.dark.textColor, g = s.customFontFamily.dark.primary, v = s.customFontFamily.dark.secondary, c = s.customRadius.dark.md, o = s.border.dark.size, S = s.colorSchemes.dark.textColor, t = ae({
+    spacingScale: d,
+    brandingColors: m,
+    secondaryColor: h,
+    fontFamilyPrimary: g,
+    fontFamilySecondary: v,
+    mdBorderRadius: c,
+    borderSize: o,
+    darkTextColor: S,
+    backgroundImage: r,
+    imageBackgroundGradient: x,
+    isMobile: u
+  });
+  return /* @__PURE__ */ n.jsxs(i, { sx: t.mainContainer, children: [
+    /* @__PURE__ */ n.jsx(i, { children: /* @__PURE__ */ n.jsx(i, { sx: t.headlineSection, children: /* @__PURE__ */ n.jsx(i, { sx: t.headlineContent, children: /* @__PURE__ */ n.jsxs(i, { sx: { ...t.headlineContentInner, display: "flex", flexDirection: "column", alignItems: u ? "center" : "flex-start", gap: d["3xs"] }, children: [
+      /* @__PURE__ */ n.jsxs(i, { sx: { display: "flex", alignItems: "center", gap: d["3xs"] }, children: [
+        /* @__PURE__ */ n.jsx(j, { level: "body-sm", sx: t.headlineText, children: a }),
+        /* @__PURE__ */ n.jsx(
+          V,
+          {
+            rulesDisplay: b,
+            isOverlayVariant: !0,
+            rules: e.rules || ""
+          }
+        )
+      ] }),
+      /* @__PURE__ */ n.jsxs(i, { sx: t.contentContainer, children: [
+        /* @__PURE__ */ n.jsx(j, { level: "h4", sx: t.titleText, children: e.title }),
+        /* @__PURE__ */ n.jsx(j, { level: "body-lg", sx: t.descriptionText, children: G(e.description) })
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ n.jsxs(i, { sx: t.bottomContainer, children: [
+      f,
+      /* @__PURE__ */ n.jsx(i, { sx: t.signInWrapper, children: y })
+    ] })
+  ] });
+}, ue = (e) => {
+  var a, r, x, y, f, b, p;
+  const u = J(
+    {
+      images: e.entity.images || null,
+      imagePlaceholder: e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : ""
+    },
+    Z.STANDARD
+  ), s = z(), d = B(), m = Y(), h = `rgba(${E(A().surfaceVariant || "")}, 0.5)`, g = ((a = e.entity.branding) == null ? void 0 : a.colors) || null, v = (g == null ? void 0 : g.borderColor) || null, c = s ? ((x = (r = e.entity.branding) == null ? void 0 : r.images) == null ? void 0 : x.mobileLogo) || ((f = (y = e.entity.branding) == null ? void 0 : y.images) == null ? void 0 : f.mainLogo) || "" : ((p = (b = e.entity.branding) == null ? void 0 : b.images) == null ? void 0 : p.mainLogo) || "", o = e.imagePosition || "left", S = A().textColor, t = {
+    mainContentArea: {
+      flex: s ? "1" : u ? "0.7" : "1",
+      display: "flex",
+      flexDirection: "column",
+      p: d.md,
+      gap: d.md
+    },
+    leadCollectionContainer: {
+      display: "flex",
+      flexDirection: "column"
+    },
+    leadQuestionContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: s ? d.lg : d.md
+    },
+    leadContentContainer: {
+      borderRadius: m.md,
+      px: d.md,
+      pt: d.md,
+      pb: d.lg,
+      gap: d.md,
+      bgcolor: h,
+      display: "flex",
+      flexDirection: "column",
+      backdropFilter: "blur(4px)"
+    }
+  }, P = () => {
+    var F, W, l, C, R, I, T, M, L, w, H, U, N, q, D, O;
+    const { CollectLeadWrapper: Q, entity: k } = e;
+    return /* @__PURE__ */ n.jsxs(i, { sx: t.mainContentArea, children: [
+      /* @__PURE__ */ n.jsx(i, { sx: t.leadCollectionContainer, children: /* @__PURE__ */ n.jsx(i, { sx: t.leadQuestionContainer, children: /* @__PURE__ */ n.jsx(i, { sx: t.leadContentContainer, children: /* @__PURE__ */ n.jsx(
+        Q,
+        {
+          sdk: e.sdk,
+          contentId: k.id,
+          contentName: k.title,
+          brandingColors: (F = k.branding) == null ? void 0 : F.colors,
+          brandingUrls: (W = k.branding) == null ? void 0 : W.urls,
+          campaignId: (l = e.leads) == null ? void 0 : l.campaignId,
+          campaignName: (C = e.leads) == null ? void 0 : C.campaignName,
+          fields: (R = e.leads) == null ? void 0 : R.fields,
+          leadTitle: (I = k.labels) == null ? void 0 : I.leadTitle,
+          leadDescription: (T = k.labels) == null ? void 0 : T.leadDescription,
+          leadCta: (M = k.labels) == null ? void 0 : M.leadCta,
+          leadSuccessTitle: (L = k.labels) == null ? void 0 : L.leadSuccessTitle,
+          leadSuccessDescription: (w = k.labels) == null ? void 0 : w.leadSuccessDescription,
+          syncWithProfile: (H = e.leads) == null ? void 0 : H.syncWithProfile,
+          startGame: e.onLeadSubmitted,
+          isAfterPosition: !0,
+          isSubmittingParticipation: e.isSubmitting
+        }
+      ) }) }) }),
+      c && /* @__PURE__ */ n.jsx(
+        e.PresentedBy,
+        {
+          brandingLogo: c,
+          textColor: S,
+          label: ((U = k.labels) == null ? void 0 : U.sponsor) || null,
+          primaryUrl: (q = (N = k.branding) == null ? void 0 : N.urls) == null ? void 0 : q.primaryUrl,
+          secondaryUrl: (O = (D = k.branding) == null ? void 0 : D.urls) == null ? void 0 : O.secondaryUrl
+        }
+      )
+    ] });
+  };
+  return /* @__PURE__ */ n.jsx(e.MainCard, { brandingBorderColor: v, children: /* @__PURE__ */ n.jsx(
+    ne,
+    {
+      entity: e.entity,
+      headline: e.headline,
+      finalImage: u,
+      imagePosition: o,
+      rulesDisplay: e.rulesDisplay,
+      children: P()
+    }
+  ) });
+}, me = (e) => {
+  var a, r, x, y, f, b, p;
+  const u = $(), s = z(), d = s ? e.mobileImagePlaceholder || e.defaultImagePlaceholder || "" : e.defaultImagePlaceholder || "", m = J(
+    {
+      images: e.entity.images || null,
+      imagePlaceholder: d
+    },
+    Z.SPLIT
+  ), h = ((a = e.entity.branding) == null ? void 0 : a.colors) || null, g = (h == null ? void 0 : h.borderColor) || null, v = (h == null ? void 0 : h.backgroundColor) || A().surfaceVariant, c = E(v), o = B(), S = Y(), t = s ? ((x = (r = e.entity.branding) == null ? void 0 : r.images) == null ? void 0 : x.mobileLogo) || ((f = (y = e.entity.branding) == null ? void 0 : y.images) == null ? void 0 : f.mainLogo) || "" : ((p = (b = e.entity.branding) == null ? void 0 : b.images) == null ? void 0 : p.mainLogo) || "", P = {
+    questionArea: {
+      width: "100%",
+      justifyContent: "center",
+      display: "flex",
+      flexDirection: "column"
+    },
+    questionAreaContent: {
+      p: o.lg,
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      gap: "16px"
+    },
+    leadContentContainer: {
+      p: o.md,
+      gap: o.md,
+      display: "flex",
+      flexDirection: "column",
+      backdropFilter: "blur(4px)",
+      bgcolor: `rgba(${c.replace(/[^\d,]/g, "")}, 0.5)`,
+      borderRadius: S.sm
+    }
+  }, F = (l) => {
+    var C, R, I, T, M;
+    return /* @__PURE__ */ n.jsx(
+      e.PresentedBy,
+      {
+        brandingLogo: t,
+        textColor: l,
+        label: ((C = e.entity.labels) == null ? void 0 : C.sponsor) || null,
+        primaryUrl: (I = (R = e.entity.branding) == null ? void 0 : R.urls) == null ? void 0 : I.primaryUrl,
+        secondaryUrl: (M = (T = e.entity.branding) == null ? void 0 : T.urls) == null ? void 0 : M.secondaryUrl,
+        isCentered: !1
+      }
+    );
+  }, W = () => {
+    var l, C, R, I, T, M, L, w, H, U, N;
+    const { CollectLeadWrapper: q, entity: D } = e;
+    return /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+      /* @__PURE__ */ n.jsx(i, { sx: P.questionArea, children: /* @__PURE__ */ n.jsx(i, { sx: P.questionAreaContent, children: /* @__PURE__ */ n.jsx(i, { sx: P.leadContentContainer, children: /* @__PURE__ */ n.jsx(
+        q,
+        {
+          sdk: e.sdk,
+          contentId: D.id,
+          contentName: D.title,
+          brandingColors: (l = D.branding) == null ? void 0 : l.colors,
+          brandingUrls: (C = D.branding) == null ? void 0 : C.urls,
+          campaignId: (R = e.leads) == null ? void 0 : R.campaignId,
+          campaignName: (I = e.leads) == null ? void 0 : I.campaignName,
+          fields: (T = e.leads) == null ? void 0 : T.fields,
+          leadTitle: (M = D.labels) == null ? void 0 : M.leadTitle,
+          leadDescription: (L = D.labels) == null ? void 0 : L.leadDescription,
+          leadCta: (w = D.labels) == null ? void 0 : w.leadCta,
+          leadSuccessTitle: (H = D.labels) == null ? void 0 : H.leadSuccessTitle,
+          leadSuccessDescription: (U = D.labels) == null ? void 0 : U.leadSuccessDescription,
+          syncWithProfile: (N = e.leads) == null ? void 0 : N.syncWithProfile,
+          startGame: e.onLeadSubmitted,
+          isAfterPosition: !0,
+          isSubmittingParticipation: e.isSubmitting
+        }
+      ) }) }) }),
+      t && s && /* @__PURE__ */ n.jsx(i, { sx: { mb: o.lg, px: o.lg }, children: F(
+        (h == null ? void 0 : h.contentColor) || u.colorSchemes.dark.textColor
+      ) })
+    ] });
+  };
+  return /* @__PURE__ */ n.jsx(e.MainCard, { brandingBorderColor: g, children: /* @__PURE__ */ n.jsx(
+    le,
+    {
+      entity: e.entity,
+      headline: e.headline,
+      finalImage: m,
+      brandingLogo: t,
+      renderPresentedBy: F,
+      rulesDisplay: e.rulesDisplay,
+      children: W()
+    }
+  ) });
+}, ye = (e) => {
+  const a = $(), r = z(), x = e.defaultImagePlaceholder ? e.defaultImagePlaceholder || "" : r ? e.mobileImagePlaceholder : e.defaultImagePlaceholder || "", { brandingImage: y, brandingColors: f, brandingLogo: b } = ee(e.entity.branding || null), p = y || J(
+    {
+      images: e.entity.images || null,
+      imagePlaceholder: x || ""
+    },
+    Z.OVERLAY
+  ), u = B(), s = (f == null ? void 0 : f.backgroundColor) || a.colorSchemes.dark.surfaceVariant, d = {
+    mainContentSection: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "24px"
+    },
+    contentContainerWithBackdrop: {
+      borderRadius: a.customRadius.dark.sm,
+      p: u.md,
+      display: "flex",
+      flexDirection: "column",
+      gap: u.md,
+      backdropFilter: "blur(4px)",
+      position: "relative",
+      "&::before": {
+        content: '""',
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        backgroundColor: s,
+        opacity: 0.5,
+        borderRadius: "inherit",
+        zIndex: 0
+      },
+      "& > *": {
+        position: "relative",
+        zIndex: 1
+      }
+    },
+    presentedByContainer: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: r ? "center" : "space-between",
+      flexDirection: r ? "column-reverse" : "row",
+      gap: u.md
+    }
+  }, m = () => {
+    var g, v, c, o, S;
+    return /* @__PURE__ */ n.jsx(
+      e.PresentedBy,
+      {
+        brandingLogo: b || "",
+        textColor: a.colorSchemes.dark.textColor,
+        label: ((g = e.entity.labels) == null ? void 0 : g.sponsor) || null,
+        primaryUrl: (c = (v = e.entity.branding) == null ? void 0 : v.urls) == null ? void 0 : c.primaryUrl,
+        secondaryUrl: (S = (o = e.entity.branding) == null ? void 0 : o.urls) == null ? void 0 : S.secondaryUrl
+      }
+    );
+  }, h = () => {
+    var g, v, c, o, S, t, P, F, W, l, C;
+    return /* @__PURE__ */ n.jsxs(i, { sx: d.mainContentSection, children: [
+      /* @__PURE__ */ n.jsx(i, { sx: d.contentContainerWithBackdrop, children: /* @__PURE__ */ n.jsx(
+        e.CollectLeadWrapper,
+        {
+          sdk: e.sdk,
+          contentId: e.entity.id,
+          contentName: e.entity.title,
+          brandingColors: (g = e.entity.branding) == null ? void 0 : g.colors,
+          brandingUrls: (v = e.entity.branding) == null ? void 0 : v.urls,
+          campaignId: (c = e.leads) == null ? void 0 : c.campaignId,
+          campaignName: (o = e.leads) == null ? void 0 : o.campaignName,
+          fields: (S = e.leads) == null ? void 0 : S.fields,
+          leadTitle: (t = e.entity.labels) == null ? void 0 : t.leadTitle,
+          leadDescription: (P = e.entity.labels) == null ? void 0 : P.leadDescription,
+          leadCta: (F = e.entity.labels) == null ? void 0 : F.leadCta,
+          leadSuccessTitle: (W = e.entity.labels) == null ? void 0 : W.leadSuccessTitle,
+          leadSuccessDescription: (l = e.entity.labels) == null ? void 0 : l.leadSuccessDescription,
+          syncWithProfile: (C = e.leads) == null ? void 0 : C.syncWithProfile,
+          startGame: e.onLeadSubmitted,
+          isAfterPosition: !0,
+          isSubmittingParticipation: e.isSubmitting
+        }
+      ) }),
+      /* @__PURE__ */ n.jsx(i, { sx: d.presentedByContainer, children: m() })
+    ] });
+  };
+  return /* @__PURE__ */ n.jsx(
+    ie,
+    {
+      entity: e.entity,
+      headline: e.headline,
+      finalImage: p,
+      rulesDisplay: e.rulesDisplay,
+      children: h()
+    }
+  );
+};
+export {
+  ye as C,
+  me as b,
+  pe as f,
+  ue as h,
+  xe as u,
+  ge as y
+};