upgrade Materio to 2.2.1

src/styles/desktop/template/base/libs/vuetify/_overrides.scss

@@ -8,7 +8,7 @@
 // ℹ️ We need accurate vh in mobile devices as well
 .v-application__wrap {
     /* stylelint-disable-next-line liberty/use-logical-spec */
-    min-height: calc(var(--vh, 1vh) * 100);
+    min-height: 100dvh;
 }
 
 // 👉 Typography
@@ -30,7 +30,7 @@ h6,
     color: rgba(var(--v-theme-on-background), var(--v-high-emphasis-opacity));
 }
 
-.v-application,
+body,
 .text-body-1,
 .text-body-2,
 .text-subtitle-1,
@@ -193,7 +193,6 @@ h6,
     color: rgb(var(--v-border-color));
 }
 
-// 👉 DataTable
 // 👉 DataTable
 .v-data-table {
     /* stylelint-disable-next-line no-descending-specificity */
@@ -238,7 +237,7 @@ h6,
 // 👉 VMessages
 .v-messages {
     color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
-    opacity: 1;
+    opacity: 1 !important;
 }
 
 // 👉 Alert close btn

src/styles/desktop/template/base/libs/vuetify/_variables.scss

@@ -1,6 +1,8 @@
 /** Materio Template base classes **/
 /** https://github.com/themeselection/materio-vuetify-vuejs-admin-template-free **/
 
+@use "sass:map";
+
 // 👉 Shadow opacities
 $shadow-key-umbra-opacity-custom: var(--v-shadow-key-umbra-opacity);
 $shadow-key-penumbra-opacity-custom: var(--v-shadow-key-penumbra-opacity);
@@ -47,7 +49,16 @@ $card-transition-property-custom: box-shadow, opacity;
     // 👉 VTimeline
     $timeline-dot-size: 34px !default,
 
+    // 👉 table
+    $table-transition-property:  height !default,
+
     // 👉 VOverlay
     $overlay-opacity: 1 !default,
+
+    // 👉 VContainer
+    $container-max-widths: (
+        "xl": 1440px,
+        "xxl": 1440px
+    ) !default,
 )
 ;