fix: Sass depreciation warnings (#1124)

## High Level Overview of Change

<!--
Please include a summary/list of the changes.
If too broad, please consider splitting into multiple PRs.
-->

Fix these warnings in build:

```
Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

More info: https://sass-lang.com/d/legacy-js-api

transforming (891) ../node_modules/topojson-client/src/identity.jsDeprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

More info: https://sass-lang.com/d/legacy-js-api

Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import

  ╷
1 │ @import '../../css/variables';
  │         ^^^^^^^^^^^^^^^^^^^^^
  ╵
    src/containers/shared/components/TokenSearchResults/styles.scss 1:9  root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in `& {}`.

More info: https://sass-lang.com/d/mixed-decls

    ╷
164 │     font-weight: 500;
    │     ^^^^^^^^^^^^^^^^ declaration
... │
200 │ ┌     @media (min-width: $desktop-upper-boundary) {
201 │ │       @content;
202 │ │     }
    │ └─── nested rule
    ╵
    src/containers/shared/css/variables.scss 164:3  medium()
    src/containers/NFT/NFTTabs/styles.scss 67:7     root stylesheet
```

Resolve #1121

### Type of Change

<!--
Please check relevant options, delete irrelevant ones.
-->

- [x] Bug fix (non-breaking change which fixes an issue)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to not work as expected)
- [ ] Refactor (non-breaking change that only restructures code)
- [ ] Tests (You added tests for code that already exists, or your new
feature included in this PR)
- [ ] Documentation Updates
- [ ] Translation Updates
- [ ] Release

src/containers/Accounts/AccountHeader/BalanceSelector/balance-selector.scss

@@ -1,4 +1,4 @@
-@use 'src/containers/shared/css/variables' as *;
+@use '../../../shared/css/variables.scss' as *;
 
 .balance-selector {
   position: relative;

src/containers/shared/components/TokenSearchResults/styles.scss

@@ -1,4 +1,4 @@
-@import '../../css/variables';
+@use '../../css/variables' as *;
 
 .search-results-menu {
   position: absolute;

src/containers/shared/css/variables.scss

@@ -155,7 +155,7 @@ $XRP_XRP: #0a93eb;
 $XRP_CAD: #ca3103;
 $XRP_OTHERS: #f52a79;
 
-// Font wights
+// Font weights
 @mixin regular {
   font-weight: 400;
 }

vite.config.js

@@ -87,5 +87,11 @@ export default defineConfig({
         autoprefixer({}), // add options if needed
       ],
     },
+    preprocessorOptions: {
+      scss: {
+        api: 'modern-compiler',
+        silenceDeprecations: ['mixed-decls'],
+      },
+    },
   },
 })