fansunited-frontend-components 0.0.31-RC5 → 0.0.31-RC6

package/packages/common/src/components/Skeletons/Standard/ScoreState/StandardScoreStateSkeleton.js

@@ -1,142 +0,0 @@
-import { j as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import { Box as r, Typography as n } from "@mui/joy";
-import { createStyles as H } from "./StandardScoreStateSkeleton.styles.js";
-import { isMobile as M, useInternalTheme as A, useSpacingScale as F, useFontFamily as y, useCornerRadius as V, useColors as p, useImageBackgroundGradient as B } from "../../../../functions/theme.js";
-import { WidgetTemplate as D } from "../../../../enums/enums.js";
-import { hexToRgb as O, stripHtmlTags as h } from "../../../../functions/helpers.js";
-import m from "../../../Rules.js";
-const z = ({
-  entity: o,
-  headline: a,
-  finalImage: l,
-  imagePosition: c = "left",
-  children: g,
-  rulesDisplay: x
-}) => {
-  var j;
-  const d = M(), u = A(), i = F(), f = y().primary, C = y().secondary, T = V(), t = ((j = o.branding) == null ? void 0 : j.colors) || null, b = (t == null ? void 0 : t.contentColor) || p().textColor, S = (t == null ? void 0 : t.secondaryColor) || p().textColor, k = (t == null ? void 0 : t.backgroundColor) || p().surfaceVariant, v = "60%", I = B(
-    D.STANDARD
-  ), s = H({
-    finalImage: l,
-    spacingScale: i,
-    borderRadius: T,
-    fontFamilyPrimary: f,
-    fontFamilySecondary: C,
-    textColor: b,
-    secondaryColor: S,
-    bgcolor: O(k || ""),
-    opacity: v,
-    brandingColors: t,
-    imagePosition: c,
-    darkTextColor: u.colorSchemes.dark.textColor,
-    imageBackgroundGradient: I,
-    isMobile: d
-  }), R = () => l ? /* @__PURE__ */ e.jsx(r, { sx: s.mobileHeadlineWithImage, children: /* @__PURE__ */ e.jsxs(r, { sx: s.mobileHeadlineContent, children: [
-    /* @__PURE__ */ e.jsxs(
-      r,
-      {
-        sx: {
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          gap: i["3xs"]
-        },
-        children: [
-          /* @__PURE__ */ e.jsx(
-            n,
-            {
-              level: "body-sm",
-              sx: s.headlineTypographyMobileImage,
-              children: a
-            }
-          ),
-          /* @__PURE__ */ e.jsx(
-            m,
-            {
-              rules: o.rules || "",
-              rulesDisplay: x,
-              isOverlayVariant: !1
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ e.jsxs(r, { sx: s.contentContainer, children: [
-      /* @__PURE__ */ e.jsx(n, { sx: s.titleTypographyMobileImage, children: o.title }),
-      /* @__PURE__ */ e.jsx(n, { sx: s.descriptionTypographyMobileImage, children: h(o.description) })
-    ] })
-  ] }) }) : /* @__PURE__ */ e.jsx(r, { sx: s.mobileHeadlineWithoutImage, children: /* @__PURE__ */ e.jsxs(r, { children: [
-    /* @__PURE__ */ e.jsxs(
-      r,
-      {
-        sx: {
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          gap: i["3xs"]
-        },
-        children: [
-          /* @__PURE__ */ e.jsx(n, { level: "body-sm", sx: s.headlineTypography, children: a }),
-          /* @__PURE__ */ e.jsx(
-            m,
-            {
-              rules: o.rules || "",
-              rulesDisplay: x,
-              isOverlayVariant: !1
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ e.jsxs(r, { sx: s.contentContainer, children: [
-      /* @__PURE__ */ e.jsx(n, { level: "h4", sx: s.titleTypography, children: o.title }),
-      /* @__PURE__ */ e.jsx(n, { sx: s.descriptionTypography, children: h(o.description) })
-    ] })
-  ] }) });
-  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    d && R(),
-    c === "left" && l ? /* @__PURE__ */ e.jsx(r, { sx: s.imageContainerLeft, children: /* @__PURE__ */ e.jsx(r, { sx: s.imageSafeArea }) }) : null,
-    /* @__PURE__ */ e.jsxs(r, { sx: s.mainContentArea, children: [
-      !d && /* @__PURE__ */ e.jsx(r, { children: /* @__PURE__ */ e.jsxs(r, { sx: s.desktopHeadlineContainer, children: [
-        /* @__PURE__ */ e.jsxs(
-          r,
-          {
-            sx: {
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              gap: i["3xs"]
-            },
-            children: [
-              /* @__PURE__ */ e.jsx(
-                n,
-                {
-                  level: "body-sm",
-                  sx: s.headlineTypographyDesktop,
-                  children: a
-                }
-              ),
-              /* @__PURE__ */ e.jsx(
-                m,
-                {
-                  rules: o.rules || "",
-                  rulesDisplay: x,
-                  isOverlayVariant: !1
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ e.jsxs(r, { sx: s.contentContainer, children: [
-          /* @__PURE__ */ e.jsx(n, { level: "h4", sx: s.titleTypographyDesktop, children: o.title }),
-          /* @__PURE__ */ e.jsx(n, { sx: s.descriptionTypographyDesktop, children: h(o.description) })
-        ] })
-      ] }) }),
-      g
-    ] }),
-    c === "right" && l ? /* @__PURE__ */ e.jsx(r, { sx: s.imageContainerRight, children: /* @__PURE__ */ e.jsx(r, { sx: s.imageSafeArea }) }) : null
-  ] });
-};
-export {
-  z as default
-};

package/packages/common/src/components/Skeletons/Standard/ScoreState/StandardScoreStateSkeleton.styles.js

@@ -1,203 +0,0 @@
-const o = (e) => {
-  var i, t, n;
-  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"
-      }
-    },
-    // Mobile headline content
-    mobileHeadlineContent: {
-      zIndex: 1,
-      height: "100%",
-      p: e.spacingScale.xl,
-      display: "flex",
-      flexDirection: "column",
-      justifyContent: "space-between"
-    },
-    // Mobile headline without image
-    mobileHeadlineWithoutImage: {
-      display: e.isMobile ? "flex" : "none",
-      flexDirection: "column",
-      justifyContent: "space-between",
-      p: e.isMobile ? e.spacingScale.sm : e.spacingScale.md
-    },
-    // Headline typography (mobile with image)
-    headlineTypographyMobileImage: {
-      fontWeight: 500,
-      lineHeight: "166%",
-      letterSpacing: "1px",
-      fontSize: "0.75em",
-      color: ((i = e.brandingColors) == null ? void 0 : i.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: e.isMobile ? "center" : "left"
-    },
-    // Headline typography (desktop centered)
-    headlineTypographyDesktop: {
-      fontWeight: 500,
-      lineHeight: "166%",
-      letterSpacing: "1px",
-      textTransform: "uppercase",
-      fontSize: "0.75em",
-      color: e.secondaryColor,
-      opacity: e.opacity,
-      fontFamily: e.fontFamilySecondary
-    },
-    // Content container
-    contentContainer: {
-      display: "flex",
-      flexDirection: "column",
-      gap: e.spacingScale["3xs"]
-    },
-    // Title typography (mobile with image)
-    titleTypographyMobileImage: {
-      fontWeight: 700,
-      lineHeight: "133%",
-      fontSize: "1.5em",
-      letterSpacing: "0.15px",
-      color: ((t = e.brandingColors) == null ? void 0 : t.contentColor) || e.darkTextColor,
-      fontFamily: e.fontFamilyPrimary,
-      textAlign: "center"
-    },
-    // Title typography (mobile without image & desktop responsive)
-    titleTypography: {
-      fontWeight: 700,
-      lineHeight: "133%",
-      letterSpacing: "0px",
-      fontSize: "1.5em",
-      color: e.textColor,
-      fontFamily: e.fontFamilyPrimary,
-      textAlign: e.isMobile ? "center" : "left"
-    },
-    // Title typography (desktop centered)
-    titleTypographyDesktop: {
-      fontWeight: 700,
-      lineHeight: "133%",
-      letterSpacing: "0px",
-      fontSize: "1.5em",
-      color: e.textColor,
-      fontFamily: e.fontFamilyPrimary
-    },
-    // Description typography (mobile with image)
-    descriptionTypographyMobileImage: {
-      fontWeight: 400,
-      lineHeight: "140%",
-      fontSize: "1.25em",
-      letterSpacing: "0.15px",
-      color: ((n = e.brandingColors) == null ? void 0 : n.secondaryColor) || e.darkTextColor,
-      opacity: "70%",
-      fontFamily: e.fontFamilyPrimary,
-      textAlign: "center"
-    },
-    // Description typography (mobile without image & desktop responsive)
-    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"
-    },
-    // Description typography (desktop centered)
-    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",
-      overflow: "hidden",
-      height: "auto",
-      position: "relative",
-      minHeight: "auto",
-      backgroundImage: `url(${e.finalImage})`,
-      backgroundSize: "cover",
-      backgroundPosition: "center center",
-      backgroundRepeat: "no-repeat",
-      alignItems: "center",
-      justifyContent: "center"
-    },
-    // Image container (right position)
-    imageContainerRight: {
-      display: e.isMobile ? "none" : "block",
-      flex: "0.3",
-      overflow: "hidden",
-      height: "auto",
-      position: "relative",
-      minHeight: "auto",
-      backgroundImage: `url(${e.finalImage})`,
-      backgroundSize: "cover",
-      backgroundPosition: "center center",
-      backgroundRepeat: "no-repeat",
-      alignItems: "center",
-      justifyContent: "center"
-    },
-    // Image safe area (placeholder for image space)
-    imageSafeArea: {
-      width: "100%",
-      height: "100%"
-    },
-    // Main content area
-    mainContentArea: {
-      flex: e.isMobile ? "1" : e.finalImage ? "0.7" : "1",
-      display: "flex",
-      flexDirection: "column",
-      px: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
-      pt: e.spacingScale.lg,
-      pb: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
-      gap: e.spacingScale.md
-    },
-    // Desktop headline container
-    desktopHeadlineContainer: {
-      display: e.isMobile ? "none" : "flex",
-      flexDirection: "column",
-      justifyContent: "space-between",
-      textAlign: "center"
-    }
-  };
-};
-export {
-  o as createStyles
-};

package/packages/common/src/components/Skeletons/Standard/SignIn/StandardSignInSkeleton.js

@@ -1,157 +0,0 @@
-import { j as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import { Box as r, Typography as n } from "@mui/joy";
-import { createStyles as W } from "./StandardSignInSkeleton.styles.js";
-import { isMobile as G, useInternalTheme as _, useSpacingScale as E, useFontFamily as b, useCornerRadius as L, useColors as u, useImageBackgroundGradient as N } from "../../../../functions/theme.js";
-import { WidgetTemplate as U } from "../../../../enums/enums.js";
-import { hexToRgb as V, getBrandingClickUrl as q, stripHtmlTags as y } from "../../../../functions/helpers.js";
-import f from "../../../Rules.js";
-const Z = ({
-  entity: o,
-  headline: p,
-  finalImage: t,
-  imagePosition: m = "left",
-  signInContent: h,
-  brandingContent: j,
-  rulesDisplay: g
-}) => {
-  var C, T;
-  const k = G(), I = _(), x = E(), v = b().primary, B = b().secondary, R = L(), l = ((C = o.branding) == null ? void 0 : C.colors) || null, i = ((T = o.branding) == null ? void 0 : T.urls) || null, S = (l == null ? void 0 : l.contentColor) || u().textColor, H = (l == null ? void 0 : l.secondaryColor) || u().textColor, M = (l == null ? void 0 : l.backgroundColor) || u().surfaceVariant, w = "60%", F = N(
-    U.STANDARD
-  ), s = W({
-    finalImage: t,
-    spacingScale: x,
-    borderRadius: R,
-    fontFamilyPrimary: v,
-    fontFamilySecondary: B,
-    textColor: S,
-    secondaryColor: H,
-    bgcolor: V(M || ""),
-    opacity: w,
-    brandingColors: l,
-    imagePosition: m,
-    darkTextColor: I.colorSchemes.dark.textColor,
-    imageBackgroundGradient: F,
-    isMobile: k
-  }), c = q(
-    i == null ? void 0 : i.primaryUrl,
-    i == null ? void 0 : i.secondaryUrl,
-    "image"
-  ), A = (a, d) => typeof window > "u" ? c ? /* @__PURE__ */ e.jsx(
-    r,
-    {
-      component: "a",
-      href: c,
-      target: "_blank",
-      sx: d,
-      children: a
-    }
-  ) : /* @__PURE__ */ e.jsx(r, { sx: d, children: a }) : c ? /* @__PURE__ */ e.jsx(
-    r,
-    {
-      sx: { ...d, cursor: "pointer" },
-      onClick: () => window.open(c, "_blank"),
-      children: a
-    }
-  ) : /* @__PURE__ */ e.jsx(r, { sx: d, children: a }), D = () => t ? A(
-    /* @__PURE__ */ e.jsxs(r, { sx: s.mobileHeadlineContent, children: [
-      /* @__PURE__ */ e.jsxs(r, { children: [
-        /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "center", gap: x["3xs"] }, children: [
-          /* @__PURE__ */ e.jsx(
-            n,
-            {
-              level: "body-sm",
-              sx: s.headlineTypographyMobileImage,
-              children: p
-            }
-          ),
-          /* @__PURE__ */ e.jsx(
-            f,
-            {
-              rulesDisplay: g,
-              rules: o.rules || ""
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e.jsxs(r, { sx: s.contentContainer, children: [
-          /* @__PURE__ */ e.jsx(
-            n,
-            {
-              level: "body-lg",
-              sx: s.titleTypographyMobileImage,
-              children: o.title
-            }
-          ),
-          /* @__PURE__ */ e.jsx(
-            n,
-            {
-              level: "body-md",
-              sx: s.descriptionTypographyMobileImage,
-              children: y(o.description)
-            }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ e.jsxs(r, { sx: s.signInButtonContainer, children: [
-        h,
-        j
-      ] })
-    ] }),
-    s.mobileHeadlineWithImage
-  ) : /* @__PURE__ */ e.jsxs(r, { sx: s.mobileHeadlineWithoutImage, children: [
-    /* @__PURE__ */ e.jsxs(r, { children: [
-      /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "center", gap: x["3xs"] }, children: [
-        /* @__PURE__ */ e.jsx(n, { level: "body-sm", sx: s.headlineTypography, children: p }),
-        /* @__PURE__ */ e.jsx(
-          f,
-          {
-            rulesDisplay: g,
-            rules: o.rules || ""
-          }
-        )
-      ] }),
-      /* @__PURE__ */ e.jsxs(r, { sx: s.contentContainer, children: [
-        /* @__PURE__ */ e.jsx(n, { level: "h4", sx: s.titleTypography, children: o.title }),
-        /* @__PURE__ */ e.jsx(n, { level: "body-md", sx: s.descriptionTypography, children: y(o.description) })
-      ] })
-    ] }),
-    /* @__PURE__ */ e.jsxs(r, { sx: s.signInButtonContainer, children: [
-      h,
-      j
-    ] })
-  ] });
-  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    D(),
-    t && m === "left" && /* @__PURE__ */ e.jsx(r, { sx: s.imageContainerLeft, children: /* @__PURE__ */ e.jsx("img", { src: t, alt: "Illustration", style: s.image }) }),
-    /* @__PURE__ */ e.jsx(r, { sx: s.mainContentArea, children: /* @__PURE__ */ e.jsxs(r, { sx: s.desktopHeadlineContainer, children: [
-      /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", flexDirection: "column", alignItems: "center", gap: x["3xs"] }, children: [
-        /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "center", gap: x["3xs"] }, children: [
-          /* @__PURE__ */ e.jsx(n, { level: "body-sm", sx: s.headlineTypography, children: p }),
-          /* @__PURE__ */ e.jsx(
-            f,
-            {
-              rulesDisplay: g,
-              rules: o.rules || ""
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e.jsxs(r, { sx: s.contentContainer, children: [
-          /* @__PURE__ */ e.jsx(n, { level: "h4", sx: s.titleTypographyDesktop, children: o.title }),
-          /* @__PURE__ */ e.jsx(
-            n,
-            {
-              level: "body-md",
-              sx: s.descriptionTypographyDesktop,
-              children: y(o.description)
-            }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ e.jsx(r, { sx: s.signInButtonContainer, children: h }),
-      j
-    ] }) }),
-    t && m === "right" && /* @__PURE__ */ e.jsx(r, { sx: s.imageContainerRight, children: /* @__PURE__ */ e.jsx("img", { src: t, alt: "Illustration", style: s.image }) })
-  ] });
-};
-export {
-  Z as default
-};

package/packages/common/src/components/Skeletons/Standard/SignIn/StandardSignInSkeleton.styles.js

@@ -1,194 +0,0 @@
-const o = (e) => {
-  var i, t, n;
-  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: ((i = e.brandingColors) == null ? void 0 : i.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: ((t = e.brandingColors) == null ? void 0 : t.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: ((n = e.brandingColors) == null ? void 0 : n.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"
-    }
-  };
-};
-export {
-  o as createStyles
-};