@m4l/styles 0.0.28 → 0.0.29

package/theme/overrides/M4LExtendedComponents/{index.e4d90ec0.js → index.c76da8b1.js}

@@ -1,5 +1,5 @@
-import { alpha as t } from "@mui/material/styles";
-import { alpha as r } from "@mui/system";
+import { alpha as r } from "@mui/material/styles";
+import { alpha as t } from "@mui/system";
 const i = (o) => ({
   M4LDynamicFilter: {
     styleOverrides: {
@@ -49,7 +49,6 @@ const i = (o) => ({
             width: "100%",
             alignItems: "center",
             maxWidth: "100%",
-            borderRadius: "4px",
             [o.breakpoints.down("sm")]: {
               height: "100%",
               padding: "8px"
@@ -69,10 +68,6 @@ const i = (o) => ({
           alignItems: "center",
           borderTopRightRadius: "4px",
           borderBottomRightRadius: "4px",
-          [o.breakpoints.down("sm")]: {
-            gap: "8px",
-            padding: "8px"
-          },
           "& .M4LIconButton-root .M4LDynamicFilter-filterButton": {
             background: o.palette.state.focus
           }
@@ -87,17 +82,20 @@ const i = (o) => ({
           maxWidth: "135px",
           width: "100%",
           alignItems: "center",
-          borderRadius: "4px",
+          borderTopLeftRadius: "4px",
+          borderBottomLeftRadius: "4px",
           "& > input": {
-            border: "1px solid",
-            borderColor: o.palette.state.overdefoult,
             background: "none",
             ...o.typography.body,
             color: o.palette.text.primary,
             padding: "0px 4px",
             width: "100%",
             height: "100%",
-            borderRadius: "2px"
+            borderRadius: "2px",
+            border: "unset",
+            "&::placeholder": {
+              color: o.palette.text.secondary
+            }
           },
           "& input:focus-visible": {
             border: "1px solid",
@@ -118,8 +116,6 @@ const i = (o) => ({
           height: "30px",
           margin: "0px",
           padding: "0px 4px",
-          borderRight: "1px solid",
-          borderColor: o.palette.state.default,
           [o.breakpoints.down("sm")]: {
             height: "auto",
             padding: "4px"
@@ -139,7 +135,6 @@ const i = (o) => ({
           alignItems: "center",
           borderRadius: "4px",
           background: o.palette.state.default,
-          boxShadow: o.customShadows.z1,
           color: o.palette.text.secondary,
           ...o.typography.body,
           border: "1px solid",
@@ -206,15 +201,14 @@ const i = (o) => ({
             minWidht: "220px",
             height: "fit-content",
             "& .M4LDynamicFilter-popoverFilterHeader": {
-              background: o.palette.state.default,
+              background: o.palette.background.neutral,
               display: "flex",
               gap: "8px",
               padding: "6px 8px 6px 8px",
-              borderRadius: "4px",
-              boxShadow: o.customShadows.z1,
+              borderTopLeftRadius: "4px",
+              borderTopRightRadius: "4px",
+              boxShadow: "unset",
               borderBottom: "0px",
-              borderTop: "1.5px solid",
-              borderColor: o.palette.state.borderTop,
               "& .MuiTypography-root": {
                 ...o.typography.bodyDens,
                 color: o.palette.text.primary
@@ -608,8 +602,7 @@ const i = (o) => ({
     styleOverrides: {
       "&.M4LButton-root": {
         "&.M4LButton-colorError .MuiButtonBase-root": {
-          backgroundColor: `${o.palette.state.error.normal}!important`,
-          test: "bruce button"
+          backgroundColor: `${o.palette.state.error.normal}!important`
         },
         "&.M4LButton-colorWarning .MuiButtonBase-root": {
           backgroundColor: `${o.palette.state.warning.normal}!important`
@@ -1193,7 +1186,7 @@ const i = (o) => ({
                   "& .M4LSideBar-navItemMainRoot": {
                     background: o.palette.state.active12,
                     "&:hover": {
-                      background: t(o.palette.state.active || "#fff", 0.24),
+                      background: r(o.palette.state.active || "#fff", 0.24),
                       cursor: "pointer"
                     }
                   },
@@ -1544,7 +1537,7 @@ const i = (o) => ({
                   "& .M4LSideBar-navItemMainRoot": {
                     background: o.palette.state.active12,
                     "&:hover": {
-                      background: t(o.palette.state.active || "#fff", 0.24),
+                      background: r(o.palette.state.active || "#fff", 0.24),
                       cursor: "pointer"
                     }
                   },
@@ -1737,14 +1730,12 @@ const i = (o) => ({
         borderRadius: "6px",
         paddingRight: "6px",
         alignItems: "center",
-        background: o.palette.background.default,
         justifyContent: "space-between",
         width: "70%",
         maxWidth: "fit-content",
         gap: "8px",
         border: "1px solid",
         borderColor: "transparent",
-        boxShadow: o.customShadows.z1,
         [o.breakpoints.down("sm")]: {
           boxShadow: o.customShadows.z1,
           paddingRight: "0px",
@@ -1762,7 +1753,7 @@ const i = (o) => ({
           overflow: "auto",
           justifyContent: "center",
           alignItems: "center",
-          gap: "8px",
+          gap: "4px",
           [o.breakpoints.down("sm")]: {
             gap: "0px",
             borderRadius: "4px"
@@ -1803,7 +1794,6 @@ const i = (o) => ({
             overflow: "auto",
             height: "36px",
             borderRight: "1px solid",
-            paddingLeft: "4px",
             borderColor: o.palette.state.overdefoult,
             [o.breakpoints.down("sm")]: {
               background: "none",
@@ -1849,6 +1839,17 @@ const i = (o) => ({
                   width: "100%",
                   background: "none"
                 },
+                "& .M4LAreasAdmin-areaContentChips": {
+                  display: "flex",
+                  width: "fit-content",
+                  height: "30px",
+                  alignItems: "center",
+                  gap: "4px",
+                  paddingRight: "4px",
+                  [o.breakpoints.down("sm")]: {
+                    height: "44px"
+                  }
+                },
                 "& .M4LAreasAdmin-areaChipMobileRoot": {
                   width: "100%",
                   "& .M4LAreasAdmin-areaChipRoot": {
@@ -1884,8 +1885,7 @@ const i = (o) => ({
                       overflow: "auto",
                       "& .simplebar-content": {
                         width: "fit-content",
-                        overflow: "auto",
-                        gap: "4px"
+                        overflow: "auto"
                       }
                     }
                   }
@@ -1977,17 +1977,14 @@ const i = (o) => ({
                 },
                 "& .M4LAreasAdmin-areaChipRoot ": {
                   display: "flex",
-                  boxShadow: o.customShadows.z1,
+                  background: o.palette.background.default,
                   borderRadius: "4px 4px 4px 4px",
                   marginRight: "8px",
-                  height: "22px",
+                  minHeight: "26px",
                   width: "fit-content",
                   gap: "8px",
                   paddingLeft: "8px",
                   alignItems: "center",
-                  border: "1px solid",
-                  borderColor: o.palette.state.default,
-                  background: o.palette.state.default,
                   [o.breakpoints.down("sm")]: {
                     background: "none",
                     border: "none",
@@ -2076,15 +2073,7 @@ const i = (o) => ({
             borderRadius: "0px 4px 4px 0px",
             borderColor: o.palette.background.background
           },
-          "& .M4LAreasAdmin-areasAddButton": {
-            backgroundColor: `${o.palette.state.active}!important`,
-            "& .M4LIcon-icon": {
-              backgroundColor: `${o.palette.patronus?.marbleLight[10]}`,
-              [o.breakpoints.down("sm")]: {
-                color: o.palette.text.primary
-              }
-            }
-          },
+          "& .M4LAreasAdmin-areasAddButton": {},
           "&.M4LAreasAdmin-isMobile": {
             overflow: "hidden",
             boxShadow: o.customShadows.z1,
@@ -2104,7 +2093,15 @@ const i = (o) => ({
     styleOverrides: {
       "&.M4LAreasAdmin-areaEditPopover": {
         "& .MuiPaper-root": {
-          width: "200px"
+          width: "200px",
+          "& .M4LRHFormProvider-root": {
+            "& .M4LRHFTextField-root": {
+              paddingBottom: "4px"
+            },
+            "& .M4LCommonActions-root": {
+              padding: "16px 0 8px 0px"
+            }
+          }
         }
       }
     }
@@ -2150,7 +2147,7 @@ const i = (o) => ({
             background: o.palette.background.background,
             border: "2px solid",
             borderColor: o.palette.state.overdefoult,
-            boxShadow: o.customShadows.z2,
+            boxShadow: "unset",
             borderRadius: "4px",
             display: "flex",
             "&:not(.M4LAreasViewer-loading)": {
@@ -2169,18 +2166,22 @@ const i = (o) => ({
               display: "flex",
               flexDirection: "column",
               width: "100%",
-              height: "100%"
+              height: "100%",
+              overflow: "hidden"
             },
             "& .M4LAreasViewer-windowHeader": {
               display: "flex",
               flexDirection: "column",
-              background: o.palette.state.default,
+              background: o.palette.background.neutral,
               padding: "4px 4px 4px 8px",
               height: "36px",
               minHeight: "36px",
-              borderRadius: "4px",
               border: "none",
               boxShadow: o.customShadows.z1,
+              [o.breakpoints.down("sm")]: {
+                height: "44px",
+                minHeight: "44px"
+              },
               "& .M4LAreasViewer-windowHeaderContent": {
                 display: "flex",
                 width: "100%",
@@ -2189,9 +2190,10 @@ const i = (o) => ({
                 "& .M4LAreasViewer-windowHeaderTitle": {
                   display: "flex",
                   alignItems: "center",
-                  overflow: "auto",
+                  overflow: "hidden",
                   width: "100%",
                   padding: "0 12px",
+                  height: "100%",
                   "& .MuiTypography-root": {
                     whiteSpace: "nowrap",
                     overflow: "hidden",
@@ -2252,7 +2254,7 @@ const i = (o) => ({
                       width: "100%",
                       top: "0px",
                       left: "0px",
-                      background: o.palette.state.skeleton.default,
+                      background: o.palette.state.active12,
                       "& .MuiLinearProgress-bar1Determinate .MuiLinearProgress-barColorPrimary": {
                         transform: "translateX(100%)"
                       }
@@ -2338,11 +2340,24 @@ const i = (o) => ({
               justifyContent: "center",
               width: "100%",
               flex: "1",
-              overflow: "hidden"
+              overflow: "hidden",
+              [o.breakpoints.up("sm")]: {
+                padding: "4px"
+              },
+              "& .M4LAreasViewer-containerLinearProgress": {
+                width: "100%",
+                height: "100%",
+                display: "flex",
+                alignItems: "center",
+                padding: "0 16px",
+                "& .MuiLinearProgress-root": {
+                  background: t(o.palette.state.active, 0.3)
+                }
+              }
             },
             "&.M4LAreasViewer-selectedWindow": {
               border: "2px solid",
-              borderColor: o.palette.state.active,
+              borderColor: t(o.palette.state.active, 0.5),
               boxShadow: o.customShadows.primary,
               backdropFilter: "blur(100px)",
               "& .M4LAreasViewer-windowHeader": {
@@ -2354,7 +2369,6 @@ const i = (o) => ({
                 position: "relative",
                 padding: "4px 4px 4px 8px",
                 justifyContent: "end",
-                minHeight: "36px",
                 overflow: "hidden",
                 cursor: "move",
                 height: "36px",
@@ -2384,8 +2398,10 @@ const i = (o) => ({
               padding: "4px 0 0 0"
             },
             "& .M4LAreasViewer-selectedWindow": {
-              borderColor: o.palette.state.active12,
-              boxShadow: o.customShadows.z2
+              borderColor: "transparent",
+              boxShadow: "unset",
+              padding: "0px",
+              border: "unset"
             }
           },
           "&. M4LGridLayout-colapsed ": {
@@ -2421,8 +2437,6 @@ const i = (o) => ({
               background: o.palette.background.neutral,
               borderRadius: "4px",
               "& .M4LAreasViewer-windowHeader": {
-                height: "28px",
-                minHeight: "28px",
                 boxShadow: "none",
                 background: o.palette.state.default,
                 "& .M4LIcon-root": {
@@ -2435,7 +2449,7 @@ const i = (o) => ({
                   }
                 },
                 "& .M4LTypography-root .MuiTypography-root": {
-                  ...o.typography.body,
+                  ...o.typography.paragraph,
                   color: o.palette.text.secondary,
                   overflow: "visible"
                 }
@@ -2462,7 +2476,6 @@ const i = (o) => ({
                 "& .M4LAreasViewer-windowRootContainer": {
                   "& .M4LAreasViewer-windowHeader": {
                     background: o.palette.state.default,
-                    height: "28px",
                     borderRadius: "4px",
                     boxShadow: o.customShadows.z1,
                     "& .M4LIcon-root": {
@@ -2471,7 +2484,7 @@ const i = (o) => ({
                       }
                     },
                     "& .M4LTypography-root .MuiTypography-root": {
-                      ...o.typography.body,
+                      ...o.typography.paragraph,
                       color: o.palette.text.primary,
                       overflow: "visible"
                     }
@@ -2481,15 +2494,17 @@ const i = (o) => ({
             },
             "&.M4LAreasViewer-selectedWindow": {
               border: "2px solid",
-              borderColor: o.palette.state.active,
+              borderColor: t(o.palette.state.active, 0.5),
               background: o.palette.state.active12,
               boxShadow: o.customShadows.z3,
               padding: "6px",
+              [o.breakpoints.down("sm")]: {
+                padding: "0"
+              },
               "& .M4LAreasViewer-windowRootContainer": {
                 boxShadow: o.customShadows.z2,
                 "& .M4LAreasViewer-windowHeader": {
                   background: o.palette.state.skeleton,
-                  height: "28px",
                   borderRadius: "4px",
                   boxShadow: o.customShadows.z1,
                   "& .M4LIcon-root": {
@@ -2498,7 +2513,7 @@ const i = (o) => ({
                     }
                   },
                   "& .M4LTypography-root .MuiTypography-root": {
-                    ...o.typography.body,
+                    ...o.typography.paragraphDens,
                     color: o.palette.text.primary,
                     overflow: "visible"
                   }
@@ -2598,6 +2613,20 @@ const i = (o) => ({
           boxShadow: o.customShadows.z4,
           background: o.palette.background.background
         },
+        "& .M4LAreasViewer-windowHeaderTitle": {
+          display: "flex",
+          alignItems: "center",
+          overflow: "auto",
+          width: "100%",
+          padding: "0 12px",
+          height: "100%",
+          "& .MuiTypography-root": {
+            whiteSpace: "nowrap",
+            overflow: "hidden",
+            textOverflow: "ellipsis",
+            width: "100%"
+          }
+        },
         "& .M4LAreasViewer-areasLoadingErrorRoot": {
           display: "flex",
           flexDirection: "column",
@@ -2653,7 +2682,7 @@ const i = (o) => ({
           }
         },
         "& .MuiBackdrop-root": {
-          background: r(`${o.palette.patronus?.ashBlak[60]}`, 0.8)
+          background: t(`${o.palette.patronus?.ashBlak[60]}`, 0.8)
         },
         "&:not(.M4LAreasViewer-loading)": {
           "& .M4LinearProgressIndeterminate-root": {
@@ -2670,19 +2699,18 @@ const i = (o) => ({
           background: o.palette.background.background,
           borderRadius: "4px",
           boxShadow: o.customShadows.z4,
+          overflow: "hidden",
           "& .M4LAreasViewer-windowHeader": {
             cursor: "all-scroll",
             display: "flex",
             flexDirection: "column",
             padding: "4px 4px 4px 8px",
-            height: "36px",
-            minHeight: "36px",
             borderRadius: "4px",
             border: "none",
             "& .M4LTypography-root .MuiTypography-root": {
               ...o.typography.paragraph,
               color: o.palette.text.primary,
-              overflow: "visible"
+              overflow: "hidden"
             },
             "& .M4LAreasViewer-windowHeaderContent": {
               display: "flex",
@@ -2727,8 +2755,9 @@ const i = (o) => ({
         height: "52px",
         alignItems: "center",
         padding: "4px",
-        borderColor: o.palette.state.borderTop,
         background: o.palette.background.neutral,
+        borderBottom: "1px solid",
+        borderColor: o.palette.state.overdefoult,
         justifyContent: "space-between",
         [o.breakpoints.down("sm")]: {
           width: "100%",
@@ -2981,7 +3010,6 @@ const i = (o) => ({
           display: "flex",
           width: "100%",
           height: "100%",
-          boxShadow: o.customShadows.z1,
           borderRadius: "6px"
         }
       }
@@ -3076,8 +3104,7 @@ const i = (o) => ({
         "& .splitter-layout > .layout-splitter:hover": {
           borderRadius: "2px",
           borderLeft: "2px",
-          borderRight: "2px",
-          background: o.palette.action.hover
+          borderRight: "2px"
         },
         "& .splitter-layout.splitter-layout-vertical.layout-changing": {
           cursor: "row-resize"
@@ -3123,11 +3150,6 @@ const i = (o) => ({
             position: "absolute",
             background: o.palette.state.overdefoult
           }
-        },
-        "& .splitter-layout.splitter-layout-vertical > .layout-splitter:hover": {
-          borderTop: "2px",
-          borderBottom: "2px",
-          background: o.palette.action.hover
         }
       }
     }
@@ -3203,7 +3225,10 @@ const i = (o) => ({
   M4LPropertyValue: {
     styleOverrides: {
       "&.M4LPropertyValue-root": {
-        test: "root"
+        test: "root",
+        "&:hover": {
+          backgroundColor: o.palette.state?.default
+        }
       }
     }
   }
@@ -3212,10 +3237,8 @@ const i = (o) => ({
     styleOverrides: {
       "&.M4LTab-root": {
         width: "fit-content",
-        borderRadius: "4px",
         "& .MuiButtonBase-root": {
           height: "36px",
-          borderRadius: "4px",
           display: "flex",
           flexDirection: "row",
           alignItems: "center",
@@ -3225,14 +3248,14 @@ const i = (o) => ({
           minWidth: "fit-content",
           gap: "8px",
           ...o.typography.body,
-          color: o.palette.text.secondary,
+          color: o.palette.text.primary,
           lineHeight: "none",
+          borderRadius: "4px 4px 0 0",
           "& .M4LIcon-root": {
             marginBottom: "0"
           }
         },
         "& .MuiButtonBase-root:hover": {
-          background: o.palette.state.default,
           color: o.palette.state.hover,
           "& .M4LIcon-icon": {
             backgroundColor: o.palette.state.hover
@@ -3240,8 +3263,7 @@ const i = (o) => ({
         },
         "& .Mui-selected": {
           background: o.palette.background.default,
-          border: "1px solid",
-          borderColor: o.palette.state.active12,
+          border: "0px",
           ...o.typography.bodyDens,
           color: o.palette.text.primary,
           lineHeight: "none",
@@ -3250,7 +3272,7 @@ const i = (o) => ({
             width: "95%",
             height: "2px",
             left: "1.5px",
-            bottom: "0px",
+            top: "0px",
             backgroundColor: o.palette.state.active,
             borderRadius: "2px 2px 0px 0px",
             position: "absolute"
@@ -3280,6 +3302,10 @@ const i = (o) => ({
       },
       "& .MuiButtonBase-root": {
         padding: "4px 8px 4px 8px",
+        borderRadius: "4px 4px 0px 0px",
+        "&:hover": {
+          background: o.palette.state.default
+        },
         "&.MuiAccordionSummary-root.Mui-expanded": {
           background: o.palette.state.toneOp,
           "& .M4LTypography-root": {
@@ -3303,7 +3329,7 @@ const i = (o) => ({
         borderTop: "1px solid",
         borderColor: o.palette.state.default,
         borderRadius: "0px 0px 4px 4px",
-        padding: "0 8px",
+        padding: "0",
         "& .M4LAccordion-content": {
           "& .M4LPropertyValue-root:last-of-type": {
             borderBottom: "unset"
@@ -3319,7 +3345,10 @@ const i = (o) => ({
         display: "flex",
         flexDirection: "column",
         width: "100%",
-        height: "auto"
+        height: "auto",
+        "& .M4LCommonActions-root": {
+          padding: "16px 16px 8px 0px"
+        }
       }
     }
   }
@@ -3485,28 +3514,31 @@ const i = (o) => ({
     styleOverrides: {
       "&.M4LModal-root": {
         test: "root",
-        "& .MuiPaper-root": {
+        "& .MuiPaper-root.MuiDialog-paper": {
           display: "flex",
           flexDirection: "column",
           overflow: "hidden",
           borderRadius: "4px",
           margin: "0px",
-          background: "transparent",
           width: "auto",
           height: "auto",
           maxWidth: "unset",
           maxHeight: "unset",
+          background: o.palette.state.active12,
+          border: "2px solid",
+          borderColor: o.palette.state.toneOp,
+          boxShadow: o.customShadows.z3,
           [o.breakpoints.down("sm")]: {
             width: "100%",
             height: "100%",
-            maxHeight: "100%"
+            maxHeight: "100%",
+            borderColor: "transparent"
           },
           "& .M4LModal-windowBaseRoot": {
             display: "flex",
             flexDirection: "column",
             width: "100%",
-            height: "100%",
-            padding: "6px"
+            height: "100%"
           },
           "& .M4LModal-containerWindow": {
             display: "flex",
@@ -3516,20 +3548,18 @@ const i = (o) => ({
             height: "100%",
             overflow: "hidden",
             width: "100%",
-            gap: "24px",
             background: o.palette.background.background,
             boxShadow: o.customShadows.z3,
             borderRadius: "4px",
             "& .M4LCommonActions-root": {
-              padding: "12px 12px 12px 0px",
+              padding: "16px 0 8px 0px",
               margin: "0px",
               width: "100%",
               height: "fit-content",
               display: "flex",
               flexDirection: "row",
               justifyContent: "flex-end",
-              gap: "12px",
-              background: o.palette.background.neutral
+              gap: "12px"
             },
             "& .M4LModal-containerMassageIlustration": {
               display: "flex",
@@ -3539,6 +3569,7 @@ const i = (o) => ({
               height: "100%",
               width: "100%",
               padding: "24px 12px 0px 12px",
+              background: o.palette.background.neutral,
               "& .M4LModal-modalContent": {
                 display: "flex",
                 flexDirection: "column",
@@ -3560,7 +3591,7 @@ const i = (o) => ({
                 },
                 "& .M4LModal-messageContainer": {
                   ...o.typography.body,
-                  color: o.palette.text.primary,
+                  color: o.palette.text.secondary,
                   textAlign: "center"
                 }
               }
@@ -3570,21 +3601,29 @@ const i = (o) => ({
               alignItems: "center",
               justifyContent: "space-between",
               minHeight: "36px",
-              borderBottom: `1px solid ${o.palette.divider}`,
+              padding: "6px 4px 6px 8px",
+              gap: "8px",
+              cursor: "move",
               "& .M4LModal-iconHeader": {
                 display: "flex",
                 alignItems: "center",
-                justifyContent: "center",
-                marginRight: o.spacing(1.5)
+                justifyContent: "center"
               },
               "& .M4LModal-titleHeader": {
-                ...o.typography.subtitle1,
+                ...o.typography.paragraphDens,
                 width: "100%",
                 whiteSpace: "nowrap",
                 textOverflow: "ellipsis",
                 overflow: "hidden"
               },
               "& .M4LModal-iconCloseHeader": {}
+            },
+            "& .M4LModal-windowContent": {
+              padding: "0 8px",
+              width: "100%",
+              height: "100%",
+              display: "flex",
+              flexDirection: "column"
             }
           },
           "& .react-resizable": {
@@ -3592,11 +3631,6 @@ const i = (o) => ({
             flexDirection: "column",
             justifyContent: "center",
             alignItems: "center",
-            "& .custom-handle-nw": {
-              position: "absolute",
-              top: "0",
-              left: "0"
-            },
             "& .M4LIcon-root": {
               "& .M4LIcon-icon": {
                 background: o.palette.text.secondary,
@@ -3690,12 +3724,14 @@ const i = (o) => ({
             fontWeight: "450",
             fontSize: "8pt",
             minWidth: "16px",
+            width: "16px",
             lineHeight: "1px",
             textAlign: "center",
             backgroundColor: o.palette.state.active,
             height: "16px",
             top: "14%",
-            right: "16%"
+            right: "16%",
+            color: o.palette.patronus?.marbleLight[10]
           }
         }
       }
@@ -3706,7 +3742,7 @@ const i = (o) => ({
     styleOverrides: {
       "&.M4LDataGrid-root": {
         background: o.palette.background.default,
-        boxShadow: o.customShadows.z2,
+        boxShadow: "unset",
         borderRadius: "4px",
         display: "flex",
         position: "relative",
@@ -3764,6 +3800,9 @@ const i = (o) => ({
           "& .M4LDataGrid-actionFilter": {},
           "& .M4LDataGrid-actionSettings": {}
         },
+        "& .M4LDataGrid-tableContaniner:not(.M4LDataGrid-withActions)": {
+          top: "0!important"
+        },
         "& .M4LDataGrid-tableContaniner": {
           display: "flex",
           flexDirection: "column",
@@ -3802,29 +3841,16 @@ const i = (o) => ({
               "--rdg-selection-color": o.palette.state.active,
               "--row-selected-hover-background-color": (o.palette.mode === "light", o.palette.state.toneOp),
               "--rdg-checkbox-color": o.palette.primary.main,
-              "--rdg-checkbox-focus-color": t(
+              "--rdg-checkbox-focus-color": r(
                 o.palette.primary.main,
                 o.palette.action.selectedOpacity
               ),
-              "--rdg-border-color": "none"
-            },
-            "& .rdg::-webkit-scrollbar": {
-              width: "6px",
-              height: "6px",
-              borderRadius: "3px",
-              backgroundColor: "transparent"
-            },
-            "& .rdg::-webkit-scrollbar-track": {
-              backgroundColor: "transparent",
-              border: "0px solid transparent"
-            },
-            "& .rdg::-webkit-scrollbar-corner": {
-              backgroundColor: "transparent"
-            },
-            "& ::-webkit-scrollbar-thumb": {
-              borderRadius: "10px",
-              backgroundColor: o.palette.divider,
-              border: "0px solid transparent"
+              "--rdg-border-color": "none",
+              "&:last-child .rdg-cell": {
+                borderBottom: "1px solid !important",
+                borderColor: `${o.palette.background.background}!important`,
+                test: "bruce"
+              }
             },
             '& [role="columnheader"]': {
               justifyContent: "center",
@@ -3844,19 +3870,18 @@ const i = (o) => ({
               },
               "&:hover": {
                 "& .rdg-cell": {
-                  backgroundColor: `${o.palette.state.toneOp}!important`
+                  backgroundColor: `${o.palette.state.gridHover}!important`,
+                  transition: "background-color 0.1s linear"
                 }
               },
               backgroundColor: "transparent"
             },
             "& .rdg-cell": {
-              fontFamily: o.typography.body2.fontFamily,
-              fontWeight: o.typography.body2.fontWeight,
-              fontSize: o.typography.body2.fontSize,
-              color: o.palette.text.secondary,
+              transition: "background-color 0.1s linear",
               borderBottom: "0px solid transparent",
               borderRight: "0.5px solid transparent",
               borderColor: o.palette.background.background,
+              color: o.palette.text.secondary,
               display: "inline",
               justifyContent: "center",
               alignItems: "center",
@@ -3865,7 +3890,8 @@ const i = (o) => ({
               "&.rdg-cell-frozen": {
                 display: "flex",
                 justifyContent: "center",
-                alignItems: "center"
+                alignItems: "center",
+                boxShadow: "unset"
               },
               "&:after": {
                 content: '""',
@@ -3878,6 +3904,14 @@ const i = (o) => ({
                 height: "100%"
               }
             },
+            '& .rdg-cell[role="gridcell"]': {
+              ...o.typography.body,
+              lineHeight: "var(--rdg-row-height)!important"
+            },
+            '& .rdg-cell[role="columnheader"] .rdg-header-sort-name': {
+              ...o.typography.bodyDens,
+              lineHeight: "var(--rdg-row-height)!important"
+            },
             "& [aria-selected=true]": {
               backgroundColor: o.palette.state.toneOp,
               color: o.palette.text.primary
@@ -3889,14 +3923,14 @@ const i = (o) => ({
               alignItems: "center"
             },
             "& .rdg-cell.rdg-cell-align-center": {
-              textAlign: "center"
+              textAlign: "center",
+              display: "flex"
             },
             "& .rdg-cell.rdg-cell-align-right": {
               textAlign: "right"
             },
             "& .rdg-row .rdg-cell-frozen-last:after": {
-              borderRight: "0px solid transparent",
-              boxShadow: "none"
+              borderRight: "0px solid transparent"
             },
             "& .rdg-row :last-child:after": {
               borderRight: "0px solid",
@@ -3941,7 +3975,8 @@ const i = (o) => ({
             "& .rdg-header-sort-cell": {
               width: "100%",
               flexGrow: "1",
-              alignItems: "center"
+              alignItems: "center",
+              color: o.palette.text.primary
             },
             '& [aria-columnsort="ASC"]': {
               borderTop: `2px solid ${o.palette.primary.main}`
@@ -4134,6 +4169,7 @@ const i = (o) => ({
         height: "auto",
         position: "relative",
         minHeight: "36px",
+        borderRadius: "0px",
         "& .MuiTabs-scroller": {
           "& .MuiTabs-flexContainer": {
             padding: "0px",
@@ -4151,17 +4187,17 @@ const i = (o) => ({
     styleOverrides: {
       "&.M4LNoItemSelected-root": {
         width: "100%",
-        height: "100%",
-        maxWidth: "400px",
-        minWidth: "300px",
+        height: "80%",
+        maxWidth: "600px",
+        minWidth: "200px",
         display: "flex",
         flexDirection: "column",
         alignItems: "center",
         justifyContent: "center",
         padding: "24px",
         "& .M4LImage-root": {
-          minHeight: "200px",
-          maxHeight: "200px"
+          maxWidth: "300px",
+          minWidth: "100px"
         }
       }
     }
@@ -4175,22 +4211,24 @@ const i = (o) => ({
         height: "100%",
         overflow: "hidden",
         minHeight: "inherit",
+        "& .simplebar-scrollbar.simplebar-visible:before": {
+          opacity: "1"
+        },
         '& .simplebar-content-wrapper[style*="overflow: hidden scroll;"] .simplebar-content': {
-          marginRight: "14px"
+          marginRight: "9px"
         },
         '& .simplebar-content-wrapper[style*="overflow: scroll hidden;"] .simplebar-content': {
-          marginBottom: "14px"
+          marginBottom: "9px"
         },
         "& .ScrollbarsCustom-Content": {
           position: "relative"
         },
         "& .simplebar-track.simplebar-horizontal .simplebar-scrollbar:before": {
-          background: o.palette.text.disabled,
-          borderRadius: "2px",
-          marginBottom: "40px"
+          background: o.palette.state.scrollBar,
+          borderRadius: "2px"
         },
         "& .simplebar-track.simplebar-vertical .simplebar-scrollbar:before": {
-          background: o.palette.text.disabled,
+          background: o.palette.state.scrollBar,
           borderRadius: "2px"
         }
       }
@@ -4256,6 +4294,35 @@ const i = (o) => ({
       }
     }
   }
+}), Y = (o) => ({
+  M4LTabContent: {
+    styleOverrides: {
+      "&.M4LTabContent-root": {
+        padding: "4px",
+        display: "flex",
+        overflow: "hidden",
+        height: "100%",
+        flexDirection: "column",
+        gap: "4px",
+        background: o.palette.background.default,
+        borderRadius: "0 0 4px 4px",
+        position: "relative"
+      }
+    }
+  }
+}), q = (o) => ({
+  M4LMenuActions: {
+    styleOverrides: {
+      "&.M4LMenuActions-root": {
+        "& .M4LMenuActions-itemDelete": {
+          color: o.palette.state.error.normal,
+          "& .M4LIcon-root .M4LIcon-icon": {
+            backgroundColor: o.palette.state.error.normal
+          }
+        }
+      }
+    }
+  }
 });
 export {
   R as A,
@@ -4275,6 +4342,8 @@ export {
   N as O,
   U as P,
   X as Q,
+  Y as R,
+  q as S,
   i as a,
   T as b,
   n as c,