Merge branch '8.2RC'8.2

186 files changed, 2002 insertions, 763 deletions

diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/_index.html b/vendor/twbs/bootstrap/site/content/docs/5.2/_index.html
deleted file mode 100644
index fe65dc364..000000000
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/_index.html
+++ /dev/null
@@ -1,5 +0,0 @@
----
-layout: redirect
-sitemap_exclude: true
-redirect: "/docs/5.2/getting-started/introduction/"
----
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/progress.md b/vendor/twbs/bootstrap/site/content/docs/5.2/components/progress.md
deleted file mode 100644
index aa793683b..000000000
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/progress.md
+++ /dev/null
@@ -1,154 +0,0 @@
----
-layout: docs
-title: Progress
-description: Documentation and examples for using Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels.
-group: components
-toc: true
----
-
-## How it works
-
-Progress components are built with two HTML elements, some CSS to set the width, and a few attributes. We don't use [the HTML5 `<progress>` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress), ensuring you can stack progress bars, animate them, and place text labels over them.
-
-- We use the `.progress` as a wrapper to indicate the max value of the progress bar.
-- We use the inner `.progress-bar` to indicate the progress so far.
-- The `.progress-bar` requires an inline style, utility class, or custom CSS to set their width.
-- The `.progress-bar` also requires some `role` and `aria` attributes to make it accessible, including an accessible name (using `aria-label`, `aria-labelledby`, or similar).
-
-Put that all together, and you have the following examples.
-
-{{< example >}}
-<div class="progress">
-  <div class="progress-bar" role="progressbar" aria-label="Basic example" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar" role="progressbar" aria-label="Basic example" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar" role="progressbar" aria-label="Basic example" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar" role="progressbar" aria-label="Basic example" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar" role="progressbar" aria-label="Basic example" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-{{< /example >}}
-
-Bootstrap provides a handful of [utilities for setting width]({{< docsref "/utilities/sizing" >}}). Depending on your needs, these may help with quickly configuring progress.
-
-{{< example >}}
-<div class="progress">
-  <div class="progress-bar w-75" role="progressbar" aria-label="Basic example" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-{{< /example >}}
-
-## Labels
-
-Add labels to your progress bars by placing text within the `.progress-bar`.
-
-{{< example >}}
-<div class="progress">
-  <div class="progress-bar" role="progressbar" aria-label="Example with label" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
-</div>
-{{< /example >}}
-
-## Height
-
-We only set a `height` value on the `.progress`, so if you change that value the inner `.progress-bar` will automatically resize accordingly.
-
-{{< example >}}
-<div class="progress" style="height: 1px;">
-  <div class="progress-bar" role="progressbar" aria-label="Example 1px high" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress" style="height: 20px;">
-  <div class="progress-bar" role="progressbar" aria-label="Example 20px high" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-{{< /example >}}
-
-## Backgrounds
-
-Use background utility classes to change the appearance of individual progress bars.
-
-{{< example >}}
-<div class="progress">
-  <div class="progress-bar bg-success" role="progressbar" aria-label="Success example" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar bg-info" role="progressbar" aria-label="Info example" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar bg-warning" role="progressbar" aria-label="Warning example" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar bg-danger" role="progressbar" aria-label="Danger example" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-{{< /example >}}
-
-{{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
-{{< /callout >}}
-
-## Multiple bars
-
-Include multiple progress bars in a progress component if you need.
-
-{{< example >}}
-<div class="progress">
-  <div class="progress-bar" role="progressbar" aria-label="Segment one" style="width: 15%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
-  <div class="progress-bar bg-success" role="progressbar" aria-label="Segment two" style="width: 30%" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
-  <div class="progress-bar bg-info" role="progressbar" aria-label="Segment three" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-{{< /example >}}
-
-## Striped
-
-Add `.progress-bar-striped` to any `.progress-bar` to apply a stripe via CSS gradient over the progress bar's background color.
-
-{{< example >}}
-<div class="progress">
-  <div class="progress-bar progress-bar-striped" role="progressbar" aria-label="Default striped example" style="width: 10%" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar progress-bar-striped bg-success" role="progressbar" aria-label="Success striped example" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar progress-bar-striped bg-info" role="progressbar" aria-label="Info striped example" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar progress-bar-striped bg-warning" role="progressbar" aria-label="Warning striped example" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-<div class="progress">
-  <div class="progress-bar progress-bar-striped bg-danger" role="progressbar" aria-label="Danger striped example" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
-</div>
-{{< /example >}}
-
-## Animated stripes
-
-The striped gradient can also be animated. Add `.progress-bar-animated` to `.progress-bar` to animate the stripes right to left via CSS3 animations.
-
-{{< example >}}
-<div class="progress">
-  <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-label="Animated striped example" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 75%"></div>
-</div>
-{{< /example >}}
-
-## CSS
-
-### Variables
-
-{{< added-in "5.2.0" >}}
-
-As part of Bootstrap's evolving CSS variables approach, progress bars now use local CSS variables on `.progress` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too.
-
-{{< scss-docs name="progress-css-vars" file="scss/_progress.scss" >}}
-
-### Sass variables
-
-{{< scss-docs name="progress-variables" file="scss/_variables.scss" >}}
-
-### Keyframes
-
-Used for creating the CSS animations for `.progress-bar-animated`. Included in `scss/_progress-bar.scss`.
-
-{{< scss-docs name="progress-keyframes" file="scss/_progress.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/color.md b/vendor/twbs/bootstrap/site/content/docs/5.2/customize/color.md
deleted file mode 100644
index 23a7f7104..000000000
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/color.md
+++ /dev/null
@@ -1,151 +0,0 @@
----
-layout: docs
-title: Color
-description: Bootstrap is supported by an extensive color system that themes our styles and components. This enables more comprehensive customization and extension for any project.
-group: customize
-toc: true
----
-
-## Theme colors
-
-We use a subset of all colors to create a smaller color palette for generating color schemes, also available as Sass variables and a Sass map in Bootstrap's `scss/_variables.scss` file.
-
-<div class="row">
-  {{< theme-colors.inline >}}
-  {{- range (index $.Site.Data "theme-colors") }}
-    <div class="col-md-4">
-      <div class="p-3 mb-3 bg-{{ .name }} {{ if .contrast_color }}text-{{ .contrast_color }}{{ else }}text-white{{ end }}">{{ .name | title }}</div>
-    </div>
-  {{ end -}}
-  {{< /theme-colors.inline >}}
-</div>
-
-All these colors are available as a Sass map, `$theme-colors`.
-
-{{< scss-docs name="theme-colors-map" file="scss/_variables.scss" >}}
-
-Check out [our Sass maps and loops docs]({{< docsref "/customize/sass#maps-and-loops" >}}) for how to modify these colors.
-
-## All colors
-
-All Bootstrap colors are available as Sass variables and a Sass map in `scss/_variables.scss` file. To avoid increased file sizes, we don't create text or background color classes for each of these variables. Instead, we choose a subset of these colors for a [theme palette](#theme-colors).
-
-Be sure to monitor contrast ratios as you customize colors. As shown below, we've added three contrast ratios to each of the main colors—one for the swatch's current colors, one for against white, and one for against black.
-
-<div class="row font-monospace">
-  {{< theme-colors.inline >}}
-  {{- range $color := $.Site.Data.colors }}
-    {{- if (and (not (eq $color.name "white")) (not (eq $color.name "gray")) (not (eq $color.name "gray-dark"))) }}
-    <div class="col-md-4 mb-3">
-      <div class="p-3 mb-2 position-relative swatch-{{ $color.name }}">
-        <strong class="d-block">${{ $color.name }}</strong>
-        {{ $color.hex }}
-      </div>
-      {{ range (seq 100 100 900) }}
-      <div class="p-3 bd-{{ $color.name }}-{{ . }}">${{ $color.name }}-{{ . }}</div>
-      {{ end }}
-    </div>
-    {{ end -}}
-  {{ end -}}
-
-  <div class="col-md-4 mb-3">
-    <div class="p-3 mb-2 position-relative swatch-gray-500">
-      <strong class="d-block">$gray-500</strong>
-      #adb5bd
-    </div>
-  {{- range $.Site.Data.grays }}
-    <div class="p-3 bd-gray-{{ .name }}">$gray-{{ .name }}</div>
-  {{ end -}}
-  </div>
-  {{< /theme-colors.inline >}}
-
-  <div class="col-md-4 mb-3">
-    <div class="p-3 mb-2 bd-black text-white">
-      <strong class="d-block">$black</strong>
-      #000
-    </div>
-    <div class="p-3 mb-2 bd-white border">
-      <strong class="d-block">$white</strong>
-      #fff
-    </div>
-  </div>
-</div>
-
-### Notes on Sass
-
-Sass cannot programmatically generate variables, so we manually created variables for every tint and shade ourselves. We specify the midpoint value (e.g., `$blue-500`) and use custom color functions to tint (lighten) or shade (darken) our colors via Sass's `mix()` color function.
-
-Using `mix()` is not the same as `lighten()` and `darken()`—the former blends the specified color with white or black, while the latter only adjusts the lightness value of each color. The result is a much more complete suite of colors, as [shown in this CodePen demo](https://codepen.io/emdeoh/pen/zYOQOPB).
-
-Our `tint-color()` and `shade-color()` functions use `mix()` alongside our `$theme-color-interval` variable, which specifies a stepped percentage value for each mixed color we produce. See the `scss/_functions.scss` and `scss/_variables.scss` files for the full source code.
-
-## Color Sass maps
-
-Bootstrap's source Sass files include three maps to help you quickly and easily loop over a list of colors and their hex values.
-
-- `$colors` lists all our available base (`500`) colors
-- `$theme-colors` lists all semantically named theme colors (shown below)
-- `$grays` lists all tints and shades of gray
-
-Within `scss/_variables.scss`, you'll find Bootstrap's color variables and Sass map. Here's an example of the `$colors` Sass map:
-
-{{< scss-docs name="colors-map" file="scss/_variables.scss" >}}
-
-Add, remove, or modify values within the map to update how they're used in many other components. Unfortunately at this time, not _every_ component utilizes this Sass map. Future updates will strive to improve upon this. Until then, plan on making use of the `${color}` variables and this Sass map.
-
-### Example
-
-Here's how you can use these in your Sass:
-
-```scss
-.alpha { color: $purple; }
-.beta {
-  color: $yellow-300;
-  background-color: $indigo-900;
-}
-```
-
-[Color]({{< docsref "/utilities/colors" >}}) and [background]({{< docsref "/utilities/background" >}}) utility classes are also available for setting `color` and `background-color` using the `500` color values.
-
-## Generating utilities
-
-{{< added-in "5.1.0" >}}
-
-Bootstrap doesn't include `color` and `background-color` utilities for every color variable, but you can generate these yourself with our [utility API]({{< docsref "/utilities/api" >}}) and our extended Sass maps added in v5.1.0.
-
-1. To start, make sure you've imported our functions, variables, mixins, and utilities.
-2. Use our `map-merge-multiple()` function to quickly merge multiple Sass maps together in a new map.
-3. Merge this new combined map to extend any utility with a `{color}-{level}` class name.
-
-Here's an example that generates text color utilities (e.g., `.text-purple-500`) using the above steps.
-
-```scss
-@import "bootstrap/scss/functions";
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/maps";
-@import "bootstrap/scss/mixins";
-@import "bootstrap/scss/utilities";
-
-$all-colors: map-merge-multiple($blues, $indigos, $purples, $pinks, $reds, $oranges, $yellows, $greens, $teals, $cyans);
-
-$utilities: map-merge(
-  $utilities,
-  (
-    "color": map-merge(
-      map-get($utilities, "color"),
-      (
-        values: map-merge(
-          map-get(map-get($utilities, "color"), "values"),
-          (
-            $all-colors
-          ),
-        ),
-      ),
-    ),
-  )
-);
-
-@import "bootstrap/scss/utilities/api";
-```
-
-This will generate new `.text-{color}-{level}` utilities for every color and level. You can do the same for any other utility and property as well.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/overflow.md b/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/overflow.md
deleted file mode 100644
index a36374cd5..000000000
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/overflow.md
+++ /dev/null
@@ -1,40 +0,0 @@
----
-layout: docs
-title: Overflow
-description: Use these shorthand utilities for quickly configuring how content overflows an element.
-group: utilities
----
-
-Adjust the `overflow` property on the fly with four default values and classes. These classes are not responsive by default.
-
-<div class="bd-example d-md-flex">
-  <div class="overflow-auto p-3 mb-3 mb-md-0 me-md-3 bg-light" style="max-width: 260px; max-height: 100px;">
-    This is an example of using <code>.overflow-auto</code> on an element with set width and height dimensions. By design, this content will vertically scroll.
-  </div>
-  <div class="overflow-hidden p-3 mb-3 mb-md-0 me-md-3 bg-light" style="max-width: 260px; max-height: 100px;">
-    This is an example of using <code>.overflow-hidden</code> on an element with set width and height dimensions.
-  </div>
-  <div class="overflow-visible p-3 mb-3 mb-md-0 me-md-3 bg-light" style="max-width: 260px; max-height: 100px;">
-    This is an example of using <code>.overflow-visible</code> on an element with set width and height dimensions.
-  </div>
-  <div class="overflow-scroll p-3 bg-light" style="max-width: 260px; max-height: 100px;">
-    This is an example of using <code>.overflow-scroll</code> on an element with set width and height dimensions.
-  </div>
-</div>
-
-```html
-<div class="overflow-auto">...</div>
-<div class="overflow-hidden">...</div>
-<div class="overflow-visible">...</div>
-<div class="overflow-scroll">...</div>
-```
-
-Using Sass variables, you may customize the overflow utilities by changing the `$overflows` variable in `_variables.scss`.
-
-## Sass
-
-### Utilities API
-
-Overflow 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-overflow" file="scss/_utilities.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/_index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/_index.html
new file mode 100644
index 000000000..b04e391bc
--- /dev/null
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/_index.html
@@ -0,0 +1,5 @@
+---
+layout: redirect
+sitemap_exclude: true
+redirect: "/docs/5.3/getting-started/introduction/"
+---
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/about/brand.md b/vendor/twbs/bootstrap/site/content/docs/5.3/about/brand.md
index 80c613526..9c31da07f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/about/brand.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/about/brand.md
@@ -12,13 +12,13 @@ Have a need for Bootstrap's brand resources? Great! We have only a few guideline
 
 When referencing Bootstrap, use our logo mark. Do not modify our logos in any way. Do not use Bootstrap's branding for your own open or closed source projects. **Do not use the Twitter name or logo** in association with Bootstrap.
 
-<div class="bd-brand-item px-2 py-5 mb-3 bg-light rounded-lg">
+<div class="bd-brand-item px-2 py-5 mb-3 border rounded-3">
   <img class="d-block img-fluid mx-auto" src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo.svg" alt="Bootstrap" width="256" height="204">
 </div>
 
 Our logo mark is also available in black and white. All rules for our primary logo apply to these as well.
 
-<div class="bd-brand-logos d-sm-flex text-center bg-light rounded-lg overflow-hidden w-100 mb-3">
+<div class="bd-brand-logos d-sm-flex text-center bg-light rounded-3 overflow-hidden w-100 mb-3">
   <div class="bd-brand-item w-100 px-2 py-5">
     <img src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo-black.svg" alt="Bootstrap" width="128" height="102" loading="lazy">
   </div>
@@ -31,7 +31,7 @@ Our logo mark is also available in black and white. All rules for our primary lo
 
 Bootstrap should always be referred to as just **Bootstrap**. No Twitter before it and no capital _s_.
 
-<div class="bd-brand-logos d-sm-flex text-center bg-light rounded-lg overflow-hidden w-100 mb-3">
+<div class="bd-brand-logos d-sm-flex text-center border rounded-3 overflow-hidden w-100 mb-3">
   <div class="bd-brand-item w-100 p-3">
     <div class="h3">Bootstrap</div>
     <strong class="text-success">Correct</strong>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/about/license.md b/vendor/twbs/bootstrap/site/content/docs/5.3/about/license.md
index 07e60e00a..8698b1a3b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/about/license.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/about/license.md
@@ -5,7 +5,7 @@ description: Commonly asked questions about Bootstrap's open source license.
 group: about
 ---
 
-Bootstrap is released under the MIT license and is copyright {{< year >}} Twitter. Boiled down to smaller chunks, it can be described with the following conditions.
+Bootstrap is released under the MIT license and is copyright {{< year >}}. Boiled down to smaller chunks, it can be described with the following conditions.
 
 ## It requires you to:
 
@@ -23,8 +23,8 @@ Bootstrap is released under the MIT license and is copyright {{< year >}} Twitte
 - Hold the authors and license owners liable for damages as Bootstrap is provided without warranty
 - Hold the creators or copyright holders of Bootstrap liable
 - Redistribute any piece of Bootstrap without proper attribution
-- Use any marks owned by Twitter in any way that might state or imply that Twitter endorses your distribution
-- Use any marks owned by Twitter in any way that might state or imply that you created the Twitter software in question
+- Use any marks owned by Bootstrap in any way that might state or imply that Bootstrap endorses your distribution
+- Use any marks owned by Bootstrap in any way that might state or imply that you created the Bootstrap software in question
 
 ## It does not require you to:
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/about/overview.md b/vendor/twbs/bootstrap/site/content/docs/5.3/about/overview.md
index 1f39b85aa..0ccaf340b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/about/overview.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/about/overview.md
@@ -5,7 +5,7 @@ description: Learn more about the team maintaining Bootstrap, how and why the pr
 group: about
 aliases:
   - "/about/"
-  - "/docs/5.2/about/"
+  - "/docs/5.3/about/"
 ---
 
 ## Team
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/about/team.md b/vendor/twbs/bootstrap/site/content/docs/5.3/about/team.md
index c00ba4efc..c00ba4efc 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/about/team.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/about/team.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/about/translations.md b/vendor/twbs/bootstrap/site/content/docs/5.3/about/translations.md
index 5e2ae30c5..5e2ae30c5 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/about/translations.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/about/translations.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/accordion.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/accordion.md
index 2e247239c..33399772a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/accordion.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/accordion.md
@@ -5,7 +5,7 @@ description: Build vertically collapsing accordions in combination with our Coll
 group: components
 aliases:
   - "/components/"
-  - "/docs/5.2/components/"
+  - "/docs/5.3/components/"
 toc: true
 ---
 
@@ -14,7 +14,7 @@ toc: true
 The accordion uses [collapse]({{< docsref "/components/collapse" >}}) internally to make it collapsible. To render an accordion that's expanded, add the `.open` class on the `.accordion`.
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 ## Example
@@ -66,7 +66,7 @@ Click the accordions below to expand/collapse the accordion content.
 
 Add `.accordion-flush` to remove the default `background-color`, some borders, and some rounded corners to render accordions edge-to-edge with their parent container.
 
-{{< example class="bg-light" >}}
+{{< example class="bg-body-secondary" >}}
 <div class="accordion accordion-flush" id="accordionFlushExample">
   <div class="accordion-item">
     <h2 class="accordion-header" id="flush-headingOne">
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/alerts.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/alerts.md
index 8837ed46c..7ea5b9b42 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/alerts.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/alerts.md
@@ -10,6 +10,10 @@ toc: true
 
 Alerts are available for any length of text, as well as an optional close button. For proper styling, use one of the eight **required** contextual classes (e.g., `.alert-success`). For inline dismissal, use the [alerts JavaScript plugin](#dismissing).
 
+{{< callout info >}}
+**Heads up!** As of v5.3.0, the `alert-variant()` Sass mixin is deprecated. Alert variants now have their CSS variables overridden in [the Sass loop](#sass-loop).
+{{< /callout >}}
+
 {{< example >}}
 {{< alerts.inline >}}
 {{- range (index $.Site.Data "theme-colors") }}
@@ -20,7 +24,7 @@ Alerts are available for any length of text, as well as an optional close button
 {{< /example >}}
 
 {{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
 {{< /callout >}}
 
 ### Live example
@@ -177,6 +181,8 @@ As part of Bootstrap's evolving CSS variables approach, alerts now use local CSS
 
 ### Sass mixin
 
+{{< deprecated-in "5.3.0" >}}
+
 Used in combination with `$theme-colors` to create contextual modifier classes for our alerts.
 
 {{< scss-docs name="alert-variant-mixin" file="scss/mixins/_alert.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/badge.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/badge.md
index 55b1ffb85..c07387850 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/badge.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/badge.md
@@ -74,7 +74,7 @@ Set a `background-color` with contrasting foreground `color` with [our `.text-bg
 {{< /example >}}
 
 {{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
 {{< /callout >}}
 
 ## Pill badges
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/breadcrumb.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/breadcrumb.md
index 0012f9748..0012f9748 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/breadcrumb.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/breadcrumb.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/button-group.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/button-group.md
index 8f7d2d6a9..8f7d2d6a9 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/button-group.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/button-group.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/buttons.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md
index c2fdd75b1..396beec7f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/buttons.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md
@@ -21,7 +21,7 @@ Bootstrap includes several predefined button styles, each serving its own semant
 {{< /example >}}
 
 {{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
 {{< /callout >}}
 
 ## Disable text wrapping
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/card.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/card.md
index 6bc90e7b8..f715a5eac 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/card.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/card.md
@@ -207,7 +207,7 @@ Using the grid, wrap cards in columns and rows as needed.
 
 {{< example >}}
 <div class="row">
-  <div class="col-sm-6">
+  <div class="col-sm-6 mb-3 mb-sm-0">
     <div class="card">
       <div class="card-body">
         <h5 class="card-title">Special title treatment</h5>
@@ -233,7 +233,7 @@ Using the grid, wrap cards in columns and rows as needed.
 Use our handful of [available sizing utilities]({{< docsref "/utilities/sizing" >}}) to quickly set a card's width.
 
 {{< example >}}
-<div class="card w-75">
+<div class="card w-75 mb-3">
   <div class="card-body">
     <h5 class="card-title">Card title</h5>
     <p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
@@ -269,7 +269,7 @@ Use custom CSS in your stylesheets or as inline styles to set a width.
 You can quickly change the text alignment of any card—in its entirety or specific parts—with our [text align classes]({{< docsref "/utilities/text#text-alignment" >}}).
 
 {{< example >}}
-<div class="card" style="width: 18rem;">
+<div class="card mb-3" style="width: 18rem;">
   <div class="card-body">
     <h5 class="card-title">Special title treatment</h5>
     <p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
@@ -277,7 +277,7 @@ You can quickly change the text alignment of any card—in its entirety or speci
   </div>
 </div>
 
-<div class="card text-center" style="width: 18rem;">
+<div class="card text-center mb-3" style="width: 18rem;">
   <div class="card-body">
     <h5 class="card-title">Special title treatment</h5>
     <p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
@@ -436,7 +436,7 @@ Set a `background-color` with contrasting foreground `color` with [our `.text-bg
 {{< /example >}}
 
 {{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
 {{< /callout >}}
 
 ### Border
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/carousel.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/carousel.md
index e32ce64eb..dca8e9a79 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/carousel.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/carousel.md
@@ -8,48 +8,24 @@ toc: true
 
 ## How it works
 
-The carousel is a slideshow for cycling through a series of content, built with CSS 3D transforms and a bit of JavaScript. It works with a series of images, text, or custom markup. It also includes support for previous/next controls and indicators.
+- The carousel is a slideshow for cycling through a series of content, built with CSS 3D transforms and a bit of JavaScript. It works with a series of images, text, or custom markup. It also includes support for previous/next controls and indicators.
 
-In browsers where the [Page Visibility API](https://www.w3.org/TR/page-visibility/) is supported, the carousel will avoid sliding when the webpage is not visible to the user (such as when the browser tab is inactive, the browser window is minimized, etc.).
+- For performance reasons, **carousels must be manually initialized** using the [carousel constructor method](#methods). Without initialization, some of the event listeners (specifically, the events needed touch/swipe support) will not be registered until a user has explicitly activated a control or indicator.
 
-{{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
-{{< /callout >}}
-
-Please be aware that nested carousels are not supported, and carousels are generally not compliant with accessibility standards.
-
-## Example
-
-Carousels don't automatically normalize slide dimensions. As such, you may need to use additional utilities or custom styles to appropriately size content. While carousels support previous/next controls and indicators, they're not explicitly required. Add and customize as you see fit.
-
-**The `.active` class needs to be added to one of the slides** otherwise the carousel will not be visible. Also be sure to set a unique `id` on the `.carousel` for optional controls, especially if you're using multiple carousels on a single page. Control and indicator elements must have a `data-bs-target` attribute (or `href` for links) that matches the `id` of the `.carousel` element.
+  The only exception are [autoplaying carousels](#autoplaying-carousels) with the `data-bs-ride="carousel"` attribute as these are initialized automatically on page load. If you're using autoplaying carousels with the data attribute, **don't explicitly initialize the same carousels with the constructor method.**
 
-### Slides only
+- Nested carousels are not supported. You should also be aware that carousels in general can often cause usability and accessibility challenges.
 
-Here's a carousel with slides only. Note the presence of the `.d-block` and `.w-100` on carousel images to prevent browser default image alignment.
-
-{{< example >}}
-<div id="carouselExampleSlidesOnly" class="carousel slide" data-bs-ride="carousel">
-  <div class="carousel-inner">
-    <div class="carousel-item active">
-      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="First slide" >}}
-    </div>
-    <div class="carousel-item">
-      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#444" background="#666" text="Second slide" >}}
-    </div>
-    <div class="carousel-item">
-      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
-    </div>
-  </div>
-</div>
-{{< /example >}}
+{{< callout info >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
+{{< /callout >}}
 
-### With controls
+## Basic examples
 
-Adding in the previous and next controls. We recommend using `<button>` elements, but you can also use `<a>` elements with `role="button"`.
+Here is a basic example of a carousel with three slides. Note the previous/next controls. We recommend using `<button>` elements, but you can also use `<a>` elements with `role="button"`.
 
 {{< example >}}
-<div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel">
+<div id="carouselExample" class="carousel slide">
   <div class="carousel-inner">
     <div class="carousel-item active">
       {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="First slide" >}}
@@ -61,23 +37,27 @@ Adding in the previous and next controls. We recommend using `<button>` elements
       {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
     </div>
   </div>
-  <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="prev">
+  <button class="carousel-control-prev" type="button" data-bs-target="#carouselExample" data-bs-slide="prev">
     <span class="carousel-control-prev-icon" aria-hidden="true"></span>
     <span class="visually-hidden">Previous</span>
   </button>
-  <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="next">
+  <button class="carousel-control-next" type="button" data-bs-target="#carouselExample" data-bs-slide="next">
     <span class="carousel-control-next-icon" aria-hidden="true"></span>
     <span class="visually-hidden">Next</span>
   </button>
 </div>
 {{< /example >}}
 
-### With indicators
+Carousels don't automatically normalize slide dimensions. As such, you may need to use additional utilities or custom styles to appropriately size content. While carousels support previous/next controls and indicators, they're not explicitly required. Add and customize as you see fit.
+
+**You must add the `.active` class to one of the slides**, otherwise the carousel will not be visible. Also be sure to set a unique `id` on the `.carousel` for optional controls, especially if you're using multiple carousels on a single page. Control and indicator elements must have a `data-bs-target` attribute (or `href` for links) that matches the `id` of the `.carousel` element.
 
-You can also add the indicators to the carousel, alongside the controls, too.
+### Indicators
+
+You can add indicators to the carousel, alongside the previous/next controls. The indicators let users jump directly to a particular slide.
 
 {{< example >}}
-<div id="carouselExampleIndicators" class="carousel slide" data-bs-ride="true">
+<div id="carouselExampleIndicators" class="carousel slide">
   <div class="carousel-indicators">
     <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
     <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
@@ -105,12 +85,12 @@ You can also add the indicators to the carousel, alongside the controls, too.
 </div>
 {{< /example >}}
 
-### With captions
+### Captions
 
-Add captions to your slides easily with the `.carousel-caption` element within any `.carousel-item`. They can be easily hidden on smaller viewports, as shown below, with optional [display utilities]({{< docsref "/utilities/display" >}}). We hide them initially with `.d-none` and bring them back on medium-sized devices with `.d-md-block`.
+You can add captions to your slides with the `.carousel-caption` element within any `.carousel-item`. They can be easily hidden on smaller viewports, as shown below, with optional [display utilities]({{< docsref "/utilities/display" >}}). We hide them initially with `.d-none` and bring them back on medium-sized devices with `.d-md-block`.
 
 {{< example >}}
-<div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="false">
+<div id="carouselExampleCaptions" class="carousel slide">
   <div class="carousel-indicators">
     <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
     <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
@@ -155,7 +135,7 @@ Add captions to your slides easily with the `.carousel-caption` element within a
 Add `.carousel-fade` to your carousel to animate slides with a fade transition instead of a slide. Depending on your carousel content (e.g., text only slides), you may want to add `.bg-body` or some custom CSS to the `.carousel-item`s for proper crossfading.
 
 {{< example >}}
-<div id="carouselExampleFade" class="carousel slide carousel-fade" data-bs-ride="carousel">
+<div id="carouselExampleFade" class="carousel slide carousel-fade">
   <div class="carousel-inner">
     <div class="carousel-item active">
       {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="First slide" >}}
@@ -178,6 +158,66 @@ Add `.carousel-fade` to your carousel to animate slides with a fade transition i
 </div>
 {{< /example >}}
 
+## Autoplaying carousels
+
+You can make your carousels autoplay on page load by setting the `ride` option to `carousel`. Autoplaying carousels automatically pause while hovered with the mouse. This behavior can be controlled with the `pause` option. In browsers that support the [Page Visibility API](https://www.w3.org/TR/page-visibility/), the carousel will stop cycling when the webpage is not visible to the user (such as when the browser tab is inactive, or when the browser window is minimized).
+
+{{< callout info >}}
+For accessibility reasons, we recommend avoiding the use of autoplaying carousels. If your page does include an autoplaying carousel, we recommend providing an additional button or control to explicitly pause/stop the carousel.
+
+See [WCAG 2.1 Success Criterion 2.2.2 Pause, Stop, Hide](https://www.w3.org/TR/WCAG21/#pause-stop-hide).
+{{< /callout >}}
+
+{{< example >}}
+<div id="carouselExampleAutoplaying" class="carousel slide" data-bs-ride="carousel">
+  <div class="carousel-inner">
+    <div class="carousel-item active">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="First slide" >}}
+    </div>
+    <div class="carousel-item">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#444" background="#666" text="Second slide" >}}
+    </div>
+    <div class="carousel-item">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
+    </div>
+  </div>
+  <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleAutoplaying" data-bs-slide="prev">
+    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+    <span class="visually-hidden">Previous</span>
+  </button>
+  <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleAutoplaying" data-bs-slide="next">
+    <span class="carousel-control-next-icon" aria-hidden="true"></span>
+    <span class="visually-hidden">Next</span>
+  </button>
+</div>
+{{< /example >}}
+
+When the `ride` option is set to `true`, rather than `carousel`, the carousel won't automatically start to cycle on page load. Instead, it will only start after the first user interaction.
+
+{{< example >}}
+<div id="carouselExampleRide" class="carousel slide" data-bs-ride="true">
+  <div class="carousel-inner">
+    <div class="carousel-item active">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="First slide" >}}
+    </div>
+    <div class="carousel-item">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#444" background="#666" text="Second slide" >}}
+    </div>
+    <div class="carousel-item">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
+    </div>
+  </div>
+  <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleRide" data-bs-slide="prev">
+    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+    <span class="visually-hidden">Previous</span>
+  </button>
+  <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleRide" data-bs-slide="next">
+    <span class="carousel-control-next-icon" aria-hidden="true"></span>
+    <span class="visually-hidden">Next</span>
+  </button>
+</div>
+{{< /example >}}
+
 ### Individual `.carousel-item` interval
 
 Add `data-bs-interval=""` to a `.carousel-item` to change the amount of time to delay between automatically cycling to the next item.
@@ -206,9 +246,29 @@ Add `data-bs-interval=""` to a `.carousel-item` to change the amount of time to
 </div>
 {{< /example >}}
 
-### Disable touch swiping
+### Autoplaying carousels without controls
 
-Carousels support swiping left/right on touchscreen devices to move between slides. This can be disabled using the `data-bs-touch` attribute. The example below also does not include the `data-bs-ride` attribute so it doesn't autoplay.
+Here's a carousel with slides only. Note the presence of the `.d-block` and `.w-100` on carousel images to prevent browser default image alignment.
+
+{{< example >}}
+<div id="carouselExampleSlidesOnly" class="carousel slide" data-bs-ride="carousel">
+  <div class="carousel-inner">
+    <div class="carousel-item active">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="First slide" >}}
+    </div>
+    <div class="carousel-item">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#444" background="#666" text="Second slide" >}}
+    </div>
+    <div class="carousel-item">
+      {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
+    </div>
+  </div>
+</div>
+{{< /example >}}
+
+## Disable touch swiping
+
+Carousels support swiping left/right on touchscreen devices to move between slides. This can be disabled by setting the `touch` option to `false`.
 
 {{< example >}}
 <div id="carouselExampleControlsNoTouching" class="carousel slide" data-bs-touch="false">
@@ -236,10 +296,14 @@ Carousels support swiping left/right on touchscreen devices to move between slid
 
 ## Dark variant
 
-Add `.carousel-dark` to the `.carousel` for darker controls, indicators, and captions. Controls have been inverted from their default white fill with the `filter` CSS property. Captions and controls have additional Sass variables that customize the `color` and `background-color`.
+{{< deprecated-in "5.3.0" >}}
+
+Add `.carousel-dark` to the `.carousel` for darker controls, indicators, and captions. Controls are inverted compared to their default white fill with the `filter` CSS property. Captions and controls have additional Sass variables that customize the `color` and `background-color`.
+
+{{< callout-deprecated-dark-variants "carousel" >}}
 
 {{< example >}}
-<div id="carouselExampleDark" class="carousel carousel-dark slide" data-bs-ride="carousel">
+<div id="carouselExampleDark" class="carousel carousel-dark slide">
   <div class="carousel-indicators">
     <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
     <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="1" aria-label="Slide 2"></button>
@@ -301,8 +365,6 @@ Variables for the [dark carousel](#dark-variant):
 
 Use data attributes to easily control the position of the carousel. `data-bs-slide` accepts the keywords `prev` or `next`, which alters the slide position relative to its current position. Alternatively, use `data-bs-slide-to` to pass a raw slide index to the carousel `data-bs-slide-to="2"`, which shifts the slide position to a particular index beginning with `0`.
 
-The `data-bs-ride="carousel"` attribute is used to mark a carousel as animating starting at page load. If you don't use `data-bs-ride="carousel"` to initialize your carousel, you have to initialize it yourself. **It cannot be used in combination with (redundant and unnecessary) explicit JavaScript initialization of the same carousel.**
-
 ### Via JavaScript
 
 Call carousel manually with:
@@ -331,28 +393,29 @@ const carousel = new bootstrap.Carousel('#myCarousel')
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
-You can create a carousel instance with the carousel constructor, for example, to initialize with additional options and start cycling through items:
+You can create a carousel instance with the carousel constructor, and pass on any additional options. For example, to manually initialize an autoplaying carousel (assuming you're not using the `data-bs-ride="carousel"` attribute in the markup itself) with a specific interval and with touch support disabled, you can use:
 
 ```js
 const myCarouselElement = document.querySelector('#myCarousel')
+
 const carousel = new bootstrap.Carousel(myCarouselElement, {
   interval: 2000,
-  wrap: false
+  touch: false
 })
 ```
 
 {{< bs-table >}}
 | Method | Description |
 | --- | --- |
-| `cycle` | Cycles through the carousel items from left to right. |
+| `cycle` | Starts cycling through the carousel items from left to right. |
 | `dispose` | Destroys an element's carousel. (Removes stored data on the DOM element) |
-| `getInstance` | Static method which allows you to get the carousel instance associated to a DOM element, you can use it like this: `bootstrap.Carousel.getInstance(element)`. |
-| `getOrCreateInstance` | Static method which returns a carousel instance associated to a DOM element or create a new one in case it wasn't initialized. You can use it like this: `bootstrap.Carousel.getOrCreateInstance(element)`. |
+| `getInstance` | Static method which allows you to get the carousel instance associated to a DOM element. You can use it like this: `bootstrap.Carousel.getInstance(element)`. |
+| `getOrCreateInstance` | Static method which returns a carousel instance associated to a DOM element, or creates a new one in case it wasn't initialized. You can use it like this: `bootstrap.Carousel.getOrCreateInstance(element)`. |
 | `next` | Cycles to the next item. **Returns to the caller before the next item has been shown** (e.g., before the `slid.bs.carousel` event occurs). |
-| `nextWhenVisible` | Don't cycle carousel to next when the page isn't visible or the carousel or its parent isn't visible. **Returns to the caller before the target item has been shown**. |
+| `nextWhenVisible` | Don't cycle carousel to next when the page, the carousel, or the carousel's parent aren't visible. **Returns to the caller before the target item has been shown**. |
 | `pause` | Stops the carousel from cycling through items. |
 | `prev` | Cycles to the previous item. **Returns to the caller before the previous item has been shown** (e.g., before the `slid.bs.carousel` event occurs). |
 | `to` | Cycles the carousel to a particular frame (0 based, similar to an array). **Returns to the caller before the target item has been shown** (e.g., before the `slid.bs.carousel` event occurs). |
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/close-button.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/close-button.md
index f4a3ed071..39b80e1cd 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/close-button.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/close-button.md
@@ -22,13 +22,19 @@ Disabled close buttons change their `opacity`. We've also applied `pointer-event
 <button type="button" class="btn-close" disabled aria-label="Close"></button>
 {{< /example >}}
 
-## White variant
+## Dark variant
 
-Change the default `.btn-close` to be white with the `.btn-close-white` class. This class uses the `filter` property to invert the `background-image`.
+{{< callout info >}}
+**Heads up!** As of v5.3.0, the `.btn-close-white` class is deprecated. Instead, use `data-bs-theme="dark"` to change the color mode of the close button.
+{{< /callout >}}
+
+Add `data-bs-theme="dark"` to the `.btn-close`, or to its parent element, to invert the close button. This uses the `filter` property to invert the `background-image` without overriding its value.
 
 {{< example class="bg-dark" >}}
-<button type="button" class="btn-close btn-close-white" aria-label="Close"></button>
-<button type="button" class="btn-close btn-close-white" disabled aria-label="Close"></button>
+<div data-bs-theme="dark">
+  <button type="button" class="btn-close" aria-label="Close"></button>
+  <button type="button" class="btn-close" disabled aria-label="Close"></button>
+</div>
 {{< /example >}}
 
 ## Sass
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/collapse.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/collapse.md
index 21be901c0..95abc536c 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/collapse.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/collapse.md
@@ -11,7 +11,7 @@ toc: true
 The collapse JavaScript plugin is used to show and hide content. Buttons or anchors are used as triggers that are mapped to specific elements you toggle. Collapsing an element will animate the `height` from its current value to `0`. Given how CSS handles animations, you cannot use `padding` on a `.collapse` element. Instead, use the class as an independent wrapping element.
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 ## Example
@@ -22,7 +22,7 @@ Click the buttons below to show and hide another element via class changes:
 - `.collapsing` is applied during transitions
 - `.collapse.show` shows content
 
-Generally, we recommend using a button with the `data-bs-target` attribute. While not recommended from a semantic point of view, you can also use a link with the `href` attribute (and a `role="button"`). In both cases, the `data-bs-toggle="collapse"` is required.
+Generally, we recommend using a `<button>` with the `data-bs-target` attribute. While not recommended from a semantic point of view, you can also use an `<a>` link with the `href` attribute (and a `role="button"`). In both cases, the `data-bs-toggle="collapse"` is required.
 
 {{< example >}}
 <p>
@@ -42,7 +42,7 @@ Generally, we recommend using a button with the `data-bs-target` attribute. Whil
 
 ## Horizontal
 
-The collapse plugin also supports horizontal collapsing. Add the `.collapse-horizontal` modifier class to transition the `width` instead of `height` and set a `width` on the immediate child element. Feel free to write your own custom Sass, use inline styles, or use our [width utilities]({{< docsref "/utilities/sizing" >}}).
+The collapse plugin supports horizontal collapsing. Add the `.collapse-horizontal` modifier class to transition the `width` instead of `height` and set a `width` on the immediate child element. Feel free to write your own custom Sass, use inline styles, or use our [width utilities]({{< docsref "/utilities/sizing" >}}).
 
 {{< callout info >}}
 Please note that while the example below has a `min-height` set to avoid excessive repaints in our docs, this is not explicitly required. **Only the `width` on the child element is required.**
@@ -63,10 +63,10 @@ Please note that while the example below has a `min-height` set to avoid excessi
 </div>
 {{< /example >}}
 
-## Multiple targets
+## Multiple toggles and targets
 
-A `<button>` or `<a>` can show and hide multiple elements by referencing them with a selector in its `href` or `data-bs-target` attribute.
-Multiple `<button>` or `<a>` can show and hide an element if they each reference it with their `href` or `data-bs-target` attribute
+A `<button>` or `<a>` element can show and hide multiple elements by referencing them with a selector in its `data-bs-target` or `href` attribute.
+Conversely, multiple `<button>` or `<a>` elements can show and hide the same element if they each reference it with their `data-bs-target` or `href` attribute.
 
 {{< example >}}
 <p>
@@ -153,7 +153,7 @@ const collapseList = [...collapseElementList].map(collapseEl => new bootstrap.Co
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 Activates your content as a collapsible element. Accepts an optional options `object`.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/dropdowns.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/dropdowns.md
index b58922775..b7dae56ab 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/dropdowns.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/dropdowns.md
@@ -18,15 +18,15 @@ The [<abbr title="Web Accessibility Initiative">WAI</abbr> <abbr title="Accessib
 
 Bootstrap's dropdowns, on the other hand, are designed to be generic and applicable to a variety of situations and markup structures. For instance, it is possible to create dropdowns that contain additional inputs and form controls, such as search fields or login forms. For this reason, Bootstrap does not expect (nor automatically add) any of the `role` and `aria-` attributes required for true <abbr title="Accessible Rich Internet Applications">ARIA</abbr> menus. Authors will have to include these more specific attributes themselves.
 
-However, Bootstrap does add built-in support for most standard keyboard menu interactions, such as the ability to move through individual `.dropdown-item` elements using the cursor keys and close the menu with the <kbd>ESC</kbd> key.
+However, Bootstrap does add built-in support for most standard keyboard menu interactions, such as the ability to move through individual `.dropdown-item` elements using the cursor keys and close the menu with the <kbd>Esc</kbd> key.
 
 ## Examples
 
-Wrap the dropdown's toggle (your button or link) and the dropdown menu within `.dropdown`, or another element that declares `position: relative;`. Dropdowns can be triggered from `<a>` or `<button>` elements to better fit your potential needs. The examples shown here use semantic `<ul>` elements where appropriate, but custom markup is supported.
+Wrap the dropdown's toggle (your button or link) and the dropdown menu within `.dropdown`, or another element that declares `position: relative;`. Ideally, you should use a `<button>` element as the dropdown trigger, but the plugin will work with `<a>` elements as well. The examples shown here use semantic `<ul>` elements where appropriate, but custom markup is supported.
 
 ### Single button
 
-Any single `.btn` can be turned into a dropdown toggle with some markup changes. Here's how you can put them to work with either `<button>` elements:
+Any single `.btn` can be turned into a dropdown toggle with some markup changes. Here's how you can put them to work with `<button>` elements:
 
 {{< example >}}
 <div class="dropdown">
@@ -41,7 +41,7 @@ Any single `.btn` can be turned into a dropdown toggle with some markup changes.
 </div>
 {{< /example >}}
 
-And with `<a>` elements:
+While `<button>` is the recommended control for a dropdown toggle, there might be situations where you have to use an `<a>` element. If you do, we recommend adding a `role="button"` attribute to appropriately convey control's purpose to assistive technologies such as screen readers.
 
 {{< example >}}
 <div class="dropdown">
@@ -349,8 +349,12 @@ Button dropdowns work with buttons of all sizes, including default and split dro
 
 ## Dark dropdowns
 
+{{< deprecated-in "5.3.0" >}}
+
 Opt into darker dropdowns to match a dark navbar or custom style by adding `.dropdown-menu-dark` onto an existing `.dropdown-menu`. No changes are required to the dropdown items.
 
+{{< callout-deprecated-dark-variants "dropdown-menu" >}}
+
 {{< example >}}
 <div class="dropdown">
   <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
@@ -378,9 +382,9 @@ And putting it to use in a navbar:
     <div class="collapse navbar-collapse" id="navbarNavDarkDropdown">
       <ul class="navbar-nav">
         <li class="nav-item dropdown">
-          <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
+          <button class="btn btn-dark dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
             Dropdown
-          </a>
+          </button>
           <ul class="dropdown-menu dropdown-menu-dark">
             <li><a class="dropdown-item" href="#">Action</a></li>
             <li><a class="dropdown-item" href="#">Another action</a></li>
@@ -956,7 +960,7 @@ By default, the dropdown menu is closed when clicking inside or outside the drop
 
 <div class="btn-group">
   <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" data-bs-auto-close="inside" aria-expanded="false">
-    Clickable outside
+    Clickable inside
   </button>
   <ul class="dropdown-menu">
     <li><a class="dropdown-item" href="#">Menu item</a></li>
@@ -967,7 +971,7 @@ By default, the dropdown menu is closed when clicking inside or outside the drop
 
 <div class="btn-group">
   <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
-    Clickable inside
+    Clickable outside
   </button>
   <ul class="dropdown-menu">
     <li><a class="dropdown-item" href="#">Menu item</a></li>
@@ -998,6 +1002,12 @@ As part of Bootstrap's evolving CSS variables approach, dropdowns now use local
 
 {{< scss-docs name="dropdown-css-vars" file="scss/_dropdown.scss" >}}
 
+{{< callout info >}}
+Dropdown items include at least one variable that is not set on `.dropdown`. This allows you to provide a new value while Bootstrap defaults to a fallback value.
+
+- `--bs-dropdown-item-border-radius`
+{{< /callout >}}
+
 Customization through CSS variables can be seen on the `.dropdown-menu-dark` class where we override specific values without adding duplicate CSS selectors.
 
 {{< scss-docs name="dropdown-dark-css-vars" file="scss/_dropdown.scss" >}}
@@ -1069,7 +1079,7 @@ Regardless of whether you call your dropdown via JavaScript or instead use the d
 {{< bs-table "table" >}}
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| `autoClose` | boolean, string | `true` | Configure the auto close behavior of the dropdown: <ul class="my-2"><li>`true` - the dropdown will be closed by clicking outside or inside the dropdown menu.</li><li>`false` - the dropdown will be closed by clicking the toggle button and manually calling `hide` or `toggle` method. (Also will not be closed by pressing <kbd>esc</kbd> key)</li><li>`'inside'` - the dropdown will be closed (only) by clicking inside the dropdown menu.</li> <li>`'outside'` - the dropdown will be closed (only) by clicking outside the dropdown menu.</li></ul> Note: the dropdown can always be closed with the <kbd>ESC</kbd> key. |
+| `autoClose` | boolean, string | `true` | Configure the auto close behavior of the dropdown: <ul class="my-2"><li>`true` - the dropdown will be closed by clicking outside or inside the dropdown menu.</li><li>`false` - the dropdown will be closed by clicking the toggle button and manually calling `hide` or `toggle` method. (Also will not be closed by pressing <kbd>Esc</kbd> key)</li><li>`'inside'` - the dropdown will be closed (only) by clicking inside the dropdown menu.</li> <li>`'outside'` - the dropdown will be closed (only) by clicking outside the dropdown menu.</li></ul> Note: the dropdown can always be closed with the <kbd>Esc</kbd> key. |
 | `boundary` | string, element | `'clippingParents'` | Overflow constraint boundary of the dropdown menu (applies only to Popper's preventOverflow modifier). By default it's `clippingParents` and can accept an HTMLElement reference (via JavaScript only). For more information refer to Popper's [detectOverflow docs](https://popper.js.org/docs/v2/utils/detect-overflow/#boundary). |
 | `display` | string | `'dynamic'` | By default, we use Popper for dynamic positioning. Disable this with `static`. |
 | `offset` | array, string, function | `[0, 2]` | Offset of the dropdown relative to its target. You can pass a string in data attributes with comma separated values like: `data-bs-offset="10,20"`. When a function is used to determine the offset, it is called with an object containing the popper placement, the reference, and popper rects as its first argument. The triggering element DOM node is passed as the second argument. The function must return an array with two numbers: [skidding](https://popper.js.org/docs/v2/modifiers/offset/#skidding-1), [distance](https://popper.js.org/docs/v2/modifiers/offset/#distance-1). For more information refer to Popper's [offset docs](https://popper.js.org/docs/v2/modifiers/offset/#options). |
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/list-group.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/list-group.md
index 7804c7406..daa7a8818 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/list-group.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/list-group.md
@@ -154,7 +154,11 @@ Add `.list-group-horizontal` to change the layout of list group items from verti
 {{< /list-group.inline >}}
 {{< /example >}}
 
-## Contextual classes
+## Variants
+
+{{< callout info >}}
+**Heads up!** As of v5.3.0, the `list-group-item-variant()` Sass mixin is deprecated. List group item variants now have their CSS variables overridden in [the Sass loop](#sass-loop).
+{{< /callout >}}
 
 Use contextual classes to style list items with a stateful background and color.
 
@@ -169,7 +173,9 @@ Use contextual classes to style list items with a stateful background and color.
 </ul>
 {{< /example >}}
 
-Contextual classes also work with `.list-group-item-action`. Note the addition of the hover styles here not present in the previous example. Also supported is the `.active` state; apply it to indicate an active selection on a contextual list group item.
+### For links and buttons
+
+Contextual classes also work with `.list-group-item-action` for `<a>` and `<button>` elements. Note the addition of the hover styles here not present in the previous example. Also supported is the `.active` state; apply it to indicate an active selection on a contextual list group item.
 
 {{< example >}}
 <div class="list-group">
@@ -183,7 +189,7 @@ Contextual classes also work with `.list-group-item-action`. Note the addition o
 {{< /example >}}
 
 {{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
 {{< /callout >}}
 
 ## With badges
@@ -311,15 +317,15 @@ As part of Bootstrap's evolving CSS variables approach, list groups now use loca
 
 {{< scss-docs name="list-group-variables" file="scss/_variables.scss" >}}
 
-### Mixins
+### Sass mixins
 
-Used in combination with `$theme-colors` to generate the [contextual variant classes](#contextual-classes) for `.list-group-item`s.
+Used in combination with `$theme-colors` to generate the [contextual variant classes](#variants) for `.list-group-item`s.
 
 {{< scss-docs name="list-group-mixin" file="scss/mixins/_list-group.scss" >}}
 
-### Loop
+### Sass loop
 
-Loop that generates the modifier classes with the `list-group-item-variant()` mixin.
+Loop that generates the modifier classes with an overriding of CSS variables.
 
 {{< scss-docs name="list-group-modifiers" file="scss/_list-group.scss" >}}
 
@@ -443,7 +449,7 @@ To make tabs panel fade in, add `.fade` to each `.tab-pane`. The first tab pane
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 Activates your content as a tab element.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/modal.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/modal.md
index ed31b7374..09ae0653d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/modal.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/modal.md
@@ -27,7 +27,7 @@ myModal.addEventListener('shown.bs.modal', () => {
 ```
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 Keep reading for demos and usage guidelines.
@@ -38,7 +38,7 @@ Keep reading for demos and usage guidelines.
 
 Below is a _static_ modal example (meaning its `position` and `display` have been overridden). Included are the modal header, modal body (required for `padding`), and modal footer (optional). We ask that you include modal headers with dismiss actions whenever possible, or provide another explicit dismiss action.
 
-<div class="bd-example bg-light">
+<div class="bd-example bg-body-tertiary">
   <div class="modal position-static d-block" tabindex="-1">
     <div class="modal-dialog">
       <div class="modal-content">
@@ -329,7 +329,7 @@ Add `.modal-dialog-centered` to `.modal-dialog` to vertically center the modal.
       </div>
       <div class="modal-body">
         <h2 class="fs-5">Popover in a modal</h2>
-        <p>This <a href="#" role="button" class="btn btn-secondary" data-bs-toggle="popover" title="Popover title" data-bs-content="Popover body content is set in this attribute." data-bs-container="#exampleModalPopovers">button</a> triggers a popover on click.</p>
+        <p>This <button class="btn btn-secondary" data-bs-toggle="popover" title="Popover title" data-bs-content="Popover body content is set in this attribute." data-bs-container="#exampleModalPopovers">button</button> triggers a popover on click.</p>
         <hr>
         <h2 class="fs-5">Tooltips in a modal</h2>
         <p><a href="#" data-bs-toggle="tooltip" title="Tooltip" data-bs-container="#exampleModalPopovers">This link</a> and <a href="#" data-bs-toggle="tooltip" title="Tooltip" data-bs-container="#exampleModalPopovers">that link</a> have tooltips on hover.</p>
@@ -351,7 +351,7 @@ Add `.modal-dialog-centered` to `.modal-dialog` to vertically center the modal.
 ```html
 <div class="modal-body">
   <h2 class="fs-5">Popover in a modal</h2>
-  <p>This <a href="#" role="button" class="btn btn-secondary" data-bs-toggle="popover" title="Popover title" data-bs-content="Popover body content is set in this attribute.">button</a> triggers a popover on click.</p>
+  <p>This <button class="btn btn-secondary" data-bs-toggle="popover" title="Popover title" data-bs-content="Popover body content is set in this attribute.">button</button> triggers a popover on click.</p>
   <hr>
   <h2 class="fs-5">Tooltips in a modal</h2>
   <p><a href="#" data-bs-toggle="tooltip" title="Tooltip">This link</a> and <a href="#" data-bs-toggle="tooltip" title="Tooltip">that link</a> have tooltips on hover.</p>
@@ -537,7 +537,7 @@ Toggle between multiple modals with some clever placement of the `data-bs-target
     </div>
   </div>
 </div>
-<a class="btn btn-primary" data-bs-toggle="modal" href="#exampleModalToggle" role="button">Open first modal</a>
+<button class="btn btn-primary" data-bs-target="#exampleModalToggle" data-bs-toggle="modal">Open first modal</button>
 {{< /example >}}
 
 ### Change animation
@@ -841,7 +841,7 @@ const myModalAlternative = new bootstrap.Modal('#myModal', options)
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 #### Passing options
@@ -858,8 +858,8 @@ const myModal = new bootstrap.Modal('#myModal', {
 | Method | Description |
 | --- | --- |
 | `dispose` | Destroys an element's modal. (Removes stored data on the DOM element) |
-| `getInstance` | *Static* method which allows you to get the modal instance associated with a DOM element. |
-| `getOrCreateInstance` | *Static* method which allows you to get the modal instance associated with a DOM element, or create a new one in case it wasn't initialized. |
+| `getInstance` | _Static_ method which allows you to get the modal instance associated with a DOM element. |
+| `getOrCreateInstance` | _Static_ method which allows you to get the modal instance associated with a DOM element, or create a new one in case it wasn't initialized. |
 | `handleUpdate` | Manually readjust the modal's position if the height of a modal changes while it is open (i.e. in case a scrollbar appears). |
 | `hide` | Manually hides a modal. **Returns to the caller before the modal has actually been hidden** (i.e. before the `hidden.bs.modal` event occurs). |
 | `show` | Manually opens a modal. **Returns to the caller before the modal has actually been shown** (i.e. before the `shown.bs.modal` event occurs). Also, you can pass a DOM element as an argument that can be received in the modal events (as the `relatedTarget` property). (i.e. `const modalToggle = document.getElementById('toggleMyModal'); myModal.show(modalToggle)`. |
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/navbar.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/navbar.md
index 7cbc4e2c1..3afd89cd5 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/navbar.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/navbar.md
@@ -19,7 +19,7 @@ Here's what you need to know before getting started with the navbar:
 - **New in v5.2.0:** Navbars can be themed with CSS variables that are scoped to the `.navbar` base class. `.navbar-light` has been deprecated and `.navbar-dark` has been rewritten to override CSS variables instead of adding additional styles.
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 ## Supported content
@@ -37,7 +37,7 @@ Navbars come with built-in support for a handful of sub-components. Choose from
 Here's an example of all the sub-components included in a responsive light-themed navbar that automatically collapses at the `lg` (large) breakpoint.
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
@@ -75,7 +75,7 @@ Here's an example of all the sub-components included in a responsive light-theme
 </nav>
 {{< /example >}}
 
-This example uses [background]({{< docsref "/utilities/background" >}}) (`bg-light`) and [spacing]({{< docsref "/utilities/spacing" >}}) (`me-auto`, `mb-2`, `mb-lg-0`, `me-2`) utility classes.
+This example uses [background]({{< docsref "/utilities/background" >}}) (`bg-body-tertiary`) and [spacing]({{< docsref "/utilities/spacing" >}}) (`me-auto`, `mb-2`, `mb-lg-0`, `me-2`) utility classes.
 
 ### Brand
 
@@ -87,14 +87,14 @@ Add your text within an element with the `.navbar-brand` class.
 
 {{< example >}}
 <!-- As a link -->
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar</a>
   </div>
 </nav>
 
 <!-- As a heading -->
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container-fluid">
     <span class="navbar-brand mb-0 h1">Navbar</span>
   </div>
@@ -106,7 +106,7 @@ Add your text within an element with the `.navbar-brand` class.
 You can replace the text within the `.navbar-brand` with an `<img>`.
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container">
     <a class="navbar-brand" href="#">
       <img src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo.svg" alt="Bootstrap" width="30" height="24">
@@ -120,7 +120,7 @@ You can replace the text within the `.navbar-brand` with an `<img>`.
 You can also make use of some additional utilities to add an image and text at the same time. Note the addition of `.d-inline-block` and `.align-text-top` on the `<img>`.
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">
       <img src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo.svg" alt="Logo" width="30" height="24" class="d-inline-block align-text-top">
@@ -139,7 +139,7 @@ Add the `.active` class on `.nav-link` to indicate the current page.
 Please note that you should also add the `aria-current` attribute on the active `.nav-link`.
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
@@ -168,7 +168,7 @@ Please note that you should also add the `aria-current` attribute on the active
 And because we use classes for our navs, you can avoid the list-based approach entirely if you like.
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
@@ -189,7 +189,7 @@ And because we use classes for our navs, you can avoid the list-based approach e
 You can also use dropdowns in your navbar. Dropdown menus require a wrapping element for positioning, so be sure to use separate and nested elements for `.nav-item` and `.nav-link` as shown below.
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
@@ -227,7 +227,7 @@ You can also use dropdowns in your navbar. Dropdown menus require a wrapping ele
 Place various form controls and components within a navbar:
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container-fluid">
     <form class="d-flex" role="search">
       <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
@@ -240,7 +240,7 @@ Place various form controls and components within a navbar:
 Immediate child elements of `.navbar` use flex layout and will default to `justify-content: space-between`. Use additional [flex utilities]({{< docsref "/utilities/flex" >}}) as needed to adjust this behavior.
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand">Navbar</a>
     <form class="d-flex" role="search">
@@ -254,7 +254,7 @@ Immediate child elements of `.navbar` use flex layout and will default to `justi
 Input groups work, too. If your navbar is an entire form, or mostly a form, you can use the `<form>` element as the container and save some HTML.
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <form class="container-fluid">
     <div class="input-group">
       <span class="input-group-text" id="basic-addon1">@</span>
@@ -267,7 +267,7 @@ Input groups work, too. If your navbar is an entire form, or mostly a form, you
 Various buttons are supported as part of these navbar forms, too. This is also a great reminder that vertical alignment utilities can be used to align different sized elements.
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <form class="container-fluid justify-content-start">
     <button class="btn btn-outline-success me-2" type="button">Main button</button>
     <button class="btn btn-sm btn-outline-secondary" type="button">Smaller button</button>
@@ -280,7 +280,7 @@ Various buttons are supported as part of these navbar forms, too. This is also a
 Navbars may contain bits of text with the help of `.navbar-text`. This class adjusts vertical alignment and horizontal spacing for strings of text.
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container-fluid">
     <span class="navbar-text">
       Navbar text with an inline element
@@ -292,7 +292,7 @@ Navbars may contain bits of text with the help of `.navbar-text`. This class adj
 Mix and match with other components and utilities as needed.
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar w/ text</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
@@ -321,13 +321,17 @@ Mix and match with other components and utilities as needed.
 ## Color schemes
 
 {{< callout warning >}}
-**New in v5.2.0:** Navbar theming is now powered by CSS variables and `.navbar-light` has been deprecated. CSS variables are applied to `.navbar`, defaulting to the "light" appearance, and can be overridden with `.navbar-dark`.
+**New dark navbars in v5.3.0 —** We've deprecated `.navbar-dark` in favor of the new `data-bs-theme="dark"`. Add `data-bs-theme="dark"` to the `.navbar` to enable a component-specific color mode. [Learn more about our color modes.]({{< docsref "/customize/color-modes" >}})
+
+---
+
+**New in v5.2.0  —** Navbar theming is now powered by CSS variables and `.navbar-light` has been deprecated. CSS variables are applied to `.navbar`, defaulting to the "light" appearance, and can be overridden with `.navbar-dark`.
 {{< /callout >}}
 
 Navbar themes are easier than ever thanks to Bootstrap's combination of Sass and CSS variables. The default is our "light navbar" for use with light background colors, but you can also apply `.navbar-dark` for dark background colors. Then, customize with `.bg-*` utilities.
 
 <div class="bd-example">
-  <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+  <nav class="navbar navbar-expand-lg bg-body-secondary" data-bs-theme="dark">
     <div class="container-fluid">
       <a class="navbar-brand" href="#">Navbar</a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarColor01" aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation">
@@ -356,7 +360,7 @@ Navbar themes are easier than ever thanks to Bootstrap's combination of Sass and
     </div>
   </nav>
 
-  <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
+  <nav class="navbar navbar-expand-lg bg-primary" data-bs-theme="dark">
     <div class="container-fluid">
       <a class="navbar-brand" href="#">Navbar</a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarColor02" aria-controls="navbarColor02" aria-expanded="false" aria-label="Toggle navigation">
@@ -385,7 +389,7 @@ Navbar themes are easier than ever thanks to Bootstrap's combination of Sass and
     </div>
   </nav>
 
-  <nav class="navbar navbar-expand-lg" style="background-color: #e3f2fd;">
+  <nav class="navbar navbar-expand-lg" style="background-color: #e3f2fd;" data-bs-theme="light">
     <div class="container-fluid">
       <a class="navbar-brand" href="#">Navbar</a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarColor03" aria-controls="navbarColor03" aria-expanded="false" aria-label="Toggle navigation">
@@ -416,11 +420,11 @@ Navbar themes are easier than ever thanks to Bootstrap's combination of Sass and
 </div>
 
 ```html
-<nav class="navbar navbar-dark bg-dark">
+<nav class="navbar bg-dark" data-bs-theme="dark">
   <!-- Navbar content -->
 </nav>
 
-<nav class="navbar navbar-dark bg-primary">
+<nav class="navbar bg-primary" data-bs-theme="dark">
   <!-- Navbar content -->
 </nav>
 
@@ -435,7 +439,7 @@ Although it's not required, you can wrap a navbar in a `.container` to center it
 
 {{< example >}}
 <div class="container">
-  <nav class="navbar navbar-expand-lg bg-light">
+  <nav class="navbar navbar-expand-lg bg-body-tertiary">
     <div class="container-fluid">
       <a class="navbar-brand" href="#">Navbar</a>
     </div>
@@ -446,7 +450,7 @@ Although it's not required, you can wrap a navbar in a `.container` to center it
 Use any of the responsive containers to change how wide the content in your navbar is presented.
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-md">
     <a class="navbar-brand" href="#">Navbar</a>
   </div>
@@ -460,7 +464,7 @@ Use our [position utilities]({{< docsref "/utilities/position" >}}) to place nav
 Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow of the DOM and may require custom CSS (e.g., `padding-top` on the `<body>`) to prevent overlap with other elements.
 
 {{< example >}}
-<nav class="navbar bg-light">
+<nav class="navbar bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Default</a>
   </div>
@@ -468,7 +472,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
 {{< /example >}}
 
 {{< example >}}
-<nav class="navbar fixed-top bg-light">
+<nav class="navbar fixed-top bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Fixed top</a>
   </div>
@@ -476,7 +480,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
 {{< /example >}}
 
 {{< example >}}
-<nav class="navbar fixed-bottom bg-light">
+<nav class="navbar fixed-bottom bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Fixed bottom</a>
   </div>
@@ -484,7 +488,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
 {{< /example >}}
 
 {{< example >}}
-<nav class="navbar sticky-top bg-light">
+<nav class="navbar sticky-top bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Sticky top</a>
   </div>
@@ -492,7 +496,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
 {{< /example >}}
 
 {{< example >}}
-<nav class="navbar sticky-bottom bg-light">
+<nav class="navbar sticky-bottom bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Sticky bottom</a>
   </div>
@@ -508,7 +512,7 @@ Please note that this behavior comes with a potential drawback of `overflow`—w
 Here's an example navbar using `.navbar-nav-scroll` with `style="--bs-scroll-height: 100px;"`, with some extra margin utilities for optimum spacing.
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar scroll</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarScroll" aria-controls="navbarScroll" aria-expanded="false" aria-label="Toggle navigation">
@@ -559,7 +563,7 @@ Navbar togglers are left-aligned by default, but should they follow a sibling el
 With no `.navbar-brand` shown at the smallest breakpoint:
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
@@ -589,7 +593,7 @@ With no `.navbar-brand` shown at the smallest breakpoint:
 With a brand name shown on the left and toggler on the right:
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Navbar</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
@@ -619,7 +623,7 @@ With a brand name shown on the left and toggler on the right:
 With a toggler on the left and brand name on the right:
 
 {{< example >}}
-<nav class="navbar navbar-expand-lg bg-light">
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
   <div class="container-fluid">
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
@@ -675,7 +679,7 @@ Transform your expanding and collapsing navbar into an offcanvas drawer with the
 In the example below, to create an offcanvas navbar that is always collapsed across all breakpoints, omit the `.navbar-expand-*` class entirely.
 
 {{< example >}}
-<nav class="navbar bg-light fixed-top">
+<nav class="navbar bg-body-tertiary fixed-top">
   <div class="container-fluid">
     <a class="navbar-brand" href="#">Offcanvas navbar</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasNavbar" aria-controls="offcanvasNavbar">
@@ -721,7 +725,7 @@ In the example below, to create an offcanvas navbar that is always collapsed acr
 To create an offcanvas navbar that expands into a normal navbar at a specific breakpoint like `lg`, use `.navbar-expand-lg`.
 
 ```html
-<nav class="navbar navbar-expand-lg bg-light fixed-top">
+<nav class="navbar navbar-expand-lg bg-body-tertiary fixed-top">
   <a class="navbar-brand" href="#">Offcanvas navbar</a>
   <button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#navbarOffcanvasLg" aria-controls="navbarOffcanvasLg">
     <span class="navbar-toggler-icon"></span>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/navs-tabs.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/navs-tabs.md
index 1748dd1bb..57c47e0cb 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/navs-tabs.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/navs-tabs.md
@@ -3,7 +3,7 @@ layout: docs
 title: Navs and tabs
 description: Documentation and examples for how to use Bootstrap's included navigation components.
 group: components
-aliases: "/docs/5.2/components/navs/"
+aliases: "/docs/5.3/components/navs/"
 toc: true
 ---
 
@@ -622,7 +622,7 @@ To make tabs fade in, add `.fade` to each `.tab-pane`. The first tab pane must a
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 Activates your content as a tab element.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/offcanvas.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/offcanvas.md
index c4290adf2..ee1a4c4d8 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/offcanvas.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/offcanvas.md
@@ -11,14 +11,14 @@ toc: true
 Offcanvas is a sidebar component that can be toggled via JavaScript to appear from the left, right, top, or bottom edge of the viewport. Buttons or anchors are used as triggers that are attached to specific elements you toggle, and `data` attributes are used to invoke our JavaScript.
 
 - Offcanvas shares some of the same JavaScript code as modals. Conceptually, they are quite similar, but they are separate plugins.
-- Similarly, some [source Sass](#sass) variables for offcanvas's styles and dimensions are inherited from the modal's variables.
+- Similarly, some [source Sass](#sass-variables) variables for offcanvas's styles and dimensions are inherited from the modal's variables.
 - When shown, offcanvas includes a default backdrop that can be clicked to hide the offcanvas.
 - Similar to modals, only one offcanvas can be shown at a time.
 
 **Heads up!** Given how CSS handles animations, you cannot use `margin` or `translate` on an `.offcanvas` element. Instead, use the class as an independent wrapping element.
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 ## Examples
@@ -27,7 +27,7 @@ Offcanvas is a sidebar component that can be toggled via JavaScript to appear fr
 
 Below is an offcanvas example that is shown by default (via `.show` on `.offcanvas`). Offcanvas includes support for a header with a close button and an optional body class for some initial `padding`. We suggest that you include offcanvas headers with dismiss actions whenever possible, or provide an explicit dismiss action.
 
-{{< example class="bd-example-offcanvas p-0 bg-light overflow-hidden" >}}
+{{< example class="bd-example-offcanvas p-0 bg-body-tertiary overflow-hidden" >}}
 <div class="offcanvas offcanvas-start show" tabindex="-1" id="offcanvas" aria-labelledby="offcanvasLabel">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title" id="offcanvasLabel">Offcanvas</h5>
@@ -143,7 +143,7 @@ When backdrop is set to static, the offcanvas will not close when clicking outsi
 
 Change the appearance of offcanvases with utilities to better match them to different contexts like dark navbars. Here we add `.text-bg-dark` to the `.offcanvas` and `.btn-close-white` to `.btn-close` for proper styling with a dark offcanvas. If you have dropdowns within, consider also adding `.dropdown-menu-dark` to `.dropdown-menu`.
 
-{{< example class="bd-example-offcanvas p-0 bg-light overflow-hidden" >}}
+{{< example class="bd-example-offcanvas p-0 bg-body-secondary overflow-hidden" >}}
 <div class="offcanvas offcanvas-start show text-bg-dark" tabindex="-1" id="offcanvasDark" aria-labelledby="offcanvasDarkLabel">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title" id="offcanvasDarkLabel">Offcanvas</h5>
@@ -310,7 +310,7 @@ const offcanvasList = [...offcanvasElementList].map(offcanvasEl => new bootstrap
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 Activates your content as an offcanvas element. Accepts an optional options `object`.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/pagination.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/pagination.md
index 725140576..725140576 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/pagination.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/pagination.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/placeholders.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/placeholders.md
index 4de405756..5ebaab3aa 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/placeholders.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/placeholders.md
@@ -126,7 +126,7 @@ The size of `.placeholder`s are based on the typographic style of the parent ele
 
 ### Animation
 
-Animate placeholders with `.placeholder-glow` or `.placeholder-wave` to better convey the perception of something being _actively_ loaded.
+Animate placeholders with `.placeholder-glow` or `.placeholder-wave` to better convey the perception of something being *actively* loaded.
 
 {{< example >}}
 <p class="placeholder-glow">
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/popovers.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/popovers.md
index 9726c3034..f86404382 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/popovers.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/popovers.md
@@ -22,11 +22,11 @@ Things to know when using the popover plugin:
 - Popovers can be triggered thanks to an element inside a shadow DOM.
 
 {{< callout info >}}
-{{< partial "callout-info-sanitizer.md" >}}
+{{< partial "callouts/info-sanitizer.md" >}}
 {{< /callout >}}
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 Keep reading to see how popovers work with some examples.
@@ -47,7 +47,7 @@ const popoverList = [...popoverTriggerList].map(popoverTriggerEl => new bootstra
 We use JavaScript similar to the snippet above to render the following live popover. Titles are set via `data-bs-title` and body content is set via `data-bs-content`.
 
 {{< callout warning >}}
-{{< partial "callout-warning-data-bs-title-vs-title.md" >}}
+{{< partial "callouts/warning-data-bs-title-vs-title.md" >}}
 {{< /callout >}}
 
 {{< example stackblitz_add_js="true" >}}
@@ -171,7 +171,7 @@ To allow keyboard users to activate your popovers, you should only add them to H
 
 While you can insert rich, structured HTML in popovers with the `html` option, we strongly recommend that you avoid adding an excessive amount of content. The way popovers currently work is that, once displayed, their content is tied to the trigger element with the `aria-describedby` attribute. As a result, the entirety of the popover's content will be announced to assistive technology users as one long, uninterrupted stream.
 
-Additionally, while it is possible to also include interactive controls (such as form elements or links) in your popover (by adding these elements to the `allowList` of allowed attributes and tags), be aware that currently the popover does not manage keyboard focus order. When a keyboard user opens a popover, focus remains on the triggering element, and as the popover usually does not immediately follow the trigger in the document's structure, there is no guarantee that moving forward/pressing <kbd>TAB</kbd> will move a keyboard user into the popover itself. In short, simply adding interactive controls to a popover is likely to make these controls unreachable/unusable for keyboard users and users of assistive technologies, or at the very least make for an illogical overall focus order. In these cases, consider using a modal dialog instead.
+Additionally, while it is possible to also include interactive controls (such as form elements or links) in your popover (by adding these elements to the `allowList` of allowed attributes and tags), be aware that currently the popover does not manage keyboard focus order. When a keyboard user opens a popover, focus remains on the triggering element, and as the popover usually does not immediately follow the trigger in the document's structure, there is no guarantee that moving forward/pressing <kbd>Tab</kbd> will move a keyboard user into the popover itself. In short, simply adding interactive controls to a popover is likely to make these controls unreachable/unusable for keyboard users and users of assistive technologies, or at the very least make for an illogical overall focus order. In these cases, consider using a modal dialog instead.
 {{< /callout >}}
 
 ### Options
@@ -228,7 +228,7 @@ const popover = new bootstrap.Popover(element, {
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 {{< bs-table "table" >}}
@@ -238,7 +238,7 @@ const popover = new bootstrap.Popover(element, {
 | `dispose` | Hides and destroys an element's popover (Removes stored data on the DOM element). Popovers that use delegation (which are created using [the `selector` option](#options)) cannot be individually destroyed on descendant trigger elements. |
 | `enable` | Gives an element's popover the ability to be shown. **Popovers are enabled by default.** |
 | `getInstance` | _Static_ method which allows you to get the popover instance associated with a DOM element. |
-| `getOrCreateInstance` | *Static* method which allows you to get the popover instance associated with a DOM element, or create a new one in case it wasn't initialized. |
+| `getOrCreateInstance` | _Static_ method which allows you to get the popover instance associated with a DOM element, or create a new one in case it wasn't initialized. |
 | `hide` | Hides an element's popover. **Returns to the caller before the popover has actually been hidden** (i.e. before the `hidden.bs.popover` event occurs). This is considered a "manual" triggering of the popover. |
 | `setContent` | Gives a way to change the popover's content after its initialization. |
 | `show` | Reveals an element's popover. **Returns to the caller before the popover has actually been shown** (i.e. before the `shown.bs.popover` event occurs). This is considered a "manual" triggering of the popover. Popovers whose title and content are both zero-length are never displayed. |
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/components/progress.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/progress.md
new file mode 100644
index 000000000..c441f13c8
--- /dev/null
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/progress.md
@@ -0,0 +1,169 @@
+---
+layout: docs
+title: Progress
+description: Documentation and examples for using Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels.
+group: components
+toc: true
+---
+
+{{< callout info >}}
+**New markup in v5.3.0 —** We've deprecated the previous HTML structure for progress bars and replaced it with a more accessible one. The previous structure will continue to work until v6. [See what's changed in our migration guide.]({{< docsref "/migration#improved-markup-for-progress-bars" >}})
+{{< /callout >}}
+
+## How it works
+
+Progress components are built with two HTML elements, some CSS to set the width, and a few attributes. We don't use [the HTML5 `<progress>` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress), ensuring you can stack progress bars, animate them, and place text labels over them.
+
+- We use the `.progress` as a wrapper to indicate the max value of the progress bar.
+- The `.progress` wrapper also requires a `role="progress"` and `aria` attributes to make it accessible, including an accessible name (using `aria-label`, `aria-labelledby`, or similar).
+- We use the inner `.progress-bar` purely for the visual bar and label.
+- The `.progress-bar` requires an inline style, utility class, or custom CSS to set its width.
+- We provide a special `.progress-stacked` class to create multiple/stacked progress bars.
+
+Put that all together, and you have the following examples.
+
+{{< example >}}
+<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar" style="width: 0%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar" style="width: 25%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar" style="width: 50%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar" style="width: 75%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar" style="width: 100%"></div>
+</div>
+{{< /example >}}
+
+## Bar sizing
+
+### Width
+
+Bootstrap provides a handful of [utilities for setting width]({{< docsref "/utilities/sizing" >}}). Depending on your needs, these may help with quickly configuring the width of the `.progress-bar`.
+
+{{< example >}}
+<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar w-75"></div>
+</div>
+{{< /example >}}
+
+### Height
+
+You only set a `height` value on the `.progress` container, so if you change that value, the inner `.progress-bar` will automatically resize accordingly.
+
+{{< example >}}
+<div class="progress"  role="progressbar" aria-label="Example 1px high" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" style="height: 1px">
+  <div class="progress-bar" style="width: 25%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Example 20px high" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" style="height: 20px">
+  <div class="progress-bar" style="width: 25%"></div>
+</div>
+{{< /example >}}
+
+## Labels
+
+Add labels to your progress bars by placing text within the `.progress-bar`.
+
+{{< example >}}
+<div class="progress" role="progressbar" aria-label="Example with label" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar" style="width: 25%">25%</div>
+</div>
+{{< /example >}}
+
+## Backgrounds
+
+Use background utility classes to change the appearance of individual progress bars.
+
+{{< example >}}
+<div class="progress" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar bg-success" style="width: 25%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Info example" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar bg-info" style="width: 50%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Warning example" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar bg-warning" style="width: 75%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Danger example" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar bg-danger" style="width: 100%"></div>
+</div>
+{{< /example >}}
+
+{{< callout info >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
+{{< /callout >}}
+
+## Multiple bars
+
+You can include multiple progress components inside a container with `.progress-stacked` to create a single stacked progress bar. Note that in this case, the styling to set the visual width of the progress bar *must* be applied to the `.progress` elements, rather than the `.progress-bar`s.
+
+{{< example >}}
+<div class="progress-stacked">
+  <div class="progress" role="progressbar" aria-label="Segment one" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100" style="width: 15%">
+    <div class="progress-bar"></div>
+  </div>
+  <div class="progress" role="progressbar" aria-label="Segment two" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100" style="width: 30%">
+    <div class="progress-bar bg-success"></div>
+  </div>
+  <div class="progress" role="progressbar" aria-label="Segment three" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
+    <div class="progress-bar bg-info"></div>
+  </div>
+</div>
+{{< /example >}}
+
+## Striped
+
+Add `.progress-bar-striped` to any `.progress-bar` to apply a stripe via CSS gradient over the progress bar's background color.
+
+{{< example >}}
+<div class="progress" role="progressbar" aria-label="Default striped example" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar progress-bar-striped" style="width: 10%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Success striped example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar progress-bar-striped bg-success" style="width: 25%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Info striped example" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar progress-bar-striped bg-info" style="width: 50%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Warning striped example" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar progress-bar-striped bg-warning" style="width: 75%"></div>
+</div>
+<div class="progress" role="progressbar" aria-label="Danger striped example" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar progress-bar-striped bg-danger" style="width: 100%"></div>
+</div>
+{{< /example >}}
+
+## Animated stripes
+
+The striped gradient can also be animated. Add `.progress-bar-animated` to `.progress-bar` to animate the stripes right to left via CSS3 animations.
+
+{{< example >}}
+<div class="progress" role="progressbar" aria-label="Animated striped example" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar progress-bar-striped progress-bar-animated" style="width: 75%"></div>
+</div>
+{{< /example >}}
+
+## CSS
+
+### Variables
+
+{{< added-in "5.2.0" >}}
+
+As part of Bootstrap's evolving CSS variables approach, progress bars now use local CSS variables on `.progress` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too.
+
+{{< scss-docs name="progress-css-vars" file="scss/_progress.scss" >}}
+
+### Sass variables
+
+{{< scss-docs name="progress-variables" file="scss/_variables.scss" >}}
+
+### Keyframes
+
+Used for creating the CSS animations for `.progress-bar-animated`. Included in `scss/_progress-bar.scss`.
+
+{{< scss-docs name="progress-keyframes" file="scss/_progress.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/scrollspy.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/scrollspy.md
index 53e3fa0d3..4bb5978f3 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/scrollspy.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/scrollspy.md
@@ -25,7 +25,7 @@ Scrollspy toggles the `.active` class on anchor (`<a>`) elements when the elemen
 Scroll the area below the navbar and watch the active class change. Open the dropdown menu and watch the dropdown items be highlighted as well.
 
 <div class="bd-example">
-  <nav id="navbar-example2" class="navbar bg-light px-3 mb-3">
+  <nav id="navbar-example2" class="navbar bg-body-tertiary px-3 mb-3 rounded-2">
     <a class="navbar-brand" href="#">Navbar</a>
     <ul class="nav nav-pills">
       <li class="nav-item">
@@ -45,7 +45,7 @@ Scroll the area below the navbar and watch the active class change. Open the dro
       </li>
     </ul>
   </nav>
-  <div class="scrollspy-example bg-light p-3 rounded-2" data-bs-spy="scroll" data-bs-target="#navbar-example2" data-bs-root-margin="0px 0px -40%" data-bs-smooth-scroll="true" tabindex="0">
+  <div class="scrollspy-example bg-body-tertiary p-3 rounded-2" data-bs-spy="scroll" data-bs-target="#navbar-example2" data-bs-root-margin="0px 0px -40%" data-bs-smooth-scroll="true" tabindex="0">
     <h4 id="scrollspyHeading1">First heading</h4>
     <p>This is some placeholder content for the scrollspy page. Note that as you scroll down the page, the appropriate navigation link is highlighted. It's repeated throughout the component example. We keep adding some more example copy here to emphasize the scrolling and highlighting.</p>
     <h4 id="scrollspyHeading2">Second heading</h4>
@@ -60,7 +60,7 @@ Scroll the area below the navbar and watch the active class change. Open the dro
 </div>
 
 ```html
-<nav id="navbar-example2" class="navbar bg-light px-3 mb-3">
+<nav id="navbar-example2" class="navbar bg-body-tertiary px-3 mb-3">
   <a class="navbar-brand" href="#">Navbar</a>
   <ul class="nav nav-pills">
     <li class="nav-item">
@@ -80,7 +80,7 @@ Scroll the area below the navbar and watch the active class change. Open the dro
     </li>
   </ul>
 </nav>
-<div data-bs-spy="scroll" data-bs-target="#navbar-example2" data-bs-root-margin="0px 0px -40%" data-bs-smooth-scroll="true" class="scrollspy-example bg-light p-3 rounded-2" tabindex="0">
+<div data-bs-spy="scroll" data-bs-target="#navbar-example2" data-bs-root-margin="0px 0px -40%" data-bs-smooth-scroll="true" class="scrollspy-example bg-body-tertiary p-3 rounded-2" tabindex="0">
   <h4 id="scrollspyHeading1">First heading</h4>
   <p>...</p>
   <h4 id="scrollspyHeading2">Second heading</h4>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/spinners.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/spinners.md
index bc1b1e64f..f2635c63e 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/spinners.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/spinners.md
@@ -13,7 +13,7 @@ Bootstrap "spinners" can be used to show the loading state in your projects. The
 For accessibility purposes, each loader here includes `role="status"` and a nested `<span class="visually-hidden">Loading...</span>`.
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 ## Border spinner
@@ -205,9 +205,7 @@ Used for creating the CSS animations for our spinners. Included in `scss/_spinne
 
 
 [color]:   {{< docsref "/utilities/colors" >}}
-[display]: {{< docsref "/utilities/display" >}}
 [flex]:    {{< docsref "/utilities/flex" >}}
 [float]:   {{< docsref "/utilities/float" >}}
 [margin]:  {{< docsref "/utilities/spacing" >}}
-[sizing]:  {{< docsref "/utilities/sizing" >}}
 [text]:    {{< docsref "/utilities/text" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/toasts.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/toasts.md
index abcb3928a..b7a84dc6e 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/toasts.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/toasts.md
@@ -16,7 +16,7 @@ Things to know when using the toast plugin:
 - Toasts will automatically hide if you do not specify `autohide: false`.
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 ## Examples
@@ -27,7 +27,7 @@ To encourage extensible and predictable toasts, we recommend a header and body.
 
 Toasts are as flexible as you need and have very little required markup. At a minimum, we require a single element to contain your "toasted" content and strongly encourage a dismiss button.
 
-{{< example class="bg-light" >}}
+{{< example >}}
 <div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
   <div class="toast-header">
     {{< placeholder width="20" height="20" background="#007aff" class="rounded me-2" text="false" title="false" >}}
@@ -121,7 +121,7 @@ Toasts are slightly translucent to blend in with what's below them.
 
 You can stack toasts by wrapping them in a toast container, which will vertically add some spacing.
 
-{{< example class="bg-light" >}}
+{{< example >}}
 <div class="toast-container position-static">
   <div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
     <div class="toast-header">
@@ -153,7 +153,7 @@ You can stack toasts by wrapping them in a toast container, which will verticall
 
 Customize your toasts by removing sub-components, tweaking them with [utilities]({{< docsref "/utilities/api" >}}), or by adding your own markup. Here we've created a simpler toast by removing the default `.toast-header`, adding a custom hide icon from [Bootstrap Icons]({{< param icons >}}), and using some [flexbox utilities]({{< docsref "/utilities/flex" >}}) to adjust the layout.
 
-{{< example class="bg-light" >}}
+{{< example >}}
 <div class="toast align-items-center" role="alert" aria-live="assertive" aria-atomic="true">
   <div class="d-flex">
     <div class="toast-body">
@@ -166,7 +166,7 @@ Customize your toasts by removing sub-components, tweaking them with [utilities]
 
 Alternatively, you can also add additional controls and components to toasts.
 
-{{< example class="bg-light" >}}
+{{< example >}}
 <div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
   <div class="toast-body">
     Hello, world! This is a toast message.
@@ -182,7 +182,7 @@ Alternatively, you can also add additional controls and components to toasts.
 
 Building on the above example, you can create different toast color schemes with our [color]({{< docsref "/utilities/colors" >}}) and [background]({{< docsref "/utilities/background" >}}) utilities. Here we've added `.text-bg-primary` to the `.toast`, and then added `.btn-close-white` to our close button. For a crisp edge, we remove the default border with `.border-0`.
 
-{{< example class="bg-light" >}}
+{{< example >}}
 <div class="toast align-items-center text-bg-primary border-0" role="alert" aria-live="assertive" aria-atomic="true">
   <div class="d-flex">
     <div class="toast-body">
@@ -215,7 +215,7 @@ Place toasts with custom CSS as you need them. The top right is often used for n
     </select>
   </div>
 </form>
-<div aria-live="polite" aria-atomic="true" class="bg-dark position-relative bd-example-toasts">
+<div aria-live="polite" aria-atomic="true" class="bg-body-secondary position-relative bd-example-toasts rounded-3">
   <div class="toast-container p-3" id="toastPlacement">
     <div class="toast">
       <div class="toast-header">
@@ -233,7 +233,7 @@ Place toasts with custom CSS as you need them. The top right is often used for n
 
 For systems that generate more notifications, consider using a wrapping element so they can easily stack.
 
-{{< example class="bg-dark bd-example-toasts p-0" >}}
+{{< example class="bd-example-toasts p-0" >}}
 <div aria-live="polite" aria-atomic="true" class="position-relative">
   <!-- Position it: -->
   <!-- - `.toast-container` for spacing between toasts -->
@@ -271,7 +271,7 @@ For systems that generate more notifications, consider using a wrapping element
 
 You can also get fancy with flexbox utilities to align toasts horizontally and/or vertically.
 
-{{< example class="bg-dark bd-example-toasts d-flex" >}}
+{{< example class="bd-example-toasts d-flex" >}}
 <!-- Flexbox container for aligning the toasts -->
 <div aria-live="polite" aria-atomic="true" class="d-flex justify-content-center align-items-center w-100">
 
@@ -308,7 +308,7 @@ As the content you're displaying changes, be sure to update the [`delay` timeout
 
 When using `autohide: false`, you must add a close button to allow users to dismiss the toast.
 
-{{< example class="bg-light" >}}
+{{< example >}}
 <div role="alert" aria-live="assertive" aria-atomic="true" class="toast" data-bs-autohide="false">
   <div class="toast-header">
     {{< placeholder width="20" height="20" background="#007aff" class="rounded me-2" text="false" title="false" >}}
@@ -368,7 +368,7 @@ const toastList = [...toastElList].map(toastEl => new bootstrap.Toast(toastEl, o
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 {{< bs-table "table" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/components/tooltips.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/tooltips.md
index a106d9de8..ef269eca4 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/components/tooltips.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/tooltips.md
@@ -23,11 +23,11 @@ Things to know when using the tooltip plugin:
 Got all that? Great, let's see how they work with some examples.
 
 {{< callout info >}}
-{{< partial "callout-info-sanitizer.md" >}}
+{{< partial "callouts/info-sanitizer.md" >}}
 {{< /callout >}}
 
 {{< callout info >}}
-{{< partial "callout-info-prefersreducedmotion.md" >}}
+{{< partial "callouts/info-prefersreducedmotion.md" >}}
 {{< /callout >}}
 
 ## Examples
@@ -51,7 +51,7 @@ Hover over the links below to see tooltips:
 {{< /example >}}
 
 {{< callout warning >}}
-{{< partial "callout-warning-data-bs-title-vs-title.md" >}}
+{{< partial "callouts/warning-data-bs-title-vs-title.md" >}}
 {{< /callout >}}
 
 ### Custom tooltips
@@ -246,7 +246,7 @@ const tooltip = new bootstrap.Tooltip(element, {
 ### Methods
 
 {{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
 {{< /callout >}}
 
 {{< bs-table "table" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/content/figures.md b/vendor/twbs/bootstrap/site/content/docs/5.3/content/figures.md
index 29a38d723..29a38d723 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/content/figures.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/content/figures.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/content/images.md b/vendor/twbs/bootstrap/site/content/docs/5.3/content/images.md
index b55e7a2b8..b55e7a2b8 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/content/images.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/content/images.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/content/reboot.md b/vendor/twbs/bootstrap/site/content/docs/5.3/content/reboot.md
index ca667b2ce..a695009dc 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/content/reboot.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/content/reboot.md
@@ -3,7 +3,7 @@ layout: docs
 title: Reboot
 description: Reboot, a collection of element-specific CSS changes in a single file, kickstart Bootstrap to provide an elegant, consistent, and simple baseline to build upon.
 group: content
-aliases: "/docs/5.2/content/"
+aliases: "/docs/5.3/content/"
 toc: true
 ---
 
@@ -80,9 +80,9 @@ Note that because the font stack includes emoji fonts, many common symbol/dingba
 
 This `font-family` is applied to the `<body>` and automatically inherited globally throughout Bootstrap. To switch the global `font-family`, update `$font-family-base` and recompile Bootstrap.
 
-## Headings and paragraphs
+## Headings
 
-All heading elements—e.g., `<h1>`—and `<p>` are reset to have their `margin-top` removed. Headings have `margin-bottom: .5rem` added and paragraphs `margin-bottom: 1rem` for easy spacing.
+All heading elements—`<h1>`—`<h6>` have their `margin-top` removed, `margin-bottom: .5rem` set, and `line-height` tightened. While headings inherit their `color` by default, you can also override it via optional CSS variable, `--bs-heading-color`.
 
 {{< bs-table "table" >}}
 | Heading | Example |
@@ -95,6 +95,35 @@ All heading elements—e.g., `<h1>`—and `<p>` are reset to have their `margin-
 | `<h6></h6>` | <span class="h6">h6. Bootstrap heading</span> |
 {{< /bs-table >}}
 
+## Paragraphs
+
+All `<p>` elements have their `margin-top` removed and `margin-bottom: 1rem` set for easy spacing.
+
+{{< example >}}
+<p>This is an example paragraph.</p>
+{{< /example >}}
+
+## Links
+
+Links have a default `color` and underline applied. While links change on `:hover`, they don't change based on whether someone `:visited` the link. They also receive no special `:focus` styles.
+
+{{< example >}}
+<a href="#">This is an example link</a>
+{{< /example >}}
+
+As of v5.3.x, link `color` is set using `rgba()` and new `-rgb` CSS variables, allowing for easy customization of link color opacity. Change the link color opacity with the `--bs-link-opacity` CSS variable:
+
+{{< example >}}
+<a href="#" style="--bs-link-opacity: .5">This is an example link</a>
+{{< /example >}}
+
+
+Placeholder links—those without an `href`—are targeted with a more specific selector and have their `color` and `text-decoration` reset to their default values.
+
+{{< example >}}
+<a>This is a placeholder link</a>
+{{< /example >}}
+
 ## Horizontal rules
 
 The `<hr>` element has been simplified. Similar to browser defaults, `<hr>`s are styled via `border-top`, have a default `opacity: .25`, and automatically inherit their `border-color` via `color`, including when `color` is set via the parent. They can be modified with text, border, and opacity utilities.
@@ -176,7 +205,7 @@ Use the `<kbd>` to indicate input that is typically entered via keyboard.
 
 {{< example >}}
 To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br>
-To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd>
+To edit settings, press <kbd><kbd>Ctrl</kbd> + <kbd>,</kbd></kbd>
 {{< /example >}}
 
 ## Sample output
@@ -363,7 +392,7 @@ These changes, and more, are demonstrated below.
 </form>
 
 {{< callout warning >}}
-{{< partial "callout-warning-input-support.md" >}}
+{{< partial "callouts/warning-input-support.md" >}}
 {{< /callout >}}
 
 ### Pointers on buttons
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/content/tables.md b/vendor/twbs/bootstrap/site/content/docs/5.3/content/tables.md
index 577e3ef84..044a7147f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/content/tables.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/content/tables.md
@@ -18,6 +18,10 @@ Using the most basic table markup, here's how `.table`-based tables look in Boot
 
 Use contextual classes to color tables, table rows or individual cells.
 
+{{< callout info >}}
+**Heads up!** Because of the more complicated CSS used to generate our table variants, they most likely won't see color mode adaptive styling until v6.
+{{< /callout >}}
+
 <div class="bd-example">
   <table class="table">
     <thead>
@@ -69,7 +73,7 @@ Use contextual classes to color tables, table rows or individual cells.
 {{< /highlight >}}
 
 {{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
 {{< /callout >}}
 
 ## Accented tables
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/content/typography.md b/vendor/twbs/bootstrap/site/content/docs/5.3/content/typography.md
index 733013281..733013281 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/content/typography.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/content/typography.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/customize/color-modes.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/color-modes.md
new file mode 100644
index 000000000..55d06ee97
--- /dev/null
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/color-modes.md
@@ -0,0 +1,273 @@
+---
+layout: docs
+title: Color modes
+description: Bootstrap now supports color modes, or themes, as of v5.3.0. Explore our default light color mode and the new dark mode, or create your own using our styles as your template.
+group: customize
+toc: true
+added: "5.3"
+---
+
+## Dark mode
+
+**Bootstrap now supports color modes, starting with dark mode!** With v5.3.0 you can implement your own color mode toggler (see below for an example from Bootstrap's docs) and apply the different color modes as you see fit. We support a light mode (default) and now dark mode. Color modes can be toggled globally on the `<html>` element, or on specific components and elements, thanks to the `data-bs-theme` attribute.
+
+Alternatively, you can also switch to a media query implementation thanks to our color mode mixin—see [the usage section for details](#sass-usage). Heads up though—this eliminates your ability to change themes on a per-component basis as shown below.
+
+## Example
+
+For example, to change the color mode of a dropdown menu, add `data-bs-theme="light"` or `data-bs-theme="dark"` to the parent `.dropdown`. Now, no matter the global color mode, these dropdowns will display with the specified theme value.
+
+{{< example class="d-flex justify-content-between" >}}
+<div class="dropdown" data-bs-theme="light">
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButtonLight" data-bs-toggle="dropdown" aria-expanded="false">
+    Default dropdown
+  </button>
+  <ul class="dropdown-menu" aria-labelledby="dropdownMenuButtonLight">
+    <li><a class="dropdown-item active" href="#">Action</a></li>
+    <li><a class="dropdown-item" href="#">Action</a></li>
+    <li><a class="dropdown-item" href="#">Another action</a></li>
+    <li><a class="dropdown-item" href="#">Something else here</a></li>
+    <li><hr class="dropdown-divider"></li>
+    <li><a class="dropdown-item" href="#">Separated link</a></li>
+  </ul>
+</div>
+
+<div class="dropdown" data-bs-theme="dark">
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButtonDark" data-bs-toggle="dropdown" aria-expanded="false">
+    Dark dropdown
+  </button>
+  <ul class="dropdown-menu" aria-labelledby="dropdownMenuButtonDark">
+    <li><a class="dropdown-item active" href="#">Action</a></li>
+    <li><a class="dropdown-item" href="#">Action</a></li>
+    <li><a class="dropdown-item" href="#">Another action</a></li>
+    <li><a class="dropdown-item" href="#">Something else here</a></li>
+    <li><hr class="dropdown-divider"></li>
+    <li><a class="dropdown-item" href="#">Separated link</a></li>
+  </ul>
+</div>
+{{< /example >}}
+
+## How it works
+
+- As shown above, color mode styles are controlled by the `data-bs-theme` attribute. This attribute can be applied to the `<html>` element, or to any other element or Bootstrap component. If applied to the `<html>` element, it will apply to everything. If applied to a component or element, it will be scoped to that specific component or element.
+
+- For each color mode you wish to support, you'll need to add new overrides for the shared global CSS variables. We do this already in our `_root.scss` stylesheet for dark mode, with light mode being the default values. In writing color mode specific styles, use the mixin:
+
+  ```scss
+  // Color mode variables in _root.scss
+  @include color-mode(dark) {
+    // CSS variable overrides here...
+  }
+  ```
+
+- We use a custom `_variables-dark.scss` to power those shared global CSS variable overrides for dark mode. This file isn't required for your own custom color modes, but it's required for our dark mode for two reasons. First, it's better to have a single place to reset global colors. Second, some Sass variables had to be overridden for background images embedded in our CSS for accordions, form components, and more.
+
+## Nesting color modes
+
+Use `data-bs-theme` on a nested element to change the color mode for a group of elements or components. In the example below, we have an outer dark mode with a nested light mode. You'll notice components naturally adapt their appearance, but you may need to add some utilities along the way to utilize the styles specific to each color mode.
+
+For example, despite using `data-bs-theme="dark"` on a random `<div>`, the `<div>` has no `background-color` as it's set on the `<body>`. As such, if you want the `color` and `background-color` to adapt, you'll need to add `.text-body` and `.bg-body`.
+
+{{< example class="p-0" >}}
+<div data-bs-theme="dark" class="p-3 text-body bg-body">
+  <nav aria-label="breadcrumb">
+    <ol class="breadcrumb">
+      <li class="breadcrumb-item"><a href="#">Color modes</a></li>
+      <li class="breadcrumb-item active" aria-current="page">Dark</li>
+    </ol>
+  </nav>
+
+  <p>This should be shown in a <strong>dark</strong> theme at all times.</p>
+
+  <div class="progress mb-4">
+    <div class="progress-bar" role="progressbar" aria-label="Basic example" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
+  </div>
+
+  <div class="dropdown mb-4">
+    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButtonDark2" data-bs-toggle="dropdown" aria-expanded="false">
+      Dark dropdown
+    </button>
+    <ul class="dropdown-menu" aria-labelledby="dropdownMenuButtonDark2">
+      <li><a class="dropdown-item active" href="#">Action</a></li>
+      <li><a class="dropdown-item" href="#">Action</a></li>
+      <li><a class="dropdown-item" href="#">Another action</a></li>
+      <li><a class="dropdown-item" href="#">Something else here</a></li>
+      <li><hr class="dropdown-divider"></li>
+      <li><a class="dropdown-item" href="#">Separated link</a></li>
+    </ul>
+  </div>
+
+  <div data-bs-theme="light" class="p-3 text-body bg-body rounded">
+    <nav aria-label="breadcrumb">
+      <ol class="breadcrumb">
+        <li class="breadcrumb-item"><a href="#">Color modes</a></li>
+        <li class="breadcrumb-item"><a href="#">Dark</a></li>
+        <li class="breadcrumb-item active" aria-current="page">Light</li>
+      </ol>
+    </nav>
+
+    <p>This should be shown in a <strong>light</strong> theme at all times.</p>
+
+    <div class="progress mb-4">
+      <div class="progress-bar" role="progressbar" aria-label="Basic example" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
+    </div>
+
+    <div class="dropdown">
+      <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButtonLight2" data-bs-toggle="dropdown" aria-expanded="false">
+        Light dropdown
+      </button>
+      <ul class="dropdown-menu" aria-labelledby="dropdownMenuButtonLight2">
+        <li><a class="dropdown-item active" href="#">Action</a></li>
+        <li><a class="dropdown-item" href="#">Action</a></li>
+        <li><a class="dropdown-item" href="#">Another action</a></li>
+        <li><a class="dropdown-item" href="#">Something else here</a></li>
+        <li><hr class="dropdown-divider"></li>
+        <li><a class="dropdown-item" href="#">Separated link</a></li>
+      </ul>
+    </div>
+  </div>
+</div>
+{{< /example >}}
+
+## Usage
+
+### Enable dark mode
+
+Enable the built in dark color mode across your entire project by adding the `data-bs-theme="dark"` attribute to the `<html>` element. This will apply the dark color mode to all components and elements, other than those with a specific `data-bs-theme` attribute applied. Building on the [quick start template]({{< docsref "/getting-started/introduction#quick-start" >}}):
+
+```html
+<!doctype html>
+<html lang="en" data-bs-theme="dark">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Bootstrap demo</title>
+    <link href="{{< param "cdn.css" >}}" rel="stylesheet" integrity="{{< param "cdn.css_hash" >}}" crossorigin="anonymous">
+  </head>
+  <body>
+    <h1>Hello, world!</h1>
+    <script src="{{< param "cdn.js_bundle" >}}" integrity="{{< param "cdn.js_bundle_hash" >}}" crossorigin="anonymous"></script>
+  </body>
+</html>
+```
+
+Bootstrap does not yet ship with a built-in color mode picker, but you can use the one from our own documentation if you like. [Learn more in the JavaScript section.](#javascript)
+
+### Building with Sass
+
+Our new dark mode option is available to use for all users of Bootstrap, but it's controlled via data attributes instead of media queries and does not automatically toggle your project's color mode. You can disable our dark mode entirely via Sass by changing `$enable-dark-mode` to `false`.
+
+We use a custom Sass mixin, `color-mode()`, to help you control _how_ color modes are applied. By default, we use a `data` attribute approach, allowing you to create more user-friendly experiences where your visitors can choose to have an automatic dark mode or control their preference (like in our own docs here). This is also an easy and scalable way to add different themes and more custom color modes beyond light and dark.
+
+In case you want to use media queries and only make color modes automatic, you can change the mixin's default type via Sass variable. Consider the following snippet and it's compiled CSS output.
+
+```scss
+$color-mode-type: data;
+
+@include color-mode(dark) {
+  .element {
+    color: var(--bs-primary-text);
+    background-color: var(--bs-primary-bg-subtle);
+  }
+}
+```
+
+Outputs to:
+
+```css
+[data-bs-theme=dark] .element {
+  color: var(--bs-primary-text);
+  background-color: var(--bs-primary-bg-subtle);
+}
+```
+
+And when setting to `media-query`:
+
+```scss
+$color-mode-type: media-query;
+
+@include color-mode(dark) {
+  .element {
+    color: var(--bs-primary-text);
+    background-color: var(--bs-primary-bg-subtle);
+  }
+}
+```
+
+Outputs to:
+
+```css
+@media (prefers-color-scheme: dark) {
+  .element {
+    color: var(--bs-primary-text);
+    background-color: var(--bs-primary-bg-subtle);
+  }
+}
+```
+
+## Custom color modes
+
+While the primary use case for color modes is light and dark mode, custom color modes are also possible. Create your own `data-bs-theme` selector with a custom value as the name of your color mode, then modify our Sass and CSS variables as needed. We opted to create a separate `_variables-dark.scss` stylesheet to house Bootstrap's dark mode specific Sass variables, but that's not required for you.
+
+For example, you can create a "blue theme" with the selector `data-bs-theme="blue"`. In your custom Sass or CSS file, add the new selector and override any global or component CSS variables as needed. If you're using Sass, you can also use Sass's functions within your CSS variable overrides.
+
+{{< scss-docs name="custom-color-mode" file="site/assets/scss/_content.scss" >}}
+
+<div class="bd-example text-body bg-body" data-bs-theme="blue">
+  <div class="h4">Example blue theme</div>
+  <p>Some paragraph text to show how the blue theme might look with written copy.</p>
+
+  <hr class="my-4">
+
+  <div class="dropdown">
+    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButtonCustom" data-bs-toggle="dropdown" aria-expanded="false">
+      Dropdown button
+    </button>
+    <ul class="dropdown-menu" aria-labelledby="dropdownMenuButtonCustom">
+      <li><a class="dropdown-item active" href="#">Action</a></li>
+      <li><a class="dropdown-item" href="#">Action</a></li>
+      <li><a class="dropdown-item" href="#">Another action</a></li>
+      <li><a class="dropdown-item" href="#">Something else here</a></li>
+      <li><hr class="dropdown-divider"></li>
+      <li><a class="dropdown-item" href="#">Separated link</a></li>
+    </ul>
+  </div>
+</div>
+
+```html
+<div data-bs-theme="blue">
+  ...
+</div>
+```
+
+## JavaScript
+
+To allow visitors or users to toggle color modes, you'll need to create a toggle element to control the `data-bs-theme` attribute on the root element, `<html>`. We've built a toggler in our documentation that initially defers to a user's current system color mode, but provides an option to override that and pick a specific color mode.
+
+Here's a look at the JavaScript that powers it. Feel free to inspect our own documentation navbar to see how it's implemented using HTML and CSS from our own components. Note that if you decide to use media queries for your color modes, your JavaScript may need to be modified or removed if you prefer an implicit control.
+
+{{< example lang="js" show_preview="false" >}}
+{{< js.inline >}}
+{{- readFile (path.Join "site/static/docs" .Site.Params.docs_version "assets/js/color-modes.js") -}}
+{{< /js.inline >}}
+{{< /example >}}
+
+## CSS
+
+### Variables
+
+Dozens of root level CSS variables are repeated as overrides for dark mode. These are scoped to the color mode selector, which defaults to `data-bs-theme` but [can be configured](#sass-usage) to use a `prefers-color-scheme` media query. Use these variables as a guideline for generating your own new color modes.
+
+{{< scss-docs name="root-dark-mode-vars" file="scss/_root.scss" >}}
+
+### Sass variables
+
+CSS variables for our dark color mode are partially generated from dark mode specific Sass variables in `_variables-dark.scss`. This also includes some custom overrides for changing the colors of embedded SVGs used throughout our components.
+
+{{< scss-docs name="sass-dark-mode-vars" file="scss/_variables-dark.scss" >}}
+
+### Sass mixin
+
+Styles for dark mode, and any custom color modes you create, can be scoped appropriately to the `data-bs-theme` attribute selector or media query with the customizable `color-mode()` mixin. See the [Sass usage section](#sass-usage) for more details.
+
+{{< scss-docs name="color-mode-mixin" file="scss/mixins/_color-mode.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/customize/color.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/color.md
new file mode 100644
index 000000000..fd4a7f37a
--- /dev/null
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/color.md
@@ -0,0 +1,509 @@
+---
+layout: docs
+title: Color
+description: Bootstrap is supported by an extensive color system that themes our styles and components. This enables more comprehensive customization and extension for any project.
+group: customize
+toc: true
+---
+
+## Colors
+
+{{< added-in "5.3.0" >}}
+
+Bootstrap's color palette has continued to expand and become more nuanced in v5.3.0. We've added new variables for `secondary` and `tertiary` text and background colors, plus `{color}-bg-subtle`, `{color}-border-subtle`, and `{color}-text` for our theme colors. These new colors are available through Sass and CSS variables (but not our color maps or utility classes) with the express goal of making it easier to customize across multiple colors modes like light and dark. These new variables are globally set on `:root` and are adapted for our new dark color mode while our original theme colors remain unchanged.
+
+Colors ending in `-rgb` provide the `red, green, blue` values for use in `rgb()` and `rgba()` color modes. For example, `rgba(var(--bs-secondary-bg-rgb), .5)`.
+
+{{< callout warning>}}
+**Heads up!** There's some potential confusion with our new secondary and tertiary colors, and our existing secondary theme color, as well as our light and dark theme colors. Expect this to be ironed out in v6.
+{{< /callout >}}
+
+<table class="table table-swatches">
+  <thead>
+    <tr>
+      <th style="width: 340px;">Description</th>
+      <th style="width: 200px;" class="ps-0">Swatch</th>
+      <th>Variables</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td rowspan="2">
+        {{< markdown >}}**Body —** Default foreground (color) and background, including components.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2" style="background-color: var(--bs-body-color);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-body-color`<br>`--bs-body-color-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="p-3 rounded-2 border" style="background-color: var(--bs-body-bg);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-body-bg`<br>`--bs-body-bg-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="2">
+        {{< markdown >}}**Secondary —** Use the `color` option for lighter text. Use the `bg` option for dividers and to indicate disabled component states.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2" style="background-color: var(--bs-secondary-color);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-secondary-color`<br>`--bs-secondary-color-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="p-3 rounded-2 border" style="background-color: var(--bs-secondary-bg);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-secondary-bg`<br>`--bs-secondary-bg-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="2">
+        {{< markdown >}}**Tertiary —** Use the `color` option for even lighter text. Use the `bg` option to style backgrounds for hover states, accents, and wells.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2" style="background-color: var(--bs-tertiary-color);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-tertiary-color`<br>`--bs-tertiary-color-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="p-3 rounded-2 border" style="background-color: var(--bs-tertiary-bg);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-tertiary-bg`<br>`--bs-tertiary-bg-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        {{< markdown >}}**Emphasis —** For higher contrast text. Not applicable for backgrounds.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2" style="background-color: var(--bs-emphasis-color);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-emphasis-color`<br>`--bs-emphasis-color-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        {{< markdown >}}**Border —** For component borders, dividers, and rules. Use `--bs-border-color-translucent` to blend with backgrounds with an `rgba()` value.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2" style="background-color: var(--bs-border-color);">&nbsp;</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-border-color`<br>`--bs-border-color-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="4">
+        {{< markdown >}}**Primary —** Main theme color, used for hyperlinks, focus styles, and component and form active states.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2 text-bg-primary">Primary</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-primary`<br>`--bs-primary-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2 border" style="background-color: var(--bs-primary-bg-subtle); --bs-border-color: var(--bs-primary-border-subtle); color: var(--bs-primary-text);">Background subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-primary-bg-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-primary-border-subtle); color: var(--bs-primary-text);">Border subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-primary-border-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-primary-text); color: var(--bs-body-bg);">Text</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-primary-text`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="4">
+        {{< markdown >}}**Success —** Theme color used for positive or successful actions and information.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2 text-bg-success">Success</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-success`<br>`--bs-success-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2 border" style="background-color: var(--bs-success-bg-subtle); --bs-border-color: var(--bs-success-border-subtle); color: var(--bs-success-text);">Background subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-success-bg-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-success-border-subtle); color: var(--bs-success-text);">Border subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-success-border-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-success-text); color: var(--bs-body-bg);">Text</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-success-text`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="4">
+        {{< markdown >}}**Danger —** Theme color used for errors and dangerous actions.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2 text-bg-danger">Danger</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-danger`<br>`--bs-danger-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2 border" style="background-color: var(--bs-danger-bg-subtle); --bs-border-color: var(--bs-danger-border-subtle); color: var(--bs-danger-text);">Background subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-danger-bg-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-danger-border-subtle); color: var(--bs-danger-text);">Border subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-danger-border-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-danger-text); color: var(--bs-body-bg);">Text</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-danger-text`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="4">
+        {{< markdown >}}**Warning —** Theme color used for non-destructive warning messages.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2 text-bg-warning">Warning</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-warning`<br>`--bs-warning-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2 border" style="background-color: var(--bs-warning-bg-subtle); --bs-border-color: var(--bs-warning-border-subtle); color: var(--bs-warning-text);">Background subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-warning-bg-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-warning-border-subtle); color: var(--bs-warning-text);">Border subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-warning-border-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-warning-text); color: var(--bs-body-bg);">Text</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-warning-text`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="4">
+        {{< markdown >}}**Info —** Theme color used for neutral and informative content.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2 text-bg-info">Info</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-info`<br>`--bs-info-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2 border" style="background-color: var(--bs-info-bg-subtle); --bs-border-color: var(--bs-info-border-subtle); color: var(--bs-info-text);">Background subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-info-bg-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-info-border-subtle); color: var(--bs-info-text);">Border subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-info-border-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 h-100 rounded-2" style="background-color: var(--bs-info-text); color: var(--bs-body-bg);">Text</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-info-text`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="4">
+        {{< markdown >}}**Light —** Additional theme option for less contrasting colors.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2 text-bg-light border">Light</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-light`<br>`--bs-light-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2 border" style="background-color: var(--bs-light-bg-subtle); --bs-border-color: var(--bs-light-border-subtle); color: var(--bs-light-text);">Background subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-light-bg-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-light-border-subtle); color: var(--bs-light-text);">Border subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-light-border-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 h-100 rounded-2" style="background-color: var(--bs-light-text); color: var(--bs-body-bg);">Text</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-light-text`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td rowspan="4">
+        {{< markdown >}}**Dark —** Additional theme option for higher contrasting colors.{{< /markdown >}}
+      </td>
+      <td class="ps-0">
+        <div class="p-3 rounded-2 text-bg-dark border">Dark</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-dark`<br>`--bs-dark-rgb`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2 border" style="background-color: var(--bs-dark-bg-subtle); --bs-border-color: var(--bs-dark-border-subtle); color: var(--bs-dark-text);">Background subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-dark-bg-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 rounded-2" style="background-color: var(--bs-dark-border-subtle); color: var(--bs-dark-text);">Border subtle</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-dark-border-subtle`{{< /markdown >}}
+      </td>
+    </tr>
+    <tr>
+      <td>
+        <div class="px-3 py-2 h-100 rounded-2" style="background-color: var(--bs-dark-text); color: var(--bs-body-bg);">Text</div>
+      </td>
+      <td>
+        {{< markdown >}}`--bs-dark-text`{{< /markdown >}}
+      </td>
+    </tr>
+  </tbody>
+</table>
+
+### Using the new colors
+
+These new colors are accessible via CSS variables and utility classes—like `--bs-primary-bg-subtle` and `.bg-primary-subtle`—allowing you to compose your own CSS rules with the variables, or to quickly apply styles via classes. The utilities are built with the color's associated CSS variables, and since we customize those CSS variables for dark mode, they are also adaptive to color mode by default.
+
+{{< example >}}
+<div class="p-3 text-primary-emphasis bg-primary-subtle border border-primary-subtle rounded-3">
+  Example element with utilities
+</div>
+{{< /example >}}
+
+### Theme colors
+
+We use a subset of all colors to create a smaller color palette for generating color schemes, also available as Sass variables and a Sass map in Bootstrap's `scss/_variables.scss` file.
+
+<div class="row">
+  {{< theme-colors.inline >}}
+  {{- range (index $.Site.Data "theme-colors") }}
+    <div class="col-md-4">
+      <div class="p-3 mb-3 text-bg-{{ .name }} rounded-3">{{ .name | title }}</div>
+    </div>
+  {{ end -}}
+  {{< /theme-colors.inline >}}
+</div>
+
+All these colors are available as a Sass map, `$theme-colors`.
+
+{{< scss-docs name="theme-colors-map" file="scss/_variables.scss" >}}
+
+Check out [our Sass maps and loops docs]({{< docsref "/customize/sass#maps-and-loops" >}}) for how to modify these colors.
+
+### All colors
+
+All Bootstrap colors are available as Sass variables and a Sass map in `scss/_variables.scss` file. To avoid increased file sizes, we don't create text or background color classes for each of these variables. Instead, we choose a subset of these colors for a [theme palette](#theme-colors).
+
+Be sure to monitor contrast ratios as you customize colors. As shown below, we've added three contrast ratios to each of the main colors—one for the swatch's current colors, one for against white, and one for against black.
+
+<div class="row font-monospace">
+  {{< theme-colors.inline >}}
+  {{- range $color := $.Site.Data.colors }}
+    {{- if (and (not (eq $color.name "white")) (not (eq $color.name "gray")) (not (eq $color.name "gray-dark"))) }}
+    <div class="col-md-4 mb-3">
+      <div class="p-3 mb-2 position-relative swatch-{{ $color.name }}">
+        <strong class="d-block">${{ $color.name }}</strong>
+        {{ $color.hex }}
+      </div>
+      {{ range (seq 100 100 900) }}
+      <div class="p-3 bd-{{ $color.name }}-{{ . }}">${{ $color.name }}-{{ . }}</div>
+      {{ end }}
+    </div>
+    {{ end -}}
+  {{ end -}}
+
+  <div class="col-md-4 mb-3">
+    <div class="p-3 mb-2 position-relative swatch-gray-500">
+      <strong class="d-block">$gray-500</strong>
+      #adb5bd
+    </div>
+  {{- range $.Site.Data.grays }}
+    <div class="p-3 bd-gray-{{ .name }}">$gray-{{ .name }}</div>
+  {{ end -}}
+  </div>
+  {{< /theme-colors.inline >}}
+
+  <div class="col-md-4 mb-3">
+    <div class="p-3 mb-2 bd-black text-white">
+      <strong class="d-block">$black</strong>
+      #000
+    </div>
+    <div class="p-3 mb-2 bd-white border">
+      <strong class="d-block">$white</strong>
+      #fff
+    </div>
+  </div>
+</div>
+
+### Notes on Sass
+
+Sass cannot programmatically generate variables, so we manually created variables for every tint and shade ourselves. We specify the midpoint value (e.g., `$blue-500`) and use custom color functions to tint (lighten) or shade (darken) our colors via Sass's `mix()` color function.
+
+Using `mix()` is not the same as `lighten()` and `darken()`—the former blends the specified color with white or black, while the latter only adjusts the lightness value of each color. The result is a much more complete suite of colors, as [shown in this CodePen demo](https://codepen.io/emdeoh/pen/zYOQOPB).
+
+Our `tint-color()` and `shade-color()` functions use `mix()` alongside our `$theme-color-interval` variable, which specifies a stepped percentage value for each mixed color we produce. See the `scss/_functions.scss` and `scss/_variables.scss` files for the full source code.
+
+## Color Sass maps
+
+Bootstrap's source Sass files include three maps to help you quickly and easily loop over a list of colors and their hex values.
+
+- `$colors` lists all our available base (`500`) colors
+- `$theme-colors` lists all semantically named theme colors (shown below)
+- `$grays` lists all tints and shades of gray
+
+Within `scss/_variables.scss`, you'll find Bootstrap's color variables and Sass map. Here's an example of the `$colors` Sass map:
+
+{{< scss-docs name="colors-map" file="scss/_variables.scss" >}}
+
+Add, remove, or modify values within the map to update how they're used in many other components. Unfortunately at this time, not _every_ component utilizes this Sass map. Future updates will strive to improve upon this. Until then, plan on making use of the `${color}` variables and this Sass map.
+
+### Example
+
+Here's how you can use these in your Sass:
+
+```scss
+.alpha { color: $purple; }
+.beta {
+  color: $yellow-300;
+  background-color: $indigo-900;
+}
+```
+
+[Color]({{< docsref "/utilities/colors" >}}) and [background]({{< docsref "/utilities/background" >}}) utility classes are also available for setting `color` and `background-color` using the `500` color values.
+
+## Generating utilities
+
+{{< added-in "5.1.0" >}}
+
+Bootstrap doesn't include `color` and `background-color` utilities for every color variable, but you can generate these yourself with our [utility API]({{< docsref "/utilities/api" >}}) and our extended Sass maps added in v5.1.0.
+
+1. To start, make sure you've imported our functions, variables, mixins, and utilities.
+2. Use our `map-merge-multiple()` function to quickly merge multiple Sass maps together in a new map.
+3. Merge this new combined map to extend any utility with a `{color}-{level}` class name.
+
+Here's an example that generates text color utilities (e.g., `.text-purple-500`) using the above steps.
+
+```scss
+@import "bootstrap/scss/functions";
+@import "bootstrap/scss/variables";
+@import "bootstrap/scss/maps";
+@import "bootstrap/scss/mixins";
+@import "bootstrap/scss/utilities";
+
+$all-colors: map-merge-multiple($blues, $indigos, $purples, $pinks, $reds, $oranges, $yellows, $greens, $teals, $cyans);
+
+$utilities: map-merge(
+  $utilities,
+  (
+    "color": map-merge(
+      map-get($utilities, "color"),
+      (
+        values: map-merge(
+          map-get(map-get($utilities, "color"), "values"),
+          (
+            $all-colors
+          ),
+        ),
+      ),
+    ),
+  )
+);
+
+@import "bootstrap/scss/utilities/api";
+```
+
+This will generate new `.text-{color}-{level}` utilities for every color and level. You can do the same for any other utility and property as well.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/components.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/components.md
index b512a9036..b512a9036 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/components.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/components.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/css-variables.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/css-variables.md
index 26d167525..05c77df57 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/css-variables.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/css-variables.md
@@ -14,6 +14,10 @@ Bootstrap includes many [CSS custom properties (variables)](https://developer.mo
 
 Here are the variables we include (note that the `:root` is required) that can be accessed anywhere Bootstrap's CSS is loaded. They're located in our `_root.scss` file and included in our compiled dist files.
 
+### Default
+
+These CSS variables are available everywhere, regardless of color mode.
+
 ```css
 {{< root.inline >}}
 {{- $css := readFile "dist/css/bootstrap.css" -}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/optimize.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/optimize.md
index e618ce23a..e618ce23a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/optimize.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/optimize.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/options.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/options.md
index 5013fb9b3..b5c4fc392 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/options.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/options.md
@@ -13,6 +13,7 @@ You can find and customize these variables for key global options in Bootstrap's
 | Variable                       | Values                             | Description                                                                            |
 | ------------------------------ | ---------------------------------- | -------------------------------------------------------------------------------------- |
 | `$spacer`                      | `1rem` (default), or any value > 0 | Specifies the default spacer value to programmatically generate our [spacer utilities]({{< docsref "/utilities/spacing" >}}). |
+| `$enable-dark-mode`            | `true` (default) or `false`        | Enables built-in [dark mode support]({{< docsref "/customize/color-modes#dark-mode" >}}) across the project and its components. |
 | `$enable-rounded`              | `true` (default) or `false`        | Enables predefined `border-radius` styles on various components. |
 | `$enable-shadows`              | `true` or `false` (default)        | Enables predefined decorative `box-shadow` styles on various components. Does not affect `box-shadow`s used for focus states. |
 | `$enable-gradients`            | `true` or `false` (default)        | Enables predefined gradients via `background-image` styles on various components. |
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/overview.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/overview.md
index d0a853cd6..25c31bdb6 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/overview.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/overview.md
@@ -4,7 +4,7 @@ title: Customize
 description: Learn how to theme, customize, and extend Bootstrap with Sass, a boatload of global options, an expansive color system, and more.
 group: customize
 toc: false
-aliases: "/docs/5.2/customize/"
+aliases: "/docs/5.3/customize/"
 sections:
   - title: Sass
     description: Utilize our source Sass files to take advantage of variables, maps, mixins, and functions.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/sass.md b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/sass.md
index 0fd90bc37..6da6bbe2b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/customize/sass.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/customize/sass.md
@@ -57,8 +57,9 @@ In your `custom.scss`, you'll import Bootstrap's source Sass files. You have two
 
 // 2. Include any default variable overrides here
 
-// 3. Include remainder of required Bootstrap stylesheets
+// 3. Include remainder of required Bootstrap stylesheets (including any separate color mode stylesheets)
 @import "../node_modules/bootstrap/scss/variables";
+@import "../node_modules/bootstrap/scss/variables-dark";
 
 // 4. Include any default map overrides here
 
@@ -104,6 +105,7 @@ $body-color: #111;
 
 // Required
 @import "../node_modules/bootstrap/scss/variables";
+@import "../node_modules/bootstrap/scss/variables-dark";
 @import "../node_modules/bootstrap/scss/maps";
 @import "../node_modules/bootstrap/scss/mixins";
 @import "../node_modules/bootstrap/scss/root";
@@ -117,7 +119,7 @@ $body-color: #111;
 Repeat as necessary for any variable in Bootstrap, including the global options below.
 
 {{< callout info >}}
-{{< partial "callout-info-npm-starter.md" >}}
+{{< partial "callouts/info-npm-starter.md" >}}
 {{< /callout >}}
 
 ## Maps and loops
@@ -166,6 +168,7 @@ To remove colors from `$theme-colors`, or any other map, use `map-remove`. Be aw
 // Required
 @import "../node_modules/bootstrap/scss/functions";
 @import "../node_modules/bootstrap/scss/variables";
+@import "../node_modules/bootstrap/scss/variables-dark";
 
 $theme-colors: map-remove($theme-colors, "info", "light", "dark");
 
@@ -294,7 +297,7 @@ Our `scss/mixins/` directory has a ton of mixins that power parts of Bootstrap a
 
 ### Color schemes
 
-A shorthand mixin for the `prefers-color-scheme` media query is available with support for `light`, `dark`, and custom color schemes.
+A shorthand mixin for the `prefers-color-scheme` media query is available with support for `light`, `dark`, and custom color schemes. See [the color modes documentation]({{< docsref "/customize/color-modes" >}}) for information on our color mode mixin.
 
 {{< scss-docs name="mixin-color-scheme" file="scss/mixins/_color-scheme.scss" >}}
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/.stylelintrc b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/.stylelintrc
index 79ea92df0..79ea92df0 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/.stylelintrc
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/.stylelintrc
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/_index.md b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/_index.md
index 46688839b..46688839b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/_index.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/_index.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/album-rtl/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/album-rtl/index.html
index 3408056bc..3408056bc 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/album-rtl/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/album-rtl/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/album/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/album/index.html
index 2d25d726a..2d25d726a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/album/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/album/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog-rtl/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog-rtl/index.html
index 05af925eb..05af925eb 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog-rtl/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog-rtl/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog/blog.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog/blog.css
index cc5fc7473..cc5fc7473 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog/blog.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog/blog.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog/blog.rtl.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog/blog.rtl.css
index fc03c35a3..fc03c35a3 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog/blog.rtl.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog/blog.rtl.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog/index.html
index 6b60ea069..6b60ea069 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/blog/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/blog/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel-rtl/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel-rtl/index.html
index b8c35d669..b8c35d669 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel-rtl/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel-rtl/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel/carousel.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.css
index 0bdf9768d..0bdf9768d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel/carousel.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel/carousel.rtl.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.rtl.css
index d20a8111a..d20a8111a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel/carousel.rtl.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/carousel.rtl.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/index.html
index 67c0dd529..67c0dd529 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/carousel/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/carousel/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet-rtl/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet-rtl/index.html
index a05799873..d3d0c6f00 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet-rtl/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet-rtl/index.html
@@ -1397,27 +1397,31 @@ direction: rtl
 
       <div>
         {{< example show_markup="false" >}}
-        <div class="progress mb-3">
-          <div class="progress-bar" role="progressbar" aria-label="مثال مع عنوان" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">0%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="مثال مع عنوان" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar">0%</div>
         </div>
-        <div class="progress mb-3">
-          <div class="progress-bar bg-success w-25" role="progressbar" aria-label="مثال ناجح مع عنوان" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="مثال ناجح مع عنوان" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar bg-success w-25">25%</div>
         </div>
-        <div class="progress mb-3">
-          <div class="progress-bar text-bg-info w-50" role="progressbar" aria-label="مثال توضيح مع عنوان" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">50%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="مثال توضيح مع عنوان" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar text-bg-info w-50">50%</div>
         </div>
-        <div class="progress mb-3">
-          <div class="progress-bar text-bg-warning w-75" role="progressbar" aria-label="مثال تنبيه مع عنوان" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">75%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="مثال تنبيه مع عنوان" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar text-bg-warning w-75">75%</div>
         </div>
-        <div class="progress">
-          <div class="progress-bar bg-danger w-100" role="progressbar" aria-label="مثال خطر مع عنوان" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">100%</div>
+        <div class="progress" role="progressbar" aria-label="مثال خطر مع عنوان" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar bg-danger w-100">100%</div>
         </div>
         {{< /example >}}
 
         {{< example show_markup="false" >}}
-        <div class="progress">
-          <div class="progress-bar" role="progressbar" aria-label="القسم الأول - مثال افتراضي" style="width: 15%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
-          <div class="progress-bar progress-bar-striped progress-bar-animated bg-success" role="progressbar" aria-label="القسم الثاني - مثال ناجح مقلّم متحرك" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
+        <div class="progress-stacked">
+          <div class="progress" role="progressbar" aria-label="القسم الأول - مثال افتراضي" style="width: 15%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100">
+            <div class="progress-bar"></div>
+          </div>
+          <div class="progress" role="progressbar" aria-label="القسم الثاني - مثال ناجح مقلّم متحرك" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100">
+            <div class="progress-bar progress-bar-striped progress-bar-animated bg-success"></div>
+          </div>
         </div>
         {{< /example >}}
       </div>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/cheatsheet.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/cheatsheet.css
index e2f99b859..e2f99b859 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/cheatsheet.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/cheatsheet.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/cheatsheet.js b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/cheatsheet.js
index e25a89e75..e25a89e75 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/cheatsheet.js
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/cheatsheet.js
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/cheatsheet.rtl.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/cheatsheet.rtl.css
index e04d84871..e04d84871 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/cheatsheet.rtl.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/cheatsheet.rtl.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/index.html
index a2285d0ed..6ee32654d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cheatsheet/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cheatsheet/index.html
@@ -1394,27 +1394,31 @@ body_class: "bg-light"
 
       <div>
         {{< example show_markup="false" >}}
-        <div class="progress mb-3">
-          <div class="progress-bar" role="progressbar" aria-label="Example with label" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">0%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="Example with label" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar">0%</div>
         </div>
-        <div class="progress mb-3">
-          <div class="progress-bar bg-success w-25" role="progressbar" aria-label="Success example with label" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="Success example with label" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar bg-success w-25">25%</div>
         </div>
-        <div class="progress mb-3">
-          <div class="progress-bar text-bg-info w-50" role="progressbar" aria-label="Info example with label" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">50%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="Info example with label" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar text-bg-info w-50">50%</div>
         </div>
-        <div class="progress mb-3">
-          <div class="progress-bar text-bg-warning w-75" role="progressbar" aria-label="Warning example with label" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">75%</div>
+        <div class="progress mb-3" role="progressbar" aria-label="Warning example with label" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar text-bg-warning w-75">75%</div>
         </div>
-        <div class="progress">
-          <div class="progress-bar bg-danger w-100" role="progressbar" aria-label="Danger example with label" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">100%</div>
+        <div class="progress" role="progressbar" aria-label="Danger example with label" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100">
+          <div class="progress-bar bg-danger w-100">100%</div>
         </div>
         {{< /example >}}
 
         {{< example show_markup="false" >}}
-        <div class="progress">
-          <div class="progress-bar" role="progressbar" aria-label="Segment one - default example" style="width: 15%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
-          <div class="progress-bar progress-bar-striped progress-bar-animated bg-success" role="progressbar" aria-label="Segment two - animated striped success example" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
+        <div class="progress-stacked">
+          <div class="progress" role="progressbar" aria-label="Segment one - default example" style="width: 15%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100">
+            <div class="progress-bar"></div>
+          </div>
+          <div class="progress" role="progressbar" aria-label="Segment two - animated striped success example" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100">
+            <div class="progress-bar progress-bar-striped progress-bar-animated bg-success"></div>
+          </div>
         </div>
         {{< /example >}}
       </div>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout-rtl/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout-rtl/index.html
index e0ca621b1..e2a7971c1 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout-rtl/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout-rtl/index.html
@@ -3,9 +3,9 @@ layout: examples
 title: مثال إتمام الشراء
 direction: rtl
 extra_css:
-  - "../checkout/form-validation.css"
+  - "../checkout/checkout.css"
 extra_js:
-  - src: "../checkout/form-validation.js"
+  - src: "../checkout/checkout.js"
 body_class: "bg-light"
 ---
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout/form-validation.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout/checkout.css
index e5ea31c40..e5ea31c40 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout/form-validation.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout/checkout.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout/form-validation.js b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout/checkout.js
index 30ea0aa6b..30ea0aa6b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout/form-validation.js
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout/checkout.js
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout/index.html
index 4809dc4bb..ba415f0d9 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/checkout/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/checkout/index.html
@@ -2,9 +2,9 @@
 layout: examples
 title: Checkout example
 extra_css:
-  - "form-validation.css"
+  - "checkout.css"
 extra_js:
-  - src: "form-validation.js"
+  - src: "checkout.js"
 body_class: "bg-light"
 ---
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cover/cover.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cover/cover.css
index 1b1c5407b..2e7aef8f8 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cover/cover.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cover/cover.css
@@ -4,9 +4,9 @@
 
 
 /* Custom default button */
-.btn-secondary,
-.btn-secondary:hover,
-.btn-secondary:focus {
+.btn-light,
+.btn-light:hover,
+.btn-light:focus {
   color: #333;
   text-shadow: none; /* Prevent inheritance from `body` */
 }
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cover/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cover/index.html
index 34dc1c2b6..80a73300d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/cover/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/cover/index.html
@@ -24,7 +24,7 @@ include_js: false
     <h1>Cover your page.</h1>
     <p class="lead">Cover is a one-page template for building simple and beautiful home pages. Download, edit the text, and add your own fullscreen background photo to make it your own.</p>
     <p class="lead">
-      <a href="#" class="btn btn-lg btn-secondary fw-bold border-white bg-white">Learn more</a>
+      <a href="#" class="btn btn-lg btn-light fw-bold border-white bg-white">Learn more</a>
     </p>
   </main>
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard-rtl/dashboard.js b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard-rtl/dashboard.js
index 96e0895bf..96e0895bf 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard-rtl/dashboard.js
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard-rtl/dashboard.js
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard-rtl/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard-rtl/index.html
index bc41cc604..bc41cc604 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard-rtl/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard-rtl/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/dashboard.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/dashboard.css
index ad12048e7..ad12048e7 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/dashboard.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/dashboard.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/dashboard.js b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/dashboard.js
index e1379758b..e1379758b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/dashboard.js
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/dashboard.js
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/dashboard.rtl.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/dashboard.rtl.css
index 31ea3cc64..31ea3cc64 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/dashboard.rtl.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/dashboard.rtl.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/index.html
index b3b40c266..b3b40c266 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dashboard/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dashboard/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dropdowns/dropdowns.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dropdowns/dropdowns.css
index 556f310a9..556f310a9 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dropdowns/dropdowns.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dropdowns/dropdowns.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dropdowns/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dropdowns/index.html
index f08f69701..f08f69701 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/dropdowns/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/dropdowns/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/features.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/features.css
index b5d658f6b..b5d658f6b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/features.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/features.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/index.html
index c134a0a91..35a4ef5da 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/index.html
@@ -292,54 +292,53 @@ body_class: ""
     <h2 class="pb-2 border-bottom">Features with title</h2>
 
     <div class="row row-cols-1 row-cols-md-2 align-items-md-center g-5 py-5">
-      <div class="d-flex flex-column align-items-start gap-2">
+      <div class="col d-flex flex-column align-items-start gap-2">
         <h3 class="fw-bold">Left-aligned title explaining these awesome features</h3>
         <p class="text-muted">Paragraph of text beneath the heading to explain the heading. We'll add onto it with another sentence and probably just keep going until we run out of words.</p>
         <a href="#" class="btn btn-primary btn-lg">Primary button</a>
       </div>
-      <div class="row row-cols-1 row-cols-sm-2 g-4">
-        <div class="d-flex flex-column gap-2">
-          <div
-            class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
-            <svg class="bi" width="1em" height="1em">
-              <use xlink:href="#collection" />
-            </svg>
+
+      <div class="col">
+        <div class="row row-cols-1 row-cols-sm-2 g-4">
+          <div class="col d-flex flex-column gap-2">
+            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
+              <svg class="bi" width="1em" height="1em">
+                <use xlink:href="#collection" />
+              </svg>
+            </div>
+            <h4 class="fw-semibold mb-0">Featured title</h4>
+            <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
           </div>
-          <h4 class="fw-semibold mb-0">Featured title</h4>
-          <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
-        </div>
 
-        <div class="d-flex flex-column gap-2">
-          <div
-            class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
-            <svg class="bi" width="1em" height="1em">
-              <use xlink:href="#gear-fill" />
-            </svg>
+          <div class="col d-flex flex-column gap-2">
+            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
+              <svg class="bi" width="1em" height="1em">
+                <use xlink:href="#gear-fill" />
+              </svg>
+            </div>
+            <h4 class="fw-semibold mb-0">Featured title</h4>
+            <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
           </div>
-          <h4 class="fw-semibold mb-0">Featured title</h4>
-          <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
-        </div>
 
-        <div class="d-flex flex-column gap-2">
-          <div
-            class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
-            <svg class="bi" width="1em" height="1em">
-              <use xlink:href="#speedometer" />
-            </svg>
+          <div class="col d-flex flex-column gap-2">
+            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
+              <svg class="bi" width="1em" height="1em">
+                <use xlink:href="#speedometer" />
+              </svg>
+            </div>
+            <h4 class="fw-semibold mb-0">Featured title</h4>
+            <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
           </div>
-          <h4 class="fw-semibold mb-0">Featured title</h4>
-          <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
-        </div>
 
-        <div class="d-flex flex-column gap-2">
-          <div
-            class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
-            <svg class="bi" width="1em" height="1em">
-              <use xlink:href="#table" />
-            </svg>
+          <div class="col d-flex flex-column gap-2">
+            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
+              <svg class="bi" width="1em" height="1em">
+                <use xlink:href="#table" />
+              </svg>
+            </div>
+            <h4 class="fw-semibold mb-0">Featured title</h4>
+            <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
           </div>
-          <h4 class="fw-semibold mb-0">Featured title</h4>
-          <p class="text-muted">Paragraph of text beneath the heading to explain the heading.</p>
         </div>
       </div>
     </div>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/unsplash-photo-1.jpg b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/unsplash-photo-1.jpg
index ed2e36a78..ed2e36a78 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/unsplash-photo-1.jpg
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/unsplash-photo-1.jpg
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/unsplash-photo-2.jpg b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/unsplash-photo-2.jpg
index b66864a00..b66864a00 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/unsplash-photo-2.jpg
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/unsplash-photo-2.jpg
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/unsplash-photo-3.jpg b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/unsplash-photo-3.jpg
index c411b17ec..c411b17ec 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/features/unsplash-photo-3.jpg
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/features/unsplash-photo-3.jpg
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/footers/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/footers/index.html
index 827c2426a..827c2426a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/footers/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/footers/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/grid/grid.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/grid/grid.css
index 18e3568b1..18e3568b1 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/grid/grid.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/grid/grid.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/grid/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/grid/index.html
index 7c4f1d322..7c4f1d322 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/grid/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/grid/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/headers/headers.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/headers/headers.css
index 8230c9a5f..8230c9a5f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/headers/headers.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/headers/headers.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/headers/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/headers/index.html
index b8fc8b27b..b8fc8b27b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/headers/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/headers/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/bootstrap-docs.png b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/bootstrap-docs.png
index 471a9eddf..471a9eddf 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/bootstrap-docs.png
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/bootstrap-docs.png
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/bootstrap-themes.png b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/bootstrap-themes.png
index 13c32337d..13c32337d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/bootstrap-themes.png
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/bootstrap-themes.png
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/heroes.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/heroes.css
index e9deaf744..e9deaf744 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/heroes.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/heroes.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/index.html
index ef621fd50..ef621fd50 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/heroes/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/heroes/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/jumbotron/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/jumbotron/index.html
index 8131d1903..8131d1903 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/jumbotron/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/jumbotron/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/list-groups/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/list-groups/index.html
index 9599913c0..9599913c0 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/list-groups/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/list-groups/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/list-groups/list-groups.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/list-groups/list-groups.css
index 218508412..218508412 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/list-groups/list-groups.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/list-groups/list-groups.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/masonry/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/masonry/index.html
index b4aecaa17..b4aecaa17 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/masonry/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/masonry/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/modals/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/modals/index.html
index a68bd419e..a68bd419e 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/modals/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/modals/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/modals/modals.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/modals/modals.css
index 51ad2c4fb..51ad2c4fb 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/modals/modals.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/modals/modals.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-bottom/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-bottom/index.html
index c0e859ad0..c0e859ad0 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-bottom/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-bottom/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-fixed/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-fixed/index.html
index b0d998652..3e2cc1085 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-fixed/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-fixed/index.html
@@ -2,7 +2,7 @@
 layout: examples
 title: Fixed top navbar example
 extra_css:
-  - "navbar-top-fixed.css"
+  - "navbar-fixed.css"
 ---
 
 <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-fixed/navbar-top-fixed.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-fixed/navbar-fixed.css
index c77c0c147..c77c0c147 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-fixed/navbar-top-fixed.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-fixed/navbar-fixed.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-static/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-static/index.html
index b6c26c94a..040657678 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-static/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-static/index.html
@@ -2,7 +2,7 @@
 layout: examples
 title: Top navbar example
 extra_css:
-  - "navbar-top.css"
+  - "navbar-static.css"
 ---
 
 <nav class="navbar navbar-expand-md navbar-dark bg-dark mb-4">
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-static/navbar-top.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-static/navbar-static.css
index 25bbdde09..25bbdde09 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbar-static/navbar-top.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbar-static/navbar-static.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars-offcanvas/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars-offcanvas/index.html
index 9099dc93a..cbbaf8673 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars-offcanvas/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars-offcanvas/index.html
@@ -2,7 +2,7 @@
 layout: examples
 title: Navbar Template
 extra_css:
-  - "navbar.css"
+  - "navbars-offcanvas.css"
 ---
 
 <main>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars-offcanvas/navbar.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars-offcanvas/navbars-offcanvas.css
index 70d209409..70d209409 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars-offcanvas/navbar.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars-offcanvas/navbars-offcanvas.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars/index.html
index cc90b8ce0..c4d0d89e4 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars/index.html
@@ -2,7 +2,7 @@
 layout: examples
 title: Navbar Template
 extra_css:
-  - "navbar.css"
+  - "navbars.css"
 ---
 
 <main>
@@ -400,6 +400,40 @@ extra_css:
       </div>
     </nav>
 
+    <nav class="navbar navbar-expand-lg bg-light rounded" aria-label="Thirteenth navbar example">
+      <div class="container-fluid">
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarsExample11" aria-controls="navbarsExample11" aria-expanded="false" aria-label="Toggle navigation">
+          <span class="navbar-toggler-icon"></span>
+        </button>
+
+        <div class="collapse navbar-collapse d-lg-flex" id="navbarsExample11">
+          <a class="navbar-brand col-lg-3 me-0" href="#">Centered nav</a>
+          <ul class="navbar-nav col-lg-6 justify-content-lg-center">
+            <li class="nav-item">
+              <a class="nav-link active" aria-current="page" href="#">Home</a>
+            </li>
+            <li class="nav-item">
+              <a class="nav-link" href="#">Link</a>
+            </li>
+            <li class="nav-item">
+              <a class="nav-link disabled">Disabled</a>
+            </li>
+            <li class="nav-item dropdown">
+              <a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
+              <ul class="dropdown-menu">
+                <li><a class="dropdown-item" href="#">Action</a></li>
+                <li><a class="dropdown-item" href="#">Another action</a></li>
+                <li><a class="dropdown-item" href="#">Something else here</a></li>
+              </ul>
+            </li>
+          </ul>
+          <div class="d-lg-flex col-lg-3 justify-content-lg-end">
+            <button class="btn btn-primary">Button</button>
+          </div>
+        </div>
+      </div>
+    </nav>
+
     <div>
       <div class="bg-light p-5 rounded">
         <div class="col-sm-8 mx-auto">
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars/navbar.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars/navbars.css
index 70d209409..70d209409 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/navbars/navbar.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/navbars/navbars.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/offcanvas-navbar/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/offcanvas-navbar/index.html
index 81c9bb4bb..07b18d681 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/offcanvas-navbar/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/offcanvas-navbar/index.html
@@ -2,11 +2,11 @@
 layout: examples
 title: Offcanvas navbar template
 extra_css:
-  - "offcanvas.css"
+  - "offcanvas-navbar.css"
 extra_js:
-  - src: "offcanvas.js"
+  - src: "offcanvas-navbar.js"
 body_class: "bg-light"
-aliases: "/docs/5.2/examples/offcanvas/"
+aliases: "/docs/5.3/examples/offcanvas/"
 ---
 
 <nav class="navbar navbar-expand-lg fixed-top navbar-dark bg-dark" aria-label="Main navigation">
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/offcanvas-navbar/offcanvas.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/offcanvas-navbar/offcanvas-navbar.css
index f855b96a5..f855b96a5 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/offcanvas-navbar/offcanvas.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/offcanvas-navbar/offcanvas-navbar.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/offcanvas-navbar/offcanvas.js b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/offcanvas-navbar/offcanvas-navbar.js
index b97a17164..b97a17164 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/offcanvas-navbar/offcanvas.js
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/offcanvas-navbar/offcanvas-navbar.js
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/pricing/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/pricing/index.html
index 64b856a64..64b856a64 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/pricing/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/pricing/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/pricing/pricing.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/pricing/pricing.css
index c7304d10b..c7304d10b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/pricing/pricing.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/pricing/pricing.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/product/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/product/index.html
index c2eb0eb2a..c2eb0eb2a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/product/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/product/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/product/product.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/product/product.css
index 5fcb582b4..5fcb582b4 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/product/product.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/product/product.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sidebars/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sidebars/index.html
index 48889facc..48889facc 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sidebars/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sidebars/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sidebars/sidebars.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sidebars/sidebars.css
index 5dc9fbaeb..5dc9fbaeb 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sidebars/sidebars.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sidebars/sidebars.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sidebars/sidebars.js b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sidebars/sidebars.js
index 4075f1f15..4075f1f15 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sidebars/sidebars.js
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sidebars/sidebars.js
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sign-in/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sign-in/index.html
index 8772ba3c6..cdcf16994 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sign-in/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sign-in/index.html
@@ -2,7 +2,7 @@
 layout: examples
 title: Signin Template
 extra_css:
-  - "signin.css"
+  - "sign-in.css"
 body_class: "text-center"
 include_js: false
 ---
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sign-in/signin.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sign-in/sign-in.css
index 89deea44c..89deea44c 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sign-in/signin.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sign-in/sign-in.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/starter-template/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/starter-template/index.html
index 5a898a44d..5a898a44d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/starter-template/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/starter-template/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/starter-template/starter-template.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/starter-template/starter-template.css
index 582dcbe4f..582dcbe4f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/starter-template/starter-template.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/starter-template/starter-template.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer-navbar/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer-navbar/index.html
index 1f807a6dc..1f807a6dc 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer-navbar/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer-navbar/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer-navbar/sticky-footer-navbar.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer-navbar/sticky-footer-navbar.css
index 3087ead7d..3087ead7d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer-navbar/sticky-footer-navbar.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer-navbar/sticky-footer-navbar.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer/index.html b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer/index.html
index 7a6e127cd..7a6e127cd 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer/index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer/index.html
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer/sticky-footer.css b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer/sticky-footer.css
index f8be43729..f8be43729 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/examples/sticky-footer/sticky-footer.css
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/examples/sticky-footer/sticky-footer.css
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/checks-radios.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/checks-radios.md
index 12f8b00d1..99e42d92e 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/checks-radios.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/checks-radios.md
@@ -3,7 +3,7 @@ layout: docs
 title: Checks and radios
 description: Create consistent cross-browser and cross-device checkboxes and radios with our completely rewritten checks component.
 group: forms
-aliases: "/docs/5.2/forms/checks/"
+aliases: "/docs/5.3/forms/checks/"
 toc: true
 ---
 
@@ -304,4 +304,10 @@ Different variants of `.btn`, such at the various outlined styles, are supported
 
 ### Variables
 
+Variables for checks:
+
 {{< scss-docs name="form-check-variables" file="scss/_variables.scss" >}}
+
+Variables for switches:
+
+{{< scss-docs name="form-switch-variables" file="scss/_variables.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/floating-labels.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/floating-labels.md
index 9ec4fcd2f..6b33fb67b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/floating-labels.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/floating-labels.md
@@ -75,6 +75,34 @@ Other than `.form-control`, floating labels are only available on `.form-select`
 </div>
 {{< /example >}}
 
+## Disabled
+
+Add the `disabled` boolean attribute on an input, a textarea or a select to give it a grayed out appearance, remove pointer events, and prevent focusing.
+
+{{< example >}}
+<div class="form-floating mb-3">
+  <input type="email" class="form-control" id="floatingInputDisabled" placeholder="name@example.com" disabled>
+  <label for="floatingInputDisabled">Email address</label>
+</div>
+<div class="form-floating mb-3">
+  <textarea class="form-control" placeholder="Leave a comment here" id="floatingTextareaDisabled" disabled></textarea>
+  <label for="floatingTextareaDisabled">Comments</label>
+</div>
+<div class="form-floating mb-3">
+  <textarea class="form-control" placeholder="Leave a comment here" id="floatingTextarea2Disabled" style="height: 100px" disabled></textarea>
+  <label for="floatingTextarea2Disabled">Comments</label>
+</div>
+<div class="form-floating">
+  <select class="form-select" id="floatingSelectDisabled" aria-label="Floating label disabled select example" disabled>
+    <option selected>Open this select menu</option>
+    <option value="1">One</option>
+    <option value="2">Two</option>
+    <option value="3">Three</option>
+  </select>
+  <label for="floatingSelectDisabled">Works with selects</label>
+</div>
+{{< /example >}}
+
 ## Readonly plaintext
 
 Floating labels also support `.form-control-plaintext`, which can be helpful for toggling from an editable `<input>` to a plaintext value without affecting the page layout.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/form-control.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/form-control.md
index 4d6972d1d..4df1caa2b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/form-control.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/form-control.md
@@ -8,6 +8,8 @@ toc: true
 
 ## Example
 
+Form controls are styled with a mix of Sass and CSS variables, allowing them to adapt to color modes and support any customization method.
+
 {{< example >}}
 <div class="mb-3">
   <label for="exampleFormControlInput1" class="form-label">Email address</label>
@@ -133,10 +135,16 @@ Learn more about [support for datalist elements](https://caniuse.com/datalist).
 </datalist>
 {{< /example >}}
 
-## Sass
+## CSS
 
 ### Variables
 
+Form controls make use of a small amount of CSS variables to support custom styling across color modes.
+
+{{< scss-docs name="form-control-vars" file="scss/_root.scss" >}}
+
+### Sass variables
+
 `$input-*` are shared across most of our form controls (and not buttons).
 
 {{< scss-docs name="form-input-variables" file="scss/_variables.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/input-group.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/input-group.md
index 00e9eeec9..01be5cffe 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/input-group.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/input-group.md
@@ -21,10 +21,13 @@ Place one add-on or button on either side of an input. You may also place one on
   <span class="input-group-text" id="basic-addon2">@example.com</span>
 </div>
 
-<label for="basic-url" class="form-label">Your vanity URL</label>
-<div class="input-group mb-3">
-  <span class="input-group-text" id="basic-addon3">https://example.com/users/</span>
-  <input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3">
+<div class="mb-3">
+  <label for="basic-url" class="form-label">Your vanity URL</label>
+  <div class="input-group">
+    <span class="input-group-text" id="basic-addon3">https://example.com/users/</span>
+    <input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3">
+  </div>
+  <div class="form-text">Example help text goes outside the input group.</div>
 </div>
 
 <div class="input-group mb-3">
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/layout.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/layout.md
index 3b27e3f1c..3b27e3f1c 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/layout.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/layout.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/overview.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/overview.md
index f38ad9035..9e54a08bd 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/overview.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/overview.md
@@ -4,7 +4,7 @@ title: Forms
 description: Examples and usage guidelines for form control styles, layout options, and custom components for creating a wide variety of forms.
 group: forms
 toc: true
-aliases: "/docs/5.2/forms/"
+aliases: "/docs/5.3/forms/"
 sections:
   - title: Form control
     description: Style textual inputs and textareas with support for multiple states.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/range.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/range.md
index 5c4f02612..5c4f02612 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/range.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/range.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/select.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/select.md
index 7f0c255ef..7f0c255ef 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/select.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/select.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/validation.md b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md
index d6d626634..b119cd07d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/forms/validation.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/forms/validation.md
@@ -5,7 +5,7 @@ description: Provide valuable, actionable feedback to your users with HTML5 form
 group: forms
 toc: true
 extra_js:
-  - src: "/docs/5.2/assets/js/validate-forms.js"
+  - src: "/docs/5.3/assets/js/validate-forms.js"
     async: true
 ---
 
@@ -19,7 +19,7 @@ Here's how form validation works with Bootstrap:
 
 - HTML form validation is applied via CSS's two pseudo-classes, `:invalid` and `:valid`. It applies to `<input>`, `<select>`, and `<textarea>` elements.
 - Bootstrap scopes the `:invalid` and `:valid` styles to parent `.was-validated` class, usually applied to the `<form>`. Otherwise, any required field without a value shows up as invalid on page load. This way, you may choose when to activate them (typically after form submission is attempted).
-- To reset the appearance of the form (for instance, in the case of dynamic form submissions using AJAX), remove the `.was-validated` class from the `<form>` again after submission.
+- To reset the appearance of the form (for instance, in the case of dynamic form submissions using Ajax), remove the `.was-validated` class from the `<form>` again after submission.
 - As a fallback, `.is-invalid` and `.is-valid` classes may be used instead of the pseudo-classes for [server-side validation](#server-side). They do not require a `.was-validated` parent class.
 - Due to constraints in how CSS works, we cannot (at present) apply styles to a `<label>` that comes before a form control in the DOM without the help of custom JavaScript.
 - All modern browsers support the [constraint validation API](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#the-constraint-validation-api), a series of JavaScript methods for validating form controls.
@@ -159,7 +159,7 @@ While these feedback styles cannot be styled with CSS, you can still customize t
 </form>
 {{< /example >}}
 
-## Server side
+## Server-side
 
 We recommend using client-side validation, but in case you require server-side validation, you can indicate invalid and valid form fields with `.is-invalid` and `.is-valid`. Note that `.invalid-feedback` is also supported with these classes.
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/accessibility.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/accessibility.md
index e9f1cb316..e9f1cb316 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/accessibility.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/accessibility.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/best-practices.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/best-practices.md
index 449d02a85..449d02a85 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/best-practices.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/best-practices.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/browsers-devices.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/browsers-devices.md
index dc550ecb9..dc550ecb9 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/browsers-devices.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/browsers-devices.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/contents.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/contents.md
index 88632b6d5..88632b6d5 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/contents.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/contents.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/contribute.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/contribute.md
index 6b3de43b6..4d6d405c3 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/contribute.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/contribute.md
@@ -4,7 +4,7 @@ title: Contribute
 description: Help develop Bootstrap with our documentation build scripts and tests.
 group: getting-started
 toc: true
-aliases: "/docs/5.2/getting-started/build-tools/"
+aliases: "/docs/5.3/getting-started/build-tools/"
 ---
 
 ## Tooling setup
@@ -14,7 +14,7 @@ Bootstrap uses [npm scripts](https://docs.npmjs.com/misc/scripts/) to build the
 To use our build system and run our documentation locally, you'll need a copy of Bootstrap's source files and Node. Follow these steps and you should be ready to rock:
 
 1. [Download and install Node.js](https://nodejs.org/en/download/), which we use to manage our dependencies.
-2. Either [download Bootstrap's sources]({{< param "download.source" >}}) or fork [Bootstrap's repository]({{< param repo >}}).
+2. Either [download Bootstrap's sources]({{< param "download.source" >}}) or fork and clone [Bootstrap's repository]({{< param repo >}}).
 3. Navigate to the root `/bootstrap` directory and run `npm install` to install our local dependencies listed in [package.json]({{< param repo >}}/blob/v{{< param current_version >}}/package.json).
 
 When completed, you'll be able to run the various commands provided from the command line.
@@ -33,7 +33,7 @@ Our [package.json]({{< param repo >}}/blob/v{{< param current_version >}}/packag
 {{< /bs-table >}}
 
 {{< callout info >}}
-{{< partial "callout-info-npm-starter.md" >}}
+{{< partial "callouts/info-npm-starter.md" >}}
 {{< /callout >}}
 
 ## Sass
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/download.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/download.md
index b06c0559a..f3965807a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/download.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/download.md
@@ -71,7 +71,7 @@ Bootstrap's `package.json` contains some additional metadata under the following
 - `style` - path to Bootstrap's non-minified CSS that's been compiled using the default settings (no customization)
 
 {{< callout info >}}
-{{< partial "callout-info-npm-starter.md" >}}
+{{< partial "callouts/info-npm-starter.md" >}}
 {{< /callout >}}
 
 ### yarn
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/introduction.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/introduction.md
index f0072bf85..a4192fb65 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/introduction.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/introduction.md
@@ -4,7 +4,7 @@ title: Get started with Bootstrap
 description: Bootstrap is a powerful, feature-packed frontend toolkit. Build anything—from prototype to production—in minutes.
 group: getting-started
 aliases:
-  - "/docs/5.2/getting-started/"
+  - "/docs/5.3/getting-started/"
   - "/docs/getting-started/"
   - "/getting-started/"
 toc: true
@@ -87,7 +87,7 @@ You can also use the CDN to fetch any of our [additional builds listed in the Co
 Curious which components explicitly require our JavaScript and Popper? Click the show components link below. If you're at all unsure about the general page structure, keep reading for an example page template.
 
 <details>
-<summary class="text-primary mb-3">Show components requiring JavaScript</summary>
+<summary class="bd-summary-link mb-3">Show components requiring JavaScript</summary>
 {{< markdown >}}
 - Alerts for dismissing
 - Buttons for toggling states and checkbox/radio functionality
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/javascript.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/javascript.md
index c4ba6b0f7..80eed9ce1 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/javascript.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/javascript.md
@@ -125,7 +125,6 @@ All constructors accept an optional options object or nothing (which initiates a
 
 ```js
 const myModalEl = document.querySelector('#myModal')
-
 const modal = new bootstrap.Modal(myModalEl) // initialized with defaults
 
 const configObject = { keyboard: false }
@@ -302,11 +301,17 @@ const tooltip = new bootstrap.Tooltip(yourTooltipEl, {
 **You don't need jQuery in Bootstrap 5**, but it's still possible to use our components with jQuery. If Bootstrap detects `jQuery` in the `window` object, it'll add all of our components in jQuery's plugin system. This allows you to do the following:
 
 ```js
-$('[data-bs-toggle="tooltip"]').tooltip() // to enable tooltips, with default configuration
+// to enable tooltips with the default configuration
+$('[data-bs-toggle="tooltip"]').tooltip()
 
-$('[data-bs-toggle="tooltip"]').tooltip({ boundary: 'clippingParents', customClass: 'myClass' }) // to initialize tooltips with given configuration
+// to initialize tooltips with given configuration
+$('[data-bs-toggle="tooltip"]').tooltip({
+  boundary: 'clippingParents',
+  customClass: 'myClass'
+})
 
-$('#myTooltip').tooltip('show') // to trigger `show` method
+// to trigger the `show` method
+$('#myTooltip').tooltip('show')
 ```
 
 The same goes for our other components.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/parcel.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/parcel.md
index d28f92384..833b07713 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/parcel.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/parcel.md
@@ -88,7 +88,7 @@ With dependencies installed and our project folder ready for us to start coding,
    </html>
    ```
 
-   We're including a little bit of Bootstrap styling here with the `div class="container"` and `<button>` so that we see when Bootstrap's CSS is loaded by Webpack.
+   We're including a little bit of Bootstrap styling here with the `div class="container"` and `<button>` so that we see when Bootstrap's CSS is loaded by Parcel.
 
    Parcel will automatically detect we're using Sass and install the [Sass Parcel plugin](https://parceljs.org/languages/sass/) to support it. However, if you wish, you can also manually run `npm i --save-dev @parcel/transformer-sass`.
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/rfs.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/rfs.md
index 5aa6840a4..5aa6840a4 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/rfs.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/rfs.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/rtl.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/rtl.md
index f4abf050b..f4abf050b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/rtl.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/rtl.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/vite.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/vite.md
index b203eef8a..4086316d3 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/vite.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/vite.md
@@ -35,6 +35,7 @@ We're building a Vite project with Bootstrap from scratch, so there are some pre
    ```sh
    npm i --save bootstrap @popperjs/core
    ```
+
 4. **Install additional dependency.** In addition to Vite and Bootstrap, we need another dependency (Sass) to properly import and bundle Bootstrap's CSS.
 
    ```sh
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/webpack.md b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/webpack.md
index 870e070e3..870e070e3 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/getting-started/webpack.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/getting-started/webpack.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/clearfix.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/clearfix.md
index c888610b7..3aa61876e 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/clearfix.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/clearfix.md
@@ -3,7 +3,7 @@ layout: docs
 title: Clearfix
 description: Quickly and easily clear floated content within a container by adding a clearfix utility.
 group: helpers
-aliases: "/docs/5.2/helpers/"
+aliases: "/docs/5.3/helpers/"
 ---
 
 Easily clear `float`s by adding `.clearfix` **to the parent element**. Can also be used as a mixin.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/color-background.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/color-background.md
index c4174845c..aee048e0f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/color-background.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/color-background.md
@@ -1,6 +1,6 @@
 ---
 layout: docs
-title: Color & background
+title: Color and background
 description: Set a background color with contrasting foreground color.
 group: helpers
 toc: true
@@ -9,8 +9,6 @@ added: "5.2"
 
 ## Overview
 
-{{< added-in "5.2.0" >}}
-
 Color and background helpers combine the power of our [`.text-*` utilities]({{< docsref "/utilities/colors" >}}) and [`.bg-*` utilities]({{< docsref "/utilities/background" >}}) in one class. Using our Sass `color-contrast()` function, we automatically determine a contrasting `color` for a particular `background-color`.
 
 {{< callout warning >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/colored-links.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/colored-links.md
index e940196ff..e940196ff 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/colored-links.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/colored-links.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/position.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/position.md
index b4e1f71f9..b4e1f71f9 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/position.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/position.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/ratio.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/ratio.md
index 771bc07cb..771bc07cb 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/ratio.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/ratio.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/stacks.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/stacks.md
index e1960c573..802ab4db6 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/stacks.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/stacks.md
@@ -19,9 +19,9 @@ Use `.vstack` to create vertical layouts. Stacked items are full-width by defaul
 
 {{< example >}}
 <div class="vstack gap-3">
-  <div class="bg-light border">First item</div>
-  <div class="bg-light border">Second item</div>
-  <div class="bg-light border">Third item</div>
+  <div class="bg-body-tertiary border">First item</div>
+  <div class="bg-body-tertiary border">Second item</div>
+  <div class="bg-body-tertiary border">Third item</div>
 </div>
 {{< /example >}}
 
@@ -31,9 +31,9 @@ Use `.hstack` for horizontal layouts. Stacked items are vertically centered by d
 
 {{< example >}}
 <div class="hstack gap-3">
-  <div class="bg-light border">First item</div>
-  <div class="bg-light border">Second item</div>
-  <div class="bg-light border">Third item</div>
+  <div class="bg-body-tertiary border">First item</div>
+  <div class="bg-body-tertiary border">Second item</div>
+  <div class="bg-body-tertiary border">Third item</div>
 </div>
 {{< /example >}}
 
@@ -41,9 +41,9 @@ Using horizontal margin utilities like `.ms-auto` as spacers:
 
 {{< example >}}
 <div class="hstack gap-3">
-  <div class="bg-light border">First item</div>
-  <div class="bg-light border ms-auto">Second item</div>
-  <div class="bg-light border">Third item</div>
+  <div class="bg-body-tertiary border">First item</div>
+  <div class="bg-body-tertiary border ms-auto">Second item</div>
+  <div class="bg-body-tertiary border">Third item</div>
 </div>
 {{< /example >}}
 
@@ -51,10 +51,10 @@ And with [vertical rules]({{< docsref "/helpers/vertical-rule" >}}):
 
 {{< example >}}
 <div class="hstack gap-3">
-  <div class="bg-light border">First item</div>
-  <div class="bg-light border ms-auto">Second item</div>
+  <div class="bg-body-tertiary border">First item</div>
+  <div class="bg-body-tertiary border ms-auto">Second item</div>
   <div class="vr"></div>
-  <div class="bg-light border">Third item</div>
+  <div class="bg-body-tertiary border">Third item</div>
 </div>
 {{< /example >}}
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/stretched-link.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/stretched-link.md
index 93bffeb31..8a13ff41c 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/stretched-link.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/stretched-link.md
@@ -36,7 +36,7 @@ Most custom components do not have `position: relative` by default, so we need t
 {{< /example >}}
 
 {{< example >}}
-<div class="row g-0 bg-light position-relative">
+<div class="row g-0 bg-body-secondary position-relative">
   <div class="col-md-6 mb-md-0 p-md-4">
     {{< placeholder width="100%" height="200" class="w-100" text="false" title="Generic placeholder image" >}}
   </div>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/text-truncation.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/text-truncation.md
index 799f2059b..799f2059b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/text-truncation.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/text-truncation.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/vertical-rule.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/vertical-rule.md
index b734f61d4..f10a16d08 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/vertical-rule.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/vertical-rule.md
@@ -37,9 +37,9 @@ They can also be used in [stacks]({{< docsref "/helpers/stacks" >}}):
 
 {{< example >}}
 <div class="hstack gap-3">
-  <div class="bg-light border">First item</div>
-  <div class="bg-light border ms-auto">Second item</div>
+  <div class="bg-body-tertiary border">First item</div>
+  <div class="bg-body-tertiary border ms-auto">Second item</div>
   <div class="vr"></div>
-  <div class="bg-light border">Third item</div>
+  <div class="bg-body-tertiary border">Third item</div>
 </div>
 {{< /example >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/visually-hidden.md b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/visually-hidden.md
index 112406543..917756034 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/helpers/visually-hidden.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/helpers/visually-hidden.md
@@ -3,7 +3,7 @@ layout: docs
 title: Visually hidden
 description: Use these helpers to visually hide elements but keep them accessible to assistive technologies.
 group: helpers
-aliases: "/docs/5.2/helpers/screen-readers/"
+aliases: "/docs/5.3/helpers/screen-readers/"
 ---
 
 Visually hide an element while still allowing it to be exposed to assistive technologies (such as screen readers) with `.visually-hidden`. Use `.visually-hidden-focusable` to visually hide an element by default, but to display it when it's focused (e.g. by a keyboard-only user). `.visually-hidden-focusable` can also be applied to a container–thanks to `:focus-within`, the container will be displayed when any child element of the container receives focus.
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/breakpoints.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/breakpoints.md
index e773b8f9a..8e3df157e 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/breakpoints.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/breakpoints.md
@@ -3,7 +3,7 @@ layout: docs
 title: Breakpoints
 description: Breakpoints are customizable widths that determine how your responsive layout behaves across device or viewport sizes in Bootstrap.
 group: layout
-aliases: "/docs/5.2/layout/"
+aliases: "/docs/5.3/layout/"
 toc: true
 ---
 
@@ -94,7 +94,7 @@ These Sass mixins translate in our compiled CSS using the values declared in our
 
 ### Max-width
 
-We occasionally use media queries that go in the other direction (the given screen size *or smaller*):
+We occasionally use media queries that go in the other direction (the given screen size _or smaller_):
 
 ```scss
 // No media query necessary for xs breakpoint as it's effectively `@media (max-width: 0) { ... }`
@@ -135,7 +135,7 @@ These mixins take those declared breakpoints, subtract `.02px` from them, and us
 ```
 
 {{< callout warning >}}
-{{< partial "callout-info-mediaqueries-breakpoints.md" >}}
+{{< partial "callouts/info-mediaqueries-breakpoints.md" >}}
 {{< /callout >}}
 
 ### Single breakpoint
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/columns.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/columns.md
index e2dbd3f17..1ed14844f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/columns.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/columns.md
@@ -24,6 +24,8 @@ Use flexbox alignment utilities to vertically and horizontally align columns.
 
 ### Vertical alignment
 
+Change the vertical alignment with any of the responsive `align-items-*` classes.
+
 {{< example class="bd-example-row bd-example-row-flex-cols" >}}
 <div class="container text-center">
   <div class="row align-items-start">
@@ -37,6 +39,11 @@ Use flexbox alignment utilities to vertically and horizontally align columns.
       One of three columns
     </div>
   </div>
+</div>
+{{< /example >}}
+
+{{< example class="bd-example-row bd-example-row-flex-cols" >}}
+<div class="container text-center">
   <div class="row align-items-center">
     <div class="col">
       One of three columns
@@ -48,6 +55,11 @@ Use flexbox alignment utilities to vertically and horizontally align columns.
       One of three columns
     </div>
   </div>
+</div>
+{{< /example >}}
+
+{{< example class="bd-example-row bd-example-row-flex-cols" >}}
+<div class="container text-center">
   <div class="row align-items-end">
     <div class="col">
       One of three columns
@@ -62,6 +74,8 @@ Use flexbox alignment utilities to vertically and horizontally align columns.
 </div>
 {{< /example >}}
 
+Or, change the alignment of each column individually with any of the responsive `.align-self-*` classes.
+
 {{< example class="bd-example-row bd-example-row-flex-cols" >}}
 <div class="container text-center">
   <div class="row">
@@ -187,7 +201,7 @@ You may also apply this break at specific breakpoints with our [responsive displ
 
 ### Order classes
 
-Use `.order-` classes for controlling the **visual order** of your content. These classes are responsive, so you can set the `order` by breakpoint (e.g., `.order-1.order-md-2`). Includes support for `1` through `5` across all six grid tiers.
+Use `.order-` classes for controlling the **visual order** of your content. These classes are responsive, so you can set the `order` by breakpoint (e.g., `.order-1.order-md-2`). Includes support for `1` through `5` across all six grid tiers. If you need more `.order-*` classes, you can modify the default number via Sass variable.
 
 {{< example class="bd-example-row" >}}
 <div class="container text-center">
@@ -287,11 +301,12 @@ With the move to flexbox in v4, you can use margin utilities like `.me-auto` to
 
 The `.col-*` classes can also be used outside a `.row` to give an element a specific width. Whenever column classes are used as non-direct children of a row, the paddings are omitted.
 
-{{< example >}}
-<div class="col-3 bg-light p-3 border">
+{{< example class="bd-example-row" >}}
+<div class="col-3 p-3 mb-2">
   .col-3: width of 25%
 </div>
-<div class="col-sm-9 bg-light p-3 border">
+
+<div class="col-sm-9 p-3">
   .col-sm-9: width of 75% above sm breakpoint
 </div>
 {{< /example >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/containers.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/containers.md
index 6801aca6b..6801aca6b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/containers.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/containers.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/css-grid.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/css-grid.md
index 397733c8a..397733c8a 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/css-grid.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/css-grid.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/grid.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/grid.md
index a9d00376f..a9d00376f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/grid.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/grid.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/gutters.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/gutters.md
index 586209451..1eabc9211 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/gutters.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/gutters.md
@@ -18,14 +18,14 @@ toc: true
 
 `.gx-*` classes can be used to control the horizontal gutter widths. The `.container` or `.container-fluid` parent may need to be adjusted if larger gutters are used too to avoid unwanted overflow, using a matching padding utility. For example, in the following example we've increased the padding with `.px-4`:
 
-{{< example >}}
+{{< example class="bd-example-cols" >}}
 <div class="container px-4 text-center">
   <div class="row gx-5">
     <div class="col">
-     <div class="p-3 border bg-light">Custom column padding</div>
+     <div class="p-3">Custom column padding</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
   </div>
 </div>
@@ -33,14 +33,14 @@ toc: true
 
 An alternative solution is to add a wrapper around the `.row` with the `.overflow-hidden` class:
 
-{{< example >}}
+{{< example class="bd-example-cols" >}}
 <div class="container overflow-hidden text-center">
   <div class="row gx-5">
     <div class="col">
-     <div class="p-3 border bg-light">Custom column padding</div>
+     <div class="p-3">Custom column padding</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
   </div>
 </div>
@@ -50,20 +50,20 @@ An alternative solution is to add a wrapper around the `.row` with the `.overflo
 
 `.gy-*` classes can be used to control the vertical gutter widths within a row when columns wrap to new lines. Like the horizontal gutters, the vertical gutters can cause some overflow below the `.row` at the end of a page. If this occurs, you add a wrapper around `.row` with the `.overflow-hidden` class:
 
-{{< example >}}
+{{< example class="bd-example-cols" >}}
 <div class="container overflow-hidden text-center">
   <div class="row gy-5">
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
   </div>
 </div>
@@ -73,20 +73,20 @@ An alternative solution is to add a wrapper around the `.row` with the `.overflo
 
 `.g-*` classes can be used to control the horizontal gutter widths, for the following example we use a smaller gutter width, so there won't be a need to add the `.overflow-hidden` wrapper class.
 
-{{< example >}}
+{{< example class="bd-example-cols" >}}
 <div class="container text-center">
   <div class="row g-2">
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
     <div class="col-6">
-      <div class="p-3 border bg-light">Custom column padding</div>
+      <div class="p-3">Custom column padding</div>
     </div>
   </div>
 </div>
@@ -96,38 +96,38 @@ An alternative solution is to add a wrapper around the `.row` with the `.overflo
 
 Gutter classes can also be added to [row columns]({{< docsref "/layout/grid#row-columns" >}}). In the following example, we use responsive row columns and responsive gutter classes.
 
-{{< example >}}
+{{< example class="bd-example-cols" >}}
 <div class="container text-center">
   <div class="row row-cols-2 row-cols-lg-5 g-2 g-lg-3">
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
     <div class="col">
-      <div class="p-3 border bg-light">Row column</div>
+      <div class="p-3">Row column</div>
     </div>
   </div>
 </div>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/utilities.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/utilities.md
index 009d2416d..009d2416d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/utilities.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/utilities.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/z-index.md b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/z-index.md
index 1870d05d2..1870d05d2 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/layout/z-index.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/layout/z-index.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/migration.md b/vendor/twbs/bootstrap/site/content/docs/5.3/migration.md
index dbeb8f60c..0b71ec3bc 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/migration.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/migration.md
@@ -7,6 +7,145 @@ aliases: "/migration/"
 toc: true
 ---
 
+## v5.3.0
+
+<hr class="mb-4">
+
+### Color modes!
+
+Learn more by reading the new [color modes documentation]({{< docsref "/customize/color-modes" >}}).
+
+- **Global support for light (default) and dark color modes.** Set color mode globally on the `:root` element, on groups of elements and components with a wrapper class, or directly on components, with `data-bs-theme="light|dark"`. Also included is a new `color-mode()` mixin that can output a ruleset with the `data-bs-theme` selector or a media query, depending on your preference.
+
+  <span class="badge text-warning-emphasis bg-warning-subtle">Deprecated</span>  Color modes replace dark variants for components, so  `.btn-close-white`, `.carousel-dark`, `.dropdown-menu-dark`, and `.navbar-dark` are deprecated.
+
+- **New extended color system.** We've added new theme colors (but not in `$theme-colors)`) for a more nuanced, system-wide color palette with new secondary, tertiary, and emphasis colors for `color` and `background-color`. These new colors are available as Sass variables, CSS variables, and utilities.
+
+- We've also expanded our theme color Sass variables, CSS variables, and utilities to include text emphasis, subtle background colors, and subtle border colors. These are available as Sass variables, CSS variables, and utilities.
+
+- Adds new `_variables-dark.scss` stylesheet to house dark-mode specific overrides. This stylesheet should be imported immediately after the existing `_variables.scss` file in your import stack.
+
+  ```diff
+  diff --git a/scss/bootstrap.scss b/scss/bootstrap.scss
+  index 8f8296def..449d70487 100644
+  --- a/scss/bootstrap.scss
+  +++ b/scss/bootstrap.scss
+  @@ -6,6 +6,7 @@
+   // Configuration
+   @import "functions";
+   @import "variables";
+  +@import "variables-dark";
+   @import "maps";
+   @import "mixins";
+   @import "utilities";
+  ```
+
+### CSS variables
+
+- Restores CSS variables for breakpoints, though we don't use them in our media queries as they're not supported. However, these can be useful in JS-specific contexts.
+
+- Per the color modes update, we've added new utilities for new Sass CSS variables `secondary` and `tertiary` text and background colors, plus `{color}-bg-subtle`, `{color}-border-subtle`, and `{color}-text` for our theme colors. These new colors are available through Sass and CSS variables (but not our color maps) with the express goal of making it easier to customize across multiple colors modes like light and dark.
+
+- Adds additional variables for alerts, `.btn-close`, and `.offcanvas`.
+
+- The `--bs-heading-color` variable is back with an update and dark mode support. First, we now check for a `null` value on the associated Sass variable, `$headings-color`, before trying to output the CSS variable, so by default it's not present in our compiled CSS. Second, we use the CSS variable with a fallback value, `inherit`, allowing the original behavior to persist, but also allowing for overrides.
+
+- Converts links to use CSS variables for styling `color`, but not `text-decoration`. Colors are now set with `--bs-link-color-rgb` and `--bs-link-opacity` as `rgba()` color, allowing you to customize the translucency with ease. The `a:hover` pseudo-class now overrides `--bs-link-color-rgb` instead of explicitly setting the `color` property.
+
+- `--bs-border-width` is now being used in more components for greater control over default global styling.
+
+- Adds new root CSS variables for our `box-shadow`s, including `--bs-box-shadow`, `--bs-box-shadow-sm`, `--bs-box-shadow-lg`, and `--bs-box-shadow-inset`.
+
+### Components
+
+#### Alert
+
+- Alert variants are now styled via CSS variables.
+
+- <span class="badge text-warning-emphasis bg-warning-subtle">Deprecated</span> The `.alert-variant()` mixin is now deprecated. We now [use the Sass loop]({{< docsref "/components/alerts#sass-loop" >}}) directly to modify the component's default CSS variables for each variant.
+
+#### List group
+
+- List group item variants are now styled via CSS variables.
+
+- <span class="badge text-warning-emphasis bg-warning-subtle">Deprecated</span> The `.list-group-variant()` mixin is now deprecated. We now [use the Sass loop]({{< docsref "/components/list-group#sass-loop" >}}) directly to modify the component's default CSS variables for each variant.
+
+#### Close button
+
+- <span class="badge text-warning-emphasis bg-warning-subtle">Deprecated</span> The `.btn-close-white` class has been deprecated and replaced with `data-bs-theme="dark"` on the close button or any parent element. [See the docs for an example.]({{< docsref "/components/close-button#dark-variant" >}})
+
+#### Navbar
+
+- <span class="badge text-warning-emphasis bg-warning-subtle">Deprecated</span> The `.navbar-dark` class has been deprecated and replaced with `data-bs-theme="dark"` on the navbar or any parent element. [See the docs for updated examples.]({{< docsref "/components/navbar#color-schemes" >}})
+
+### Progress bars
+
+The markup for [progress bars]({{< docsref "/components/progress" >}}) has been updated in v5.3.0. Due to the placement of `role` and various `aria-` attributes on the inner `.progress-bar` element, **some screen readers were not announcing zero value progress bars**. Now, `role="progressbar"` and the relevant `aria-*` attributes are on the outer `.progress` element, leaving the `.progress-bar` purely for the visual presentation of the bar and optional label.
+
+While we recommend adopting the new markup for improved compatibility with all screen readers, note that the legacy progress bar structure will continue to work as before.
+
+```html
+<!-- Previous markup -->
+<div class="progress">
+  <div class="progress-bar" role="progressbar" aria-label="Basic example" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
+</div>
+
+<!-- New markup -->
+<div class="progress" role="progressbar" aria-label="Basic example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
+  <div class="progress-bar" style="width: 25%"></div>
+</div>
+```
+
+We've also introduced a new `.progress-stacked` class to more logically wrap [multiple progress bars]({{< docsref "/components/progress#multiple-bars" >}}) into a single stacked progress bar.
+
+```html
+<!-- Previous markup -->
+<div class="progress">
+  <div class="progress-bar" role="progressbar" aria-label="Segment one" style="width: 15%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
+  <div class="progress-bar bg-success" role="progressbar" aria-label="Segment two" style="width: 30%" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
+  <div class="progress-bar bg-info" role="progressbar" aria-label="Segment three" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
+</div>
+
+<!-- New markup -->
+<div class="progress-stacked">
+  <div class="progress" role="progressbar" aria-label="Segment one" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100" style="width: 15%">
+    <div class="progress-bar"></div>
+  </div>
+  <div class="progress" role="progressbar" aria-label="Segment two" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100" style="width: 30%">
+    <div class="progress-bar bg-success"></div>
+  </div>
+  <div class="progress" role="progressbar" aria-label="Segment three" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
+    <div class="progress-bar bg-info"></div>
+  </div>
+</div>
+```
+
+### Forms
+
+- `.form-control` is now styled with CSS variables to support color modes. This includes the addition of two new root CSS variables for the default and disabled form control backgrounds.
+
+- `.form-check` and `.form-switch` components are now built with CSS variables for setting the `background-image`. The usage here differs from other components in that the various focus, active, etc states for each component aren't set on the base class. Instead, the states override one variable (e.g., `--bs-form-switch-bg`).
+
+- Floating form labels now have a `background-color` to fix support for `<textarea>` elements. Additional changes have been made to also support disabled states and more.
+
+- Fixed display of date and time inputs in WebKit based browsers.
+
+### Utilities
+
+- <span class="badge text-warning-emphasis bg-warning-subtle">Deprecated</span> `.text-muted` will be be replaced by `.text-body-secondary` in v6.
+
+  With the addition of the expanded theme colors and variables, the `.text-muted` variables and utility have been deprecated with v5.3.0. Its default value has also has been reassigned to the new `--bs-secondary-color` CSS variable to better support color modes. It will be removed in v6.0.0.
+
+- Adds new `.overflow-x`, `.overflow-y`, and several `.object-fit-*` utilities. _The object-fit property is used to specify how an `<img>` or `<video>` should be resized to fit its container, giving us a responsive alternative to using `background-image` for a resizable fill/fit image._
+
+- Adds new `.fw-medium` utility.
+
+- Added new [`.z-*` utilities]({{< docsref "/utilities/z-index" >}}) for `z-index`.
+
+- [Box shadow utilities]({{< docsref "/utilities/shadows" >}}) (and Sass variables) have been updated for dark mode. They now use `--bs-body-color-rgb` to generate the `rgba()` color values, allowing them to easily adapt to color modes based on the specified foreground color.
+
+For a complete list of changes, [see the v5.3.0 project on GitHub](https://github.com/twbs/bootstrap/projects/).
+
 ## v5.2.0
 
 <hr class="mb-4">
@@ -150,7 +289,7 @@ Want more information? [Read the v5.1.0 blog post.](https://blog.getbootstrap.co
 - Renamed "Navs" component page to "Navs & Tabs".
 - Renamed "Checks" page to "Checks & radios".
 - Redesigned the navbar and added a new subnav to make it easier to get around our sites and docs versions.
-- Added new keyboard shortcut for the search field: <kbd>Ctrl + /</kbd>.
+- Added new keyboard shortcut for the search field: <kbd><kbd>Ctrl</kbd> + <kbd>/</kbd></kbd>.
 
 ## Sass
 
@@ -457,7 +596,7 @@ Want more information? [Read the v5.1.0 blog post.](https://blog.getbootstrap.co
 
 - <span class="badge bg-danger">Breaking</span> Renamed `.font-weight-*` utilities as `.fw-*` for brevity and consistency.
 
-- <span class="badge bg-danger">Breaking</span> Renamed `.font-style-*` utilities as `.fst-*` for brevity and consistency.
+- <span class="badge bg-danger">Breaking</span> Renamed `.font-italic` utility to `.fst-italic` for brevity and consistency with new `.fst-normal` utility.
 
 - Added `.d-grid` to display utilities and new `gap` utilities (`.gap`) for CSS Grid and flexbox layouts.
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/api.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/api.md
index 81017ee8e..a4da94224 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/api.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/api.md
@@ -3,7 +3,7 @@ layout: docs
 title: Utility API
 description: The utility API is a Sass-based tool to generate utility classes.
 group: utilities
-aliases: "/docs/5.2/utilities/"
+aliases: "/docs/5.3/utilities/"
 toc: true
 ---
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/background.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/background.md
index fe0bf573b..dad71ec37 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/background.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/background.md
@@ -14,11 +14,16 @@ Similar to the contextual text color classes, set the background of an element t
 {{< colors.inline >}}
 {{- range (index $.Site.Data "theme-colors") }}
 <div class="p-3 mb-2 bg-{{ .name }}{{ if .contrast_color }} text-{{ .contrast_color }}{{ else }} text-white{{ end }}">.bg-{{ .name }}</div>
+<div class="p-3 mb-2 bg-{{ .name }}-subtle text-emphasis-{{ .name }}">.bg-{{ .name }}-subtle</div>
 {{- end -}}
 {{< /colors.inline >}}
-<div class="p-3 mb-2 bg-body text-dark">.bg-body</div>
+<p class="p-3 mb-2 bg-body-secondary">.bg-body-secondary</p>
+<p class="p-3 mb-2 bg-body-tertiary">.bg-body-tertiary</p>
+
+<div class="p-3 mb-2 bg-body text-body">.bg-body</div>
+<div class="p-3 mb-2 bg-black text-white">.bg-black</div>
 <div class="p-3 mb-2 bg-white text-dark">.bg-white</div>
-<div class="p-3 mb-2 bg-transparent text-dark">.bg-transparent</div>
+<div class="p-3 mb-2 bg-transparent text-body">.bg-transparent</div>
 {{< /example >}}
 
 ## Background gradient
@@ -33,6 +38,7 @@ Do you need a gradient in your custom CSS? Just add `background-image: var(--bs-
 <div class="p-3 mb-2 bg-{{ .name }} bg-gradient{{ with .contrast_color }} text-{{ . }}{{ else }} text-white{{ end }}">.bg-{{ .name }}.bg-gradient</div>
 {{- end -}}
 {{< /colors.inline >}}
+<div class="p-3 mb-2 bg-black bg-gradient text-white">.bg-black.bg-gradient</div>
 {{< /markdown >}}
 
 ## Opacity
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/borders.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/borders.md
index 8d850a214..50df793f2 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/borders.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/borders.md
@@ -42,6 +42,7 @@ Change the border color using utilities built on our theme colors.
 {{< border.inline >}}
 {{- range (index $.Site.Data "theme-colors") }}
 <span class="border border-{{ .name }}"></span>
+<span class="border border-{{ .name }}-subtle"></span>
 {{- end -}}
 {{< /border.inline >}}
 <span class="border border-white"></span>
@@ -139,6 +140,14 @@ Use the scaling classes for larger or smaller rounded corners. Sizes range from
 {{< placeholder width="75" height="75" class="rounded-5" title="Example extra large rounded image" >}}
 {{< /example >}}
 
+{{< example class="bd-example-rounded-utils" >}}
+{{< placeholder width="75" height="75" class="rounded-bottom-1" title="Example small rounded image" >}}
+{{< placeholder width="75" height="75" class="rounded-start-2" title="Example default left rounded image" >}}
+{{< placeholder width="75" height="75" class="rounded-end-circle" title="Example right completely round image" >}}
+{{< placeholder width="75" height="75" class="rounded-start-pill" title="Example left rounded pill image" >}}
+{{< placeholder width="75" height="75" class="rounded-5 rounded-top-0" title="Example extra large bottom rounded image" >}}
+{{< /example >}}
+
 ## CSS
 
 ### Variables
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/colors.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/colors.md
index eb917f91c..4b1647242 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/colors.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/colors.md
@@ -14,12 +14,19 @@ Colorize text with color utilities. If you want to colorize links, you can use t
 {{< colors.inline >}}
 {{- range (index $.Site.Data "theme-colors") }}
 <p class="text-{{ .name }}{{ with .contrast_color }} bg-{{ . }}{{ end }}">.text-{{ .name }}</p>
+<p class="text-{{ .name }}-emphasis">.text-{{ .name }}-emphasis</p>
 {{- end -}}
 {{< /colors.inline >}}
 <p class="text-body">.text-body</p>
 <p class="text-muted">.text-muted</p>
+
+<p class="text-body-emphasis">.text-body-emphasis</p>
+<p class="text-body-secondary">.text-body-secondary</p>
+<p class="text-body-tertiary">.text-body-tertiary</p>
+
+<p class="text-black bg-white">.text-black</p>
 <p class="text-white bg-dark">.text-white</p>
-<p class="text-black-50">.text-black-50</p>
+<p class="text-black-50 bg-white">.text-black-50</p>
 <p class="text-white-50 bg-dark">.text-white-50</p>
 {{< /example >}}
 
@@ -27,8 +34,12 @@ Colorize text with color utilities. If you want to colorize links, you can use t
 **Deprecation:** With the addition of `.text-opacity-*` utilities and CSS variables for text utilities, `.text-black-50` and `.text-white-50` are deprecated as of v5.1.0. They'll be removed in v6.0.0.
 {{< /callout >}}
 
+{{< callout warning >}}
+**Deprecation:** With the addition of the expanded theme colors and variables, the `.text-muted` utility has been deprecated as of v5.3.0. Its default value has also has been reassigned to the new `--bs-secondary-color` CSS variable to better support color modes. It will be removed in v6.0.0.
+{{< /callout >}}
+
 {{< callout info >}}
-{{< partial "callout-warning-color-assistive-technologies.md" >}}
+{{< partial "callouts/warning-color-assistive-technologies.md" >}}
 {{< /callout >}}
 
 ## Opacity
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/display.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/display.md
index 5ed825acb..1962f4bd2 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/display.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/display.md
@@ -64,8 +64,8 @@ To show an element only on a given interval of screen sizes you can combine one
 | Hidden only on sm | `.d-sm-none .d-md-block` |
 | Hidden only on md | `.d-md-none .d-lg-block` |
 | Hidden only on lg | `.d-lg-none .d-xl-block` |
-| Hidden only on xl | `.d-xl-none` |
-| Hidden only on xxl | `.d-xxl-none .d-xxl-block` |
+| Hidden only on xl | `.d-xl-none .d-xxl-block` |
+| Hidden only on xxl | `.d-xxl-none` |
 | Visible on all | `.d-block` |
 | Visible only on xs | `.d-block .d-sm-none` |
 | Visible only on sm | `.d-none .d-sm-block .d-md-none` |
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/flex.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/flex.md
index 567befe0e..e29503434 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/flex.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/flex.md
@@ -363,21 +363,20 @@ Change how flex items wrap in a flex container. Choose from no wrapping at all (
 
 <div class="bd-example bd-example-flex">
   <div class="d-flex flex-wrap">
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
+    <div class="p-2">Flex item 1</div>
+    <div class="p-2">Flex item 2</div>
+    <div class="p-2">Flex item 3</div>
+    <div class="p-2">Flex item 4</div>
+    <div class="p-2">Flex item 5</div>
+    <div class="p-2">Flex item 6</div>
+    <div class="p-2">Flex item 7</div>
+    <div class="p-2">Flex item 8</div>
+    <div class="p-2">Flex item 9</div>
+    <div class="p-2">Flex item 10</div>
+    <div class="p-2">Flex item 11</div>
+    <div class="p-2">Flex item 12</div>
+    <div class="p-2">Flex item 13</div>
+    <div class="p-2">Flex item 14</div>
   </div>
 </div>
 
@@ -389,21 +388,20 @@ Change how flex items wrap in a flex container. Choose from no wrapping at all (
 
 <div class="bd-example bd-example-flex">
   <div class="d-flex flex-wrap-reverse">
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
-    <div class="p-2">Flex item</div>
+    <div class="p-2">Flex item 1</div>
+    <div class="p-2">Flex item 2</div>
+    <div class="p-2">Flex item 3</div>
+    <div class="p-2">Flex item 4</div>
+    <div class="p-2">Flex item 5</div>
+    <div class="p-2">Flex item 6</div>
+    <div class="p-2">Flex item 7</div>
+    <div class="p-2">Flex item 8</div>
+    <div class="p-2">Flex item 9</div>
+    <div class="p-2">Flex item 10</div>
+    <div class="p-2">Flex item 11</div>
+    <div class="p-2">Flex item 12</div>
+    <div class="p-2">Flex item 13</div>
+    <div class="p-2">Flex item 14</div>
   </div>
 </div>
 
@@ -464,7 +462,7 @@ Additionally there are also responsive `.order-first` and `.order-last` classes
 
 ## Align content
 
-Use `align-content` utilities on flexbox containers to align flex items *together* on the cross axis. Choose from `start` (browser default), `end`, `center`, `between`, `around`, or `stretch`. To demonstrate these utilities, we've enforced `flex-wrap: wrap` and increased the number of flex items.
+Use `align-content` utilities on flexbox containers to align flex items _together_ on the cross axis. Choose from `start` (browser default), `end`, `center`, `between`, `around`, or `stretch`. To demonstrate these utilities, we've enforced `flex-wrap: wrap` and increased the number of flex items.
 
 **Heads up!** This property has no effect on single rows of flex items.
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/float.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/float.md
index a18c21471..a18c21471 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/float.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/float.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/interactions.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/interactions.md
index 35ea2b995..0e8ea001f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/interactions.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/interactions.md
@@ -31,7 +31,7 @@ The `.pe-none` class (and the `pointer-events` CSS property it sets) only preven
 If possible, the simpler solution is:
 
 - For form controls, add the `disabled` HTML attribute.
-* For links, remove the `href` attribute, making it a non-interactive anchor or placeholder link.
+- For links, remove the `href` attribute, making it a non-interactive anchor or placeholder link.
 
 ## Sass
 
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/object-fit.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/object-fit.md
new file mode 100644
index 000000000..4d6c476eb
--- /dev/null
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/object-fit.md
@@ -0,0 +1,61 @@
+---
+layout: docs
+title: Object fit
+description: Use the object fit utilities to modify how the content of a [replaced element](https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element), such as an `<img>` or `<video>`, should be resized to fit its container.
+group: utilities
+toc: true
+---
+
+## How it works
+
+Change the value of the [`object-fit` property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) with our responsive `object-fit` utility classes. This property tells the content to fill the parent container in a variety of ways, such as preserving the aspect ratio or stretching to take up as much space as possible.
+
+Classes for the value of `object-fit` are named using the format `.object-fit-{value}`. Choose from the following values:
+
+- `contain`
+- `cover`
+- `fill`
+- `scale` (for scale-down)
+- `none`
+
+## Examples
+
+Add the `object-fit-{value}` class to the [replaced element](https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element):
+
+{{< example class="d-flex overflow-auto" >}}
+{{< placeholder width="140" height="120" class="object-fit-contain border rounded" text="Object fit contain" markup="img" >}}
+{{< placeholder width="140" height="120" class="object-fit-cover border rounded" text="Object fit cover" markup="img" >}}
+{{< placeholder width="140" height="120" class="object-fit-fill border rounded" text="Object fit fill" markup="img" >}}
+{{< placeholder width="140" height="120" class="object-fit-scale border rounded" text="Object fit scale down" markup="img" >}}
+{{< placeholder width="140" height="120" class="object-fit-none border rounded" text="Object fit none" markup="img" >}}
+{{< /example >}}
+
+## Responsive
+
+Responsive variations also exist for each `object-fit` value using the format `.object-fit-{breakpoint}-{value}`, for the following breakpoint abbreviations: `sm`, `md`, `lg`, `xl`, and `xxl`. Classes can be combined for various effects as you need.
+
+{{< example class="d-flex overflow-auto" >}}
+{{< placeholder width="140" height="80" class="object-fit-sm-contain border rounded" text="Contain on sm" markup="img" >}}
+{{< placeholder width="140" height="80" class="object-fit-md-contain border rounded" text="Contain on md" markup="img" >}}
+{{< placeholder width="140" height="80" class="object-fit-lg-contain border rounded" text="Contain on lg" markup="img" >}}
+{{< placeholder width="140" height="80" class="object-fit-xl-contain border rounded" text="Contain on xl" markup="img" >}}
+{{< placeholder width="140" height="80" class="object-fit-xxl-contain border rounded" text="Contain on xxl" markup="img" >}}
+{{< /example >}}
+
+## Video
+
+The `.object-fit-{value}` and responsive `.object-fit-{breakpoint}-{value}` utilities also work on `<video>` elements.
+
+```html
+<video src="..." class="object-fit-contain" autoplay></video>
+<video src="..." class="object-fit-cover" autoplay></video>
+<video src="..." class="object-fit-fill" autoplay></video>
+<video src="..." class="object-fit-scale" autoplay></video>
+<video src="..." class="object-fit-none" autoplay></video>
+```
+
+## Utilities API
+
+Object fit 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-object-fit" file="scss/_utilities.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/opacity.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/opacity.md
index 5cc4c225f..5cc4c225f 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/opacity.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/opacity.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/overflow.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/overflow.md
new file mode 100644
index 000000000..c4cb0092c
--- /dev/null
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/overflow.md
@@ -0,0 +1,99 @@
+---
+layout: docs
+title: Overflow
+description: Use these shorthand utilities for quickly configuring how content overflows an element.
+group: utilities
+toc: true
+---
+
+## Overflow
+
+Adjust the `overflow` property on the fly with four default values and classes. These classes are not responsive by default.
+
+<div class="bd-example d-md-flex">
+  <div class="overflow-auto p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary" style="max-width: 260px; max-height: 100px;">
+    This is an example of using <code>.overflow-auto</code> on an element with set width and height dimensions. By design, this content will vertically scroll.
+  </div>
+  <div class="overflow-hidden p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary" style="max-width: 260px; max-height: 100px;">
+    This is an example of using <code>.overflow-hidden</code> on an element with set width and height dimensions.
+  </div>
+  <div class="overflow-visible p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary" style="max-width: 260px; max-height: 100px;">
+    This is an example of using <code>.overflow-visible</code> on an element with set width and height dimensions.
+  </div>
+  <div class="overflow-scroll p-3 bg-body-tertiary" style="max-width: 260px; max-height: 100px;">
+    This is an example of using <code>.overflow-scroll</code> on an element with set width and height dimensions.
+  </div>
+</div>
+
+```html
+<div class="overflow-auto">...</div>
+<div class="overflow-hidden">...</div>
+<div class="overflow-visible">...</div>
+<div class="overflow-scroll">...</div>
+```
+
+### `overflow-x`
+
+Adjust the `overflow-x` property to affect the overflow of content horizontally.
+
+<div class="bd-example d-md-flex">
+  <div class="overflow-x-auto p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px; white-space: nowrap;">
+    <div><code>.overflow-x-auto</code> example on an element</div>
+    <div> with set width and height dimensions.</div>
+  </div>
+  <div class="overflow-x-hidden p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px;white-space: nowrap;">
+    <div><code>.overflow-x-hidden</code> example</div>
+    <div>on an element with set width and height dimensions.</div>
+  </div>
+  <div class="overflow-x-visible p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px;white-space: nowrap;">
+    <div><code>.overflow-x-visible</code> example </div>
+    <div>on an element with set width and height dimensions.</div>
+  </div>
+  <div class="overflow-x-scroll p-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px;white-space: nowrap;">
+    <div><code>.overflow-x-scroll</code> example on an element</div>
+    <div> with set width and height dimensions.</div>
+  </div>
+</div>
+
+```html
+<div class="overflow-x-auto">...</div>
+<div class="overflow-x-hidden">...</div>
+<div class="overflow-x-visible">...</div>
+<div class="overflow-x-scroll">...</div>
+```
+
+### `overflow-y`
+
+Adjust the `overflow-y` property to affect the overflow of content vertically.
+
+<div class="bd-example d-md-flex">
+  <div class="overflow-y-auto p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px;">
+    <code>.overflow-y-auto</code> example on an element with set width and height dimensions.
+  </div>
+  <div class="overflow-y-hidden p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px;">
+    <code>.overflow-y-hidden</code> example on an element with set width and height dimensions.
+  </div>
+  <div class="overflow-y-visible p-3 mb-3 mb-md-0 me-md-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px;">
+    <code>.overflow-y-visible</code> example on an element with set width and height dimensions.
+  </div>
+  <div class="overflow-y-scroll p-3 bg-body-tertiary w-100" style="max-width: 200px; max-height: 100px;">
+    <code>.overflow-y-scroll</code> example on an element with set width and height dimensions.
+  </div>
+</div>
+
+```html
+<div class="overflow-y-auto">...</div>
+<div class="overflow-y-hidden">...</div>
+<div class="overflow-y-visible">...</div>
+<div class="overflow-y-scroll">...</div>
+```
+
+Using Sass variables, you may customize the overflow utilities by changing the `$overflows` variable in `_variables.scss`.
+
+## Sass
+
+### Utilities API
+
+Overflow 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-overflow" file="scss/_utilities.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/position.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/position.md
index 5a6e849cc..0ba0dd769 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/position.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/position.md
@@ -88,14 +88,14 @@ By adding `.translate-middle-x` or `.translate-middle-y` classes, elements can b
 
 Here are some real life examples of these classes:
 
-{{< example class="bd-example-position-examples d-flex justify-content-around" >}}
+{{< example class="bd-example-position-examples d-flex justify-content-around align-items-center" >}}
 <button type="button" class="btn btn-primary position-relative">
   Mails <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-secondary">+99 <span class="visually-hidden">unread messages</span></span>
 </button>
 
-<button type="button" class="btn btn-dark position-relative">
-  Marker <svg width="1em" height="1em" viewBox="0 0 16 16" class="position-absolute top-100 start-50 translate-middle mt-1" fill="#212529" xmlns="http://www.w3.org/2000/svg"><path d="M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"/></svg>
-</button>
+<div class="position-relative py-2 px-4 text-bg-dark border border-dark rounded-pill">
+  Marker <svg width="1em" height="1em" viewBox="0 0 16 16" class="position-absolute top-100 start-50 translate-middle mt-1" fill="var(--bs-dark)" xmlns="http://www.w3.org/2000/svg"><path d="M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"/></svg>
+</div>
 
 <button type="button" class="btn btn-primary position-relative">
   Alerts <span class="position-absolute top-0 start-100 translate-middle badge border border-light rounded-circle bg-danger p-2"><span class="visually-hidden">unread messages</span></span>
@@ -106,8 +106,8 @@ You can use these classes with existing components to create new ones. Remember
 
 {{< example class="bd-example-position-examples" >}}
 <div class="position-relative m-4">
-  <div class="progress" style="height: 1px;">
-    <div class="progress-bar" role="progressbar" aria-label="Progress" style="width: 50%;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
+  <div class="progress" role="progressbar" aria-label="Progress" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="height: 1px;">
+    <div class="progress-bar" style="width: 50%"></div>
   </div>
   <button type="button" class="position-absolute top-0 start-0 translate-middle btn btn-sm btn-primary rounded-pill" style="width: 2rem; height:2rem;">1</button>
   <button type="button" class="position-absolute top-0 start-50 translate-middle btn btn-sm btn-primary rounded-pill" style="width: 2rem; height:2rem;">2</button>
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/shadows.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/shadows.md
index bb5ef44ab..9872d4519 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/shadows.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/shadows.md
@@ -10,11 +10,11 @@ toc: true
 
 While shadows on components are disabled by default in Bootstrap and can be enabled via `$enable-shadows`, you can also quickly add or remove a shadow with our `box-shadow` utility classes. Includes support for `.shadow-none` and three default sizes (which have associated variables to match).
 
-{{< example >}}
-<div class="shadow-none p-3 mb-5 bg-light rounded">No shadow</div>
-<div class="shadow-sm p-3 mb-5 bg-body rounded">Small shadow</div>
-<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 class="overflow-hidden" >}}
+<div class="shadow-none p-3 mb-5 bg-body-tertiary rounded">No shadow</div>
+<div class="shadow-sm p-3 mb-5 bg-body-tertiary rounded">Small shadow</div>
+<div class="shadow p-3 mb-5 bg-body-tertiary rounded">Regular shadow</div>
+<div class="shadow-lg p-3 mb-5 bg-body-tertiary rounded">Larger shadow</div>
 {{< /example >}}
 
 ## Sass
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/sizing.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/sizing.md
index 962575ffe..b8b58ddfd 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/sizing.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/sizing.md
@@ -10,12 +10,12 @@ toc: true
 
 Width and height utilities are generated from the utility API in `_utilities.scss`. Includes support for `25%`, `50%`, `75%`, `100%`, and `auto` by default. Modify those values as you need to generate different utilities here.
 
-{{< example >}}
-<div class="w-25 p-3" style="background-color: #eee;">Width 25%</div>
-<div class="w-50 p-3" style="background-color: #eee;">Width 50%</div>
-<div class="w-75 p-3" style="background-color: #eee;">Width 75%</div>
-<div class="w-100 p-3" style="background-color: #eee;">Width 100%</div>
-<div class="w-auto p-3" style="background-color: #eee;">Width auto</div>
+{{< example class="bd-example-flex" >}}
+<div class="w-25 p-3">Width 25%</div>
+<div class="w-50 p-3">Width 50%</div>
+<div class="w-75 p-3">Width 75%</div>
+<div class="w-100 p-3">Width 100%</div>
+<div class="w-auto p-3">Width auto</div>
 {{< /example >}}
 
 {{< example >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/spacing.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/spacing.md
index 1e5f6d32f..3d17e081d 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/spacing.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/spacing.md
@@ -100,18 +100,45 @@ The syntax is nearly the same as the default, positive margin utilities, but wit
 
 ## Gap
 
-When using `display: grid`, you can make use of `gap` utilities on the parent grid container. This can save on having to add margin utilities to individual grid items (children of a `display: grid` container). Gap utilities are responsive by default, and are generated via our utilities API, based on the `$spacers` Sass map.
-
-{{< example html >}}
-<div class="d-grid gap-3">
-  <div class="p-2 bg-light border">Grid item 1</div>
-  <div class="p-2 bg-light border">Grid item 2</div>
-  <div class="p-2 bg-light border">Grid item 3</div>
+When using `display: grid` or `display: flex`, you can make use of `gap` utilities on the parent element. This can save on having to add margin utilities to individual children of a grid or flex container. Gap utilities are responsive by default, and are generated via our utilities API, based on the `$spacers` Sass map.
+
+{{< example class="bd-example-cssgrid" >}}
+<div class="grid gap-3">
+  <div class="p-2 g-col-6">Grid item 1</div>
+  <div class="p-2 g-col-6">Grid item 2</div>
+  <div class="p-2 g-col-6">Grid item 3</div>
+  <div class="p-2 g-col-6">Grid item 4</div>
 </div>
 {{< /example >}}
 
 Support includes responsive options for all of Bootstrap's grid breakpoints, as well as six sizes from the `$spacers` map (`0`–`5`). There is no `.gap-auto` utility class as it's effectively the same as `.gap-0`.
 
+### row-gap
+
+`row-gap` sets the vertical space between children items in the specified container.
+
+{{< example class="bd-example-cssgrid" >}}
+<div class="grid gap-0 row-gap-3">
+  <div class="p-2 g-col-6">Grid item 1</div>
+  <div class="p-2 g-col-6">Grid item 2</div>
+  <div class="p-2 g-col-6">Grid item 3</div>
+  <div class="p-2 g-col-6">Grid item 4</div>
+</div>
+{{< /example >}}
+
+### column-gap
+
+`column-gap` sets the horizontal space between children items in the specified container.
+
+{{< example class="bd-example-cssgrid" >}}
+<div class="grid gap-0 column-gap-3">
+  <div class="p-2 g-col-6">Grid item 1</div>
+  <div class="p-2 g-col-6">Grid item 2</div>
+  <div class="p-2 g-col-6">Grid item 3</div>
+  <div class="p-2 g-col-6">Grid item 4</div>
+</div>
+{{< /example >}}
+
 ## Sass
 
 ### Maps
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/text.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/text.md
index 060194f1b..5b3cd028b 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/text.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/text.md
@@ -38,7 +38,7 @@ Wrap text with a `.text-wrap` class.
 Prevent text from wrapping with a `.text-nowrap` class.
 
 {{< example >}}
-<div class="text-nowrap bg-light border" style="width: 8rem;">
+<div class="text-nowrap bg-body-secondary border" style="width: 8rem;">
   This text should overflow the parent.
 </div>
 {{< /example >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/vertical-align.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/vertical-align.md
index 9fe0eeb93..9fe0eeb93 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/vertical-align.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/vertical-align.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/visibility.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/visibility.md
index 61eb30241..61eb30241 100644
--- a/vendor/twbs/bootstrap/site/content/docs/5.2/utilities/visibility.md
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/visibility.md
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/z-index.md b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/z-index.md
new file mode 100644
index 000000000..5e4fe05b0
--- /dev/null
+++ b/vendor/twbs/bootstrap/site/content/docs/5.3/utilities/z-index.md
@@ -0,0 +1,44 @@
+---
+layout: docs
+title: Z-index
+description: Use our low-level `z-index` utilities to quickly change the stack level of an element or component.
+group: utilities
+toc: true
+added: "5.3"
+---
+
+## Example
+
+Use `z-index` utilities to stack elements on top of one another. Requires a `position` value other than `static`, which can be set with custom styles or using our [position utilities]({{< docsref "/utilities/position/" >}}).
+
+{{< callout >}}
+We call these "low-level" `z-index` utilities because of their default values of `-1` through `3`, which we use for the layout of overlapping components. High-level `z-index` values are used for overlay components like modals and tooltips.
+{{< /callout >}}
+
+{{< example class="bd-example-zindex-levels position-relative" >}}
+<div class="z-3 position-absolute p-5 rounded-3"></div>
+<div class="z-2 position-absolute p-5 rounded-3"></div>
+<div class="z-1 position-absolute p-5 rounded-3"></div>
+<div class="z-0 position-absolute p-5 rounded-3"></div>
+<div class="z-n1 position-absolute p-5 rounded-3"></div>
+{{< /example >}}
+
+## Overlays
+
+Bootstrap overlay components—dropdown, modal, offcanvas, popover, toast, and tooltip—all have their own `z-index` values to ensure a usable experience with competing "layers" of an interface.
+
+Read about them in the [`z-index` layout page]({{< docsref "/layout/z-index" >}}).
+
+## Component approach
+
+On some components, we use our low-level `z-index` values to manage repeating elements that overlap one another (like buttons in a button group or items in a list group).
+
+Learn about our [`z-index` approach]({{< docsref "/extend/approach#z-index-scales" >}}).
+
+## CSS
+
+### Sass map
+
+Customize this Sass map to change the available values and generated utilities.
+
+{{< scss-docs name="zindex-levels-map" file="scss/_variables.scss" >}}
diff --git a/vendor/twbs/bootstrap/site/content/docs/_index.html b/vendor/twbs/bootstrap/site/content/docs/_index.html
index fe65dc364..b04e391bc 100644
--- a/vendor/twbs/bootstrap/site/content/docs/_index.html
+++ b/vendor/twbs/bootstrap/site/content/docs/_index.html
@@ -1,5 +1,5 @@
 ---
 layout: redirect
 sitemap_exclude: true
-redirect: "/docs/5.2/getting-started/introduction/"
+redirect: "/docs/5.3/getting-started/introduction/"
 ---