import { P as t, M as ge, _ as y, s as K, r as q, t as J, v as ae, J as w, I as Z } from "./PrizeCard-C2El3VOB.js";
import * as l from "react";
import { k as ie, d as se, p as ve, w as H, f as be, s as L, r as he, t as ye, v as Ce, u as Y, a as V, h as le, c as G, P as xe, H as Ee } from "./Button-DPGn5NZd.js";
import { jsxs as de, jsx as F } from "react/jsx-runtime";
import { o as X, a as ee } from "./useEventCallback-Dqgs56Ox.js";
function Te(o) {
  const {
    prototype: e = {}
  } = o;
  return !!e.isReactComponent;
}
function ce(o, e, r, n, i) {
  const a = o[e], s = i || e;
  if (a == null || // When server-side rendering React doesn't warn either.
  // This is not an accurate check for SSR.
  // This is only in place for Emotion compat.
  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
  typeof window > "u")
    return null;
  let c;
  const u = a.type;
  return typeof u == "function" && !Te(u) && (c = "Did you accidentally use a plain function component for an element instead?"), c !== void 0 ? new Error(`Invalid ${n} \`${s}\` supplied to \`${r}\`. Expected an element that can hold a ref. ${c} For more information see https://mui.com/r/caveat-with-refs-guide`) : null;
}
const Q = ie(t.element, ce);
Q.isRequired = ie(t.element.isRequired, ce);
function oe(...o) {
  return o.reduce((e, r) => r == null ? e : function(...i) {
    e.apply(this, i), r.apply(this, i);
  }, () => {
  });
}
function Re(o) {
  const e = o.documentElement.clientWidth;
  return Math.abs(window.innerWidth - e);
}
const Me = ["input", "select", "textarea", "a[href]", "button", "[tabindex]", "audio[controls]", "video[controls]", '[contenteditable]:not([contenteditable="false"])'].join(",");
function Oe(o) {
  const e = parseInt(o.getAttribute("tabindex") || "", 10);
  return Number.isNaN(e) ? o.contentEditable === "true" || (o.nodeName === "AUDIO" || o.nodeName === "VIDEO" || o.nodeName === "DETAILS") && o.getAttribute("tabindex") === null ? 0 : o.tabIndex : e;
}
function De(o) {
  if (o.tagName !== "INPUT" || o.type !== "radio" || !o.name)
    return !1;
  const e = (n) => o.ownerDocument.querySelector(`input[type="radio"]${n}`);
  let r = e(`[name="${o.name}"]:checked`);
  return r || (r = e(`[name="${o.name}"]`)), r !== o;
}
function Pe(o) {
  return !(o.disabled || o.tagName === "INPUT" && o.type === "hidden" || De(o));
}
function Ne(o) {
  const e = [], r = [];
  return Array.from(o.querySelectorAll(Me)).forEach((n, i) => {
    const a = Oe(n);
    a === -1 || !Pe(n) || (a === 0 ? e.push(n) : r.push({
      documentOrder: i,
      tabIndex: a,
      node: n
    }));
  }), r.sort((n, i) => n.tabIndex === i.tabIndex ? n.documentOrder - i.documentOrder : n.tabIndex - i.tabIndex).map((n) => n.node).concat(e);
}
function ke() {
  return !0;
}
function U(o) {
  const {
    children: e,
    disableAutoFocus: r = !1,
    disableEnforceFocus: n = !1,
    disableRestoreFocus: i = !1,
    getTabbable: a = Ne,
    isEnabled: s = ke,
    open: c
  } = o, u = l.useRef(!1), C = l.useRef(null), p = l.useRef(null), b = l.useRef(null), O = l.useRef(null), T = l.useRef(!1), f = l.useRef(null), N = se(ve(e), f), I = l.useRef(null);
  l.useEffect(() => {
    !c || !f.current || (T.current = !r);
  }, [r, c]), l.useEffect(() => {
    if (!c || !f.current)
      return;
    const d = H(f.current);
    return f.current.contains(d.activeElement) || (f.current.hasAttribute("tabIndex") || (process.env.NODE_ENV !== "production" && console.error(["MUI: The modal content node does not accept focus.", 'For the benefit of assistive technologies, the tabIndex of the node is being set to "-1".'].join(`
`)), f.current.setAttribute("tabIndex", "-1")), T.current && f.current.focus()), () => {
      i || (b.current && b.current.focus && (u.current = !0, b.current.focus()), b.current = null);
    };
  }, [c]), l.useEffect(() => {
    if (!c || !f.current)
      return;
    const d = H(f.current), m = (E) => {
      I.current = E, !(n || !s() || E.key !== "Tab") && d.activeElement === f.current && E.shiftKey && (u.current = !0, p.current && p.current.focus());
    }, x = () => {
      const E = f.current;
      if (E === null)
        return;
      if (!d.hasFocus() || !s() || u.current) {
        u.current = !1;
        return;
      }
      if (E.contains(d.activeElement) || n && d.activeElement !== C.current && d.activeElement !== p.current)
        return;
      if (d.activeElement !== O.current)
        O.current = null;
      else if (O.current !== null)
        return;
      if (!T.current)
        return;
      let M = [];
      if ((d.activeElement === C.current || d.activeElement === p.current) && (M = a(f.current)), M.length > 0) {
        var P, g;
        const W = !!((P = I.current) != null && P.shiftKey && ((g = I.current) == null ? void 0 : g.key) === "Tab"), k = M[0], S = M[M.length - 1];
        typeof k != "string" && typeof S != "string" && (W ? S.focus() : k.focus());
      } else
        E.focus();
    };
    d.addEventListener("focusin", x), d.addEventListener("keydown", m, !0);
    const R = setInterval(() => {
      d.activeElement && d.activeElement.tagName === "BODY" && x();
    }, 50);
    return () => {
      clearInterval(R), d.removeEventListener("focusin", x), d.removeEventListener("keydown", m, !0);
    };
  }, [r, n, i, s, c, a]);
  const z = (d) => {
    b.current === null && (b.current = d.relatedTarget), T.current = !0, O.current = d.target;
    const m = e.props.onFocus;
    m && m(d);
  }, D = (d) => {
    b.current === null && (b.current = d.relatedTarget), T.current = !0;
  };
  return /* @__PURE__ */ de(l.Fragment, {
    children: [/* @__PURE__ */ F("div", {
      tabIndex: c ? 0 : -1,
      onFocus: D,
      ref: C,
      "data-testid": "sentinelStart"
    }), /* @__PURE__ */ l.cloneElement(e, {
      ref: N,
      onFocus: z
    }), /* @__PURE__ */ F("div", {
      tabIndex: c ? 0 : -1,
      onFocus: D,
      ref: p,
      "data-testid": "sentinelEnd"
    })]
  });
}
process.env.NODE_ENV !== "production" && (U.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * A single child content element.
   */
  children: Q,
  /**
   * If `true`, the focus trap will not automatically shift focus to itself when it opens, and
   * replace it to the last focused element when it closes.
   * This also works correctly with any focus trap children that have the `disableAutoFocus` prop.
   *
   * Generally this should never be set to `true` as it makes the focus trap less
   * accessible to assistive technologies, like screen readers.
   * @default false
   */
  disableAutoFocus: t.bool,
  /**
   * If `true`, the focus trap will not prevent focus from leaving the focus trap while open.
   *
   * Generally this should never be set to `true` as it makes the focus trap less
   * accessible to assistive technologies, like screen readers.
   * @default false
   */
  disableEnforceFocus: t.bool,
  /**
   * If `true`, the focus trap will not restore focus to previously focused element once
   * focus trap is hidden or unmounted.
   * @default false
   */
  disableRestoreFocus: t.bool,
  /**
   * Returns an array of ordered tabbable nodes (i.e. in tab order) within the root.
   * For instance, you can provide the "tabbable" npm dependency.
   * @param {HTMLElement} root
   */
  getTabbable: t.func,
  /**
   * This prop extends the `open` prop.
   * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop.
   * This prop should be memoized.
   * It can be used to support multiple focus trap mounted at the same time.
   * @default function defaultIsEnabled(): boolean {
   *   return true;
   * }
   */
  isEnabled: t.func,
  /**
   * If `true`, focus is locked.
   */
  open: t.bool.isRequired
});
process.env.NODE_ENV !== "production" && (U.propTypes = ge(U.propTypes));
function Ie(o) {
  const e = H(o);
  return e.body === o ? X(o).innerWidth > e.documentElement.clientWidth : o.scrollHeight > o.clientHeight;
}
function B(o, e) {
  e ? o.setAttribute("aria-hidden", "true") : o.removeAttribute("aria-hidden");
}
function te(o) {
  return parseInt(X(o).getComputedStyle(o).paddingRight, 10) || 0;
}
function ze(o) {
  const r = ["TEMPLATE", "SCRIPT", "STYLE", "LINK", "MAP", "META", "NOSCRIPT", "PICTURE", "COL", "COLGROUP", "PARAM", "SLOT", "SOURCE", "TRACK"].indexOf(o.tagName) !== -1, n = o.tagName === "INPUT" && o.getAttribute("type") === "hidden";
  return r || n;
}
function ne(o, e, r, n, i) {
  const a = [e, r, ...n];
  [].forEach.call(o.children, (s) => {
    const c = a.indexOf(s) === -1, u = !ze(s);
    c && u && B(s, i);
  });
}
function j(o, e) {
  let r = -1;
  return o.some((n, i) => e(n) ? (r = i, !0) : !1), r;
}
function Fe(o, e) {
  const r = [], n = o.container;
  if (!e.disableScrollLock) {
    if (Ie(n)) {
      const s = Re(H(n));
      r.push({
        value: n.style.paddingRight,
        property: "padding-right",
        el: n
      }), n.style.paddingRight = `${te(n) + s}px`;
      const c = H(n).querySelectorAll(".mui-fixed");
      [].forEach.call(c, (u) => {
        r.push({
          value: u.style.paddingRight,
          property: "padding-right",
          el: u
        }), u.style.paddingRight = `${te(u) + s}px`;
      });
    }
    let a;
    if (n.parentNode instanceof DocumentFragment)
      a = H(n).body;
    else {
      const s = n.parentElement, c = X(n);
      a = (s == null ? void 0 : s.nodeName) === "HTML" && c.getComputedStyle(s).overflowY === "scroll" ? s : n;
    }
    r.push({
      value: a.style.overflow,
      property: "overflow",
      el: a
    }, {
      value: a.style.overflowX,
      property: "overflow-x",
      el: a
    }, {
      value: a.style.overflowY,
      property: "overflow-y",
      el: a
    }), a.style.overflow = "hidden";
  }
  return () => {
    r.forEach(({
      value: a,
      el: s,
      property: c
    }) => {
      a ? s.style.setProperty(c, a) : s.style.removeProperty(c);
    });
  };
}
function We(o) {
  const e = [];
  return [].forEach.call(o.children, (r) => {
    r.getAttribute("aria-hidden") === "true" && e.push(r);
  }), e;
}
class Se {
  constructor() {
    this.containers = void 0, this.modals = void 0, this.modals = [], this.containers = [];
  }
  add(e, r) {
    let n = this.modals.indexOf(e);
    if (n !== -1)
      return n;
    n = this.modals.length, this.modals.push(e), e.modalRef && B(e.modalRef, !1);
    const i = We(r);
    ne(r, e.mount, e.modalRef, i, !0);
    const a = j(this.containers, (s) => s.container === r);
    return a !== -1 ? (this.containers[a].modals.push(e), n) : (this.containers.push({
      modals: [e],
      container: r,
      restore: null,
      hiddenSiblings: i
    }), n);
  }
  mount(e, r) {
    const n = j(this.containers, (a) => a.modals.indexOf(e) !== -1), i = this.containers[n];
    i.restore || (i.restore = Fe(i, r));
  }
  remove(e, r = !0) {
    const n = this.modals.indexOf(e);
    if (n === -1)
      return n;
    const i = j(this.containers, (s) => s.modals.indexOf(e) !== -1), a = this.containers[i];
    if (a.modals.splice(a.modals.indexOf(e), 1), this.modals.splice(n, 1), a.modals.length === 0)
      a.restore && a.restore(), e.modalRef && B(e.modalRef, r), ne(a.container, e.mount, e.modalRef, a.hiddenSiblings, !1), this.containers.splice(i, 1);
    else {
      const s = a.modals[a.modals.length - 1];
      s.modalRef && B(s.modalRef, !1);
    }
    return n;
  }
  isTopModal(e) {
    return this.modals.length > 0 && this.modals[this.modals.length - 1] === e;
  }
}
function Ae(o) {
  return typeof o == "function" ? o() : o;
}
function $e(o) {
  return o ? o.props.hasOwnProperty("in") : !1;
}
const we = new Se();
function He(o) {
  const {
    container: e,
    disableEscapeKeyDown: r = !1,
    disableScrollLock: n = !1,
    // @ts-ignore internal logic - Base UI supports the manager as a prop too
    manager: i = we,
    closeAfterTransition: a = !1,
    onTransitionEnter: s,
    onTransitionExited: c,
    children: u,
    onClose: C,
    open: p,
    rootRef: b
  } = o, O = l.useRef({}), T = l.useRef(null), f = l.useRef(null), N = se(f, b), [I, z] = l.useState(!p), D = $e(u);
  let d = !0;
  (o["aria-hidden"] === "false" || o["aria-hidden"] === !1) && (d = !1);
  const m = () => H(T.current), x = () => (O.current.modalRef = f.current, O.current.mount = T.current, O.current), R = () => {
    i.mount(x(), {
      disableScrollLock: n
    }), f.current && (f.current.scrollTop = 0);
  }, E = ee(() => {
    const h = Ae(e) || m().body;
    i.add(x(), h), f.current && R();
  }), M = l.useCallback(() => i.isTopModal(x()), [i]), P = ee((h) => {
    T.current = h, h && (p && M() ? R() : f.current && B(f.current, d));
  }), g = l.useCallback(() => {
    i.remove(x(), d);
  }, [d, i]);
  l.useEffect(() => () => {
    g();
  }, [g]), l.useEffect(() => {
    p ? E() : (!D || !a) && g();
  }, [p, g, D, a, E]);
  const W = (h) => (v) => {
    var A;
    (A = h.onKeyDown) == null || A.call(h, v), !(v.key !== "Escape" || v.which === 229 || // Wait until IME is settled.
    !M()) && (r || (v.stopPropagation(), C && C(v, "escapeKeyDown")));
  }, k = (h) => (v) => {
    var A;
    (A = h.onClick) == null || A.call(h, v), v.target === v.currentTarget && C && C(v, "backdropClick");
  };
  return {
    getRootProps: (h = {}) => {
      const v = be(o);
      delete v.onTransitionEnter, delete v.onTransitionExited;
      const A = y({}, v, h);
      return y({
        role: "presentation"
      }, A, {
        onKeyDown: W(A),
        ref: N
      });
    },
    getBackdropProps: (h = {}) => {
      const v = h;
      return y({
        "aria-hidden": !0
      }, v, {
        onClick: k(v),
        open: p
      });
    },
    getTransitionProps: () => {
      const h = () => {
        z(!1), s && s();
      }, v = () => {
        z(!0), c && c(), a && g();
      };
      return {
        onEnter: oe(h, u == null ? void 0 : u.props.onEnter),
        onExited: oe(v, u == null ? void 0 : u.props.onExited)
      };
    },
    rootRef: N,
    portalRef: P,
    isTopModal: M,
    exited: I,
    hasTransition: D
  };
}
function Le(o) {
  return K("MuiCard", o);
}
const lo = q("MuiCard", ["root", "colorPrimary", "colorNeutral", "colorDanger", "colorSuccess", "colorWarning", "colorContext", "variantPlain", "variantOutlined", "variantSoft", "variantSolid", "sizeSm", "sizeMd", "sizeLg", "horizontal", "vertical"]), _e = ["className", "color", "component", "invertedColors", "size", "variant", "children", "orientation", "slots", "slotProps"], Be = (o) => {
  const {
    size: e,
    variant: r,
    color: n,
    orientation: i
  } = o, a = {
    root: ["root", i, r && `variant${w(r)}`, n && `color${w(n)}`, e && `size${w(e)}`]
  };
  return G(a, Le, {});
}, ue = L("div")(({
  theme: o,
  ownerState: e
}) => {
  var r;
  const {
    p: n,
    padding: i,
    borderRadius: a
  } = he({
    theme: o,
    ownerState: e
  }, ["p", "padding", "borderRadius"]);
  return [y({
    "--Icon-color": e.color !== "neutral" || e.variant === "solid" ? "currentColor" : o.vars.palette.text.icon,
    // a context variable for any child component
    "--Card-childRadius": "max((var(--Card-radius) - var(--variant-borderWidth, 0px)) - var(--Card-padding), min(var(--Card-padding) / 2, (var(--Card-radius) - var(--variant-borderWidth, 0px)) / 2))",
    // AspectRatio integration
    "--AspectRatio-radius": "var(--Card-childRadius)",
    // Link integration
    "--unstable_actionMargin": "calc(-1 * var(--variant-borderWidth, 0px))",
    // Link, Radio, Checkbox integration
    "--unstable_actionRadius": "var(--Card-radius)",
    // CardCover integration
    "--CardCover-radius": "calc(var(--Card-radius) - var(--variant-borderWidth, 0px))",
    // CardOverflow integration
    "--CardOverflow-offset": "calc(-1 * var(--Card-padding))",
    "--CardOverflow-radius": "calc(var(--Card-radius) - var(--variant-borderWidth, 0px))",
    // Divider integration
    "--Divider-inset": "calc(-1 * var(--Card-padding))"
  }, e.size === "sm" && {
    "--Card-radius": o.vars.radius.sm,
    "--Card-padding": "0.625rem",
    gap: "0.5rem"
  }, e.size === "md" && {
    "--Card-radius": o.vars.radius.md,
    "--Card-padding": "1rem",
    gap: "0.75rem 1rem"
  }, e.size === "lg" && {
    "--Card-radius": o.vars.radius.lg,
    "--Card-padding": "1.5rem",
    gap: "1rem 1.5rem"
  }, {
    padding: "var(--Card-padding)",
    borderRadius: "var(--Card-radius)",
    backgroundColor: o.vars.palette.background.surface,
    position: "relative",
    display: "flex",
    flexDirection: e.orientation === "horizontal" ? "row" : "column"
  }, o.typography[`body-${e.size}`], e.variant === "solid" && e.color && e.invertedColors && ye(e.color)(o), e.variant === "soft" && e.color && e.invertedColors && Ce(e.color)(o), (r = o.variants[e.variant]) == null ? void 0 : r[e.color]), n !== void 0 && {
    "--Card-padding": n
  }, i !== void 0 && {
    "--Card-padding": i
  }, a !== void 0 && {
    "--Card-radius": a
  }];
}), Ve = L(ue, {
  name: "JoyCard",
  slot: "Root",
  overridesResolver: (o, e) => e.root
})({}), Ue = /* @__PURE__ */ l.forwardRef(function(e, r) {
  const n = Y({
    props: e,
    name: "JoyCard"
  }), {
    className: i,
    color: a = "neutral",
    component: s = "div",
    invertedColors: c = !1,
    size: u = "md",
    variant: C = "outlined",
    children: p,
    orientation: b = "vertical",
    slots: O = {},
    slotProps: T = {}
  } = n, f = J(n, _e), N = y({}, n, {
    color: a,
    component: s,
    orientation: b,
    size: u,
    variant: C,
    invertedColors: c
  }), I = Be(N), z = y({}, f, {
    component: s,
    slots: O,
    slotProps: T
  }), [D, d] = V("root", {
    ref: r,
    className: ae(I.root, i),
    elementType: Ve,
    externalForwardedProps: z,
    ownerState: N
  });
  return /* @__PURE__ */ F(D, y({}, d, {
    children: l.Children.map(p, (m, x) => {
      if (!/* @__PURE__ */ l.isValidElement(m))
        return m;
      const R = {};
      if (le(m, ["Divider"])) {
        var E, M;
        const P = m.props;
        R.inset = (E = P == null ? void 0 : P.inset) != null ? E : "context";
        const g = b === "vertical" ? "horizontal" : "vertical";
        R.orientation = (M = P == null ? void 0 : P.orientation) != null ? M : g;
      }
      return x === 0 && (R["data-first-child"] = ""), x === l.Children.count(p) - 1 && (R["data-last-child"] = ""), /* @__PURE__ */ l.cloneElement(m, R);
    })
  }));
});
process.env.NODE_ENV !== "production" && (Ue.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * Used to render icon or text elements inside the Card if `src` is not set.
   * This can be an element, or just a string.
   */
  children: t.node,
  /**
   * @ignore
   */
  className: t.string,
  /**
   * The color of the component. It supports those theme colors that make sense for this component.
   * @default 'neutral'
   */
  color: t.oneOfType([t.oneOf(["danger", "neutral", "primary", "success", "warning"]), t.string]),
  /**
   * The component used for the root node.
   * Either a string to use a HTML element or a component.
   */
  component: t.elementType,
  /**
   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
   * @default false
   */
  invertedColors: t.bool,
  /**
   * The component orientation.
   * @default 'vertical'
   */
  orientation: t.oneOf(["horizontal", "vertical"]),
  /**
   * The size of the component.
   * It accepts theme values between 'sm' and 'lg'.
   * @default 'md'
   */
  size: t.oneOfType([t.oneOf(["lg", "md", "sm"]), t.string]),
  /**
   * The props used for each slot inside.
   * @default {}
   */
  slotProps: t.shape({
    root: t.oneOfType([t.func, t.object])
  }),
  /**
   * The components used for each slot inside.
   * @default {}
   */
  slots: t.shape({
    root: t.elementType
  }),
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
  /**
   * The [global variant](https://mui.com/joy-ui/main-features/global-variants/) to use.
   * @default 'outlined'
   */
  variant: t.oneOfType([t.oneOf(["outlined", "plain", "soft", "solid"]), t.string])
});
function je(o) {
  return K("MuiModalDialog", o);
}
const co = q("MuiModalDialog", ["root", "colorPrimary", "colorNeutral", "colorDanger", "colorSuccess", "colorWarning", "colorContext", "variantPlain", "variantOutlined", "variantSoft", "variantSolid", "sizeSm", "sizeMd", "sizeLg", "layoutCenter", "layoutFullscreen"]), fe = /* @__PURE__ */ l.createContext(void 0);
process.env.NODE_ENV !== "production" && (fe.displayName = "ModalDialogVariantColorContext");
const pe = /* @__PURE__ */ l.createContext(void 0);
process.env.NODE_ENV !== "production" && (pe.displayName = "ModalDialogSizeContext");
function Ke(o) {
  return K("MuiModal", o);
}
q("MuiModal", ["root", "hidden", "backdrop"]);
const me = /* @__PURE__ */ l.createContext(void 0);
process.env.NODE_ENV !== "production" && (me.displayName = "CloseModalContext");
const qe = ["children", "container", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onClose", "onKeyDown", "open", "component", "slots", "slotProps"], Je = (o) => {
  const {
    open: e
  } = o;
  return G({
    root: ["root", !e && "hidden"],
    backdrop: ["backdrop"]
  }, Ke, {});
}, Ye = L("div")(({
  ownerState: o,
  theme: e
}) => y({
  "--unstable_popup-zIndex": `calc(${e.vars.zIndex.modal} + 1)`,
  '& ~ [role="listbox"]': {
    // target all the listbox (Autocomplete, Menu, Select, etc.) that uses portal
    "--unstable_popup-zIndex": `calc(${e.vars.zIndex.modal} + 1)`
  },
  position: "fixed",
  zIndex: e.vars.zIndex.modal,
  right: 0,
  bottom: 0,
  top: 0,
  left: 0
}, !o.open && {
  visibility: "hidden"
})), Ge = L(Ye, {
  name: "JoyModal",
  slot: "Root",
  overridesResolver: (o, e) => e.root
})({}), Xe = L("div")(({
  theme: o
}) => ({
  zIndex: -1,
  position: "fixed",
  right: 0,
  bottom: 0,
  top: 0,
  left: 0,
  backgroundColor: o.vars.palette.background.backdrop,
  WebkitTapHighlightColor: "transparent",
  backdropFilter: "blur(8px)"
})), Qe = L(Xe, {
  name: "JoyModal",
  slot: "Backdrop",
  overridesResolver: (o, e) => e.backdrop
})({}), Ze = /* @__PURE__ */ l.forwardRef(function(e, r) {
  const n = Y({
    props: e,
    name: "JoyModal"
  }), {
    children: i,
    container: a,
    disableAutoFocus: s = !1,
    disableEnforceFocus: c = !1,
    disableEscapeKeyDown: u = !1,
    disablePortal: C = !1,
    disableRestoreFocus: p = !1,
    disableScrollLock: b = !1,
    hideBackdrop: O = !1,
    keepMounted: T = !1,
    onClose: f,
    open: N,
    component: I,
    slots: z = {},
    slotProps: D = {}
  } = n, d = J(n, qe), m = y({}, n, {
    disableAutoFocus: s,
    disableEnforceFocus: c,
    disableEscapeKeyDown: u,
    disablePortal: C,
    disableRestoreFocus: p,
    disableScrollLock: b,
    hideBackdrop: O,
    keepMounted: T
  }), {
    getRootProps: x,
    getBackdropProps: R,
    rootRef: E,
    portalRef: M,
    isTopModal: P
  } = He(y({}, m, {
    rootRef: r
  })), g = Je(m), W = y({}, d, {
    component: I,
    slots: z,
    slotProps: D
  }), [k, S] = V("root", {
    ref: E,
    className: g.root,
    elementType: Ge,
    externalForwardedProps: W,
    getSlotProps: x,
    ownerState: m
  }), [_, $] = V("backdrop", {
    className: g.backdrop,
    elementType: Qe,
    externalForwardedProps: W,
    getSlotProps: R,
    ownerState: m
  });
  return !T && !N ? null : /* @__PURE__ */ F(me.Provider, {
    value: f,
    children: /* @__PURE__ */ F(xe, {
      ref: M,
      container: a,
      disablePortal: C,
      children: /* @__PURE__ */ de(k, y({}, S, {
        children: [O ? null : /* @__PURE__ */ F(_, y({}, $)), /* @__PURE__ */ F(U, {
          disableEnforceFocus: c,
          disableAutoFocus: s,
          disableRestoreFocus: p,
          isEnabled: P,
          open: N,
          children: l.Children.only(i) && /* @__PURE__ */ l.cloneElement(i, y({}, i.props.tabIndex === void 0 && {
            tabIndex: -1
          }))
        })]
      }))
    })
  });
});
process.env.NODE_ENV !== "production" && (Ze.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * A single child content element.
   */
  children: Q.isRequired,
  /**
   * The component used for the root node.
   * Either a string to use a HTML element or a component.
   */
  component: t.elementType,
  /**
   * An HTML element or function that returns one.
   * The `container` will have the portal children appended to it.
   *
   * You can also provide a callback, which is called in a React layout effect.
   * This lets you set the container from a ref, and also makes server-side rendering possible.
   *
   * By default, it uses the body of the top-level document object,
   * so it's simply `document.body` most of the time.
   */
  container: t.oneOfType([Ee, t.func]),
  /**
   * If `true`, the modal will not automatically shift focus to itself when it opens, and
   * replace it to the last focused element when it closes.
   * This also works correctly with any modal children that have the `disableAutoFocus` prop.
   *
   * Generally this should never be set to `true` as it makes the modal less
   * accessible to assistive technologies, like screen readers.
   * @default false
   */
  disableAutoFocus: t.bool,
  /**
   * If `true`, the modal will not prevent focus from leaving the modal while open.
   *
   * Generally this should never be set to `true` as it makes the modal less
   * accessible to assistive technologies, like screen readers.
   * @default false
   */
  disableEnforceFocus: t.bool,
  /**
   * If `true`, hitting escape will not fire the `onClose` callback.
   * @default false
   */
  disableEscapeKeyDown: t.bool,
  /**
   * The `children` will be under the DOM hierarchy of the parent component.
   * @default false
   */
  disablePortal: t.bool,
  /**
   * If `true`, the modal will not restore focus to previously focused element once
   * modal is hidden or unmounted.
   * @default false
   */
  disableRestoreFocus: t.bool,
  /**
   * Disable the scroll lock behavior.
   * @default false
   */
  disableScrollLock: t.bool,
  /**
   * If `true`, the backdrop is not rendered.
   * @default false
   */
  hideBackdrop: t.bool,
  /**
   * Always keep the children in the DOM.
   * This prop can be useful in SEO situation or
   * when you want to maximize the responsiveness of the Modal.
   * @default false
   */
  keepMounted: t.bool,
  /**
   * Callback fired when the component requests to be closed.
   * The `reason` parameter can optionally be used to control the response to `onClose`.
   *
   * @param {object} event The event source of the callback.
   * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`, `"closeClick"`.
   */
  onClose: t.func,
  /**
   * @ignore
   */
  onKeyDown: t.func,
  /**
   * If `true`, the component is shown.
   */
  open: t.bool.isRequired,
  /**
   * The props used for each slot inside.
   * @default {}
   */
  slotProps: t.shape({
    backdrop: t.oneOfType([t.func, t.object]),
    root: t.oneOfType([t.func, t.object])
  }),
  /**
   * The components used for each slot inside.
   * @default {}
   */
  slots: t.shape({
    backdrop: t.elementType,
    root: t.elementType
  }),
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object])
});
const eo = ["className", "children", "invertedColors", "orientation", "color", "component", "variant", "size", "layout", "maxWidth", "minWidth", "slots", "slotProps"], oo = (o) => {
  const {
    variant: e,
    color: r,
    size: n,
    layout: i
  } = o, a = {
    root: ["root", e && `variant${w(e)}`, r && `color${w(r)}`, n && `size${w(n)}`, i && `layout${w(i)}`]
  };
  return G(a, je, {});
};
function re(o, e) {
  var r, n;
  return e && (r = o.breakpoints) != null && r.values[e] ? `${(n = o.breakpoints) == null ? void 0 : n.values[e]}px` : e;
}
const to = L(ue, {
  name: "JoyModalDialog",
  slot: "Root",
  overridesResolver: (o, e) => e.root
})(({
  theme: o,
  ownerState: e
}) => y({
  "--ModalDialog-minWidth": typeof e.minWidth == "number" ? `${e.minWidth}px` : re(o, e.minWidth),
  "--ModalDialog-maxWidth": typeof e.maxWidth == "number" ? `${e.maxWidth}px` : re(o, e.maxWidth),
  "--ModalClose-radius": "max((var(--Card-radius) - var(--variant-borderWidth, 0px)) - var(--ModalClose-inset), min(var(--ModalClose-inset) / 2, (var(--Card-radius) - var(--variant-borderWidth, 0px)) / 2))"
}, e.variant === "solid" && {
  "--DialogContent-color": "currentColor"
}, e.size === "sm" && {
  "--Card-padding": "1rem",
  "--ModalDialog-titleOffset": o.spacing(0.25),
  "--ModalDialog-descriptionOffset": o.spacing(0.25),
  "--ModalClose-inset": "0.375rem"
}, e.size === "md" && {
  "--Card-padding": "1.25rem",
  "--ModalDialog-titleOffset": o.spacing(0.25),
  "--ModalDialog-descriptionOffset": o.spacing(0.75),
  "--ModalClose-inset": "0.5rem"
}, e.size === "lg" && {
  "--Card-padding": "1.5rem",
  "--ModalDialog-titleOffset": o.spacing(0.5),
  "--ModalDialog-descriptionOffset": o.spacing(1),
  "--ModalClose-inset": "0.625rem"
}, {
  boxSizing: "border-box",
  boxShadow: o.shadow.md,
  minWidth: "min(calc(100vw - 2 * var(--Card-padding)), var(--ModalDialog-minWidth, 300px))",
  outline: 0,
  position: "absolute"
}, e.layout === "fullscreen" && {
  top: 0,
  left: 0,
  right: 0,
  bottom: 0,
  border: 0,
  borderRadius: 0
}, e.layout === "center" && {
  top: "50%",
  left: "50%",
  transform: "translate(-50%, -50%)",
  maxWidth: "min(calc(100vw - 2 * var(--Card-padding)), var(--ModalDialog-maxWidth, 100vw))",
  maxHeight: "calc(100% - 2 * var(--Card-padding))"
}, {
  [`& [id="${e["aria-labelledby"]}"]`]: {
    "--Typography-margin": "calc(-1 * var(--ModalDialog-titleOffset)) 0 var(--ModalDialog-gap) 0",
    "--Typography-fontSize": "1.125em",
    [`& + [id="${e["aria-describedby"]}"]`]: {
      "--unstable_ModalDialog-descriptionOffset": "calc(-1 * var(--ModalDialog-descriptionOffset))"
    }
  },
  [`& [id="${e["aria-describedby"]}"]`]: {
    "--Typography-fontSize": "1em",
    "--Typography-margin": "var(--unstable_ModalDialog-descriptionOffset, var(--ModalDialog-gap)) 0 0 0",
    "&:not(:last-child)": {
      // create spacing between description and the next element.
      "--Typography-margin": "var(--unstable_ModalDialog-descriptionOffset, var(--ModalDialog-gap)) 0 var(--ModalDialog-gap) 0"
    }
  }
})), no = /* @__PURE__ */ l.forwardRef(function(e, r) {
  const n = Y({
    props: e,
    name: "JoyModalDialog"
  }), {
    className: i,
    children: a,
    invertedColors: s = !1,
    orientation: c = "vertical",
    color: u = "neutral",
    component: C = "div",
    variant: p = "outlined",
    size: b = "md",
    layout: O = "center",
    maxWidth: T,
    minWidth: f,
    slots: N = {},
    slotProps: I = {}
  } = n, z = J(n, eo), D = y({}, n, {
    color: u,
    component: C,
    maxWidth: T,
    minWidth: f,
    layout: O,
    size: b,
    variant: p,
    invertedColors: s
  }), d = oo(D), m = y({}, z, {
    component: C,
    slots: N,
    slotProps: I
  }), x = Z(), R = Z(), E = l.useMemo(() => ({
    variant: p,
    color: u,
    labelledBy: x,
    describedBy: R
  }), [u, p, x, R]), [M, P] = V("root", {
    ref: r,
    className: ae(d.root, i),
    elementType: to,
    externalForwardedProps: m,
    ownerState: D,
    additionalProps: {
      as: C,
      role: "dialog",
      "aria-modal": "true",
      "aria-labelledby": x,
      "aria-describedby": R
    }
  });
  return /* @__PURE__ */ F(pe.Provider, {
    value: b,
    children: /* @__PURE__ */ F(fe.Provider, {
      value: E,
      children: /* @__PURE__ */ F(M, y({}, P, {
        children: l.Children.map(a, (g, W) => {
          if (!/* @__PURE__ */ l.isValidElement(g))
            return g;
          const k = {};
          if (le(g, ["Divider"])) {
            var S, _;
            const $ = g.props;
            k.inset = (S = $ == null ? void 0 : $.inset) != null ? S : "context";
            const h = c === "vertical" ? "horizontal" : "vertical";
            k.orientation = (_ = $ == null ? void 0 : $.orientation) != null ? _ : h;
          }
          return W === 0 && (k["data-first-child"] = ""), W === l.Children.count(a) - 1 && (k["data-last-child"] = ""), /* @__PURE__ */ l.cloneElement(g, k);
        })
      }))
    })
  });
});
process.env.NODE_ENV !== "production" && (no.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: t.node,
  /**
   * @ignore
   */
  className: t.string,
  /**
   * The color of the component. It supports those theme colors that make sense for this component.
   * @default 'neutral'
   */
  color: t.oneOfType([t.oneOf(["danger", "neutral", "primary", "success", "warning"]), t.string]),
  /**
   * The component used for the root node.
   * Either a string to use a HTML element or a component.
   */
  component: t.elementType,
  /**
   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
   * @default false
   */
  invertedColors: t.bool,
  /**
   * The layout of the dialog
   * @default 'center'
   */
  layout: t.oneOfType([t.oneOf(["center", "fullscreen"]), t.string]),
  /**
   * The maximum width of the component.
   * @example 'md' will use the theme's `md` breakpoint value
   * @example 360 is the number of pixels
   * @example '60ch' can be any valid CSS max-width unit
   */
  maxWidth: t.oneOfType([t.number, t.string]),
  /**
   * The minimum width of the component.
   * @example 'md' will use the theme's `md` breakpoint value
   * @example 360 is the number of pixels
   * @example '60ch' can be any valid CSS min-width unit
   */
  minWidth: t.oneOfType([t.number, t.string]),
  /**
   * The component orientation.
   * @default 'vertical'
   */
  orientation: t.oneOf(["horizontal", "vertical"]),
  /**
   * The size of the component.
   * @default 'md'
   */
  size: t.oneOfType([t.oneOf(["sm", "md", "lg"]), t.string]),
  /**
   * The props used for each slot inside.
   * @default {}
   */
  slotProps: t.shape({
    root: t.oneOfType([t.func, t.object])
  }),
  /**
   * The components used for each slot inside.
   * @default {}
   */
  slots: t.shape({
    root: t.elementType
  }),
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
  /**
   * The [global variant](https://mui.com/joy-ui/main-features/global-variants/) to use.
   * @default 'outlined'
   */
  variant: t.oneOfType([t.oneOf(["outlined", "plain", "soft", "solid"]), t.string])
});
export {
  me as C,
  Ze as M,
  no as a,
  fe as b,
  lo as c,
  pe as d,
  Q as e,
  co as m
};
