const i = {
  /**
   * Estilos para el contenedor principal del componente ImageTextContainer.
   */
  root: ({ theme: e }) => ({
    display: "flex",
    flexDirection: "column",
    alignItems: "center",
    justifyContent: "center",
    height: "80%",
    width: "100%",
    maxWidth: "600px",
    minWidth: "200px",
    padding: "10px",
    gap: e.vars.size.baseSpacings.sp2,
    minHeight: "60px",
    backgroundColor: e.vars.palette.background.default
  }),
  /**
   * Estilos para el contenedor de la imagen.
   */
  imageContainer: ({ ownerState: e }) => ({
    visibility: e?.isVisible ? "visible" : "hidden",
    display: "flex",
    justifyContent: "center",
    height: "100%",
    width: "100%",
    maxWidth: "150px",
    maxHeight: "106px",
    minWidth: "70px",
    '& [class*="M4LImage-imgSkeleton"]': {
      opacity: 0
    },
    '& [class*="M4LImage"]': {
      width: "100%",
      height: "auto ",
      maxWidth: "150px",
      maxHeight: "106px",
      minWidth: "70px",
      minHeight: "50px"
    }
  }),
  /**
   * Estilos para la imagen.
   */
  img: {},
  /**
   * Estilos para el wrapper de la typography de NoItemPrivileges.
   */
  wrapperTitleMessage: ({ theme: e }) => ({
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    flexDirection: "column",
    gap: e.vars.size.baseSpacings["sp0-5"],
    "& .MuiTypography-root": {
      width: "auto"
    }
  }),
  /**
   * Estilos para la typography de NoItemPrivileges.
   */
  title: ({ theme: e }) => ({
    "&&&": {
      color: e.vars.palette.primary.semanticText
    }
  }),
  /**
   * Estilos para la typography del mensaje de NoItemPrivileges.
   */
  message: ({ theme: e }) => ({
    "&&&": {
      color: e.vars.palette.text.secondary
    }
  })
};
export {
  i as imageTextContainerStyles
};
