import { getTypographyStyles as i } from "../../../../utils/getTypographyStyles.js";
const g = {
  /**
   * Badge Root Styles
   */
  rootBadge: ({ theme: s, ownerState: a }) => ({
    "& .MuiBadge-badge": {
      minWidth: s.vars.size.baseSpacings["sp3-5"],
      display: "flex",
      justifyContent: "center",
      alignItems: "center",
      flexShrink: 0,
      padding: s.vars.size.baseSpacings.sp1,
      borderRadius: a?.displayBadgeContent ? s.vars.size.borderRadius.r4 : "50%",
      // Colores dinámicos basados en el estado
      color: s.vars.palette[a?.BadgeColor || "default"].contrastText,
      backgroundColor: s.vars.palette[a?.BadgeColor || "default"].active,
      ...i(
        s.generalSettings.isMobile,
        a?.BadgeSize || "medium",
        "bodyStandard"
      ),
      // Tamaño dinámico basado en `BadgeSize` y si es móvil
      ...s.generalSettings.isMobile ? {
        height: s.vars.size.baseSpacings.sp5,
        width: a?.displayBadgeContent ? "26px" : s.vars.size.baseSpacings.sp5,
        right: a?.displayBadgeContent ? 0 : 2,
        top: a?.displayBadgeContent ? 0 : 2
      } : {
        height: s.vars.size.baseSpacings["sp3-5"],
        width: a?.displayBadgeContent ? "23px" : s.vars.size.baseSpacings["sp3-5"],
        right: a?.displayBadgeContent ? 0 : 2,
        top: a?.displayBadgeContent ? 0 : 2
      },
      // Estilos para variantes
      ...a?.BadgeVariant === "dot" && {
        height: s.vars.size.baseSpacings.sp2,
        width: s.vars.size.baseSpacings.sp2,
        minWidth: s.vars.size.baseSpacings.sp2,
        minHeight: s.vars.size.baseSpacings.sp2,
        padding: 0,
        borderRadius: "50%",
        fontSize: 0
      }
    }
  })
};
export {
  g as badgeStyles
};
