@m4l/styles 0.0.13 → 0.0.15

package/theme/overrides/M4LExtendedComponents/index.9ef37d1d.js

@@ -0,0 +1,1712 @@
+import { alpha as t } from "@mui/material/styles";
+const e = (o) => ({
+  M4LDynamicFilter: {
+    styleOverrides: {
+      "&.M4LDynamicFilter-root": {
+        borderRadius: "4px",
+        background: o.palette.background.default,
+        boxShadow: o.customShadows.z2,
+        padding: "0px",
+        border: "1px solid",
+        borderColor: o.palette.state.default,
+        overflow: "hidden",
+        "& .M4LDynamicFilter-containerFistRow": {
+          height: "32px",
+          width: "100%",
+          "& .M4LDynamicFilter-containerInputFilter": {
+            width: "100%",
+            alignItems: "center",
+            maxWidth: "100%"
+          }
+        },
+        "&.M4LDynamicFilter-isInvalid": {
+          borderColor: o.palette.state.error.normal
+        },
+        "& .M4LDynamicFilter-containerClearFilter": {
+          display: "flex",
+          flexDirection: "row",
+          gap: "4px",
+          backgroundColor: o.palette.background.neutral,
+          padding: "4px"
+        },
+        "& .M4LDynamicFilter-containerInputFilter": {
+          display: "flex",
+          flexDirection: "row",
+          gap: "8px",
+          padding: "4px",
+          backgroundColor: o.palette.background.neutral,
+          height: "100%",
+          maxWidth: "135px",
+          width: "100%",
+          alignItems: "center",
+          "& > input": {
+            border: "none",
+            background: "none",
+            ...o.typography.body,
+            color: o.palette.text.primary,
+            padding: "0px 4px",
+            width: "100%",
+            height: "100%",
+            BorderRadius: "4px"
+          },
+          "& input:focus-visible": {
+            border: "none",
+            background: o.palette.state.active12,
+            BorderRadius: "4px",
+            outline: "none",
+            padding: "0px 4px"
+          }
+        },
+        "& .M4LDynamicFilter-wrapperApplyedFilters": {
+          borderLeft: "none",
+          height: "29px"
+        },
+        "& .M4LDynamicFilter-containerApplyedFilters": {
+          padding: "2px"
+        },
+        "& .M4LDynamicFilter-applyedFilter": {
+          borderRadius: "4px",
+          background: o.palette.state.default,
+          boxShadow: o.customShadows.z2,
+          color: o.palette.text.secondary,
+          ...o.typography.body,
+          border: "none",
+          borderTop: "1px solid",
+          borderColor: o.palette.state.default,
+          "& .css-5ca9fi": {
+            ...o.typography.body
+          },
+          "& .css-1wytxsy": {
+            ...o.typography.body
+          }
+        }
+      }
+    }
+  },
+  M4LDynamicFilterPopoverMenuFields: {
+    styleOverrides: {
+      "&.M4LDynamicFilter-popoverMenuFields": {
+        "& .M4LDynamicFilter-popoverMenuFieldsPaper": {
+          "& .M4LDynamicFilter-classespopoverLabelMemuItem": {
+            ...o.typography.body,
+            color: o.palette.text.secondary
+          },
+          "& .M4LDynamicFilter-popoverMenuFieldsItem:hover": {
+            ...o.typography.body,
+            color: o.palette.state.hover,
+            background: o.palette.state.default
+          }
+        }
+      }
+    }
+  },
+  M4LDynamicFilterPopoverFilter: {
+    styleOverrides: {
+      "&.M4LDynamicFilter-popoverFilter": {
+        "& .M4LDynamicFilter-popoverFilterPaper": {
+          padding: "0px",
+          "& .M4LPopover-arrowStyle": {
+            background: "none"
+          },
+          "& .m4l_FormProvider": {
+            gap: "0px",
+            "& .M4LDynamicFilter-popoverFilterHeader": {
+              background: o.palette.state.default,
+              display: "flex",
+              gap: "4px",
+              padding: "8px",
+              borderRadius: "4px",
+              boxShadow: o.customShadows.z2,
+              borderBottom: "0px",
+              "& .MuiTypography-root": {
+                ...o.typography.bodyDens,
+                color: o.palette.text.primary
+              }
+            },
+            "& .M4LDynamicFilter-popoverContainerFields": {
+              [`& .M4LDynamicFilter-containerStringFilter,
+                                  & .M4LDynamicFilter-containerBooleanFilter,
+                                  & .M4LDynamicFilter-containerNumberFilter,
+                                  & .M4LDynamicFilter-containerDateTimeFilter
+                                `]: {
+                display: "flex",
+                flexDirection: "column",
+                padding: "8px 8px 0 8px",
+                gap: "8px"
+              }
+            },
+            "& .M4LCommonActions-wrapperActions": {
+              display: "flex",
+              flexDirection: "row",
+              gap: "12px",
+              padding: "20px 8px 12px 0px",
+              ".M4LButton-root": {
+                width: "fit-content"
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}), r = (o) => ({
+  M4LIcon: {
+    styleOverrides: {
+      ["&.M4LIcon-root"]: {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        width: "fit-content",
+        transition: "transform 0.5s ease-in-out",
+        ".M4LIcon-icon": {
+          backgroundColor: o.palette.text.primary
+        },
+        ".M4LIcon-sizeExtraSmall": {
+          width: "12px",
+          height: "12px",
+          minWidth: "12px",
+          minHeight: "12px"
+        },
+        ".M4LIcon-sizeSmall": {
+          width: "16px",
+          height: "16px",
+          minWidth: "16px",
+          minHeight: "16px"
+        },
+        ".M4LIcon-sizeMedium": {
+          width: "20px",
+          height: "20px",
+          minWidth: "20px",
+          minHeight: "20px"
+        },
+        ".M4LIcon-sizeLarge": {
+          width: "28px",
+          height: "28px",
+          minWidth: "28px",
+          minHeight: "28px"
+        },
+        ".M4LIcon-sizeExtraLarge": {
+          width: "36px",
+          height: "36px",
+          minWidth: "36px",
+          minHeight: "36px"
+        },
+        ".M4LIcon-variantSkeleton": {
+          borderRadius: "4px",
+          backgroundColor: o.palette.state?.skeleton.default
+        }
+      }
+    }
+  }
+}), n = (o) => ({
+  M4LIconButton: {
+    styleOverrides: {
+      ["&.M4LIconButton-root"]: {
+        position: "relative",
+        borderRadius: "4px",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        transition: "all .3s ease",
+        "& .M4LIcon-root .M4LIcon-icon": {
+          transition: "all .3s ease",
+          backgroundColor: o.palette.text.secondary
+        },
+        "&::before": {
+          boxSizing: "content-box",
+          border: "1px solid",
+          borderColor: o.palette.state?.focus,
+          borderRadius: "3px",
+          position: "absolute",
+          transition: "all .3s ease"
+        },
+        ".M4LIconButton-sizeExtraSmall&::before": {
+          width: "22px",
+          height: "22px",
+          minWidth: "22px",
+          minHeight: "22px"
+        },
+        ".M4LIconButton-sizeSmall&::before": {
+          width: "26px",
+          height: "26px",
+          minWidth: "26px",
+          minHeight: "26px"
+        },
+        ".M4LIconButton-sizeMedium&::before": {
+          width: "30px",
+          height: "30px",
+          minWidth: "30px",
+          minHeight: "30px"
+        },
+        "&.M4LIconButton-sizeExtraSmall": {
+          width: "20px",
+          height: "20px",
+          minWidth: "20px",
+          minHeight: "20px"
+        },
+        "&.M4LIconButton-sizeSmall": {
+          width: "24px",
+          height: "24px",
+          minWidth: "24px",
+          minHeight: "24px"
+        },
+        "&.M4LIconButton-sizeMedium": {
+          width: "28px",
+          height: "28px",
+          minWidth: "28px",
+          minHeight: "28px"
+        },
+        "& .MuiIconButton-root": {
+          position: "static",
+          borderRadius: "4px",
+          padding: "0px"
+        },
+        "&.M4LIconButton-variantPrimary:not(&.M4LIconButton-isDisabled)": {
+          backgroundColor: o.palette.state?.default,
+          "&:hover": {
+            backgroundColor: o.palette.state?.hover,
+            "& .M4LIcon-icon": {
+              backgroundColor: "#fff"
+            }
+          },
+          "&:active": {
+            backgroundColor: o.palette.state?.active,
+            transition: "background-color .5s ease",
+            "& .M4LIcon-icon": {
+              backgroundColor: "#fff"
+            }
+          },
+          "&.M4LIconButton-isFocus": {
+            backgroundColor: o.palette.state?.active,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.patronus?.marbleLight[10]
+            },
+            "&::before": {
+              content: "''"
+            }
+          }
+        },
+        "&.M4LIconButton-variantSecondary:not(&.M4LIconButton-isDisabled)": {
+          borderColor: o.palette.text.secondary,
+          "& .M4LIcon-icon": {
+            backgroundColor: o.palette.text.secondary
+          },
+          "&:hover": {
+            border: "1px solid",
+            borderColor: o.palette.state?.focus,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.state?.focus
+            }
+          },
+          "&:active": {
+            border: "1px solid",
+            borderColor: o.palette.state?.active,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.state?.active
+            }
+          },
+          "&.M4LIconButton-isFocus": {
+            border: "1px solid",
+            borderColor: o.palette.state?.active,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.state?.active
+            },
+            "&::before": {
+              content: "''"
+            }
+          }
+        },
+        "&.M4LIconButton-variantLine:not(&.M4LIconButton-isDisabled)": {
+          "&:hover": {
+            backgroundColor: o.palette.state?.active12,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.state?.focus
+            }
+          },
+          "&:active": {
+            backgroundColor: "transparent",
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.state?.active
+            }
+          },
+          "&.M4LIconButton-isFocus": {
+            backgroundColor: "transparent",
+            border: "1px solid",
+            borderColor: o.palette.state?.focus,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.state?.active
+            }
+          }
+        },
+        "&.M4LIconButton-isDisabled": {
+          "& .M4LIcon-icon": {
+            backgroundColor: o.palette.text.disabled
+          }
+        },
+        "&.M4LIconButton-root .MuiSkeleton-root": {
+          borderRadius: "4px"
+        }
+      }
+    }
+  }
+}), i = (o) => ({
+  M4LanguagePopover: {
+    styleOverrides: {
+      ["&.M4LanguagePopover-root"]: {}
+    }
+  }
+}), p = (o) => ({
+  M4LImageButton: {
+    styleOverrides: {
+      ["&.M4LImageButton-root"]: {
+        test: "root",
+        ".MuiButtonBase-root": {
+          display: "flex",
+          padding: "4px",
+          borderRadius: "6px",
+          alignItems: "center",
+          justifyContent: "center"
+        },
+        ".M4LImage-root": {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          objectFit: "cover",
+          width: "100%",
+          height: "100%"
+        },
+        ".M4LImage-lazyLoad": {
+          borderRadius: "4px",
+          width: "100%",
+          height: "100%",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center"
+        },
+        ".M4LImage-img": {
+          borderRadius: "4px"
+        },
+        ".MuiButtonBase-root:hover": {
+          backgroundColor: o.palette.state?.active12
+        },
+        ".MuiButtonBase-root:focus": {
+          backgroundColor: o.palette.state?.active12,
+          border: "1px solid",
+          borderColor: o.palette.state?.focus
+        }
+      }
+    }
+  }
+}), l = (o) => ({
+  M4LImage: {
+    styleOverrides: {
+      ["&.M4LImage-root"]: {
+        position: "relative",
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+        alignItems: "center",
+        "& .M4LImage-img": {
+          opacity: 0,
+          position: "absolute",
+          inset: "0",
+          objectFit: "contain"
+        },
+        "&.M4LImage-loaded .M4LImage-img": {
+          opacity: 1,
+          transition: "opacity .5s",
+          margin: "0 auto"
+        },
+        "& .M4LImage-skeletonImage, & .M4LImage-skeletonCircle": {
+          opacity: 1,
+          position: "absolute",
+          inset: 0
+        },
+        "&.M4LImage-loaded .M4LImage-skeletonImage, &.M4LImage-loaded .M4LImage-skeletonCircle": {
+          opacity: 0,
+          transition: "opacity .3s"
+        },
+        "& .M4LImage-lazyLoad": {
+          display: "flex",
+          justifyContent: "center",
+          alignItems: "center"
+        }
+      }
+    }
+  }
+}), d = (o) => ({
+  M4LPopover: {
+    styleOverrides: {
+      ["&.M4LPopover-root"]: {
+        ".MuiPaper-root": {
+          background: o.palette.background.default,
+          borderRadius: "6px",
+          padding: "8px",
+          boxShadow: o.customShadows.z3,
+          width: "auto"
+        },
+        "& .M4LanguagePopover-containerItems": {
+          "& .M4LanguagePopover-labelItem": {
+            ...o.typography.body,
+            color: o.palette.text.secondary
+          },
+          "& .MuiButtonBase-root:hover": {
+            backgroundColor: o.palette.state?.active12
+          },
+          "& .MuiButtonBase-root.Mui-selected": {
+            backgroundColor: o.palette.state?.active12,
+            "& .M4LanguagePopover-labelItem": {
+              color: o.palette.state?.active
+            }
+          }
+        }
+      }
+    }
+  }
+}), s = (o) => ({
+  M4LErrorLabel: {
+    styleOverrides: {
+      ["&.M4LHelperText-root"]: {
+        "&.M4LHelperText-variantInfo .MuiTypography-root": {
+          color: o.palette.info.main
+        },
+        "&.M4LHelperText-variantSuccess .MuiTypography-root": {
+          color: o.palette.success.main
+        },
+        "&.M4LHelperText-variantWarning .MuiTypography-root": {
+          color: o.palette.warning.main
+        },
+        "&.M4LHelperText-variantError .MuiTypography-root": {
+          color: o.palette.error.main
+        }
+      }
+    }
+  }
+}), c = (o) => ({
+  M4LTypography: {
+    styleOverrides: {
+      ["&.M4LTypography-root"]: {
+        color: o.palette.text.primary,
+        display: "inline",
+        "& .MuiTypography-root": {
+          margin: "unset"
+        }
+      }
+    }
+  }
+}), u = (o) => ({
+  M4LButton: {
+    styleOverrides: {
+      "&.M4LButton-root": {
+        width: "100%",
+        display: "flex",
+        justifyContent: "center",
+        "& .M4LButton-skeleton ": {
+          height: "100%!important",
+          borderRadius: "4px"
+        },
+        "& .MuiButtonBase-root": {
+          display: "flex",
+          textTransform: "none",
+          gap: "8px",
+          transition: "all .5s ease",
+          borderRadius: "4px",
+          border: "1px solid transparent",
+          ...o.typography.action,
+          "& .M4LIcon-icon": {
+            transition: "all .5s ease"
+          },
+          "& .MuiButton-startIcon, & .MuiButton-endIcon": {
+            margin: "0px"
+          },
+          "&::before": {
+            inset: "0",
+            border: "1px solid",
+            borderColor: o.palette.state?.focus,
+            borderRadius: "4px",
+            transform: "scale(1.07, 1.36)",
+            position: "absolute",
+            boxSizing: "border-box"
+          }
+        },
+        "&.M4LButton-isDisabled": {
+          "& .MuiButtonBase-root": {
+            color: `${o.palette.text.disabled}!important`,
+            "& .M4LIcon-icon": {
+              backgroundColor: `${o.palette.text.disabled}!important`
+            }
+          },
+          "&.M4LButton-variantContained": {
+            "& .MuiButtonBase-root": {
+              color: o.palette.text.disabled,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.text.disabled
+              },
+              "&:hover": {
+                backgroundColor: o.palette.state?.default,
+                color: o.palette.text.disabled,
+                "& .M4LIcon-icon": {
+                  backgroundColor: o.palette.text.disabled,
+                  color: o.palette.text.disabled
+                }
+              },
+              "&:active": {
+                backgroundColor: o.palette.state?.active,
+                color: o.palette.text.primary,
+                "& .M4LIcon-icon": {
+                  backgroundColor: o.palette.text.disabled,
+                  color: o.palette.text.disabled
+                }
+              },
+              "&.Mui-focusVisible": {
+                backgroundColor: o.palette.state?.default,
+                color: o.palette.text.disabled,
+                "& .M4LIcon-icon": {
+                  backgroundColor: o.palette.text.disabled,
+                  color: o.palette.text.disabled
+                },
+                "&::before": {
+                  content: "none"
+                }
+              }
+            }
+          }
+        },
+        "&.M4LButton-sizeSmall": {
+          height: "28px",
+          "& .MuiButtonBase-root": {
+            padding: "4px 12px"
+          },
+          "&.M4LButton-skeleton": {
+            height: "28px"
+          }
+        },
+        "&.M4LButton-sizeMedium": {
+          height: "38px",
+          "& .MuiButtonBase-root": {
+            padding: "8px 16px"
+          },
+          "&.M4LButton-skeleton": {
+            height: "38px"
+          }
+        },
+        "&.M4LButton-variantContained": {
+          "& .MuiButtonBase-root": {
+            backgroundColor: o.palette.state?.default,
+            color: o.palette.text.primary,
+            boxShadow: o.customShadows?.z2,
+            position: "relative",
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.text.primary
+            },
+            "&:hover": {
+              backgroundColor: o.palette.state?.hover,
+              color: o.palette.patronus?.marbleLight[10],
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.patronus?.marbleLight[10]
+              }
+            },
+            "&:active": {
+              backgroundColor: o.palette.state?.active,
+              color: o.palette.patronus?.marbleLight[10],
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.patronus?.marbleLight[10]
+              }
+            },
+            "&.Mui-focusVisible": {
+              backgroundColor: o.palette.state?.active,
+              color: o.palette.patronus?.marbleLight[10],
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.patronus?.marbleLight[10]
+              },
+              "&::before": {
+                content: "''"
+              }
+            }
+          }
+        },
+        "&.M4LButton-variantOutlined": {
+          "& .MuiButtonBase-root": {
+            border: "1px solid",
+            borderColor: o.palette.state.default,
+            color: o.palette.text.primary,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.text.secondary
+            },
+            "&:hover": {
+              borderColor: o.palette.state?.hover,
+              color: o.palette.state?.hover,
+              backgroundColor: o.palette.state?.active12,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.hover
+              }
+            },
+            "&:active": {
+              borderColor: o.palette.state?.active,
+              color: o.palette.state?.active,
+              backgroundColor: "transparent",
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              }
+            },
+            "&.Mui-focusVisible": {
+              borderColor: o.palette.state?.active,
+              color: o.palette.state?.active,
+              backgroundColor: "transparent",
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              },
+              "&::before": {
+                content: "''"
+              }
+            }
+          }
+        },
+        "&.M4LButton-variantText": {
+          "& .MuiButtonBase-root": {
+            color: o.palette.text.secondary,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.text.secondary
+            },
+            "&:hover": {
+              backgroundColor: o.palette.state?.active12,
+              color: o.palette.state?.hover,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.hover
+              }
+            },
+            "&:active": {
+              backgroundColor: "transparent",
+              color: o.palette.state?.active,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              }
+            },
+            "&.Mui-focusVisible": {
+              backgroundColor: "transparent",
+              color: o.palette.state?.active,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              },
+              "&:before": {
+                content: "''"
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}), g = (o) => ({
+  M4LoadingButton: {
+    styleOverrides: {
+      "&.M4LoadingButton-root": {
+        width: "100%",
+        display: "flex",
+        justifyContent: "center",
+        "& .MuiLoadingButton-loading": {
+          "& .MuiTypography-root": {
+            color: "transparent"
+          }
+        },
+        "& .MuiCircularProgress-root": {
+          color: o.palette.primary.main
+        },
+        "& .MuiTypography-root": {
+          color: o.palette.text.secondary,
+          transition: "all .5s ease"
+        },
+        "& .M4LoadingButton-skeleton ": {
+          height: "100%!important",
+          borderRadius: "4px"
+        },
+        "& .MuiButtonBase-root": {
+          display: "flex",
+          textTransform: "none",
+          gap: "8px",
+          transition: "all .5s ease",
+          borderRadius: "4px",
+          border: "1px solid transparent",
+          ...o.typography.action,
+          "& .M4LIcon-icon": {
+            transition: "all .5s ease"
+          },
+          "& .MuiButton-startIcon, & .MuiButton-endIcon": {
+            margin: "0px"
+          },
+          "&::before": {
+            inset: "0",
+            border: "1px solid",
+            borderColor: o.palette.state?.focus,
+            borderRadius: "4px",
+            transform: "scale(1.07, 1.36)",
+            position: "absolute",
+            boxSizing: "border-box"
+          }
+        },
+        "&.M4LoadingButton-isDisabled": {
+          "& .MuiButtonBase-root": {
+            color: `${o.palette.text.disabled}!important`,
+            "& .M4LIcon-icon": {
+              backgroundColor: `${o.palette.text.disabled}!important`
+            }
+          },
+          "&.M4LoadingButton-variantContained": {
+            "& .MuiButtonBase-root": {
+              color: o.palette.text.disabled,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.text.disabled
+              },
+              "&:hover": {
+                backgroundColor: o.palette.state?.default,
+                color: o.palette.text.disabled,
+                "& .M4LIcon-icon": {
+                  backgroundColor: o.palette.text.disabled,
+                  color: o.palette.text.disabled
+                }
+              },
+              "&:active": {
+                backgroundColor: o.palette.state?.default,
+                color: o.palette.text.disabled,
+                "& .M4LIcon-icon": {
+                  backgroundColor: o.palette.text.disabled,
+                  color: o.palette.text.disabled
+                }
+              },
+              "&.Mui-focusVisible": {
+                backgroundColor: o.palette.state?.default,
+                color: o.palette.text.disabled,
+                "& .M4LIcon-icon": {
+                  backgroundColor: o.palette.text.disabled,
+                  color: o.palette.text.disabled
+                },
+                "&::before": {
+                  content: "none"
+                }
+              }
+            }
+          }
+        },
+        "&.M4LoadingButton-sizeSmall": {
+          height: "28px",
+          "& .MuiButtonBase-root": {
+            padding: "4px 12px"
+          },
+          "&.M4LoadingButton-skeleton": {
+            height: "28px"
+          }
+        },
+        "&.M4LoadingButton-sizeMedium": {
+          height: "38px",
+          "& .MuiButtonBase-root": {
+            padding: "8px 16px"
+          },
+          "&.M4LoadingButton-skeleton": {
+            height: "38px"
+          }
+        },
+        "&.M4LoadingButton-variantContained": {
+          "& .MuiButtonBase-root": {
+            backgroundColor: o.palette.state?.default,
+            color: o.palette.text.secondary,
+            boxShadow: o.customShadows?.z1,
+            position: "relative",
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.text.secondary
+            },
+            "&:hover": {
+              backgroundColor: o.palette.state?.hover,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.patronus?.marbleLight[10]
+              },
+              "& .MuiTypography-root": {
+                color: o.palette.patronus?.marbleLight[10]
+              }
+            },
+            "&:active": {
+              backgroundColor: o.palette.state?.active,
+              color: o.palette.patronus?.marbleLight[10],
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.patronus?.marbleLight[10]
+              }
+            },
+            "&.Mui-focusVisible": {
+              backgroundColor: o.palette.state?.active,
+              color: o.palette.patronus?.marbleLight[10],
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.patronus?.marbleLight[10]
+              },
+              "&::before": {
+                content: "''"
+              }
+            }
+          }
+        },
+        "&.M4LoadingButton-variantOutlined": {
+          "& .MuiButtonBase-root": {
+            border: "1px solid",
+            borderColor: o.palette.text.secondary,
+            color: o.palette.text.secondary,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.text.secondary
+            },
+            "&:hover": {
+              borderColor: o.palette.state?.hover,
+              color: o.palette.state?.hover,
+              backgroundColor: o.palette.state?.active12,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.hover
+              }
+            },
+            "&:active": {
+              borderColor: o.palette.state?.active,
+              color: o.palette.state?.active,
+              backgroundColor: "transparent",
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              }
+            },
+            "&.Mui-focusVisible": {
+              borderColor: o.palette.state?.active,
+              color: o.palette.state?.active,
+              backgroundColor: "transparent",
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              },
+              "&::before": {
+                content: "''"
+              }
+            }
+          }
+        },
+        "&.M4LoadingButton-variantText": {
+          "& .MuiButtonBase-root": {
+            color: o.palette.text.secondary,
+            "& .M4LIcon-icon": {
+              backgroundColor: o.palette.text.secondary
+            },
+            "&:hover": {
+              backgroundColor: o.palette.state?.active12,
+              color: o.palette.state?.hover,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.hover
+              }
+            },
+            "&:active": {
+              backgroundColor: "transparent",
+              color: o.palette.state?.active,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              }
+            },
+            "&.Mui-focusVisible": {
+              backgroundColor: "transparent",
+              color: o.palette.state?.active,
+              "& .M4LIcon-icon": {
+                backgroundColor: o.palette.state?.active
+              },
+              "&:before": {
+                content: "''"
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}), x = (o) => ({
+  M4LNavLink: {
+    styleOverrides: {
+      ["&.M4LNavLink-root"]: {
+        "& .M4LTypography-root": {
+          color: o.palette.primary.main
+        },
+        "&: hover": {
+          "& .M4LTypography-root": {
+            color: o.palette.state?.hover,
+            textDecoration: "underline",
+            textDecorationColor: o.palette.state?.hover
+          }
+        },
+        "& > a": {
+          textDecoration: "none"
+        }
+      }
+    }
+  }
+}), b = (o) => ({
+  M4LSideBar: {
+    styleOverrides: {
+      "&.M4LSideBar-root": {
+        height: "100%",
+        width: "auto",
+        background: o.palette.background.neutral,
+        paddingLeft: "14px",
+        paddingBottom: "14px",
+        boxShadow: o.customShadows.z3,
+        [o.breakpoints.down("sm")]: {
+          width: "0px",
+          height: "0px",
+          padding: "0px"
+        },
+        "& .M4LSideBar-wrapperSideBar": {
+          height: "100%",
+          "& .M4LSideBar-containerSideBarLogo": {
+            marginRight: "14px",
+            "& .M4LSideBar-containerLogo": {
+              height: "128px",
+              display: "flex",
+              flexDirection: "column",
+              justifyContent: "center",
+              alignItems: "center",
+              fitContent: "100%",
+              boxSizing: "contentBox",
+              paddingTop: "24px",
+              paddingBottom: "28px",
+              gap: "12px",
+              "& .M4LTypography-root": {
+                display: "flex",
+                justifyContent: "center",
+                width: "100%",
+                "& .MuiTypography-root": {
+                  with: "100%",
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  textWrap: "nowrap"
+                }
+              },
+              "& .M4LImage-root": {
+                position: "relative",
+                background: o.palette.background.default,
+                boxShadow: o.customShadows.z3,
+                padding: "6px",
+                borderRadius: "6px"
+              }
+            }
+          },
+          "& .M4LSideBar-contentGroups": {
+            overflow: "hidden",
+            flexGrow: "1",
+            display: "flex",
+            flexDirection: "column",
+            "& .M4LSideBar-contentGroupsLine": {
+              display: "flex",
+              height: "2px",
+              marginRight: "14px",
+              backgroundColor: o.palette.state.default
+            },
+            "& .M4LSideBar-wrapperGroup": {
+              height: "100%",
+              "& .M4LSideBar-wrapperGroupTitle": {
+                padding: "20px",
+                height: "60px",
+                "& .M4LTypography-root": {
+                  display: "flex",
+                  width: "100%",
+                  "& .MuiTypography-root": {
+                    with: "100%",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    textWrap: "nowrap"
+                  }
+                }
+              },
+              "& .M4LSideBar-itemListMainRoot": {
+                display: "flex",
+                borderRadius: "4px 0px 0px 4px",
+                justifyContent: "center",
+                flexDirection: "column",
+                gap: "8px",
+                "& .M4LSideBar-navItemMainRoot": {
+                  backgroundColor: "transparent",
+                  "&:hover": {
+                    background: o.palette.state.default
+                  }
+                },
+                "&.M4LSideBar-itemMainActive": {
+                  "& .M4LSideBar-navItemMainRoot": {
+                    background: o.palette.state.active12,
+                    "&:hover": {
+                      background: t(o.palette.state.active || "#fff", 0.18)
+                    }
+                  },
+                  "& .M4LSideBar-navItemRootContent": {
+                    "& .M4LSideBar-navItemRootContentIconTypo": {
+                      "& .M4LIcon-icon": {
+                        backgroundColor: o.palette.state.focus
+                      },
+                      "& .MuiTypography-root": {
+                        color: o.palette.state.focus
+                      },
+                      "& .M4LSideBar-arrowIconRoot .M4LIcon-icon": {
+                        backgroundColor: o.palette.state.focus
+                      }
+                    },
+                    "&::before": {
+                      content: '""',
+                      width: "5px",
+                      top: "0px",
+                      bottom: "0px",
+                      right: "0px",
+                      backgroundColor: o.palette.state.focus,
+                      borderRadius: "4px 0px 0px 4px",
+                      position: "absolute"
+                    }
+                  }
+                },
+                "& .M4LSideBar-navItemRootContent": {
+                  display: "flex",
+                  padding: "8px",
+                  justifyContent: "center",
+                  borderRadius: "4px 0px 0px 4px",
+                  position: "relative",
+                  "& .M4LSideBar-navItemRootContentIconTypo": {
+                    display: "flex",
+                    gap: "8px",
+                    width: "100%",
+                    "& .M4LIcon-icon": {
+                      backgroundColor: o.palette.text.secondary
+                    },
+                    "& .M4LTypography-root": {
+                      display: "flex",
+                      flexGrow: "1",
+                      overflow: "hidden",
+                      "& .MuiTypography-root": {
+                        ...o.typography.paragraphDens,
+                        color: o.palette.text.secondary,
+                        textWrap: "nowrap",
+                        textOverflow: "ellipsis",
+                        display: "block",
+                        overflow: "hidden"
+                      }
+                    },
+                    "& .M4LSideBar-arrowIconRoot .M4LIcon-icon": {
+                      backgroundColor: o.palette.text.secondary
+                    }
+                  }
+                },
+                "& .M4LSideBar-navListSubItemRoot": {
+                  "& .M4LSideBar-navSubItemContentRoot ": {
+                    "&.M4LSideBar-subItemCollapseActive": {
+                      backgroundColor: o.palette.state.active12
+                    },
+                    "&.M4LSideBar-subItemActive": {
+                      "& .M4LSideBar-navSubItemContentBullet": {
+                        height: "14px",
+                        borderRadius: "10px",
+                        backgroundColor: o.palette.state.focus
+                      }
+                    },
+                    "&:hover": {
+                      background: o.palette.state.default
+                    }
+                  },
+                  "& .M4LSideBar-navSubItemContentRoot": {
+                    gap: "12px",
+                    margin: "0px 0px 1px 0px",
+                    padding: "16px",
+                    "& .M4LSideBar-navSubItemContentBullet": {
+                      minWidth: "5px",
+                      minHeight: "5px",
+                      borderRadius: "50%",
+                      backgroundColor: o.palette.text.primary
+                    },
+                    "& .M4LTypography-root": {
+                      display: "flex",
+                      width: "100%",
+                      "& .MuiTypography-root": {
+                        ...o.typography.paragraph,
+                        color: o.palette.text.secondary,
+                        with: "100%",
+                        overflow: "hidden",
+                        textOverflow: "ellipsis",
+                        textWrap: "nowrap"
+                      }
+                    }
+                  }
+                },
+                "& .MuiCollapse-root": {
+                  marginLeft: "28px"
+                }
+              }
+            },
+            "& .M4LIcon-root .M4LIcon-icon": {
+              backgroundColor: o.palette.text.disabled
+            }
+          },
+          "& .M4LSideBar-collapseButton": {
+            display: "flex",
+            paddingTop: "14px",
+            borderTop: "2px solid",
+            borderColor: o.palette.state.default,
+            justifyContent: "center",
+            marginRight: "14px",
+            gap: "15px",
+            "& .M4LSideBar-containerLogoButton": {
+              display: "flex",
+              gap: "14px",
+              "& .M4LSideBar-containerLogoButtonLogo": {
+                width: "120px",
+                height: "40px"
+              },
+              "& .M4LSideBar-containerLogoButtonIcon": {
+                display: "flex",
+                alignItems: "center"
+              }
+            }
+          }
+        },
+        "& .M4LSideBar-contentMobile": {
+          width: "100%",
+          display: "flex",
+          flexDirection: "column",
+          paddingLeft: "14px"
+        },
+        "& .M4LSideBar-contentDesktop": {
+          display: "flex"
+        }
+      }
+    }
+  },
+  M4LSideBarPopover: {
+    styleOverrides: {
+      "&.M4LSideBar-popover": {
+        "& .M4LSideBar-navListSubItemRoot": {
+          "& .M4LSideBar-navSubItemContentRoot ": {
+            gap: "12px",
+            margin: "0px 0px 1px 0px",
+            padding: "16px",
+            "&.M4LSideBar-subItemCollapseActive": {
+              backgroundColor: o.palette.state.active12
+            },
+            "& .M4LTypography-root": {
+              display: "flex",
+              width: "100%",
+              "& .MuiTypography-root": {
+                ...o.typography.paragraph,
+                color: o.palette.text.secondary,
+                with: "100%",
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                textWrap: "nowrap"
+              }
+            },
+            "&.M4LSideBar-subItemActive": {
+              "& .M4LSideBar-navSubItemContentBullet": {
+                height: "14px",
+                borderRadius: "10px",
+                backgroundColor: o.palette.state.focus
+              }
+            },
+            "& .M4LSideBar-navSubItemContentBullet": {
+              minWidth: "5px",
+              minHeight: "5px",
+              borderRadius: "50%",
+              backgroundColor: o.palette.text.primary
+            },
+            "&:hover": {
+              background: o.palette.state.default
+            }
+          }
+        }
+      }
+    }
+  },
+  M4LSideBarDrawer: {
+    styleOverrides: {
+      "&.M4LSideBar-drawer": {
+        "& .M4LSideBar-contentMobile": {
+          width: "100%",
+          height: "100%",
+          display: "flex",
+          flexDirection: "column",
+          "& .M4LSideBar-containerSideBarLogo": {
+            marginRight: "14px",
+            "& .M4LSideBar-containerLogo": {
+              height: "128px",
+              display: "flex",
+              flexDirection: "column",
+              justifyContent: "center",
+              alignItems: "center",
+              fitContent: "100%",
+              boxSizing: "contentBox",
+              paddingTop: "24px",
+              paddingBottom: "28px",
+              gap: "12px",
+              "& .M4LTypography-root": {
+                display: "flex",
+                justifyContent: "center",
+                width: "100%",
+                "& .MuiTypography-root": {
+                  with: "100%",
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  textWrap: "nowrap"
+                }
+              },
+              "& .M4LImage-root": {
+                position: "relative",
+                background: o.palette.background.default,
+                boxShadow: o.customShadows.z3,
+                padding: "6px",
+                borderRadius: "6px"
+              }
+            }
+          },
+          "& .M4LSideBar-contentGroups": {
+            overflow: "hidden",
+            flexGrow: "1",
+            display: "flex",
+            flexDirection: "column",
+            "& .M4LSideBar-contentGroupsLine": {
+              display: "flex",
+              height: "2px",
+              marginRight: "14px",
+              backgroundColor: o.palette.state.default
+            },
+            "& .M4LSideBar-wrapperGroup": {
+              height: "100%",
+              "& .M4LSideBar-wrapperGroupTitle": {
+                padding: "20px",
+                height: "60px",
+                "& .M4LTypography-root": {
+                  display: "flex",
+                  width: "100%",
+                  "& .MuiTypography-root": {
+                    with: "100%",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    textWrap: "nowrap"
+                  }
+                }
+              },
+              "& .M4LSideBar-itemListMainRoot": {
+                display: "flex",
+                borderRadius: "4px 0px 0px 4px",
+                justifyContent: "center",
+                flexDirection: "column",
+                gap: "8px",
+                "& .M4LSideBar-navItemMainRoot": {
+                  backgroundColor: "transparent",
+                  "&:hover": {
+                    background: o.palette.state.default
+                  }
+                },
+                "&.M4LSideBar-itemMainActive": {
+                  "& .M4LSideBar-navItemMainRoot": {
+                    background: o.palette.state.active12,
+                    "&:hover": {
+                      background: t(o.palette.state.active || "#fff", 0.18)
+                    }
+                  },
+                  "& .M4LSideBar-navItemRootContent": {
+                    "& .M4LSideBar-navItemRootContentIconTypo": {
+                      "& .M4LIcon-icon": {
+                        backgroundColor: o.palette.state.focus
+                      },
+                      "& .MuiTypography-root": {
+                        color: o.palette.state.focus
+                      },
+                      "& .M4LSideBar-arrowIconRoot .M4LIcon-icon": {
+                        backgroundColor: o.palette.state.focus
+                      }
+                    },
+                    "&::before": {
+                      content: '""',
+                      width: "5px",
+                      top: "0px",
+                      bottom: "0px",
+                      right: "0px",
+                      backgroundColor: o.palette.state.focus,
+                      borderRadius: "4px 0px 0px 4px",
+                      position: "absolute"
+                    }
+                  }
+                },
+                "& .M4LSideBar-navItemRootContent": {
+                  display: "flex",
+                  padding: "8px",
+                  justifyContent: "center",
+                  borderRadius: "4px 0px 0px 4px",
+                  position: "relative",
+                  "& .M4LSideBar-navItemRootContentIconTypo": {
+                    display: "flex",
+                    gap: "8px",
+                    width: "100%",
+                    "& .M4LIcon-icon": {
+                      backgroundColor: o.palette.text.secondary
+                    },
+                    "& .MuiTypography-root": {
+                      ...o.typography.paragraphDens,
+                      color: o.palette.text.secondary,
+                      textWrap: "nowrap",
+                      textOverflow: "ellipsis",
+                      display: "block",
+                      overflow: "hidden"
+                    },
+                    "& .M4LSideBar-arrowIconRoot .M4LIcon-icon": {
+                      backgroundColor: o.palette.text.secondary
+                    }
+                  }
+                },
+                "& .M4LSideBar-navListSubItemRoot": {
+                  "& .M4LSideBar-navSubItemContentRoot ": {
+                    "&.M4LSideBar-subItemCollapseActive": {
+                      backgroundColor: o.palette.state.active12
+                    },
+                    "&.M4LSideBar-subItemActive": {
+                      "& .M4LSideBar-navSubItemContentBullet": {
+                        height: "14px",
+                        borderRadius: "10px",
+                        backgroundColor: o.palette.state.focus
+                      }
+                    },
+                    "&:hover": {
+                      background: o.palette.state.default
+                    }
+                  },
+                  "& .M4LSideBar-navSubItemContentRoot": {
+                    gap: "12px",
+                    margin: "0px 0px 1px 0px",
+                    padding: "16px",
+                    "& .M4LSideBar-navSubItemContentBullet": {
+                      minWidth: "5px",
+                      minHeight: "5px",
+                      borderRadius: "50%",
+                      backgroundColor: o.palette.text.primary
+                    },
+                    "& .M4LTypography-root": {
+                      display: "flex",
+                      width: "100%",
+                      "& .MuiTypography-root": {
+                        ...o.typography.paragraph,
+                        color: o.palette.text.secondary,
+                        with: "100%",
+                        overflow: "hidden",
+                        textOverflow: "ellipsis",
+                        textWrap: "nowrap"
+                      }
+                    }
+                  }
+                },
+                "& .MuiCollapse-root": {
+                  marginLeft: "28px"
+                }
+              }
+            },
+            "& .M4LIcon-root .M4LIcon-icon": {
+              backgroundColor: o.palette.text.disabled
+            }
+          },
+          "& .M4LSideBar-collapseButton": {
+            display: "flex",
+            paddingTop: "14px",
+            borderTop: "2px solid",
+            borderColor: o.palette.state.default,
+            justifyContent: "center",
+            marginRight: "14px",
+            gap: "15px",
+            "& .M4LSideBar-containerLogoButton": {
+              display: "flex",
+              gap: "14px",
+              "& .M4LSideBar-containerLogoButtonLogo": {
+                width: "120px",
+                height: "40px"
+              },
+              "& .M4LSideBar-containerLogoButtonIcon": {
+                display: "flex",
+                alignItems: "center"
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}), M = (o) => ({
+  M4LAreasAdmin: {
+    styleOverrides: {
+      "&.M4LAreasAdmin-root": {
+        width: "100%",
+        height: "32px",
+        test: "root",
+        borderRadius: "4px",
+        paddingRight: "8px",
+        alignItems: "center",
+        background: o.palette.background.default,
+        boxShadow: o.customShadows.z2,
+        borderTop: "1px solid",
+        borderColor: o.palette.state.default,
+        [o.breakpoints.down("sm")]: {
+          height: "40px"
+        },
+        "& .M4LAreasAdmin-areaIconLayer": {
+          background: o.palette.background.neutral,
+          display: "flex",
+          justifyContent: "center",
+          width: "32px",
+          height: "32px"
+        },
+        "& .M4LAreasAdmin-areaContainerChips": {
+          display: "flex",
+          overflow: "auto",
+          gap: "8px",
+          padding: "0px 0px 0px 8px",
+          width: "100%",
+          justifyContent: "center",
+          background: o.palette.background.default,
+          height: "100%",
+          alignItems: "center",
+          paddingLeft: "8px",
+          "& .MuiBox-root": {
+            display: "flex",
+            alignItems: "center",
+            height: "100%"
+          },
+          "& .simplebar-content": {
+            display: "flex",
+            gap: "8px",
+            alignItems: "center"
+          },
+          "& .M4LAreasAdmin-areaChipRoot ": {
+            display: "flex",
+            boxShadow: o.customShadows.z2,
+            borderRadius: "4px 4px 4px 4px",
+            height: "20px",
+            gap: "8px",
+            paddingLeft: "8px",
+            marginRight: "8px",
+            [o.breakpoints.down("sm")]: {
+              height: "auto"
+            },
+            "&.M4LAreasAdmin-selected": {
+              background: o.palette.state.active,
+              ...o.typography.body,
+              color: o.palette.text.primary,
+              "& .M4LAreasAdmin-areaChipTitle": {
+                backgroundColor: "transparent",
+                border: "none",
+                textWrap: "nowrap",
+                width: "auto",
+                display: "flex",
+                alignItems: "center",
+                color: o.palette.patronus?.marbleLight[10],
+                ...o.typography.action
+              },
+              "& .M4LIconButton-root": {
+                "& .M4LIcon-icon": {
+                  backgroundColor: o.palette.patronus?.marbleLight[10]
+                },
+                "&:active": {
+                  "& .M4LIcon-icon": {
+                    backgroundColor: o.palette.patronus?.marbleLight[10]
+                  }
+                },
+                "&:hover": {
+                  "& .M4LIcon-icon": {
+                    backgroundColor: o.palette.patronus?.marbleLight[10]
+                  }
+                }
+              }
+            },
+            "& .M4LAreasAdmin-areaChipTitle": {
+              backgroundColor: "transparent",
+              border: "none",
+              textWrap: "nowrap",
+              width: "auto",
+              display: "flex",
+              alignItems: "center",
+              color: o.palette.text.secondary,
+              ...o.typography.body
+            },
+            "& .M4LIconButton-root": {
+              display: "flex",
+              justifyContent: "center",
+              width: "20px",
+              height: "20px",
+              "&.M4LIconButton-variantPrimary": {
+                background: o.palette.state.active
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}), L = (o) => ({
+  M4LAreasViewer: {
+    styleOverrides: {
+      "&.M4LAreasViewer-root": {
+        test: "root",
+        background: o.palette.background.background,
+        "& .M4LAreasViewer-areaGridLayout": {
+          "& .M4LAreasViewer-windowRoot": {
+            background: o.palette.background.neutral,
+            border: "none",
+            boxShadow: o.customShadows.z2,
+            borderRadius: "4px",
+            display: "flex",
+            "& .react-resizable-handle": {
+              backgroundColor: "transparent"
+            },
+            "& .M4LAreasViewer-windowRootContainer": {
+              display: "flex",
+              flexDirection: "column",
+              width: "100%",
+              height: "100%"
+            },
+            "& .M4LAreasViewer-windowHeader": {
+              background: o.palette.state.default,
+              padding: "8px",
+              height: "40px",
+              borderRadius: "4px",
+              boxShadow: o.customShadows.z2,
+              borderTop: "2px solid",
+              borderColor: o.palette.state.default,
+              "& .M4LTypography-root .MuiTypography-root": {
+                ...o.typography.paragraph,
+                color: o.palette.text.primary
+              }
+            },
+            "& .M4LAreasViewer-windowContent": {
+              margin: "8px",
+              background: o.palette.background.default,
+              borderRadius: "4px",
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "center",
+              justifyContent: "center"
+            },
+            "&.M4LAreasViewer-selectedWindow": {
+              border: "1px solid",
+              borderColor: o.palette.state.active,
+              boxShadow: o.customShadows.primary,
+              "& .M4LAreasViewer-windowHeader": {
+                background: o.palette.state.active12,
+                "& .M4LTypography-root .MuiTypography-root": {
+                  ...o.typography.paragraphDens
+                }
+              }
+            }
+          }
+        },
+        "& .M4LAreasViewer-panelWindowsRoot": {
+          "& .M4LAreasViewer-panelWindowsButtonContainer": {
+            border: "1px solid",
+            borderColor: "transparent",
+            "&.M4LAreasViewer-selected": {
+              borderColor: o.palette.state.focus
+            }
+          }
+        },
+        "& .M4LAreasViewer-windowPopupRoot": {
+          boxShadow: o.customShadows.z3,
+          "& .M4LAreasViewer-windowRoot": {
+            padding: "8px",
+            background: o.palette.state.default,
+            borderRadius: "4px",
+            border: "1px solid",
+            borderColor: o.palette.state.default,
+            backdropFilter: "blur(8px)",
+            "& > .react-resizable-handle": {
+              backgroundColor: "transparent"
+            },
+            "& .M4LAreasViewer-windowRootContainer": {
+              background: o.palette.background.default,
+              borderRadius: "4px",
+              "& .M4LAreasViewer-windowHeader": {
+                height: "28px",
+                minHeight: "28px",
+                padding: "0px 8px",
+                boxShadow: "none",
+                "& .M4LTypography-root .MuiTypography-root": {
+                  ...o.typography.body,
+                  color: o.palette.text.secondary
+                }
+              }
+            },
+            "&.M4LAreasViewer-selectedWindow": {
+              border: "1px solid",
+              borderColor: o.palette.state.active12,
+              background: o.palette.state.active12,
+              boxShadow: o.customShadows.z3,
+              padding: "8px",
+              "& .M4LAreasViewer-windowHeader": {
+                background: o.palette.state.default,
+                padding: "8px",
+                height: "40px",
+                borderRadius: "4px",
+                boxShadow: o.customShadows.z2,
+                borderTop: "2px solid",
+                borderColor: o.palette.state.default,
+                "& .M4LTypography-root .MuiTypography-root": {
+                  ...o.typography.body,
+                  color: o.palette.text.primary
+                }
+              }
+            }
+          }
+        },
+        "& .M4LAreasViewer-windowModalRoot": {
+          background: o.palette.background.background,
+          borderRadius: "4px",
+          boxShadow: o.customShadows.z4,
+          "& .M4LAreasViewer-windowRoot": {
+            background: o.palette.background.background,
+            margin: "0px",
+            padding: "0px",
+            borderRadius: "4px",
+            "& .react-resizable-handle": {
+              backgroundColor: "transparent"
+            },
+            "& .M4LAreasViewer-windowRootContainer": {
+              display: "flex",
+              flexDirection: "column",
+              height: "100%",
+              "& .M4LAreasViewer-windowHeader": {
+                height: "48px",
+                minHeight: "48px",
+                padding: "0px 8px",
+                boxShadow: "none",
+                background: "none",
+                borderColor: "transparent",
+                "& .M4LTypography-root .MuiTypography-root": {
+                  ...o.typography.paragraph,
+                  color: o.palette.text.primary
+                }
+              },
+              "& .M4LAreasViewer-windowContent": {
+                margin: "0px 8px 8px 8px",
+                background: o.palette.background.neutral,
+                borderRadius: "4px",
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                justifyContent: "center",
+                flexGrow: "1",
+                height: "100%"
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+});
+export {
+  g as M,
+  e as a,
+  r as b,
+  n as c,
+  i as d,
+  p as e,
+  x as f,
+  l as g,
+  d as h,
+  s as i,
+  c as j,
+  u as k,
+  b as l,
+  M as m,
+  L as n
+};