diff --git a/components/lib/theme/lara/fonts/Inter-italic.var.woff2 b/assets/styles/fonts/Inter-italic.var.woff2
similarity index 100%
rename from components/lib/theme/lara/fonts/Inter-italic.var.woff2
rename to assets/styles/fonts/Inter-italic.var.woff2
diff --git a/components/lib/theme/lara/fonts/Inter-roman.var.woff2 b/assets/styles/fonts/Inter-roman.var.woff2
similarity index 100%
rename from components/lib/theme/lara/fonts/Inter-roman.var.woff2
rename to assets/styles/fonts/Inter-roman.var.woff2
diff --git a/assets/styles/layout/_code.scss b/assets/styles/layout/_code.scss
index e66e3ed0c..c7d84a425 100644
--- a/assets/styles/layout/_code.scss
+++ b/assets/styles/layout/_code.scss
@@ -128,6 +128,6 @@ pre[class*="language-"] {
 
 pre[class*="language-"] {    
     code {
-        background: var(--p-dark-surface-900, var(--p-surface-800));
+        background: var(--code-background);
     }
 }
\ No newline at end of file
diff --git a/assets/styles/layout/_content.scss b/assets/styles/layout/_content.scss
index d60687945..e82a1385f 100644
--- a/assets/styles/layout/_content.scss
+++ b/assets/styles/layout/_content.scss
@@ -10,7 +10,7 @@
 }
 
 .card {
-    background: var(--surface-card);
+    background: var(--card-background);
     border: var(--card-border);
     padding: 2rem;
     border-radius: 10px;
diff --git a/assets/styles/layout/_core.scss b/assets/styles/layout/_core.scss
index 0ae30f61a..8c7772169 100644
--- a/assets/styles/layout/_core.scss
+++ b/assets/styles/layout/_core.scss
@@ -1,5 +1,7 @@
 html {
     font-size: 14px;
+    font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+    font-feature-settings: "cv02","cv03","cv04","cv11";
 }
 
 body {
@@ -7,17 +9,15 @@ body {
     min-height: 100%;
     overflow-x: hidden;
     overflow-y: auto;
-    background-color: var(--surface-ground);
+    background-color: var(--ground-background);
     font-weight: normal;
     color: var(--text-color);
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
-    font-family: var(--p-font-family);
-    font-feature-settings: var(--p-font-feature-settings);
 }
 
 .layout-wrapper {
-    background-color: var(--surface-ground);
+    background-color: var(--ground-background);
 }
 
 a {
@@ -25,8 +25,8 @@ a {
 }
 
 ::selection {
-    background-color: var(--p-dark-highlight-bg, var(--p-highlight-bg));
-    color: var(--p-dark-highlight-text-color, var(--p-highlight-text-color));
+    background-color: var(--selection-background);
+    color: var(--selection-text-color);
 } 
 
 h1, h2, h3, h4, h5, h6 {
@@ -34,7 +34,7 @@ h1, h2, h3, h4, h5, h6 {
     font-family: inherit;
     font-weight: 600;
     line-height: 1.2;
-    color: var(--p-dark-surface-0, var(--p-surface-900));
+    color: var(--high-contrast-text-color);
 
     &:first-child {
         margin-top: 0;
@@ -77,7 +77,7 @@ p {
 
 .px-link {
     font-size: 1rem;
-    border-radius: var(--p-border-radius);
+    border-radius: 6px;
     text-align: left;
 	background-color: transparent;
 	margin: 0;
@@ -85,7 +85,6 @@ p {
 	border: none;
     cursor: pointer;
     user-select: none;
-
     @include focus-visible();
 }
 
@@ -94,6 +93,6 @@ p {
 }
 
 button {
-    font-family: var(--p-font-family);
-    font-feature-settings: var(--p-font-feature-settings);
+    font-family: inherit;
+    font-feature-settings: inherit;
 }
\ No newline at end of file
diff --git a/assets/styles/layout/_doc.scss b/assets/styles/layout/_doc.scss
index dab61d62c..e46edfeac 100644
--- a/assets/styles/layout/_doc.scss
+++ b/assets/styles/layout/_doc.scss
@@ -12,7 +12,7 @@
         position: absolute;
         bottom: 0;
         width: 100%;
-        border-bottom: 1px solid var(--surface-border);
+        border-bottom: 1px solid var(--border-color);
         content: '';
     }
 
@@ -31,14 +31,16 @@
             letter-spacing: 1px;
             cursor: pointer;
             margin: 0;
-            transition: all 0.2s;
+            transition: outline-color 0.2s, border-color 0.2s;
+            outline-color: transparent;
             border-bottom: 1px solid transparent;
-            border-top-right-radius: var(--p-border-radius);
-            border-top-left-radius: var(--p-border-radius);
+            border-top-right-radius: 6px;
+            border-top-left-radius: 6px;
             white-space: nowrap;
+            --focus-ring-offset: -1px;
 
             &:hover {
-                border-bottom-color: var(--p-dark-surface-600, var(--p-surface-400));
+                border-bottom-color: var(--hover-border-color);
             }
 
             &:focus {
@@ -50,8 +52,8 @@
 
         &.doc-tabmenu-active {
             button {
-                border-bottom-color: var(--primary-color-default);
-                color: var(--primary-color-default);
+                border-bottom-color: var(--primary-text-color);
+                color: var(--primary-text-color);
             }
         }
     }
@@ -78,7 +80,6 @@
 
     p {
         font-size: 1.125rem;
-        color: var(--text-color);
         margin: 0;
 
         a {
@@ -97,12 +98,13 @@
     scroll-margin-top: 6.5rem;
 
     > a {
-        color: var(--primary-color-default);
+        color: var(--primary-text-color);
         opacity: 0.7;
         margin-left: 1rem;
         display: none;
-        transition: all .2s;
-        border-radius: var(--p-border-radius);
+        transition: outline-color 0.2s, border-color 0.2s, opacity 0.2s;
+        outline-color: transparent;
+        border-radius: 6px;
         @include focus-visible();
     }
 
@@ -120,7 +122,6 @@
 .doc-section-description {
     > p {
         font-size: 1rem;
-        color: var(--text-color);
 
         i {
             border-radius: 6px;
@@ -128,8 +129,8 @@
             font-size: .875rem;
             font-weight: 500;
             font-style: normal;
-            background-color: var(--p-dark-surface-800, var(--p-surface-200));
-            color: var(--p-dark-surface-300, var(--p-surface-700));
+            background: var(--mark-background);
+            color: var(--mark-text);
         }
 
         a {
@@ -142,8 +143,8 @@
         padding: 1rem;
         font-weight: 500;
         border-radius: 10px;
-        background-color:  var(--p-dark-surface-800, var(--p-surface-200));
-        color: var(--p-dark-surface-300, var(--p-surface-700));
+        background: var(--mark-background);
+        color: var(--mark-text);
     }
 }
 
@@ -163,12 +164,12 @@
 
     > .navbar-item {
         .navbar-item-content {
-            border-left: 1px solid var(--surface-border);
+            border-left: 1px solid var(--border-color);
             padding-left: .25rem;
             transition: all .2s;
 
             &:hover {
-                border-left-color: var(--p-dark-surface-600, var(--p-surface-400));
+                border-left-color: var(--hover-border-color);
             }
         }
     }
@@ -185,7 +186,8 @@
                 min-width: 0;
                 overflow: hidden;
                 text-overflow: ellipsis;
-                transition: all .2s;
+                transition: outline-color 0.2s, border-color .2s;
+                outline-color: transparent;
             }
 
             &:hover {
@@ -197,10 +199,10 @@
 
         &.active-navbar-item {
             > .navbar-item-content {
-                border-color: var(--primary-color-default);
+                border-color: var(--primary-text-color);
 
                 .px-link {
-                    color: var(--primary-color-default);
+                    color: var(--primary-text-color);
                 }
             }
         }
@@ -261,12 +263,12 @@
         background-color: transparent;
         transition: background-color .2s, box-shadow .2s;
         border: 0 none;
-        color: var(--p-dark-surface-300, var(--p-surface-300));
+        color: var(--code-button-text-color);
         cursor: pointer;
 
         &:hover {
             background-color: rgba(255,255,255,.1);
-            color: var(--p-dark-surface-100, var(--p-surface-100));
+            color: var(--code-button-text-color);
         }
 
         &.code-active {
@@ -293,7 +295,7 @@
     margin-bottom: 1.5rem;
 
     th {
-        border-bottom: 1px solid var(--surface-border);
+        border-bottom: 1px solid var(--border-color);
         padding: .75rem 1rem;
         text-align: left;
         text-transform: capitalize;
@@ -301,25 +303,25 @@
 
     tbody {
         tr:hover {
-            background: var(--surface-hover);
+            background: var(--hover-background);
         }
 
         td {
             padding: .75rem 1rem;
-            border-bottom: 1px solid var(--surface-border);
+            border-bottom: 1px solid var(--border-color);
             white-space: pre-line;
             line-height: 1.5;
             scroll-margin-top: 6.5rem;
 
             &:first-child {
-                color: var(--primary-color-default);
+                color: var(--primary-text-color);
                 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, Liberation Mono, monospace;
                 font-weight: 600;
             }
 
             .doc-option-type {
                 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, Liberation Mono, monospace;
-                color: var(--primary-color-default);
+                color: var(--primary-text-color);
                 font-weight: 500;
 
                 .doc-option-type-options-container {
@@ -339,8 +341,8 @@
                 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, Liberation Mono, monospace;
                 position: relative;
                 scroll-margin-top: 6.5rem;
-                background-color: var(--p-dark-surface-800, var(--p-surface-200));
-                color: var(--p-dark-surface-300, var(--p-surface-700));
+                background-color: var(--mark-background);
+                color: var(--mark-text);
                 border-radius: 6px;
                 padding: 2px 6px;
                 font-weight: 600;
@@ -351,7 +353,7 @@
                     position: absolute;
                     top: 0;
                     right: -1.5rem;
-                    color: var(--primary-color-default);
+                    color: var(--primary-text-color);
                     opacity: 0.7;
                     display: none;
                     transition: opacity 0.3s, colors 0.3s;
@@ -381,8 +383,8 @@
                 border-radius: 6px;
                 padding: 2px 6px;
                 max-width: min-content;
-                border-color: var(--surface-border);
-                background-color: var(--surface-card);
+                border-color: var(--border-color);
+                background-color: var(--card-background);
                 color: var(--text-secondary-color);
             }
 
@@ -392,7 +394,7 @@
 
             .doc-option-parameter-type {
                 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, Liberation Mono, monospace;
-                color: var(--primary-color-default);
+                color: var(--primary-text-color);
             }
 
             .doc-option-params {
diff --git a/assets/styles/layout/_docsearch.scss b/assets/styles/layout/_docsearch.scss
index 5c54c3034..e21319543 100644
--- a/assets/styles/layout/_docsearch.scss
+++ b/assets/styles/layout/_docsearch.scss
@@ -1,19 +1,16 @@
 .DocSearch-Button {
-    border-radius: var(--p-border-radius);
-    border: 1px solid var(--surface-border);
+    border-radius: 6px;
+    border: 1px solid var(--border-color);
     height: 2rem;
-    background-color: var(--surface-card);
+    background-color: var(--card-background);
     margin: 0;
-    transition: all .3s;
+    transition: outline-color .2s, border-color .2s;
+    outline-color: transparent;
     padding: 0 .5rem;
     @include focus-visible();
 
     &:hover {
-        border-color: var(--p-primary-color);
-    }
-
-    &:hover {
-        border-color: var(--p-primary-color);
+        border-color: var(--primary-color);
         box-shadow: none;
     }
 
@@ -43,7 +40,7 @@
             border-radius: 0;
             height: auto;
             width: auto;
-            font-family: var(--p-font-family);
+            font-family: inherit;
 
             &:first-child {
                 font-size: 0.75rem;
@@ -79,25 +76,25 @@
 }
 
 .DocSearch-Modal {
-    border: 1px solid var(--surface-border);
+    border: 1px solid var(--border-color);
     box-shadow: none;
 }
 
 .DocSearch-Footer {
     box-shadow: none;
-    border-top: 1px solid var(--surface-border);
-    background-color: var(--surface-overlay);
+    border-top: 1px solid var(--border-color);
+    background-color: var(--overlay-background);
 }
 
 .DocSearch-Form {
-    background: var(--surface-card);
+    background: var(--card-background);
     box-shadow: none;
-    border: 1px solid var(--surface-border);
-    border-radius: var(--p-border-radius);
+    border: 1px solid var(--border-color);
+    border-radius: 6px;
     transition: border-color .3s;
 
     &:hover {
-        border-color: var(--p-primary-color);
+        border-color: var(--primary-color);
     }
 
     .DocSearch-MagnifierLabel, .DocSearch-Reset {
@@ -106,21 +103,21 @@
 }
 
 .DocSearch-Hit {
-    border-bottom: 1px solid var(--surface-border);
+    border-bottom: 1px solid var(--border-color);
     padding-bottom: 0;
     margin-bottom: .25rem;
 }
 
 .DocSearch-Hit-source {
-    color: var(--p-primary-color);
+    color: var(--primary-text-color);
 }
 
 .DocSearch-Logo .cls-1, .DocSearch-Logo .cls-2 {
-    fill: var(--p-primary-color);
+    fill: var(--primary-text-color);
 }
 
 .DocSearch-Prefill {
-    color: var(--p-primary-color);
+    color: var(--primary-text-color);
 }
 
 .DocSearch-Button-Placeholder {
@@ -130,20 +127,21 @@
 }
 
 :root {
-    --docsearch-searchbox-focus-background: var(--surface-card);
+    --docsearch-searchbox-focus-background: var(--card-background);
     --docsearch-text-color: var(--text-color);
     --docsearch-muted-color: var(--text-color);
-    --docsearch-searchbox-background: var(--surface-card);
+    --docsearch-searchbox-background: var(--card-background);
     --docsearch-text-color: var(--text-color);
-    --docsearch-modal-background: var(--surface-overlay);
-    --docsearch-key-gradient: var(--surface-ground);
+    --docsearch-modal-background: var(--overlay-background);
+    --docsearch-key-gradient: var(--ground-background);
     --docsearch-key-shadow: none;
-    --docsearch-container-background: var(--p-mask-bg);
-    --docsearch-hit-background: var(--surface-overlay);
+    --docsearch-container-background: var(--docsearch-mask-background);
+    --docsearch-hit-background: var(--overlay-background);
     --docsearch-hit-shadow: none;
     --docsearch-spacing: 1rem;
     --docsearch-hit-color: var(--text-color);
-    --docsearch-highlight-color: var(--p-primary-color);
-    --docsearch-hit-active-color: var(--p-primary-color-inverse);
+    --docsearch-highlight-color: var(--primary-color);
+    --docsearch-hit-active-color: var(--primary-inverse-color);
+    --docsearch-searchbox-shadow: none;
 }
 
diff --git a/assets/styles/layout/_footer.scss b/assets/styles/layout/_footer.scss
index dffbdec01..9c824ac40 100644
--- a/assets/styles/layout/_footer.scss
+++ b/assets/styles/layout/_footer.scss
@@ -6,14 +6,15 @@
     justify-content: space-between;
     flex-wrap: wrap;
     font-weight: 500;
-    color: var(--text-800);
-    border-top: 1px solid var(--surface-border);
+    color: var(--text-color);
+    border-top: 1px solid var(--border-color);
 
     a {
-        color: var(--primary-color-default);
+        color: var(--primary-text-color);
         font-weight: 700;
-        transition: all .3s;
-        border-radius: var(--p-border-radius);
+        transition: outline-color .2s, border-color .2s;
+        outline-color: transparent;
+        border-radius: 6px;
 
         @include focus-visible();
 
diff --git a/assets/styles/layout/_mixins.scss b/assets/styles/layout/_mixins.scss
index f0859ec92..ed8c79678 100644
--- a/assets/styles/layout/_mixins.scss
+++ b/assets/styles/layout/_mixins.scss
@@ -1,16 +1,16 @@
-@mixin focus-visible($type:null) {
+@mixin focus-visible() {
     &:focus-visible {
-        outline: 0 none;
-        outline-offset: 0;
-        box-shadow: $type var(--focus-ring);
+        outline: 1px solid var(--primary-color);
+        outline-offset: var(--focus-ring-offset, 2px);
     }
 }
 
 @mixin doc-link() {
-    color: var(--primary-color-default);
+    color: var(--primary-text-color);
     font-weight: 500;
-    transition: all .2s;
-    border-radius: var(--p-border-radius);
+    transition: outline-color .2s, border-color .2s;
+    outline-color: transparent;
+    border-radius: 6px;
     @include focus-visible();
 
     &:hover {
diff --git a/assets/styles/layout/_news.scss b/assets/styles/layout/_news.scss
index d447f5e87..d4507bffd 100644
--- a/assets/styles/layout/_news.scss
+++ b/assets/styles/layout/_news.scss
@@ -41,7 +41,7 @@
     .layout-news-link,
     .layout-news-link:visited,
     .layout-news-link:active {
-        color:var(--p-primary-color-inverse);
+        color:var(--primary-color-inverse);
         font-weight:700;
     }
     .layout-news-link:hover {
diff --git a/assets/styles/layout/_responsive.scss b/assets/styles/layout/_responsive.scss
index 27719501d..6bcc2ac2a 100644
--- a/assets/styles/layout/_responsive.scss
+++ b/assets/styles/layout/_responsive.scss
@@ -53,7 +53,7 @@
         z-index: 1102;
         height: 100%;
         transform: translateX(-100%);
-        background-color: var(--mobile-menu-bg);
+        background-color: var(--mobile-menu-background);
         backdrop-filter: blur(20px);
         width: 300px;
         opacity: 0;
diff --git a/assets/styles/layout/_sidebar.scss b/assets/styles/layout/_sidebar.scss
index 2f1941d7d..7077ea7a9 100644
--- a/assets/styles/layout/_sidebar.scss
+++ b/assets/styles/layout/_sidebar.scss
@@ -36,19 +36,19 @@
                 display: flex;
                 width: 100%;
                 align-items: center;
-                padding: .5rem 0;
+                padding: .5rem 1px;
                 color: var(--text-color);
                 font-weight: 600;
-                transition: all .2s;
+                transition: outline-color 0.2s;
+                outline-color: transparent;
                 position: relative;
-                border-radius: var(--p-border-radius);
 
                 .menu-icon {
                     width: 2rem;
                     height: 2rem;
-                    border-radius: var(--p-border-radius);
+                    border-radius: 6px;
                     margin-right: .5rem;
-                    border: 1px solid var(--surface-border);
+                    border: 1px solid var(--border-color);
                     display: inline-flex;
                     align-items: center;
                     justify-content: center;
@@ -69,29 +69,30 @@
 
                 &:hover {
                     .menu-icon {
-                        background-color: var(--surface-card);
+                        background-color: var(--card-background);
 
                         i {
-                            color: var(--primary-color-default);
+                            color: var(--primary-text-color);
                         }
                     }
 
                     .menu-toggle-icon {
-                        color: var(--surface-900);
+                        color: var(--text-color);
                     }
                 }
 
                 &.router-link-active {
-                    color: var(--primary-color-default);
+                    color: var(--primary-text-color);
         
                     > .menu-icon {
                         i {
-                            color: var(--primary-color-default);
+                            color: var(--primary-text-color);
                         }
                     }
                 }
 
-                @include focus-visible(inset);
+                @include focus-visible();
+                --focus-ring-offset: -1px;
             }
             
             > div {
@@ -102,28 +103,27 @@
 
                     li {
                         a {
-                            border-left: 1px solid var(--surface-border);
+                            border-left: 1px solid var(--border-color);
                             transition: all .2s;
                             font-weight: 450;
                             display: flex;
                             align-items: center;
                             padding: .5rem .5rem .5rem 1rem;
                             color: var(--text-color);
-                            transition: border-color .2s;
+                            transition: outline-color 0.2s, border-color .2s;
+                            outline-color: transparent;
                             position: relative;
 
-                            &:focus-visible {
-                                outline: 0 none;
-                                box-shadow: inset var(--focus-ring);
-                            }
+                            @include focus-visible();
+                            --focus-ring-offset: -1px;
             
                             &:hover {
-                                border-left-color: var(--p-dark-surface-600, var(--p-surface-400));
+                                border-left-color: var(--hover-border-color);
                             }
 
                             &.router-link-active {
-                                color: var(--primary-color-default);
-                                border-left-color: var(--primary-color-default);
+                                color: var(--primary-text-color);
+                                border-left-color: var(--primary-text-color);
                             }
                         }
 
diff --git a/assets/styles/layout/_topbar.scss b/assets/styles/layout/_topbar.scss
index c99f27b3f..720e18c62 100644
--- a/assets/styles/layout/_topbar.scss
+++ b/assets/styles/layout/_topbar.scss
@@ -8,8 +8,8 @@
     border-bottom: 1px solid transparent;
 
     &.layout-topbar-sticky {
-        border-bottom: 1px solid var(--surface-border);
-        background-color: var(--topbar-sticky-bg);
+        border-bottom: 1px solid var(--border-color);
+        background-color: var(--topbar-sticky-background);
         backdrop-filter: blur(8px);
     }
 }
@@ -28,7 +28,8 @@
 
     .layout-topbar-logo,
     .layout-topbar-icon {
-        border-radius: 6px;
+        transition: outline-color .2s;
+        outline-color: transparent;
         @include focus-visible();
 
         svg {
@@ -73,20 +74,21 @@
             align-items: center;
             justify-content: center;
             flex-shrink: 0;
-            border: 1px solid var(--surface-border);
+            border: 1px solid var(--border-color);
             width: 2rem;
             height: 2rem;
-            transition: all .2s;
+            transition: outline-color .2s, border-color .2s;
             border-radius: 6px;
             margin: 0;
             padding: 0;
-            background-color: var(--surface-card);
+            outline-color: transparent;
+            background-color: var(--card-background);
             cursor: pointer;
     
             @include focus-visible();
     
             &:hover {
-                border-color: var(--primary-color-default);
+                border-color: var(--p-primary-color);
             }
     
             i, span {
@@ -98,7 +100,7 @@
             background-color: var(--p-primary-color);
             
             i {
-                color: var(--p-primary-color-inverse);
+                color: var(--p-primary-inverse-color);
             }
         }
 
@@ -108,9 +110,9 @@
             right: 0;
             width: 14rem;
             padding: .75rem;
-            background-color: var(--surface-overlay);
-            border-radius: var(--p-border-radius);
-            border: 1px solid var(--surface-border);
+            background-color: var(--overlay-background);
+            border-radius: 6px;
+            border: 1px solid var(--border-color);
             transform-origin: top;
             box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
             
@@ -146,7 +148,7 @@
                         outline-offset: 1px;
     
                         &.active-color {
-                            outline-color: var(--primary-color-default);
+                            outline-color: var(--p-primary-color);
                         }
                     }
                 }
@@ -179,12 +181,12 @@
 
         .versions-panel {
             padding: .25rem;
-            background-color: var(--surface-overlay);
+            background-color: var(--overlay-background);
             position: absolute;
             right: 0;
             top: calc(100% + 2px);
-            border-radius: var(--p-border-radius);
-            border: 1px solid var(--surface-border);
+            border-radius: 6px;
+            border: 1px solid var(--border-color);
             box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
             transform-origin: top;
             width: 8rem;
@@ -205,17 +207,17 @@
                 a {
                     display: inline-flex;
                     padding: 0.5rem .75rem;
-                    border-radius: var(--p-border-radius);
+                    border-radius: 6px;
                     width: 100%;
                     overflow: hidden;
 
                     &:hover {
-                        background-color: var(--surface-hover);
+                        background-color: var(--hover-background);
                     }
 
                     span:first-child {
                         font-weight: bold;
-                        color: var(--p-dark-surface-0, var(--p-surface-900));
+                        color: var(--high-contrast-text-color);
                     }
 
                     span:last-child {
diff --git a/assets/styles/layout/variables/main/_dark.scss b/assets/styles/layout/variables/main/_dark.scss
index f9a290696..cdd2fc13e 100644
--- a/assets/styles/layout/variables/main/_dark.scss
+++ b/assets/styles/layout/variables/main/_dark.scss
@@ -1,16 +1,26 @@
 :root[class="p-dark"] {
-    --primary-color-default:var(--p-dark-primary-400);
-    --primary-color-inverse-default:var(--p-dark-zinc-900);
-    --text-color: var(--p-dark-surface-0);
-    --text-secondary-color: var(--p-dark-surface-400);
-    --card-border: 1px solid transparent;
+    --primary-text-color:var(--p-primary-400);
+    --primary-color: var(--p-primary-color);
+    --primary-inverse-color:var(--p-primary-inverse-color);
+    --text-color: var(--p-text-color);
+    --text-secondary-color: var(--p-text-secondar-color);
     --glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png), radial-gradient(50% 50% at center -25px, var(--p-primary-color) 0%, #000000 100%);
     --glow-blend: hard-light, color-dodge;
-    --topbar-sticky-bg:rgba(0,0,0,.3);
-    --mobile-menu-bg: rgba(0,0,0,.3);
-    --surface-card: var(--p-dark-surface-900);
-    --surface-border: var(--p-dark-surface-800);
-    --surface-ground: var(--p-dark-surface-950);
-    --surface-overlay: var(--p-dark-surface-900);
-    --surface-hover: var(--p-dark-surface-800);
+    --topbar-sticky-background:rgba(0,0,0,.3);
+    --mobile-menu-background: rgba(0,0,0,.3);
+    --card-border: 1px solid transparent;
+    --card-background: var(--p-surface-900);
+    --border-color: var(--p-surface-800);
+    --ground-background: var(--p-surface-950);
+    --overlay-background: var(--p-surface-900);
+    --hover-background: var(--p-surface-800);
+    --code-background: var(--p-surface-900);
+    --high-contrast-text-color: var(--p-surface-0);
+    --hover-border-color: var(--p-surface-600);
+    --mark-background: var(--p-surface-800);
+    --mark-text-color: var(--p-surface-300);
+    --selection-background: color-mix(in srgb, var(--primary-color-default), transparent 84%);
+    --selection-text-color: rgba(255,255,255,.87);
+    --code-button-text-color: var(--p-surface-300);
+    --docsearch-mask-background: var(-p-mask-bg);
 }
\ No newline at end of file
diff --git a/assets/styles/layout/variables/main/_light.scss b/assets/styles/layout/variables/main/_light.scss
index 0001336f2..47644726c 100644
--- a/assets/styles/layout/variables/main/_light.scss
+++ b/assets/styles/layout/variables/main/_light.scss
@@ -1,16 +1,26 @@
 :root {
-    --primary-color-default:var(--p-primary-600);
-    --primary-color-inverse-default:var(--p-surface-0);
-    --text-color: var(--p-surface-700);
-    --text-secondary-color: var(--p-surface-500);
-    --card-border: 1px solid var(--p-surface-200);
+    --primary-text-color:var(--p-primary-600);
+    --primary-color: var(--p-primary-color);
+    --primary-inverse-color:var(--p-primary-inverse-color);
+    --text-color: var(--p-text-color);
+    --text-secondary-color: var(--p-text-secondar-color);
     --glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png);
     --glow-blend: hard-light, multiply;
-    --topbar-sticky-bg:rgba(255,255,255,.7);
-    --mobile-menu-bg: var(--p-surface-0);
-    --surface-card: var(--p-surface-0);
-    --surface-border: var(--p-surface-200);
-    --surface-ground: var(--p-surface-50);
-    --surface-overlay: var(--p-surface-0);
-    --surface-hover: var(--p-surface-100);
+    --topbar-sticky-background:rgba(255,255,255,.7);
+    --mobile-menu-background: #ffffff;
+    --card-border: 1px solid var(--p-surface-200);
+    --card-background: #ffffff;
+    --border-color: var(--p-surface-200);
+    --ground-background: var(--p-surface-50);
+    --overlay-background: #ffffff;
+    --hover-background: var(--p-surface-100);
+    --code-background: var(--p-surface-800);
+    --high-contrast-text-color: var(--p-surface-900);
+    --hover-border-color: var(--p-surface-400);
+    --mark-background: var(--p-surface-200);
+    --mark-text-color: var(--p-surface-700);
+    --selection-background: var(--p-primary-50);
+    --selection-text-color: var(--p-primary-700);
+    --code-button-text-color: var(--p-surface-300);
+    --docsearch-mask-background: var(-p-mask-bg);
 }
\ No newline at end of file
diff --git a/components/lib/theme/aura/index.js b/components/lib/theme/aura/index.js
index 7cd1d8c16..51631db2f 100644
--- a/components/lib/theme/aura/index.js
+++ b/components/lib/theme/aura/index.js
@@ -85,10 +85,14 @@ export default {
                 },
                 primary: {
                     color: '{primary.500}',
-                    colorInverse: '{primary.0}'
+                    inverseColor: '#ffffff'
+                },
+                text: {
+                    color: '{surface.700}',
+                    secondaryColor: '{surface.500}'
                 },
                 highlight: {
-                    bg: '{primary.50}',
+                    background: '{primary.50}',
                     textColor: '{primary.700}'
                 }
             },
@@ -109,10 +113,14 @@ export default {
                 },
                 primary: {
                     color: '{primary.400}',
-                    colorInverse: '{surface.900}'
+                    inverseColor: '{surface.900}'
+                },
+                text: {
+                    color: '{surface.700}',
+                    secondaryColor: '{surface.500}'
                 },
                 highlight: {
-                    bg: 'color-mix(in srgb, {primary.400}, transparent 84%)',
+                    background: 'color-mix(in srgb, {primary.400}, transparent 84%)',
                     textColor: 'rgba(255,255,255,.87)'
                 }
             }
diff --git a/components/lib/theme/index.d.ts b/components/lib/theme/index.d.ts
index 09f168549..e69de29bb 100644
--- a/components/lib/theme/index.d.ts
+++ b/components/lib/theme/index.d.ts
@@ -1,13 +0,0 @@
-export interface Surface {
-    surface0?: string | undefined;
-    surface50?: string | undefined;
-    surface100?: string | undefined;
-    surface200?: string | undefined;
-    surface300?: string | undefined;
-    surface400?: string | undefined;
-    surface500?: string | undefined;
-    surface600?: string | undefined;
-    surface700?: string | undefined;
-    surface800?: string | undefined;
-    surface900?: string | undefined;
-}
diff --git a/components/lib/theme/lara/accordion/index.d.ts b/components/lib/theme/lara/accordion/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/accordion/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/accordion/index.js b/components/lib/theme/lara/accordion/index.js
deleted file mode 100644
index afd1ece8c..000000000
--- a/components/lib/theme/lara/accordion/index.js
+++ /dev/null
@@ -1,142 +0,0 @@
-export default {
-    variables: {
-        common: {
-            header: {
-                paddingX: '{p.5}',
-                paddingY: '{p.5}',
-                borderWidth: '1px',
-                borderStyle: 'solid',
-                fontWeight: 700
-            },
-            content: {
-                paddingX: '{p.5}',
-                paddingY: '{p.5}',
-                borderWidth: '1px',
-                borderStyle: 'solid'
-            },
-            tab: {
-                gap: '4px'
-            }
-        },
-        light: {
-            header: {
-                borderColor: '{shade.300}',
-                color: '{shade.600}',
-                background: '{shade.100}',
-                states: {
-                    hover: {
-                        background: '{shade.200}',
-                        borderColor: '{shade.300}',
-                        color: '{shade.800}'
-                    },
-                    active: {
-                        background: '{shade.100}',
-                        borderColor: '{shade.300}',
-                        color: '{shade.800}',
-                        states: {
-                            hover: {
-                                borderColor: '{shade.300}',
-                                background: '{shade.200}',
-                                color: '{shade.800}'
-                            }
-                        }
-                    }
-                }
-            },
-            content: {
-                borderColor: '{shade.300}',
-                background: '{shade.0}',
-                color: '{shade.700}'
-            }
-        },
-        dark: {
-            header: {
-                borderColor: '{shade.300}',
-                color: '{shade.600}',
-                background: '{shade.100}',
-                states: {
-                    hover: {
-                        background: '{shade.200}',
-                        borderColor: '{shade.300}',
-                        color: '{shade.800}'
-                    },
-                    active: {
-                        background: '{shade.100}',
-                        borderColor: '{shade.300}',
-                        color: '{shade.800}'
-                    },
-                    activeHover: {
-                        borderColor: '{shade.300}',
-                        background: '{shade.200}',
-                        color: '{shade.800}'
-                    }
-                }
-            },
-            content: {
-                borderColor: '{shade.300}',
-                background: '{shade.0}',
-                color: '{shade.700}'
-            }
-        }
-    },
-    css: `
-.p-accordion-header-action {
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    user-select: none;
-    position: relative;
-    text-decoration: none;
-    padding: var(--p-accordion-header-padding-y) var(--p-accordion-header-padding-x);
-    border: var(--p-accordion-header-border-width) var(--p-accordion-header-border-style) var(--p-accordion-header-border-color);
-    color: var(--p-accordion-header-color);
-    background: var(--p-accordion-header-background);
-    font-weight: var(--p-accordion-header-font-weight);
-    border-radius: var(--p-border-radius);
-    transition: var(--p-transition);
-    outline-color: transparent;
-}
-.p-accordion-header-text {
-    line-height: 1;
-}
-.p-accordion-toggle-icon {
-    margin-right: var(--p-inline-gap);
-}
-.p-accordion-header:not(.p-disabled) .p-accordion-header-action:focus-visible {
-    outline: var(--p-focus-ring-width) var(--p-focus-ring-style) var(--p-focus-ring-color);
-    outline-offset: var(--p-focus-ring-offset);
-    z-index: 1;
-}
-.p-accordion-header:not(.p-highlight):not(.p-disabled):hover .p-accordion-header-action {
-    background: var(--p-accordion-header-hover-background);
-    border-color: var(--p-accordion-header-hover-border-color);
-    color: var(--p-accordion-header-hover-color);
-}
-.p-accordion-header:not(.p-disabled).p-highlight .p-accordion-header-action {
-    background: var(--p-accordion-header-active-background);
-    border-color: var(--p-accordion-header-active-border-color);
-    color: var(--p-accordion-header-active-color);
-    border-bottom-right-radius: 0;
-    border-bottom-left-radius: 0;
-}
-.p-accordion-header:not(.p-disabled).p-highlight:hover .p-accordion-header-action {
-    border-color: var(--p-accordion-header-active-hover-border-color);
-    background: var(--p-accordion-header-active-hover-background);
-    color: var(--p-accordion-header-active-hover-color);
-}
-.p-accordion-content {
-    padding: var(--p-accordion-content-padding-y) var(--p-accordion-content-padding-x);
-    border: var(--p-accordion-content-border-width) var(--p-accordion-content-border-style) var(--p-accordion-content-border-color);
-    background: var(--p-accordion-content-background);
-    color: var(--p-accordion-content-color);
-    border-top: 0;
-    border-top-right-radius: 0;
-    border-top-left-radius: 0;
-    border-bottom-right-radius: var(--p-border-radius);
-    border-bottom-left-radius: var(--p-border-radius);
-}
-.p-accordion-tab {
-    margin-bottom: var(--p-accordion-tab-gap);
-}
-    `
-};
diff --git a/components/lib/theme/lara/accordion/package.json b/components/lib/theme/lara/accordion/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/accordion/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/card/index.d.ts b/components/lib/theme/lara/card/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/card/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/card/index.js b/components/lib/theme/lara/card/index.js
deleted file mode 100644
index d5e6d9731..000000000
--- a/components/lib/theme/lara/card/index.js
+++ /dev/null
@@ -1,68 +0,0 @@
-export default {
-    variables: {
-        common: {
-            body: {
-                paddingX: '{p.5}',
-                paddingY: '{p.5}',
-                gap: '{gap.5}'
-            },
-            caption: {
-                gap: '{gap.2}'
-            },
-            title: {
-                fontSize: '{text.2xl}',
-                fontWeight: 700
-            },
-            subtitle: {
-                fontWeight: 400
-            }
-        },
-        light: {
-            root: {
-                background: '{shade.0}',
-                color: '{shade.700}',
-                boxShadow: '0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12)'
-            },
-            subtitle: {
-                color: '{shade.600}'
-            }
-        },
-        dark: {
-            root: {
-                background: '{shade.0}',
-                color: '{shade.700}',
-                boxShadow: '0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12)'
-            },
-            subtitle: {
-                color: '{shade.600}'
-            }
-        }
-    },
-    css: `
-.p-card {
-    background: var(--p-card-background);
-    color: var(--p-card-color);
-    box-shadow: var(--p-card-box-shadow);
-    border-radius: var(--p-border-radius);
-}
-.p-card-body {
-    display: flex;
-    flex-direction: column;
-    gap: var(--p-card-body-gap);
-    padding: var(--p-card-body-padding-y) var(--p-card-body-padding-x);
-}
-.p-card-caption {
-    display: flex;
-    flex-direction: column;
-    gap: var(--p-card-caption-gap);
-}
-.p-card-title {
-    font-size: var(--p-card-title-font-size);
-    font-weight: var(--p-card-title-font-weight);
-}
-.p-card-subtitle {
-    font-weight: var(--p-card-subtitle-font-weight);
-    color: var(--p-card-subtitle-color);
-}
-    `
-};
diff --git a/components/lib/theme/lara/card/package.json b/components/lib/theme/lara/card/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/card/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/divider/index.d.ts b/components/lib/theme/lara/divider/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/divider/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/divider/index.js b/components/lib/theme/lara/divider/index.js
deleted file mode 100644
index b3b555843..000000000
--- a/components/lib/theme/lara/divider/index.js
+++ /dev/null
@@ -1,71 +0,0 @@
-export default {
-    variables: {
-        common: {},
-        light: {},
-        dark: {}
-    },
-    css: `
-.p-divider-horizontal {
-    display: flex;
-    width: 100%;
-    position: relative;
-    align-items: center;
-    margin: var(--p-divider-horizontal-margin);
-    padding: var(--p-divider-horizontal-padding);
-}
-.p-divider-horizontal:before {
-    position: absolute;
-    display: block;
-    top: 50%;
-    left: 0;
-    width: 100%;
-    content: "";
-    border-top: var(--p-divider-size) var(--p-divider-color);
-}
-.p-divider-content {
-    z-index: 1;
-    background-color: var(--p-panel-content-bg);
-}
-.p-divider-vertical {
-    min-height: 100%;
-    margin: var(--p-divider-vertical-margin);
-    display: flex;
-    position: relative;
-    justify-content: center;
-    padding: var(--p-divider-vertical-padding);
-}
-.p-divider-vertical:before {
-    position: absolute;
-    display: block;
-    top: 0;
-    left: 50%;
-    height: 100%;
-    content: "";
-    border-left: var(--p-divider-size) var(--p-divider-color);
-}
-.p-divider-solid.p-divider-horizontal:before {
-    border-top-style: solid;
-}
-.p-divider-solid.p-divider-vertical:before {
-    border-left-style: solid;
-}
-.p-divider-dashed.p-divider-horizontal:before {
-    border-top-style: dashed;
-}
-.p-divider-dashed.p-divider-vertical:before {
-    border-left-style: dashed;
-}
-.p-divider-dotted.p-divider-horizontal:before {
-    border-top-style: dotted;
-}
-.p-divider-dotted.p-divider-vertical:before {
-    border-left-style: dotted;
-}
-.p-divider-horizontal .p-divider-content {
-    padding: 0 var(--p-inline-spacing);
-}
-.p-divider-vertical .p-divider-content {
-    padding: var(--p-inline-spacing) 0;
-}
-    `
-};
diff --git a/components/lib/theme/lara/divider/package.json b/components/lib/theme/lara/divider/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/divider/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/fieldset/index.d.ts b/components/lib/theme/lara/fieldset/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/fieldset/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/fieldset/index.js b/components/lib/theme/lara/fieldset/index.js
deleted file mode 100644
index 78f48e133..000000000
--- a/components/lib/theme/lara/fieldset/index.js
+++ /dev/null
@@ -1,66 +0,0 @@
-export default {
-    variables: {
-        common: {},
-        light: {},
-        dark: {}
-    },
-    css: `
-.p-fieldset-legend > a,
-.p-fieldset-legend > span {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-.p-fieldset-toggleable .p-fieldset-legend a {
-    cursor: pointer;
-    user-select: none;
-    overflow: hidden;
-    position: relative;
-    text-decoration: none;
-    padding: var(--p-panel-header-padding);
-    color: var(--p-panel-header-text-color);
-    border-radius: var(--p-border-radius);
-    transition: var(--p-list-item-transition);
-}
-.p-fieldset-legend-text {
-    line-height: 1;
-}
-.p-fieldset {
-    border: var(--p-panel-content-border);
-    background: var(--p-panel-content-bg);
-    color: var(--p-panel-content-text-color);
-    border-radius: var(--p-border-radius);
-}
-.p-fieldset-legend {
-    padding: var(--p-panel-header-padding);
-    border: var(--p-panel-header-border);
-    color: var(--p-panel-header-text-color);
-    background: var(--p-panel-header-bg);
-    font-weight: var(--p-panel-header-font-weight);
-    border-radius: var(--p-border-radius);
-}
-.p-fieldset-content {
-    padding: var(--p-panel-content-padding);
-}
-.p-fieldset-toggleable .p-fieldset-legend {
-    padding: 0;
-    transition: var(--p-action-icon-transition);
-}
-.p-fieldset-toggleable .p-fieldset-legend a .p-fieldset-toggler {
-    margin-right: var(--p-inline-spacing);
-}
-.p-fieldset-toggleable .p-fieldset-legend a:focus-visible {
-    outline: var(--p-focus-outline);
-    outline-offset: var(--p-focus-outline-offset);
-    box-shadow: var(--p-focus-shadow);
-}
-.p-fieldset-toggleable .p-fieldset-legend a:hover {
-    color: var(--p-panel-header-text-hover-color);
-}
-.p-fieldset-toggleable .p-fieldset-legend:hover {
-    background: var(--p-panel-header-hover-bg);
-    border-color: var(--p-panel-header-hover-border-color);
-    color: var(--p-panel-header-text-hover-color);
-}
-    `
-};
diff --git a/components/lib/theme/lara/fieldset/package.json b/components/lib/theme/lara/fieldset/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/fieldset/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/global.js b/components/lib/theme/lara/global.js
deleted file mode 100644
index 267c539cc..000000000
--- a/components/lib/theme/lara/global.js
+++ /dev/null
@@ -1,95 +0,0 @@
-export default {
-    css: `
-@font-face {
-    font-family: "Inter var";
-    font-weight: 100 900;
-    font-display: swap;
-    font-style: normal;
-    font-named-instance: "Regular";
-    src: url("./fonts/Inter-roman.var.woff2?v=3.19") format("woff2");
-}
-@font-face {
-    font-family: "Inter var";
-    font-weight: 100 900;
-    font-display: swap;
-    font-style: italic;
-    font-named-instance: "Italic";
-    src: url("./fonts/Inter-italic.var.woff2?v=3.19") format("woff2");
-}
-
-* {
-    box-sizing: border-box;
-}
-
-.p-component {
-    font-family: var(--p-font-family);
-    font-feature-settings: var(--p-font-feature-settings, normal);
-    font-size: var(--p-font-size);
-    font-weight: var(--p-font-weight);
-}
-
-.p-component-overlay {
-    background-color: var(--p-mask-bg);
-    transition-duration: var(--p-transition-duration);
-}
-
-.p-disabled,
-.p-component:disabled {
-    opacity: var(--p-disabled-opacity);
-}
-
-.p-error {
-    color: var(--p-error-color);
-}
-
-.p-text-secondary {
-    color: var(--p-text-secondary-color);
-}
-
-.pi {
-    font-size: var(--p-prime-icon-font-size);
-}
-
-.p-icon {
-    width: var(--p-prime-icon-font-size);
-    height: var(--p-prime-icon-font-size);
-}
-
-.p-link {
-    font-family: var(--p-font-family);
-    font-feature-settings: var(--p-font-feature-settings, normal);
-    font-size: var(--p-font-size);
-    border-radius: var(--p-border-radius);
-}
-.p-link:focus-visible {
-    outline: var(--p-focus-outline);
-    outline-offset: var(--p-focus-outline-offset);
-    box-shadow: var(--p-focus-shadow);
-}
-
-.p-component-overlay-enter {
-    animation: p-component-overlay-enter-animation 150ms forwards;
-}
-
-.p-component-overlay-leave {
-    animation: p-component-overlay-leave-animation 150ms forwards;
-}
-
-@keyframes p-component-overlay-enter-animation {
-    from {
-        background-color: transparent;
-    }
-    to {
-        background-color: var(--maskbg);
-    }
-}
-@keyframes p-component-overlay-leave-animation {
-    from {
-        background-color: var(--maskbg);
-    }
-    to {
-        background-color: transparent;
-    }
-}
-`
-};
diff --git a/components/lib/theme/lara/index.d.ts b/components/lib/theme/lara/index.d.ts
deleted file mode 100644
index e69de29bb..000000000
diff --git a/components/lib/theme/lara/index.js b/components/lib/theme/lara/index.js
deleted file mode 100644
index 71ecf38a5..000000000
--- a/components/lib/theme/lara/index.js
+++ /dev/null
@@ -1,172 +0,0 @@
-import accordion from 'primevue/theme/lara/accordion';
-import card from 'primevue/theme/lara/card';
-import global from 'primevue/theme/lara/global';
-import panel from 'primevue/theme/lara/panel';
-
-export default {
-    primitive: {
-        /*** @todo Remove ***/
-        shade: {
-            0: '#ffffff',
-            100: '#f9fafb',
-            200: '#f3f4f6',
-            300: '#e5e7eb',
-            400: '#d1d5db',
-            500: '#9ca3af',
-            600: '#6b7280',
-            700: '#4b5563',
-            800: '#374151',
-            900: '#1f2937'
-        },
-        /********************/
-        emerald: {
-            50: '#ecfdf5',
-            100: '#d1fae5',
-            200: '#a7f3d0',
-            300: '#6ee7b7',
-            400: '#34d399',
-            500: '#10b981',
-            600: '#059669',
-            700: '#047857',
-            800: '#065f46',
-            900: '#064e3b',
-            950: '#022c22'
-        },
-        slate: {
-            50: '#f8fafc',
-            100: '#f1f5f9',
-            200: '#e2e8f0',
-            300: '#cbd5e1',
-            400: '#94a3b8',
-            500: '#64748b',
-            600: '#475569',
-            700: '#334155',
-            800: '#1e293b',
-            900: '#0f172a',
-            950: '#020617'
-        },
-        gap: {
-            1: '0.25rem',
-            2: '0.5rem',
-            3: '0.75rem',
-            4: '1rem',
-            5: '1.25rem',
-            6: '1.5rem'
-        },
-        p: {
-            1: '0.25rem',
-            2: '0.5rem',
-            3: '0.75rem',
-            4: '1rem',
-            5: '1.25rem',
-            6: '1.5rem',
-            7: '1.75rem',
-            8: '2rem'
-        },
-        m: {
-            1: '0.25rem',
-            2: '0.5rem',
-            3: '0.75rem',
-            4: '1rem',
-            5: '1.25rem',
-            6: '1.5rem',
-            7: '1.75rem',
-            8: '2rem'
-        },
-        text: {
-            xs: '0.75rem',
-            sm: '0.875rem',
-            base: '1rem',
-            lg: '1.125rem',
-            xl: '1.25rem',
-            '2xl': '1.5rem'
-        }
-    },
-    semantic: {
-        colorScheme: {
-            light: {
-                primary: {
-                    50: '{emerald.50}',
-                    100: '{emerald.100}',
-                    200: '{emerald.200}',
-                    300: '{emerald.300}',
-                    400: '{emerald.400}',
-                    500: '{emerald.500}',
-                    600: '{emerald.600}',
-                    700: '{emerald.700}',
-                    800: '{emerald.800}',
-                    900: '{emerald.900}',
-                    950: '{emerald.950}'
-                },
-                surface: {
-                    0: '#ffffff',
-                    50: '{slate.50}',
-                    100: '{slate.100}',
-                    200: '{slate.200}',
-                    300: '{slate.300}',
-                    400: '{slate.400}',
-                    500: '{slate.500}',
-                    600: '{slate.600}',
-                    700: '{slate.700}',
-                    800: '{slate.800}',
-                    900: '{slate.900}',
-                    950: '{slate.950}'
-                },
-                textColor: '{surface.700}',
-                textSecondaryColor: '{surface.500}',
-                borderColor: '{surface.300}'
-            },
-            dark: {
-                primary: {
-                    50: '{emerald.50}',
-                    100: '{emerald.100}',
-                    200: '{emerald.200}',
-                    300: '{emerald.300}',
-                    400: '{emerald.400}',
-                    500: '{emerald.500}',
-                    600: '{emerald.600}',
-                    700: '{emerald.700}',
-                    800: '{emerald.800}',
-                    900: '{emerald.900}',
-                    950: '{emerald.950}'
-                },
-                surface: {
-                    0: '#ffffff',
-                    50: '{zinc.50}',
-                    100: '{zinc.100}',
-                    200: '{zinc.200}',
-                    300: '{zinc.300}',
-                    400: '{zinc.400}',
-                    500: '{zinc.500}',
-                    600: '{zinc.600}',
-                    700: '{zinc.700}',
-                    800: '{zinc.800}',
-                    900: '{zinc.900}',
-                    950: '{zinc.950}'
-                },
-                textColor: '{dark.surface.0}',
-                textSecondaryColor: '{dark.surface.500}',
-                borderColor: '{dark.surface.700}'
-            }
-        },
-        common: {
-            fontFamily: '"Inter var", sans-serif',
-            borderRadius: '6px',
-            inlineGap: '{gap.2}', // inline-spacing
-            transitionDuration: '.2s',
-            transition: 'background-color {transitionDuration}, color {transitionDuration}, box-shadow {transitionDuration}, border-color {transitionDuration}, outline-color {transitionDuration}',
-            focusRing: {
-                width: '2px',
-                style: 'solid',
-                color: '{primary.500}',
-                offset: '2px'
-            }
-        }
-    },
-    components: {
-        global,
-        accordion,
-        card,
-        panel
-    }
-};
diff --git a/components/lib/theme/lara/package.json b/components/lib/theme/lara/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/panel/index.d.ts b/components/lib/theme/lara/panel/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/panel/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/panel/index.js b/components/lib/theme/lara/panel/index.js
deleted file mode 100644
index d72f50dc2..000000000
--- a/components/lib/theme/lara/panel/index.js
+++ /dev/null
@@ -1,68 +0,0 @@
-export default {
-    css: `
-.p-panel-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    border: var(--p-panel-header-border-width) var(--p-panel-header-border-style) var(--p-panel-header-border-color);
-    padding: var(--p-panel-header-padding-y) var(--p-panel-header-padding-x);
-    background: var(--p-dark-surface-900, var(--p-surface-100));
-    color: var(--p-panel-header-color);
-    border-top-right-radius: var(--p-border-radius);
-    border-top-left-radius: var(--p-border-radius);
-}
-.p-panel-title {
-    line-height: 1;
-    font-weight: var(--p-panel-header-font-weight);
-}
-.p-panel-header-icon {
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    cursor: pointer;
-    text-decoration: none;
-    overflow: hidden;
-    position: relative;
-    width: var(--p-panel-header-icon-width);
-    height: var(--p-panel-header-icon-height);
-    color: var(--p-panel-header-icon-color);
-    border: var(--p-panel-header-icon-border-width) var(--p-panel-header-icon-border-style) var(--p-panel-header-icon-border-color);
-    background: var(--p-panel-header-icon-background);
-    border-radius: var(--p-panel-header-icon-border-radius);
-    transition: var(--p-transition);
-    outline-color: transparent;
-}
-.p-panel-header-icon:enabled:hover {
-    color: var(--p-panel-header-icon-hover-color);
-    border-color: var(--p-panel-header-icon-hover-border-color);
-    background: var(--p-panel-header-icon-hover-background);
-}
-.p-panel-header-icon:focus-visible {
-    outline: var(--p-focus-ring-width) var(--p-focus-ring-style) var(--p-focus-ring-color);
-    outline-offset: var(--p-focus-ring-offset);
-}
-.p-panel-toggleable > .p-panel-header {
-    padding: var(--p-panel-toggleable-header-padding-y) var(--p-panel-toggleable-header-padding-x);
-}
-.p-panel-content {
-    padding: var(--p-panel-content-padding-y) var(--p-panel-content-padding-x);
-    border: var(--p-panel-content-border-width) var(--p-panel-content-border-style) var(--p-panel-content-border-color);
-    background: var(--p-panel-content-background);
-    color: var(--p-panel-content-color);
-    border-top: 0;
-}
-.p-panel-content:last-child {
-    border-bottom-right-radius: var(--p-border-radius);
-    border-bottom-left-radius: var(--p-border-radius);
-}
-.p-panel-footer {
-    padding: var(--p-panel-footer-padding-y) var(--p-panel-footer-padding-x);
-    border: var(--p-panel-footer-border-width) var(--p-panel-footer-border-style) var(--p-panel-footer-border-color);
-    background: var(--p-panel-footer-background);
-    color: var(--p-panel-footer-color);
-    border-bottom-right-radius: var(--p-border-radius);
-    border-bottom-left-radius: var(--p-border-radius);
-    border-top: 0;
-}
-    `
-};
diff --git a/components/lib/theme/lara/panel/package.json b/components/lib/theme/lara/panel/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/panel/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/scrollpanel/index.d.ts b/components/lib/theme/lara/scrollpanel/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/scrollpanel/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/scrollpanel/index.js b/components/lib/theme/lara/scrollpanel/index.js
deleted file mode 100644
index 70912c392..000000000
--- a/components/lib/theme/lara/scrollpanel/index.js
+++ /dev/null
@@ -1,64 +0,0 @@
-export default {
-    variables: {
-        common: {},
-        light: {},
-        dark: {}
-    },
-    css: `
-.p-scrollpanel-wrapper {
-    overflow: hidden;
-    width: 100%;
-    height: 100%;
-    position: relative;
-    z-index: 1;
-    float: left;
-}
-.p-scrollpanel-content {
-    height: calc(100% + 18px);
-    width: calc(100% + 18px);
-    padding: 0 18px 18px 0;
-    position: relative;
-    overflow: auto;
-    box-sizing: border-box;
-    scrollbar-width: none;
-}
-.p-scrollpanel-content::-webkit-scrollbar {
-    display: none;
-}
-.p-scrollpanel-bar {
-    position: relative;
-    background: var(--p-scroll-panel-track-bg);
-    border-radius: 3px;
-    z-index: 2;
-    cursor: pointer;
-    opacity: 0;
-    transition: var(--p-form-element-transition);
-    border: var(--p-scroll-panel-track-border);
-}
-.p-scrollpanel-bar-y {
-    width: 9px;
-    top: 0;
-}
-.p-scrollpanel-bar-x {
-    height: 9px;
-    bottom: 0;
-}
-.p-scrollpanel-hidden {
-    visibility: hidden;
-}
-.p-scrollpanel:active .p-scrollpanel-bar,
-.p-scrollpanel:hover .p-scrollpanel-bar {
-    opacity: 1;
-}
-.p-scrollpanel-grabbed {
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-}
-.p-scrollpanel-bar:focus-visible {
-    outline: var(--p-focus-outline);
-    outline-offset: var(--p-focus-outline-offset);
-    box-shadow: var(--p-focus-shadow);
-}
-    `
-};
diff --git a/components/lib/theme/lara/scrollpanel/package.json b/components/lib/theme/lara/scrollpanel/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/scrollpanel/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/splitter/index.d.ts b/components/lib/theme/lara/splitter/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/splitter/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/splitter/index.js b/components/lib/theme/lara/splitter/index.js
deleted file mode 100644
index aa3446f8a..000000000
--- a/components/lib/theme/lara/splitter/index.js
+++ /dev/null
@@ -1,68 +0,0 @@
-export default {
-    variables: {
-        common: {},
-        light: {},
-        dark: {}
-    },
-    css: `
-.p-splitter {
-    display: flex;
-    flex-wrap: nowrap;
-    border: var(--p-panel-content-border);
-    background: var(--p-panel-content-bg);
-    border-radius: var(--p-border-radius);
-    color: var(--p-panel-content-text-color);
-}
-.p-splitter-vertical {
-    flex-direction: column;
-}
-.p-splitter-gutter {
-    flex-grow: 0;
-    flex-shrink: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    cursor: col-resize;
-    transition: var(--p-action-icon-transition);
-    background: var(--p-splitter-gutter-bg);
-}
-.p-splitter-horizontal.p-splitter-resizing {
-    cursor: col-resize;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-}
-.p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {
-    height: 24px;
-    width: 100%;
-}
-.p-splitter-horizontal > .p-splitter-gutter {
-    cursor: col-resize;
-}
-.p-splitter-vertical.p-splitter-resizing {
-    cursor: row-resize;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-}
-.p-splitter-vertical > .p-splitter-gutter {
-    cursor: row-resize;
-}
-.p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {
-    width: 24px;
-    height: 100%;
-}
-.p-splitter-gutter-handle {
-    background: var(--p-splitter-gutter-handle-bg);
-    transition: var(--p-form-element-transition);
-}
-.p-splitter-gutter-handle:focus-visible {
-    outline: var(--p-focus-outline);
-    outline-offset: var(--p-focus-outline-offset);
-    box-shadow: var(--p-focus-shadow);
-}
-.p-splitter-gutter-resizing {
-    background: var(--p-splitter-gutter-handle-bg);
-}
-    `
-};
diff --git a/components/lib/theme/lara/splitter/package.json b/components/lib/theme/lara/splitter/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/splitter/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/tabview/index.d.ts b/components/lib/theme/lara/tabview/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/tabview/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/tabview/index.js b/components/lib/theme/lara/tabview/index.js
deleted file mode 100644
index 2cdec0309..000000000
--- a/components/lib/theme/lara/tabview/index.js
+++ /dev/null
@@ -1,127 +0,0 @@
-export default {
-    variables: {
-        common: {},
-        light: {},
-        dark: {}
-    },
-    css: `
-.p-tabview-nav-container {
-    position: relative;
-}
-.p-tabview-scrollable .p-tabview-nav-container {
-    overflow: hidden;
-}
-.p-tabview-nav-content {
-    overflow-x: auto;
-    overflow-y: hidden;
-    scroll-behavior: smooth;
-    scrollbar-width: none;
-    overscroll-behavior: contain auto;
-}
-.p-tabview-nav {
-    display: flex;
-    margin: 0;
-    padding: 0;
-    list-style-type: none;
-    flex: 1 1 auto;
-    background: var(--p-tabview-nav-bg);
-    border: var(--p-tabview-nav-border);
-    border-width: var(--p-tabview-nav-border-width);
-}
-.p-tabview-header-action {
-    cursor: pointer;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-    display: flex;
-    align-items: center;
-    position: relative;
-    text-decoration: none;
-    overflow: hidden;
-}
-.p-tabview-ink-bar {
-    display: none;
-    z-index: 1;
-}
-.p-tabview-header-action:focus {
-    z-index: 1;
-}
-.p-tabview-title {
-    line-height: 1;
-    white-space: nowrap;
-}
-.p-tabview-nav-btn {
-    position: absolute;
-    top: 0;
-    z-index: 2;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-.p-tabview-nav-prev {
-    left: 0;
-}
-.p-tabview-nav-next {
-    right: 0;
-}
-.p-tabview-nav-content::-webkit-scrollbar {
-    display: none;
-}
-.p-tabview-nav li {
-    margin-right: var(--p-tabview-header-spacing);
-}
-.p-tabview-nav-link {
-    border: var(--p-tabview-header-border);
-    border-width: var(--p-tabview-header-border-width);
-    border-color: var(--p-tabview-header-border-color);
-    background: var(--p-tabview-header-bg);
-    color: var(--p-tabview-header-text-color);
-    padding: var(--p-tabview-header-padding);
-    font-weight: var(--p-tabview-header-font-weight);
-    border-top-right-radius: var(--p-border-radius);
-    border-top-left-radius: var(--p-border-radius);
-    transition:
-        background-color 0.2s,
-        border-color 0.2s,
-        box-shadow 0.2s;
-    margin: var(--p-tabview-header-margin);
-}
-.p-tabview-nav-link:not(.p-disabled):focus-visible {
-    outline: var(--p-focus-outline);
-    outline-offset: var(--p-focus-outline-offset);
-    box-shadow: inset var(--p-focus-shadow);
-}
-.p-tabview-nav li:not(.p-highlight):not(.p-disabled):hover .p-tabview-nav-link {
-    background: var(--p-tabview-header-hover-bg);
-    border-color: var(--p-tabview-header-hover-border-color);
-    color: var(--p-tabview-header-text-hover-color);
-}
-.p-tabview-nav li.p-highlight .p-tabview-nav-link {
-    border-color: var(--p-tabview-header-active-border-color);
-}
-.p-tabview-nav li.p-highlight .p-tabview-nav-link,
-.p-tabview-nav-btn.p-link {
-    background: var(--p-tabview-header-active-bg);
-    color: var(--p-tabview-header-text-active-color);
-}
-.p-tabview-nav-btn.p-link {
-    width: var(--p-button-icon-only-width);
-    box-shadow: var(--p-raised-button-shadow);
-    border-radius: 0;
-}
-.p-tabview-nav-btn.p-link:focus-visible {
-    outline: var(--p-focus-outline);
-    outline-offset: var(--p-focus-outline-offset);
-    box-shadow: inset var(--p-focus-shadow);
-}
-.p-tabview-panels {
-    background: var(--p-tabview-content-bg);
-    padding: var(--p-tabview-content-padding);
-    border: var(--p-tabview-content-border);
-    color: var(--p-tabview-content-text-color);
-    border-bottom-right-radius: var(--p-border-radius);
-    border-bottom-left-radius: var(--p-border-radius);
-}
-    `
-};
diff --git a/components/lib/theme/lara/tabview/package.json b/components/lib/theme/lara/tabview/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/tabview/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/components/lib/theme/lara/toolbar/index.d.ts b/components/lib/theme/lara/toolbar/index.d.ts
deleted file mode 100644
index b3dfdca71..000000000
--- a/components/lib/theme/lara/toolbar/index.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-interface PanelThemeVariables {
-    panelHeaderBorder?: string | undefined;
-    panelHeaderPadding?: string | undefined;
-    panelHeaderBg?: string | undefined;
-    panelHeaderTextColor?: string | undefined;
-    panelHeaderFontWeight?: string | undefined;
-    panelHeaderIconWidth?: string | undefined;
-    panelHeaderIconHeight?: string | undefined;
-    panelHeaderIconColor?: string | undefined;
-    panelHeaderIconBorder?: string | undefined;
-    panelHeaderIconBg?: string | undefined;
-    panelHeaderIconBorderRadius?: string | undefined;
-    panelHeaderIconTransition?: string | undefined;
-    panelHeaderIconHoverColor?: string | undefined;
-    panelHeaderIconHoverBorderColor?: string | undefined;
-    panelHeaderIconHoverBg?: string | undefined;
-    panelHeaderIconFocusOutline?: string | undefined;
-    panelHeaderIconFocusOutlineOffset?: string | undefined;
-    panelHeaderIconFocusShadow?: string | undefined;
-    panelToggleableHeaderPadding?: string | undefined;
-    panelContentPadding?: string | undefined;
-    panelContentBorder?: string | undefined;
-    panelContentBg?: string | undefined;
-    panelContentTextColor?: string | undefined;
-    panelContentBorderTop?: string | undefined;
-    panelFooterPadding?: string | undefined;
-    panelFooterBorder?: string | undefined;
-    panelFooterBg?: string | undefined;
-    panelFooterTextColor?: string | undefined;
-    panelFooterBorderTop?: string | undefined;
-}
diff --git a/components/lib/theme/lara/toolbar/index.js b/components/lib/theme/lara/toolbar/index.js
deleted file mode 100644
index 4c2b13693..000000000
--- a/components/lib/theme/lara/toolbar/index.js
+++ /dev/null
@@ -1,30 +0,0 @@
-export default {
-    variables: {
-        common: {},
-        light: {},
-        dark: {}
-    },
-    css: `
-.p-toolbar {
-    justify-content: space-between;
-    flex-wrap: wrap;
-    background: var(--p-panel-header-bg);
-    border: var(--p-panel-header-border);
-    padding: var(--p-panel-header-padding);
-    border-radius: var(--p-border-radius);
-    gap: var(--p-inline-spacing);
-}
-.p-toolbar,
-.p-toolbar-group-center,
-.p-toolbar-group-end,
-.p-toolbar-group-left,
-.p-toolbar-group-right,
-.p-toolbar-group-start {
-    display: flex;
-    align-items: center;
-}
-.p-toolbar-separator {
-    margin: 0 var(--p-inline-spacing);
-}
-    `
-};
diff --git a/components/lib/theme/lara/toolbar/package.json b/components/lib/theme/lara/toolbar/package.json
deleted file mode 100644
index f8e9d7ae0..000000000
--- a/components/lib/theme/lara/toolbar/package.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-    "main": "./index.cjs.js",
-    "module": "./index.esm.js",
-    "unpkg": "./index.min.js",
-    "types": "./index.d.ts"
-}
diff --git a/nuxt.config.js b/nuxt.config.js
index b30c190fa..db80ac1ea 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -52,7 +52,10 @@ export default defineNuxtConfig({
                 { property: 'og:image', content: 'https://www.primefaces.org/static/social/primevue-preview.jpg' },
                 { property: 'og:ttl', content: '604800' }
             ],
-            link: [{ rel: 'icon', href: baseUrl + 'favicon.ico' }],
+            link: [
+                { rel: 'icon', href: baseUrl + 'favicon.ico' },
+                { rel: 'stylesheet', href: 'https://rsms.me/inter/inter.css' }
+            ],
             script: [
                 {
                     src: baseUrl + 'scripts/prism.js',