import { E as compilerRuntimeExports, j as jsxRuntimeExports } from "./vendor-react-DYNCg6N5.js";
import { c as useAppSelector, i as isSaaS, at as SpaceLogo, au as OfficeLogo } from "./index-DfebxkL9.js";
import { c as createStyles, W as useMediaQuery, ab as useMantineTheme, G as Group, T as Text, P as Paper, b as Box, S as Stack } from "./vendor-mantine-h0WlM2Mj.js";
const useStyles = createStyles((theme, _, utils) => ({
  pageHeight: {
    "@supports(-webkit-touch-callout: none)": {
      height: "-webkit-fill-available"
    }
  },
  containerBox: {
    margin: "50px 0"
  },
  containerLogo: {
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    padding: "0",
    marginBottom: "24px",
    img: {
      maxWidth: "100%"
    }
  },
  logo: {},
  box: {
    padding: "40px 32px 32px",
    [utils.smallerThan("xs")]: {
      padding: "26px"
    }
  },
  title: {
    color: theme.colors.gray[8],
    marginBottom: "5px"
  }
}));
const backgroundImage = "/assets/bg-saas-DppuZ9SJ.jpg";
const LoginWraper = (props) => {
  const $ = compilerRuntimeExports.c(34);
  const {
    title,
    text,
    children
  } = props;
  const {
    Settings
  } = useAppSelector(_temp);
  const isMobile = useMediaQuery("(max-width: 576px)");
  const {
    classes
  } = useStyles();
  const theme = useMantineTheme();
  const defaultBackground = theme.colors.gray[1];
  let t0;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t0 = {
      backgroundImage: `url(${backgroundImage})`,
      backgroundSize: "cover",
      backgroundRepeat: "no-repeat",
      backgroundPosition: "center center",
      backgroundAttachment: "fixed"
    };
    $[0] = t0;
  } else {
    t0 = $[0];
  }
  const imageBackground = t0;
  let t1;
  if ($[1] !== Settings || $[2] !== defaultBackground) {
    t1 = {
      ...isSaaS(Settings) ? imageBackground : {
        backgroundColor: defaultBackground
      },
      padding: "0 20px"
    };
    $[1] = Settings;
    $[2] = defaultBackground;
    $[3] = t1;
  } else {
    t1 = $[3];
  }
  let t2;
  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = {
      height: "auto",
      minHeight: "100vh"
    };
    $[4] = t2;
  } else {
    t2 = $[4];
  }
  const t3 = isMobile ? classes.pageHeight : "";
  let t4;
  if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
    t4 = {
      maxWidth: "calc(100% - 10px)"
    };
    $[5] = t4;
  } else {
    t4 = $[5];
  }
  let t5;
  if ($[6] !== Settings || $[7] !== classes.logo) {
    t5 = isSaaS(Settings) ? /* @__PURE__ */ jsxRuntimeExports.jsx(SpaceLogo, { className: classes.logo, theme: "light" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(OfficeLogo, { className: classes.logo });
    $[6] = Settings;
    $[7] = classes.logo;
    $[8] = t5;
  } else {
    t5 = $[8];
  }
  let t6;
  if ($[9] !== classes.containerLogo || $[10] !== t5) {
    t6 = /* @__PURE__ */ jsxRuntimeExports.jsx(Group, { className: classes.containerLogo, children: t5 });
    $[9] = classes.containerLogo;
    $[10] = t5;
    $[11] = t6;
  } else {
    t6 = $[11];
  }
  let t7;
  if ($[12] !== classes.title || $[13] !== title) {
    t7 = title && /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { fz: 32, fw: 500, className: classes.title, children: title });
    $[12] = classes.title;
    $[13] = title;
    $[14] = t7;
  } else {
    t7 = $[14];
  }
  let t8;
  if ($[15] !== text) {
    t8 = text && /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { c: "dimmed", children: text });
    $[15] = text;
    $[16] = t8;
  } else {
    t8 = $[16];
  }
  let t9;
  if ($[17] !== children || $[18] !== t7 || $[19] !== t8) {
    t9 = /* @__PURE__ */ jsxRuntimeExports.jsx(Stack, { gap: "xl", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Stack, { gap: "xs", children: [
      t7,
      t8,
      children
    ] }) });
    $[17] = children;
    $[18] = t7;
    $[19] = t8;
    $[20] = t9;
  } else {
    t9 = $[20];
  }
  let t10;
  if ($[21] !== classes.box || $[22] !== t9) {
    t10 = /* @__PURE__ */ jsxRuntimeExports.jsx(Paper, { className: classes.box, shadow: "0 2px 8px 0 rgba(16, 24, 40, 0.1)", radius: "8px", children: t9 });
    $[21] = classes.box;
    $[22] = t9;
    $[23] = t10;
  } else {
    t10 = $[23];
  }
  let t11;
  if ($[24] !== classes.containerBox || $[25] !== t10 || $[26] !== t6) {
    t11 = /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { w: 540, sx: t4, className: classes.containerBox, children: [
      t6,
      t10
    ] });
    $[24] = classes.containerBox;
    $[25] = t10;
    $[26] = t6;
    $[27] = t11;
  } else {
    t11 = $[27];
  }
  let t12;
  if ($[28] !== t11 || $[29] !== t3) {
    t12 = /* @__PURE__ */ jsxRuntimeExports.jsx(Stack, { align: "center", justify: "center", style: t2, className: t3, children: t11 });
    $[28] = t11;
    $[29] = t3;
    $[30] = t12;
  } else {
    t12 = $[30];
  }
  let t13;
  if ($[31] !== t1 || $[32] !== t12) {
    t13 = /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { sx: t1, children: t12 });
    $[31] = t1;
    $[32] = t12;
    $[33] = t13;
  } else {
    t13 = $[33];
  }
  return t13;
};
function _temp(state) {
  return state.userInfo;
}
export {
  LoginWraper as L
};
//# sourceMappingURL=index-q4s1wmSu.js.map
