diff --git a/es-bs-base/package-lock.json b/es-bs-base/package-lock.json
index 427745d54..88e8dbb58 100644
--- a/es-bs-base/package-lock.json
+++ b/es-bs-base/package-lock.json
@@ -46,7 +46,7 @@
         "postcss-cli": "^10.0.0",
         "qunit": "^2.18.2",
         "rollup": "^3.2.5",
-        "sass": "^1.66.1",
+        "sass": "^1.77.8",
         "shelljs": "^0.8.5",
         "sinon": "^15.0.0",
         "stylelint": "^14.7.1",
@@ -9050,9 +9050,9 @@
       "dev": true
     },
     "node_modules/sass": {
-      "version": "1.70.0",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.70.0.tgz",
-      "integrity": "sha512-uUxNQ3zAHeAx5nRFskBnrWzDUJrrvpCPD5FNAoRvTi0WwremlheES3tg+56PaVtCs5QDRX5CBLxxKMDJMEa1WQ==",
+      "version": "1.77.8",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.8.tgz",
+      "integrity": "sha512-4UHg6prsrycW20fqLGPShtEvo/WyHRVRHwOP4DzkUrObWoWI05QBSfzU71TVB7PFaL104TwNaHpjlWXAZbQiNQ==",
       "dev": true,
       "dependencies": {
         "chokidar": ">=3.0.0 <4.0.0",
diff --git a/es-bs-base/package.json b/es-bs-base/package.json
index 8b23ce718..e4f632b42 100644
--- a/es-bs-base/package.json
+++ b/es-bs-base/package.json
@@ -31,7 +31,7 @@
   "style": "dist/css/bootstrap.css",
   "scripts": {
     "css": "npm-run-all css-compile css-prefix css-minify",
-    "css-compile": "sass scss/:dist/css/",
+    "css-compile": "sass --silence-deprecation=mixed-decls scss/:dist/css/",
     "css-minify": "cleancss -O1 --format breakWith=lf --with-rebase --source-map --source-map-inline-sources --output dist/css/ --batch --batch-suffix \".min\" \"dist/css/*.css\" \"!dist/css/*.min.css\"",
     "css-prefix": "npm-run-all --aggregate-output --parallel css-prefix-*",
     "css-prefix-main": "postcss --config build/postcss.config.js --replace \"dist/css/*.css\" \"!dist/css/*.min.css\"",
@@ -94,7 +94,7 @@
     "postcss-cli": "^10.0.0",
     "qunit": "^2.18.2",
     "rollup": "^3.2.5",
-    "sass": "^1.66.1",
+    "sass": "^1.77.8",
     "shelljs": "^0.8.5",
     "sinon": "^15.0.0",
     "stylelint": "^14.7.1",
diff --git a/es-ds-docs/nuxt.config.ts b/es-ds-docs/nuxt.config.ts
index 6997480da..de69b518a 100644
--- a/es-ds-docs/nuxt.config.ts
+++ b/es-ds-docs/nuxt.config.ts
@@ -7,6 +7,19 @@ export default defineNuxtConfig({
         '@energysage/es-bs-base/scss/bootstrap.scss',
     ],
 
+    vite: {
+        css: {
+            preprocessorOptions: {
+                scss: {
+                    api: 'modern-compiler',
+                    silenceDeprecations: [
+                        'mixed-decls', // https://sass-lang.com/documentation/breaking-changes/mixed-decls/
+                    ],
+                }
+            }
+        }
+    },
+
     devtools: { enabled: true },
 
     // https://nuxt.com/docs/getting-started/layers#usage
@@ -46,5 +59,5 @@ export default defineNuxtConfig({
     },
 
     // https://nuxt.com/docs/getting-started/deployment#static-hosting
-    ssr: true
+    ssr: true,
 })
diff --git a/es-ds-docs/package-lock.json b/es-ds-docs/package-lock.json
index 84bd4e13a..bffbbac4c 100644
--- a/es-ds-docs/package-lock.json
+++ b/es-ds-docs/package-lock.json
@@ -14,6 +14,7 @@
         "nuxt": "^3.12.4",
         "primevue": "^3.53.0",
         "prismjs": "^1.29.0",
+        "vite": "^5.4.0",
         "vue": "^3.4.34"
       },
       "devDependencies": {
@@ -7836,9 +7837,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.39",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.39.tgz",
-      "integrity": "sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==",
+      "version": "8.4.41",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.41.tgz",
+      "integrity": "sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==",
       "funding": [
         {
           "type": "opencollective",
@@ -10168,12 +10169,12 @@
       }
     },
     "node_modules/vite": {
-      "version": "5.3.4",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.4.tgz",
-      "integrity": "sha512-Cw+7zL3ZG9/NZBB8C+8QbQZmR54GwqIz+WMI4b3JgdYJvX+ny9AjJXqkGQlDXSXRP9rP0B4tbciRMOVEKulVOA==",
+      "version": "5.4.0",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.0.tgz",
+      "integrity": "sha512-5xokfMX0PIiwCMCMb9ZJcMyh5wbBun0zUzKib+L65vAZ8GY9ePZMXxFrHbr/Kyll2+LSCY7xtERPpxkBDKngwg==",
       "dependencies": {
         "esbuild": "^0.21.3",
-        "postcss": "^8.4.39",
+        "postcss": "^8.4.40",
         "rollup": "^4.13.0"
       },
       "bin": {
@@ -10193,6 +10194,7 @@
         "less": "*",
         "lightningcss": "^1.21.0",
         "sass": "*",
+        "sass-embedded": "*",
         "stylus": "*",
         "sugarss": "*",
         "terser": "^5.4.0"
@@ -10210,6 +10212,9 @@
         "sass": {
           "optional": true
         },
+        "sass-embedded": {
+          "optional": true
+        },
         "stylus": {
           "optional": true
         },
diff --git a/es-ds-docs/package.json b/es-ds-docs/package.json
index c08a93ba6..e7c49599c 100644
--- a/es-ds-docs/package.json
+++ b/es-ds-docs/package.json
@@ -17,6 +17,7 @@
     "nuxt": "^3.12.4",
     "primevue": "^3.53.0",
     "prismjs": "^1.29.0",
+    "vite": "^5.4.0",
     "vue": "^3.4.34"
   },
   "devDependencies": {