import { jsxs as l, jsx as i } from "react/jsx-runtime";
import { i as k, u as F, e as z, B as r } from "./PrizeCard-C2El3VOB.js";
import { s as I } from "./helpers-uh28Hksw.js";
import { R as v } from "./NotFoundSkeleton-BJ7rW_uC.js";
import { T as a } from "./Button-DPGn5NZd.js";
const R = (e) => ({
  // Main container with background overlay
  mainContainer: {
    display: "flex",
    flexDirection: "column",
    gap: "40px",
    p: e.spacingScale.xl,
    boxShadow: "md",
    border: `${e.borderSize} solid ${e.borderColor}`,
    overflow: "hidden",
    backgroundImage: e.backgroundImage,
    backgroundPosition: "center",
    backgroundSize: "cover",
    position: "relative",
    borderRadius: e.mdBorderRadius,
    minHeight: "250px",
    "&::before": {
      content: '""',
      position: "absolute",
      top: 0,
      left: 0,
      right: 0,
      bottom: 0,
      borderRadius: "inherit",
      zIndex: 0,
      background: e.imageBackgroundGradient
    }
  },
  // 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
  },
  // Headline typography
  headlineText: {
    fontWeight: 500,
    lineHeight: "166%",
    letterSpacing: "1px",
    textAlign: { xs: "center", md: "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"]
  },
  // Title typography
  titleText: {
    fontWeight: 700,
    lineHeight: "133%",
    letterSpacing: "0px",
    textAlign: { xs: "center", md: "left" },
    fontSize: "1.5em",
    color: e.darkTextColor,
    fontFamily: e.fontFamilyPrimary
  },
  // Description typography
  descriptionText: {
    fontWeight: 400,
    lineHeight: "140%",
    letterSpacing: "0.15px",
    fontSize: "1.25em",
    textAlign: { xs: "center", md: "left" },
    color: e.secondaryColor,
    opacity: "70%",
    fontFamily: e.fontFamilyPrimary
  }
}), A = ({
  entity: e,
  headline: d,
  backgroundImage: m,
  imageBackgroundGradient: x,
  children: h,
  rulesDisplay: f
}) => {
  var s;
  const g = k(), n = F(), c = z(), o = ((s = e.branding) == null ? void 0 : s.colors) || null, y = (o == null ? void 0 : o.secondaryColor) || n.colorSchemes.dark.textSecondary, u = n.customFontFamily.light.primary, S = n.customFontFamily.light.secondary, b = n.customRadius.light.md, p = n.border.light.size, C = (o == null ? void 0 : o.borderColor) || n.colorSchemes.dark.secondaryContainer, T = n.colorSchemes.dark.textColor, t = R({
    spacingScale: c,
    brandingColors: o,
    secondaryColor: y,
    fontFamilyPrimary: u,
    fontFamilySecondary: S,
    mdBorderRadius: b,
    borderSize: p,
    borderColor: C,
    darkTextColor: T,
    backgroundImage: m,
    imageBackgroundGradient: x,
    isMobile: g
  });
  return /* @__PURE__ */ l(r, { sx: t.mainContainer, children: [
    /* @__PURE__ */ i(r, { children: /* @__PURE__ */ i(r, { sx: t.headlineSection, children: /* @__PURE__ */ i(r, { sx: t.headlineContent, children: /* @__PURE__ */ l(r, { sx: t.headlineContentInner, children: [
      /* @__PURE__ */ l(
        r,
        {
          sx: {
            display: "flex",
            alignItems: "center",
            gap: c["3xs"]
          },
          children: [
            /* @__PURE__ */ i(a, { level: "body-sm", sx: t.headlineText, children: d }),
            /* @__PURE__ */ i(
              v,
              {
                rulesDisplay: f,
                isOverlayVariant: !0,
                rules: e.rules || ""
              }
            )
          ]
        }
      ),
      /* @__PURE__ */ l(r, { sx: t.contentContainer, children: [
        /* @__PURE__ */ i(a, { level: "h4", sx: t.titleText, children: e.title }),
        /* @__PURE__ */ i(a, { level: "body-lg", sx: t.descriptionText, children: I(e.description) })
      ] })
    ] }) }) }) }),
    h
  ] });
};
export {
  A as O
};
