import { r as A, s as K, _ as t, t as Q, I as X, P as o, J as O, v as Io } from "./PrizeCard-C2El3VOB.js";
import * as m from "react";
import { s as g, u as Z, a as h, l as Oo, c as w } from "./Button-DPGn5NZd.js";
import { c as oo, F as eo } from "./CheckCircle-DSloUas8.js";
import { jsx as u, jsxs as G } from "react/jsx-runtime";
import { u as Po } from "./Textarea-CfUzSon9.js";
function _o(r) {
  return K("MuiCheckbox", r);
}
const x = A("MuiCheckbox", ["root", "checkbox", "action", "input", "label", "checked", "disabled", "focusVisible", "indeterminate", "colorPrimary", "colorDanger", "colorNeutral", "colorSuccess", "colorWarning", "colorContext", "sizeSm", "sizeMd", "sizeLg", "variantOutlined", "variantSoft", "variantSolid"]), Ho = oo(/* @__PURE__ */ u("path", {
  d: "M9 16.17 5.53 12.7a.9959.9959 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.18 4.18c.39.39 1.02.39 1.41 0L20.29 7.71c.39-.39.39-1.02 0-1.41a.9959.9959 0 0 0-1.41 0L9 16.17z"
}), "Check"), Ro = oo(/* @__PURE__ */ u("path", {
  d: "M19 13H5c-.55 0-1-.45-1-1s.45-1 1-1h14c.55 0 1 .45 1 1s-.45 1-1 1z"
}), "HorizontalRule"), Lo = ["checked", "uncheckedIcon", "checkedIcon", "label", "defaultChecked", "disabled", "disableIcon", "overlay", "id", "indeterminate", "indeterminateIcon", "name", "onBlur", "onChange", "onFocus", "onFocusVisible", "readOnly", "required", "value", "color", "variant", "size", "component", "slots", "slotProps"], No = (r) => {
  const {
    checked: e,
    disabled: l,
    disableIcon: n,
    focusVisible: i,
    color: s,
    variant: c,
    size: d,
    indeterminate: p
  } = r, v = {
    root: ["root", e && "checked", l && "disabled", i && "focusVisible", c && `variant${O(c)}`, s && `color${O(s)}`, d && `size${O(d)}`],
    checkbox: [
      "checkbox",
      e && "checked",
      p && "indeterminate",
      l && "disabled"
      // disabled class is necessary for displaying global variant
    ],
    action: [
      "action",
      e && "checked",
      n && l && "disabled",
      // add disabled class to action element for displaying global variant
      i && "focusVisible"
    ],
    input: ["input"],
    label: ["label"]
  };
  return w(v, _o, {});
}, Vo = g("span", {
  name: "JoyCheckbox",
  slot: "Root",
  overridesResolver: (r, e) => e.root
})(({
  ownerState: r,
  theme: e
}) => {
  var l, n, i;
  return t({
    "--Icon-fontSize": "var(--Checkbox-size)"
  }, r.size === "sm" && {
    "--Checkbox-size": "1rem",
    "& ~ *": {
      "--FormHelperText-margin": "0 0 0 1.5rem"
    },
    fontSize: e.vars.fontSize.sm,
    gap: "var(--Checkbox-gap, 0.5rem)"
  }, r.size === "md" && {
    "--Checkbox-size": "1.25rem",
    "& ~ *": {
      "--FormHelperText-margin": "0.25rem 0 0 1.875rem"
    },
    fontSize: e.vars.fontSize.md,
    gap: "var(--Checkbox-gap, 0.625rem)"
  }, r.size === "lg" && {
    "--Checkbox-size": "1.5rem",
    "& ~ *": {
      "--FormHelperText-margin": "0.375rem 0 0 2.25rem"
    },
    fontSize: e.vars.fontSize.lg,
    gap: "var(--Checkbox-gap, 0.75rem)"
  }, {
    position: r.overlay ? "initial" : "relative",
    display: "inline-flex",
    fontFamily: e.vars.fontFamily.body,
    lineHeight: "var(--Checkbox-size)",
    color: e.vars.palette.text.primary,
    [`&.${x.disabled}`]: {
      color: (l = e.variants.plainDisabled) == null || (l = l[r.color]) == null ? void 0 : l.color
    }
  }, r.disableIcon && {
    color: (n = e.variants[r.variant]) == null || (n = n[r.color]) == null ? void 0 : n.color,
    [`&.${x.disabled}`]: {
      color: (i = e.variants[`${r.variant}Disabled`]) == null || (i = i[r.color]) == null ? void 0 : i.color
    }
  });
}), Do = g("span", {
  name: "JoyCheckbox",
  slot: "Checkbox",
  overridesResolver: (r, e) => e.checkbox
})(({
  theme: r,
  ownerState: e
}) => {
  var l, n, i, s, c;
  const d = (l = r.variants[`${e.variant}`]) == null ? void 0 : l[e.color];
  return [t({
    "--Icon-color": e.color !== "neutral" || e.variant === "solid" ? "currentColor" : r.vars.palette.text.icon,
    boxSizing: "border-box",
    borderRadius: `min(${r.vars.radius.sm}, 0.25rem)`,
    width: "var(--Checkbox-size)",
    height: "var(--Checkbox-size)",
    display: "inline-flex",
    justifyContent: "center",
    alignItems: "center",
    flexShrink: 0
  }, e.disableIcon && {
    display: "contents"
  }, {
    [`&.${x.checked}, &.${x.indeterminate}`]: {
      "--Icon-color": "currentColor"
    }
  }), ...e.disableIcon ? [] : [t({}, d, {
    backgroundColor: (n = d == null ? void 0 : d.backgroundColor) != null ? n : r.vars.palette.background.surface
  }), {
    "&:hover": {
      "@media (hover: hover)": (i = r.variants[`${e.variant}Hover`]) == null ? void 0 : i[e.color]
    }
  }, {
    "&:active": (s = r.variants[`${e.variant}Active`]) == null ? void 0 : s[e.color]
  }, {
    [`&.${x.disabled}`]: (c = r.variants[`${e.variant}Disabled`]) == null ? void 0 : c[e.color]
  }]];
}), jo = g("span", {
  name: "JoyCheckbox",
  slot: "Action",
  overridesResolver: (r, e) => e.action
})(({
  theme: r,
  ownerState: e
}) => {
  var l, n, i, s;
  return [{
    borderRadius: `var(--Checkbox-actionRadius, ${e.overlay ? "var(--unstable_actionRadius, inherit)" : "inherit"})`,
    textAlign: "left",
    // prevent text-align inheritance
    position: "absolute",
    top: "calc(-1 * var(--variant-borderWidth, 0px))",
    // clickable on the border and focus outline does not move when checked/unchecked
    left: "calc(-1 * var(--variant-borderWidth, 0px))",
    bottom: "calc(-1 * var(--variant-borderWidth, 0px))",
    right: "calc(-1 * var(--variant-borderWidth, 0px))",
    zIndex: 1,
    // The action element usually cover the area of nearest positioned parent
    [r.focus.selector]: r.focus.default
  }, ...e.disableIcon ? [(l = r.variants[e.variant]) == null ? void 0 : l[e.color], {
    "&:hover": (n = r.variants[`${e.variant}Hover`]) == null ? void 0 : n[e.color]
  }, {
    "&:active": (i = r.variants[`${e.variant}Active`]) == null ? void 0 : i[e.color]
  }, {
    [`&.${x.disabled}`]: (s = r.variants[`${e.variant}Disabled`]) == null ? void 0 : s[e.color]
  }] : []];
}), Eo = g("input", {
  name: "JoyCheckbox",
  slot: "Input",
  overridesResolver: (r, e) => e.input
})(() => ({
  margin: 0,
  opacity: 0,
  position: "absolute",
  width: "100%",
  height: "100%",
  cursor: "pointer"
})), Mo = g("label", {
  name: "JoyCheckbox",
  slot: "Label",
  overridesResolver: (r, e) => e.label
})(({
  ownerState: r
}) => t({
  flex: 1,
  minWidth: 0
}, r.disableIcon && {
  zIndex: 1,
  // label should stay on top of the action.
  pointerEvents: "none"
  // makes hover ineffect.
})), Jo = /* @__PURE__ */ u(Ho, {}), Ao = /* @__PURE__ */ u(Ro, {}), So = /* @__PURE__ */ m.forwardRef(function(e, l) {
  var n, i, s, c, d;
  const p = Z({
    props: e,
    name: "JoyCheckbox"
  }), {
    checked: v,
    uncheckedIcon: y,
    checkedIcon: C = Jo,
    label: P,
    defaultChecked: L,
    disabled: N,
    disableIcon: _ = !1,
    overlay: b,
    id: k,
    indeterminate: z = !1,
    indeterminateIcon: H = Ao,
    name: F,
    onBlur: V,
    onChange: D,
    onFocus: j,
    onFocusVisible: E,
    readOnly: $,
    required: S,
    value: ro,
    color: no,
    variant: W,
    size: io = "md",
    component: lo,
    slots: ao = {},
    slotProps: to = {}
  } = p, so = Q(p, Lo), a = m.useContext(eo), co = (n = (i = e.disabled) != null ? i : a == null ? void 0 : a.disabled) != null ? n : N, uo = (s = (c = e.size) != null ? c : a == null ? void 0 : a.size) != null ? s : io;
  if (process.env.NODE_ENV !== "production") {
    const J = a == null ? void 0 : a.registerEffect;
    m.useEffect(() => {
      if (J)
        return J();
    }, [J]);
  }
  const q = X(k ?? (a == null ? void 0 : a.htmlFor)), po = {
    checked: v,
    defaultChecked: L,
    disabled: co,
    onBlur: V,
    onChange: D,
    onFocus: j,
    onFocusVisible: E
  }, {
    getInputProps: vo,
    checked: M,
    disabled: bo,
    focusVisible: mo
  } = Po(po), U = M || z, fo = U ? W || "solid" : W || "outlined", B = e.color || (a != null && a.error ? "danger" : (d = a == null ? void 0 : a.color) != null ? d : no), f = t({}, p, {
    checked: M,
    disabled: bo,
    disableIcon: _,
    overlay: b,
    focusVisible: mo,
    color: U ? B || "primary" : B || "neutral",
    variant: fo,
    size: uo
  }), T = No(f), I = t({}, so, {
    component: lo,
    slots: ao,
    slotProps: to
  }), [ho, xo] = h("root", {
    ref: l,
    className: T.root,
    elementType: Vo,
    externalForwardedProps: I,
    ownerState: f
  }), [go, yo] = h("checkbox", {
    className: T.checkbox,
    elementType: Do,
    externalForwardedProps: I,
    ownerState: f
  }), [Co, ko] = h("action", {
    className: T.action,
    elementType: jo,
    externalForwardedProps: I,
    ownerState: f
  }), [zo, Fo] = h("input", {
    additionalProps: t({
      id: q,
      name: F,
      value: ro,
      readOnly: $,
      role: void 0,
      required: S ?? (a == null ? void 0 : a.required),
      "aria-describedby": a == null ? void 0 : a["aria-describedby"]
    }, z && {
      // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-checked#values
      "aria-checked": "mixed"
    }),
    className: T.input,
    elementType: Eo,
    externalForwardedProps: I,
    getSlotProps: vo,
    ownerState: f
  }), [$o, To] = h("label", {
    additionalProps: {
      htmlFor: q
    },
    className: T.label,
    elementType: Mo,
    externalForwardedProps: I,
    ownerState: f
  });
  let R = y;
  return _ ? R = null : z ? R = H : M && (R = C), /* @__PURE__ */ G(ho, t({}, xo, {
    children: [/* @__PURE__ */ G(go, t({}, yo, {
      children: [/* @__PURE__ */ u(Co, t({}, ko, {
        children: /* @__PURE__ */ u(zo, t({}, Fo))
      })), R]
    })), P && /* @__PURE__ */ u(Oo.Provider, {
      value: !0,
      children: /* @__PURE__ */ u($o, t({}, To, {
        children: P
      }))
    })]
  }));
});
process.env.NODE_ENV !== "production" && (So.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * If `true`, the component is checked.
   */
  checked: o.bool,
  /**
   * The icon to display when the component is checked.
   * @default <CheckIcon />
   */
  checkedIcon: o.node,
  /**
   * @ignore
   */
  children: o.node,
  /**
   * Class name applied to the root element.
   */
  className: o.string,
  /**
   * The color of the component. It supports those theme colors that make sense for this component.
   * @default 'neutral'
   */
  color: o.oneOfType([o.oneOf(["danger", "neutral", "primary", "success", "warning"]), o.string]),
  /**
   * The component used for the root node.
   * Either a string to use a HTML element or a component.
   */
  component: o.elementType,
  /**
   * The default checked state. Use when the component is not controlled.
   */
  defaultChecked: o.bool,
  /**
   * If `true`, the component is disabled.
   */
  disabled: o.bool,
  /**
   * If `true`, the checked icon is removed and the selected variant is applied on the `action` element instead.
   * @default false
   */
  disableIcon: o.bool,
  /**
   * @ignore
   */
  id: o.string,
  /**
   * If `true`, the component appears indeterminate.
   * This does not set the native input element to indeterminate due
   * to inconsistent behavior across browsers.
   * However, we set a `data-indeterminate` attribute on the `input`.
   * @default false
   */
  indeterminate: o.bool,
  /**
   * The icon to display when the component is indeterminate.
   * @default <IndeterminateIcon />
   */
  indeterminateIcon: o.node,
  /**
   * The label element next to the checkbox.
   */
  label: o.node,
  /**
   * The `name` attribute of the input.
   */
  name: o.string,
  /**
   * @ignore
   */
  onBlur: o.func,
  /**
   * Callback fired when the state is changed.
   *
   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
   * You can pull out the new value by accessing `event.target.value` (string).
   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
   */
  onChange: o.func,
  /**
   * @ignore
   */
  onFocus: o.func,
  /**
   * @ignore
   */
  onFocusVisible: o.func,
  /**
   * If `true`, the root element's position is set to initial which allows the action area to fill the nearest positioned parent.
   * This prop is useful for composing Checkbox with ListItem component.
   * @default false
   */
  overlay: o.bool,
  /**
   * If `true`, the component is read only.
   */
  readOnly: o.bool,
  /**
   * If `true`, the `input` element is required.
   */
  required: o.bool,
  /**
   * The size of the component.
   * @default 'md'
   */
  size: o.oneOf(["sm", "md", "lg"]),
  /**
   * The props used for each slot inside.
   * @default {}
   */
  slotProps: o.shape({
    action: o.oneOfType([o.func, o.object]),
    checkbox: o.oneOfType([o.func, o.object]),
    input: o.oneOfType([o.func, o.object]),
    label: o.oneOfType([o.func, o.object]),
    root: o.oneOfType([o.func, o.object])
  }),
  /**
   * The components used for each slot inside.
   * @default {}
   */
  slots: o.shape({
    action: o.elementType,
    checkbox: o.elementType,
    input: o.elementType,
    label: o.elementType,
    root: o.elementType
  }),
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
  /**
   * The icon when `checked` is false.
   */
  uncheckedIcon: o.node,
  /**
   * The value of the component. The DOM API casts this to a string.
   * The browser uses "on" as the default value.
   */
  value: o.oneOfType([o.arrayOf(o.string), o.number, o.string]),
  /**
   * The [global variant](https://mui.com/joy-ui/main-features/global-variants/) to use.
   * @default 'solid'
   */
  variant: o.oneOf(["outlined", "plain", "soft", "solid"])
});
function Wo(r) {
  return K("MuiFormControl", r);
}
const Y = A("MuiFormControl", ["root", "error", "disabled", "colorPrimary", "colorNeutral", "colorDanger", "colorSuccess", "colorWarning", "sizeSm", "sizeMd", "sizeLg", "horizontal", "vertical"]), qo = A("MuiSwitch", ["root", "checked", "disabled", "action", "input", "thumb", "track", "focusVisible", "readOnly", "colorPrimary", "colorDanger", "colorSuccess", "colorWarning", "colorContext", "sizeSm", "sizeMd", "sizeLg", "variantOutlined", "variantSoft", "variantSolid", "startDecorator", "endDecorator"]), Uo = ["id", "className", "component", "disabled", "required", "error", "color", "size", "orientation", "slots", "slotProps"], Bo = (r) => {
  const {
    disabled: e,
    error: l,
    size: n,
    color: i,
    orientation: s
  } = r, c = {
    root: ["root", s, e && "disabled", l && "error", i && `color${O(i)}`, n && `size${O(n)}`]
  };
  return w(c, Wo, {});
}, Go = g("div", {
  name: "JoyFormControl",
  slot: "Root",
  overridesResolver: (r, e) => e.root
})(({
  theme: r,
  ownerState: e
}) => {
  var l, n, i;
  return t({
    "--unstable_RadioGroup-margin": "0.5rem 0",
    "--FormLabel-alignSelf": e.orientation === "horizontal" ? "align-items" : "flex-start",
    "--FormLabel-asteriskColor": r.vars.palette.danger[500]
  }, e.size === "sm" && {
    "--FormLabel-fontSize": r.vars.fontSize.xs,
    "--FormLabel-lineHeight": r.vars.lineHeight.xl,
    "--FormLabel-margin": e.orientation === "horizontal" ? "0 0.5rem 0 0" : "0 0 0.25rem 0",
    "--FormHelperText-fontSize": r.vars.fontSize.xs,
    "--FormHelperText-lineHeight": r.vars.lineHeight.xl
  }, e.size === "md" && {
    "--FormLabel-fontSize": r.vars.fontSize.sm,
    "--FormLabel-lineHeight": r.vars.lineHeight.sm,
    "--FormLabel-margin": e.orientation === "horizontal" ? "0 0.75rem 0 0" : "0 0 0.375rem 0",
    "--FormHelperText-fontSize": r.vars.fontSize.sm,
    "--FormHelperText-lineHeight": r.vars.lineHeight.sm
  }, e.size === "lg" && {
    "--FormLabel-fontSize": r.vars.fontSize.md,
    "--FormLabel-lineHeight": r.vars.lineHeight.md,
    "--FormLabel-margin": e.orientation === "horizontal" ? "0 1rem 0 0" : "0 0 0.5rem 0",
    "--FormHelperText-fontSize": r.vars.fontSize.sm,
    "--FormHelperText-lineHeight": r.vars.lineHeight.sm
  }, e.color && {
    "--FormHelperText-color": (l = r.vars.palette[e.color]) == null ? void 0 : l[500]
  }, {
    "--FormHelperText-margin": "0.375rem 0 0 0",
    [`&.${Y.error}`]: {
      "--FormHelperText-color": r.vars.palette.danger[500]
    },
    [`&.${Y.disabled}`]: {
      "--FormLabel-color": (n = r.variants.plainDisabled) == null || (n = n[e.color || "neutral"]) == null ? void 0 : n.color,
      "--FormHelperText-color": (i = r.variants.plainDisabled) == null || (i = i[e.color || "neutral"]) == null ? void 0 : i.color
    },
    display: "flex",
    position: "relative",
    // for keeping the control action area, for example Switch
    flexDirection: e.orientation === "horizontal" ? "row" : "column"
  }, e.orientation === "horizontal" && {
    [`& > label ~ .${qo.root}`]: {
      "--unstable_Switch-margin": "0 0 0 auto"
    }
  });
}), Yo = /* @__PURE__ */ m.forwardRef(function(e, l) {
  const n = Z({
    props: e,
    name: "JoyFormControl"
  }), {
    id: i,
    className: s,
    component: c = "div",
    disabled: d = !1,
    required: p = !1,
    error: v = !1,
    color: y,
    size: C = "md",
    orientation: P = "vertical",
    slots: L = {},
    slotProps: N = {}
  } = n, _ = Q(n, Uo), b = X(i), [k, z] = m.useState(null), H = t({}, n, {
    id: b,
    component: c,
    color: y,
    disabled: d,
    error: v,
    required: p,
    size: C,
    orientation: P
  });
  let F;
  if (process.env.NODE_ENV !== "production") {
    const $ = m.useRef(!1);
    F = () => ($.current && console.error(["Joy: A FormControl can contain only one control component (Autocomplete | Input | Textarea | Select | RadioGroup)", "You should not mix those components inside a single FormControl instance"].join(`
`)), $.current = !0, () => {
      $.current = !1;
    });
  }
  const V = Bo(H), [D, j] = h("root", {
    ref: l,
    className: Io(V.root, s),
    elementType: Go,
    externalForwardedProps: t({}, _, {
      component: c,
      slots: L,
      slotProps: N
    }),
    ownerState: H
  }), E = m.useMemo(() => ({
    disabled: d,
    required: p,
    error: v,
    color: y,
    size: C,
    htmlFor: b,
    labelId: `${b}-label`,
    "aria-describedby": k ? `${b}-helper-text` : void 0,
    setHelperText: z,
    registerEffect: F
  }), [y, d, v, k, b, F, p, C]);
  return /* @__PURE__ */ u(eo.Provider, {
    value: E,
    children: /* @__PURE__ */ u(D, t({}, j))
  });
});
process.env.NODE_ENV !== "production" && (Yo.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * The content of the component.
   */
  children: o.node,
  /**
   * @ignore
   */
  className: o.string,
  /**
   * The color of the component. It supports those theme colors that make sense for this component.
   */
  color: o.oneOfType([o.oneOf(["danger", "neutral", "primary", "success", "warning"]), o.string]),
  /**
   * The component used for the root node.
   * Either a string to use a HTML element or a component.
   */
  component: o.elementType,
  /**
   * If `true`, the children are in disabled state.
   * @default false
   */
  disabled: o.bool,
  /**
   * If `true`, the children will indicate an error.
   * @default false
   */
  error: o.bool,
  /**
   * @ignore
   */
  id: o.string,
  /**
   * The content direction flow.
   * @default 'vertical'
   */
  orientation: o.oneOf(["horizontal", "vertical"]),
  /**
   * If `true`, the user must specify a value for the input before the owning form can be submitted.
   * If `true`, the asterisk appears on the FormLabel.
   * @default false
   */
  required: o.bool,
  /**
   * The size of the component.
   * @default 'md'
   */
  size: o.oneOfType([o.oneOf(["sm", "md", "lg"]), o.string]),
  /**
   * The props used for each slot inside.
   * @default {}
   */
  slotProps: o.shape({
    root: o.oneOfType([o.func, o.object])
  }),
  /**
   * The components used for each slot inside.
   * @default {}
   */
  slots: o.shape({
    root: o.elementType
  }),
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
});
export {
  So as C,
  Yo as F
};
