scss updates

.stylelintrc.json

@@ -1,8 +1,6 @@
 {
   "extends": "stylelint-config-standard",
-  "plugins": [
-    "stylelint-scss"
-  ],
+  "plugins": ["stylelint-scss"],
   "rules": {
     "import-notation": null,
     "at-rule-no-unknown": [
@@ -15,18 +13,16 @@
           "include",
           "if",
           "else",
-          "for"
+          "for",
+          "use",
+          "forward"
         ]
       }
     ],
     "function-no-unknown": [
       true,
       {
-        "ignoreFunctions": [
-          "darken",
-          "lighten",
-          "percentage"
-        ]
+        "ignoreFunctions": ["darken", "lighten", "percentage", "math.div"]
       }
     ],
     "media-query-no-invalid": null,

src/scss/layout/_grid.scss

@@ -1,4 +1,3 @@
-/* _grid.scss */
 @use "sass:math";
 
 .container {

src/scss/main.scss

@@ -1,5 +1,7 @@
 /* main.scss */
 
+use "sass:math";
+
 /* Abstracts */
 @import 'abstracts/variables';
 @import 'abstracts/mixins';

src/scss/vendors/custom-bootstrap.scss

@@ -1,10 +1,11 @@
-// src/scss/vendors/custom-bootstrap.scss
+/* src/scss/vendors/custom-bootstrap.scss */
 @import "../abstracts/variables"; // Ensure your custom variables are imported first
+@import "bootstrap/scss/bootstrap";
 
-// Override Bootstrap variables here
+/* Override Bootstrap variables here */
 $font-size-base: 1rem; // Example variable override
 $line-height-base: 1.5;
 $nav-link-padding-y: 0.5rem;
 
-// Import Bootstrap's main SCSS file
-@import "/node_modules/bootstrap/scss/bootstrap";
+// /* Import Bootstrap's main SCSS file */
+// @import "/node_modules/bootstrap/scss/bootstrap";