diff --git a/assets/styles/layout/_core.scss b/assets/styles/layout/_core.scss
index ba0147d94..e253a7a93 100644
--- a/assets/styles/layout/_core.scss
+++ b/assets/styles/layout/_core.scss
@@ -88,7 +88,7 @@ input[type="number"] {
     user-select: none;
 }
 
-.px-link:focus {
+.px-link:focus-visible {
     outline: 0 none;
     outline-offset: 0;
     box-shadow: var(--focus-ring);
diff --git a/assets/styles/layout/_doc.scss b/assets/styles/layout/_doc.scss
index f1f3b17ba..3b086bccc 100644
--- a/assets/styles/layout/_doc.scss
+++ b/assets/styles/layout/_doc.scss
@@ -17,19 +17,19 @@
             padding: 1rem 2rem;
             min-width: 12rem;
             text-align: center;
-            color: var(--text-color-secondary);
+            color: var(--surface-700);
             font-size: 1.125rem;
             letter-spacing: 2px;
             cursor: pointer;
             margin: 0;
-            transition: all 0.3s;
+            transition: all 0.2s;
             border-bottom: 1px solid transparent;
             border-top-right-radius: var(--border-round);
             border-top-left-radius: var(--border-round);
             white-space: nowrap;
 
             &:hover {
-                border-bottom-color: var(--text-color);
+                border-bottom-color: var(--surface-500);
             }
 
             &:focus {
@@ -159,6 +159,11 @@
         .navbar-item-content {
             border-left: 1px solid var(--surface-border);
             padding-left: .25rem;
+            transition: all .2s;
+
+            &:hover {
+                border-left-color: var(--surface-500);
+            }
         }
     }
 
@@ -168,14 +173,17 @@
 
             .px-link {
                 padding: 0.25rem 1rem 0.25rem 1rem;
-                color: var(--text-color);
+                color: var(--surface-800);
                 white-space: nowrap;
                 min-width: 0;
                 overflow: hidden;
                 text-overflow: ellipsis;
+                transition: all .2s;
+            }
 
-                &:hover {
-                    color: var(--primary-color);
+            &:hover {
+                .px-link {
+                    color: var(--surface-900);
                 }
             }
         }
@@ -185,7 +193,6 @@
                 border-color: var(--primary-color);
 
                 .px-link {
-                    font-weight: 700;
                     color: var(--primary-color);
                 }
             }
diff --git a/assets/styles/layout/_sidebar.scss b/assets/styles/layout/_sidebar.scss
index e635c2486..315f39f9a 100644
--- a/assets/styles/layout/_sidebar.scss
+++ b/assets/styles/layout/_sidebar.scss
@@ -28,11 +28,8 @@
         margin: 0;
         padding: 0;
 
-        li {
-            margin-bottom: .25rem;
-        }
-
         > li {
+            margin-bottom: .25rem;
             > button, 
             > a {
                 display: flex;
@@ -41,12 +38,7 @@
                 padding: .5rem;
                 color: var(--surface-900);
                 font-weight: 600;
-                transition: box-shadow .2s;
-                border-radius: var(--border-radius);
-    
-                &:hover {
-                    background-color: var(--surface-hover);
-                }
+                transition: all .2s;
 
                 .menu-icon {
                     width: 2rem;
@@ -57,81 +49,102 @@
                     display: inline-flex;
                     align-items: center;
                     justify-content: center;
+                    transition: all .2s;
     
                     i {
                         color: var(--surface-700);
+                        transition: all .2s;
                     }
                 }
     
                 .menu-toggle-icon {
-                    color: var(--surface-600);
+                    color: var(--surface-700);
                     margin-left: auto;
                 }
+
+                &:hover {
+                    .menu-icon {
+                        i {
+                            color: var(--surface-900);
+                        }
+                    }
+
+                    .menu-toggle-icon {
+                        color: var(--surface-900);
+                    }
+                }
+
+                &.router-link-active {
+                    color: var(--primary-color);
+        
+                    > .menu-icon {
+                        i {
+                            color: var(--primary-color);
+                        }
+                    }
+                }
             }
             
             > div {
-                > ol {
+                ol {
                     margin: 0 0 0 1.5rem;
-                    padding: .25rem 0 0 .5rem;
-                    border-left: 1px solid var(--surface-border);
+                    padding: .25rem 0;
+                    list-style: none;
 
-                    > li {
-                        > ol {
-                            margin-bottom: 1.5rem;
+                    li {
+                        a {
+                            color: var(--surface-700);
+                            border-left: 1px solid var(--surface-border);
+                            transition: all .2s;
+                            font-weight: 400;
+                            display: flex;
+                            padding: .5rem .5rem .5rem 1rem;
+                            color: var(--surface-700);
+                            transition: all .2s;
+
+                            &:focus-visible {
+                                outline: 0 none;
+                                box-shadow: inset var(--focus-ring);
+                            }
+            
+                            &:hover {
+                                color: var(--surface-900);
+                                border-left-color: var(--surface-500);
+                            }
+
+                            &.router-link-active {
+                                color: var(--primary-color);
+                                border-left-color: var(--primary-color);
+                            }
+                        }
+
+                        ol {
+                            margin: 0;
+                            padding: 0;
+                        }
+
+
+
+                        &:has(.menu-child-category) {
+                            margin-top: 1rem;
+                        }
+
+                        &:has(.menu-child-category):first-child {
+                            margin-top: 0rem;
                         }
                     }
                 }
             }
         }
 
-        a.router-link-active {
-            background-color: var(--highlight-bg);
-            color: var(--highlight-text-color);
-
-            &:hover {
-                background-color: var(--highlight-bg);
-                color: var(--highlight-text-color);
-            }
-
-            > .menu-icon {
-                i {
-                    color: var(--highlight-text-color);
-                }
-            }
-        }
-
         .menu-child-category {
             display: flex;
-            padding: .5rem .5rem .5rem 1rem;
+            padding: .5rem .5rem .5rem 0;
             font-size: .875rem;
-            font-weight: 700;
+            font-weight: 600;
             letter-spacing: 1px;
             color: var(--surface-900);
-            border-bottom: 1px solid var(--surface-border);
             margin-bottom: .25rem;
         }
-
-        ol {
-            list-style: none;
-            margin: 0;
-            padding: 0;
-
-            a {
-                display: flex;
-                padding: .5rem .5rem .5rem 1rem;
-                color: var(--surface-900);
-                border-radius: var(--border-radius);
-                transition: box-shadow .2s;
-                
-                &:focus {
-                    outline: 0 none;
-                    box-shadow: inset var(--focus-ring);
-                }
-
-                &:hover {
-                    background-color: var(--surface-hover);
-                }
-            }
-        }
     }
 }
\ No newline at end of file
diff --git a/layouts/AppMenuItem.vue b/layouts/AppMenuItem.vue
index 819cf66b7..48dc1ee11 100644
--- a/layouts/AppMenuItem.vue
+++ b/layouts/AppMenuItem.vue
@@ -24,7 +24,7 @@
         </PrimeVueNuxtLink>
 
         <span v-if="!root && menuitem.children" class="menu-child-category">{{ menuitem.name }}</span>
-        <div class="overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out" :class="{ hidden: menuitem.children && root && isActiveRootmenuItem(menuitem) }">
+        <div v-if="menuitem.children" class="overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out" :class="{ hidden: menuitem.children && root && isActiveRootmenuItem(menuitem) }">
             <ol>
                 <AppMenuItem :root="false" :menu="menuitem.children"></AppMenuItem>
             </ol>
diff --git a/nuxt.config.js b/nuxt.config.js
index 88a55db7e..d845e949a 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -42,6 +42,10 @@ export default defineNuxtConfig({
                     rel: 'stylesheet',
                     href: baseUrl + 'themes/lara-light-blue/theme.css'
                 },
+                {
+                    rel: 'stylesheet',
+                    href: 'https://fonts.cdnfonts.com/css/dm-sans'
+                },
                 { rel: 'icon', href: baseUrl + 'favicon.ico' }
             ],
             script: [
diff --git a/public/themes/lara-dark-blue/theme.css b/public/themes/lara-dark-blue/theme.css
index 8e98855de..c9cf1ae9c 100644
--- a/public/themes/lara-dark-blue/theme.css
+++ b/public/themes/lara-dark-blue/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:rgba(255, 255, 255, 0.6);
   --primary-color:#93C5FD;
   --primary-color-text:#1c2127;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #040d19;
   --surface-50: #1d2530;
   --surface-100: #363d47;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   background: #040d19;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {
diff --git a/public/themes/lara-dark-indigo/theme.css b/public/themes/lara-dark-indigo/theme.css
index 924df24e6..546970861 100644
--- a/public/themes/lara-dark-indigo/theme.css
+++ b/public/themes/lara-dark-indigo/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:rgba(255, 255, 255, 0.6);
   --primary-color:#A5B4FC;
   --primary-color-text:#1c2127;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #040d19;
   --surface-50: #1d2530;
   --surface-100: #363d47;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   background: #040d19;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {
diff --git a/public/themes/lara-dark-purple/theme.css b/public/themes/lara-dark-purple/theme.css
index fcd62e01f..9375e42b2 100644
--- a/public/themes/lara-dark-purple/theme.css
+++ b/public/themes/lara-dark-purple/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:rgba(255, 255, 255, 0.6);
   --primary-color:#C4B5FD;
   --primary-color-text:#1c2127;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #040d19;
   --surface-50: #1d2530;
   --surface-100: #363d47;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   background: #040d19;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {
diff --git a/public/themes/lara-dark-teal/theme.css b/public/themes/lara-dark-teal/theme.css
index e71fe5df0..8ff5d0642 100644
--- a/public/themes/lara-dark-teal/theme.css
+++ b/public/themes/lara-dark-teal/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:rgba(255, 255, 255, 0.6);
   --primary-color:#5EEAD4;
   --primary-color-text:#1c2127;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #040d19;
   --surface-50: #1d2530;
   --surface-100: #363d47;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: rgba(255, 255, 255, 0.87);
   background: #040d19;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {
diff --git a/public/themes/lara-light-blue/theme.css b/public/themes/lara-light-blue/theme.css
index 1a35f9778..aac0fe4bd 100644
--- a/public/themes/lara-light-blue/theme.css
+++ b/public/themes/lara-light-blue/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:#6c757d;
   --primary-color:#3B82F6;
   --primary-color-text:#ffffff;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #ffffff;
   --surface-50: #FAFAFA;
   --surface-100: #F5F5F5;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   background: #ffffff;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {
diff --git a/public/themes/lara-light-indigo/theme.css b/public/themes/lara-light-indigo/theme.css
index 23c71812c..1c7836714 100644
--- a/public/themes/lara-light-indigo/theme.css
+++ b/public/themes/lara-light-indigo/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:#6c757d;
   --primary-color:#6366F1;
   --primary-color-text:#ffffff;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #ffffff;
   --surface-50: #FAFAFA;
   --surface-100: #F5F5F5;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   background: #ffffff;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {
diff --git a/public/themes/lara-light-purple/theme.css b/public/themes/lara-light-purple/theme.css
index f8fd751b7..2e5d2cbe6 100644
--- a/public/themes/lara-light-purple/theme.css
+++ b/public/themes/lara-light-purple/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:#6c757d;
   --primary-color:#8B5CF6;
   --primary-color-text:#ffffff;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #ffffff;
   --surface-50: #FAFAFA;
   --surface-100: #F5F5F5;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   background: #ffffff;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {
diff --git a/public/themes/lara-light-teal/theme.css b/public/themes/lara-light-teal/theme.css
index 2f7c25dc8..cf6612e9f 100644
--- a/public/themes/lara-light-teal/theme.css
+++ b/public/themes/lara-light-teal/theme.css
@@ -9,7 +9,7 @@
   --text-color-secondary:#6c757d;
   --primary-color:#14B8A6;
   --primary-color-text:#ffffff;
-  --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
+  --font-family:'DM Sans', sans-serif;
   --surface-0: #ffffff;
   --surface-50: #FAFAFA;
   --surface-100: #F5F5F5;
@@ -52,7 +52,7 @@
 }
 
 .p-component {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   font-weight: normal;
 }
@@ -85,7 +85,7 @@
 
 .p-link {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   border-radius: 6px;
 }
 .p-link:focus {
@@ -265,7 +265,7 @@
   padding: 0.375rem 0;
 }
 .p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -722,7 +722,7 @@
   padding: 0.375rem 0;
 }
 .p-chips .p-chips-multiple-container .p-chips-input-token input {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   padding: 0;
@@ -1087,7 +1087,7 @@
 }
 
 .p-inputtext {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
   font-size: 1rem;
   color: #495057;
   background: #ffffff;
@@ -5894,7 +5894,7 @@
 }
 .p-terminal .p-terminal-input {
   font-size: 1rem;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: 'DM Sans', sans-serif;
 }
 
 .p-button-label {