Add Sass docs (variables, mixins, and loops) to most pages (#32747)

* WIP: Mention variables, mixins, and loops in docs

* Add Sass sections to component pages

* add sass docs for forms and content

* Update buttons.md

* Remove empty mixins sections

* Massive update to utilities and some consistency changes

Co-authored-by: XhmikosR <xhmikosr@gmail.com>

site/content/docs/5.0/utilities/shadows.md

@@ -3,6 +3,7 @@ layout: docs
 title: Shadows
 description: Add or remove shadows to elements with box-shadow utilities.
 group: utilities
+toc: true
 ---
 
 ## Examples
@@ -15,3 +16,15 @@ While shadows on components are disabled by default in Bootstrap and can be enab
 <div class="shadow p-3 mb-5 bg-body rounded">Regular shadow</div>
 <div class="shadow-lg p-3 mb-5 bg-body rounded">Larger shadow</div>
 {{< /example >}}
+
+## Sass
+
+### Variables
+
+{{< scss-docs name="box-shadow-variables" file="scss/_variables.scss" >}}
+
+### Utilities API
+
+Shadow utilities are declared in our utilities API in `scss/_utilities.scss`. [Learn how to use the utilities API.]({{< docsref "/utilities/api#using-the-api" >}})
+
+{{< scss-docs name="utils-shadow" file="scss/_utilities.scss" >}}