From 8baa861e304a990627393b21cbff406526fcf0fc Mon Sep 17 00:00:00 2001 From: Stefan Date: Fri, 3 Jun 2022 11:37:20 +0300 Subject: [PATCH] refactor: update product to v1.0.6 --- CHANGELOG.md | 5 + README.md | 2 +- assets/css/soft-ui-dashboard.css | 4688 +++++++++-------- assets/css/soft-ui-dashboard.css.map | 126 +- assets/css/soft-ui-dashboard.min.css | 10 +- assets/img/logo-ct-dark.png | Bin 0 -> 6956 bytes assets/img/logo-ct.png | Bin 6956 -> 5756 bytes assets/js/core/bootstrap.bundle.min.js | 6 +- assets/js/core/bootstrap.min.js | 6 +- assets/js/core/popper.min.js | 4 +- assets/js/soft-ui-dashboard.js | 31 +- assets/js/soft-ui-dashboard.js.map | 2 +- assets/js/soft-ui-dashboard.min.js | 2 +- assets/scss/soft-ui-dashboard/_misc.scss | 20 + assets/scss/soft-ui-dashboard/_navbar.scss | 3 +- assets/scss/soft-ui-dashboard/_rtl.scss | 2 - assets/scss/soft-ui-dashboard/_utilities.scss | 5 +- .../bootstrap/_accordion.scss | 76 +- .../soft-ui-dashboard/bootstrap/_alert.scss | 22 +- .../soft-ui-dashboard/bootstrap/_badge.scss | 21 +- .../bootstrap/_breadcrumb.scss | 34 +- .../bootstrap/_button-group.scss | 3 + .../soft-ui-dashboard/bootstrap/_buttons.scss | 97 +- .../soft-ui-dashboard/bootstrap/_card.scss | 92 +- .../soft-ui-dashboard/bootstrap/_close.scss | 2 +- .../bootstrap/_containers.scss | 2 +- .../bootstrap/_dropdown.scss | 138 +- .../bootstrap/_functions.scss | 8 +- .../soft-ui-dashboard/bootstrap/_grid.scss | 6 +- .../soft-ui-dashboard/bootstrap/_helpers.scss | 1 + .../bootstrap/_list-group.scss | 71 +- .../soft-ui-dashboard/bootstrap/_maps.scss | 54 + .../soft-ui-dashboard/bootstrap/_modal.scss | 114 +- .../soft-ui-dashboard/bootstrap/_nav.scss | 73 +- .../soft-ui-dashboard/bootstrap/_navbar.scss | 239 +- .../bootstrap/_offcanvas.scss | 178 +- .../bootstrap/_pagination.scss | 89 +- .../bootstrap/_placeholders.scss | 2 +- .../soft-ui-dashboard/bootstrap/_popover.scss | 144 +- .../bootstrap/_progress.scss | 29 +- .../soft-ui-dashboard/bootstrap/_reboot.scss | 67 +- .../soft-ui-dashboard/bootstrap/_root.scss | 64 +- .../bootstrap/_spinners.scss | 60 +- .../soft-ui-dashboard/bootstrap/_tables.scss | 55 +- .../soft-ui-dashboard/bootstrap/_toasts.scss | 51 +- .../soft-ui-dashboard/bootstrap/_tooltip.scss | 119 +- .../bootstrap/_utilities.scss | 69 +- .../bootstrap/_variables.scss | 234 +- .../bootstrap/bootstrap-grid.scss | 7 +- .../bootstrap/bootstrap-reboot.scss | 7 +- .../bootstrap/bootstrap-utilities.scss | 7 +- .../bootstrap/bootstrap.scss | 7 +- .../bootstrap/forms/_floating-labels.scss | 13 +- .../bootstrap/forms/_form-check.scss | 33 +- .../bootstrap/forms/_form-control.scss | 32 +- .../bootstrap/forms/_form-select.scss | 1 - .../bootstrap/helpers/_color-bg.scss | 10 + .../bootstrap/helpers/_colored-links.scss | 4 +- .../bootstrap/helpers/_position.scss | 8 +- .../bootstrap/helpers/_ratio.scss | 4 +- .../bootstrap/helpers/_vr.scss | 2 +- .../bootstrap/mixins/_alert.scss | 10 +- .../bootstrap/mixins/_breakpoints.scss | 16 +- .../bootstrap/mixins/_buttons.scss | 128 +- .../bootstrap/mixins/_container.scss | 6 +- .../bootstrap/mixins/_forms.scss | 8 + .../bootstrap/mixins/_gradients.scss | 2 +- .../bootstrap/mixins/_grid.scss | 22 +- .../bootstrap/mixins/_pagination.scss | 29 +- .../bootstrap/mixins/_reset-text.scss | 2 +- .../bootstrap/mixins/_table-variants.scss | 21 +- .../bootstrap/mixins/_utilities.scss | 11 +- .../soft-ui-dashboard/forms/_input-group.scss | 15 +- docs/documentation.html | 6 +- index.html | 21 +- package.json | 4 +- pages/billing.html | 8 +- pages/dashboard.html | 8 +- pages/profile.html | 8 +- pages/rtl.html | 206 +- pages/sign-in.html | 6 +- pages/sign-up.html | 6 +- pages/tables.html | 8 +- pages/virtual-reality.html | 8 +- 84 files changed, 4409 insertions(+), 3411 deletions(-) create mode 100644 assets/img/logo-ct-dark.png create mode 100644 assets/scss/soft-ui-dashboard/bootstrap/_maps.scss create mode 100644 assets/scss/soft-ui-dashboard/bootstrap/helpers/_color-bg.scss diff --git a/CHANGELOG.md b/CHANGELOG.md index 00909bc79..0cd7dbda5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ # Change Log +## [1.0.6] 2022-06-03 +### Updates and Improvements +- update Bootstrap to v5.2.0-beta1 +- fix input-group focus issue + ## [1.0.5] 2022-03-25 ### Update - update SCSS folder diff --git a/README.md b/README.md index 8c407cb85..31d62c532 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # [Soft UI Dashboard](http://demos.creative-tim.com/soft-ui-dashboard/pages/dashboard.html?ref=readme-sud) [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?url=https://www.creative-tim.com/product/soft-ui-dashboard&text=Check%20Soft%20UI%20Dashboard%20made%20by%20@CreativeTim%20#webdesign%20#dashboard%20#softdesign%20#html%20https://www.creative-tim.com/product/soft-ui-dashboard) [![Discord](https://badgen.net/badge/icon/discord?icon=discord&label)](https://discord.gg/FhCJCaHdQa) -![version](https://img.shields.io/badge/version-1.0.5-blue.svg) [![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/soft-ui-dashboard.svg)](https://github.com/creativetimofficial/soft-ui-dashboard/issues?q=is%3Aopen+is%3Aissue) [![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/soft-ui-dashboard.svg)](https://github.com/creativetimofficial/soft-ui-dashboard/issues?q=is%3Aissue+is%3Aclosed) +![version](https://img.shields.io/badge/version-1.0.6-blue.svg) [![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/soft-ui-dashboard.svg)](https://github.com/creativetimofficial/soft-ui-dashboard/issues?q=is%3Aopen+is%3Aissue) [![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/soft-ui-dashboard.svg)](https://github.com/creativetimofficial/soft-ui-dashboard/issues?q=is%3Aissue+is%3Aclosed) ![Image](https://s3.amazonaws.com/creativetim_bucket/products/450/original/opt_sd_free_thumbnail.jpg?1617715816) diff --git a/assets/css/soft-ui-dashboard.css b/assets/css/soft-ui-dashboard.css index 33b230c28..7f1b48e97 100644 --- a/assets/css/soft-ui-dashboard.css +++ b/assets/css/soft-ui-dashboard.css @@ -1,7 +1,7 @@ /*! - * Bootstrap v5.1.3 (https://getbootstrap.com/) - * Copyright 2011-2021 The Bootstrap Authors - * Copyright 2011-2021 Twitter, Inc. + * Bootstrap v5.2.0-beta1 (https://getbootstrap.com/) + * Copyright 2011-2022 The Bootstrap Authors + * Copyright 2011-2022 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */ :root { @@ -58,6 +58,21 @@ --bs-body-line-height: 1.5; --bs-body-color: #67748e; --bs-body-bg: #fff; + --bs-border-width: 1px; + --bs-border-style: solid; + --bs-border-color: #dee2e6; + --bs-border-color-translucent: rgba(0, 0, 0, 0.175); + --bs-border-radius: 0.375rem; + --bs-border-radius-sm: 0.25rem; + --bs-border-radius-lg: 0.75rem; + --bs-border-radius-xl: 1rem; + --bs-border-radius-2xl: 1.5rem; + --bs-border-radius-pill: 50rem; + --bs-heading-color: #344767; + --bs-link-color: #cb0c9f; + --bs-link-hover-color: #830866; + --bs-code-color: #d63384; + --bs-highlight-bg: #fcf8e3; } *, @@ -88,15 +103,11 @@ body { hr { margin: 1rem 0; color: inherit; - background-color: currentColor; border: 0; + border-top: 1px solid; opacity: 0.25; } -hr:not([size]) { - height: 1px; -} - h1, .h1, h2, @@ -113,7 +124,7 @@ h6, margin-bottom: 0.5rem; font-weight: 400; line-height: 1.2; - color: #344767; + color: var(--bs-heading-color); } h1, @@ -183,8 +194,7 @@ p { margin-bottom: 1rem; } -abbr[title], -abbr[data-bs-original-title] { +abbr[title] { text-decoration: underline dotted; cursor: help; text-decoration-skip-ink: none; @@ -241,7 +251,7 @@ small, mark, .mark { padding: 0.2em; - background-color: #fcf8e3; + background-color: var(--bs-highlight-bg); } sub, @@ -261,12 +271,12 @@ sup { } a { - color: #cb0c9f; + color: var(--bs-link-color); text-decoration: none; } a:hover { - color: #830866; + color: var(--bs-link-hover-color); text-decoration: none; } @@ -282,10 +292,6 @@ kbd, samp { font-family: var(--bs-font-monospace); font-size: 1em; - direction: ltr - /* rtl:ignore */ - ; - unicode-bidi: bidi-override; } pre { @@ -304,7 +310,7 @@ pre code { code { font-size: 0.875em; - color: #d63384; + color: var(--bs-code-color); word-wrap: break-word; } @@ -403,8 +409,8 @@ select:disabled { opacity: 1; } -[list]::-webkit-calendar-picker-indicator { - display: none; +[list]:not([type="date"]):not([type="datetime-local"]):not([type="month"]):not([type="week"]):not([type="time"])::-webkit-calendar-picker-indicator { + display: none !important; } button, @@ -493,10 +499,6 @@ legend+* { ::file-selector-button { font: inherit; -} - -::-webkit-file-upload-button { - font: inherit; -webkit-appearance: button; } @@ -676,9 +678,11 @@ progress { .container-lg, .container-xl, .container-xxl { + --bs-gutter-x: 1.5rem; + --bs-gutter-y: 0; width: 100%; - padding-right: var(--bs-gutter-x, 1.5rem); - padding-left: var(--bs-gutter-x, 1.5rem); + padding-right: calc(var(--bs-gutter-x) * 1); + padding-left: calc(var(--bs-gutter-x) * 1); margin-right: auto; margin-left: auto; } @@ -2451,7 +2455,9 @@ progress { } .table { + --bs-table-color: #67748e; --bs-table-bg: transparent; + --bs-table-border-color: #e9ecef; --bs-table-accent-bg: transparent; --bs-table-striped-color: #67748e; --bs-table-striped-bg: rgba(0, 0, 0, 0.05); @@ -2461,9 +2467,9 @@ progress { --bs-table-hover-bg: rgba(0, 0, 0, 0.075); width: 100%; margin-bottom: 1rem; - color: #67748e; + color: var(--bs-table-color); vertical-align: top; - border-color: #e9ecef; + border-color: var(--bs-table-border-color); } .table> :not(caption)>*>* { @@ -2481,8 +2487,8 @@ progress { vertical-align: bottom; } -.table> :not(:first-child) { - border-top: 2px solid currentColor; +.table-group-divider { + border-top: calc(2 * $table-border-width) solid currentColor; } .caption-top { @@ -2514,6 +2520,11 @@ progress { color: var(--bs-table-striped-color); } +.table-striped-columns> :not(caption)>tr> :nth-child(even) { + --bs-table-accent-bg: var(--bs-table-striped-bg); + color: var(--bs-table-striped-color); +} + .table-active { --bs-table-accent-bg: var(--bs-table-active-bg); color: var(--bs-table-active-color); @@ -2525,99 +2536,115 @@ progress { } .table-primary { + --bs-table-color: #000; --bs-table-bg: #f5ceec; + --bs-table-border-color: #ddb9d4; --bs-table-striped-bg: #e9c4e0; --bs-table-striped-color: #000; --bs-table-active-bg: #ddb9d4; --bs-table-active-color: #000; --bs-table-hover-bg: #e3bfda; --bs-table-hover-color: #000; - color: #000; - border-color: #ddb9d4; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-secondary { + --bs-table-color: #000; --bs-table-bg: #e6e9ee; + --bs-table-border-color: #cfd2d6; --bs-table-striped-bg: #dbdde2; --bs-table-striped-color: #000; --bs-table-active-bg: #cfd2d6; --bs-table-active-color: #000; --bs-table-hover-bg: #d5d8dc; --bs-table-hover-color: #000; - color: #000; - border-color: #cfd2d6; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-success { + --bs-table-color: #000; --bs-table-bg: #e6f7d0; + --bs-table-border-color: #cfdebb; --bs-table-striped-bg: #dbebc6; --bs-table-striped-color: #000; --bs-table-active-bg: #cfdebb; --bs-table-active-color: #000; --bs-table-hover-bg: #d5e4c0; --bs-table-hover-color: #000; - color: #000; - border-color: #cfdebb; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-info { + --bs-table-color: #000; --bs-table-bg: #d1f3fa; + --bs-table-border-color: #bcdbe1; --bs-table-striped-bg: #c7e7ee; --bs-table-striped-color: #000; --bs-table-active-bg: #bcdbe1; --bs-table-active-color: #000; --bs-table-hover-bg: #c1e1e7; --bs-table-hover-color: #000; - color: #000; - border-color: #bcdbe1; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-warning { + --bs-table-color: #000; --bs-table-bg: #fef5d6; + --bs-table-border-color: #e5ddc1; --bs-table-striped-bg: #f1e9cb; --bs-table-striped-color: #000; --bs-table-active-bg: #e5ddc1; --bs-table-active-color: #000; --bs-table-hover-bg: #ebe3c6; --bs-table-hover-color: #000; - color: #000; - border-color: #e5ddc1; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-danger { + --bs-table-color: #000; --bs-table-bg: #fbcdcd; + --bs-table-border-color: #e2b9b9; --bs-table-striped-bg: #eec3c3; --bs-table-striped-color: #000; --bs-table-active-bg: #e2b9b9; --bs-table-active-color: #000; --bs-table-hover-bg: #e8bebe; --bs-table-hover-color: #000; - color: #000; - border-color: #e2b9b9; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-light { + --bs-table-color: #000; --bs-table-bg: #e9ecef; + --bs-table-border-color: #d2d4d7; --bs-table-striped-bg: #dde0e3; --bs-table-striped-color: #000; --bs-table-active-bg: #d2d4d7; --bs-table-active-color: #000; --bs-table-hover-bg: #d8dadd; --bs-table-hover-color: #000; - color: #000; - border-color: #d2d4d7; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-dark { + --bs-table-color: #fff; --bs-table-bg: #344767; + --bs-table-border-color: #485976; --bs-table-striped-bg: #3e506f; --bs-table-striped-color: #fff; --bs-table-active-bg: #485976; --bs-table-active-color: #fff; --bs-table-hover-bg: #435572; --bs-table-hover-color: #fff; - color: #fff; - border-color: #485976; + color: var(--bs-table-color); + border-color: var(--bs-table-border-color); } .table-responsive { @@ -2773,31 +2800,6 @@ progress { background-color: #f2f2f2; } -.form-control::-webkit-file-upload-button { - padding: 0.5rem 0.75rem; - margin: -0.5rem -0.75rem; - margin-inline-end: 0.75rem; - color: #495057; - background-color: #fff; - pointer-events: none; - border-color: inherit; - border-style: solid; - border-width: 0; - border-inline-end-width: 1px; - border-radius: 0; - transition: all 0.15s ease-in; -} - -@media (prefers-reduced-motion: reduce) { - .form-control::-webkit-file-upload-button { - transition: none; - } -} - -.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button { - background-color: #f2f2f2; -} - .form-control-plaintext { display: block; width: 100%; @@ -2829,12 +2831,6 @@ progress { margin-inline-end: 0.75rem; } -.form-control-sm::-webkit-file-upload-button { - padding: 0.25rem 0.75rem; - margin: -0.25rem -0.75rem; - margin-inline-end: 0.75rem; -} - .form-control-lg { min-height: unset; padding: 0.75rem 0.75rem; @@ -2848,12 +2844,6 @@ progress { margin-inline-end: 0.75rem; } -.form-control-lg::-webkit-file-upload-button { - padding: 0.75rem 0.75rem; - margin: -0.75rem -0.75rem; - margin-inline-end: 0.75rem; -} - textarea.form-control { min-height: unset; } @@ -2962,6 +2952,18 @@ textarea.form-control-lg { margin-left: -1.73em; } +.form-check-reverse { + padding-right: 1.73em; + padding-left: 0; + text-align: right; +} + +.form-check-reverse .form-check-input { + float: right; + margin-right: -1.73em; + margin-left: 0; +} + .form-check-input { width: 1.23em; height: 1.23em; @@ -2973,7 +2975,7 @@ textarea.form-control-lg { background-size: contain; border: none; appearance: none; - color-adjust: exact; + print-color-adjust: exact; transition: background-color 0.25s ease, border-color 0.25s ease, background-position 0.15s ease-in-out, opacity 0.15s ease-out, box-shadow 0.15s ease-in-out; } @@ -3028,6 +3030,7 @@ textarea.form-control-lg { .form-check-input[disabled]~.form-check-label, .form-check-input:disabled~.form-check-label { + cursor: default; opacity: 0.5; } @@ -3059,6 +3062,16 @@ textarea.form-control-lg { background-image: none; } +.form-switch.form-check-reverse { + padding-right: 3rem; + padding-left: 0; +} + +.form-switch.form-check-reverse .form-check-input { + margin-right: -3rem; + margin-left: 0; +} + .form-check-inline { display: inline-block; margin-right: 1rem; @@ -3179,6 +3192,7 @@ textarea.form-control-lg { } .form-floating>.form-control, +.form-floating>.form-control-plaintext, .form-floating>.form-select { height: calc(3.5rem + 2px); line-height: 1.25; @@ -3202,21 +3216,26 @@ textarea.form-control-lg { } } -.form-floating>.form-control { +.form-floating>.form-control, +.form-floating>.form-control-plaintext { padding: 1rem 0.75rem; } -.form-floating>.form-control::placeholder { +.form-floating>.form-control::placeholder, +.form-floating>.form-control-plaintext::placeholder { color: transparent; } .form-floating>.form-control:focus, -.form-floating>.form-control:not(:placeholder-shown) { +.form-floating>.form-control:not(:placeholder-shown), +.form-floating>.form-control-plaintext:focus, +.form-floating>.form-control-plaintext:not(:placeholder-shown) { padding-top: 1.625rem; padding-bottom: 0.625rem; } -.form-floating>.form-control:-webkit-autofill { +.form-floating>.form-control:-webkit-autofill, +.form-floating>.form-control-plaintext:-webkit-autofill { padding-top: 1.625rem; padding-bottom: 0.625rem; } @@ -3228,6 +3247,7 @@ textarea.form-control-lg { .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, +.form-floating>.form-control-plaintext~label, .form-floating>.form-select~label { opacity: 0.65; transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); @@ -3238,6 +3258,10 @@ textarea.form-control-lg { transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); } +.form-floating>.form-control-plaintext~label { + border-width: 1px 0; +} + .input-group { position: relative; display: flex; @@ -3396,6 +3420,11 @@ textarea.form-control.is-valid { box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.25); } +.was-validated .form-control-color:valid, +.form-control-color.is-valid { + width: calc(3rem + unset); +} + .was-validated .form-check-input:valid, .form-check-input.is-valid { border-color: #66d432; @@ -3506,6 +3535,11 @@ textarea.form-control.is-invalid { box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.25); } +.was-validated .form-control-color:invalid, +.form-control-color.is-invalid { + width: calc(3rem + unset); +} + .was-validated .form-check-input:invalid, .form-check-input.is-invalid { border-color: #fd5c70; @@ -3545,19 +3579,34 @@ textarea.form-control.is-invalid { } .btn { + --bs-btn-padding-x: 1.5rem; + --bs-btn-padding-y: 0.75rem; + --bs-btn-font-family: ; + --bs-btn-font-size: 0.75rem; + --bs-btn-font-weight: 700; + --bs-btn-line-height: 1.4; + --bs-btn-color: #67748e; + --bs-btn-bg: transparent; + --bs-btn-border-width: 1px; + --bs-btn-border-color: transparent; + --bs-btn-border-radius: 0.5rem; + --bs-btn-box-shadow: 0 4px 7px -1px rgba(0, 0, 0, 0.11), 0 2px 4px -1px rgba(0, 0, 0, 0.07); + --bs-btn-disabled-opacity: 0.65; + --bs-btn-focus-box-shadow: 0 0 0 0.2rem rgba(var(--bs-btn-focus-shadow-rgb), .5); display: inline-block; - font-weight: 700; - line-height: 1.4; - color: #67748e; + padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x); + font-family: var(--bs-btn-font-family); + font-size: var(--bs-btn-font-size); + font-weight: var(--bs-btn-font-weight); + line-height: var(--bs-btn-line-height); + color: var(--bs-btn-color); text-align: center; vertical-align: middle; cursor: pointer; user-select: none; - background-color: transparent; - border: 1px solid transparent; - padding: 0.75rem 1.5rem; - font-size: 0.75rem; - border-radius: 0.5rem; + border: var(--bs-btn-border-width) solid var(--bs-btn-border-color); + border-radius: var(--bs-btn-border-radius); + background-color: var(--bs-btn-bg); transition: all 0.15s ease-in; } @@ -3568,928 +3617,514 @@ textarea.form-control.is-invalid { } .btn:hover { - color: #67748e; + color: var(--bs-btn-hover-color); + background-color: var(--bs-btn-hover-bg); + border-color: var(--bs-btn-hover-border-color); } .btn-check:focus+.btn, .btn:focus { + color: var(--bs-btn-hover-color); + background-color: var(--bs-btn-hover-bg); + border-color: var(--bs-btn-hover-border-color); outline: 0; - box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07); + box-shadow: var(--bs-btn-focus-box-shadow); +} + +.btn-check:checked+.btn, +.btn-check:active+.btn, +.btn:active, +.btn.active, +.btn.show { + color: var(--bs-btn-active-color); + background-color: var(--bs-btn-active-bg); + border-color: var(--bs-btn-active-border-color); +} + +.btn-check:checked+.btn:focus, +.btn-check:active+.btn:focus, +.btn:active:focus, +.btn.active:focus, +.btn.show:focus { + box-shadow: var(--bs-btn-focus-box-shadow); } .btn:disabled, .btn.disabled, fieldset:disabled .btn { + color: var(--bs-btn-disabled-color); pointer-events: none; - opacity: 0.65; + background-color: var(--bs-btn-disabled-bg); + border-color: var(--bs-btn-disabled-border-color); + opacity: var(--bs-btn-disabled-opacity); } .btn-primary { - color: #fff; - background-color: #cb0c9f; - border-color: #cb0c9f; -} - -.btn-primary:hover { - color: #fff; - background-color: #ad0a87; - border-color: #a20a7f; + --bs-btn-color: #fff; + --bs-btn-bg: #cb0c9f; + --bs-btn-border-color: #cb0c9f; + --bs-btn-hover-color: #fff; + --bs-btn-hover-bg: #ad0a87; + --bs-btn-hover-border-color: #a20a7f; + --bs-btn-focus-shadow-rgb: 211, 48, 173; + --bs-btn-active-color: #fff; + --bs-btn-active-bg: #a20a7f; + --bs-btn-active-border-color: #980977; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #fff; + --bs-btn-disabled-bg: #cb0c9f; + --bs-btn-disabled-border-color: #cb0c9f; } -.btn-check:focus+.btn-primary, -.btn-primary:focus { - color: #fff; - background-color: #ad0a87; - border-color: #a20a7f; - box-shadow: 0 0 0 0.2rem rgba(211, 48, 173, 0.5); +.btn-secondary { + --bs-btn-color: #000; + --bs-btn-bg: #8392AB; + --bs-btn-border-color: #8392AB; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #96a2b8; + --bs-btn-hover-border-color: #8f9db3; + --bs-btn-focus-shadow-rgb: 111, 124, 145; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #9ca8bc; + --bs-btn-active-border-color: #8f9db3; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #000; + --bs-btn-disabled-bg: #8392AB; + --bs-btn-disabled-border-color: #8392AB; } -.btn-check:checked+.btn-primary, -.btn-check:active+.btn-primary, -.btn-primary:active, -.btn-primary.active, -.show>.btn-primary.dropdown-toggle { - color: #fff; - background-color: #a20a7f; - border-color: #980977; +.btn-success { + --bs-btn-color: #000; + --bs-btn-bg: #82d616; + --bs-btn-border-color: #82d616; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #95dc39; + --bs-btn-hover-border-color: #8fda2d; + --bs-btn-focus-shadow-rgb: 111, 182, 19; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #9bde45; + --bs-btn-active-border-color: #8fda2d; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #000; + --bs-btn-disabled-bg: #82d616; + --bs-btn-disabled-border-color: #82d616; } -.btn-check:checked+.btn-primary:focus, -.btn-check:active+.btn-primary:focus, -.btn-primary:active:focus, -.btn-primary.active:focus, -.show>.btn-primary.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(211, 48, 173, 0.5); +.btn-info { + --bs-btn-color: #000; + --bs-btn-bg: #17c1e8; + --bs-btn-border-color: #17c1e8; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #3acaeb; + --bs-btn-hover-border-color: #2ec7ea; + --bs-btn-focus-shadow-rgb: 20, 164, 197; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #45cded; + --bs-btn-active-border-color: #2ec7ea; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #000; + --bs-btn-disabled-bg: #17c1e8; + --bs-btn-disabled-border-color: #17c1e8; } -.btn-primary:disabled, -.btn-primary.disabled { - color: #fff; - background-color: #cb0c9f; - border-color: #cb0c9f; +.btn-warning { + --bs-btn-color: #000; + --bs-btn-bg: #fbcf33; + --bs-btn-border-color: #fbcf33; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #fcd652; + --bs-btn-hover-border-color: #fbd447; + --bs-btn-focus-shadow-rgb: 213, 176, 43; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #fcd95c; + --bs-btn-active-border-color: #fbd447; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #000; + --bs-btn-disabled-bg: #fbcf33; + --bs-btn-disabled-border-color: #fbcf33; } -.btn-secondary { - color: #000; - background-color: #8392AB; - border-color: #8392AB; +.btn-danger { + --bs-btn-color: #fff; + --bs-btn-bg: #ea0606; + --bs-btn-border-color: #ea0606; + --bs-btn-hover-color: #fff; + --bs-btn-hover-bg: #c70505; + --bs-btn-hover-border-color: #bb0505; + --bs-btn-focus-shadow-rgb: 237, 43, 43; + --bs-btn-active-color: #fff; + --bs-btn-active-bg: #bb0505; + --bs-btn-active-border-color: #b00505; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #fff; + --bs-btn-disabled-bg: #ea0606; + --bs-btn-disabled-border-color: #ea0606; } -.btn-secondary:hover { - color: #000; - background-color: #96a2b8; - border-color: #8f9db3; +.btn-light { + --bs-btn-color: #000; + --bs-btn-bg: #e9ecef; + --bs-btn-border-color: #e9ecef; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #eceff1; + --bs-btn-hover-border-color: #ebeef1; + --bs-btn-focus-shadow-rgb: 198, 201, 203; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #edf0f2; + --bs-btn-active-border-color: #ebeef1; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #000; + --bs-btn-disabled-bg: #e9ecef; + --bs-btn-disabled-border-color: #e9ecef; } -.btn-check:focus+.btn-secondary, -.btn-secondary:focus { - color: #000; - background-color: #96a2b8; - border-color: #8f9db3; - box-shadow: 0 0 0 0.2rem rgba(111, 124, 145, 0.5); +.btn-dark { + --bs-btn-color: #fff; + --bs-btn-bg: #344767; + --bs-btn-border-color: #344767; + --bs-btn-hover-color: #fff; + --bs-btn-hover-bg: #2c3c58; + --bs-btn-hover-border-color: #2a3952; + --bs-btn-focus-shadow-rgb: 82, 99, 126; + --bs-btn-active-color: #fff; + --bs-btn-active-bg: #2a3952; + --bs-btn-active-border-color: #27354d; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #fff; + --bs-btn-disabled-bg: #344767; + --bs-btn-disabled-border-color: #344767; } -.btn-check:checked+.btn-secondary, -.btn-check:active+.btn-secondary, -.btn-secondary:active, -.btn-secondary.active, -.show>.btn-secondary.dropdown-toggle { - color: #000; - background-color: #9ca8bc; - border-color: #8f9db3; +.btn-white { + --bs-btn-color: #000; + --bs-btn-bg: #fff; + --bs-btn-border-color: #fff; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: white; + --bs-btn-hover-border-color: white; + --bs-btn-focus-shadow-rgb: 217, 217, 217; + --bs-btn-active-color: #000; + --bs-btn-active-bg: white; + --bs-btn-active-border-color: white; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #000; + --bs-btn-disabled-bg: #fff; + --bs-btn-disabled-border-color: #fff; } -.btn-check:checked+.btn-secondary:focus, -.btn-check:active+.btn-secondary:focus, -.btn-secondary:active:focus, -.btn-secondary.active:focus, -.show>.btn-secondary.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(111, 124, 145, 0.5); +.btn-outline-primary { + --bs-btn-color: #cb0c9f; + --bs-btn-border-color: #cb0c9f; + --bs-btn-hover-color: #fff; + --bs-btn-hover-bg: #cb0c9f; + --bs-btn-hover-border-color: #cb0c9f; + --bs-btn-focus-shadow-rgb: 203, 12, 159; + --bs-btn-active-color: #fff; + --bs-btn-active-bg: #cb0c9f; + --bs-btn-active-border-color: #cb0c9f; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #cb0c9f; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-secondary:disabled, -.btn-secondary.disabled { - color: #000; - background-color: #8392AB; - border-color: #8392AB; +.btn-outline-secondary { + --bs-btn-color: #8392AB; + --bs-btn-border-color: #8392AB; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #8392AB; + --bs-btn-hover-border-color: #8392AB; + --bs-btn-focus-shadow-rgb: 131, 146, 171; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #8392AB; + --bs-btn-active-border-color: #8392AB; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #8392AB; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-success { - color: #000; - background-color: #82d616; - border-color: #82d616; +.btn-outline-success { + --bs-btn-color: #82d616; + --bs-btn-border-color: #82d616; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #82d616; + --bs-btn-hover-border-color: #82d616; + --bs-btn-focus-shadow-rgb: 130, 214, 22; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #82d616; + --bs-btn-active-border-color: #82d616; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #82d616; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-success:hover { - color: #000; - background-color: #95dc39; - border-color: #8fda2d; +.btn-outline-info { + --bs-btn-color: #17c1e8; + --bs-btn-border-color: #17c1e8; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #17c1e8; + --bs-btn-hover-border-color: #17c1e8; + --bs-btn-focus-shadow-rgb: 23, 193, 232; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #17c1e8; + --bs-btn-active-border-color: #17c1e8; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #17c1e8; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-check:focus+.btn-success, -.btn-success:focus { - color: #000; - background-color: #95dc39; - border-color: #8fda2d; - box-shadow: 0 0 0 0.2rem rgba(111, 182, 19, 0.5); +.btn-outline-warning { + --bs-btn-color: #fbcf33; + --bs-btn-border-color: #fbcf33; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #fbcf33; + --bs-btn-hover-border-color: #fbcf33; + --bs-btn-focus-shadow-rgb: 251, 207, 51; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #fbcf33; + --bs-btn-active-border-color: #fbcf33; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #fbcf33; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-check:checked+.btn-success, -.btn-check:active+.btn-success, -.btn-success:active, -.btn-success.active, -.show>.btn-success.dropdown-toggle { - color: #000; - background-color: #9bde45; - border-color: #8fda2d; +.btn-outline-danger { + --bs-btn-color: #ea0606; + --bs-btn-border-color: #ea0606; + --bs-btn-hover-color: #fff; + --bs-btn-hover-bg: #ea0606; + --bs-btn-hover-border-color: #ea0606; + --bs-btn-focus-shadow-rgb: 234, 6, 6; + --bs-btn-active-color: #fff; + --bs-btn-active-bg: #ea0606; + --bs-btn-active-border-color: #ea0606; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #ea0606; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-check:checked+.btn-success:focus, -.btn-check:active+.btn-success:focus, -.btn-success:active:focus, -.btn-success.active:focus, -.show>.btn-success.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(111, 182, 19, 0.5); +.btn-outline-light { + --bs-btn-color: #e9ecef; + --bs-btn-border-color: #e9ecef; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #e9ecef; + --bs-btn-hover-border-color: #e9ecef; + --bs-btn-focus-shadow-rgb: 233, 236, 239; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #e9ecef; + --bs-btn-active-border-color: #e9ecef; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #e9ecef; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-success:disabled, -.btn-success.disabled { - color: #000; - background-color: #82d616; - border-color: #82d616; +.btn-outline-dark { + --bs-btn-color: #344767; + --bs-btn-border-color: #344767; + --bs-btn-hover-color: #fff; + --bs-btn-hover-bg: #344767; + --bs-btn-hover-border-color: #344767; + --bs-btn-focus-shadow-rgb: 52, 71, 103; + --bs-btn-active-color: #fff; + --bs-btn-active-bg: #344767; + --bs-btn-active-border-color: #344767; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #344767; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-info { - color: #000; - background-color: #17c1e8; - border-color: #17c1e8; +.btn-outline-white { + --bs-btn-color: #fff; + --bs-btn-border-color: #fff; + --bs-btn-hover-color: #000; + --bs-btn-hover-bg: #fff; + --bs-btn-hover-border-color: #fff; + --bs-btn-focus-shadow-rgb: 255, 255, 255; + --bs-btn-active-color: #000; + --bs-btn-active-bg: #fff; + --bs-btn-active-border-color: #fff; + --bs-btn-active-shadow: none; + --bs-btn-disabled-color: #fff; + --bs-btn-disabled-bg: transparent; + --bs-gradient: none; } -.btn-info:hover { - color: #000; - background-color: #3acaeb; - border-color: #2ec7ea; +.btn-link { + --bs-btn-font-weight: 400; + --bs-btn-color: #cb0c9f; + --bs-btn-bg: transparent; + --bs-btn-border-color: transparent; + --bs-btn-hover-color: #830866; + --bs-btn-hover-border-color: transparent; + --bs-btn-active-border-color: transparent; + --bs-btn-disabled-color: #6c757d; + --bs-btn-disabled-border-color: transparent; + --bs-btn-box-shadow: none; + text-decoration: none; } -.btn-check:focus+.btn-info, -.btn-info:focus { - color: #000; - background-color: #3acaeb; - border-color: #2ec7ea; - box-shadow: 0 0 0 0.2rem rgba(20, 164, 197, 0.5); +.btn-link:hover, +.btn-link:focus { + text-decoration: none; } -.btn-check:checked+.btn-info, -.btn-check:active+.btn-info, -.btn-info:active, -.btn-info.active, -.show>.btn-info.dropdown-toggle { - color: #000; - background-color: #45cded; - border-color: #2ec7ea; +.btn-lg, +.btn-group-lg>.btn { + --bs-btn-padding-y: 0.875rem; + --bs-btn-padding-x: 4rem; + --bs-btn-font-size: 0.875rem; + --bs-btn-border-radius: 0.5rem; } -.btn-check:checked+.btn-info:focus, -.btn-check:active+.btn-info:focus, -.btn-info:active:focus, -.btn-info.active:focus, -.show>.btn-info.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(20, 164, 197, 0.5); +.btn-sm, +.btn-group-sm>.btn { + --bs-btn-padding-y: 0.5rem; + --bs-btn-padding-x: 2rem; + --bs-btn-font-size: 0.75rem; + --bs-btn-border-radius: 0.5rem; } -.btn-info:disabled, -.btn-info.disabled { - color: #000; - background-color: #17c1e8; - border-color: #17c1e8; +.fade { + transition: opacity 0.15s linear; } -.btn-warning { - color: #000; - background-color: #fbcf33; - border-color: #fbcf33; +@media (prefers-reduced-motion: reduce) { + .fade { + transition: none; + } } -.btn-warning:hover { - color: #000; - background-color: #fcd652; - border-color: #fbd447; +.fade:not(.show) { + opacity: 0; } -.btn-check:focus+.btn-warning, -.btn-warning:focus { - color: #000; - background-color: #fcd652; - border-color: #fbd447; - box-shadow: 0 0 0 0.2rem rgba(213, 176, 43, 0.5); +.collapse:not(.show) { + display: none; } -.btn-check:checked+.btn-warning, -.btn-check:active+.btn-warning, -.btn-warning:active, -.btn-warning.active, -.show>.btn-warning.dropdown-toggle { - color: #000; - background-color: #fcd95c; - border-color: #fbd447; +.collapsing { + height: 0; + overflow: hidden; + transition: height 0.35s ease; } -.btn-check:checked+.btn-warning:focus, -.btn-check:active+.btn-warning:focus, -.btn-warning:active:focus, -.btn-warning.active:focus, -.show>.btn-warning.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(213, 176, 43, 0.5); +@media (prefers-reduced-motion: reduce) { + .collapsing { + transition: none; + } } -.btn-warning:disabled, -.btn-warning.disabled { - color: #000; - background-color: #fbcf33; - border-color: #fbcf33; +.collapsing.collapse-horizontal { + width: 0; + height: auto; + transition: width 0.35s ease; } -.btn-danger { - color: #fff; - background-color: #ea0606; - border-color: #ea0606; +@media (prefers-reduced-motion: reduce) { + .collapsing.collapse-horizontal { + transition: none; + } } -.btn-danger:hover { - color: #fff; - background-color: #c70505; - border-color: #bb0505; +.dropup, +.dropend, +.dropdown, +.dropstart, +.dropup-center, +.dropdown-center { + position: relative; } -.btn-check:focus+.btn-danger, -.btn-danger:focus { - color: #fff; - background-color: #c70505; - border-color: #bb0505; - box-shadow: 0 0 0 0.2rem rgba(237, 43, 43, 0.5); +.dropdown-toggle { + white-space: nowrap; } -.btn-check:checked+.btn-danger, -.btn-check:active+.btn-danger, -.btn-danger:active, -.btn-danger.active, -.show>.btn-danger.dropdown-toggle { - color: #fff; - background-color: #bb0505; - border-color: #b00505; +.dropdown-toggle::after { + display: inline-block; + margin-left: 0.255em; + vertical-align: 0.255em; + content: ""; + border-top: 0.3em solid; + border-right: 0.3em solid transparent; + border-bottom: 0; + border-left: 0.3em solid transparent; } -.btn-check:checked+.btn-danger:focus, -.btn-check:active+.btn-danger:focus, -.btn-danger:active:focus, -.btn-danger.active:focus, -.show>.btn-danger.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(237, 43, 43, 0.5); +.dropdown-toggle:empty::after { + margin-left: 0; } -.btn-danger:disabled, -.btn-danger.disabled { - color: #fff; - background-color: #ea0606; - border-color: #ea0606; +.dropdown-menu { + --bs-dropdown-min-width: 11rem; + --bs-dropdown-padding-x: 0; + --bs-dropdown-padding-y: 0.5rem; + --bs-dropdown-spacer: 1.625rem; + --bs-dropdown-font-size: 0.875rem; + --bs-dropdown-color: #67748e; + --bs-dropdown-bg: #fff; + --bs-dropdown-border-color: transparent; + --bs-dropdown-border-radius: 0.5rem; + --bs-dropdown-border-width: 0; + --bs-dropdown-inner-border-radius: 0.5rem; + --bs-dropdown-divider-bg: transparent; + --bs-dropdown-divider-margin-y: 0.5rem; + --bs-dropdown-box-shadow: 0 8px 26px -4px rgba(20, 20, 20, 0.15), 0 8px 9px -5px rgba(20, 20, 20, 0.06); + --bs-dropdown-link-color: #67748e; + --bs-dropdown-link-hover-color: #344767; + --bs-dropdown-link-hover-bg: #e9ecef; + --bs-dropdown-link-active-color: #67748e; + --bs-dropdown-link-active-bg: transparent; + --bs-dropdown-link-disabled-color: #6c757d; + --bs-dropdown-item-padding-x: 1rem; + --bs-dropdown-item-padding-y: 0.3rem; + --bs-dropdown-header-color: #6c757d; + --bs-dropdown-header-padding-x: 1rem; + --bs-dropdown-header-padding-y: 0.5rem; + position: absolute; + z-index: 1000; + display: none; + min-width: var(--bs-dropdown-min-width); + padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x); + margin: 0; + font-size: var(--bs-dropdown-font-size); + color: var(--bs-dropdown-color); + text-align: left; + list-style: none; + background-color: var(--bs-dropdown-bg); + background-clip: padding-box; + border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color); + border-radius: var(--bs-dropdown-border-radius); } -.btn-light { - color: #000; - background-color: #e9ecef; - border-color: #e9ecef; +.dropdown-menu[data-bs-popper] { + top: 100%; + left: 0; + margin-top: var(--bs-dropdown-spacer); } -.btn-light:hover { - color: #000; - background-color: #eceff1; - border-color: #ebeef1; +.dropdown-menu-start { + --bs-position: start; } -.btn-check:focus+.btn-light, -.btn-light:focus { - color: #000; - background-color: #eceff1; - border-color: #ebeef1; - box-shadow: 0 0 0 0.2rem rgba(198, 201, 203, 0.5); +.dropdown-menu-start[data-bs-popper] { + right: auto; + left: 0; } -.btn-check:checked+.btn-light, -.btn-check:active+.btn-light, -.btn-light:active, -.btn-light.active, -.show>.btn-light.dropdown-toggle { - color: #000; - background-color: #edf0f2; - border-color: #ebeef1; +.dropdown-menu-end { + --bs-position: end; } -.btn-check:checked+.btn-light:focus, -.btn-check:active+.btn-light:focus, -.btn-light:active:focus, -.btn-light.active:focus, -.show>.btn-light.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(198, 201, 203, 0.5); -} - -.btn-light:disabled, -.btn-light.disabled { - color: #000; - background-color: #e9ecef; - border-color: #e9ecef; -} - -.btn-dark { - color: #fff; - background-color: #344767; - border-color: #344767; -} - -.btn-dark:hover { - color: #fff; - background-color: #2c3c58; - border-color: #2a3952; -} - -.btn-check:focus+.btn-dark, -.btn-dark:focus { - color: #fff; - background-color: #2c3c58; - border-color: #2a3952; - box-shadow: 0 0 0 0.2rem rgba(82, 99, 126, 0.5); -} - -.btn-check:checked+.btn-dark, -.btn-check:active+.btn-dark, -.btn-dark:active, -.btn-dark.active, -.show>.btn-dark.dropdown-toggle { - color: #fff; - background-color: #2a3952; - border-color: #27354d; -} - -.btn-check:checked+.btn-dark:focus, -.btn-check:active+.btn-dark:focus, -.btn-dark:active:focus, -.btn-dark.active:focus, -.show>.btn-dark.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(82, 99, 126, 0.5); -} - -.btn-dark:disabled, -.btn-dark.disabled { - color: #fff; - background-color: #344767; - border-color: #344767; -} - -.btn-white { - color: #000; - background-color: #fff; - border-color: #fff; -} - -.btn-white:hover { - color: #000; - background-color: white; - border-color: white; -} - -.btn-check:focus+.btn-white, -.btn-white:focus { - color: #000; - background-color: white; - border-color: white; - box-shadow: 0 0 0 0.2rem rgba(217, 217, 217, 0.5); -} - -.btn-check:checked+.btn-white, -.btn-check:active+.btn-white, -.btn-white:active, -.btn-white.active, -.show>.btn-white.dropdown-toggle { - color: #000; - background-color: white; - border-color: white; -} - -.btn-check:checked+.btn-white:focus, -.btn-check:active+.btn-white:focus, -.btn-white:active:focus, -.btn-white.active:focus, -.show>.btn-white.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(217, 217, 217, 0.5); -} - -.btn-white:disabled, -.btn-white.disabled { - color: #000; - background-color: #fff; - border-color: #fff; -} - -.btn-outline-primary { - color: #cb0c9f; - border-color: #cb0c9f; -} - -.btn-outline-primary:hover { - color: #fff; - background-color: #cb0c9f; - border-color: #cb0c9f; -} - -.btn-check:focus+.btn-outline-primary, -.btn-outline-primary:focus { - box-shadow: 0 0 0 0.2rem rgba(203, 12, 159, 0.5); -} - -.btn-check:checked+.btn-outline-primary, -.btn-check:active+.btn-outline-primary, -.btn-outline-primary:active, -.btn-outline-primary.active, -.btn-outline-primary.dropdown-toggle.show { - color: #fff; - background-color: #cb0c9f; - border-color: #cb0c9f; -} - -.btn-check:checked+.btn-outline-primary:focus, -.btn-check:active+.btn-outline-primary:focus, -.btn-outline-primary:active:focus, -.btn-outline-primary.active:focus, -.btn-outline-primary.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(203, 12, 159, 0.5); -} - -.btn-outline-primary:disabled, -.btn-outline-primary.disabled { - color: #cb0c9f; - background-color: transparent; -} - -.btn-outline-secondary { - color: #8392AB; - border-color: #8392AB; -} - -.btn-outline-secondary:hover { - color: #000; - background-color: #8392AB; - border-color: #8392AB; -} - -.btn-check:focus+.btn-outline-secondary, -.btn-outline-secondary:focus { - box-shadow: 0 0 0 0.2rem rgba(131, 146, 171, 0.5); -} - -.btn-check:checked+.btn-outline-secondary, -.btn-check:active+.btn-outline-secondary, -.btn-outline-secondary:active, -.btn-outline-secondary.active, -.btn-outline-secondary.dropdown-toggle.show { - color: #000; - background-color: #8392AB; - border-color: #8392AB; -} - -.btn-check:checked+.btn-outline-secondary:focus, -.btn-check:active+.btn-outline-secondary:focus, -.btn-outline-secondary:active:focus, -.btn-outline-secondary.active:focus, -.btn-outline-secondary.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(131, 146, 171, 0.5); -} - -.btn-outline-secondary:disabled, -.btn-outline-secondary.disabled { - color: #8392AB; - background-color: transparent; -} - -.btn-outline-success { - color: #82d616; - border-color: #82d616; -} - -.btn-outline-success:hover { - color: #000; - background-color: #82d616; - border-color: #82d616; -} - -.btn-check:focus+.btn-outline-success, -.btn-outline-success:focus { - box-shadow: 0 0 0 0.2rem rgba(130, 214, 22, 0.5); -} - -.btn-check:checked+.btn-outline-success, -.btn-check:active+.btn-outline-success, -.btn-outline-success:active, -.btn-outline-success.active, -.btn-outline-success.dropdown-toggle.show { - color: #000; - background-color: #82d616; - border-color: #82d616; -} - -.btn-check:checked+.btn-outline-success:focus, -.btn-check:active+.btn-outline-success:focus, -.btn-outline-success:active:focus, -.btn-outline-success.active:focus, -.btn-outline-success.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(130, 214, 22, 0.5); -} - -.btn-outline-success:disabled, -.btn-outline-success.disabled { - color: #82d616; - background-color: transparent; -} - -.btn-outline-info { - color: #17c1e8; - border-color: #17c1e8; -} - -.btn-outline-info:hover { - color: #000; - background-color: #17c1e8; - border-color: #17c1e8; -} - -.btn-check:focus+.btn-outline-info, -.btn-outline-info:focus { - box-shadow: 0 0 0 0.2rem rgba(23, 193, 232, 0.5); -} - -.btn-check:checked+.btn-outline-info, -.btn-check:active+.btn-outline-info, -.btn-outline-info:active, -.btn-outline-info.active, -.btn-outline-info.dropdown-toggle.show { - color: #000; - background-color: #17c1e8; - border-color: #17c1e8; -} - -.btn-check:checked+.btn-outline-info:focus, -.btn-check:active+.btn-outline-info:focus, -.btn-outline-info:active:focus, -.btn-outline-info.active:focus, -.btn-outline-info.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(23, 193, 232, 0.5); -} - -.btn-outline-info:disabled, -.btn-outline-info.disabled { - color: #17c1e8; - background-color: transparent; -} - -.btn-outline-warning { - color: #fbcf33; - border-color: #fbcf33; -} - -.btn-outline-warning:hover { - color: #000; - background-color: #fbcf33; - border-color: #fbcf33; -} - -.btn-check:focus+.btn-outline-warning, -.btn-outline-warning:focus { - box-shadow: 0 0 0 0.2rem rgba(251, 207, 51, 0.5); -} - -.btn-check:checked+.btn-outline-warning, -.btn-check:active+.btn-outline-warning, -.btn-outline-warning:active, -.btn-outline-warning.active, -.btn-outline-warning.dropdown-toggle.show { - color: #000; - background-color: #fbcf33; - border-color: #fbcf33; -} - -.btn-check:checked+.btn-outline-warning:focus, -.btn-check:active+.btn-outline-warning:focus, -.btn-outline-warning:active:focus, -.btn-outline-warning.active:focus, -.btn-outline-warning.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(251, 207, 51, 0.5); -} - -.btn-outline-warning:disabled, -.btn-outline-warning.disabled { - color: #fbcf33; - background-color: transparent; -} - -.btn-outline-danger { - color: #ea0606; - border-color: #ea0606; -} - -.btn-outline-danger:hover { - color: #fff; - background-color: #ea0606; - border-color: #ea0606; -} - -.btn-check:focus+.btn-outline-danger, -.btn-outline-danger:focus { - box-shadow: 0 0 0 0.2rem rgba(234, 6, 6, 0.5); -} - -.btn-check:checked+.btn-outline-danger, -.btn-check:active+.btn-outline-danger, -.btn-outline-danger:active, -.btn-outline-danger.active, -.btn-outline-danger.dropdown-toggle.show { - color: #fff; - background-color: #ea0606; - border-color: #ea0606; -} - -.btn-check:checked+.btn-outline-danger:focus, -.btn-check:active+.btn-outline-danger:focus, -.btn-outline-danger:active:focus, -.btn-outline-danger.active:focus, -.btn-outline-danger.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(234, 6, 6, 0.5); -} - -.btn-outline-danger:disabled, -.btn-outline-danger.disabled { - color: #ea0606; - background-color: transparent; -} - -.btn-outline-light { - color: #e9ecef; - border-color: #e9ecef; -} - -.btn-outline-light:hover { - color: #000; - background-color: #e9ecef; - border-color: #e9ecef; -} - -.btn-check:focus+.btn-outline-light, -.btn-outline-light:focus { - box-shadow: 0 0 0 0.2rem rgba(233, 236, 239, 0.5); -} - -.btn-check:checked+.btn-outline-light, -.btn-check:active+.btn-outline-light, -.btn-outline-light:active, -.btn-outline-light.active, -.btn-outline-light.dropdown-toggle.show { - color: #000; - background-color: #e9ecef; - border-color: #e9ecef; -} - -.btn-check:checked+.btn-outline-light:focus, -.btn-check:active+.btn-outline-light:focus, -.btn-outline-light:active:focus, -.btn-outline-light.active:focus, -.btn-outline-light.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(233, 236, 239, 0.5); -} - -.btn-outline-light:disabled, -.btn-outline-light.disabled { - color: #e9ecef; - background-color: transparent; -} - -.btn-outline-dark { - color: #344767; - border-color: #344767; -} - -.btn-outline-dark:hover { - color: #fff; - background-color: #344767; - border-color: #344767; -} - -.btn-check:focus+.btn-outline-dark, -.btn-outline-dark:focus { - box-shadow: 0 0 0 0.2rem rgba(52, 71, 103, 0.5); -} - -.btn-check:checked+.btn-outline-dark, -.btn-check:active+.btn-outline-dark, -.btn-outline-dark:active, -.btn-outline-dark.active, -.btn-outline-dark.dropdown-toggle.show { - color: #fff; - background-color: #344767; - border-color: #344767; -} - -.btn-check:checked+.btn-outline-dark:focus, -.btn-check:active+.btn-outline-dark:focus, -.btn-outline-dark:active:focus, -.btn-outline-dark.active:focus, -.btn-outline-dark.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(52, 71, 103, 0.5); -} - -.btn-outline-dark:disabled, -.btn-outline-dark.disabled { - color: #344767; - background-color: transparent; -} - -.btn-outline-white { - color: #fff; - border-color: #fff; -} - -.btn-outline-white:hover { - color: #000; - background-color: #fff; - border-color: #fff; -} - -.btn-check:focus+.btn-outline-white, -.btn-outline-white:focus { - box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); -} - -.btn-check:checked+.btn-outline-white, -.btn-check:active+.btn-outline-white, -.btn-outline-white:active, -.btn-outline-white.active, -.btn-outline-white.dropdown-toggle.show { - color: #000; - background-color: #fff; - border-color: #fff; -} - -.btn-check:checked+.btn-outline-white:focus, -.btn-check:active+.btn-outline-white:focus, -.btn-outline-white:active:focus, -.btn-outline-white.active:focus, -.btn-outline-white.dropdown-toggle.show:focus { - box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); -} - -.btn-outline-white:disabled, -.btn-outline-white.disabled { - color: #fff; - background-color: transparent; -} - -.btn-link { - font-weight: 400; - color: #cb0c9f; - text-decoration: none; -} - -.btn-link:hover { - color: #830866; - text-decoration: none; -} - -.btn-link:focus { - text-decoration: none; -} - -.btn-link:disabled, -.btn-link.disabled { - color: #6c757d; -} - -.btn-lg, -.btn-group-lg>.btn { - padding: 0.875rem 4rem; - font-size: 0.875rem; - border-radius: 0.5rem; -} - -.btn-sm, -.btn-group-sm>.btn { - padding: 0.5rem 2rem; - font-size: 0.75rem; - border-radius: 0.5rem; -} - -.fade { - transition: opacity 0.15s linear; -} - -@media (prefers-reduced-motion: reduce) { - .fade { - transition: none; - } -} - -.fade:not(.show) { - opacity: 0; -} - -.collapse:not(.show) { - display: none; -} - -.collapsing { - height: 0; - overflow: hidden; - transition: height 0.35s ease; -} - -@media (prefers-reduced-motion: reduce) { - .collapsing { - transition: none; - } -} - -.collapsing.collapse-horizontal { - width: 0; - height: auto; - transition: width 0.35s ease; -} - -@media (prefers-reduced-motion: reduce) { - .collapsing.collapse-horizontal { - transition: none; - } -} - -.dropup, -.dropend, -.dropdown, -.dropstart { - position: relative; -} - -.dropdown-toggle { - white-space: nowrap; -} - -.dropdown-toggle::after { - display: inline-block; - margin-left: 0.255em; - vertical-align: 0.255em; - content: ""; - border-top: 0.3em solid; - border-right: 0.3em solid transparent; - border-bottom: 0; - border-left: 0.3em solid transparent; -} - -.dropdown-toggle:empty::after { - margin-left: 0; -} - -.dropdown-menu { - position: absolute; - z-index: 1000; - display: none; - min-width: 11rem; - padding: 0.5rem 0; - margin: 0; - font-size: 0.875rem; - color: #67748e; - text-align: left; - list-style: none; - background-color: #fff; - background-clip: padding-box; - border: 0 solid transparent; - border-radius: 0.5rem; -} - -.dropdown-menu[data-bs-popper] { - top: 100%; - left: 0; - margin-top: 1.625rem; -} - -.dropdown-menu-start { - --bs-position: start; -} - -.dropdown-menu-start[data-bs-popper] { - right: auto; - left: 0; -} - -.dropdown-menu-end { - --bs-position: end; -} - -.dropdown-menu-end[data-bs-popper] { - right: 0; - left: auto; +.dropdown-menu-end[data-bs-popper] { + right: 0; + left: auto; } @media (min-width: 576px) { @@ -4596,7 +4231,7 @@ fieldset:disabled .btn { top: auto; bottom: 100%; margin-top: 0; - margin-bottom: 1.625rem; + margin-bottom: var(--bs-dropdown-spacer); } .dropup .dropdown-toggle::after { @@ -4619,7 +4254,7 @@ fieldset:disabled .btn { right: auto; left: 100%; margin-top: 0; - margin-left: 1.625rem; + margin-left: var(--bs-dropdown-spacer); } .dropend .dropdown-toggle::after { @@ -4646,7 +4281,7 @@ fieldset:disabled .btn { right: 100%; left: auto; margin-top: 0; - margin-right: 1.625rem; + margin-right: var(--bs-dropdown-spacer); } .dropstart .dropdown-toggle::after { @@ -4680,18 +4315,19 @@ fieldset:disabled .btn { .dropdown-divider { height: 0; - margin: 0.5rem 0; + margin: var(--bs-dropdown-divider-margin-y) 0; overflow: hidden; - border-top: 1px solid transparent; + border-top: 1px solid var(--bs-dropdown-divider-bg); + opacity: 1; } .dropdown-item { display: block; width: 100%; - padding: 0.3rem 1rem; + padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x); clear: both; font-weight: 400; - color: #67748e; + color: var(--bs-dropdown-link-color); text-align: inherit; white-space: nowrap; background-color: transparent; @@ -4700,20 +4336,20 @@ fieldset:disabled .btn { .dropdown-item:hover, .dropdown-item:focus { - color: #344767; - background-color: #e9ecef; + color: var(--bs-dropdown-link-hover-color); + background-color: var(--bs-dropdown-link-hover-bg); } .dropdown-item.active, .dropdown-item:active { - color: #67748e; + color: var(--bs-dropdown-link-active-color); text-decoration: none; - background-color: transparent; + background-color: var(--bs-dropdown-link-active-bg); } .dropdown-item.disabled, .dropdown-item:disabled { - color: #6c757d; + color: var(--bs-dropdown-link-disabled-color); pointer-events: none; background-color: transparent; } @@ -4724,56 +4360,32 @@ fieldset:disabled .btn { .dropdown-header { display: block; - padding: 0.5rem 1rem; + padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x); margin-bottom: 0; font-size: 0.875rem; - color: #6c757d; + color: var(--bs-dropdown-header-color); white-space: nowrap; } .dropdown-item-text { display: block; - padding: 0.3rem 1rem; - color: #67748e; + padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x); + color: var(--bs-dropdown-link-color); } .dropdown-menu-dark { - color: #dee2e6; - background-color: #343a40; - border-color: transparent; -} - -.dropdown-menu-dark .dropdown-item { - color: #dee2e6; -} - -.dropdown-menu-dark .dropdown-item:hover, -.dropdown-menu-dark .dropdown-item:focus { - color: #fff; - background-color: rgba(255, 255, 255, 0.15); -} - -.dropdown-menu-dark .dropdown-item.active, -.dropdown-menu-dark .dropdown-item:active { - color: #67748e; - background-color: transparent; -} - -.dropdown-menu-dark .dropdown-item.disabled, -.dropdown-menu-dark .dropdown-item:disabled { - color: #adb5bd; -} - -.dropdown-menu-dark .dropdown-divider { - border-color: transparent; -} - -.dropdown-menu-dark .dropdown-item-text { - color: #dee2e6; -} - -.dropdown-menu-dark .dropdown-header { - color: #adb5bd; + --bs-dropdown-color: #dee2e6; + --bs-dropdown-bg: #343a40; + --bs-dropdown-border-color: transparent; + --bs-dropdown-box-shadow: ; + --bs-dropdown-link-color: #dee2e6; + --bs-dropdown-link-hover-color: #fff; + --bs-dropdown-divider-bg: transparent; + --bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.15); + --bs-dropdown-link-active-color: #67748e; + --bs-dropdown-link-active-bg: transparent; + --bs-dropdown-link-disabled-color: #adb5bd; + --bs-dropdown-header-color: #adb5bd; } .btn-group, @@ -4814,12 +4426,17 @@ fieldset:disabled .btn { width: auto; } +.btn-group { + border-radius: 0.5rem; +} + .btn-group>.btn:not(:first-child), .btn-group>.btn-group:not(:first-child) { margin-left: -1px; } .btn-group>.btn:not(:last-child):not(.dropdown-toggle), +.btn-group>.btn.dropdown-toggle-split:first-child, .btn-group>.btn-group:not(:last-child)>.btn { border-top-right-radius: 0; border-bottom-right-radius: 0; @@ -4888,6 +4505,12 @@ fieldset:disabled .btn { } .nav { + --bs-nav-link-padding-x: 1rem; + --bs-nav-link-padding-y: 0.5rem; + --bs-nav-link-font-weight: ; + --bs-nav-link-color: var(--bs-link-color); + --bs-nav-link-hover-color: var(--bs-link-hover-color); + --bs-nav-link-disabled-color: #6c757d; display: flex; flex-wrap: wrap; padding-left: 0; @@ -4897,8 +4520,10 @@ fieldset:disabled .btn { .nav-link { display: block; - padding: 0.5rem 1rem; - color: #cb0c9f; + padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x); + font-size: var(--bs-nav-link-font-size); + font-weight: var(--bs-nav-link-font-weight); + color: var(--bs-nav-link-color); transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; } @@ -4910,62 +4535,82 @@ fieldset:disabled .btn { .nav-link:hover, .nav-link:focus { - color: #830866; + color: var(--bs-nav-link-hover-color); } .nav-link.disabled { - color: #6c757d; + color: var(--bs-nav-link-disabled-color); pointer-events: none; cursor: default; } .nav-tabs { - border-bottom: 1px solid #dee2e6; + --bs-nav-tabs-border-width: 1px; + --bs-nav-tabs-border-color: #dee2e6; + --bs-nav-tabs-border-radius: 0.5rem; + --bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6; + --bs-nav-tabs-link-active-color: #495057; + --bs-nav-tabs-link-active-bg: #fff; + --bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff; + border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color); } .nav-tabs .nav-link { - margin-bottom: -1px; + margin-bottom: calc(var(--bs-nav-tabs-border-width) * -1); background: none; - border: 1px solid transparent; - border-top-left-radius: 0.5rem; - border-top-right-radius: 0.5rem; + border: var(--bs-nav-tabs-border-width) solid transparent; + border-top-left-radius: var(--bs-nav-tabs-border-radius); + border-top-right-radius: var(--bs-nav-tabs-border-radius); } .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { - border-color: #e9ecef #e9ecef #dee2e6; isolation: isolate; + border-color: var(--bs-nav-tabs-link-hover-border-color); } -.nav-tabs .nav-link.disabled { - color: #6c757d; +.nav-tabs .nav-link.disabled, +.nav-tabs .nav-link:disabled { + color: var(--bs-nav-link-disabled-color); background-color: transparent; border-color: transparent; } .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { - color: #495057; - background-color: #fff; - border-color: #dee2e6 #dee2e6 #fff; + color: var(--bs-nav-tabs-link-active-color); + background-color: var(--bs-nav-tabs-link-active-bg); + border-color: var(--bs-nav-tabs-link-active-border-color); } .nav-tabs .dropdown-menu { - margin-top: -1px; + margin-top: calc(var(--bs-nav-tabs-border-width) * -1); border-top-left-radius: 0; border-top-right-radius: 0; } +.nav-pills { + --bs-nav-pills-border-radius: 0.75rem; + --bs-nav-pills-link-active-color: #344767; + --bs-nav-pills-link-active-bg: #fff; +} + .nav-pills .nav-link { background: none; border: 0; - border-radius: 0.75rem; + border-radius: var(--bs-nav-pills-border-radius); +} + +.nav-pills .nav-link:disabled { + color: var(--bs-nav-link-disabled-color); + background-color: transparent; + border-color: transparent; } .nav-pills .nav-link.active, .nav-pills .show>.nav-link { - color: #344767; - background-color: #fff; + color: var(--bs-nav-pills-link-active-color); + background-color: var(--bs-nav-pills-link-active-bg); } .nav-fill>.nav-link, @@ -4995,15 +4640,32 @@ fieldset:disabled .btn { } .navbar { + --bs-navbar-padding-x: 1rem; + --bs-navbar-padding-y: 0.5rem; + --bs-navbar-color: #344767; + --bs-navbar-hover-color: rgba(52, 71, 103, 0.7); + --bs-navbar-disabled-color: rgba(52, 71, 103, 0.3); + --bs-navbar-active-color: rgba(52, 71, 103, 0.9); + --bs-navbar-brand-padding-y: 0.59375rem; + --bs-navbar-brand-margin-end: 1rem; + --bs-navbar-brand-font-size: 0.875rem; + --bs-navbar-brand-color: rgba(52, 71, 103, 0.9); + --bs-navbar-brand-hover-color: rgba(52, 71, 103, 0.9); + --bs-navbar-nav-link-padding-x: 0.5rem; + --bs-navbar-toggler-padding-y: 0.25rem; + --bs-navbar-toggler-padding-x: 0.75rem; + --bs-navbar-toggler-font-size: 1.125rem; + --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23344767' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); + --bs-navbar-toggler-border-color: rgba(52, 71, 103, 0.1); + --bs-navbar-toggler-border-radius: 0.5rem; + --bs-navbar-toggler-focus-width: 0.2rem; + --bs-navbar-toggler-transition: box-shadow 0.15s ease-in-out; position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; - padding-top: 0.5rem; - padding-right: 1rem; - padding-bottom: 0.5rem; - padding-left: 1rem; + padding: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x); } .navbar>.container, @@ -5020,14 +4682,25 @@ fieldset:disabled .btn { } .navbar-brand { - padding-top: 0.59375rem; - padding-bottom: 0.59375rem; - margin-right: 1rem; - font-size: 0.875rem; + padding-top: var(--bs-navbar-brand-padding-y); + padding-bottom: var(--bs-navbar-brand-padding-y); + margin-right: var(--bs-navbar-brand-margin-end); + font-size: var(--bs-navbar-brand-font-size); + color: var(--bs-navbar-brand-color); white-space: nowrap; } +.navbar-brand:hover, +.navbar-brand:focus { + color: var(--bs-navbar-brand-hover-color); +} + .navbar-nav { + --bs-nav-link-padding-x: 0; + --bs-nav-link-padding-y: 0.5rem; + --bs-nav-link-color: var(--bs-navbar-color); + --bs-nav-link-hover-color: var(--bs-navbar-hover-color); + --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color); display: flex; flex-direction: column; padding-left: 0; @@ -5035,9 +4708,9 @@ fieldset:disabled .btn { list-style: none; } -.navbar-nav .nav-link { - padding-right: 0; - padding-left: 0; +.navbar-nav .show>.nav-link, +.navbar-nav .nav-link.active { + color: var(--bs-navbar-active-color); } .navbar-nav .dropdown-menu { @@ -5047,6 +4720,13 @@ fieldset:disabled .btn { .navbar-text { padding-top: 0.5rem; padding-bottom: 0.5rem; + color: var(--bs-navbar-color); +} + +.navbar-text a, +.navbar-text a:hover, +.navbar-text a:focus { + color: var(--bs-navbar-active-color); } .navbar-collapse { @@ -5056,13 +4736,14 @@ fieldset:disabled .btn { } .navbar-toggler { - padding: 0.25rem 0.75rem; - font-size: 1.125rem; + padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x); + font-size: var(--bs-navbar-toggler-font-size); line-height: 1; + color: var(--bs-navbar-color); background-color: transparent; - border: 1px solid transparent; - border-radius: 0.5rem; - transition: box-shadow 0.15s ease-in-out; + border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color); + border-radius: var(--bs-navbar-toggler-border-radius); + transition: var(--bs-navbar-toggler-transition); } @media (prefers-reduced-motion: reduce) { @@ -5078,7 +4759,7 @@ fieldset:disabled .btn { .navbar-toggler:focus { text-decoration: none; outline: 0; - box-shadow: 0 0 0 0.2rem; + box-shadow: 0 0 0 var(--bs-navbar-toggler-focus-width); } .navbar-toggler-icon { @@ -5086,6 +4767,7 @@ fieldset:disabled .btn { width: 1.5em; height: 1.5em; vertical-align: middle; + background-image: var(--bs-navbar-toggler-icon-bg); background-repeat: no-repeat; background-position: center; background-size: 100%; @@ -5111,8 +4793,8 @@ fieldset:disabled .btn { } .navbar-expand-sm .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; + padding-right: var(--bs-navbar-nav-link-padding-x); + padding-left: var(--bs-navbar-nav-link-padding-x); } .navbar-expand-sm .navbar-nav-scroll { @@ -5128,31 +4810,24 @@ fieldset:disabled .btn { display: none; } - .navbar-expand-sm .offcanvas-header { - display: none; - } - .navbar-expand-sm .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; + position: static; + z-index: auto; flex-grow: 1; + width: auto !important; + height: auto !important; visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; + background-color: transparent !important; + border: 0 !important; + transform: none !important; transition: none; - transform: none; } - .navbar-expand-sm .offcanvas-top, - .navbar-expand-sm .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; + .navbar-expand-sm .offcanvas .offcanvas-header { + display: none; } - .navbar-expand-sm .offcanvas-body { + .navbar-expand-sm .offcanvas .offcanvas-body { display: flex; flex-grow: 0; padding: 0; @@ -5175,8 +4850,8 @@ fieldset:disabled .btn { } .navbar-expand-md .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; + padding-right: var(--bs-navbar-nav-link-padding-x); + padding-left: var(--bs-navbar-nav-link-padding-x); } .navbar-expand-md .navbar-nav-scroll { @@ -5192,31 +4867,24 @@ fieldset:disabled .btn { display: none; } - .navbar-expand-md .offcanvas-header { - display: none; - } - .navbar-expand-md .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; + position: static; + z-index: auto; flex-grow: 1; + width: auto !important; + height: auto !important; visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; + background-color: transparent !important; + border: 0 !important; + transform: none !important; transition: none; - transform: none; } - .navbar-expand-md .offcanvas-top, - .navbar-expand-md .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; + .navbar-expand-md .offcanvas .offcanvas-header { + display: none; } - .navbar-expand-md .offcanvas-body { + .navbar-expand-md .offcanvas .offcanvas-body { display: flex; flex-grow: 0; padding: 0; @@ -5239,8 +4907,8 @@ fieldset:disabled .btn { } .navbar-expand-lg .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; + padding-right: var(--bs-navbar-nav-link-padding-x); + padding-left: var(--bs-navbar-nav-link-padding-x); } .navbar-expand-lg .navbar-nav-scroll { @@ -5256,31 +4924,24 @@ fieldset:disabled .btn { display: none; } - .navbar-expand-lg .offcanvas-header { - display: none; - } - .navbar-expand-lg .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; + position: static; + z-index: auto; flex-grow: 1; + width: auto !important; + height: auto !important; visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; + background-color: transparent !important; + border: 0 !important; + transform: none !important; transition: none; - transform: none; } - .navbar-expand-lg .offcanvas-top, - .navbar-expand-lg .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; + .navbar-expand-lg .offcanvas .offcanvas-header { + display: none; } - .navbar-expand-lg .offcanvas-body { + .navbar-expand-lg .offcanvas .offcanvas-body { display: flex; flex-grow: 0; padding: 0; @@ -5303,8 +4964,8 @@ fieldset:disabled .btn { } .navbar-expand-xl .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; + padding-right: var(--bs-navbar-nav-link-padding-x); + padding-left: var(--bs-navbar-nav-link-padding-x); } .navbar-expand-xl .navbar-nav-scroll { @@ -5320,31 +4981,24 @@ fieldset:disabled .btn { display: none; } - .navbar-expand-xl .offcanvas-header { - display: none; - } - .navbar-expand-xl .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; + position: static; + z-index: auto; flex-grow: 1; + width: auto !important; + height: auto !important; visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; + background-color: transparent !important; + border: 0 !important; + transform: none !important; transition: none; - transform: none; } - .navbar-expand-xl .offcanvas-top, - .navbar-expand-xl .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; + .navbar-expand-xl .offcanvas .offcanvas-header { + display: none; } - .navbar-expand-xl .offcanvas-body { + .navbar-expand-xl .offcanvas .offcanvas-body { display: flex; flex-grow: 0; padding: 0; @@ -5367,8 +5021,8 @@ fieldset:disabled .btn { } .navbar-expand-xxl .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; + padding-right: var(--bs-navbar-nav-link-padding-x); + padding-left: var(--bs-navbar-nav-link-padding-x); } .navbar-expand-xxl .navbar-nav-scroll { @@ -5384,202 +5038,125 @@ fieldset:disabled .btn { display: none; } - .navbar-expand-xxl .offcanvas-header { - display: none; - } - .navbar-expand-xxl .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; + position: static; + z-index: auto; flex-grow: 1; + width: auto !important; + height: auto !important; visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; + background-color: transparent !important; + border: 0 !important; + transform: none !important; transition: none; - transform: none; - } - - .navbar-expand-xxl .offcanvas-top, - .navbar-expand-xxl .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; - } - - .navbar-expand-xxl .offcanvas-body { - display: flex; - flex-grow: 0; - padding: 0; - overflow-y: visible; } -} - -.navbar-expand { - flex-wrap: nowrap; - justify-content: flex-start; -} - -.navbar-expand .navbar-nav { - flex-direction: row; -} - -.navbar-expand .navbar-nav .dropdown-menu { - position: absolute; -} - -.navbar-expand .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; -} - -.navbar-expand .navbar-nav-scroll { - overflow: visible; -} - -.navbar-expand .navbar-collapse { - display: flex !important; - flex-basis: auto; -} - -.navbar-expand .navbar-toggler { - display: none; -} - -.navbar-expand .offcanvas-header { - display: none; -} - -.navbar-expand .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; - flex-grow: 1; - visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; - transition: none; - transform: none; -} - -.navbar-expand .offcanvas-top, -.navbar-expand .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; -} - -.navbar-expand .offcanvas-body { - display: flex; - flex-grow: 0; - padding: 0; - overflow-y: visible; -} - -.navbar-light .navbar-brand { - color: rgba(52, 71, 103, 0.9); -} - -.navbar-light .navbar-brand:hover, -.navbar-light .navbar-brand:focus { - color: rgba(52, 71, 103, 0.9); -} - -.navbar-light .navbar-nav .nav-link { - color: #344767; -} - -.navbar-light .navbar-nav .nav-link:hover, -.navbar-light .navbar-nav .nav-link:focus { - color: rgba(52, 71, 103, 0.7); -} - -.navbar-light .navbar-nav .nav-link.disabled { - color: rgba(52, 71, 103, 0.3); -} -.navbar-light .navbar-nav .show>.nav-link, -.navbar-light .navbar-nav .nav-link.active { - color: rgba(52, 71, 103, 0.9); -} - -.navbar-light .navbar-toggler { - color: #344767; - border-color: rgba(52, 71, 103, 0.1); -} - -.navbar-light .navbar-toggler-icon { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23344767' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); -} + .navbar-expand-xxl .offcanvas .offcanvas-header { + display: none; + } -.navbar-light .navbar-text { - color: #344767; + .navbar-expand-xxl .offcanvas .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + } } -.navbar-light .navbar-text a, -.navbar-light .navbar-text a:hover, -.navbar-light .navbar-text a:focus { - color: rgba(52, 71, 103, 0.9); +.navbar-expand { + flex-wrap: nowrap; + justify-content: flex-start; } -.navbar-dark .navbar-brand { - color: #fff; +.navbar-expand .navbar-nav { + flex-direction: row; } -.navbar-dark .navbar-brand:hover, -.navbar-dark .navbar-brand:focus { - color: #fff; +.navbar-expand .navbar-nav .dropdown-menu { + position: absolute; } -.navbar-dark .navbar-nav .nav-link { - color: rgba(255, 255, 255, 0.85); +.navbar-expand .navbar-nav .nav-link { + padding-right: var(--bs-navbar-nav-link-padding-x); + padding-left: var(--bs-navbar-nav-link-padding-x); } -.navbar-dark .navbar-nav .nav-link:hover, -.navbar-dark .navbar-nav .nav-link:focus { - color: rgba(255, 255, 255, 0.75); +.navbar-expand .navbar-nav-scroll { + overflow: visible; } -.navbar-dark .navbar-nav .nav-link.disabled { - color: rgba(255, 255, 255, 0.25); +.navbar-expand .navbar-collapse { + display: flex !important; + flex-basis: auto; } -.navbar-dark .navbar-nav .show>.nav-link, -.navbar-dark .navbar-nav .nav-link.active { - color: #fff; +.navbar-expand .navbar-toggler { + display: none; } -.navbar-dark .navbar-toggler { - color: rgba(255, 255, 255, 0.85); - border-color: rgba(255, 255, 255, 0.1); +.navbar-expand .offcanvas { + position: static; + z-index: auto; + flex-grow: 1; + width: auto !important; + height: auto !important; + visibility: visible !important; + background-color: transparent !important; + border: 0 !important; + transform: none !important; + transition: none; } -.navbar-dark .navbar-toggler-icon { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); +.navbar-expand .offcanvas .offcanvas-header { + display: none; } -.navbar-dark .navbar-text { - color: rgba(255, 255, 255, 0.85); +.navbar-expand .offcanvas .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; } -.navbar-dark .navbar-text a, -.navbar-dark .navbar-text a:hover, -.navbar-dark .navbar-text a:focus { - color: #fff; +.navbar-dark { + --bs-navbar-color: rgba(255, 255, 255, 0.85); + --bs-navbar-hover-color: rgba(255, 255, 255, 0.75); + --bs-navbar-disabled-color: rgba(255, 255, 255, 0.25); + --bs-navbar-active-color: #fff; + --bs-navbar-brand-color: #fff; + --bs-navbar-brand-hover-color: #fff; + --bs-navbar-toggler-border-color: rgba(255, 255, 255, 0.1); + --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); } .card { + --bs-card-spacer-y: 1rem; + --bs-card-spacer-x: 1rem; + --bs-card-title-spacer-y: 0.5rem; + --bs-card-border-width: 0; + --bs-card-border-color: rgba(0, 0, 0, 0.125); + --bs-card-border-radius: 1rem; + --bs-card-box-shadow: 0 20px 27px 0 rgba(0, 0, 0, 0.05); + --bs-card-inner-border-radius: 1rem; + --bs-card-cap-padding-y: 0.5rem; + --bs-card-cap-padding-x: 1rem; + --bs-card-cap-bg: #fff; + --bs-card-cap-color: ; + --bs-card-height: ; + --bs-card-color: ; + --bs-card-bg: #fff; + --bs-card-img-overlay-padding: 1rem; + --bs-card-group-margin: 0.75rem; position: relative; display: flex; flex-direction: column; min-width: 0; + height: var(--bs-card-height); word-wrap: break-word; - background-color: #fff; + background-color: var(--bs-card-bg); background-clip: border-box; - border: 0 solid rgba(0, 0, 0, 0.125); - border-radius: 1rem; + border: var(--bs-card-border-width) solid var(--bs-card-border-color); + border-radius: var(--bs-card-border-radius); } .card>hr { @@ -5594,14 +5171,14 @@ fieldset:disabled .btn { .card>.list-group:first-child { border-top-width: 0; - border-top-left-radius: 1rem; - border-top-right-radius: 1rem; + border-top-left-radius: var(--bs-card-inner-border-radius); + border-top-right-radius: var(--bs-card-inner-border-radius); } .card>.list-group:last-child { border-bottom-width: 0; - border-bottom-right-radius: 1rem; - border-bottom-left-radius: 1rem; + border-bottom-right-radius: var(--bs-card-inner-border-radius); + border-bottom-left-radius: var(--bs-card-inner-border-radius); } .card>.card-header+.list-group, @@ -5611,15 +5188,16 @@ fieldset:disabled .btn { .card-body { flex: 1 1 auto; - padding: 1rem 1rem; + padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x); + color: var(--bs-card-color); } .card-title { - margin-bottom: 0.5rem; + margin-bottom: var(--bs-card-title-spacer-y); } .card-subtitle { - margin-top: -0.25rem; + margin-top: calc(-.5 * var(--bs-card-title-spacer-y)); margin-bottom: 0; } @@ -5628,40 +5206,47 @@ fieldset:disabled .btn { } .card-link+.card-link { - margin-left: 1rem; + margin-left: var(--bs-card-spacer-x); } .card-header { - padding: 0.5rem 1rem; + padding: var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x); margin-bottom: 0; - background-color: #fff; - border-bottom: 0 solid rgba(0, 0, 0, 0.125); + color: var(--bs-card-cap-color); + background-color: var(--bs-card-cap-bg); + border-bottom: var(--bs-card-border-width) solid var(--bs-card-border-color); } .card-header:first-child { - border-radius: 1rem 1rem 0 0; + border-radius: var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0; } .card-footer { - padding: 0.5rem 1rem; - background-color: #fff; - border-top: 0 solid rgba(0, 0, 0, 0.125); + padding: var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x); + color: var(--bs-card-cap-color); + background-color: var(--bs-card-cap-bg); + border-top: var(--bs-card-border-width) solid var(--bs-card-border-color); } .card-footer:last-child { - border-radius: 0 0 1rem 1rem; + border-radius: 0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius); } .card-header-tabs { - margin-right: -0.5rem; - margin-bottom: -0.5rem; - margin-left: -0.5rem; + margin-right: calc(-.5 * var(--bs-card-cap-padding-x)); + margin-bottom: calc(-1 * var(--bs-card-cap-padding-y)); + margin-left: calc(-.5 * var(--bs-card-cap-padding-x)); border-bottom: 0; } +.card-header-tabs .nav-link.active { + background-color: var(--bs-card-bg); + border-bottom-color: var(--bs-card-bg); +} + .card-header-pills { - margin-right: -0.5rem; - margin-left: -0.5rem; + margin-right: calc(-.5 * var(--bs-card-cap-padding-x)); + margin-left: calc(-.5 * var(--bs-card-cap-padding-x)); } .card-img-overlay { @@ -5670,8 +5255,8 @@ fieldset:disabled .btn { right: 0; bottom: 0; left: 0; - padding: 1rem; - border-radius: 1rem; + padding: var(--bs-card-img-overlay-padding); + border-radius: var(--bs-card-inner-border-radius); } .card-img, @@ -5682,18 +5267,18 @@ fieldset:disabled .btn { .card-img, .card-img-top { - border-top-left-radius: 1rem; - border-top-right-radius: 1rem; + border-top-left-radius: var(--bs-card-inner-border-radius); + border-top-right-radius: var(--bs-card-inner-border-radius); } .card-img, .card-img-bottom { - border-bottom-right-radius: 1rem; - border-bottom-left-radius: 1rem; + border-bottom-right-radius: var(--bs-card-inner-border-radius); + border-bottom-left-radius: var(--bs-card-inner-border-radius); } .card-group>.card { - margin-bottom: 0.75rem; + margin-bottom: var(--bs-card-group-margin); } @media (min-width: 576px) { @@ -5743,20 +5328,45 @@ fieldset:disabled .btn { } } +.accordion { + --bs-accordion-color: #fff; + --bs-accordion-bg: transparent; + --bs-accordion-transition: all 0.15s ease-in, border-radius 0.15s ease; + --bs-accordion-border-color: rgba(0, 0, 0, 0.125); + --bs-accordion-border-width: 0; + --bs-accordion-border-radius: 0.25rem; + --bs-accordion-inner-border-radius: 0.25rem; + --bs-accordion-btn-padding-x: 1rem; + --bs-accordion-btn-padding-y: 1rem; + --bs-accordion-btn-color: #67748e; + --bs-accordion-btn-bg: transparent; + --bs-accordion-btn-icon: none; + --bs-accordion-btn-icon-width: 1rem; + --bs-accordion-btn-icon-transform: rotate(180deg); + --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out; + --bs-accordion-btn-active-icon: none; + --bs-accordion-btn-focus-border-color: #e293d3; + --bs-accordion-btn-focus-box-shadow: none; + --bs-accordion-body-padding-x: 1rem; + --bs-accordion-body-padding-y: 1rem; + --bs-accordion-active-color: #344767; + --bs-accordion-active-bg: transparent; +} + .accordion-button { position: relative; display: flex; align-items: center; width: 100%; - padding: 1rem 1rem; + padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x); font-size: 1rem; - color: #67748e; + color: var(--bs-accordion-btn-color); text-align: left; - background-color: transparent; + background-color: var(--bs-accordion-btn-bg); border: 0; border-radius: 0; overflow-anchor: none; - transition: all 0.15s ease-in, border-radius 0.15s ease; + transition: var(--bs-accordion-transition); } @media (prefers-reduced-motion: reduce) { @@ -5766,26 +5376,26 @@ fieldset:disabled .btn { } .accordion-button:not(.collapsed) { - color: #344767; - background-color: transparent; - box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.125); + color: var(--bs-accordion-active-color); + background-color: var(--bs-accordion-active-bg); + box-shadow: inset 0 calc(var(--bs-accordion-border-width) * -1) 0 var(--bs-accordion-border-color); } .accordion-button:not(.collapsed)::after { - background-image: none; - transform: rotate(180deg); + background-image: var(--bs-accordion-btn-active-icon); + transform: var(--bs-accordion-btn-icon-transform); } .accordion-button::after { flex-shrink: 0; - width: 1rem; - height: 1rem; + width: var(--bs-accordion-btn-icon-width); + height: var(--bs-accordion-btn-icon-width); margin-left: auto; content: ""; - background-image: none; + background-image: var(--bs-accordion-btn-icon); background-repeat: no-repeat; - background-size: 1rem; - transition: transform 0.2s ease-in-out; + background-size: var(--bs-accordion-btn-icon-width); + transition: var(--bs-accordion-btn-icon-transition); } @media (prefers-reduced-motion: reduce) { @@ -5800,9 +5410,9 @@ fieldset:disabled .btn { .accordion-button:focus { z-index: 3; - border-color: #e293d3; + border-color: var(--bs-accordion-btn-focus-border-color); outline: 0; - box-shadow: none; + box-shadow: var(--bs-accordion-btn-focus-box-shadow); } .accordion-header { @@ -5810,18 +5420,19 @@ fieldset:disabled .btn { } .accordion-item { - background-color: transparent; - border: 0 solid rgba(0, 0, 0, 0.125); + color: var(--bs-accordion-color); + background-color: var(--bs-accordion-bg); + border: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color); } .accordion-item:first-of-type { - border-top-left-radius: 0.25rem; - border-top-right-radius: 0.25rem; + border-top-left-radius: var(--bs-accordion-border-radius); + border-top-right-radius: var(--bs-accordion-border-radius); } .accordion-item:first-of-type .accordion-button { - border-top-left-radius: 0.25rem; - border-top-right-radius: 0.25rem; + border-top-left-radius: var(--bs-accordion-inner-border-radius); + border-top-right-radius: var(--bs-accordion-inner-border-radius); } .accordion-item:not(:first-of-type) { @@ -5829,22 +5440,22 @@ fieldset:disabled .btn { } .accordion-item:last-of-type { - border-bottom-right-radius: 0.25rem; - border-bottom-left-radius: 0.25rem; + border-bottom-right-radius: var(--bs-accordion-border-radius); + border-bottom-left-radius: var(--bs-accordion-border-radius); } .accordion-item:last-of-type .accordion-button.collapsed { - border-bottom-right-radius: 0.25rem; - border-bottom-left-radius: 0.25rem; + border-bottom-right-radius: var(--bs-accordion-inner-border-radius); + border-bottom-left-radius: var(--bs-accordion-inner-border-radius); } .accordion-item:last-of-type .accordion-collapse { - border-bottom-right-radius: 0.25rem; - border-bottom-left-radius: 0.25rem; + border-bottom-right-radius: var(--bs-accordion-border-radius); + border-bottom-left-radius: var(--bs-accordion-border-radius); } .accordion-body { - padding: 1rem 1rem; + padding: var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x); } .accordion-flush .accordion-collapse { @@ -5870,33 +5481,62 @@ fieldset:disabled .btn { } .breadcrumb { + --bs-breadcrumb-padding-x: 1rem; + --bs-breadcrumb-padding-y: 0.5rem; + --bs-breadcrumb-margin-bottom: 1rem; + --bs-breadcrumb-bg: #e9ecef; + --bs-breadcrumb-border-radius: 0.5rem; + --bs-breadcrumb-divider-color: #6c757d; + --bs-breadcrumb-item-padding-x: 0.5rem; + --bs-breadcrumb-item-active-color: #6c757d; display: flex; flex-wrap: wrap; - padding: 0.5rem 1rem; - margin-bottom: 1rem; + padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x); + margin-bottom: var(--bs-breadcrumb-margin-bottom); + font-size: var(--bs-breadcrumb-font-size); list-style: none; - background-color: #e9ecef; - border-radius: 0.5rem; + background-color: var(--bs-breadcrumb-bg); + border-radius: var(--bs-breadcrumb-border-radius); } .breadcrumb-item+.breadcrumb-item { - padding-left: 0.5rem; + padding-left: var(--bs-breadcrumb-item-padding-x); } .breadcrumb-item+.breadcrumb-item::before { float: left; - padding-right: 0.5rem; - color: #6c757d; + padding-right: var(--bs-breadcrumb-item-padding-x); + color: var(--bs-breadcrumb-divider-color); content: var(--bs-breadcrumb-divider, "/") /* rtl: var(--bs-breadcrumb-divider, "/") */ ; } .breadcrumb-item.active { - color: #6c757d; + color: var(--bs-breadcrumb-item-active-color); } .pagination { + --bs-pagination-padding-x: 0.75rem; + --bs-pagination-padding-y: 0.375rem; + --bs-pagination-font-size: 1rem; + --bs-pagination-color: #cb0c9f; + --bs-pagination-bg: #fff; + --bs-pagination-border-width: 1px; + --bs-pagination-border-color: #dee2e6; + --bs-pagination-border-radius: 0.5rem; + --bs-pagination-hover-color: #830866; + --bs-pagination-hover-bg: #e9ecef; + --bs-pagination-hover-border-color: #dee2e6; + --bs-pagination-focus-color: #830866; + --bs-pagination-focus-bg: #e9ecef; + --bs-pagination-focus-box-shadow: 0 0 0 0.2rem rgba(203, 12, 159, 0.25); + --bs-pagination-active-color: #fff; + --bs-pagination-active-bg: #cb0c9f; + --bs-pagination-active-border-color: #cb0c9f; + --bs-pagination-disabled-color: #6c757d; + --bs-pagination-disabled-bg: #fff; + --bs-pagination-disabled-border-color: #dee2e6; display: flex; padding-left: 0; list-style: none; @@ -5905,9 +5545,11 @@ fieldset:disabled .btn { .page-link { position: relative; display: block; - color: #cb0c9f; - background-color: #fff; - border: 1px solid #dee2e6; + padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x); + font-size: var(--bs-pagination-font-size); + color: var(--bs-pagination-color); + background-color: var(--bs-pagination-bg); + border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color); transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } @@ -5919,92 +5561,80 @@ fieldset:disabled .btn { .page-link:hover { z-index: 2; - color: #830866; - background-color: #e9ecef; - border-color: #dee2e6; + color: var(--bs-pagination-hover-color); + background-color: var(--bs-pagination-hover-bg); + border-color: var(--bs-pagination-hover-border-color); } .page-link:focus { z-index: 3; - color: #830866; - background-color: #e9ecef; + color: var(--bs-pagination-focus-color); + background-color: var(--bs-pagination-focus-bg); outline: 0; - box-shadow: 0 0 0 0.2rem rgba(203, 12, 159, 0.25); -} - -.page-item:not(:first-child) .page-link { - margin-left: -1px; + box-shadow: var(--bs-pagination-focus-box-shadow); } -.page-item.active .page-link { +.page-link.active, +.active>.page-link { z-index: 3; - color: #fff; - background-color: #cb0c9f; - border-color: #cb0c9f; + color: var(--bs-pagination-active-color); + background-color: var(--bs-pagination-active-bg); + border-color: var(--bs-pagination-active-border-color); } -.page-item.disabled .page-link { - color: #6c757d; +.page-link.disabled, +.disabled>.page-link { + color: var(--bs-pagination-disabled-color); pointer-events: none; - background-color: #fff; - border-color: #dee2e6; + background-color: var(--bs-pagination-disabled-bg); + border-color: var(--bs-pagination-disabled-border-color); } -.page-link { - padding: 0.375rem 0.75rem; +.page-item:not(:first-child) .page-link { + margin-left: calc($pagination-border-width * -1); } .page-item:first-child .page-link { - border-top-left-radius: 0.5rem; - border-bottom-left-radius: 0.5rem; + border-top-left-radius: var(--bs-pagination-border-radius); + border-bottom-left-radius: var(--bs-pagination-border-radius); } .page-item:last-child .page-link { - border-top-right-radius: 0.5rem; - border-bottom-right-radius: 0.5rem; -} - -.pagination-lg .page-link { - padding: 0.75rem 1.5rem; - font-size: 1.125rem; -} - -.pagination-lg .page-item:first-child .page-link { - border-top-left-radius: 0.75rem; - border-bottom-left-radius: 0.75rem; + border-top-right-radius: var(--bs-pagination-border-radius); + border-bottom-right-radius: var(--bs-pagination-border-radius); } -.pagination-lg .page-item:last-child .page-link { - border-top-right-radius: 0.75rem; - border-bottom-right-radius: 0.75rem; +.pagination-lg { + --bs-pagination-padding-x: 1.5rem; + --bs-pagination-padding-y: 0.75rem; + --bs-pagination-font-size: 1.125rem; + --bs-pagination-border-radius: 0.75rem; } -.pagination-sm .page-link { - padding: 0.25rem 0.5rem; - font-size: 0.875rem; -} - -.pagination-sm .page-item:first-child .page-link { - border-top-left-radius: 0.25rem; - border-bottom-left-radius: 0.25rem; -} - -.pagination-sm .page-item:last-child .page-link { - border-top-right-radius: 0.25rem; - border-bottom-right-radius: 0.25rem; +.pagination-sm { + --bs-pagination-padding-x: 0.5rem; + --bs-pagination-padding-y: 0.25rem; + --bs-pagination-font-size: 0.875rem; + --bs-pagination-border-radius: 0.25rem; } .badge { + --bs-badge-padding-x: 0.9em; + --bs-badge-padding-y: 0.55em; + --bs-badge-font-size: 0.75em; + --bs-badge-font-weight: 700; + --bs-badge-color: #fff; + --bs-badge-border-radius: 0.45rem; display: inline-block; - padding: 0.55em 0.9em; - font-size: 0.75em; - font-weight: 700; + padding: var(--bs-badge-padding-y) var(--bs-badge-padding-x); + font-size: var(--bs-badge-font-size); + font-weight: var(--bs-badge-font-weight); line-height: 1; - color: #fff; + color: var(--bs-badge-color); text-align: center; white-space: nowrap; vertical-align: baseline; - border-radius: 0.45rem; + border-radius: var(--bs-badge-border-radius, 0); } .badge:empty { @@ -6017,11 +5647,21 @@ fieldset:disabled .btn { } .alert { + --bs-alert-bg: transparent; + --bs-alert-padding-x: 1rem; + --bs-alert-padding-y: 1rem; + --bs-alert-margin-bottom: 1rem; + --bs-alert-color: inherit; + --bs-alert-border-color: transparent; + --bs-alert-border: 1px solid var(--bs-alert-border-color); + --bs-alert-border-radius: 0.5rem; position: relative; - padding: 1rem 1rem; - margin-bottom: 1rem; - border: 1px solid transparent; - border-radius: 0.5rem; + padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x); + margin-bottom: var(--bs-alert-margin-bottom); + color: var(--bs-alert-color); + background-color: var(--bs-alert-bg); + border: var(--bs-alert-border); + border-radius: var(--bs-alert-border-radius, 0); } .alert-heading { @@ -6045,9 +5685,9 @@ fieldset:disabled .btn { } .alert-primary { - color: #7a075f; - background-color: #f5ceec; - border-color: #efb6e2; + --bs-alert-color: #7a075f; + --bs-alert-bg: #f5ceec; + --bs-alert-border-color: #efb6e2; } .alert-primary .alert-link { @@ -6055,9 +5695,9 @@ fieldset:disabled .btn { } .alert-secondary { - color: #4f5867; - background-color: #e6e9ee; - border-color: #dadee6; + --bs-alert-color: #4f5867; + --bs-alert-bg: #e6e9ee; + --bs-alert-border-color: #dadee6; } .alert-secondary .alert-link { @@ -6065,9 +5705,9 @@ fieldset:disabled .btn { } .alert-success { - color: #345609; - background-color: #e6f7d0; - border-color: #daf3b9; + --bs-alert-color: #345609; + --bs-alert-bg: #e6f7d0; + --bs-alert-border-color: #daf3b9; } .alert-success .alert-link { @@ -6075,9 +5715,9 @@ fieldset:disabled .btn { } .alert-info { - color: #0e748b; - background-color: #d1f3fa; - border-color: #b9ecf8; + --bs-alert-color: #0e748b; + --bs-alert-bg: #d1f3fa; + --bs-alert-border-color: #b9ecf8; } .alert-info .alert-link { @@ -6085,9 +5725,9 @@ fieldset:disabled .btn { } .alert-warning { - color: #645314; - background-color: #fef5d6; - border-color: #fef1c2; + --bs-alert-color: #645314; + --bs-alert-bg: #fef5d6; + --bs-alert-border-color: #fef1c2; } .alert-warning .alert-link { @@ -6095,9 +5735,9 @@ fieldset:disabled .btn { } .alert-danger { - color: #8c0404; - background-color: #fbcdcd; - border-color: #f9b4b4; + --bs-alert-color: #8c0404; + --bs-alert-bg: #fbcdcd; + --bs-alert-border-color: #f9b4b4; } .alert-danger .alert-link { @@ -6105,9 +5745,9 @@ fieldset:disabled .btn { } .alert-light { - color: #5d5e60; - background-color: #fbfbfc; - border-color: #f8f9fa; + --bs-alert-color: #5d5e60; + --bs-alert-bg: #fbfbfc; + --bs-alert-border-color: #f8f9fa; } .alert-light .alert-link { @@ -6115,9 +5755,9 @@ fieldset:disabled .btn { } .alert-dark { - color: #1f2b3e; - background-color: #d6dae1; - border-color: #c2c8d1; + --bs-alert-color: #1f2b3e; + --bs-alert-bg: #d6dae1; + --bs-alert-border-color: #c2c8d1; } .alert-dark .alert-link { @@ -6125,9 +5765,9 @@ fieldset:disabled .btn { } .alert-white { - color: #666666; - background-color: white; - border-color: white; + --bs-alert-color: #666666; + --bs-alert-bg: white; + --bs-alert-border-color: white; } .alert-white .alert-link { @@ -6141,12 +5781,20 @@ fieldset:disabled .btn { } .progress { + --bs-progress-height: 3px; + --bs-progress-font-size: 0.75rem; + --bs-progress-bg: #e9ecef; + --bs-progress-border-radius: 0.5rem; + --bs-progress-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075); + --bs-progress-bar-color: #fff; + --bs-progress-bar-bg: #cb0c9f; + --bs-progress-bar-transition: width 0.6s ease; display: flex; - height: 3px; + height: var(--bs-progress-height); overflow: hidden; - font-size: 0.75rem; - background-color: #e9ecef; - border-radius: 0.5rem; + font-size: var(--bs-progress-font-size); + background-color: var(--bs-progress-bg); + border-radius: var(--bs-progress-border-radius); } .progress-bar { @@ -6154,11 +5802,11 @@ fieldset:disabled .btn { flex-direction: column; justify-content: center; overflow: hidden; - color: #fff; + color: var(--bs-progress-bar-color); text-align: center; white-space: nowrap; - background-color: #cb0c9f; - transition: width 0.6s ease; + background-color: var(--bs-progress-bar-bg); + transition: var(--bs-progress-bar-transition); } @media (prefers-reduced-motion: reduce) { @@ -6169,7 +5817,7 @@ fieldset:disabled .btn { .progress-bar-striped { background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-size: 3px 3px; + background-size: var(--bs-progress-height) var(--bs-progress-height); } .progress-bar-animated { @@ -6183,11 +5831,28 @@ fieldset:disabled .btn { } .list-group { + --bs-list-group-color: inherit; + --bs-list-group-bg: #fff; + --bs-list-group-border-color: rgba(0, 0, 0, 0.125); + --bs-list-group-border-width: 1px; + --bs-list-group-border-radius: 0.5rem; + --bs-list-group-item-padding-x: 1rem; + --bs-list-group-item-padding-y: 0.5rem; + --bs-list-group-action-color: #495057; + --bs-list-group-action-hover-color: #495057; + --bs-list-group-action-hover-bg: #f8f9fa; + --bs-list-group-action-active-color: #67748e; + --bs-list-group-action-active-bg: #e9ecef; + --bs-list-group-disabled-color: #6c757d; + --bs-list-group-disabled-bg: #fff; + --bs-list-group-active-color: #fff; + --bs-list-group-active-bg: #cb0c9f; + --bs-list-group-active-border-color: #cb0c9f; display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; - border-radius: 0.5rem; + border-radius: var(--bs-list-group-border-radius); } .list-group-numbered { @@ -6195,37 +5860,37 @@ fieldset:disabled .btn { counter-reset: section; } -.list-group-numbered>li::before { +.list-group-numbered>.list-group-item::before { content: counters(section, ".") ". "; counter-increment: section; } .list-group-item-action { width: 100%; - color: #495057; + color: var(--bs-list-group-action-color); text-align: inherit; } .list-group-item-action:hover, .list-group-item-action:focus { z-index: 1; - color: #495057; + color: var(--bs-list-group-action-hover-color); text-decoration: none; - background-color: #f8f9fa; + background-color: var(--bs-list-group-action-hover-bg); } .list-group-item-action:active { - color: #67748e; - background-color: #e9ecef; + color: var(--bs-list-group-action-active-color); + background-color: var(--bs-list-group-action-active-bg); } .list-group-item { position: relative; display: block; - padding: 0.5rem 1rem; - color: inherit; - background-color: #fff; - border: 1px solid rgba(0, 0, 0, 0.125); + padding: var(--bs-list-group-item-padding-y) var(--bs-list-group-item-padding-x); + color: var(--bs-list-group-color); + background-color: var(--bs-list-group-bg); + border: var(--bs-list-group-border-width) solid var(--bs-list-group-border-color); } .list-group-item:first-child { @@ -6240,16 +5905,16 @@ fieldset:disabled .btn { .list-group-item.disabled, .list-group-item:disabled { - color: #6c757d; + color: var(--bs-list-group-disabled-color); pointer-events: none; - background-color: #fff; + background-color: var(--bs-list-group-disabled-bg); } .list-group-item.active { z-index: 2; - color: #fff; - background-color: #cb0c9f; - border-color: #cb0c9f; + color: var(--bs-list-group-active-color); + background-color: var(--bs-list-group-active-bg); + border-color: var(--bs-list-group-active-border-color); } .list-group-item+.list-group-item { @@ -6257,8 +5922,8 @@ fieldset:disabled .btn { } .list-group-item+.list-group-item.active { - margin-top: -1px; - border-top-width: 1px; + margin-top: calc(var(--bs-list-group-border-width) * -1); + border-top-width: var(--bs-list-group-border-width); } .list-group-horizontal { @@ -6266,12 +5931,12 @@ fieldset:disabled .btn { } .list-group-horizontal>.list-group-item:first-child { - border-bottom-left-radius: 0.5rem; + border-bottom-left-radius: var(--bs-list-group-border-radius); border-top-right-radius: 0; } .list-group-horizontal>.list-group-item:last-child { - border-top-right-radius: 0.5rem; + border-top-right-radius: var(--bs-list-group-border-radius); border-bottom-left-radius: 0; } @@ -6280,13 +5945,13 @@ fieldset:disabled .btn { } .list-group-horizontal>.list-group-item+.list-group-item { - border-top-width: 1px; + border-top-width: var(--bs-list-group-border-width); border-left-width: 0; } .list-group-horizontal>.list-group-item+.list-group-item.active { - margin-left: -1px; - border-left-width: 1px; + margin-left: calc(var(--bs-list-group-border-width) * -1); + border-left-width: var(--bs-list-group-border-width); } @media (min-width: 576px) { @@ -6295,12 +5960,12 @@ fieldset:disabled .btn { } .list-group-horizontal-sm>.list-group-item:first-child { - border-bottom-left-radius: 0.5rem; + border-bottom-left-radius: var(--bs-list-group-border-radius); border-top-right-radius: 0; } .list-group-horizontal-sm>.list-group-item:last-child { - border-top-right-radius: 0.5rem; + border-top-right-radius: var(--bs-list-group-border-radius); border-bottom-left-radius: 0; } @@ -6309,13 +5974,13 @@ fieldset:disabled .btn { } .list-group-horizontal-sm>.list-group-item+.list-group-item { - border-top-width: 1px; + border-top-width: var(--bs-list-group-border-width); border-left-width: 0; } .list-group-horizontal-sm>.list-group-item+.list-group-item.active { - margin-left: -1px; - border-left-width: 1px; + margin-left: calc(var(--bs-list-group-border-width) * -1); + border-left-width: var(--bs-list-group-border-width); } } @@ -6325,12 +5990,12 @@ fieldset:disabled .btn { } .list-group-horizontal-md>.list-group-item:first-child { - border-bottom-left-radius: 0.5rem; + border-bottom-left-radius: var(--bs-list-group-border-radius); border-top-right-radius: 0; } .list-group-horizontal-md>.list-group-item:last-child { - border-top-right-radius: 0.5rem; + border-top-right-radius: var(--bs-list-group-border-radius); border-bottom-left-radius: 0; } @@ -6339,13 +6004,13 @@ fieldset:disabled .btn { } .list-group-horizontal-md>.list-group-item+.list-group-item { - border-top-width: 1px; + border-top-width: var(--bs-list-group-border-width); border-left-width: 0; } .list-group-horizontal-md>.list-group-item+.list-group-item.active { - margin-left: -1px; - border-left-width: 1px; + margin-left: calc(var(--bs-list-group-border-width) * -1); + border-left-width: var(--bs-list-group-border-width); } } @@ -6355,12 +6020,12 @@ fieldset:disabled .btn { } .list-group-horizontal-lg>.list-group-item:first-child { - border-bottom-left-radius: 0.5rem; + border-bottom-left-radius: var(--bs-list-group-border-radius); border-top-right-radius: 0; } .list-group-horizontal-lg>.list-group-item:last-child { - border-top-right-radius: 0.5rem; + border-top-right-radius: var(--bs-list-group-border-radius); border-bottom-left-radius: 0; } @@ -6369,13 +6034,13 @@ fieldset:disabled .btn { } .list-group-horizontal-lg>.list-group-item+.list-group-item { - border-top-width: 1px; + border-top-width: var(--bs-list-group-border-width); border-left-width: 0; } .list-group-horizontal-lg>.list-group-item+.list-group-item.active { - margin-left: -1px; - border-left-width: 1px; + margin-left: calc(var(--bs-list-group-border-width) * -1); + border-left-width: var(--bs-list-group-border-width); } } @@ -6385,12 +6050,12 @@ fieldset:disabled .btn { } .list-group-horizontal-xl>.list-group-item:first-child { - border-bottom-left-radius: 0.5rem; + border-bottom-left-radius: var(--bs-list-group-border-radius); border-top-right-radius: 0; } .list-group-horizontal-xl>.list-group-item:last-child { - border-top-right-radius: 0.5rem; + border-top-right-radius: var(--bs-list-group-border-radius); border-bottom-left-radius: 0; } @@ -6399,13 +6064,13 @@ fieldset:disabled .btn { } .list-group-horizontal-xl>.list-group-item+.list-group-item { - border-top-width: 1px; + border-top-width: var(--bs-list-group-border-width); border-left-width: 0; } .list-group-horizontal-xl>.list-group-item+.list-group-item.active { - margin-left: -1px; - border-left-width: 1px; + margin-left: calc(var(--bs-list-group-border-width) * -1); + border-left-width: var(--bs-list-group-border-width); } } @@ -6415,12 +6080,12 @@ fieldset:disabled .btn { } .list-group-horizontal-xxl>.list-group-item:first-child { - border-bottom-left-radius: 0.5rem; + border-bottom-left-radius: var(--bs-list-group-border-radius); border-top-right-radius: 0; } .list-group-horizontal-xxl>.list-group-item:last-child { - border-top-right-radius: 0.5rem; + border-top-right-radius: var(--bs-list-group-border-radius); border-bottom-left-radius: 0; } @@ -6429,13 +6094,13 @@ fieldset:disabled .btn { } .list-group-horizontal-xxl>.list-group-item+.list-group-item { - border-top-width: 1px; + border-top-width: var(--bs-list-group-border-width); border-left-width: 0; } .list-group-horizontal-xxl>.list-group-item+.list-group-item.active { - margin-left: -1px; - border-left-width: 1px; + margin-left: calc(var(--bs-list-group-border-width) * -1); + border-left-width: var(--bs-list-group-border-width); } } @@ -6444,7 +6109,7 @@ fieldset:disabled .btn { } .list-group-flush>.list-group-item { - border-width: 0 0 1px; + border-width: 0 0 var(--bs-list-group-border-width); } .list-group-flush>.list-group-item:last-child { @@ -6612,7 +6277,7 @@ fieldset:disabled .btn { color: #fff; background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat; border: 0; - border-radius: 0.25rem; + border-radius: 0.375rem; opacity: 0.5; } @@ -6640,15 +6305,30 @@ fieldset:disabled .btn { } .toast { - width: 350px; + --bs-toast-padding-x: 0.75rem; + --bs-toast-padding-y: 0.75rem; + --bs-toast-spacing: 1.5rem; + --bs-toast-max-width: 350px; + --bs-toast-font-size: 0.875rem; + --bs-toast-color: ; + --bs-toast-bg: rgba(255, 255, 255, 0.85); + --bs-toast-border-width: 0; + --bs-toast-border-color: transparent; + --bs-toast-border-radius: 0.5rem; + --bs-toast-box-shadow: 0 0.3125rem 0.625rem 0 rgba(0, 0, 0, 0.12); + --bs-toast-header-color: #344767; + --bs-toast-header-bg: rgba(255, 255, 255, 0.85); + --bs-toast-header-border-color: rgba(0, 0, 0, 0.05); + width: var(--bs-toast-max-width); max-width: 100%; - font-size: 0.875rem; + font-size: var(--bs-toast-font-size); + color: var(--bs-toast-color); pointer-events: auto; - background-color: rgba(255, 255, 255, 0.85); + background-color: var(--bs-toast-bg); background-clip: padding-box; - border: 0 solid transparent; - box-shadow: 0 0.3125rem 0.625rem 0 rgba(0, 0, 0, 0.12); - border-radius: 0.5rem; + border: var(--bs-toast-border-width) solid var(--bs-toast-border-color); + box-shadow: var(--bs-toast-box-shadow); + border-radius: var(--bs-toast-border-radius); } .toast.showing { @@ -6660,42 +6340,65 @@ fieldset:disabled .btn { } .toast-container { + position: absolute; + z-index: 1090; width: max-content; max-width: 100%; pointer-events: none; } .toast-container> :not(:last-child) { - margin-bottom: 1.5rem; + margin-bottom: var(--bs-toast-spacing); } .toast-header { display: flex; align-items: center; - padding: 0.75rem 0.75rem; - color: #344767; - background-color: rgba(255, 255, 255, 0.85); + padding: var(--bs-toast-padding-y) var(--bs-toast-padding-x); + color: var(--bs-toast-header-color); + background-color: var(--bs-toast-header-bg); background-clip: padding-box; - border-bottom: 0 solid rgba(0, 0, 0, 0.05); - border-top-left-radius: 0.5rem; - border-top-right-radius: 0.5rem; + border-bottom: var(--bs-toast-border-width) solid var(--bs-toast-header-border-color); + border-top-left-radius: calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width)); + border-top-right-radius: calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width)); } .toast-header .btn-close { - margin-right: -0.375rem; - margin-left: 0.75rem; + margin-right: calc(var(--bs-toast-padding-x) * -.5); + margin-left: var(--bs-toast-padding-x); } .toast-body { - padding: 0.75rem; + padding: var(--bs-toast-padding-x); word-wrap: break-word; } .modal { + --bs-modal-zindex: 1050; + --bs-modal-width: 500px; + --bs-modal-padding: 1rem; + --bs-modal-margin: 0.5rem; + --bs-modal-color: ; + --bs-modal-bg: #fff; + --bs-modal-border-color: rgba(0, 0, 0, 0.2); + --bs-modal-border-width: 1px; + --bs-modal-border-radius: 0.75rem; + --bs-modal-box-shadow: 0 0.25rem 0.375rem -0.0625rem rgba(20, 20, 20, 0.12), 0 0.125rem 0.25rem -0.0625rem rgba(20, 20, 20, 0.07); + --bs-modal-inner-border-radius: calc(0.75rem - 1px); + --bs-modal-header-padding-x: 1rem; + --bs-modal-header-padding-y: 1rem; + --bs-modal-header-padding: 1rem 1rem; + --bs-modal-header-border-color: #dee2e6; + --bs-modal-header-border-width: 1px; + --bs-modal-title-line-height: 1.5; + --bs-modal-footer-gap: 0.5rem; + --bs-modal-footer-bg: ; + --bs-modal-footer-border-color: #dee2e6; + --bs-modal-footer-border-width: 1px; position: fixed; top: 0; left: 0; - z-index: 1050; + z-index: var(--bs-modal-zindex); display: none; width: 100%; height: 100%; @@ -6707,7 +6410,7 @@ fieldset:disabled .btn { .modal-dialog { position: relative; width: auto; - margin: 0.5rem; + margin: var(--bs-modal-margin); pointer-events: none; } @@ -6731,7 +6434,7 @@ fieldset:disabled .btn { } .modal-dialog-scrollable { - height: calc(100% - 1rem); + height: calc(100% - var(--bs-modal-margin) * 2); } .modal-dialog-scrollable .modal-content { @@ -6746,7 +6449,7 @@ fieldset:disabled .btn { .modal-dialog-centered { display: flex; align-items: center; - min-height: calc(100% - 1rem); + min-height: calc(100% - var(--bs-modal-margin) * 2); } .modal-content { @@ -6754,22 +6457,26 @@ fieldset:disabled .btn { display: flex; flex-direction: column; width: 100%; + color: var(--bs-modal-color); pointer-events: auto; - background-color: #fff; + background-color: var(--bs-modal-bg); background-clip: padding-box; - border: 1px solid rgba(0, 0, 0, 0.2); - border-radius: 0.75rem; + border: var(--bs-modal-border-width) solid var(--bs-modal-border-color); + border-radius: var(--bs-modal-border-radius); outline: 0; } .modal-backdrop { + --bs-backdrop-zindex: 1040; + --bs-backdrop-bg: #000; + --bs-backdrop-opacity: 0.5; position: fixed; top: 0; left: 0; - z-index: 1040; + z-index: var(--bs-backdrop-zindex); width: 100vw; height: 100vh; - background-color: #000; + background-color: var(--bs-backdrop-bg); } .modal-backdrop.fade { @@ -6777,7 +6484,7 @@ fieldset:disabled .btn { } .modal-backdrop.show { - opacity: 0.5; + opacity: var(--bs-backdrop-opacity); } .modal-header { @@ -6785,60 +6492,59 @@ fieldset:disabled .btn { flex-shrink: 0; align-items: center; justify-content: space-between; - padding: 1rem 1rem; - border-bottom: 1px solid #dee2e6; - border-top-left-radius: calc(0.75rem - 1px); - border-top-right-radius: calc(0.75rem - 1px); + padding: var(--bs-modal-header-padding); + border-bottom: var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color); + border-top-left-radius: var(--bs-modal-inner-border-radius); + border-top-right-radius: var(--bs-modal-inner-border-radius); } .modal-header .btn-close { - padding: 0.5rem 0.5rem; - margin: -0.5rem -0.5rem -0.5rem auto; + padding: calc(var(--bs-modal-header-padding-y) * .5) calc(var(--bs-modal-header-padding-x) * .5); + margin: calc(var(--bs-modal-header-padding-y) * -.5) calc(var(--bs-modal-header-padding-x) * -.5) calc(var(--bs-modal-header-padding-y) * -.5) auto; } .modal-title { margin-bottom: 0; - line-height: 1.5; + line-height: var(--bs-modal-title-line-height); } .modal-body { position: relative; flex: 1 1 auto; - padding: 1rem; + padding: var(--bs-modal-padding); } .modal-footer { display: flex; - flex-wrap: wrap; flex-shrink: 0; + flex-wrap: wrap; align-items: center; justify-content: flex-end; - padding: 0.75rem; - border-top: 1px solid #dee2e6; - border-bottom-right-radius: calc(0.75rem - 1px); - border-bottom-left-radius: calc(0.75rem - 1px); + padding: calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap) * .5); + background-color: var(--bs-modal-footer-bg); + border-top: var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color); + border-bottom-right-radius: var(--bs-modal-inner-border-radius); + border-bottom-left-radius: var(--bs-modal-inner-border-radius); } .modal-footer>* { - margin: 0.25rem; + margin: calc(var(--bs-modal-footer-gap) * .5); } @media (min-width: 576px) { - .modal-dialog { - max-width: 500px; - margin: 1.75rem auto; - } - - .modal-dialog-scrollable { - height: calc(100% - 3.5rem); + .modal { + --bs-modal-margin: 1.75rem; + --bs-modal-box-shadow: 0 0.3125rem 0.625rem 0 rgba(0, 0, 0, 0.12); } - .modal-dialog-centered { - min-height: calc(100% - 3.5rem); + .modal-dialog { + max-width: var(--bs-modal-width); + margin-right: auto; + margin-left: auto; } .modal-sm { - max-width: 300px; + --bs-modal-width: 300px; } } @@ -6846,13 +6552,13 @@ fieldset:disabled .btn { .modal-lg, .modal-xl { - max-width: 800px; + --bs-modal-width: 800px; } } @media (min-width: 1200px) { .modal-xl { - max-width: 1140px; + --bs-modal-width: 1140px; } } @@ -6869,7 +6575,8 @@ fieldset:disabled .btn { border-radius: 0; } -.modal-fullscreen .modal-header { +.modal-fullscreen .modal-header, +.modal-fullscreen .modal-footer { border-radius: 0; } @@ -6877,10 +6584,6 @@ fieldset:disabled .btn { overflow-y: auto; } -.modal-fullscreen .modal-footer { - border-radius: 0; -} - @media (max-width: 575.98px) { .modal-fullscreen-sm-down { width: 100vw; @@ -6895,17 +6598,14 @@ fieldset:disabled .btn { border-radius: 0; } - .modal-fullscreen-sm-down .modal-header { + .modal-fullscreen-sm-down .modal-header, + .modal-fullscreen-sm-down .modal-footer { border-radius: 0; } .modal-fullscreen-sm-down .modal-body { overflow-y: auto; } - - .modal-fullscreen-sm-down .modal-footer { - border-radius: 0; - } } @media (max-width: 767.98px) { @@ -6922,17 +6622,14 @@ fieldset:disabled .btn { border-radius: 0; } - .modal-fullscreen-md-down .modal-header { + .modal-fullscreen-md-down .modal-header, + .modal-fullscreen-md-down .modal-footer { border-radius: 0; } .modal-fullscreen-md-down .modal-body { overflow-y: auto; } - - .modal-fullscreen-md-down .modal-footer { - border-radius: 0; - } } @media (max-width: 991.98px) { @@ -6949,17 +6646,14 @@ fieldset:disabled .btn { border-radius: 0; } - .modal-fullscreen-lg-down .modal-header { + .modal-fullscreen-lg-down .modal-header, + .modal-fullscreen-lg-down .modal-footer { border-radius: 0; } .modal-fullscreen-lg-down .modal-body { overflow-y: auto; } - - .modal-fullscreen-lg-down .modal-footer { - border-radius: 0; - } } @media (max-width: 1199.98px) { @@ -6976,17 +6670,14 @@ fieldset:disabled .btn { border-radius: 0; } - .modal-fullscreen-xl-down .modal-header { + .modal-fullscreen-xl-down .modal-header, + .modal-fullscreen-xl-down .modal-footer { border-radius: 0; } .modal-fullscreen-xl-down .modal-body { overflow-y: auto; } - - .modal-fullscreen-xl-down .modal-footer { - border-radius: 0; - } } @media (max-width: 1399.98px) { @@ -7003,24 +6694,33 @@ fieldset:disabled .btn { border-radius: 0; } - .modal-fullscreen-xxl-down .modal-header { + .modal-fullscreen-xxl-down .modal-header, + .modal-fullscreen-xxl-down .modal-footer { border-radius: 0; } .modal-fullscreen-xxl-down .modal-body { overflow-y: auto; } - - .modal-fullscreen-xxl-down .modal-footer { - border-radius: 0; - } } .tooltip { - position: absolute; - z-index: 1070; + --bs-tooltip-zindex: 1070; + --bs-tooltip-max-width: 200px; + --bs-tooltip-padding-x: 0.5rem; + --bs-tooltip-padding-y: 0.25rem; + --bs-tooltip-margin: 0; + --bs-tooltip-font-size: 0.875rem; + --bs-tooltip-color: #fff; + --bs-tooltip-bg: #000; + --bs-tooltip-border-radius: 0.5rem; + --bs-tooltip-opacity: 0.9; + --bs-tooltip-arrow-width: 0.8rem; + --bs-tooltip-arrow-height: 0.4rem; + z-index: var(--bs-tooltip-zindex); display: block; - margin: 0; + padding: var(--bs-tooltip-arrow-height); + margin: var(--bs-tooltip-margin); font-family: var(--bs-font-sans-serif); font-style: normal; font-weight: 400; @@ -7032,23 +6732,22 @@ fieldset:disabled .btn { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; - font-size: 0.875rem; + font-size: var(--bs-tooltip-font-size); word-wrap: break-word; opacity: 0; } .tooltip.show { - opacity: 0.9; + opacity: var(--bs-tooltip-opacity); } .tooltip .tooltip-arrow { - position: absolute; display: block; - width: 0.8rem; - height: 0.4rem; + width: var(--bs-tooltip-arrow-width); + height: var(--bs-tooltip-arrow-height); } .tooltip .tooltip-arrow::before { @@ -7058,11 +6757,6 @@ fieldset:disabled .btn { border-style: solid; } -.bs-tooltip-top, -.bs-tooltip-auto[data-popper-placement^="top"] { - padding: 0.4rem 0; -} - .bs-tooltip-top .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow { bottom: 0; @@ -7071,34 +6765,26 @@ fieldset:disabled .btn { .bs-tooltip-top .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before { top: -1px; - border-width: 0.4rem 0.4rem 0; - border-top-color: #000; -} - -.bs-tooltip-end, -.bs-tooltip-auto[data-popper-placement^="right"] { - padding: 0 0.4rem; + border-width: var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * .5) 0; + border-top-color: var(--bs-tooltip-bg); } +/* rtl:begin:ignore */ .bs-tooltip-end .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow { left: 0; - width: 0.4rem; - height: 0.8rem; + width: var(--bs-tooltip-arrow-height); + height: var(--bs-tooltip-arrow-width); } .bs-tooltip-end .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before { right: -1px; - border-width: 0.4rem 0.4rem 0.4rem 0; - border-right-color: #000; -} - -.bs-tooltip-bottom, -.bs-tooltip-auto[data-popper-placement^="bottom"] { - padding: 0.4rem 0; + border-width: calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * .5) 0; + border-right-color: var(--bs-tooltip-bg); } +/* rtl:end:ignore */ .bs-tooltip-bottom .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow { top: 0; @@ -7107,47 +6793,59 @@ fieldset:disabled .btn { .bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before { bottom: -1px; - border-width: 0 0.4rem 0.4rem; - border-bottom-color: #000; -} - -.bs-tooltip-start, -.bs-tooltip-auto[data-popper-placement^="left"] { - padding: 0 0.4rem; + border-width: 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height); + border-bottom-color: var(--bs-tooltip-bg); } +/* rtl:begin:ignore */ .bs-tooltip-start .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow { right: 0; - width: 0.4rem; - height: 0.8rem; + width: var(--bs-tooltip-arrow-height); + height: var(--bs-tooltip-arrow-width); } .bs-tooltip-start .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before { left: -1px; - border-width: 0.4rem 0 0.4rem 0.4rem; - border-left-color: #000; + border-width: calc(var(--bs-tooltip-arrow-width) * .5) 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height); + border-left-color: var(--bs-tooltip-bg); } +/* rtl:end:ignore */ .tooltip-inner { - max-width: 200px; - padding: 0.25rem 0.5rem; - color: #fff; + max-width: var(--bs-tooltip-max-width); + padding: var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x); + color: var(--bs-tooltip-color); text-align: center; - background-color: #000; - border-radius: 0.5rem; + background-color: var(--bs-tooltip-bg); + border-radius: var(--bs-tooltip-border-radius, 0); } .popover { - position: absolute; - top: 0; - left: 0 - /* rtl:ignore */ - ; - z-index: 1060; + --bs-popover-zindex: 1060; + --bs-popover-max-width: 276px; + --bs-popover-font-size: 0.75rem; + --bs-popover-bg: #fff; + --bs-popover-border-width: 0px; + --bs-popover-border-color: rgba(0, 0, 0, 0.2); + --bs-popover-border-radius: 0.75rem; + --bs-popover-inner-border-radius: calc(0.75rem - 0px); + --bs-popover-box-shadow: 0 0.25rem 0.375rem -0.0625rem rgba(20, 20, 20, 0.12), 0 0.125rem 0.25rem -0.0625rem rgba(20, 20, 20, 0.07); + --bs-popover-header-padding-x: 1rem; + --bs-popover-header-padding-y: 0.5rem; + --bs-popover-header-font-size: 1rem; + --bs-popover-header-color: #344767; + --bs-popover-header-bg: #e9ecef; + --bs-popover-body-padding-x: 1rem; + --bs-popover-body-padding-y: 1rem; + --bs-popover-body-color: #67748e; + --bs-popover-arrow-width: 1rem; + --bs-popover-arrow-height: 0.5rem; + --bs-popover-arrow-border: var(--bs-popover-border-color); + z-index: var(--bs-popover-zindex); display: block; - max-width: 276px; + max-width: var(--bs-popover-max-width); font-family: var(--bs-font-sans-serif); font-style: normal; font-weight: 400; @@ -7159,22 +6857,21 @@ fieldset:disabled .btn { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; - font-size: 0.75rem; + font-size: var(--bs-popover-font-size); word-wrap: break-word; - background-color: #fff; + background-color: var(--bs-popover-bg); background-clip: padding-box; - border: 0px solid rgba(0, 0, 0, 0.2); - border-radius: 0.75rem; + border: var(--bs-popover-border-width) solid var(--bs-popover-border-color); + border-radius: var(--bs-popover-border-radius); } .popover .popover-arrow { - position: absolute; display: block; - width: 1rem; - height: 0.5rem; + width: var(--bs-popover-arrow-width); + height: var(--bs-popover-arrow-height); } .popover .popover-arrow::before, @@ -7184,65 +6881,83 @@ fieldset:disabled .btn { content: ""; border-color: transparent; border-style: solid; + border-width: 0; } .bs-popover-top>.popover-arrow, .bs-popover-auto[data-popper-placement^="top"]>.popover-arrow { - bottom: calc(-0.5rem - 0px); + bottom: calc((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width)); +} + +.bs-popover-top>.popover-arrow::before, +.bs-popover-auto[data-popper-placement^="top"]>.popover-arrow::before, +.bs-popover-top>.popover-arrow::after, +.bs-popover-auto[data-popper-placement^="top"]>.popover-arrow::after { + border-width: var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * .5) 0; } .bs-popover-top>.popover-arrow::before, .bs-popover-auto[data-popper-placement^="top"]>.popover-arrow::before { bottom: 0; - border-width: 0.5rem 0.5rem 0; - border-top-color: rgba(0, 0, 0, 0.25); + border-top-color: var(--bs-popover-arrow-border); } .bs-popover-top>.popover-arrow::after, .bs-popover-auto[data-popper-placement^="top"]>.popover-arrow::after { - bottom: 0px; - border-width: 0.5rem 0.5rem 0; - border-top-color: #fff; + bottom: var(--bs-popover-border-width); + border-top-color: var(--bs-popover-bg); } +/* rtl:begin:ignore */ .bs-popover-end>.popover-arrow, .bs-popover-auto[data-popper-placement^="right"]>.popover-arrow { - left: calc(-0.5rem - 0px); - width: 0.5rem; - height: 1rem; + left: calc((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width)); + width: var(--bs-popover-arrow-height); + height: var(--bs-popover-arrow-width); +} + +.bs-popover-end>.popover-arrow::before, +.bs-popover-auto[data-popper-placement^="right"]>.popover-arrow::before, +.bs-popover-end>.popover-arrow::after, +.bs-popover-auto[data-popper-placement^="right"]>.popover-arrow::after { + border-width: calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * .5) 0; } .bs-popover-end>.popover-arrow::before, .bs-popover-auto[data-popper-placement^="right"]>.popover-arrow::before { left: 0; - border-width: 0.5rem 0.5rem 0.5rem 0; - border-right-color: rgba(0, 0, 0, 0.25); + border-right-color: var(--bs-popover-arrow-border); } .bs-popover-end>.popover-arrow::after, .bs-popover-auto[data-popper-placement^="right"]>.popover-arrow::after { - left: 0px; - border-width: 0.5rem 0.5rem 0.5rem 0; - border-right-color: #fff; + left: var(--bs-popover-border-width); + border-right-color: var(--bs-popover-bg); } +/* rtl:end:ignore */ .bs-popover-bottom>.popover-arrow, .bs-popover-auto[data-popper-placement^="bottom"]>.popover-arrow { - top: calc(-0.5rem - 0px); + top: calc((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width)); +} + +.bs-popover-bottom>.popover-arrow::before, +.bs-popover-auto[data-popper-placement^="bottom"]>.popover-arrow::before, +.bs-popover-bottom>.popover-arrow::after, +.bs-popover-auto[data-popper-placement^="bottom"]>.popover-arrow::after { + border-width: 0 calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height); } .bs-popover-bottom>.popover-arrow::before, .bs-popover-auto[data-popper-placement^="bottom"]>.popover-arrow::before { top: 0; - border-width: 0 0.5rem 0.5rem 0.5rem; - border-bottom-color: rgba(0, 0, 0, 0.25); + border-bottom-color: var(--bs-popover-arrow-border); } .bs-popover-bottom>.popover-arrow::after, .bs-popover-auto[data-popper-placement^="bottom"]>.popover-arrow::after { - top: 0px; - border-width: 0 0.5rem 0.5rem 0.5rem; - border-bottom-color: #fff; + top: var(--bs-popover-border-width); + border-bottom-color: var(--bs-popover-bg); } .bs-popover-bottom .popover-header::before, @@ -7251,42 +6966,49 @@ fieldset:disabled .btn { top: 0; left: 50%; display: block; - width: 1rem; - margin-left: -0.5rem; + width: var(--bs-popover-arrow-width); + margin-left: calc(var(--bs-popover-arrow-width) * -.5); content: ""; - border-bottom: 0px solid #e9ecef; + border-bottom: var(--bs-popover-border-width) solid var(--bs-popover-header-bg); } +/* rtl:begin:ignore */ .bs-popover-start>.popover-arrow, .bs-popover-auto[data-popper-placement^="left"]>.popover-arrow { - right: calc(-0.5rem - 0px); - width: 0.5rem; - height: 1rem; + right: calc((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width)); + width: var(--bs-popover-arrow-height); + height: var(--bs-popover-arrow-width); +} + +.bs-popover-start>.popover-arrow::before, +.bs-popover-auto[data-popper-placement^="left"]>.popover-arrow::before, +.bs-popover-start>.popover-arrow::after, +.bs-popover-auto[data-popper-placement^="left"]>.popover-arrow::after { + border-width: calc(var(--bs-popover-arrow-width) * .5) 0 calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height); } .bs-popover-start>.popover-arrow::before, .bs-popover-auto[data-popper-placement^="left"]>.popover-arrow::before { right: 0; - border-width: 0.5rem 0 0.5rem 0.5rem; - border-left-color: rgba(0, 0, 0, 0.25); + border-left-color: var(--bs-popover-arrow-border); } .bs-popover-start>.popover-arrow::after, .bs-popover-auto[data-popper-placement^="left"]>.popover-arrow::after { - right: 0px; - border-width: 0.5rem 0 0.5rem 0.5rem; - border-left-color: #fff; + right: var(--bs-popover-border-width); + border-left-color: var(--bs-popover-bg); } +/* rtl:end:ignore */ .popover-header { - padding: 0.5rem 1rem; + padding: var(--bs-popover-header-padding-y) var(--bs-popover-header-padding-x); margin-bottom: 0; - font-size: 1rem; - color: #344767; - background-color: #e9ecef; - border-bottom: 0px solid rgba(0, 0, 0, 0.2); - border-top-left-radius: calc(0.75rem - 0px); - border-top-right-radius: calc(0.75rem - 0px); + font-size: var(--bs-popover-header-font-size); + color: var(--bs-popover-header-color); + background-color: var(--bs-popover-header-bg); + border-bottom: var(--bs-popover-border-width) solid var(--bs-popover-border-color); + border-top-left-radius: var(--bs-popover-inner-border-radius); + border-top-right-radius: var(--bs-popover-inner-border-radius); } .popover-header:empty { @@ -7294,8 +7016,8 @@ fieldset:disabled .btn { } .popover-body { - padding: 1rem 1rem; - color: #67748e; + padding: var(--bs-popover-body-padding-y) var(--bs-popover-body-padding-x); + color: var(--bs-popover-body-color); } .carousel { @@ -7485,97 +7207,583 @@ fieldset:disabled .btn { transition: opacity 0.6s ease; } -@media (prefers-reduced-motion: reduce) { - .carousel-indicators [data-bs-target] { - transition: none; +@media (prefers-reduced-motion: reduce) { + .carousel-indicators [data-bs-target] { + transition: none; + } +} + +.carousel-indicators .active { + opacity: 1; +} + +.carousel-caption { + position: absolute; + right: 15%; + bottom: 1.25rem; + left: 15%; + padding-top: 1.25rem; + padding-bottom: 1.25rem; + color: #fff; + text-align: center; +} + +.carousel-dark .carousel-control-prev-icon, +.carousel-dark .carousel-control-next-icon { + filter: invert(1) grayscale(100); +} + +.carousel-dark .carousel-indicators [data-bs-target] { + background-color: #000; +} + +.carousel-dark .carousel-caption { + color: #000; +} + +.spinner-grow, +.spinner-border { + display: inline-block; + width: var(--bs-spinner-width); + height: var(--bs-spinner-height); + vertical-align: var(--bs-spinner-vertical-align); + border-radius: 50%; + animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name); +} + +@keyframes spinner-border { + to { + transform: rotate(360deg) + /* rtl:ignore */ + ; + } +} + +.spinner-border { + --bs-spinner-width: 2rem; + --bs-spinner-height: 2rem; + --bs-spinner-vertical-align: -0.125em; + --bs-spinner-border-width: 0.25em; + --bs-spinner-animation-speed: 0.75s; + --bs-spinner-animation-name: spinner-border; + border: var(--bs-spinner-border-width) solid currentcolor; + border-right-color: transparent; +} + +.spinner-border-sm { + --bs-spinner-width: 1rem; + --bs-spinner-height: 1rem; + --bs-spinner-border-width: 0.2em; +} + +@keyframes spinner-grow { + 0% { + transform: scale(0); + } + + 50% { + opacity: 1; + transform: none; + } +} + +.spinner-grow { + --bs-spinner-width: 2rem; + --bs-spinner-height: 2rem; + --bs-spinner-vertical-align: -0.125em; + --bs-spinner-animation-speed: 0.75s; + --bs-spinner-animation-name: spinner-grow; + background-color: currentcolor; + opacity: 0; +} + +.spinner-grow-sm { + --bs-spinner-width: 1rem; + --bs-spinner-height: 1rem; +} + +@media (prefers-reduced-motion: reduce) { + + .spinner-border, + .spinner-grow { + --bs-spinner-animation-speed: 1.5s; + } +} + +.offcanvas-sm, +.offcanvas-md, +.offcanvas-lg, +.offcanvas-xl, +.offcanvas-xxl, +.offcanvas { + --bs-offcanvas-width: 400px; + --bs-offcanvas-height: 30vh; + --bs-offcanvas-padding-x: 1rem; + --bs-offcanvas-padding-y: 1rem; + --bs-offcanvas-color: ; + --bs-offcanvas-bg: #fff; + --bs-offcanvas-border-width: 1px; + --bs-offcanvas-border-color: rgba(0, 0, 0, 0.2); + --bs-offcanvas-box-shadow: 0 0.25rem 0.375rem -0.0625rem rgba(20, 20, 20, 0.12), 0 0.125rem 0.25rem -0.0625rem rgba(20, 20, 20, 0.07); +} + +@media (max-width: 575.98px) { + .offcanvas-sm { + position: fixed; + bottom: 0; + z-index: 1045; + display: flex; + flex-direction: column; + max-width: 100%; + color: var(--bs-offcanvas-color); + visibility: hidden; + background-color: var(--bs-offcanvas-bg); + background-clip: padding-box; + outline: 0; + transition: transform 0.3s ease-in-out; + } +} + +@media (max-width: 575.98px) and (prefers-reduced-motion: reduce) { + .offcanvas-sm { + transition: none; + } +} + +@media (max-width: 575.98px) { + + .offcanvas-sm.showing, + .offcanvas-sm.show:not(.hiding) { + transform: none; + } + + .offcanvas-sm.showing, + .offcanvas-sm.hiding, + .offcanvas-sm.show { + visibility: visible; + } + + .offcanvas-sm.offcanvas-start { + top: 0; + left: 0; + width: var(--bs-offcanvas-width); + border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(-100%); + } + + .offcanvas-sm.offcanvas-end { + top: 0; + right: 0; + width: var(--bs-offcanvas-width); + border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(100%); + } + + .offcanvas-sm.offcanvas-top { + top: 0; + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(-100%); + } + + .offcanvas-sm.offcanvas-bottom { + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(100%); + } +} + +@media (min-width: 576px) { + .offcanvas-sm { + --bs-offcanvas-height: auto; + --bs-offcanvas-border-width: 0; + background-color: transparent !important; + } + + .offcanvas-sm .offcanvas-header { + display: none; + } + + .offcanvas-sm .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + background-color: transparent !important; + } +} + +@media (max-width: 767.98px) { + .offcanvas-md { + position: fixed; + bottom: 0; + z-index: 1045; + display: flex; + flex-direction: column; + max-width: 100%; + color: var(--bs-offcanvas-color); + visibility: hidden; + background-color: var(--bs-offcanvas-bg); + background-clip: padding-box; + outline: 0; + transition: transform 0.3s ease-in-out; + } +} + +@media (max-width: 767.98px) and (prefers-reduced-motion: reduce) { + .offcanvas-md { + transition: none; + } +} + +@media (max-width: 767.98px) { + + .offcanvas-md.showing, + .offcanvas-md.show:not(.hiding) { + transform: none; + } + + .offcanvas-md.showing, + .offcanvas-md.hiding, + .offcanvas-md.show { + visibility: visible; + } + + .offcanvas-md.offcanvas-start { + top: 0; + left: 0; + width: var(--bs-offcanvas-width); + border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(-100%); + } + + .offcanvas-md.offcanvas-end { + top: 0; + right: 0; + width: var(--bs-offcanvas-width); + border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(100%); + } + + .offcanvas-md.offcanvas-top { + top: 0; + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(-100%); + } + + .offcanvas-md.offcanvas-bottom { + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(100%); + } +} + +@media (min-width: 768px) { + .offcanvas-md { + --bs-offcanvas-height: auto; + --bs-offcanvas-border-width: 0; + background-color: transparent !important; + } + + .offcanvas-md .offcanvas-header { + display: none; + } + + .offcanvas-md .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + background-color: transparent !important; + } +} + +@media (max-width: 991.98px) { + .offcanvas-lg { + position: fixed; + bottom: 0; + z-index: 1045; + display: flex; + flex-direction: column; + max-width: 100%; + color: var(--bs-offcanvas-color); + visibility: hidden; + background-color: var(--bs-offcanvas-bg); + background-clip: padding-box; + outline: 0; + transition: transform 0.3s ease-in-out; + } +} + +@media (max-width: 991.98px) and (prefers-reduced-motion: reduce) { + .offcanvas-lg { + transition: none; + } +} + +@media (max-width: 991.98px) { + + .offcanvas-lg.showing, + .offcanvas-lg.show:not(.hiding) { + transform: none; + } + + .offcanvas-lg.showing, + .offcanvas-lg.hiding, + .offcanvas-lg.show { + visibility: visible; + } + + .offcanvas-lg.offcanvas-start { + top: 0; + left: 0; + width: var(--bs-offcanvas-width); + border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(-100%); + } + + .offcanvas-lg.offcanvas-end { + top: 0; + right: 0; + width: var(--bs-offcanvas-width); + border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(100%); + } + + .offcanvas-lg.offcanvas-top { + top: 0; + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(-100%); + } + + .offcanvas-lg.offcanvas-bottom { + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(100%); + } +} + +@media (min-width: 992px) { + .offcanvas-lg { + --bs-offcanvas-height: auto; + --bs-offcanvas-border-width: 0; + background-color: transparent !important; } -} -.carousel-indicators .active { - opacity: 1; -} + .offcanvas-lg .offcanvas-header { + display: none; + } -.carousel-caption { - position: absolute; - right: 15%; - bottom: 1.25rem; - left: 15%; - padding-top: 1.25rem; - padding-bottom: 1.25rem; - color: #fff; - text-align: center; + .offcanvas-lg .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + background-color: transparent !important; + } } -.carousel-dark .carousel-control-prev-icon, -.carousel-dark .carousel-control-next-icon { - filter: invert(1) grayscale(100); +@media (max-width: 1199.98px) { + .offcanvas-xl { + position: fixed; + bottom: 0; + z-index: 1045; + display: flex; + flex-direction: column; + max-width: 100%; + color: var(--bs-offcanvas-color); + visibility: hidden; + background-color: var(--bs-offcanvas-bg); + background-clip: padding-box; + outline: 0; + transition: transform 0.3s ease-in-out; + } } -.carousel-dark .carousel-indicators [data-bs-target] { - background-color: #000; +@media (max-width: 1199.98px) and (prefers-reduced-motion: reduce) { + .offcanvas-xl { + transition: none; + } } -.carousel-dark .carousel-caption { - color: #000; -} +@media (max-width: 1199.98px) { -@keyframes spinner-border { - to { - transform: rotate(360deg) - /* rtl:ignore */ - ; + .offcanvas-xl.showing, + .offcanvas-xl.show:not(.hiding) { + transform: none; + } + + .offcanvas-xl.showing, + .offcanvas-xl.hiding, + .offcanvas-xl.show { + visibility: visible; + } + + .offcanvas-xl.offcanvas-start { + top: 0; + left: 0; + width: var(--bs-offcanvas-width); + border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(-100%); + } + + .offcanvas-xl.offcanvas-end { + top: 0; + right: 0; + width: var(--bs-offcanvas-width); + border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(100%); + } + + .offcanvas-xl.offcanvas-top { + top: 0; + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(-100%); + } + + .offcanvas-xl.offcanvas-bottom { + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(100%); } } -.spinner-border { - display: inline-block; - width: 2rem; - height: 2rem; - vertical-align: -0.125em; - border: 0.25em solid currentColor; - border-right-color: transparent; - border-radius: 50%; - animation: 0.75s linear infinite spinner-border; +@media (min-width: 1200px) { + .offcanvas-xl { + --bs-offcanvas-height: auto; + --bs-offcanvas-border-width: 0; + background-color: transparent !important; + } + + .offcanvas-xl .offcanvas-header { + display: none; + } + + .offcanvas-xl .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + background-color: transparent !important; + } } -.spinner-border-sm { - width: 1rem; - height: 1rem; - border-width: 0.2em; +@media (max-width: 1399.98px) { + .offcanvas-xxl { + position: fixed; + bottom: 0; + z-index: 1045; + display: flex; + flex-direction: column; + max-width: 100%; + color: var(--bs-offcanvas-color); + visibility: hidden; + background-color: var(--bs-offcanvas-bg); + background-clip: padding-box; + outline: 0; + transition: transform 0.3s ease-in-out; + } } -@keyframes spinner-grow { - 0% { - transform: scale(0); +@media (max-width: 1399.98px) and (prefers-reduced-motion: reduce) { + .offcanvas-xxl { + transition: none; } +} - 50% { - opacity: 1; +@media (max-width: 1399.98px) { + + .offcanvas-xxl.showing, + .offcanvas-xxl.show:not(.hiding) { transform: none; } -} -.spinner-grow { - display: inline-block; - width: 2rem; - height: 2rem; - vertical-align: -0.125em; - background-color: currentColor; - border-radius: 50%; - opacity: 0; - animation: 0.75s linear infinite spinner-grow; -} + .offcanvas-xxl.showing, + .offcanvas-xxl.hiding, + .offcanvas-xxl.show { + visibility: visible; + } -.spinner-grow-sm { - width: 1rem; - height: 1rem; + .offcanvas-xxl.offcanvas-start { + top: 0; + left: 0; + width: var(--bs-offcanvas-width); + border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(-100%); + } + + .offcanvas-xxl.offcanvas-end { + top: 0; + right: 0; + width: var(--bs-offcanvas-width); + border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(100%); + } + + .offcanvas-xxl.offcanvas-top { + top: 0; + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(-100%); + } + + .offcanvas-xxl.offcanvas-bottom { + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(100%); + } } -@media (prefers-reduced-motion: reduce) { +@media (min-width: 1400px) { + .offcanvas-xxl { + --bs-offcanvas-height: auto; + --bs-offcanvas-border-width: 0; + background-color: transparent !important; + } - .spinner-border, - .spinner-grow { - animation-duration: 1.5s; + .offcanvas-xxl .offcanvas-header { + display: none; + } + + .offcanvas-xxl .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + background-color: transparent !important; } } @@ -7586,8 +7794,9 @@ fieldset:disabled .btn { display: flex; flex-direction: column; max-width: 100%; + color: var(--bs-offcanvas-color); visibility: hidden; - background-color: #fff; + background-color: var(--bs-offcanvas-bg); background-clip: padding-box; outline: 0; transition: transform 0.3s ease-in-out; @@ -7599,6 +7808,52 @@ fieldset:disabled .btn { } } +.offcanvas.showing, +.offcanvas.show:not(.hiding) { + transform: none; +} + +.offcanvas.showing, +.offcanvas.hiding, +.offcanvas.show { + visibility: visible; +} + +.offcanvas.offcanvas-start { + top: 0; + left: 0; + width: var(--bs-offcanvas-width); + border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(-100%); +} + +.offcanvas.offcanvas-end { + top: 0; + right: 0; + width: var(--bs-offcanvas-width); + border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateX(100%); +} + +.offcanvas.offcanvas-top { + top: 0; + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(-100%); +} + +.offcanvas.offcanvas-bottom { + right: 0; + left: 0; + height: var(--bs-offcanvas-height); + max-height: 100%; + border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color); + transform: translateY(100%); +} + .offcanvas-backdrop { position: fixed; top: 0; @@ -7621,14 +7876,14 @@ fieldset:disabled .btn { display: flex; align-items: center; justify-content: space-between; - padding: 1rem 1rem; + padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x); } .offcanvas-header .btn-close { - padding: 0.5rem 0.5rem; - margin-top: -0.5rem; - margin-right: -0.5rem; - margin-bottom: -0.5rem; + padding: calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5); + margin-top: calc(var(--bs-offcanvas-padding-y) * -.5); + margin-right: calc(var(--bs-offcanvas-padding-x) * -.5); + margin-bottom: calc(var(--bs-offcanvas-padding-y) * -.5); } .offcanvas-title { @@ -7638,55 +7893,16 @@ fieldset:disabled .btn { .offcanvas-body { flex-grow: 1; - padding: 1rem 1rem; + padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x); overflow-y: auto; } -.offcanvas-start { - top: 0; - left: 0; - width: 400px; - border-right: 1px solid rgba(0, 0, 0, 0.2); - transform: translateX(-100%); -} - -.offcanvas-end { - top: 0; - right: 0; - width: 400px; - border-left: 1px solid rgba(0, 0, 0, 0.2); - transform: translateX(100%); -} - -.offcanvas-top { - top: 0; - right: 0; - left: 0; - height: 30vh; - max-height: 100%; - border-bottom: 1px solid rgba(0, 0, 0, 0.2); - transform: translateY(-100%); -} - -.offcanvas-bottom { - right: 0; - left: 0; - height: 30vh; - max-height: 100%; - border-top: 1px solid rgba(0, 0, 0, 0.2); - transform: translateY(100%); -} - -.offcanvas.show { - transform: none; -} - .placeholder { display: inline-block; min-height: 1em; vertical-align: middle; cursor: wait; - background-color: currentColor; + background-color: currentcolor; opacity: 0.5; } @@ -7735,85 +7951,130 @@ fieldset:disabled .btn { content: ""; } +.text-bg-primary { + color: #fff !important; + background-color: RGBA(203, 12, 159, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-secondary { + color: #000 !important; + background-color: RGBA(131, 146, 171, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-success { + color: #000 !important; + background-color: RGBA(130, 214, 22, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-info { + color: #000 !important; + background-color: RGBA(23, 193, 232, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-warning { + color: #000 !important; + background-color: RGBA(251, 207, 51, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-danger { + color: #fff !important; + background-color: RGBA(234, 6, 6, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-light { + color: #000 !important; + background-color: RGBA(233, 236, 239, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-dark { + color: #fff !important; + background-color: RGBA(52, 71, 103, var(--bs-bg-opacity, 1)) !important; +} + +.text-bg-white { + color: #000 !important; + background-color: RGBA(255, 255, 255, var(--bs-bg-opacity, 1)) !important; +} + .link-primary { - color: #cb0c9f; + color: #cb0c9f !important; } .link-primary:hover, .link-primary:focus { - color: #a20a7f; + color: #a20a7f !important; } .link-secondary { - color: #8392AB; + color: #8392AB !important; } .link-secondary:hover, .link-secondary:focus { - color: #9ca8bc; + color: #9ca8bc !important; } .link-success { - color: #82d616; + color: #82d616 !important; } .link-success:hover, .link-success:focus { - color: #9bde45; + color: #9bde45 !important; } .link-info { - color: #17c1e8; + color: #17c1e8 !important; } .link-info:hover, .link-info:focus { - color: #45cded; + color: #45cded !important; } .link-warning { - color: #fbcf33; + color: #fbcf33 !important; } .link-warning:hover, .link-warning:focus { - color: #fcd95c; + color: #fcd95c !important; } .link-danger { - color: #ea0606; + color: #ea0606 !important; } .link-danger:hover, .link-danger:focus { - color: #bb0505; + color: #bb0505 !important; } .link-light { - color: #e9ecef; + color: #e9ecef !important; } .link-light:hover, .link-light:focus { - color: #edf0f2; + color: #edf0f2 !important; } .link-dark { - color: #344767; + color: #344767 !important; } .link-dark:hover, .link-dark:focus { - color: #2a3952; + color: #2a3952 !important; } .link-white { - color: #fff; + color: #fff !important; } .link-white:hover, .link-white:focus { - color: white; + color: white !important; } .ratio { @@ -7873,12 +8134,24 @@ fieldset:disabled .btn { z-index: 1020; } +.sticky-bottom { + position: sticky; + bottom: 0; + z-index: 1020; +} + @media (min-width: 576px) { .sticky-sm-top { position: sticky; top: 0; z-index: 1020; } + + .sticky-sm-bottom { + position: sticky; + bottom: 0; + z-index: 1020; + } } @media (min-width: 768px) { @@ -7887,6 +8160,12 @@ fieldset:disabled .btn { top: 0; z-index: 1020; } + + .sticky-md-bottom { + position: sticky; + bottom: 0; + z-index: 1020; + } } @media (min-width: 992px) { @@ -7895,6 +8174,12 @@ fieldset:disabled .btn { top: 0; z-index: 1020; } + + .sticky-lg-bottom { + position: sticky; + bottom: 0; + z-index: 1020; + } } @media (min-width: 1200px) { @@ -7903,6 +8188,12 @@ fieldset:disabled .btn { top: 0; z-index: 1020; } + + .sticky-xl-bottom { + position: sticky; + bottom: 0; + z-index: 1020; + } } @media (min-width: 1400px) { @@ -7911,6 +8202,12 @@ fieldset:disabled .btn { top: 0; z-index: 1020; } + + .sticky-xxl-bottom { + position: sticky; + bottom: 0; + z-index: 1020; + } } .hstack { @@ -7961,7 +8258,7 @@ fieldset:disabled .btn { align-self: stretch; width: 1px; min-height: 1em; - background-color: currentColor; + background-color: currentcolor; opacity: 0.25; } @@ -8469,6 +8766,26 @@ fieldset:disabled .btn { border-width: 5px !important; } +.border-opacity-10 { + --bs-border-opacity: 0.1; +} + +.border-opacity-25 { + --bs-border-opacity: 0.25; +} + +.border-opacity-50 { + --bs-border-opacity: 0.5; +} + +.border-opacity-75 { + --bs-border-opacity: 0.75; +} + +.border-opacity-100 { + --bs-border-opacity: 1; +} + .w-0 { width: 0% !important; } @@ -8729,58 +9046,6 @@ fieldset:disabled .btn { flex-wrap: wrap-reverse !important; } -.gap-0 { - gap: 0 !important; -} - -.gap-1 { - gap: 0.25rem !important; -} - -.gap-2 { - gap: 0.5rem !important; -} - -.gap-3 { - gap: 1rem !important; -} - -.gap-4 { - gap: 1.5rem !important; -} - -.gap-5 { - gap: 3rem !important; -} - -.gap-6 { - gap: 4rem !important; -} - -.gap-7 { - gap: 6rem !important; -} - -.gap-8 { - gap: 8rem !important; -} - -.gap-9 { - gap: 10rem !important; -} - -.gap-10 { - gap: 12rem !important; -} - -.gap-11 { - gap: 14rem !important; -} - -.gap-12 { - gap: 16rem !important; -} - .justify-content-start { justify-content: flex-start !important; } @@ -10075,6 +10340,58 @@ fieldset:disabled .btn { padding-left: 16rem !important; } +.gap-0 { + gap: 0 !important; +} + +.gap-1 { + gap: 0.25rem !important; +} + +.gap-2 { + gap: 0.5rem !important; +} + +.gap-3 { + gap: 1rem !important; +} + +.gap-4 { + gap: 1.5rem !important; +} + +.gap-5 { + gap: 3rem !important; +} + +.gap-6 { + gap: 4rem !important; +} + +.gap-7 { + gap: 6rem !important; +} + +.gap-8 { + gap: 8rem !important; +} + +.gap-9 { + gap: 10rem !important; +} + +.gap-10 { + gap: 12rem !important; +} + +.gap-11 { + gap: 14rem !important; +} + +.gap-12 { + gap: 16rem !important; +} + .font-monospace { font-family: var(--bs-font-monospace) !important; } @@ -10395,7 +10712,7 @@ fieldset:disabled .btn { } .rounded { - border-radius: 0.25rem !important; + border-radius: 0.375rem !important; } .rounded-0 { @@ -10407,7 +10724,7 @@ fieldset:disabled .btn { } .rounded-2 { - border-radius: 0.25rem !important; + border-radius: 0.375rem !important; } .rounded-3 { @@ -10424,23 +10741,23 @@ fieldset:disabled .btn { } .rounded-top { - border-top-left-radius: 0.25rem !important; - border-top-right-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; + border-top-right-radius: 0.375rem !important; } .rounded-end { - border-top-right-radius: 0.25rem !important; - border-bottom-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; + border-bottom-right-radius: 0.375rem !important; } .rounded-bottom { - border-bottom-right-radius: 0.25rem !important; - border-bottom-left-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; + border-bottom-left-radius: 0.375rem !important; } .rounded-start { - border-bottom-left-radius: 0.25rem !important; - border-top-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; + border-top-left-radius: 0.375rem !important; } .visible { @@ -10512,7 +10829,7 @@ fieldset:disabled .btn { } .border-radius-top-start { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-0 { @@ -10524,7 +10841,7 @@ fieldset:disabled .btn { } .border-radius-top-start-md { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-lg { @@ -10548,7 +10865,7 @@ fieldset:disabled .btn { } .border-radius-top-end { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-0 { @@ -10560,7 +10877,7 @@ fieldset:disabled .btn { } .border-radius-top-end-md { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-lg { @@ -10584,7 +10901,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-0 { @@ -10596,7 +10913,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-md { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-lg { @@ -10620,7 +10937,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-0 { @@ -10632,7 +10949,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-md { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-lg { @@ -11068,58 +11385,6 @@ fieldset:disabled .btn { flex-wrap: wrap-reverse !important; } - .gap-sm-0 { - gap: 0 !important; - } - - .gap-sm-1 { - gap: 0.25rem !important; - } - - .gap-sm-2 { - gap: 0.5rem !important; - } - - .gap-sm-3 { - gap: 1rem !important; - } - - .gap-sm-4 { - gap: 1.5rem !important; - } - - .gap-sm-5 { - gap: 3rem !important; - } - - .gap-sm-6 { - gap: 4rem !important; - } - - .gap-sm-7 { - gap: 6rem !important; - } - - .gap-sm-8 { - gap: 8rem !important; - } - - .gap-sm-9 { - gap: 10rem !important; - } - - .gap-sm-10 { - gap: 12rem !important; - } - - .gap-sm-11 { - gap: 14rem !important; - } - - .gap-sm-12 { - gap: 16rem !important; - } - .justify-content-sm-start { justify-content: flex-start !important; } @@ -12382,36 +12647,88 @@ fieldset:disabled .btn { padding-left: 1.5rem !important; } - .ps-sm-5 { - padding-left: 3rem !important; + .ps-sm-5 { + padding-left: 3rem !important; + } + + .ps-sm-6 { + padding-left: 4rem !important; + } + + .ps-sm-7 { + padding-left: 6rem !important; + } + + .ps-sm-8 { + padding-left: 8rem !important; + } + + .ps-sm-9 { + padding-left: 10rem !important; + } + + .ps-sm-10 { + padding-left: 12rem !important; + } + + .ps-sm-11 { + padding-left: 14rem !important; + } + + .ps-sm-12 { + padding-left: 16rem !important; + } + + .gap-sm-0 { + gap: 0 !important; + } + + .gap-sm-1 { + gap: 0.25rem !important; + } + + .gap-sm-2 { + gap: 0.5rem !important; + } + + .gap-sm-3 { + gap: 1rem !important; + } + + .gap-sm-4 { + gap: 1.5rem !important; + } + + .gap-sm-5 { + gap: 3rem !important; } - .ps-sm-6 { - padding-left: 4rem !important; + .gap-sm-6 { + gap: 4rem !important; } - .ps-sm-7 { - padding-left: 6rem !important; + .gap-sm-7 { + gap: 6rem !important; } - .ps-sm-8 { - padding-left: 8rem !important; + .gap-sm-8 { + gap: 8rem !important; } - .ps-sm-9 { - padding-left: 10rem !important; + .gap-sm-9 { + gap: 10rem !important; } - .ps-sm-10 { - padding-left: 12rem !important; + .gap-sm-10 { + gap: 12rem !important; } - .ps-sm-11 { - padding-left: 14rem !important; + .gap-sm-11 { + gap: 14rem !important; } - .ps-sm-12 { - padding-left: 16rem !important; + .gap-sm-12 { + gap: 16rem !important; } .text-sm-start { @@ -12451,7 +12768,7 @@ fieldset:disabled .btn { } .border-radius-top-start-sm { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-sm-0 { @@ -12463,7 +12780,7 @@ fieldset:disabled .btn { } .border-radius-top-start-sm-md { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-sm-lg { @@ -12487,7 +12804,7 @@ fieldset:disabled .btn { } .border-radius-top-end-sm { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-sm-0 { @@ -12499,7 +12816,7 @@ fieldset:disabled .btn { } .border-radius-top-end-sm-md { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-sm-lg { @@ -12523,7 +12840,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-sm { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-sm-0 { @@ -12535,7 +12852,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-sm-md { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-sm-lg { @@ -12559,7 +12876,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-sm { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-sm-0 { @@ -12571,7 +12888,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-sm-md { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-sm-lg { @@ -12848,58 +13165,6 @@ fieldset:disabled .btn { flex-wrap: wrap-reverse !important; } - .gap-md-0 { - gap: 0 !important; - } - - .gap-md-1 { - gap: 0.25rem !important; - } - - .gap-md-2 { - gap: 0.5rem !important; - } - - .gap-md-3 { - gap: 1rem !important; - } - - .gap-md-4 { - gap: 1.5rem !important; - } - - .gap-md-5 { - gap: 3rem !important; - } - - .gap-md-6 { - gap: 4rem !important; - } - - .gap-md-7 { - gap: 6rem !important; - } - - .gap-md-8 { - gap: 8rem !important; - } - - .gap-md-9 { - gap: 10rem !important; - } - - .gap-md-10 { - gap: 12rem !important; - } - - .gap-md-11 { - gap: 14rem !important; - } - - .gap-md-12 { - gap: 16rem !important; - } - .justify-content-md-start { justify-content: flex-start !important; } @@ -14194,6 +14459,58 @@ fieldset:disabled .btn { padding-left: 16rem !important; } + .gap-md-0 { + gap: 0 !important; + } + + .gap-md-1 { + gap: 0.25rem !important; + } + + .gap-md-2 { + gap: 0.5rem !important; + } + + .gap-md-3 { + gap: 1rem !important; + } + + .gap-md-4 { + gap: 1.5rem !important; + } + + .gap-md-5 { + gap: 3rem !important; + } + + .gap-md-6 { + gap: 4rem !important; + } + + .gap-md-7 { + gap: 6rem !important; + } + + .gap-md-8 { + gap: 8rem !important; + } + + .gap-md-9 { + gap: 10rem !important; + } + + .gap-md-10 { + gap: 12rem !important; + } + + .gap-md-11 { + gap: 14rem !important; + } + + .gap-md-12 { + gap: 16rem !important; + } + .text-md-start { text-align: left !important; } @@ -14231,7 +14548,7 @@ fieldset:disabled .btn { } .border-radius-top-start-md { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-md-0 { @@ -14243,7 +14560,7 @@ fieldset:disabled .btn { } .border-radius-top-start-md-md { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-md-lg { @@ -14267,7 +14584,7 @@ fieldset:disabled .btn { } .border-radius-top-end-md { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-md-0 { @@ -14279,7 +14596,7 @@ fieldset:disabled .btn { } .border-radius-top-end-md-md { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-md-lg { @@ -14303,7 +14620,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-md { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-md-0 { @@ -14315,7 +14632,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-md-md { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-md-lg { @@ -14339,7 +14656,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-md { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-md-0 { @@ -14351,7 +14668,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-md-md { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-md-lg { @@ -14628,58 +14945,6 @@ fieldset:disabled .btn { flex-wrap: wrap-reverse !important; } - .gap-lg-0 { - gap: 0 !important; - } - - .gap-lg-1 { - gap: 0.25rem !important; - } - - .gap-lg-2 { - gap: 0.5rem !important; - } - - .gap-lg-3 { - gap: 1rem !important; - } - - .gap-lg-4 { - gap: 1.5rem !important; - } - - .gap-lg-5 { - gap: 3rem !important; - } - - .gap-lg-6 { - gap: 4rem !important; - } - - .gap-lg-7 { - gap: 6rem !important; - } - - .gap-lg-8 { - gap: 8rem !important; - } - - .gap-lg-9 { - gap: 10rem !important; - } - - .gap-lg-10 { - gap: 12rem !important; - } - - .gap-lg-11 { - gap: 14rem !important; - } - - .gap-lg-12 { - gap: 16rem !important; - } - .justify-content-lg-start { justify-content: flex-start !important; } @@ -15974,6 +16239,58 @@ fieldset:disabled .btn { padding-left: 16rem !important; } + .gap-lg-0 { + gap: 0 !important; + } + + .gap-lg-1 { + gap: 0.25rem !important; + } + + .gap-lg-2 { + gap: 0.5rem !important; + } + + .gap-lg-3 { + gap: 1rem !important; + } + + .gap-lg-4 { + gap: 1.5rem !important; + } + + .gap-lg-5 { + gap: 3rem !important; + } + + .gap-lg-6 { + gap: 4rem !important; + } + + .gap-lg-7 { + gap: 6rem !important; + } + + .gap-lg-8 { + gap: 8rem !important; + } + + .gap-lg-9 { + gap: 10rem !important; + } + + .gap-lg-10 { + gap: 12rem !important; + } + + .gap-lg-11 { + gap: 14rem !important; + } + + .gap-lg-12 { + gap: 16rem !important; + } + .text-lg-start { text-align: left !important; } @@ -16011,7 +16328,7 @@ fieldset:disabled .btn { } .border-radius-top-start-lg { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-lg-0 { @@ -16023,7 +16340,7 @@ fieldset:disabled .btn { } .border-radius-top-start-lg-md { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-lg-lg { @@ -16047,7 +16364,7 @@ fieldset:disabled .btn { } .border-radius-top-end-lg { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-lg-0 { @@ -16059,7 +16376,7 @@ fieldset:disabled .btn { } .border-radius-top-end-lg-md { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-lg-lg { @@ -16083,7 +16400,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-lg { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-lg-0 { @@ -16095,7 +16412,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-lg-md { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-lg-lg { @@ -16119,7 +16436,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-lg { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-lg-0 { @@ -16131,7 +16448,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-lg-md { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-lg-lg { @@ -16408,58 +16725,6 @@ fieldset:disabled .btn { flex-wrap: wrap-reverse !important; } - .gap-xl-0 { - gap: 0 !important; - } - - .gap-xl-1 { - gap: 0.25rem !important; - } - - .gap-xl-2 { - gap: 0.5rem !important; - } - - .gap-xl-3 { - gap: 1rem !important; - } - - .gap-xl-4 { - gap: 1.5rem !important; - } - - .gap-xl-5 { - gap: 3rem !important; - } - - .gap-xl-6 { - gap: 4rem !important; - } - - .gap-xl-7 { - gap: 6rem !important; - } - - .gap-xl-8 { - gap: 8rem !important; - } - - .gap-xl-9 { - gap: 10rem !important; - } - - .gap-xl-10 { - gap: 12rem !important; - } - - .gap-xl-11 { - gap: 14rem !important; - } - - .gap-xl-12 { - gap: 16rem !important; - } - .justify-content-xl-start { justify-content: flex-start !important; } @@ -17754,6 +18019,58 @@ fieldset:disabled .btn { padding-left: 16rem !important; } + .gap-xl-0 { + gap: 0 !important; + } + + .gap-xl-1 { + gap: 0.25rem !important; + } + + .gap-xl-2 { + gap: 0.5rem !important; + } + + .gap-xl-3 { + gap: 1rem !important; + } + + .gap-xl-4 { + gap: 1.5rem !important; + } + + .gap-xl-5 { + gap: 3rem !important; + } + + .gap-xl-6 { + gap: 4rem !important; + } + + .gap-xl-7 { + gap: 6rem !important; + } + + .gap-xl-8 { + gap: 8rem !important; + } + + .gap-xl-9 { + gap: 10rem !important; + } + + .gap-xl-10 { + gap: 12rem !important; + } + + .gap-xl-11 { + gap: 14rem !important; + } + + .gap-xl-12 { + gap: 16rem !important; + } + .text-xl-start { text-align: left !important; } @@ -17791,7 +18108,7 @@ fieldset:disabled .btn { } .border-radius-top-start-xl { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-xl-0 { @@ -17803,7 +18120,7 @@ fieldset:disabled .btn { } .border-radius-top-start-xl-md { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-xl-lg { @@ -17827,7 +18144,7 @@ fieldset:disabled .btn { } .border-radius-top-end-xl { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-xl-0 { @@ -17839,7 +18156,7 @@ fieldset:disabled .btn { } .border-radius-top-end-xl-md { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-xl-lg { @@ -17863,7 +18180,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-xl { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-xl-0 { @@ -17875,7 +18192,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-xl-md { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-xl-lg { @@ -17899,7 +18216,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-xl { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-xl-0 { @@ -17911,7 +18228,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-xl-md { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-xl-lg { @@ -18188,58 +18505,6 @@ fieldset:disabled .btn { flex-wrap: wrap-reverse !important; } - .gap-xxl-0 { - gap: 0 !important; - } - - .gap-xxl-1 { - gap: 0.25rem !important; - } - - .gap-xxl-2 { - gap: 0.5rem !important; - } - - .gap-xxl-3 { - gap: 1rem !important; - } - - .gap-xxl-4 { - gap: 1.5rem !important; - } - - .gap-xxl-5 { - gap: 3rem !important; - } - - .gap-xxl-6 { - gap: 4rem !important; - } - - .gap-xxl-7 { - gap: 6rem !important; - } - - .gap-xxl-8 { - gap: 8rem !important; - } - - .gap-xxl-9 { - gap: 10rem !important; - } - - .gap-xxl-10 { - gap: 12rem !important; - } - - .gap-xxl-11 { - gap: 14rem !important; - } - - .gap-xxl-12 { - gap: 16rem !important; - } - .justify-content-xxl-start { justify-content: flex-start !important; } @@ -19534,6 +19799,58 @@ fieldset:disabled .btn { padding-left: 16rem !important; } + .gap-xxl-0 { + gap: 0 !important; + } + + .gap-xxl-1 { + gap: 0.25rem !important; + } + + .gap-xxl-2 { + gap: 0.5rem !important; + } + + .gap-xxl-3 { + gap: 1rem !important; + } + + .gap-xxl-4 { + gap: 1.5rem !important; + } + + .gap-xxl-5 { + gap: 3rem !important; + } + + .gap-xxl-6 { + gap: 4rem !important; + } + + .gap-xxl-7 { + gap: 6rem !important; + } + + .gap-xxl-8 { + gap: 8rem !important; + } + + .gap-xxl-9 { + gap: 10rem !important; + } + + .gap-xxl-10 { + gap: 12rem !important; + } + + .gap-xxl-11 { + gap: 14rem !important; + } + + .gap-xxl-12 { + gap: 16rem !important; + } + .text-xxl-start { text-align: left !important; } @@ -19571,7 +19888,7 @@ fieldset:disabled .btn { } .border-radius-top-start-xxl { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-xxl-0 { @@ -19583,7 +19900,7 @@ fieldset:disabled .btn { } .border-radius-top-start-xxl-md { - border-top-left-radius: 0.25rem !important; + border-top-left-radius: 0.375rem !important; } .border-radius-top-start-xxl-lg { @@ -19607,7 +19924,7 @@ fieldset:disabled .btn { } .border-radius-top-end-xxl { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-xxl-0 { @@ -19619,7 +19936,7 @@ fieldset:disabled .btn { } .border-radius-top-end-xxl-md { - border-top-right-radius: 0.25rem !important; + border-top-right-radius: 0.375rem !important; } .border-radius-top-end-xxl-lg { @@ -19643,7 +19960,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-xxl { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-xxl-0 { @@ -19655,7 +19972,7 @@ fieldset:disabled .btn { } .border-radius-bottom-start-xxl-md { - border-bottom-left-radius: 0.25rem !important; + border-bottom-left-radius: 0.375rem !important; } .border-radius-bottom-start-xxl-lg { @@ -19679,7 +19996,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-xxl { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-xxl-0 { @@ -19691,7 +20008,7 @@ fieldset:disabled .btn { } .border-radius-bottom-end-xxl-md { - border-bottom-right-radius: 0.25rem !important; + border-bottom-right-radius: 0.375rem !important; } .border-radius-bottom-end-xxl-lg { @@ -21175,6 +21492,7 @@ fieldset:disabled .btn { } .input-group .form-control+.input-group-text { + position: absolute; border-left: 0; border-right: 1px solid #d2d6da; } @@ -21188,20 +21506,16 @@ fieldset:disabled .btn { } .input-group-text { - position: absolute; z-index: 9999; - height: 100%; border-right: 0; padding-left: 10px; padding-right: 10px; - margin-left: -1px; } .form-control { border-radius: 0.5rem; - border-top-left-radius: 0.5rem !important; - border-bottom-left-radius: 0.5rem !important; - padding-left: 35px !important; + border-top-right-radius: 0.5rem !important; + border-bottom-right-radius: 0.5rem !important; border-left-width: 1px; } @@ -21214,6 +21528,11 @@ fieldset:disabled .btn { box-shadow: none; } +.focused .form-control+.input-group-text { + border-color: #e293d3; + border-right: 1px solid #e293d3 !important; +} + .focused .input-group-text { border-color: #e293d3; } @@ -21705,6 +22024,11 @@ svg.text-dark .color-background { animation: gradient 10s ease infinite; } +hr { + border-top: none !important; + height: 1px; +} + hr.vertical { position: absolute; background-color: transparent; @@ -21903,6 +22227,22 @@ hr.horizontal.gray-light { background-size: cover; } +.overflow-x-hidden { + overflow-x: hidden; +} + +.overflow-y-hidden { + overflow-y: hidden; +} + +.overflow-x-scroll { + overflow-x: scroll; +} + +.overflow-y-scroll { + overflow-y: scroll; +} + .mask { position: absolute; background-size: cover; @@ -22069,14 +22409,12 @@ hr.horizontal.gray-light { color: #344767; } - .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-collapse, - .g-sidenav-show .navbar:not(.mixed-navbar) .navbar-collapse { + .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-collapse { display: flex !important; flex-basis: auto; } - .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-nav, - .g-sidenav-show .navbar:not(.mixed-navbar) .navbar-nav { + .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-nav { flex-direction: row; } @@ -23449,7 +23787,7 @@ hr.horizontal.gray-light { .progress-bar { height: 6px; - border-radius: 0.25rem; + border-radius: 0.375rem; margin-top: -0.095rem; margin-left: -1px; } @@ -23535,8 +23873,6 @@ hr.horizontal.gray-light { .rtl .input-group> :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) { margin-right: -1px; - border-top-right-radius: 0; - border-bottom-right-radius: 0; border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem; border-right: 0; diff --git a/assets/css/soft-ui-dashboard.css.map b/assets/css/soft-ui-dashboard.css.map index 505cf6e86..bf1503056 100644 --- a/assets/css/soft-ui-dashboard.css.map +++ b/assets/css/soft-ui-dashboard.css.map @@ -33,10 +33,12 @@ "../scss//_utilities.scss", "../scss/bootstrap/_functions.scss", "../scss/bootstrap/_variables.scss", + "../scss/bootstrap/_maps.scss", "../scss/bootstrap/_utilities.scss", "../scss/bootstrap/bootstrap.scss", "../scss/bootstrap/_functions.scss", "../scss/bootstrap/_variables.scss", + "../scss/bootstrap/_maps.scss", "../scss/bootstrap/_mixins.scss", "../scss/bootstrap/vendor/_rfs.scss", "../scss/bootstrap/mixins/_deprecate.scss", @@ -107,6 +109,7 @@ "../scss/bootstrap/_placeholders.scss", "../scss/bootstrap/_helpers.scss", "../scss/bootstrap/helpers/_clearfix.scss", + "../scss/bootstrap/helpers/_color-bg.scss", "../scss/bootstrap/helpers/_colored-links.scss", "../scss/bootstrap/helpers/_ratio.scss", "../scss/bootstrap/helpers/_position.scss", @@ -169,7 +172,7 @@ ], "sourcesContent": [ "// =========================================================\n// * Soft UI Dashboard - v1.0.5\n// =========================================================\n//\n// * Product Page: https://www.creative-tim.com/product/soft-ui-dashboard\n// * Copyright 2022 Creative Tim (https://www.creative-tim.com)\n//\n// Coded by www.creative-tim.com\n//\n// =========================================================\n//\n// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n// Bootstrap Functions\n@import \"bootstrap/functions\";\n\n// Custom Variables\n@import \"custom/variables\";\n\n// Theme Variables\n@import \"/variables\";\n\n// Bootstrap Core\n@import \"bootstrap/bootstrap\";\n\n// Theme Core\n@import \"/theme\";\n\n// Custom Variables\n@import \"custom/styles\";\n", - "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n $prev-key: null;\n $prev-num: null;\n @each $key, $num in $map {\n @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n // Do nothing\n } @else if not comparable($prev-num, $num) {\n @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n } @else if $prev-num >= $num {\n @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n }\n $prev-key: $key;\n $prev-num: $num;\n }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n @if length($map) > 0 {\n $values: map-values($map);\n $first-value: nth($values, 1);\n @if $first-value != 0 {\n @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n }\n }\n}\n\n// Colors\n@function to-rgb($value) {\n @return red($value), green($value), blue($value);\n}\n\n// stylelint-disable scss/dollar-variable-pattern\n@function rgba-css-var($identifier, $target) {\n @if $identifier == \"body\" and $target == \"bg\" {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-bg-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n } @if $identifier == \"body\" and $target == \"text\" {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-color-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n } @else {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n }\n}\n\n@function map-loop($map, $func, $args...) {\n $_map: ();\n\n @each $key, $value in $map {\n // allow to pass the $key and $value of the map as an function argument\n $_args: ();\n @each $arg in $args {\n $_args: append($_args, if($arg == \"$key\", $key, if($arg == \"$value\", $value, $arg)));\n }\n\n $_map: map-merge($_map, ($key: call(get-function($func), $_args...)));\n }\n\n @return $_map;\n}\n// stylelint-enable scss/dollar-variable-pattern\n\n@function varify($list) {\n $result: null;\n @each $entry in $list {\n $result: append($result, var(--#{$variable-prefix}#{$entry}), space);\n }\n @return $result;\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n $result: ();\n @each $key, $value in $map {\n @if $key != 0 {\n $result: map-merge($result, (\"n\" + $key: (-$value)));\n }\n }\n @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n $result: ();\n @each $key, $value in $map {\n @if (index($values, $key) != null) {\n $result: map-merge($result, ($key: $value));\n }\n }\n @return $result;\n}\n\n// Merge multiple maps\n@function map-merge-multiple($maps...) {\n $merged-maps: ();\n\n @each $map in $maps {\n $merged-maps: map-merge($merged-maps, $map);\n }\n @return $merged-maps;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n $index: str-index($string, $search);\n\n @if $index {\n @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n }\n\n @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n @if str-index($string, \"data:image/svg+xml\") {\n @each $char, $encoded in $escaped-characters {\n // Do not escape the url brackets\n @if str-index($string, \"url(\") == 1 {\n $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n } @else {\n $string: str-replace($string, $char, $encoded);\n }\n }\n }\n\n @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n $max-ratio: 0;\n $max-ratio-color: null;\n\n @each $color in $foregrounds {\n $contrast-ratio: contrast-ratio($background, $color);\n @if $contrast-ratio > $min-contrast-ratio {\n @return $color;\n } @else if $contrast-ratio > $max-ratio {\n $max-ratio: $contrast-ratio;\n $max-ratio-color: $color;\n }\n }\n\n @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n $l1: luminance($background);\n $l2: luminance(opaque($background, $foreground));\n\n @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n $rgb: (\n \"r\": red($color),\n \"g\": green($color),\n \"b\": blue($color)\n );\n\n @each $name, $value in $rgb {\n $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));\n $rgb: map-merge($rgb, ($name: $value));\n }\n\n @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n @if $value1 == null {\n @return $value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 + $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n @if $value1 == null and $value2 == null {\n @return null;\n }\n\n @if $value1 == null {\n @return -$value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 - $value2;\n }\n\n @if type-of($value2) != number {\n $value2: unquote(\"(\") + $value2 + unquote(\")\");\n }\n\n @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n\n@function divide($dividend, $divisor, $precision: 10) {\n $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n $dividend: abs($dividend);\n $divisor: abs($divisor);\n @if $dividend == 0 {\n @return 0;\n }\n @if $divisor == 0 {\n @error \"Cannot divide by 0\";\n }\n $remainder: $dividend;\n $result: 0;\n $factor: 10;\n @while ($remainder > 0 and $precision >= 0) {\n $quotient: 0;\n @while ($remainder >= $divisor) {\n $remainder: $remainder - $divisor;\n $quotient: $quotient + 1;\n }\n $result: $result * 10 + $quotient;\n $factor: $factor * .1;\n $remainder: $remainder * 10;\n $precision: $precision - 1;\n @if ($precision < 0 and $remainder >= $divisor * 5) {\n $result: $result + 1;\n }\n }\n $result: $result * $factor * $sign;\n $dividend-unit: unit($dividend);\n $divisor-unit: unit($divisor);\n $unit-map: (\n \"px\": 1px,\n \"rem\": 1rem,\n \"em\": 1em,\n \"%\": 1%\n );\n @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n $result: $result * map-get($unit-map, $dividend-unit);\n }\n @return $result;\n}\n", + "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n $prev-key: null;\n $prev-num: null;\n @each $key, $num in $map {\n @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n // Do nothing\n } @else if not comparable($prev-num, $num) {\n @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n } @else if $prev-num >= $num {\n @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n }\n $prev-key: $key;\n $prev-num: $num;\n }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n @if length($map) > 0 {\n $values: map-values($map);\n $first-value: nth($values, 1);\n @if $first-value != 0 {\n @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n }\n }\n}\n\n// Colors\n@function to-rgb($value) {\n @return red($value), green($value), blue($value);\n}\n\n// stylelint-disable scss/dollar-variable-pattern\n@function rgba-css-var($identifier, $target) {\n @if $identifier == \"body\" and $target == \"bg\" {\n @return rgba(var(--#{$prefix}#{$identifier}-bg-rgb), var(--#{$prefix}#{$target}-opacity));\n } @if $identifier == \"body\" and $target == \"text\" {\n @return rgba(var(--#{$prefix}#{$identifier}-color-rgb), var(--#{$prefix}#{$target}-opacity));\n } @else {\n @return rgba(var(--#{$prefix}#{$identifier}-rgb), var(--#{$prefix}#{$target}-opacity));\n }\n}\n\n@function map-loop($map, $func, $args...) {\n $_map: ();\n\n @each $key, $value in $map {\n // allow to pass the $key and $value of the map as an function argument\n $_args: ();\n @each $arg in $args {\n $_args: append($_args, if($arg == \"$key\", $key, if($arg == \"$value\", $value, $arg)));\n }\n\n $_map: map-merge($_map, ($key: call(get-function($func), $_args...)));\n }\n\n @return $_map;\n}\n// stylelint-enable scss/dollar-variable-pattern\n\n@function varify($list) {\n $result: null;\n @each $entry in $list {\n $result: append($result, var(--#{$prefix}#{$entry}), space);\n }\n @return $result;\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n $result: ();\n @each $key, $value in $map {\n @if $key != 0 {\n $result: map-merge($result, (\"n\" + $key: (-$value)));\n }\n }\n @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n $result: ();\n @each $key, $value in $map {\n @if (index($values, $key) != null) {\n $result: map-merge($result, ($key: $value));\n }\n }\n @return $result;\n}\n\n// Merge multiple maps\n@function map-merge-multiple($maps...) {\n $merged-maps: ();\n\n @each $map in $maps {\n $merged-maps: map-merge($merged-maps, $map);\n }\n @return $merged-maps;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n $index: str-index($string, $search);\n\n @if $index {\n @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n }\n\n @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n @if str-index($string, \"data:image/svg+xml\") {\n @each $char, $encoded in $escaped-characters {\n // Do not escape the url brackets\n @if str-index($string, \"url(\") == 1 {\n $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n } @else {\n $string: str-replace($string, $char, $encoded);\n }\n }\n }\n\n @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n $max-ratio: 0;\n $max-ratio-color: null;\n\n @each $color in $foregrounds {\n $contrast-ratio: contrast-ratio($background, $color);\n @if $contrast-ratio > $min-contrast-ratio {\n @return $color;\n } @else if $contrast-ratio > $max-ratio {\n $max-ratio: $contrast-ratio;\n $max-ratio-color: $color;\n }\n }\n\n @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n $l1: luminance($background);\n $l2: luminance(opaque($background, $foreground));\n\n @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n $rgb: (\n \"r\": red($color),\n \"g\": green($color),\n \"b\": blue($color)\n );\n\n @each $name, $value in $rgb {\n $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));\n $rgb: map-merge($rgb, ($name: $value));\n }\n\n @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n @if $value1 == null {\n @return $value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 + $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n @if $value1 == null and $value2 == null {\n @return null;\n }\n\n @if $value1 == null {\n @return -$value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 - $value2;\n }\n\n @if type-of($value2) != number {\n $value2: unquote(\"(\") + $value2 + unquote(\")\");\n }\n\n @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n\n@function divide($dividend, $divisor, $precision: 10) {\n $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n $dividend: abs($dividend);\n $divisor: abs($divisor);\n @if $dividend == 0 {\n @return 0;\n }\n @if $divisor == 0 {\n @error \"Cannot divide by 0\";\n }\n $remainder: $dividend;\n $result: 0;\n $factor: 10;\n @while ($remainder > 0 and $precision >= 0) {\n $quotient: 0;\n @while ($remainder >= $divisor) {\n $remainder: $remainder - $divisor;\n $quotient: $quotient + 1;\n }\n $result: $result * 10 + $quotient;\n $factor: $factor * .1;\n $remainder: $remainder * 10;\n $precision: $precision - 1;\n @if ($precision < 0 and $remainder >= $divisor * 5) {\n $result: $result + 1;\n }\n }\n $result: $result * $factor * $sign;\n $dividend-unit: unit($dividend);\n $divisor-unit: unit($divisor);\n $unit-map: (\n \"px\": 1px,\n \"rem\": 1rem,\n \"em\": 1em,\n \"%\": 1%\n );\n @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n $result: $result * map-get($unit-map, $dividend-unit);\n }\n @return $result;\n}\n", "", "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// $soft-background-color: #fbfbfb !default;\n$soft-background-color: #ffffff !default; // Testing\n$font-color: #67748e !default;\n$h-color: #344767 !default;\n\n// Color system\n\n$white: #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black: #000 !default;\n\n// fusv-enable\n\n$blue: #63B3ED !default;\n$indigo: #596CFF !default;\n$purple: #6f42c1 !default;\n$pink: #d63384 !default;\n$red: #F56565 !default;\n$orange: #fd7e14 !default;\n$yellow: #FBD38D !default;\n$green: #81E6D9 !default;\n$teal: #20c997 !default;\n$cyan: #0dcaf0 !default;\n\n// scss-docs-start colors-map\n$colors: (\n \"blue\": $blue,\n \"indigo\": $indigo,\n \"purple\": $purple,\n \"pink\": $pink,\n \"red\": $red,\n \"orange\": $orange,\n \"yellow\": $yellow,\n \"green\": $green,\n \"teal\": $teal,\n \"cyan\": $cyan,\n \"white\": $white,\n \"gray\": $gray-600,\n \"gray-dark\": $gray-800,\n) !default;\n// scss-docs-end colors-map\n\n$primary: #cb0c9f !default;\n$secondary: #8392AB !default;\n$info: #17c1e8 !default;\n$success: #82d616 !default;\n$warning: #fbcf33 !default;\n$danger: #ea0606 !default;\n$light: $gray-200 !default;\n$dark: $h-color !default;\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n \"primary\": $primary,\n \"secondary\": $secondary,\n \"success\": $success,\n \"info\": $info,\n \"warning\": $warning,\n \"danger\": $danger,\n \"light\": $light,\n \"dark\": $dark,\n \"white\": $white\n) !default;\n// scss-docs-end theme-colors-map\n\n\n// Gradient colors\n$primary-gradient: #7928CA !default;\n$primary-gradient-state: #FF0080 !default;\n\n$secondary-gradient: #627594 !default;\n$secondary-gradient-state: #A8B8D8 !default;\n\n$info-gradient: #2152ff !default;\n$info-gradient-state: #21d4fd !default;\n\n$success-gradient: #17ad37 !default;\n$success-gradient-state: #98ec2d !default;\n\n$danger-gradient: #ea0606 !default;\n$danger-gradient-state: #ff667c !default;\n\n$warning-gradient: #f53939 !default;\n$warning-gradient-state: #fbcf33 !default;\n\n$dark-gradient: #141727 !default;\n$dark-gradient-state: #3A416F !default;\n\n$light-gradient: #CED4DA !default;\n$light-gradient-state: #EBEFF4 !default;\n\n$dark-gradient-dark: #323a54 !default;\n$dark-gradient-state-dark: #1a2035 !default;\n\n// Gradient Colors map\n$theme-gradient-colors: (\n \"primary\": ($primary-gradient, $primary-gradient-state),\n \"secondary\": ($secondary-gradient, $secondary-gradient-state),\n \"success\": ($success-gradient, $success-gradient-state),\n \"info\": ($info-gradient, $info-gradient-state),\n \"warning\": ($warning-gradient, $warning-gradient-state),\n \"danger\": ($danger-gradient, $danger-gradient-state),\n \"light\": ($light-gradient, $light-gradient-state),\n \"dark\": ($dark-gradient, $dark-gradient-state)\n) !default;\n\n// Set a specific jump point for requesting color jumps\n$theme-color-interval: 8% !default;\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio: 4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark: $black !default;\n$color-contrast-light: $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 8) !default;\n$blue-200: tint-color($blue, 6) !default;\n$blue-300: tint-color($blue, 4) !default;\n$blue-400: tint-color($blue, 2) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 2) !default;\n$blue-700: shade-color($blue, 4) !default;\n$blue-800: shade-color($blue, 6) !default;\n$blue-900: shade-color($blue, 8) !default;\n\n$indigo-100: tint-color($indigo, 8) !default;\n$indigo-200: tint-color($indigo, 6) !default;\n$indigo-300: tint-color($indigo, 4) !default;\n$indigo-400: tint-color($indigo, 2) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 2) !default;\n$indigo-700: shade-color($indigo, 4) !default;\n$indigo-800: shade-color($indigo, 6) !default;\n$indigo-900: shade-color($indigo, 8) !default;\n\n$purple-100: tint-color($purple, 8) !default;\n$purple-200: tint-color($purple, 6) !default;\n$purple-300: tint-color($purple, 4) !default;\n$purple-400: tint-color($purple, 2) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 2) !default;\n$purple-700: shade-color($purple, 4) !default;\n$purple-800: shade-color($purple, 6) !default;\n$purple-900: shade-color($purple, 8) !default;\n\n$pink-100: tint-color($pink, 8) !default;\n$pink-200: tint-color($pink, 6) !default;\n$pink-300: tint-color($pink, 4) !default;\n$pink-400: tint-color($pink, 2) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 2) !default;\n$pink-700: shade-color($pink, 4) !default;\n$pink-800: shade-color($pink, 6) !default;\n$pink-900: shade-color($pink, 8) !default;\n\n$red-100: tint-color($red, 8) !default;\n$red-200: tint-color($red, 6) !default;\n$red-300: tint-color($red, 4) !default;\n$red-400: tint-color($red, 2) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 2) !default;\n$red-700: shade-color($red, 4) !default;\n$red-800: shade-color($red, 6) !default;\n$red-900: shade-color($red, 8) !default;\n\n$orange-100: tint-color($orange, 8) !default;\n$orange-200: tint-color($orange, 6) !default;\n$orange-300: tint-color($orange, 4) !default;\n$orange-400: tint-color($orange, 2) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 2) !default;\n$orange-700: shade-color($orange, 4) !default;\n$orange-800: shade-color($orange, 6) !default;\n$orange-900: shade-color($orange, 8) !default;\n\n$yellow-100: tint-color($yellow, 8) !default;\n$yellow-200: tint-color($yellow, 6) !default;\n$yellow-300: tint-color($yellow, 4) !default;\n$yellow-400: tint-color($yellow, 2) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 2) !default;\n$yellow-700: shade-color($yellow, 4) !default;\n$yellow-800: shade-color($yellow, 6) !default;\n$yellow-900: shade-color($yellow, 8) !default;\n\n$green-100: tint-color($green, 8) !default;\n$green-200: tint-color($green, 6) !default;\n$green-300: tint-color($green, 4) !default;\n$green-400: tint-color($green, 2) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 2) !default;\n$green-700: shade-color($green, 4) !default;\n$green-800: shade-color($green, 6) !default;\n$green-900: shade-color($green, 8) !default;\n\n$teal-100: tint-color($teal, 8) !default;\n$teal-200: tint-color($teal, 6) !default;\n$teal-300: tint-color($teal, 4) !default;\n$teal-400: tint-color($teal, 2) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 2) !default;\n$teal-700: shade-color($teal, 4) !default;\n$teal-800: shade-color($teal, 6) !default;\n$teal-900: shade-color($teal, 8) !default;\n\n$cyan-100: tint-color($cyan, 8) !default;\n$cyan-200: tint-color($cyan, 6) !default;\n$cyan-300: tint-color($cyan, 4) !default;\n$cyan-400: tint-color($cyan, 2) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 2) !default;\n$cyan-700: shade-color($cyan, 4) !default;\n$cyan-800: shade-color($cyan, 6) !default;\n$cyan-900: shade-color($cyan, 8) !default;\n// fusv-enable\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n (\"<\", \"%3c\"),\n (\">\", \"%3e\"),\n (\"#\", \"%23\"),\n (\"(\", \"%28\"),\n (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret: true !default;\n$enable-rounded: true !default;\n$enable-shadows: false !default;\n$enable-gradients: false !default;\n$enable-transitions: true !default;\n$enable-reduced-motion: true !default;\n$enable-grid-classes: true !default;\n$enable-button-pointers: true !default;\n$enable-rfs: true !default;\n$enable-validation-icons: true !default;\n$enable-negative-margins: true !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities: true !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n$spacer: 1rem !default;\n$spacers: (\n 0: 0,\n 1: $spacer * 0.25,\n 2: $spacer * 0.5,\n 3: $spacer,\n 4: $spacer * 1.5,\n 5: $spacer * 3,\n 6: $spacer * 4,\n 7: $spacer * 6,\n 8: $spacer * 8,\n 9: $spacer * 10,\n 10: $spacer * 12,\n 11: $spacer * 14,\n 12: $spacer * 16,\n) !default;\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n$position-values: (\n 0: 0,\n 1: 1%,\n 2: 2%,\n 3: 3%,\n 4: 4%,\n 5: 5%,\n 6: 6%,\n 7: 7%,\n 8: 8%,\n 9: 9%,\n 10: 10%,\n 50: 50%,\n 100: 100%\n) !default;\n\n\n// Body\n//\n// Settings for the `` element.\n\n$body-bg: $white !default;\n$body-color: $font-color !default;\n$body-text-align: null !default;\n\n\n// Links\n//\n// Style anchor elements.\n\n$link-color: $primary !default;\n$link-decoration: none !default;\n$link-hover-color: darken($link-color, 15%) !default;\n$link-hover-decoration: none !default;\n// Darken percentage for links with `.text-*` class (e.g. `.text-success`)\n$emphasized-link-hover-darken-percentage: 15% !default;\n\n$stretched-link-pseudo-element: after !default;\n$stretched-link-z-index: 1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom: 1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n sm: 540px,\n md: 720px,\n lg: 960px,\n xl: 1140px,\n xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns: 12 !default;\n$grid-gutter-width: 1.5rem !default;\n$grid-row-columns: 6 !default;\n\n$gutters: $spacers !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n$border-width: 1px !default;\n$border-color: $gray-300 !default;\n\n$border-radius-xs: .125rem !default;\n$border-radius-sm: .25rem !default;\n$border-radius-md: .5rem !default;\n$border-radius-lg: .75rem !default;\n$border-radius-xl: 1rem !default;\n$border-radius-2xl: 1.5rem !default;\n$border-radius-section: 10rem !default;\n\n$border-widths: (\n 0: 0,\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n) !default;\n\n$rounded-pill: 50rem !default;\n\n$box-shadow-xs: 0 2px 9px -5px rgba($black, 0.15) !default;\n$box-shadow-sm: 0 .25rem .375rem -.0625rem rgba(20, 20, 20, .12), 0 .125rem .25rem -.0625rem rgba(20, 20, 20, .07) !default;\n$box-shadow: 0 .3125rem .625rem 0 rgba(0, 0, 0, 0.12) !default;\n$box-shadow-lg: 0 8px 26px -4px rgba(20, 20, 20, 0.15), 0 8px 9px -5px rgba(20, 20, 20, 0.06) !default;\n$box-shadow-xl: 0 23px 45px -11px rgba(20, 20, 20, .25) !default;\n$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;\n\n$component-active-color: $white !default;\n$component-active-bg: $primary !default;\n\n$caret-width: .3em !default;\n$caret-vertical-align: $caret-width * .85 !default;\n$caret-spacing: $caret-width * .85 !default;\n\n$transition-base: all .2s ease-in-out !default;\n$transition-fade: opacity .15s linear !default;\n$transition-collapse: height .35s ease !default;\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n \"1x1\": 100%,\n \"4x3\": calc(3 / 4 * 100%),\n \"16x9\": calc(9 / 16 * 100%),\n \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// stylelint-disable value-keyword-case\n$font-family-sans-serif: 'Open Sans' !default;\n$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n// stylelint-enable value-keyword-case\n$font-family-base: var(--bs-font-sans-serif) !default;\n$font-family-code: var(--bs-font-monospace) !default;\n\n// $font-size-root effects the value of `rem`, which is used for as well font sizes, paddings and margins\n// $font-size-base effects the font size of the body text\n$font-size-root: null !default;\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$font-size-xxs: $font-size-base * .65 !default;\n$font-size-xs: $font-size-base * .75 !default;\n$font-size-sm: $font-size-base * .875 !default;\n$font-size-lg: $font-size-base * 1.125 !default;\n$font-size-xl: $font-size-base * 1.25 !default;\n$font-size-2xl: $font-size-base * 1.5 !default;\n$font-size-3xl: $font-size-base * 1.875 !default;\n$font-size-4xl: $font-size-base * 2 !default;\n$font-size-5xl: $font-size-base * 2.25 !default;\n$font-size-6xl: $font-size-base * 3 !default;\n$font-size-7xl: $font-size-base * 3.75 !default;\n$font-size-8xl: $font-size-base * 4 !default;\n$font-size-9xl: $font-size-base * 5 !default;\n\n$font-weight-lighter: lighter !default;\n$font-weight-light: 300 !default;\n$font-weight-normal: 400 !default;\n$font-weight-bold: 600 !default;\n$font-weight-bolder: 700 !default;\n\n$font-weight-base: $font-weight-normal !default;\n\n$h1-font-weight: $font-weight-bold !default;\n$h2-font-weight: $font-weight-bold !default;\n$h3-font-weight: $font-weight-bold !default;\n$h4-font-weight: $font-weight-bold !default;\n$h5-font-weight: $font-weight-bold !default;\n$h6-font-weight: $font-weight-bold !default;\n$p-font-weight: $font-weight-normal !default;\n$lead-font-weight: $font-weight-normal !default;\n$text-sm-font-weight: $font-weight-normal !default;\n$text-xs-font-weight: $font-weight-normal !default;\n\n$line-height: 1.75rem !default;\n$line-height-base: 1.5 !default;\n$line-height-sm: 1.25 !default;\n$line-height-lg: 2 !default;\n\n$h1-line-height: 1.25 !default;\n$h2-line-height: 1.3 !default;\n$h3-line-height: 1.375 !default;\n$h4-line-height: 1.375 !default;\n$h5-line-height: 1.375 !default;\n$h6-line-height: 1.625 !default;\n$p-line-height: 1.6 !default;\n$lead-line-height: 1.625 !default;\n$text-sm-line-height: 1.5 !default;\n$text-xs-line-height: 1.25 !default;\n\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$h1-font-size: $font-size-base * 3 !default;\n$h2-font-size: $font-size-base * 2.25 !default;\n$h3-font-size: $font-size-base * 1.875 !default;\n$h4-font-size: $font-size-base * 1.5 !default;\n$h5-font-size: $font-size-base * 1.25 !default;\n$h6-font-size: $font-size-base !default;\n$lead-font-size: $font-size-base * 1.25 !default;\n\n\n$text-sm-font-size: .875rem !default;\n$text-xs-font-size: .75rem !default;\n$p-font-size: 1rem !default;\n\n$headings-margin-bottom: $spacer * 0.5 !default;\n$headings-font-family: null !default;\n$headings-font-style: null !default;\n$headings-font-weight: 400 !default;\n$headings-line-height: 1.2 !default;\n$headings-color: #344767 !default;\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n 1: 5rem,\n 2: 4.5rem,\n 3: 4rem,\n 4: 3.5rem,\n 5: 3rem,\n 6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n$lead-font-size: $font-size-base * 1.25 !default;\n$lead-font-weight: 300 !default;\n\n$small-font-size: .875em !default;\n\n$sub-sup-font-size: .75em !default;\n\n$text-secondary: $font-color !default;\n$text-muted: $gray-600 !default;\n\n// text gradient\n$text-gradient-bg-clip: text !default;\n$text-gradient-text-fill: transparent !default;\n$text-gradient-position: relative !default;\n$text-gradient-zindex: 1 !default;\n$text-gradient-bg-primary: linear-gradient(310deg, #7928CA, #FF0080) !default;\n$text-gradient-bg-info: linear-gradient(310deg, #2152FF, #21D4FD) !default;\n$text-gradient-bg-success: linear-gradient(310deg, #17AD37, #C1E823) !default;\n$text-gradient-bg-warning: linear-gradient(310deg, #F53939, #FBCF33) !default;\n$text-gradient-bg-danger: linear-gradient(310deg, #D60808, #FF6690) !default;\n$text-gradient-bg-dark: linear-gradient(310deg, #141727, #3A416F) !default;\n\n$initialism-font-size: $small-font-size !default;\n\n$blockquote-margin-y: $spacer !default;\n$blockquote-font-size: $font-size-base * 1.25 !default;\n$blockquote-footer-color: $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y: $spacer !default;\n$hr-color: inherit !default;\n$hr-height: $border-width !default;\n$hr-opacity: .25 !default;\n\n$legend-margin-bottom: .5rem !default;\n$legend-font-size: 1.5rem !default;\n$legend-font-weight: null !default;\n\n$mark-padding: .2em !default;\n\n$dt-font-weight: $font-weight-bold !default;\n\n$nested-kbd-font-weight: $font-weight-bold !default;\n\n$list-inline-padding: .5rem !default;\n\n$mark-bg: #fcf8e3 !default;\n\n// Letter Spacing\n$letter-wider: .05rem !default;\n$letter-normal: 0rem !default;\n$letter-tighter: -0.05rem !default;\n$h1-letter-spacing: 0.1rem !default;\n$a-letter-spacing: -0.025rem !default;\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n$table-head-spacer-y: .75rem !default;\n$table-head-spacer-x: 1.5rem !default;\n$table-head-font-size: .65rem !default;\n$table-head-font-weight: $font-weight-bold !default;\n$table-head-text-transform: capitalize !default;\n$table-head-letter-spacing: 0px !default;\n$table-head-bg: $gray-100 !default;\n$table-head-color: $gray-600 !default;\n\n$table-body-font-size: .8125rem !default;\n\n$table-border-width: $border-width !default;\n$table-border-color: $gray-200 !default;\n\n// scss-docs-start table-variables\n$table-cell-padding-y: .5rem !default;\n$table-cell-padding-x: .5rem !default;\n$table-cell-padding-y-sm: .25rem !default;\n$table-cell-padding-x-sm: .25rem !default;\n\n$table-cell-vertical-align: top !default;\n\n$table-color: $body-color !default;\n$table-bg: transparent !default;\n\n$table-th-font-weight: null !default;\n\n$table-striped-color: $table-color !default;\n$table-striped-bg-factor: .05 !default;\n$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color: $table-color !default;\n$table-active-bg-factor: .1 !default;\n$table-active-bg: rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color: $table-color !default;\n$table-hover-bg-factor: .075 !default;\n$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor: .1 !default;\n$table-border-width: $border-width !default;\n$table-border-color: $border-color !default;\n\n$table-striped-order: odd !default;\n\n$table-group-separator-color: currentColor !default;\n\n$table-caption-color: $text-muted !default;\n\n$table-bg-level: -9 !default;\n$table-bg-scale: -80% !default;\n\n\n$table-variants: (\n \"primary\": shift-color($primary, $table-bg-scale),\n \"secondary\": shift-color($secondary, $table-bg-scale),\n \"success\": shift-color($success, $table-bg-scale),\n \"info\": shift-color($info, $table-bg-scale),\n \"warning\": shift-color($warning, $table-bg-scale),\n \"danger\": shift-color($danger, $table-bg-scale),\n \"light\": $light,\n \"dark\": $dark,\n) !default;\n// scss-docs-end table-variables\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n$input-btn-padding-y: .5rem !default;\n$input-btn-padding-x: .75rem !default;\n$input-btn-font-family: null !default;\n$input-btn-font-size: 1rem !default;\n$input-btn-line-height: 1.4 !default;\n\n$input-btn-focus-width: .2rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm: .25rem !default;\n$input-btn-padding-x-sm: .75rem !default;\n$input-btn-font-size-sm: .75rem !default;\n\n$input-btn-padding-y-lg: .75rem !default;\n$input-btn-padding-x-lg: .75rem !default;\n$input-btn-font-size-lg: .875rem !default;\n\n$input-btn-border-width: $border-width !default;\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n$btn-padding-y: .75rem !default;\n$btn-padding-x: 1.5rem !default;\n$btn-font-family: $input-btn-font-family !default;\n$btn-font-size: $text-xs-font-size !default;\n$btn-line-height: $input-btn-line-height !default;\n$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping\n$btn-letter-spacing: -0.025rem !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-margin-bottom: 1rem !default;\n$btn-padding-y-sm: .5rem !default;\n$btn-padding-x-sm: 2rem !default;\n$btn-font-size-sm: $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg: .875rem !default;\n$btn-padding-x-lg: 4rem !default;\n$btn-font-size-lg: .875rem !default;\n\n$btn-border-width: $input-btn-border-width !default;\n\n$btn-font-weight: $font-weight-bolder !default;\n$btn-box-shadow: 0 4px 7px -1px rgba(0,0,0,.11), 0 2px 4px -1px rgba(0,0,0,.07) !default;\n$btn-box-shadow-values: 0 5px 8px 0 !default;\n$btn-box-shadow-hover-values: 0 8px 10px 0 !default;\n$btn-hover-box-shadow: 0 3px 5px -1px rgba(0,0,0,.09), 0 2px 3px -1px rgba(0,0,0,.07) !default;\n$btn-focus-box-shadow: $btn-hover-box-shadow !default;\n$btn-focus-width: $input-btn-focus-width !default;\n$btn-hover-opacity: .85 !default;\n$btn-disabled-opacity: .65 !default;\n$btn-active-box-shadow: none !default;\n$btn-background-size: 150% !default;\n$btn-hover-transform: scale(1.02) !default;\n$btn-active-hover-transform: scale(1) !default;\n$btn-background-position-x: 25% !default;\n\n$btn-link-color: $link-color !default;\n$btn-link-hover-color: $link-hover-color !default;\n$btn-link-disabled-color: $gray-600 !default;\n\n$btn-block-spacing-y: .5rem !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: .5rem !default;\n$btn-border-radius-lg: .5rem !default;\n$btn-border-radius-sm: .5rem !default;\n$btn-border-rounded: 1.875rem !default;\n\n$btn-icon-transition: all .2s cubic-bezier(.34,1.61,.7,1.3) !default;\n$btn-icon-transform-right: translateX(5px) !default;\n$btn-icon-transform-left: translateX(-5px) !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: $border-radius-md !default;\n$btn-border-radius-sm: $border-radius-sm !default;\n$btn-border-radius-lg: $border-radius-lg !default;\n\n$btn-transition: all .15s ease-in !default;\n\n$btn-just-icon-padding-x-sm: .3rem !default;\n$btn-just-icon-padding-y-sm: .3rem !default;\n$btn-just-icon-padding-x: .7rem !default;\n$btn-just-icon-padding-y: .7rem !default;\n$btn-just-icon-padding-x-lg: 1rem !default;\n$btn-just-icon-padding-y-lg: 1rem !default;\n$btn-just-icon-width: 2.375rem !default;\n$btn-just-icon-height: $btn-just-icon-width !default;\n$btn-just-icon-width-sm: 1.5875rem !default;\n$btn-just-icon-height-sm: $btn-just-icon-width-sm !default;\n$btn-just-icon-sm-font-size: .5rem !default;\n$btn-just-icon-width-lg: 3.25rem !default;\n$btn-just-icon-height-lg: $btn-just-icon-width-lg !default;\n$btn-just-icon-lg-font-size: 1.2rem !default;\n$btn-just-icon-lg-position: relative !default;\n$btn-just-icon-lg-top: 2px !default;\n\n// we've overwritten the default Bootstrap function\n// for dynamically adding font color since the colors\n// added by that function were not correctly set\n$btn-primary-font-color: #fff !default;\n$btn-secondary-font-color: #fff !default;\n$btn-danger-font-color: #fff !default;\n$btn-info-font-color: #fff !default;\n$btn-success-font-color: #fff !default;\n$btn-warning-font-color: #fff !default;\n$btn-dark-font-color: #fff !default;\n$btn-light-font-color: #3A416F !default;\n\n$btn-font-colors: () !default;\n\n$btn-font-colors: map-merge(\n (\n \"primary\": $btn-primary-font-color,\n \"secondary\": $btn-secondary-font-color,\n \"danger\": $btn-danger-font-color,\n \"info\": $btn-info-font-color,\n \"success\": $btn-success-font-color,\n \"warning\": $btn-warning-font-color,\n \"dark\": $btn-dark-font-color,\n \"light\": $btn-light-font-color\n ),\n $btn-font-colors\n);\n\n// Forms\n\n$form-text-margin-top: .25rem !default;\n$form-text-font-size: $small-font-size !default;\n$form-text-font-style: null !default;\n$form-text-font-weight: null !default;\n$form-text-color: $text-muted !default;\n\n$form-label-margin-bottom: .5rem !default;\n$form-label-margin-left: .25rem !default;\n$form-label-font-size: .75rem !default;\n$form-label-font-style: null !default;\n$form-label-font-weight: 700 !default;\n$form-label-color: $dark !default;\n\n$input-padding-y: .5rem !default;\n$input-padding-x: .75rem !default;\n$input-font-family: $input-btn-font-family !default;\n$input-font-size: $font-size-sm !default;\n$input-font-weight: $font-weight-base !default;\n$input-line-height: 1.4rem !default;\n\n$input-padding-y-sm: $input-btn-padding-y-sm !default;\n$input-padding-x-sm: $input-btn-padding-x-sm !default;\n$input-font-size-sm: .75rem !default;\n\n$input-padding-y-lg: $input-btn-padding-y-lg !default;\n$input-padding-x-lg: $input-btn-padding-x-lg !default;\n$input-font-size-lg: .875rem !default;\n\n$input-bg: $white !default;\n$input-disabled-bg: $gray-200 !default;\n$input-disabled-border-color: null !default;\n\n$input-color: $gray-700 !default;\n$input-border-color: #d2d6da !default;\n$input-border-width: $input-btn-border-width !default;\n$input-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !default;\n\n$input-border-radius: $border-radius-md !default;\n$input-border-radius-sm: $border-radius-md !default;\n$input-border-radius-lg: $border-radius-md !default;\n\n$input-focus-bg: $white !default;\n$input-focus-border-color: #e293d3 !default;\n$input-focus-color: $input-color !default;\n$input-focus-width: 2px !default;\n$input-focus-box-shadow: 0 0 0 $input-focus-width #e9aede !default;\n\n$input-placeholder-color: $gray-500 !default;\n$input-plaintext-color: $dark !default;\n\n$input-height-border: $input-border-width * 2 !default;\n\n$input-height-inner: unset !default;\n$input-height-inner-half: 1rem !default;\n$input-height-inner-quarter: .75rem !default;\n\n$input-height: unset !default;\n$input-height-sm: unset !default;\n$input-height-lg: unset !default;\n\n$input-transition: box-shadow .15s ease, border-color .15s ease !default;\n\n\n$form-check-input-width: 1.23em !default;\n$form-check-min-height: $font-size-base * $line-height-base !default;\n$form-check-padding-left: $form-check-input-width + .45em !default;\n$form-check-margin-bottom: .125rem !default;\n$form-check-label-color: null !default;\n$form-check-label-cursor: null !default;\n$form-check-transition: background-color .25s ease, border-color .25s ease, background-position .15s ease-in-out, opacity .15s ease-out, box-shadow .15s ease-in-out !default;\n$form-check-transition-time: .25s !default;\n\n$form-check-input-active-filter: brightness(99%) !default;\n\n$form-check-input-bg: $white !default;\n$form-check-input-border: none !default;\n$form-check-input-border-radius: .35rem !default;\n$form-check-radio-border-radius: 50% !default;\n$form-check-input-focus-border: none !default;\n$form-check-input-focus-box-shadow: none !default;\n\n$form-check-input-checked-color: $white !default;\n$form-check-input-checked-bg-color: transparent !default;\n$form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image: linear-gradient(310deg, $dark-gradient 0%, $dark-gradient-state 100%) !default;\n$form-check-radio-checked-bg-image: $form-check-input-checked-bg-image !default;\n$form-check-radio-after-width: .5rem !default;\n\n$form-check-input-indeterminate-color: $component-active-color !default;\n$form-check-input-indeterminate-bg-color: $component-active-bg !default;\n$form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-switch-color: rgba(0, 0, 0, 1) !default;\n$form-switch-height: 1.2em !default;\n$form-switch-width: 2.5rem !default;\n$form-switch-check-after-width: 1rem !default;\n$form-switch-padding-start: $form-switch-width + .5rem !default;\n$form-switch-bg-image: none !default;\n$form-switch-border-radius: $form-switch-width !default;\n$form-switch-translate-x-start: 1px !default;\n$form-switch-translate-x-end: 21px !default;\n$form-switch-round-box-shadow: $box-shadow !default;\n$form-switch-transition: $form-check-transition !default;\n\n$form-switch-focus-color: $form-switch-color !default;\n$form-switch-focus-bg-image: $form-switch-bg-image !default;\n$form-switch-checked-color: $white !default;\n$form-switch-checked-bg-image: $form-switch-bg-image !default;\n$form-switch-checked-bg-position: right center !default;\n\n$form-check-inline-margin-right: 1rem !default;\n\n$input-group-addon-padding-y: $input-padding-y !default;\n$input-group-addon-padding-x: $input-padding-x !default;\n$input-group-addon-font-weight: $input-font-weight !default;\n$input-group-addon-color: $dark !default;\n$input-group-addon-bg: $white !default;\n$input-group-addon-border-color: $input-border-color !default;\n\n\n$form-select-padding-y: $input-padding-y !default;\n$form-select-padding-x: $input-padding-x !default;\n$form-select-font-family: $input-font-family !default;\n$form-select-font-size: $input-font-size !default;\n$form-select-height: $input-height !default;\n$form-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator\n$form-select-font-weight: $input-font-weight !default;\n$form-select-line-height: $input-line-height !default;\n$form-select-color: $input-color !default;\n$form-select-disabled-color: $gray-600 !default;\n$form-select-bg: $input-bg !default;\n$form-select-disabled-bg: $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position: right $form-select-padding-x center !default;\n$form-select-bg-size: 16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color: $gray-800 !default;\n$form-select-indicator: url(\"data:image/svg+xml,\") !default;\n\n$form-select-feedback-icon-padding-right: add(1em * .75, (2 * $form-select-padding-y * .75) + $form-select-padding-x + $form-select-indicator-padding) !default;\n$form-select-feedback-icon-position: center right ($form-select-padding-x + $form-select-indicator-padding) !default;\n$form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width: $input-border-width !default;\n$form-select-border-color: $input-border-color !default;\n$form-select-border-radius: $border-radius-md !default;\n$form-select-box-shadow: $box-shadow-inset !default;\n\n$form-select-focus-border-color: $input-focus-border-color !default;\n$form-select-focus-width: $input-focus-width !default;\n$form-select-focus-box-shadow: $input-focus-box-shadow !default;\n\n$form-select-padding-y-sm: $input-padding-y-sm !default;\n$form-select-padding-x-sm: $input-padding-x-sm !default;\n$form-select-font-size-sm: $input-font-size-sm !default;\n$form-select-height-sm: $input-height-sm !default;\n\n$form-select-padding-y-lg: $input-padding-y-lg !default;\n$form-select-padding-x-lg: $input-padding-x-lg !default;\n$form-select-font-size-lg: $input-font-size-lg !default;\n$form-select-height-lg: $input-height-lg !default;\n\n$form-range-track-width: 100% !default;\n$form-range-track-height: .5rem !default;\n$form-range-track-cursor: pointer !default;\n$form-range-track-bg: $gray-300 !default;\n$form-range-track-border-radius: 1rem !default;\n$form-range-track-box-shadow: $box-shadow-inset !default;\n\n$form-range-thumb-width: 1rem !default;\n$form-range-thumb-height: $form-range-thumb-width !default;\n$form-range-thumb-bg: $component-active-bg !default;\n$form-range-thumb-border: 0 !default;\n$form-range-thumb-border-radius: 1rem !default;\n$form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;\n$form-range-thumb-disabled-bg: $gray-500 !default;\n$form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-file-height: $input-height !default;\n$form-file-focus-border-color: $input-focus-border-color !default;\n$form-file-focus-box-shadow: $input-focus-box-shadow !default;\n$form-file-disabled-bg: $input-disabled-bg !default;\n$form-file-disabled-border-color: $input-disabled-border-color !default;\n\n$form-file-padding-y: $input-padding-y !default;\n$form-file-padding-x: $input-padding-x !default;\n$form-file-line-height: $input-line-height !default;\n$form-file-font-family: $input-font-family !default;\n$form-file-font-weight: $input-font-weight !default;\n$form-file-color: $input-color !default;\n$form-file-bg: $input-bg !default;\n$form-file-border-width: $input-border-width !default;\n$form-file-border-color: $input-border-color !default;\n$form-file-border-radius: $input-border-radius !default;\n$form-file-box-shadow: $input-box-shadow !default;\n$form-file-button-color: $form-file-color !default;\n$form-file-button-bg: $input-group-addon-bg !default;\n\n$form-file-padding-y-sm: $input-padding-y-sm !default;\n$form-file-padding-x-sm: $input-padding-x-sm !default;\n$form-file-font-size-sm: $input-font-size-sm !default;\n$form-file-height-sm: $input-height-sm !default;\n\n$form-file-padding-y-lg: $input-padding-y-lg !default;\n$form-file-padding-x-lg: $input-padding-x-lg !default;\n$form-file-font-size-lg: $input-font-size-lg !default;\n$form-file-height-lg: $input-height-lg !default;\n\n\n// Form validation\n\n$form-feedback-margin-top: $form-text-margin-top !default;\n$form-feedback-font-size: $form-text-font-size !default;\n$form-feedback-font-style: $form-text-font-style !default;\n$form-feedback-valid-color: #66d432 !default;\n$form-feedback-invalid-color: #fd5c70 !default;\n\n$form-feedback-icon-valid-color: $form-feedback-valid-color !default;\n$form-feedback-icon-valid: url(\"data:image/svg+xml,\") !default;\n$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid: url(\"data:image/svg+xml,\") !default;\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n \"valid\": (\n \"color\": $form-feedback-valid-color,\n \"icon\": $form-feedback-icon-valid\n ),\n \"invalid\": (\n \"color\": $form-feedback-invalid-color,\n \"icon\": $form-feedback-icon-invalid\n )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown: 1000 !default;\n$zindex-sticky: 1020 !default;\n$zindex-fixed: 1030 !default;\n$zindex-modal-backdrop: 1040 !default;\n$zindex-modal: 1050 !default;\n$zindex-popover: 1060 !default;\n$zindex-tooltip: 1070 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n$nav-link-padding-y: .5rem !default;\n$nav-link-padding-x: 1rem !default;\n$nav-link-font-size: null !default;\n$nav-link-font-weight: null !default;\n$nav-link-color: null !default;\n$nav-link-hover-color: null !default;\n$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color: $gray-600 !default;\n$nav-link-footer-padding: .25rem !default;\n\n$nav-tabs-border-color: $gray-300 !default;\n$nav-tabs-border-width: $border-width !default;\n$nav-tabs-border-radius: $border-radius-md !default;\n$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color: $gray-700 !default;\n$nav-tabs-link-active-bg: $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius: 0.75rem !default;\n$nav-pills-link-active-color: $dark !default;\n$nav-pills-link-active-bg: $white !default;\n$nav-pills-link-transition: background-color .3s ease !default;\n$nav-pills-background: $gray-100 !default;\n$nav-pills-vertical-background: transparent !default;\n$nav-pills-vertical-radius: 1.1875rem !default;\n$nav-pills-vertical-link-radius: .875rem !default;\n\n\n// Navbar\n\n$navbar-padding-y: $spacer * 0.5 !default;\n$navbar-padding-x: null !default;\n$navbar-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .16) !default;\n\n$navbar-nav-link-padding-x: .5rem !default;\n$navbar-nav-link-padding: $navbar-nav-link-padding-x 1rem !default;\n\n$navbar-brand-font-size: $font-size-sm !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * 0.5 !default;\n$navbar-brand-margin-right: 1rem !default;\n\n$navbar-toggler-padding-y: .25rem !default;\n$navbar-toggler-padding-x: .75rem !default;\n$navbar-toggler-font-size: $font-size-lg !default;\n$navbar-toggler-border-radius: $btn-border-radius !default;\n$navbar-toggler-focus-width: $btn-focus-width !default;\n$navbar-toggler-transition: box-shadow .15s ease-in-out !default;\n\n$navbar-blur-bg-color: rgba(255, 255, 255, .8) !default;\n$navbar-blur-dark-bg-color: rgba(2, 5, 22, .8) !default;\n\n$navbar-dark-color: rgba($white, .85) !default;\n$navbar-dark-hover-color: rgba($white, .75) !default;\n$navbar-dark-active-color: $white !default;\n$navbar-dark-disabled-color: rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-dark-toggler-border-color: rgba($white, .1) !default;\n\n$navbar-light-color: $dark !default;\n$navbar-light-hover-color: rgba($dark, .7) !default;\n$navbar-light-active-color: rgba($dark, .9) !default;\n$navbar-light-disabled-color: rgba($dark, .3) !default;\n$navbar-light-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-light-toggler-border-color: rgba($dark, .1) !default;\n\n$navbar-light-brand-color: $navbar-light-active-color !default;\n$navbar-light-brand-hover-color: $navbar-light-active-color !default;\n$navbar-dark-brand-color: $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;\n\n// Sidenav toggler\n$sidenav-toggler-width: 18px !default;\n$sidenav-toggler-line-transition: all .15s ease !default;\n$sidenav-toggler-line-height: 2px !default;\n$sidenav-toggler-line-margin-bottom: 3px !default;\n$sidenav-toggler-line-active-width: 13px !default;\n$sidenav-toggler-line-transform: translateX(5px) !default;\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n$dropdown-min-width: 11rem !default;\n$dropdown-padding-x: 0 !default;\n$dropdown-padding-y: .5rem !default;\n$dropdown-spacer: 1.625rem !default;\n$dropdown-font-size: $font-size-sm !default;\n$dropdown-color: $body-color !default;\n$dropdown-bg: $white !default;\n$dropdown-border-color: transparent !default;\n$dropdown-border-radius: $border-radius-md !default;\n$dropdown-border-width: 0 !default;\n$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-transition-time: .3s ease !default;\n$dropdown-divider-bg: $dropdown-border-color !default;\n$dropdown-divider-margin-y: $spacer * 0.5 !default;\n$dropdown-box-shadow: $box-shadow-lg !default;\n\n$dropdown-link-color: $font-color !default;\n$dropdown-link-hover-color: $h-color !default;\n$dropdown-link-hover-bg: $gray-200 !default;\n\n$dropdown-link-active-color: $font-color !default;\n$dropdown-link-active-bg: transparent !default;\n\n$dropdown-link-disabled-color: $gray-600 !default;\n\n$dropdown-item-padding-y: .3rem !default;\n$dropdown-item-padding-x: $spacer !default;\n\n$dropdown-header-color: $gray-600 !default;\n$dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default;\n\n$dropdown-dark-color: $gray-300 !default;\n$dropdown-dark-bg: $gray-800 !default;\n$dropdown-dark-border-color: $dropdown-border-color !default;\n$dropdown-dark-divider-bg: $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow: null !default;\n$dropdown-dark-link-color: $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color: $white !default;\n$dropdown-dark-link-hover-bg: rgba($white, .15) !default;\n$dropdown-dark-link-active-color: $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color: $gray-500 !default;\n\n\n// Pagination\n\n$pagination-padding-y: .375rem !default;\n$pagination-padding-x: .75rem !default;\n$pagination-padding-y-sm: .25rem !default;\n$pagination-padding-x-sm: .5rem !default;\n$pagination-padding-y-lg: .75rem !default;\n$pagination-padding-x-lg: 1.5rem !default;\n\n$pagination-color: $link-color !default;\n$pagination-bg: $white !default;\n$pagination-border-width: $border-width !default;\n$pagination-border-radius: $border-radius-md !default;\n$pagination-margin-left: -$pagination-border-width !default;\n$pagination-border-color: $gray-300 !default;\n\n$pagination-focus-color: $link-hover-color !default;\n$pagination-focus-bg: $gray-200 !default;\n$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$pagination-focus-outline: 0 !default;\n\n$pagination-hover-color: $link-hover-color !default;\n$pagination-hover-bg: $gray-200 !default;\n$pagination-hover-border-color: $gray-300 !default;\n\n$pagination-active-color: $component-active-color !default;\n$pagination-active-bg: $component-active-bg !default;\n$pagination-active-border-color: $pagination-active-bg !default;\n\n$pagination-disabled-color: $gray-600 !default;\n$pagination-disabled-bg: $white !default;\n$pagination-disabled-border-color: $gray-300 !default;\n\n$pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n// Cards\n\n$card-spacer-y: $spacer !default;\n$card-spacer-x: $spacer !default;\n$card-title-spacer-y: $spacer * 0.5 !default;\n$card-border-width: 0 !default;\n$card-border-radius: 1rem !default;\n$card-border-color: rgba($black, .125) !default;\n$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y: $card-spacer-y * 0.5 !default;\n$card-cap-padding-x: $card-spacer-x !default;\n$card-cap-bg: $white !default;\n$card-cap-color: null !default;\n$card-height: null !default;\n$card-color: null !default;\n$card-bg: $white !default;\n\n$card-img-overlay-padding: $spacer !default;\n\n$card-group-margin: $grid-gutter-width * 0.5 !default;\n\n\n// Accordion\n$accordion-padding-y: 1rem !default;\n$accordion-padding-x: 1rem !default;\n$accordion-color: $body-color !default;\n$accordion-bg: transparent !default;\n$accordion-border-width: 0 !default;\n$accordion-border-color: rgba($black, .125) !default;\n$accordion-border-radius: $border-radius-sm !default;\n\n$accordion-body-padding-y: $accordion-padding-y !default;\n$accordion-body-padding-x: $accordion-padding-x !default;\n\n$accordion-button-padding-y: $accordion-padding-y !default;\n$accordion-button-padding-x: $accordion-padding-x !default;\n$accordion-button-color: $accordion-color !default;\n$accordion-button-bg: $accordion-bg !default;\n$accordion-transition: $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg: $accordion-bg !default;\n$accordion-button-active-color: $dark !default;\n\n$accordion-button-focus-border-color: $input-focus-border-color !default;\n$accordion-button-focus-box-shadow: none !default;\n\n$accordion-icon-width: 1rem !default;\n$accordion-icon-color: $accordion-color !default;\n$accordion-icon-active-color: $accordion-button-active-color !default;\n$accordion-icon-transition: transform .2s ease-in-out !default;\n$accordion-icon-transform: rotate(180deg) !default;\n\n$accordion-button-icon: none !default;\n$accordion-button-active-icon: none !default;\n\n\n// Tooltips\n\n$tooltip-font-size: $font-size-sm !default;\n$tooltip-max-width: 200px !default;\n$tooltip-color: $white !default;\n$tooltip-bg: $black !default;\n$tooltip-border-radius: $border-radius-md !default;\n$tooltip-opacity: .9 !default;\n$tooltip-padding-y: $spacer * 0.25 !default;\n$tooltip-padding-x: $spacer * 0.5 !default;\n$tooltip-margin: 0 !default;\n\n$tooltip-arrow-width: .8rem !default;\n$tooltip-arrow-height: .4rem !default;\n$tooltip-arrow-color: $tooltip-bg !default;\n\n// Form tooltips must come after regular tooltips\n$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size: $tooltip-font-size !default;\n$form-feedback-tooltip-line-height: null !default;\n$form-feedback-tooltip-opacity: $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n\n\n// Popovers\n\n$popover-font-size: $font-size-xs !default;\n$popover-bg: $white !default;\n$popover-max-width: 276px !default;\n$popover-border-width: 0px !default;\n$popover-border-color: rgba($black, .2) !default;\n$popover-border-radius: $border-radius-lg !default;\n$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow: $box-shadow-sm !default;\n\n$popover-header-bg: $gray-200 !default;\n$popover-header-color: $headings-color !default;\n$popover-header-padding-y: .5rem !default;\n$popover-header-padding-x: $spacer !default;\n\n$popover-body-color: $font-color !default;\n$popover-body-padding-y: $spacer !default;\n$popover-body-padding-x: $spacer !default;\n\n$popover-arrow-width: 1rem !default;\n$popover-arrow-height: .5rem !default;\n$popover-arrow-color: $popover-bg !default;\n\n$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;\n\n\n// Toasts\n\n$toast-max-width: 350px !default;\n$toast-padding-x: .75rem !default;\n$toast-padding-y: .75rem !default;\n$toast-font-size: .875rem !default;\n$toast-color: null !default;\n$toast-background-color: rgba($white, .85) !default;\n$toast-border-width: 0 !default;\n$toast-border-color: transparent !default;\n$toast-border-radius: $border-radius-md !default;\n$toast-box-shadow: $box-shadow !default;\n\n$toast-header-color: $h-color !default;\n$toast-header-background-color: rgba($white, .85) !default;\n$toast-header-border-color: rgba(0, 0, 0, .05) !default;\n\n\n// Badges\n\n$badge-font-size: .75em !default;\n$badge-font-weight: $font-weight-bolder !default;\n$badge-color: $white !default;\n$badge-padding-y: .55em !default;\n$badge-padding-x: .9em !default;\n$badge-border-radius-custom: .45rem !default;\n$badge-border-radius: $badge-border-radius-custom !default;\n\n\n// Modals\n\n// Padding applied to the modal body\n$modal-inner-padding: $spacer !default;\n\n// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding\n$modal-footer-margin-between: .5rem !default;\n\n$modal-dialog-margin: .5rem !default;\n$modal-dialog-margin-y-sm-up: 1.75rem !default;\n\n$modal-title-line-height: $line-height-base !default;\n\n$modal-content-color: null !default;\n$modal-content-bg: $white !default;\n$modal-content-border-color: rgba($black, .2) !default;\n$modal-content-border-width: $border-width !default;\n$modal-content-border-radius: $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs: $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up: $box-shadow !default;\n\n$modal-backdrop-bg: $black !default;\n$modal-backdrop-opacity: .5 !default;\n$modal-header-border-color: $border-color !default;\n$modal-footer-border-color: $modal-header-border-color !default;\n$modal-header-border-width: $modal-content-border-width !default;\n$modal-footer-border-width: $modal-header-border-width !default;\n$modal-header-padding-y: $modal-inner-padding !default;\n$modal-header-padding-x: $modal-inner-padding !default;\n$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-sm: 300px !default;\n$modal-md: 500px !default;\n$modal-lg: 800px !default;\n$modal-xl: 1140px !default;\n\n$modal-fade-transform: translate(0, -50px) !default;\n$modal-show-transform: none !default;\n$modal-transition: transform .3s ease-out !default;\n$modal-scale-transform: scale(1.02) !default;\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n$alert-padding-y: $spacer !default;\n$alert-padding-x: $spacer !default;\n$alert-margin-bottom: 1rem !default;\n$alert-border-radius: $border-radius-md !default;\n$alert-link-font-weight: $font-weight-bold !default;\n$alert-border-width: $border-width !default;\n\n$alert-bg-level: -10 !default;\n$alert-border-level: -9 !default;\n$alert-color-level: 6 !default;\n\n$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n\n\n// Progress bars\n\n$progress-height: 3px !default;\n$progress-bar-height: 6px !default;\n$progress-height-sm: 4px !default;\n$progress-height-lg: 20px !default;\n$progress-font-size: $font-size-base * .75 !default;\n$progress-bg: $gray-200 !default;\n$progress-border-radius: $border-radius-md !default;\n$progress-box-shadow: $box-shadow-inset !default;\n$progress-bar-color: $white !default;\n$progress-bar-bg: $primary !default;\n$progress-bar-animation-timing: 1s linear infinite !default;\n$progress-bar-transition: width .6s ease !default;\n\n\n// List group\n\n$list-group-color: inherit !default;\n$list-group-bg: $white !default;\n$list-group-border-color: rgba($black, .125) !default;\n$list-group-border-width: $border-width !default;\n$list-group-border-radius: $border-radius-md !default;\n\n$list-group-item-padding-y: $spacer * 0.5 !default;\n$list-group-item-padding-x: $spacer !default;\n$list-group-item-bg-level: -9 !default;\n$list-group-item-color-level: 6 !default;\n\n$list-group-hover-bg: $gray-100 !default;\n$list-group-active-color: $component-active-color !default;\n$list-group-active-bg: $component-active-bg !default;\n$list-group-active-border-color: $list-group-active-bg !default;\n\n$list-group-disabled-color: $gray-600 !default;\n$list-group-disabled-bg: $list-group-bg !default;\n\n$list-group-action-color: $gray-700 !default;\n$list-group-action-hover-color: $list-group-action-color !default;\n\n$list-group-action-active-color: $body-color !default;\n$list-group-action-active-bg: $gray-200 !default;\n\n\n// Image thumbnails\n\n$thumbnail-padding: .25rem !default;\n$thumbnail-bg: $body-bg !default;\n$thumbnail-border-width: $border-width !default;\n$thumbnail-border-color: $gray-300 !default;\n$thumbnail-border-radius: $border-radius-md !default;\n$thumbnail-box-shadow: $box-shadow-sm !default;\n\n\n// Figures\n\n$figure-caption-font-size: $small-font-size !default;\n$figure-caption-color: $gray-600 !default;\n\n\n// Breadcrumbs\n\n$breadcrumb-font-size: null !default;\n$breadcrumb-padding-y: $spacer * 0.5 !default;\n$breadcrumb-padding-x: $spacer !default;\n$breadcrumb-item-padding-x: .5rem !default;\n$breadcrumb-margin-bottom: 1rem !default;\n$breadcrumb-bg: $gray-200 !default;\n$breadcrumb-divider-color: $gray-600 !default;\n$breadcrumb-active-color: $gray-600 !default;\n$breadcrumb-divider: quote(\"/\") !default;\n$breadcrumb-border-radius: $border-radius-md !default;\n\n// Carousel\n\n$carousel-control-color: $white !default;\n$carousel-control-width: 15% !default;\n$carousel-control-opacity: .5 !default;\n$carousel-control-hover-opacity: .9 !default;\n$carousel-control-transition: opacity .15s ease !default;\n\n$carousel-indicator-width: 30px !default;\n$carousel-indicator-height: 3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer: 3px !default;\n$carousel-indicator-opacity: .5 !default;\n$carousel-indicator-active-bg: $white !default;\n$carousel-indicator-active-opacity: 1 !default;\n$carousel-indicator-transition: opacity .6s ease !default;\n\n$carousel-caption-width: 70% !default;\n$carousel-caption-color: $white !default;\n$carousel-caption-padding-y: 1.25rem !default;\n$carousel-caption-spacer: 1.25rem !default;\n\n$carousel-control-icon-width: 2rem !default;\n\n$carousel-control-prev-icon-bg: url(\"data:image/svg+xml,\") !default;\n$carousel-control-next-icon-bg: url(\"data:image/svg+xml,\") !default;\n\n$carousel-transition-duration: .6s !default;\n$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg: $black !default;\n$carousel-dark-caption-color: $black !default;\n$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;\n\n\n// Spinners\n\n$spinner-width: 2rem !default;\n$spinner-height: $spinner-width !default;\n$spinner-border-width: .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm: 1rem !default;\n$spinner-height-sm: $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n\n\n// Close\n\n$btn-close-width: 1em !default;\n$btn-close-height: $btn-close-width !default;\n$btn-close-padding-x: .25em !default;\n$btn-close-padding-y: $btn-close-padding-x !default;\n$btn-close-color: $white !default;\n$btn-close-bg: url(\"data:image/svg+xml,\") !default;\n$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;\n$btn-close-opacity: .5 !default;\n$btn-close-hover-opacity: .75 !default;\n$btn-close-focus-opacity: 1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;\n\n// Code\n\n$code-font-size: $small-font-size !default;\n$code-color: $pink !default;\n\n$kbd-padding-y: .2rem !default;\n$kbd-padding-x: .4rem !default;\n$kbd-font-size: $code-font-size !default;\n$kbd-color: $white !default;\n$kbd-bg: $gray-900 !default;\n$pre-color: null !default;\n\n// Tilt Animation\n\n$tilt-transform-style: preserve-3d !default;\n$tilt-transform-up-transform: translateZ(50px) scale(0.7) !default;\n$tilt-transform-up-transition: all 0.5s !default;\n\n// Variables for Core\n\n@import \"variables/animations\";\n@import \"variables/avatars\";\n@import \"variables/cards\";\n@import \"variables/dark-version\";\n@import \"variables/dropdowns\";\n@import 'variables/header';\n@import 'variables/info-areas';\n@import 'variables/navbar';\n@import 'variables/navbar-vertical';\n@import 'variables/utilities';\n@import 'variables/utilities-extend';\n@import 'variables/misc';\n@import 'variables/misc-extend';\n@import 'variables/form-switch';\n@import 'variables/fixed-plugin';\n@import 'variables/pagination';\n@import 'variables/badge';\n@import 'variables/rtl';\n@import 'variables/cards-extend';\n@import 'variables/choices';\n@import 'variables/timeline';\n@import 'variables/full-calendar';\n@import 'variables/social-buttons';\n@import 'variables/virtual-reality';\n\n\n// Import Utilities\n@import \"utilities\";\n", "// Waves Animation & Styling\n\n$waves-position: relative !default;\n$waves-width: 100% !default;\n$waves-height: 16vh !default;\n$waves-min-height: 100px !default;\n$waves-max-height: 150px !default;\n$waves-margin-bottom: -7px !default;\n$waves-height-sm: 50px !default;\n$waves-min-height-sm: $waves-height-sm !default;\n$waves-rotate: rotate(180deg) !default;\n$waves-mobile-height: 40px !default;\n\n$moving-waves-keyframe-0: translate3d(-90px,0,0) !default;\n$moving-waves-keyframe-100: translate3d(85px,0,0) !default;\n$moving-waves-animation: move-forever 40s cubic-bezier(.55,.5,.45,.5) infinite !default;\n$moving-waves-child-1-delay: -2s !default;\n$moving-waves-child-1-duration: 11s !default;\n$moving-waves-child-2-delay: -4s !default;\n$moving-waves-child-2-duration: 13s !default;\n$moving-waves-child-3-delay: -3s !default;\n$moving-waves-child-3-duration: 15s !default;\n$moving-waves-child-4-delay: -4s !default;\n$moving-waves-child-4-duration: 20s !default;\n$moving-waves-child-5-delay: -4s !default;\n$moving-waves-child-5-duration: 25s !default;\n$moving-waves-child-6-delay: -3s !default;\n$moving-waves-child-6-duration: 30s !default;\n\n// Fade In\n\n$fade-in-animation-name: fadeInBottom !default;\n$fade-in-animation-top-name: fadeInTop !default;\n$fade-in-bottom-transform: translateY(100%) !default;\n$fade-in-top-transform: translateY(-100%) !default;\n\n\n$fade-in-1-animation-duration: 1.5s !default;\n$fade-in-2-animation-duration: 1.75s !default;\n$fade-in-3-animation-duration: 2s !default;\n$fade-in-4-animation-duration: 2.25s !default;\n$fade-in-5-animation-duration: 2.5s !default;\n\n\n$floating-man-width: 350px !default;\n", @@ -196,91 +199,94 @@ "$fc-event-title-padding-y: .2rem !default;\n$fc-event-title-padding-x: .3rem !default;\n\n$fc-daygrid-event-border-radius: .35rem !default;\n$fc-theme-standard-dark-border-color: rgba($secondary, .3) !default;\n", "// Social Buttons\n\n$facebook: #3b5998 !default;\n$facebook-states: darken($facebook, 5%) !default;\n$twitter: #55acee !default;\n$twitter-states: darken($twitter, 5%) !default;\n$instagram: #125688 !default;\n$instagram-states: darken($instagram, 6%) !default;\n$linkedin: #0077B5 !default;\n$linkedin-states: darken($linkedin, 5%) !default;\n$pinterest: #cc2127 !default;\n$pinterest-states: darken($pinterest, 6%) !default;\n$youtube: #e52d27 !default;\n$youtube-states: darken($youtube, 6%) !default;\n$dribbble: #ea4c89 !default;\n$dribbble-states: darken($dribbble, 6%) !default;\n$github: #24292E !default;\n$github-states: darken($github, 6%) !default;\n$reddit: #ff4500 !default;\n$reddit-states: darken($reddit, 6%) !default;\n$tumblr: #35465c !default;\n$tumblr-states: darken($tumblr, 6%) !default;\n$behance: #1769ff !default;\n$behance-states: darken($behance, 6%) !default;\n$vimeo: #1AB7EA !default;\n$vimeo-states: darken($vimeo, 6%) !default;\n$slack: #3aaf85 !default;\n$slack-states: darken($slack, 6%) !default;\n", "$animation-name: fadeInBottom !default;\n$animation-mode: both !default;\n$animation-duration: 1.5s !default;\n$transform-scale: scale(0.6) !default;\n$position-left: 18% !default; \n", - "@import \"../bootstrap/functions\";\n@import \"../bootstrap/variables\";\n@import \"../bootstrap/utilities\";\n\n$utilities: (\n // scss-docs-start utils-vertical-align\n \"align\": (\n property: vertical-align,\n class: align,\n values: baseline top middle bottom text-bottom text-top\n ),\n // scss-docs-end utils-vertical-align\n // scss-docs-start utils-float\n \"float\": (\n responsive: true,\n property: float,\n values: (\n start: left,\n end: right,\n none: none,\n )\n ),\n // scss-docs-end utils-float\n // scss-docs-start utils-overflow\n \"overflow\": (\n property: overflow,\n values: auto hidden visible scroll,\n ),\n // scss-docs-end utils-overflow\n // scss-docs-start utils-display\n \"display\": (\n responsive: true,\n print: true,\n property: display,\n class: d,\n values: inline inline-block block grid table table-row table-cell flex inline-flex none\n ),\n // scss-docs-end utils-display\n // scss-docs-start utils-shadow\n \"shadow\": (\n property: box-shadow,\n class: shadow,\n values: (\n null: $box-shadow,\n xs: $box-shadow-xs,\n sm: $box-shadow-sm,\n md: $box-shadow,\n lg: $box-shadow-lg,\n xl: $box-shadow-xl,\n none: none,\n )\n ),\n // scss-docs-end utils-shadow\n // scss-docs-start utils-position\n \"position\": (\n property: position,\n values: static relative absolute fixed sticky\n ),\n \"top\": (\n property: top,\n values: $position-values\n ),\n \"bottom\": (\n property: bottom,\n values: $position-values\n ),\n \"start\": (\n property: left,\n class: start,\n values: $position-values\n ),\n \"end\": (\n property: right,\n class: end,\n values: $position-values\n ),\n \"translate-middle\": (\n property: transform,\n class: translate-middle,\n values: (\n null: translate(-50%, -50%),\n x: translateX(-50%),\n y: translateY(-50%),\n )\n ),\n //Scale\n \"transform\": (\n property: transform,\n class: transform-scale,\n responsive: true,\n values: (\n 5: scale(.5),\n 6: scale(.6),\n 7: scale(.7),\n 8: scale(.8),\n 9: scale(.9),\n 10: scale(1),\n )\n ),\n // scss-docs-end utils-position\n // scss-docs-start utils-borders\n \"border\": (\n property: border,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-top\": (\n property: border-top,\n responsive: true,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-end\": (\n property: border-right,\n responsive: true,\n class: border-end,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-bottom\": (\n property: border-bottom,\n responsive: true,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-start\": (\n property: border-left,\n responsive: true,\n class: border-start,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-color\": (\n property: border-color,\n class: border,\n values: map-merge($theme-colors, (\"white\": $white))\n ),\n \"border-width\": (\n property: border-width,\n class: border,\n values: $border-widths\n ),\n // scss-docs-end utils-borders\n // Sizing utilities\n // scss-docs-start utils-sizing\n \"width\": (\n property: width,\n responsive: true,\n class: w,\n values: $width\n ),\n \"max-width\": (\n property: max-width,\n class: mw,\n values: (100: 100%)\n ),\n \"viewport-width\": (\n property: width,\n class: vw,\n values: (100: 100vw)\n ),\n \"min-viewport-width\": (\n property: min-width,\n class: min-vw,\n values: (100: 100vw)\n ),\n \"height\": (\n property: height,\n class: h,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-height\": (\n property: max-height,\n class: mh,\n values: (100: 100%)\n ),\n \"viewport-height\": (\n property: height,\n class: vh,\n values: (100: 100vh)\n ),\n \"min-viewport-height\": (\n property: min-height,\n class: min-vh,\n values: (\n 25: $section-height-25-min-height,\n 35: $section-height-35-min-height,\n 45: $section-height-45-min-height,\n 50: $section-height-50-min-height,\n 55: $section-height-55-min-height,\n 65: $section-height-65-min-height,\n 70: $section-height-70-min-height,\n 75: $section-height-75-min-height,\n 80: $section-height-80-min-height,\n 85: $section-height-85-min-height,\n 90: $section-height-90-min-height,\n 95: $section-height-95-min-height,\n 100: 100vh\n )\n ),\n // scss-docs-end utils-sizing\n // Flex utilities\n // scss-docs-start utils-flex\n \"flex\": (\n responsive: true,\n property: flex,\n values: (fill: 1 1 auto)\n ),\n \"flex-direction\": (\n responsive: true,\n property: flex-direction,\n class: flex,\n values: row column row-reverse column-reverse\n ),\n \"flex-grow\": (\n responsive: true,\n property: flex-grow,\n class: flex,\n values: (\n grow-0: 0,\n grow-1: 1,\n )\n ),\n \"flex-shrink\": (\n responsive: true,\n property: flex-shrink,\n class: flex,\n values: (\n shrink-0: 0,\n shrink-1: 1,\n )\n ),\n \"flex-wrap\": (\n responsive: true,\n property: flex-wrap,\n class: flex,\n values: wrap nowrap wrap-reverse\n ),\n \"gap\": (\n responsive: true,\n property: gap,\n class: gap,\n values: $spacers\n ),\n \"justify-content\": (\n responsive: true,\n property: justify-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n evenly: space-evenly,\n )\n ),\n \"align-items\": (\n responsive: true,\n property: align-items,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"align-content\": (\n responsive: true,\n property: align-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n stretch: stretch,\n )\n ),\n \"align-self\": (\n responsive: true,\n property: align-self,\n values: (\n auto: auto,\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"order\": (\n responsive: true,\n property: order,\n values: (\n first: -1,\n 0: 0,\n 1: 1,\n 2: 2,\n 3: 3,\n 4: 4,\n 5: 5,\n last: 6,\n ),\n ),\n // scss-docs-end utils-flex\n // Margin utilities\n // scss-docs-start utils-spacing\n \"margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: map-merge($spacers, (auto: auto))\n ),\n // Negative margin utilities\n \"negative-margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: $negative-spacers\n ),\n \"negative-margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: $negative-spacers\n ),\n \"negative-margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: $negative-spacers\n ),\n \"negative-margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: $negative-spacers\n ),\n \"negative-margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: $negative-spacers\n ),\n \"negative-margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: $negative-spacers\n ),\n \"negative-margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: $negative-spacers\n ),\n // Padding utilities\n \"padding\": (\n responsive: true,\n property: padding,\n class: p,\n values: $spacers\n ),\n \"padding-x\": (\n responsive: true,\n property: padding-right padding-left,\n class: px,\n values: $spacers\n ),\n \"padding-y\": (\n responsive: true,\n property: padding-top padding-bottom,\n class: py,\n values: $spacers\n ),\n \"padding-top\": (\n responsive: true,\n property: padding-top,\n class: pt,\n values: $spacers\n ),\n \"padding-end\": (\n responsive: true,\n property: padding-right,\n class: pe,\n values: $spacers\n ),\n \"padding-bottom\": (\n responsive: true,\n property: padding-bottom,\n class: pb,\n values: $spacers\n ),\n \"padding-start\": (\n responsive: true,\n property: padding-left,\n class: ps,\n values: $spacers\n ),\n // scss-docs-end utils-spacing\n // Text\n // scss-docs-start utils-text\n \"font-family\": (\n property: font-family,\n class: font,\n values: (monospace: var(--#{$variable-prefix}font-monospace))\n ),\n \"font-size\": (\n rfs: true,\n property: font-size,\n class: fs,\n values: $font-sizes\n ),\n \"font-style\": (\n property: font-style,\n class: fst,\n values: italic normal\n ),\n \"font-weight\": (\n property: font-weight,\n class: fw,\n values: (\n light: $font-weight-light,\n lighter: $font-weight-lighter,\n normal: $font-weight-normal,\n bold: $font-weight-bold,\n bolder: $font-weight-bolder\n )\n ),\n \"line-height\": (\n property: line-height,\n class: lh,\n values: (\n 1: 1,\n sm: $line-height-sm,\n base: $line-height-base,\n lg: $line-height-lg,\n )\n ),\n \"text-align\": (\n responsive: true,\n property: text-align,\n class: text,\n values: (\n start: left,\n end: right,\n center: center,\n )\n ),\n \"text-decoration\": (\n property: text-decoration,\n values: none underline line-through\n ),\n \"text-transform\": (\n property: text-transform,\n class: text,\n values: lowercase uppercase capitalize\n ),\n \"white-space\": (\n property: white-space,\n class: text,\n values: (\n wrap: normal,\n nowrap: nowrap,\n )\n ),\n \"word-wrap\": (\n property: word-wrap word-break,\n class: text,\n values: (break: break-word),\n rtl: false\n ),\n // scss-docs-end utils-text\n // scss-docs-start utils-color\n \"color\": (\n property: color,\n class: text,\n values: map-merge(\n $theme-colors,\n (\n \"white\": $white,\n \"body\": $body-color,\n \"muted\": $text-muted,\n \"black-50\": rgba($black, .5),\n \"white-50\": rgba($white, .5),\n \"reset\": inherit,\n )\n )\n ),\n // scss-docs-end utils-color\n // scss-docs-start utils-bg-color\n \"background-color\": (\n property: background-color,\n class: bg,\n values: map-merge(\n $theme-colors,\n (\n \"body\": $body-bg,\n \"white\": $white,\n \"transparent\": transparent,\n \"gray-100\": $gray-100,\n \"gray-200\": $gray-200,\n \"gray-300\": $gray-300,\n \"gray-400\": $gray-400,\n \"gray-500\": $gray-500,\n \"gray-600\": $gray-600,\n \"gray-700\": $gray-700,\n \"gray-800\": $gray-800,\n \"gray-900\": $gray-900,\n )\n )\n ),\n // scss-docs-end utils-bg-color\n \"gradient\": (\n property: background-image,\n class: bg,\n values: (gradient: var(--#{$variable-prefix}gradient))\n ),\n // scss-docs-start utils-interaction\n \"user-select\": (\n property: user-select,\n values: all auto none\n ),\n \"pointer-events\": (\n property: pointer-events,\n class: pe,\n values: none auto,\n ),\n // scss-docs-end utils-interaction\n // scss-docs-start utils-border-radius\n \"rounded\": (\n property: border-radius,\n class: rounded,\n values: (\n null: $border-radius,\n 0: 0,\n 1: $border-radius-sm,\n 2: $border-radius,\n 3: $border-radius-lg,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"rounded-top\": (\n property: border-top-left-radius border-top-right-radius,\n class: rounded-top,\n values: (null: $border-radius)\n ),\n \"rounded-end\": (\n property: border-top-right-radius border-bottom-right-radius,\n class: rounded-end,\n values: (null: $border-radius)\n ),\n \"rounded-bottom\": (\n property: border-bottom-right-radius border-bottom-left-radius,\n class: rounded-bottom,\n values: (null: $border-radius)\n ),\n \"rounded-start\": (\n property: border-bottom-left-radius border-top-left-radius,\n class: rounded-start,\n values: (null: $border-radius)\n ),\n // scss-docs-end utils-border-radius\n // scss-docs-start utils-visibility\n \"visibility\": (\n property: visibility,\n class: null,\n values: (\n visible: visible,\n invisible: hidden,\n )\n ),\n // Opacity utilities\n \"opacity\": (\n property: opacity,\n values: (\n 0: 0,\n 1: .1,\n 2: .2,\n 3: .3,\n 4: .4,\n 5: .5,\n 6: .6,\n 7: .7,\n 8: .8,\n 9: .9,\n 10: 1\n ),\n ),\n // Z-index utilities\n \"z-index\": (\n property: z-index,\n values: (\n 0: 0,\n 1: 1,\n 2: 2,\n 3: 3\n ),\n ),\n // Letter spacing utilities\n \"letter-spacing\": (\n property: letter-spacing,\n values: (\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n ),\n ),\n // Border radius utilities\n \"border-top-left-radius\": (\n property: border-top-left-radius,\n class: border-radius-top-start,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"border-top-right-radius\": (\n property: border-top-right-radius,\n class: border-radius-top-end,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"border-bottom-left-radius\": (\n property: border-bottom-left-radius,\n class: border-radius-bottom-start,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"border-bottom-right-radius\": (\n property: border-bottom-right-radius,\n class: border-radius-bottom-end,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n // Max Height Values\n \"max-height-px\": (\n property: max-height,\n class: max-height,\n values: (\n 100: $max-height-100,\n 150: $max-height-150,\n 160: $max-height-160,\n 200: $max-height-200,\n 250: $max-height-250,\n 300: $max-height-300,\n 400: $max-height-400,\n 500: $max-height-500,\n 600: $max-height-600\n )\n ),\n // Max Height Values vh\n \"max-height-vh\": (\n property: max-height,\n class: max-height-vh,\n values: (\n 10: $max-height-vh-10,\n 20: $max-height-vh-20,\n 30: $max-height-vh-30,\n 40: $max-height-vh-40,\n 50: $max-height-vh-50,\n 60: $max-height-vh-60,\n 70: $max-height-vh-70,\n 80: $max-height-vh-80,\n 90: $max-height-vh-90,\n 100: $max-height-vh-100,\n )\n ),\n // Min Height Values\n \"min-height-px\": (\n property: min-height,\n class: min-height,\n values: (\n 100: $min-height-100,\n 150: $min-height-150,\n 160: $min-height-160,\n 200: $min-height-200,\n 250: $min-height-250,\n 300: $min-height-300,\n 400: $min-height-400,\n 500: $min-height-500,\n 600: $min-height-600\n )\n ),\n // Height Values\n \"height-px\": (\n property: height,\n class: height,\n values: (\n 100: $height-100,\n 150: $height-150,\n 200: $height-200,\n 300: $height-300,\n 400: $height-400,\n 500: $height-500,\n 600: $height-600\n )\n ),\n // Max Width Values\n \"max-width-px\": (\n property: max-width,\n class: max-width,\n values: (\n 100: $max-width-100,\n 200: $max-width-200,\n 300: $max-width-300,\n 400: $max-width-400,\n 500: $max-width-500\n )\n ),\n);\n", - "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n $prev-key: null;\n $prev-num: null;\n @each $key, $num in $map {\n @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n // Do nothing\n } @else if not comparable($prev-num, $num) {\n @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n } @else if $prev-num >= $num {\n @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n }\n $prev-key: $key;\n $prev-num: $num;\n }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n @if length($map) > 0 {\n $values: map-values($map);\n $first-value: nth($values, 1);\n @if $first-value != 0 {\n @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n }\n }\n}\n\n// Colors\n@function to-rgb($value) {\n @return red($value), green($value), blue($value);\n}\n\n// stylelint-disable scss/dollar-variable-pattern\n@function rgba-css-var($identifier, $target) {\n @if $identifier == \"body\" and $target == \"bg\" {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-bg-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n } @if $identifier == \"body\" and $target == \"text\" {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-color-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n } @else {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n }\n}\n\n@function map-loop($map, $func, $args...) {\n $_map: ();\n\n @each $key, $value in $map {\n // allow to pass the $key and $value of the map as an function argument\n $_args: ();\n @each $arg in $args {\n $_args: append($_args, if($arg == \"$key\", $key, if($arg == \"$value\", $value, $arg)));\n }\n\n $_map: map-merge($_map, ($key: call(get-function($func), $_args...)));\n }\n\n @return $_map;\n}\n// stylelint-enable scss/dollar-variable-pattern\n\n@function varify($list) {\n $result: null;\n @each $entry in $list {\n $result: append($result, var(--#{$variable-prefix}#{$entry}), space);\n }\n @return $result;\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n $result: ();\n @each $key, $value in $map {\n @if $key != 0 {\n $result: map-merge($result, (\"n\" + $key: (-$value)));\n }\n }\n @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n $result: ();\n @each $key, $value in $map {\n @if (index($values, $key) != null) {\n $result: map-merge($result, ($key: $value));\n }\n }\n @return $result;\n}\n\n// Merge multiple maps\n@function map-merge-multiple($maps...) {\n $merged-maps: ();\n\n @each $map in $maps {\n $merged-maps: map-merge($merged-maps, $map);\n }\n @return $merged-maps;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n $index: str-index($string, $search);\n\n @if $index {\n @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n }\n\n @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n @if str-index($string, \"data:image/svg+xml\") {\n @each $char, $encoded in $escaped-characters {\n // Do not escape the url brackets\n @if str-index($string, \"url(\") == 1 {\n $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n } @else {\n $string: str-replace($string, $char, $encoded);\n }\n }\n }\n\n @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n $max-ratio: 0;\n $max-ratio-color: null;\n\n @each $color in $foregrounds {\n $contrast-ratio: contrast-ratio($background, $color);\n @if $contrast-ratio > $min-contrast-ratio {\n @return $color;\n } @else if $contrast-ratio > $max-ratio {\n $max-ratio: $contrast-ratio;\n $max-ratio-color: $color;\n }\n }\n\n @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n $l1: luminance($background);\n $l2: luminance(opaque($background, $foreground));\n\n @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n $rgb: (\n \"r\": red($color),\n \"g\": green($color),\n \"b\": blue($color)\n );\n\n @each $name, $value in $rgb {\n $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));\n $rgb: map-merge($rgb, ($name: $value));\n }\n\n @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n @if $value1 == null {\n @return $value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 + $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n @if $value1 == null and $value2 == null {\n @return null;\n }\n\n @if $value1 == null {\n @return -$value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 - $value2;\n }\n\n @if type-of($value2) != number {\n $value2: unquote(\"(\") + $value2 + unquote(\")\");\n }\n\n @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n\n@function divide($dividend, $divisor, $precision: 10) {\n $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n $dividend: abs($dividend);\n $divisor: abs($divisor);\n @if $dividend == 0 {\n @return 0;\n }\n @if $divisor == 0 {\n @error \"Cannot divide by 0\";\n }\n $remainder: $dividend;\n $result: 0;\n $factor: 10;\n @while ($remainder > 0 and $precision >= 0) {\n $quotient: 0;\n @while ($remainder >= $divisor) {\n $remainder: $remainder - $divisor;\n $quotient: $quotient + 1;\n }\n $result: $result * 10 + $quotient;\n $factor: $factor * .1;\n $remainder: $remainder * 10;\n $precision: $precision - 1;\n @if ($precision < 0 and $remainder >= $divisor * 5) {\n $result: $result + 1;\n }\n }\n $result: $result * $factor * $sign;\n $dividend-unit: unit($dividend);\n $divisor-unit: unit($divisor);\n $unit-map: (\n \"px\": 1px,\n \"rem\": 1rem,\n \"em\": 1em,\n \"%\": 1%\n );\n @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n $result: $result * map-get($unit-map, $dividend-unit);\n }\n @return $result;\n}\n", - "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// Color system\n\n// scss-docs-start gray-color-variables\n$white: #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black: #000 !default;\n// scss-docs-end gray-color-variables\n\n// fusv-disable\n// scss-docs-start gray-colors-map\n$grays: (\n \"100\": $gray-100,\n \"200\": $gray-200,\n \"300\": $gray-300,\n \"400\": $gray-400,\n \"500\": $gray-500,\n \"600\": $gray-600,\n \"700\": $gray-700,\n \"800\": $gray-800,\n \"900\": $gray-900\n) !default;\n// scss-docs-end gray-colors-map\n// fusv-enable\n\n// scss-docs-start color-variables\n$blue: #0d6efd !default;\n$indigo: #6610f2 !default;\n$purple: #6f42c1 !default;\n$pink: #d63384 !default;\n$red: #dc3545 !default;\n$orange: #fd7e14 !default;\n$yellow: #ffc107 !default;\n$green: #198754 !default;\n$teal: #20c997 !default;\n$cyan: #0dcaf0 !default;\n// scss-docs-end color-variables\n\n// scss-docs-start colors-map\n$colors: (\n \"blue\": $blue,\n \"indigo\": $indigo,\n \"purple\": $purple,\n \"pink\": $pink,\n \"red\": $red,\n \"orange\": $orange,\n \"yellow\": $yellow,\n \"green\": $green,\n \"teal\": $teal,\n \"cyan\": $cyan,\n \"white\": $white,\n \"gray\": $gray-600,\n \"gray-dark\": $gray-800\n) !default;\n// scss-docs-end colors-map\n\n// scss-docs-start theme-color-variables\n$primary: $blue !default;\n$secondary: $gray-600 !default;\n$success: $green !default;\n$info: $cyan !default;\n$warning: $yellow !default;\n$danger: $red !default;\n$light: $gray-100 !default;\n$dark: $gray-900 !default;\n// scss-docs-end theme-color-variables\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n \"primary\": $primary,\n \"secondary\": $secondary,\n \"success\": $success,\n \"info\": $info,\n \"warning\": $warning,\n \"danger\": $danger,\n \"light\": $light,\n \"dark\": $dark\n) !default;\n// scss-docs-end theme-colors-map\n\n// scss-docs-start theme-colors-rgb\n$theme-colors-rgb: map-loop($theme-colors, to-rgb, \"$value\") !default;\n// scss-docs-end theme-colors-rgb\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio: 4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark: $black !default;\n$color-contrast-light: $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 80%) !default;\n$blue-200: tint-color($blue, 60%) !default;\n$blue-300: tint-color($blue, 40%) !default;\n$blue-400: tint-color($blue, 20%) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 20%) !default;\n$blue-700: shade-color($blue, 40%) !default;\n$blue-800: shade-color($blue, 60%) !default;\n$blue-900: shade-color($blue, 80%) !default;\n\n$indigo-100: tint-color($indigo, 80%) !default;\n$indigo-200: tint-color($indigo, 60%) !default;\n$indigo-300: tint-color($indigo, 40%) !default;\n$indigo-400: tint-color($indigo, 20%) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 20%) !default;\n$indigo-700: shade-color($indigo, 40%) !default;\n$indigo-800: shade-color($indigo, 60%) !default;\n$indigo-900: shade-color($indigo, 80%) !default;\n\n$purple-100: tint-color($purple, 80%) !default;\n$purple-200: tint-color($purple, 60%) !default;\n$purple-300: tint-color($purple, 40%) !default;\n$purple-400: tint-color($purple, 20%) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 20%) !default;\n$purple-700: shade-color($purple, 40%) !default;\n$purple-800: shade-color($purple, 60%) !default;\n$purple-900: shade-color($purple, 80%) !default;\n\n$pink-100: tint-color($pink, 80%) !default;\n$pink-200: tint-color($pink, 60%) !default;\n$pink-300: tint-color($pink, 40%) !default;\n$pink-400: tint-color($pink, 20%) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 20%) !default;\n$pink-700: shade-color($pink, 40%) !default;\n$pink-800: shade-color($pink, 60%) !default;\n$pink-900: shade-color($pink, 80%) !default;\n\n$red-100: tint-color($red, 80%) !default;\n$red-200: tint-color($red, 60%) !default;\n$red-300: tint-color($red, 40%) !default;\n$red-400: tint-color($red, 20%) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 20%) !default;\n$red-700: shade-color($red, 40%) !default;\n$red-800: shade-color($red, 60%) !default;\n$red-900: shade-color($red, 80%) !default;\n\n$orange-100: tint-color($orange, 80%) !default;\n$orange-200: tint-color($orange, 60%) !default;\n$orange-300: tint-color($orange, 40%) !default;\n$orange-400: tint-color($orange, 20%) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 20%) !default;\n$orange-700: shade-color($orange, 40%) !default;\n$orange-800: shade-color($orange, 60%) !default;\n$orange-900: shade-color($orange, 80%) !default;\n\n$yellow-100: tint-color($yellow, 80%) !default;\n$yellow-200: tint-color($yellow, 60%) !default;\n$yellow-300: tint-color($yellow, 40%) !default;\n$yellow-400: tint-color($yellow, 20%) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 20%) !default;\n$yellow-700: shade-color($yellow, 40%) !default;\n$yellow-800: shade-color($yellow, 60%) !default;\n$yellow-900: shade-color($yellow, 80%) !default;\n\n$green-100: tint-color($green, 80%) !default;\n$green-200: tint-color($green, 60%) !default;\n$green-300: tint-color($green, 40%) !default;\n$green-400: tint-color($green, 20%) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 20%) !default;\n$green-700: shade-color($green, 40%) !default;\n$green-800: shade-color($green, 60%) !default;\n$green-900: shade-color($green, 80%) !default;\n\n$teal-100: tint-color($teal, 80%) !default;\n$teal-200: tint-color($teal, 60%) !default;\n$teal-300: tint-color($teal, 40%) !default;\n$teal-400: tint-color($teal, 20%) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 20%) !default;\n$teal-700: shade-color($teal, 40%) !default;\n$teal-800: shade-color($teal, 60%) !default;\n$teal-900: shade-color($teal, 80%) !default;\n\n$cyan-100: tint-color($cyan, 80%) !default;\n$cyan-200: tint-color($cyan, 60%) !default;\n$cyan-300: tint-color($cyan, 40%) !default;\n$cyan-400: tint-color($cyan, 20%) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 20%) !default;\n$cyan-700: shade-color($cyan, 40%) !default;\n$cyan-800: shade-color($cyan, 60%) !default;\n$cyan-900: shade-color($cyan, 80%) !default;\n\n$blues: (\n \"blue-100\": $blue-100,\n \"blue-200\": $blue-200,\n \"blue-300\": $blue-300,\n \"blue-400\": $blue-400,\n \"blue-500\": $blue-500,\n \"blue-600\": $blue-600,\n \"blue-700\": $blue-700,\n \"blue-800\": $blue-800,\n \"blue-900\": $blue-900\n) !default;\n\n$indigos: (\n \"indigo-100\": $indigo-100,\n \"indigo-200\": $indigo-200,\n \"indigo-300\": $indigo-300,\n \"indigo-400\": $indigo-400,\n \"indigo-500\": $indigo-500,\n \"indigo-600\": $indigo-600,\n \"indigo-700\": $indigo-700,\n \"indigo-800\": $indigo-800,\n \"indigo-900\": $indigo-900\n) !default;\n\n$purples: (\n \"purple-100\": $purple-200,\n \"purple-200\": $purple-100,\n \"purple-300\": $purple-300,\n \"purple-400\": $purple-400,\n \"purple-500\": $purple-500,\n \"purple-600\": $purple-600,\n \"purple-700\": $purple-700,\n \"purple-800\": $purple-800,\n \"purple-900\": $purple-900\n) !default;\n\n$pinks: (\n \"pink-100\": $pink-100,\n \"pink-200\": $pink-200,\n \"pink-300\": $pink-300,\n \"pink-400\": $pink-400,\n \"pink-500\": $pink-500,\n \"pink-600\": $pink-600,\n \"pink-700\": $pink-700,\n \"pink-800\": $pink-800,\n \"pink-900\": $pink-900\n) !default;\n\n$reds: (\n \"red-100\": $red-100,\n \"red-200\": $red-200,\n \"red-300\": $red-300,\n \"red-400\": $red-400,\n \"red-500\": $red-500,\n \"red-600\": $red-600,\n \"red-700\": $red-700,\n \"red-800\": $red-800,\n \"red-900\": $red-900\n) !default;\n\n$oranges: (\n \"orange-100\": $orange-100,\n \"orange-200\": $orange-200,\n \"orange-300\": $orange-300,\n \"orange-400\": $orange-400,\n \"orange-500\": $orange-500,\n \"orange-600\": $orange-600,\n \"orange-700\": $orange-700,\n \"orange-800\": $orange-800,\n \"orange-900\": $orange-900\n) !default;\n\n$yellows: (\n \"yellow-100\": $yellow-100,\n \"yellow-200\": $yellow-200,\n \"yellow-300\": $yellow-300,\n \"yellow-400\": $yellow-400,\n \"yellow-500\": $yellow-500,\n \"yellow-600\": $yellow-600,\n \"yellow-700\": $yellow-700,\n \"yellow-800\": $yellow-800,\n \"yellow-900\": $yellow-900\n) !default;\n\n$greens: (\n \"green-100\": $green-100,\n \"green-200\": $green-200,\n \"green-300\": $green-300,\n \"green-400\": $green-400,\n \"green-500\": $green-500,\n \"green-600\": $green-600,\n \"green-700\": $green-700,\n \"green-800\": $green-800,\n \"green-900\": $green-900\n) !default;\n\n$teals: (\n \"teal-100\": $teal-100,\n \"teal-200\": $teal-200,\n \"teal-300\": $teal-300,\n \"teal-400\": $teal-400,\n \"teal-500\": $teal-500,\n \"teal-600\": $teal-600,\n \"teal-700\": $teal-700,\n \"teal-800\": $teal-800,\n \"teal-900\": $teal-900\n) !default;\n\n$cyans: (\n \"cyan-100\": $cyan-100,\n \"cyan-200\": $cyan-200,\n \"cyan-300\": $cyan-300,\n \"cyan-400\": $cyan-400,\n \"cyan-500\": $cyan-500,\n \"cyan-600\": $cyan-600,\n \"cyan-700\": $cyan-700,\n \"cyan-800\": $cyan-800,\n \"cyan-900\": $cyan-900\n) !default;\n// fusv-enable\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n (\"<\", \"%3c\"),\n (\">\", \"%3e\"),\n (\"#\", \"%23\"),\n (\"(\", \"%28\"),\n (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret: true !default;\n$enable-rounded: true !default;\n$enable-shadows: false !default;\n$enable-gradients: false !default;\n$enable-transitions: true !default;\n$enable-reduced-motion: true !default;\n$enable-smooth-scroll: true !default;\n$enable-grid-classes: true !default;\n$enable-cssgrid: false !default;\n$enable-button-pointers: true !default;\n$enable-rfs: true !default;\n$enable-validation-icons: true !default;\n$enable-negative-margins: false !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities: true !default;\n\n// Prefix for :root CSS variables\n\n$variable-prefix: bs- !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n// scss-docs-start variable-gradient\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n// scss-docs-end variable-gradient\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n// scss-docs-start spacer-variables-maps\n$spacer: 1rem !default;\n$spacers: (\n 0: 0,\n 1: $spacer * .25,\n 2: $spacer * .5,\n 3: $spacer,\n 4: $spacer * 1.5,\n 5: $spacer * 3,\n) !default;\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n// scss-docs-end spacer-variables-maps\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n// scss-docs-start position-map\n$position-values: (\n 0: 0,\n 50: 50%,\n 100: 100%\n) !default;\n// scss-docs-end position-map\n\n// Body\n//\n// Settings for the `` element.\n\n$body-bg: $white !default;\n$body-color: $gray-900 !default;\n$body-text-align: null !default;\n\n// Utilities maps\n//\n// Extends the default `$theme-colors` maps to help create our utilities.\n\n// Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign.\n// scss-docs-start utilities-colors\n$utilities-colors: $theme-colors-rgb !default;\n// scss-docs-end utilities-colors\n\n// scss-docs-start utilities-text-colors\n$utilities-text: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-color)\n )\n) !default;\n$utilities-text-colors: map-loop($utilities-text, rgba-css-var, \"$key\", \"text\") !default;\n// scss-docs-end utilities-text-colors\n\n// scss-docs-start utilities-bg-colors\n$utilities-bg: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-bg)\n )\n) !default;\n$utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, \"$key\", \"bg\") !default;\n// scss-docs-end utilities-bg-colors\n\n// Links\n//\n// Style anchor elements.\n\n$link-color: $primary !default;\n$link-decoration: underline !default;\n$link-shade-percentage: 20% !default;\n$link-hover-color: shift-color($link-color, $link-shade-percentage) !default;\n$link-hover-decoration: null !default;\n\n$stretched-link-pseudo-element: after !default;\n$stretched-link-z-index: 1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom: 1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n sm: 540px,\n md: 720px,\n lg: 960px,\n xl: 1140px,\n xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns: 12 !default;\n$grid-gutter-width: 1.5rem !default;\n$grid-row-columns: 6 !default;\n\n$gutters: $spacers !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width * .5 !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n// scss-docs-start border-variables\n$border-width: 1px !default;\n$border-widths: (\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n) !default;\n\n$border-color: $gray-300 !default;\n// scss-docs-end border-variables\n\n// scss-docs-start border-radius-variables\n$border-radius: .25rem !default;\n$border-radius-sm: .2rem !default;\n$border-radius-lg: .3rem !default;\n$border-radius-pill: 50rem !default;\n// scss-docs-end border-radius-variables\n\n// scss-docs-start box-shadow-variables\n$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;\n$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;\n$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;\n$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;\n// scss-docs-end box-shadow-variables\n\n$component-active-color: $white !default;\n$component-active-bg: $primary !default;\n\n// scss-docs-start caret-variables\n$caret-width: .3em !default;\n$caret-vertical-align: $caret-width * .85 !default;\n$caret-spacing: $caret-width * .85 !default;\n// scss-docs-end caret-variables\n\n$transition-base: all .2s ease-in-out !default;\n$transition-fade: opacity .15s linear !default;\n// scss-docs-start collapse-transition\n$transition-collapse: height .35s ease !default;\n$transition-collapse-width: width .35s ease !default;\n// scss-docs-end collapse-transition\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n \"1x1\": 100%,\n \"4x3\": calc(3 / 4 * 100%),\n \"16x9\": calc(9 / 16 * 100%),\n \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// scss-docs-start font-variables\n// stylelint-disable value-keyword-case\n$font-family-sans-serif: system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\" !default;\n$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n// stylelint-enable value-keyword-case\n$font-family-base: var(--#{$variable-prefix}font-sans-serif) !default;\n$font-family-code: var(--#{$variable-prefix}font-monospace) !default;\n\n// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins\n// $font-size-base affects the font size of the body text\n$font-size-root: null !default;\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$font-size-sm: $font-size-base * .875 !default;\n$font-size-lg: $font-size-base * 1.25 !default;\n\n$font-weight-lighter: lighter !default;\n$font-weight-light: 300 !default;\n$font-weight-normal: 400 !default;\n$font-weight-bold: 700 !default;\n$font-weight-bolder: bolder !default;\n\n$font-weight-base: $font-weight-normal !default;\n\n$line-height-base: 1.5 !default;\n$line-height-sm: 1.25 !default;\n$line-height-lg: 2 !default;\n\n$h1-font-size: $font-size-base * 2.5 !default;\n$h2-font-size: $font-size-base * 2 !default;\n$h3-font-size: $font-size-base * 1.75 !default;\n$h4-font-size: $font-size-base * 1.5 !default;\n$h5-font-size: $font-size-base * 1.25 !default;\n$h6-font-size: $font-size-base !default;\n// scss-docs-end font-variables\n\n// scss-docs-start font-sizes\n$font-sizes: (\n 1: $h1-font-size,\n 2: $h2-font-size,\n 3: $h3-font-size,\n 4: $h4-font-size,\n 5: $h5-font-size,\n 6: $h6-font-size\n) !default;\n// scss-docs-end font-sizes\n\n// scss-docs-start headings-variables\n$headings-margin-bottom: $spacer * .5 !default;\n$headings-font-family: null !default;\n$headings-font-style: null !default;\n$headings-font-weight: 500 !default;\n$headings-line-height: 1.2 !default;\n$headings-color: null !default;\n// scss-docs-end headings-variables\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n 1: 5rem,\n 2: 4.5rem,\n 3: 4rem,\n 4: 3.5rem,\n 5: 3rem,\n 6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n// scss-docs-start type-variables\n$lead-font-size: $font-size-base * 1.25 !default;\n$lead-font-weight: 300 !default;\n\n$small-font-size: .875em !default;\n\n$sub-sup-font-size: .75em !default;\n\n$text-muted: $gray-600 !default;\n\n$initialism-font-size: $small-font-size !default;\n\n$blockquote-margin-y: $spacer !default;\n$blockquote-font-size: $font-size-base * 1.25 !default;\n$blockquote-footer-color: $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y: $spacer !default;\n$hr-color: inherit !default;\n$hr-height: $border-width !default;\n$hr-opacity: .25 !default;\n\n$legend-margin-bottom: .5rem !default;\n$legend-font-size: 1.5rem !default;\n$legend-font-weight: null !default;\n\n$mark-padding: .2em !default;\n\n$dt-font-weight: $font-weight-bold !default;\n\n$nested-kbd-font-weight: $font-weight-bold !default;\n\n$list-inline-padding: .5rem !default;\n\n$mark-bg: #fcf8e3 !default;\n// scss-docs-end type-variables\n\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n\n// scss-docs-start table-variables\n$table-cell-padding-y: .5rem !default;\n$table-cell-padding-x: .5rem !default;\n$table-cell-padding-y-sm: .25rem !default;\n$table-cell-padding-x-sm: .25rem !default;\n\n$table-cell-vertical-align: top !default;\n\n$table-color: $body-color !default;\n$table-bg: transparent !default;\n$table-accent-bg: transparent !default;\n\n$table-th-font-weight: null !default;\n\n$table-striped-color: $table-color !default;\n$table-striped-bg-factor: .05 !default;\n$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color: $table-color !default;\n$table-active-bg-factor: .1 !default;\n$table-active-bg: rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color: $table-color !default;\n$table-hover-bg-factor: .075 !default;\n$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor: .1 !default;\n$table-border-width: $border-width !default;\n$table-border-color: $border-color !default;\n\n$table-striped-order: odd !default;\n\n$table-group-separator-color: currentColor !default;\n\n$table-caption-color: $text-muted !default;\n\n$table-bg-scale: -80% !default;\n// scss-docs-end table-variables\n\n// scss-docs-start table-loop\n$table-variants: (\n \"primary\": shift-color($primary, $table-bg-scale),\n \"secondary\": shift-color($secondary, $table-bg-scale),\n \"success\": shift-color($success, $table-bg-scale),\n \"info\": shift-color($info, $table-bg-scale),\n \"warning\": shift-color($warning, $table-bg-scale),\n \"danger\": shift-color($danger, $table-bg-scale),\n \"light\": $light,\n \"dark\": $dark,\n) !default;\n// scss-docs-end table-loop\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n// scss-docs-start input-btn-variables\n$input-btn-padding-y: .375rem !default;\n$input-btn-padding-x: .75rem !default;\n$input-btn-font-family: null !default;\n$input-btn-font-size: $font-size-base !default;\n$input-btn-line-height: $line-height-base !default;\n\n$input-btn-focus-width: .25rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-blur: 0 !default;\n$input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm: .25rem !default;\n$input-btn-padding-x-sm: .5rem !default;\n$input-btn-font-size-sm: $font-size-sm !default;\n\n$input-btn-padding-y-lg: .5rem !default;\n$input-btn-padding-x-lg: 1rem !default;\n$input-btn-font-size-lg: $font-size-lg !default;\n\n$input-btn-border-width: $border-width !default;\n// scss-docs-end input-btn-variables\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n// scss-docs-start btn-variables\n$btn-padding-y: $input-btn-padding-y !default;\n$btn-padding-x: $input-btn-padding-x !default;\n$btn-font-family: $input-btn-font-family !default;\n$btn-font-size: $input-btn-font-size !default;\n$btn-line-height: $input-btn-line-height !default;\n$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-padding-y-sm: $input-btn-padding-y-sm !default;\n$btn-padding-x-sm: $input-btn-padding-x-sm !default;\n$btn-font-size-sm: $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg: $input-btn-padding-y-lg !default;\n$btn-padding-x-lg: $input-btn-padding-x-lg !default;\n$btn-font-size-lg: $input-btn-font-size-lg !default;\n\n$btn-border-width: $input-btn-border-width !default;\n\n$btn-font-weight: $font-weight-normal !default;\n$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;\n$btn-focus-width: $input-btn-focus-width !default;\n$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$btn-disabled-opacity: .65 !default;\n$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;\n\n$btn-link-color: $link-color !default;\n$btn-link-hover-color: $link-hover-color !default;\n$btn-link-disabled-color: $gray-600 !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: $border-radius !default;\n$btn-border-radius-sm: $border-radius-sm !default;\n$btn-border-radius-lg: $border-radius-lg !default;\n\n$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$btn-hover-bg-shade-amount: 15% !default;\n$btn-hover-bg-tint-amount: 15% !default;\n$btn-hover-border-shade-amount: 20% !default;\n$btn-hover-border-tint-amount: 10% !default;\n$btn-active-bg-shade-amount: 20% !default;\n$btn-active-bg-tint-amount: 20% !default;\n$btn-active-border-shade-amount: 25% !default;\n$btn-active-border-tint-amount: 10% !default;\n// scss-docs-end btn-variables\n\n\n// Forms\n\n// scss-docs-start form-text-variables\n$form-text-margin-top: .25rem !default;\n$form-text-font-size: $small-font-size !default;\n$form-text-font-style: null !default;\n$form-text-font-weight: null !default;\n$form-text-color: $text-muted !default;\n// scss-docs-end form-text-variables\n\n// scss-docs-start form-label-variables\n$form-label-margin-bottom: .5rem !default;\n$form-label-font-size: null !default;\n$form-label-font-style: null !default;\n$form-label-font-weight: null !default;\n$form-label-color: null !default;\n// scss-docs-end form-label-variables\n\n// scss-docs-start form-input-variables\n$input-padding-y: $input-btn-padding-y !default;\n$input-padding-x: $input-btn-padding-x !default;\n$input-font-family: $input-btn-font-family !default;\n$input-font-size: $input-btn-font-size !default;\n$input-font-weight: $font-weight-base !default;\n$input-line-height: $input-btn-line-height !default;\n\n$input-padding-y-sm: $input-btn-padding-y-sm !default;\n$input-padding-x-sm: $input-btn-padding-x-sm !default;\n$input-font-size-sm: $input-btn-font-size-sm !default;\n\n$input-padding-y-lg: $input-btn-padding-y-lg !default;\n$input-padding-x-lg: $input-btn-padding-x-lg !default;\n$input-font-size-lg: $input-btn-font-size-lg !default;\n\n$input-bg: $body-bg !default;\n$input-disabled-bg: $gray-200 !default;\n$input-disabled-border-color: null !default;\n\n$input-color: $body-color !default;\n$input-border-color: $gray-400 !default;\n$input-border-width: $input-btn-border-width !default;\n$input-box-shadow: $box-shadow-inset !default;\n\n$input-border-radius: $border-radius !default;\n$input-border-radius-sm: $border-radius-sm !default;\n$input-border-radius-lg: $border-radius-lg !default;\n\n$input-focus-bg: $input-bg !default;\n$input-focus-border-color: tint-color($component-active-bg, 50%) !default;\n$input-focus-color: $input-color !default;\n$input-focus-width: $input-btn-focus-width !default;\n$input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$input-placeholder-color: $gray-600 !default;\n$input-plaintext-color: $body-color !default;\n\n$input-height-border: $input-border-width * 2 !default;\n\n$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;\n$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;\n$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !default;\n\n$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;\n$input-height-sm: add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;\n$input-height-lg: add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;\n\n$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-color-width: 3rem !default;\n// scss-docs-end form-input-variables\n\n// scss-docs-start form-check-variables\n$form-check-input-width: 1em !default;\n$form-check-min-height: $font-size-base * $line-height-base !default;\n$form-check-padding-start: $form-check-input-width + .5em !default;\n$form-check-margin-bottom: .125rem !default;\n$form-check-label-color: null !default;\n$form-check-label-cursor: null !default;\n$form-check-transition: null !default;\n\n$form-check-input-active-filter: brightness(90%) !default;\n\n$form-check-input-bg: $input-bg !default;\n$form-check-input-border: 1px solid rgba($black, .25) !default;\n$form-check-input-border-radius: .25em !default;\n$form-check-radio-border-radius: 50% !default;\n$form-check-input-focus-border: $input-focus-border-color !default;\n$form-check-input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$form-check-input-checked-color: $component-active-color !default;\n$form-check-input-checked-bg-color: $component-active-bg !default;\n$form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-check-radio-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-indeterminate-color: $component-active-color !default;\n$form-check-input-indeterminate-bg-color: $component-active-bg !default;\n$form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-disabled-opacity: .5 !default;\n$form-check-label-disabled-opacity: $form-check-input-disabled-opacity !default;\n$form-check-btn-check-disabled-opacity: $btn-disabled-opacity !default;\n\n$form-check-inline-margin-end: 1rem !default;\n// scss-docs-end form-check-variables\n\n// scss-docs-start form-switch-variables\n$form-switch-color: rgba($black, .25) !default;\n$form-switch-width: 2em !default;\n$form-switch-padding-start: $form-switch-width + .5em !default;\n$form-switch-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-border-radius: $form-switch-width !default;\n$form-switch-transition: background-position .15s ease-in-out !default;\n\n$form-switch-focus-color: $input-focus-border-color !default;\n$form-switch-focus-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-switch-checked-color: $component-active-color !default;\n$form-switch-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-checked-bg-position: right center !default;\n// scss-docs-end form-switch-variables\n\n// scss-docs-start input-group-variables\n$input-group-addon-padding-y: $input-padding-y !default;\n$input-group-addon-padding-x: $input-padding-x !default;\n$input-group-addon-font-weight: $input-font-weight !default;\n$input-group-addon-color: $input-color !default;\n$input-group-addon-bg: $gray-200 !default;\n$input-group-addon-border-color: $input-border-color !default;\n// scss-docs-end input-group-variables\n\n// scss-docs-start form-select-variables\n$form-select-padding-y: $input-padding-y !default;\n$form-select-padding-x: $input-padding-x !default;\n$form-select-font-family: $input-font-family !default;\n$form-select-font-size: $input-font-size !default;\n$form-select-indicator-padding: $form-select-padding-x * 3 !default; // Extra padding for background-image\n$form-select-font-weight: $input-font-weight !default;\n$form-select-line-height: $input-line-height !default;\n$form-select-color: $input-color !default;\n$form-select-bg: $input-bg !default;\n$form-select-disabled-color: null !default;\n$form-select-disabled-bg: $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position: right $form-select-padding-x center !default;\n$form-select-bg-size: 16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color: $gray-800 !default;\n$form-select-indicator: url(\"data:image/svg+xml,\") !default;\n\n$form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default;\n$form-select-feedback-icon-position: center right $form-select-indicator-padding !default;\n$form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width: $input-border-width !default;\n$form-select-border-color: $input-border-color !default;\n$form-select-border-radius: $input-border-radius !default;\n$form-select-box-shadow: $box-shadow-inset !default;\n\n$form-select-focus-border-color: $input-focus-border-color !default;\n$form-select-focus-width: $input-focus-width !default;\n$form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focus-color !default;\n\n$form-select-padding-y-sm: $input-padding-y-sm !default;\n$form-select-padding-x-sm: $input-padding-x-sm !default;\n$form-select-font-size-sm: $input-font-size-sm !default;\n$form-select-border-radius-sm: $input-border-radius-sm !default;\n\n$form-select-padding-y-lg: $input-padding-y-lg !default;\n$form-select-padding-x-lg: $input-padding-x-lg !default;\n$form-select-font-size-lg: $input-font-size-lg !default;\n$form-select-border-radius-lg: $input-border-radius-lg !default;\n\n$form-select-transition: $input-transition !default;\n// scss-docs-end form-select-variables\n\n// scss-docs-start form-range-variables\n$form-range-track-width: 100% !default;\n$form-range-track-height: .5rem !default;\n$form-range-track-cursor: pointer !default;\n$form-range-track-bg: $gray-300 !default;\n$form-range-track-border-radius: 1rem !default;\n$form-range-track-box-shadow: $box-shadow-inset !default;\n\n$form-range-thumb-width: 1rem !default;\n$form-range-thumb-height: $form-range-thumb-width !default;\n$form-range-thumb-bg: $component-active-bg !default;\n$form-range-thumb-border: 0 !default;\n$form-range-thumb-border-radius: 1rem !default;\n$form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default;\n$form-range-thumb-disabled-bg: $gray-500 !default;\n$form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n// scss-docs-end form-range-variables\n\n// scss-docs-start form-file-variables\n$form-file-button-color: $input-color !default;\n$form-file-button-bg: $input-group-addon-bg !default;\n$form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default;\n// scss-docs-end form-file-variables\n\n// scss-docs-start form-floating-variables\n$form-floating-height: add(3.5rem, $input-height-border) !default;\n$form-floating-line-height: 1.25 !default;\n$form-floating-padding-x: $input-padding-x !default;\n$form-floating-padding-y: 1rem !default;\n$form-floating-input-padding-t: 1.625rem !default;\n$form-floating-input-padding-b: .625rem !default;\n$form-floating-label-opacity: .65 !default;\n$form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default;\n$form-floating-transition: opacity .1s ease-in-out, transform .1s ease-in-out !default;\n// scss-docs-end form-floating-variables\n\n// Form validation\n\n// scss-docs-start form-feedback-variables\n$form-feedback-margin-top: $form-text-margin-top !default;\n$form-feedback-font-size: $form-text-font-size !default;\n$form-feedback-font-style: $form-text-font-style !default;\n$form-feedback-valid-color: $success !default;\n$form-feedback-invalid-color: $danger !default;\n\n$form-feedback-icon-valid-color: $form-feedback-valid-color !default;\n$form-feedback-icon-valid: url(\"data:image/svg+xml,\") !default;\n$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end form-feedback-variables\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n \"valid\": (\n \"color\": $form-feedback-valid-color,\n \"icon\": $form-feedback-icon-valid\n ),\n \"invalid\": (\n \"color\": $form-feedback-invalid-color,\n \"icon\": $form-feedback-icon-invalid\n )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown: 1000 !default;\n$zindex-sticky: 1020 !default;\n$zindex-fixed: 1030 !default;\n$zindex-offcanvas-backdrop: 1040 !default;\n$zindex-offcanvas: 1045 !default;\n$zindex-modal-backdrop: 1050 !default;\n$zindex-modal: 1055 !default;\n$zindex-popover: 1070 !default;\n$zindex-tooltip: 1080 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n// scss-docs-start nav-variables\n$nav-link-padding-y: .5rem !default;\n$nav-link-padding-x: 1rem !default;\n$nav-link-font-size: null !default;\n$nav-link-font-weight: null !default;\n$nav-link-color: $link-color !default;\n$nav-link-hover-color: $link-hover-color !default;\n$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color: $gray-600 !default;\n\n$nav-tabs-border-color: $gray-300 !default;\n$nav-tabs-border-width: $border-width !default;\n$nav-tabs-border-radius: $border-radius !default;\n$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color: $gray-700 !default;\n$nav-tabs-link-active-bg: $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius: $border-radius !default;\n$nav-pills-link-active-color: $component-active-color !default;\n$nav-pills-link-active-bg: $component-active-bg !default;\n// scss-docs-end nav-variables\n\n\n// Navbar\n\n// scss-docs-start navbar-variables\n$navbar-padding-y: $spacer * .5 !default;\n$navbar-padding-x: null !default;\n\n$navbar-nav-link-padding-x: .5rem !default;\n\n$navbar-brand-font-size: $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default;\n$navbar-brand-margin-end: 1rem !default;\n\n$navbar-toggler-padding-y: .25rem !default;\n$navbar-toggler-padding-x: .75rem !default;\n$navbar-toggler-font-size: $font-size-lg !default;\n$navbar-toggler-border-radius: $btn-border-radius !default;\n$navbar-toggler-focus-width: $btn-focus-width !default;\n$navbar-toggler-transition: box-shadow .15s ease-in-out !default;\n// scss-docs-end navbar-variables\n\n// scss-docs-start navbar-theme-variables\n$navbar-dark-color: rgba($white, .55) !default;\n$navbar-dark-hover-color: rgba($white, .75) !default;\n$navbar-dark-active-color: $white !default;\n$navbar-dark-disabled-color: rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-dark-toggler-border-color: rgba($white, .1) !default;\n\n$navbar-light-color: rgba($black, .55) !default;\n$navbar-light-hover-color: rgba($black, .7) !default;\n$navbar-light-active-color: rgba($black, .9) !default;\n$navbar-light-disabled-color: rgba($black, .3) !default;\n$navbar-light-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-light-toggler-border-color: rgba($black, .1) !default;\n\n$navbar-light-brand-color: $navbar-light-active-color !default;\n$navbar-light-brand-hover-color: $navbar-light-active-color !default;\n$navbar-dark-brand-color: $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;\n// scss-docs-end navbar-theme-variables\n\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n// scss-docs-start dropdown-variables\n$dropdown-min-width: 10rem !default;\n$dropdown-padding-x: 0 !default;\n$dropdown-padding-y: .5rem !default;\n$dropdown-spacer: .125rem !default;\n$dropdown-font-size: $font-size-base !default;\n$dropdown-color: $body-color !default;\n$dropdown-bg: $white !default;\n$dropdown-border-color: rgba($black, .15) !default;\n$dropdown-border-radius: $border-radius !default;\n$dropdown-border-width: $border-width !default;\n$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-divider-bg: $dropdown-border-color !default;\n$dropdown-divider-margin-y: $spacer * .5 !default;\n$dropdown-box-shadow: $box-shadow !default;\n\n$dropdown-link-color: $gray-900 !default;\n$dropdown-link-hover-color: shade-color($dropdown-link-color, 10%) !default;\n$dropdown-link-hover-bg: $gray-200 !default;\n\n$dropdown-link-active-color: $component-active-color !default;\n$dropdown-link-active-bg: $component-active-bg !default;\n\n$dropdown-link-disabled-color: $gray-500 !default;\n\n$dropdown-item-padding-y: $spacer * .25 !default;\n$dropdown-item-padding-x: $spacer !default;\n\n$dropdown-header-color: $gray-600 !default;\n$dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default;\n// scss-docs-end dropdown-variables\n\n// scss-docs-start dropdown-dark-variables\n$dropdown-dark-color: $gray-300 !default;\n$dropdown-dark-bg: $gray-800 !default;\n$dropdown-dark-border-color: $dropdown-border-color !default;\n$dropdown-dark-divider-bg: $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow: null !default;\n$dropdown-dark-link-color: $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color: $white !default;\n$dropdown-dark-link-hover-bg: rgba($white, .15) !default;\n$dropdown-dark-link-active-color: $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color: $gray-500 !default;\n// scss-docs-end dropdown-dark-variables\n\n\n// Pagination\n\n// scss-docs-start pagination-variables\n$pagination-padding-y: .375rem !default;\n$pagination-padding-x: .75rem !default;\n$pagination-padding-y-sm: .25rem !default;\n$pagination-padding-x-sm: .5rem !default;\n$pagination-padding-y-lg: .75rem !default;\n$pagination-padding-x-lg: 1.5rem !default;\n\n$pagination-color: $link-color !default;\n$pagination-bg: $white !default;\n$pagination-border-width: $border-width !default;\n$pagination-border-radius: $border-radius !default;\n$pagination-margin-start: -$pagination-border-width !default;\n$pagination-border-color: $gray-300 !default;\n\n$pagination-focus-color: $link-hover-color !default;\n$pagination-focus-bg: $gray-200 !default;\n$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$pagination-focus-outline: 0 !default;\n\n$pagination-hover-color: $link-hover-color !default;\n$pagination-hover-bg: $gray-200 !default;\n$pagination-hover-border-color: $gray-300 !default;\n\n$pagination-active-color: $component-active-color !default;\n$pagination-active-bg: $component-active-bg !default;\n$pagination-active-border-color: $pagination-active-bg !default;\n\n$pagination-disabled-color: $gray-600 !default;\n$pagination-disabled-bg: $white !default;\n$pagination-disabled-border-color: $gray-300 !default;\n\n$pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$pagination-border-radius-sm: $border-radius-sm !default;\n$pagination-border-radius-lg: $border-radius-lg !default;\n// scss-docs-end pagination-variables\n\n\n// Placeholders\n\n// scss-docs-start placeholders\n$placeholder-opacity-max: .5 !default;\n$placeholder-opacity-min: .2 !default;\n// scss-docs-end placeholders\n\n// Cards\n\n// scss-docs-start card-variables\n$card-spacer-y: $spacer !default;\n$card-spacer-x: $spacer !default;\n$card-title-spacer-y: $spacer * .5 !default;\n$card-border-width: $border-width !default;\n$card-border-color: rgba($black, .125) !default;\n$card-border-radius: $border-radius !default;\n$card-box-shadow: null !default;\n$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y: $card-spacer-y * .5 !default;\n$card-cap-padding-x: $card-spacer-x !default;\n$card-cap-bg: rgba($black, .03) !default;\n$card-cap-color: null !default;\n$card-height: null !default;\n$card-color: null !default;\n$card-bg: $white !default;\n$card-img-overlay-padding: $spacer !default;\n$card-group-margin: $grid-gutter-width * .5 !default;\n// scss-docs-end card-variables\n\n// Accordion\n\n// scss-docs-start accordion-variables\n$accordion-padding-y: 1rem !default;\n$accordion-padding-x: 1.25rem !default;\n$accordion-color: $body-color !default;\n$accordion-bg: $body-bg !default;\n$accordion-border-width: $border-width !default;\n$accordion-border-color: rgba($black, .125) !default;\n$accordion-border-radius: $border-radius !default;\n$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;\n\n$accordion-body-padding-y: $accordion-padding-y !default;\n$accordion-body-padding-x: $accordion-padding-x !default;\n\n$accordion-button-padding-y: $accordion-padding-y !default;\n$accordion-button-padding-x: $accordion-padding-x !default;\n$accordion-button-color: $accordion-color !default;\n$accordion-button-bg: $accordion-bg !default;\n$accordion-transition: $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg: tint-color($component-active-bg, 90%) !default;\n$accordion-button-active-color: shade-color($primary, 10%) !default;\n\n$accordion-button-focus-border-color: $input-focus-border-color !default;\n$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;\n\n$accordion-icon-width: 1.25rem !default;\n$accordion-icon-color: $accordion-button-color !default;\n$accordion-icon-active-color: $accordion-button-active-color !default;\n$accordion-icon-transition: transform .2s ease-in-out !default;\n$accordion-icon-transform: rotate(-180deg) !default;\n\n$accordion-button-icon: url(\"data:image/svg+xml,\") !default;\n$accordion-button-active-icon: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end accordion-variables\n\n// Tooltips\n\n// scss-docs-start tooltip-variables\n$tooltip-font-size: $font-size-sm !default;\n$tooltip-max-width: 200px !default;\n$tooltip-color: $white !default;\n$tooltip-bg: $black !default;\n$tooltip-border-radius: $border-radius !default;\n$tooltip-opacity: .9 !default;\n$tooltip-padding-y: $spacer * .25 !default;\n$tooltip-padding-x: $spacer * .5 !default;\n$tooltip-margin: 0 !default;\n\n$tooltip-arrow-width: .8rem !default;\n$tooltip-arrow-height: .4rem !default;\n$tooltip-arrow-color: $tooltip-bg !default;\n// scss-docs-end tooltip-variables\n\n// Form tooltips must come after regular tooltips\n// scss-docs-start tooltip-feedback-variables\n$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size: $tooltip-font-size !default;\n$form-feedback-tooltip-line-height: null !default;\n$form-feedback-tooltip-opacity: $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n// scss-docs-end tooltip-feedback-variables\n\n\n// Popovers\n\n// scss-docs-start popover-variables\n$popover-font-size: $font-size-sm !default;\n$popover-bg: $white !default;\n$popover-max-width: 276px !default;\n$popover-border-width: $border-width !default;\n$popover-border-color: rgba($black, .2) !default;\n$popover-border-radius: $border-radius-lg !default;\n$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow: $box-shadow !default;\n\n$popover-header-bg: shade-color($popover-bg, 6%) !default;\n$popover-header-color: $headings-color !default;\n$popover-header-padding-y: .5rem !default;\n$popover-header-padding-x: $spacer !default;\n\n$popover-body-color: $body-color !default;\n$popover-body-padding-y: $spacer !default;\n$popover-body-padding-x: $spacer !default;\n\n$popover-arrow-width: 1rem !default;\n$popover-arrow-height: .5rem !default;\n$popover-arrow-color: $popover-bg !default;\n\n$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;\n// scss-docs-end popover-variables\n\n\n// Toasts\n\n// scss-docs-start toast-variables\n$toast-max-width: 350px !default;\n$toast-padding-x: .75rem !default;\n$toast-padding-y: .5rem !default;\n$toast-font-size: .875rem !default;\n$toast-color: null !default;\n$toast-background-color: rgba($white, .85) !default;\n$toast-border-width: 1px !default;\n$toast-border-color: rgba($black, .1) !default;\n$toast-border-radius: $border-radius !default;\n$toast-box-shadow: $box-shadow !default;\n$toast-spacing: $container-padding-x !default;\n\n$toast-header-color: $gray-600 !default;\n$toast-header-background-color: rgba($white, .85) !default;\n$toast-header-border-color: rgba($black, .05) !default;\n// scss-docs-end toast-variables\n\n\n// Badges\n\n// scss-docs-start badge-variables\n$badge-font-size: .75em !default;\n$badge-font-weight: $font-weight-bold !default;\n$badge-color: $white !default;\n$badge-padding-y: .35em !default;\n$badge-padding-x: .65em !default;\n$badge-border-radius: $border-radius !default;\n// scss-docs-end badge-variables\n\n\n// Modals\n\n// scss-docs-start modal-variables\n$modal-inner-padding: $spacer !default;\n\n$modal-footer-margin-between: .5rem !default;\n\n$modal-dialog-margin: .5rem !default;\n$modal-dialog-margin-y-sm-up: 1.75rem !default;\n\n$modal-title-line-height: $line-height-base !default;\n\n$modal-content-color: null !default;\n$modal-content-bg: $white !default;\n$modal-content-border-color: rgba($black, .2) !default;\n$modal-content-border-width: $border-width !default;\n$modal-content-border-radius: $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs: $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up: $box-shadow !default;\n\n$modal-backdrop-bg: $black !default;\n$modal-backdrop-opacity: .5 !default;\n$modal-header-border-color: $border-color !default;\n$modal-footer-border-color: $modal-header-border-color !default;\n$modal-header-border-width: $modal-content-border-width !default;\n$modal-footer-border-width: $modal-header-border-width !default;\n$modal-header-padding-y: $modal-inner-padding !default;\n$modal-header-padding-x: $modal-inner-padding !default;\n$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-sm: 300px !default;\n$modal-md: 500px !default;\n$modal-lg: 800px !default;\n$modal-xl: 1140px !default;\n\n$modal-fade-transform: translate(0, -50px) !default;\n$modal-show-transform: none !default;\n$modal-transition: transform .3s ease-out !default;\n$modal-scale-transform: scale(1.02) !default;\n// scss-docs-end modal-variables\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n// scss-docs-start alert-variables\n$alert-padding-y: $spacer !default;\n$alert-padding-x: $spacer !default;\n$alert-margin-bottom: 1rem !default;\n$alert-border-radius: $border-radius !default;\n$alert-link-font-weight: $font-weight-bold !default;\n$alert-border-width: $border-width !default;\n$alert-bg-scale: -80% !default;\n$alert-border-scale: -70% !default;\n$alert-color-scale: 40% !default;\n$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n// scss-docs-end alert-variables\n\n\n// Progress bars\n\n// scss-docs-start progress-variables\n$progress-height: 1rem !default;\n$progress-font-size: $font-size-base * .75 !default;\n$progress-bg: $gray-200 !default;\n$progress-border-radius: $border-radius !default;\n$progress-box-shadow: $box-shadow-inset !default;\n$progress-bar-color: $white !default;\n$progress-bar-bg: $primary !default;\n$progress-bar-animation-timing: 1s linear infinite !default;\n$progress-bar-transition: width .6s ease !default;\n// scss-docs-end progress-variables\n\n\n// List group\n\n// scss-docs-start list-group-variables\n$list-group-color: $gray-900 !default;\n$list-group-bg: $white !default;\n$list-group-border-color: rgba($black, .125) !default;\n$list-group-border-width: $border-width !default;\n$list-group-border-radius: $border-radius !default;\n\n$list-group-item-padding-y: $spacer * .5 !default;\n$list-group-item-padding-x: $spacer !default;\n$list-group-item-bg-scale: -80% !default;\n$list-group-item-color-scale: 40% !default;\n\n$list-group-hover-bg: $gray-100 !default;\n$list-group-active-color: $component-active-color !default;\n$list-group-active-bg: $component-active-bg !default;\n$list-group-active-border-color: $list-group-active-bg !default;\n\n$list-group-disabled-color: $gray-600 !default;\n$list-group-disabled-bg: $list-group-bg !default;\n\n$list-group-action-color: $gray-700 !default;\n$list-group-action-hover-color: $list-group-action-color !default;\n\n$list-group-action-active-color: $body-color !default;\n$list-group-action-active-bg: $gray-200 !default;\n// scss-docs-end list-group-variables\n\n\n// Image thumbnails\n\n// scss-docs-start thumbnail-variables\n$thumbnail-padding: .25rem !default;\n$thumbnail-bg: $body-bg !default;\n$thumbnail-border-width: $border-width !default;\n$thumbnail-border-color: $gray-300 !default;\n$thumbnail-border-radius: $border-radius !default;\n$thumbnail-box-shadow: $box-shadow-sm !default;\n// scss-docs-end thumbnail-variables\n\n\n// Figures\n\n// scss-docs-start figure-variables\n$figure-caption-font-size: $small-font-size !default;\n$figure-caption-color: $gray-600 !default;\n// scss-docs-end figure-variables\n\n\n// Breadcrumbs\n\n// scss-docs-start breadcrumb-variables\n$breadcrumb-font-size: null !default;\n$breadcrumb-padding-y: 0 !default;\n$breadcrumb-padding-x: 0 !default;\n$breadcrumb-item-padding-x: .5rem !default;\n$breadcrumb-margin-bottom: 1rem !default;\n$breadcrumb-bg: null !default;\n$breadcrumb-divider-color: $gray-600 !default;\n$breadcrumb-active-color: $gray-600 !default;\n$breadcrumb-divider: quote(\"/\") !default;\n$breadcrumb-divider-flipped: $breadcrumb-divider !default;\n$breadcrumb-border-radius: null !default;\n// scss-docs-end breadcrumb-variables\n\n// Carousel\n\n// scss-docs-start carousel-variables\n$carousel-control-color: $white !default;\n$carousel-control-width: 15% !default;\n$carousel-control-opacity: .5 !default;\n$carousel-control-hover-opacity: .9 !default;\n$carousel-control-transition: opacity .15s ease !default;\n\n$carousel-indicator-width: 30px !default;\n$carousel-indicator-height: 3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer: 3px !default;\n$carousel-indicator-opacity: .5 !default;\n$carousel-indicator-active-bg: $white !default;\n$carousel-indicator-active-opacity: 1 !default;\n$carousel-indicator-transition: opacity .6s ease !default;\n\n$carousel-caption-width: 70% !default;\n$carousel-caption-color: $white !default;\n$carousel-caption-padding-y: 1.25rem !default;\n$carousel-caption-spacer: 1.25rem !default;\n\n$carousel-control-icon-width: 2rem !default;\n\n$carousel-control-prev-icon-bg: url(\"data:image/svg+xml,\") !default;\n$carousel-control-next-icon-bg: url(\"data:image/svg+xml,\") !default;\n\n$carousel-transition-duration: .6s !default;\n$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg: $black !default;\n$carousel-dark-caption-color: $black !default;\n$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;\n// scss-docs-end carousel-variables\n\n\n// Spinners\n\n// scss-docs-start spinner-variables\n$spinner-width: 2rem !default;\n$spinner-height: $spinner-width !default;\n$spinner-vertical-align: -.125em !default;\n$spinner-border-width: .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm: 1rem !default;\n$spinner-height-sm: $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n// scss-docs-end spinner-variables\n\n\n// Close\n\n// scss-docs-start close-variables\n$btn-close-width: 1em !default;\n$btn-close-height: $btn-close-width !default;\n$btn-close-padding-x: .25em !default;\n$btn-close-padding-y: $btn-close-padding-x !default;\n$btn-close-color: $black !default;\n$btn-close-bg: url(\"data:image/svg+xml,\") !default;\n$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;\n$btn-close-opacity: .5 !default;\n$btn-close-hover-opacity: .75 !default;\n$btn-close-focus-opacity: 1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;\n// scss-docs-end close-variables\n\n\n// Offcanvas\n\n// scss-docs-start offcanvas-variables\n$offcanvas-padding-y: $modal-inner-padding !default;\n$offcanvas-padding-x: $modal-inner-padding !default;\n$offcanvas-horizontal-width: 400px !default;\n$offcanvas-vertical-height: 30vh !default;\n$offcanvas-transition-duration: .3s !default;\n$offcanvas-border-color: $modal-content-border-color !default;\n$offcanvas-border-width: $modal-content-border-width !default;\n$offcanvas-title-line-height: $modal-title-line-height !default;\n$offcanvas-bg-color: $modal-content-bg !default;\n$offcanvas-color: $modal-content-color !default;\n$offcanvas-box-shadow: $modal-content-box-shadow-xs !default;\n$offcanvas-backdrop-bg: $modal-backdrop-bg !default;\n$offcanvas-backdrop-opacity: $modal-backdrop-opacity !default;\n// scss-docs-end offcanvas-variables\n\n// Code\n\n$code-font-size: $small-font-size !default;\n$code-color: $pink !default;\n\n$kbd-padding-y: .2rem !default;\n$kbd-padding-x: .4rem !default;\n$kbd-font-size: $code-font-size !default;\n$kbd-color: $white !default;\n$kbd-bg: $gray-900 !default;\n\n$pre-color: null !default;\n", - "// stylelint-disable indentation\n\n// Utilities\n\n$utilities: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$utilities: map-merge(\n (\n // scss-docs-start utils-vertical-align\n \"align\": (\n property: vertical-align,\n class: align,\n values: baseline top middle bottom text-bottom text-top\n ),\n // scss-docs-end utils-vertical-align\n // scss-docs-start utils-float\n \"float\": (\n responsive: true,\n property: float,\n values: (\n start: left,\n end: right,\n none: none,\n )\n ),\n // scss-docs-end utils-float\n // Opacity utilities\n // scss-docs-start utils-opacity\n \"opacity\": (\n property: opacity,\n values: (\n 0: 0,\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1,\n )\n ),\n // scss-docs-end utils-opacity\n // scss-docs-start utils-overflow\n \"overflow\": (\n property: overflow,\n values: auto hidden visible scroll,\n ),\n // scss-docs-end utils-overflow\n // scss-docs-start utils-display\n \"display\": (\n responsive: true,\n print: true,\n property: display,\n class: d,\n values: inline inline-block block grid table table-row table-cell flex inline-flex none\n ),\n // scss-docs-end utils-display\n // scss-docs-start utils-shadow\n \"shadow\": (\n property: box-shadow,\n class: shadow,\n values: (\n null: $box-shadow,\n sm: $box-shadow-sm,\n lg: $box-shadow-lg,\n none: none,\n )\n ),\n // scss-docs-end utils-shadow\n // scss-docs-start utils-position\n \"position\": (\n property: position,\n values: static relative absolute fixed sticky\n ),\n \"top\": (\n property: top,\n values: $position-values\n ),\n \"bottom\": (\n property: bottom,\n values: $position-values\n ),\n \"start\": (\n property: left,\n class: start,\n values: $position-values\n ),\n \"end\": (\n property: right,\n class: end,\n values: $position-values\n ),\n \"translate-middle\": (\n property: transform,\n class: translate-middle,\n values: (\n null: translate(-50%, -50%),\n x: translateX(-50%),\n y: translateY(-50%),\n )\n ),\n // scss-docs-end utils-position\n // scss-docs-start utils-borders\n \"border\": (\n property: border,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-top\": (\n property: border-top,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-end\": (\n property: border-right,\n class: border-end,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-bottom\": (\n property: border-bottom,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-start\": (\n property: border-left,\n class: border-start,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-color\": (\n property: border-color,\n class: border,\n values: map-merge($theme-colors, (\"white\": $white))\n ),\n \"border-width\": (\n property: border-width,\n class: border,\n values: $border-widths\n ),\n // scss-docs-end utils-borders\n // Sizing utilities\n // scss-docs-start utils-sizing\n \"width\": (\n property: width,\n class: w,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-width\": (\n property: max-width,\n class: mw,\n values: (100: 100%)\n ),\n \"viewport-width\": (\n property: width,\n class: vw,\n values: (100: 100vw)\n ),\n \"min-viewport-width\": (\n property: min-width,\n class: min-vw,\n values: (100: 100vw)\n ),\n \"height\": (\n property: height,\n class: h,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-height\": (\n property: max-height,\n class: mh,\n values: (100: 100%)\n ),\n \"viewport-height\": (\n property: height,\n class: vh,\n values: (100: 100vh)\n ),\n \"min-viewport-height\": (\n property: min-height,\n class: min-vh,\n values: (100: 100vh)\n ),\n // scss-docs-end utils-sizing\n // Flex utilities\n // scss-docs-start utils-flex\n \"flex\": (\n responsive: true,\n property: flex,\n values: (fill: 1 1 auto)\n ),\n \"flex-direction\": (\n responsive: true,\n property: flex-direction,\n class: flex,\n values: row column row-reverse column-reverse\n ),\n \"flex-grow\": (\n responsive: true,\n property: flex-grow,\n class: flex,\n values: (\n grow-0: 0,\n grow-1: 1,\n )\n ),\n \"flex-shrink\": (\n responsive: true,\n property: flex-shrink,\n class: flex,\n values: (\n shrink-0: 0,\n shrink-1: 1,\n )\n ),\n \"flex-wrap\": (\n responsive: true,\n property: flex-wrap,\n class: flex,\n values: wrap nowrap wrap-reverse\n ),\n \"gap\": (\n responsive: true,\n property: gap,\n class: gap,\n values: $spacers\n ),\n \"justify-content\": (\n responsive: true,\n property: justify-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n evenly: space-evenly,\n )\n ),\n \"align-items\": (\n responsive: true,\n property: align-items,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"align-content\": (\n responsive: true,\n property: align-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n stretch: stretch,\n )\n ),\n \"align-self\": (\n responsive: true,\n property: align-self,\n values: (\n auto: auto,\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"order\": (\n responsive: true,\n property: order,\n values: (\n first: -1,\n 0: 0,\n 1: 1,\n 2: 2,\n 3: 3,\n 4: 4,\n 5: 5,\n last: 6,\n ),\n ),\n // scss-docs-end utils-flex\n // Margin utilities\n // scss-docs-start utils-spacing\n \"margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: map-merge($spacers, (auto: auto))\n ),\n // Negative margin utilities\n \"negative-margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: $negative-spacers\n ),\n \"negative-margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: $negative-spacers\n ),\n \"negative-margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: $negative-spacers\n ),\n \"negative-margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: $negative-spacers\n ),\n \"negative-margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: $negative-spacers\n ),\n \"negative-margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: $negative-spacers\n ),\n \"negative-margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: $negative-spacers\n ),\n // Padding utilities\n \"padding\": (\n responsive: true,\n property: padding,\n class: p,\n values: $spacers\n ),\n \"padding-x\": (\n responsive: true,\n property: padding-right padding-left,\n class: px,\n values: $spacers\n ),\n \"padding-y\": (\n responsive: true,\n property: padding-top padding-bottom,\n class: py,\n values: $spacers\n ),\n \"padding-top\": (\n responsive: true,\n property: padding-top,\n class: pt,\n values: $spacers\n ),\n \"padding-end\": (\n responsive: true,\n property: padding-right,\n class: pe,\n values: $spacers\n ),\n \"padding-bottom\": (\n responsive: true,\n property: padding-bottom,\n class: pb,\n values: $spacers\n ),\n \"padding-start\": (\n responsive: true,\n property: padding-left,\n class: ps,\n values: $spacers\n ),\n // scss-docs-end utils-spacing\n // Text\n // scss-docs-start utils-text\n \"font-family\": (\n property: font-family,\n class: font,\n values: (monospace: var(--#{$variable-prefix}font-monospace))\n ),\n \"font-size\": (\n rfs: true,\n property: font-size,\n class: fs,\n values: $font-sizes\n ),\n \"font-style\": (\n property: font-style,\n class: fst,\n values: italic normal\n ),\n \"font-weight\": (\n property: font-weight,\n class: fw,\n values: (\n light: $font-weight-light,\n lighter: $font-weight-lighter,\n normal: $font-weight-normal,\n bold: $font-weight-bold,\n bolder: $font-weight-bolder\n )\n ),\n \"line-height\": (\n property: line-height,\n class: lh,\n values: (\n 1: 1,\n sm: $line-height-sm,\n base: $line-height-base,\n lg: $line-height-lg,\n )\n ),\n \"text-align\": (\n responsive: true,\n property: text-align,\n class: text,\n values: (\n start: left,\n end: right,\n center: center,\n )\n ),\n \"text-decoration\": (\n property: text-decoration,\n values: none underline line-through\n ),\n \"text-transform\": (\n property: text-transform,\n class: text,\n values: lowercase uppercase capitalize\n ),\n \"white-space\": (\n property: white-space,\n class: text,\n values: (\n wrap: normal,\n nowrap: nowrap,\n )\n ),\n \"word-wrap\": (\n property: word-wrap word-break,\n class: text,\n values: (break: break-word),\n rtl: false\n ),\n // scss-docs-end utils-text\n // scss-docs-start utils-color\n \"color\": (\n property: color,\n class: text,\n local-vars: (\n \"text-opacity\": 1\n ),\n values: map-merge(\n $utilities-text-colors,\n (\n \"muted\": $text-muted,\n \"black-50\": rgba($black, .5), // deprecated\n \"white-50\": rgba($white, .5), // deprecated\n \"reset\": inherit,\n )\n )\n ),\n \"text-opacity\": (\n css-var: true,\n class: text-opacity,\n values: (\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1\n )\n ),\n // scss-docs-end utils-color\n // scss-docs-start utils-bg-color\n \"background-color\": (\n property: background-color,\n class: bg,\n local-vars: (\n \"bg-opacity\": 1\n ),\n values: map-merge(\n $utilities-bg-colors,\n (\n \"transparent\": transparent\n )\n )\n ),\n \"bg-opacity\": (\n css-var: true,\n class: bg-opacity,\n values: (\n 10: .1,\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1\n )\n ),\n // scss-docs-end utils-bg-color\n \"gradient\": (\n property: background-image,\n class: bg,\n values: (gradient: var(--#{$variable-prefix}gradient))\n ),\n // scss-docs-start utils-interaction\n \"user-select\": (\n property: user-select,\n values: all auto none\n ),\n \"pointer-events\": (\n property: pointer-events,\n class: pe,\n values: none auto,\n ),\n // scss-docs-end utils-interaction\n // scss-docs-start utils-border-radius\n \"rounded\": (\n property: border-radius,\n class: rounded,\n values: (\n null: $border-radius,\n 0: 0,\n 1: $border-radius-sm,\n 2: $border-radius,\n 3: $border-radius-lg,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"rounded-top\": (\n property: border-top-left-radius border-top-right-radius,\n class: rounded-top,\n values: (null: $border-radius)\n ),\n \"rounded-end\": (\n property: border-top-right-radius border-bottom-right-radius,\n class: rounded-end,\n values: (null: $border-radius)\n ),\n \"rounded-bottom\": (\n property: border-bottom-right-radius border-bottom-left-radius,\n class: rounded-bottom,\n values: (null: $border-radius)\n ),\n \"rounded-start\": (\n property: border-bottom-left-radius border-top-left-radius,\n class: rounded-start,\n values: (null: $border-radius)\n ),\n // scss-docs-end utils-border-radius\n // scss-docs-start utils-visibility\n \"visibility\": (\n property: visibility,\n class: null,\n values: (\n visible: visible,\n invisible: hidden,\n )\n )\n // scss-docs-end utils-visibility\n ),\n $utilities\n);\n", - "/*!\n * Bootstrap v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n */\n\n// scss-docs-start import-stack\n// Configuration\n@import \"functions\";\n@import \"variables\";\n@import \"mixins\";\n@import \"utilities\";\n\n// Layout & components\n@import \"root\";\n@import \"reboot\";\n@import \"type\";\n@import \"images\";\n@import \"containers\";\n@import \"grid\";\n@import \"tables\";\n@import \"forms\";\n@import \"buttons\";\n@import \"transitions\";\n@import \"dropdown\";\n@import \"button-group\";\n@import \"nav\";\n@import \"navbar\";\n@import \"card\";\n@import \"accordion\";\n@import \"breadcrumb\";\n@import \"pagination\";\n@import \"badge\";\n@import \"alert\";\n@import \"progress\";\n@import \"list-group\";\n@import \"close\";\n@import \"toasts\";\n@import \"modal\";\n@import \"tooltip\";\n@import \"popover\";\n@import \"carousel\";\n@import \"spinners\";\n@import \"offcanvas\";\n@import \"placeholders\";\n\n// Helpers\n@import \"helpers\";\n\n// Utilities\n@import \"utilities/api\";\n// scss-docs-end import-stack\n", - "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n $prev-key: null;\n $prev-num: null;\n @each $key, $num in $map {\n @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n // Do nothing\n } @else if not comparable($prev-num, $num) {\n @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n } @else if $prev-num >= $num {\n @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n }\n $prev-key: $key;\n $prev-num: $num;\n }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n @if length($map) > 0 {\n $values: map-values($map);\n $first-value: nth($values, 1);\n @if $first-value != 0 {\n @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n }\n }\n}\n\n// Colors\n@function to-rgb($value) {\n @return red($value), green($value), blue($value);\n}\n\n// stylelint-disable scss/dollar-variable-pattern\n@function rgba-css-var($identifier, $target) {\n @if $identifier == \"body\" and $target == \"bg\" {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-bg-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n } @if $identifier == \"body\" and $target == \"text\" {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-color-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n } @else {\n @return rgba(var(--#{$variable-prefix}#{$identifier}-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n }\n}\n\n@function map-loop($map, $func, $args...) {\n $_map: ();\n\n @each $key, $value in $map {\n // allow to pass the $key and $value of the map as an function argument\n $_args: ();\n @each $arg in $args {\n $_args: append($_args, if($arg == \"$key\", $key, if($arg == \"$value\", $value, $arg)));\n }\n\n $_map: map-merge($_map, ($key: call(get-function($func), $_args...)));\n }\n\n @return $_map;\n}\n// stylelint-enable scss/dollar-variable-pattern\n\n@function varify($list) {\n $result: null;\n @each $entry in $list {\n $result: append($result, var(--#{$variable-prefix}#{$entry}), space);\n }\n @return $result;\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n $result: ();\n @each $key, $value in $map {\n @if $key != 0 {\n $result: map-merge($result, (\"n\" + $key: (-$value)));\n }\n }\n @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n $result: ();\n @each $key, $value in $map {\n @if (index($values, $key) != null) {\n $result: map-merge($result, ($key: $value));\n }\n }\n @return $result;\n}\n\n// Merge multiple maps\n@function map-merge-multiple($maps...) {\n $merged-maps: ();\n\n @each $map in $maps {\n $merged-maps: map-merge($merged-maps, $map);\n }\n @return $merged-maps;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n $index: str-index($string, $search);\n\n @if $index {\n @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n }\n\n @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n @if str-index($string, \"data:image/svg+xml\") {\n @each $char, $encoded in $escaped-characters {\n // Do not escape the url brackets\n @if str-index($string, \"url(\") == 1 {\n $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n } @else {\n $string: str-replace($string, $char, $encoded);\n }\n }\n }\n\n @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n $max-ratio: 0;\n $max-ratio-color: null;\n\n @each $color in $foregrounds {\n $contrast-ratio: contrast-ratio($background, $color);\n @if $contrast-ratio > $min-contrast-ratio {\n @return $color;\n } @else if $contrast-ratio > $max-ratio {\n $max-ratio: $contrast-ratio;\n $max-ratio-color: $color;\n }\n }\n\n @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n $l1: luminance($background);\n $l2: luminance(opaque($background, $foreground));\n\n @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n $rgb: (\n \"r\": red($color),\n \"g\": green($color),\n \"b\": blue($color)\n );\n\n @each $name, $value in $rgb {\n $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));\n $rgb: map-merge($rgb, ($name: $value));\n }\n\n @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n @if $value1 == null {\n @return $value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 + $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n @if $value1 == null and $value2 == null {\n @return null;\n }\n\n @if $value1 == null {\n @return -$value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 - $value2;\n }\n\n @if type-of($value2) != number {\n $value2: unquote(\"(\") + $value2 + unquote(\")\");\n }\n\n @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n\n@function divide($dividend, $divisor, $precision: 10) {\n $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n $dividend: abs($dividend);\n $divisor: abs($divisor);\n @if $dividend == 0 {\n @return 0;\n }\n @if $divisor == 0 {\n @error \"Cannot divide by 0\";\n }\n $remainder: $dividend;\n $result: 0;\n $factor: 10;\n @while ($remainder > 0 and $precision >= 0) {\n $quotient: 0;\n @while ($remainder >= $divisor) {\n $remainder: $remainder - $divisor;\n $quotient: $quotient + 1;\n }\n $result: $result * 10 + $quotient;\n $factor: $factor * .1;\n $remainder: $remainder * 10;\n $precision: $precision - 1;\n @if ($precision < 0 and $remainder >= $divisor * 5) {\n $result: $result + 1;\n }\n }\n $result: $result * $factor * $sign;\n $dividend-unit: unit($dividend);\n $divisor-unit: unit($divisor);\n $unit-map: (\n \"px\": 1px,\n \"rem\": 1rem,\n \"em\": 1em,\n \"%\": 1%\n );\n @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n $result: $result * map-get($unit-map, $dividend-unit);\n }\n @return $result;\n}\n", - "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// Color system\n\n// scss-docs-start gray-color-variables\n$white: #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black: #000 !default;\n// scss-docs-end gray-color-variables\n\n// fusv-disable\n// scss-docs-start gray-colors-map\n$grays: (\n \"100\": $gray-100,\n \"200\": $gray-200,\n \"300\": $gray-300,\n \"400\": $gray-400,\n \"500\": $gray-500,\n \"600\": $gray-600,\n \"700\": $gray-700,\n \"800\": $gray-800,\n \"900\": $gray-900\n) !default;\n// scss-docs-end gray-colors-map\n// fusv-enable\n\n// scss-docs-start color-variables\n$blue: #0d6efd !default;\n$indigo: #6610f2 !default;\n$purple: #6f42c1 !default;\n$pink: #d63384 !default;\n$red: #dc3545 !default;\n$orange: #fd7e14 !default;\n$yellow: #ffc107 !default;\n$green: #198754 !default;\n$teal: #20c997 !default;\n$cyan: #0dcaf0 !default;\n// scss-docs-end color-variables\n\n// scss-docs-start colors-map\n$colors: (\n \"blue\": $blue,\n \"indigo\": $indigo,\n \"purple\": $purple,\n \"pink\": $pink,\n \"red\": $red,\n \"orange\": $orange,\n \"yellow\": $yellow,\n \"green\": $green,\n \"teal\": $teal,\n \"cyan\": $cyan,\n \"white\": $white,\n \"gray\": $gray-600,\n \"gray-dark\": $gray-800\n) !default;\n// scss-docs-end colors-map\n\n// scss-docs-start theme-color-variables\n$primary: $blue !default;\n$secondary: $gray-600 !default;\n$success: $green !default;\n$info: $cyan !default;\n$warning: $yellow !default;\n$danger: $red !default;\n$light: $gray-100 !default;\n$dark: $gray-900 !default;\n// scss-docs-end theme-color-variables\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n \"primary\": $primary,\n \"secondary\": $secondary,\n \"success\": $success,\n \"info\": $info,\n \"warning\": $warning,\n \"danger\": $danger,\n \"light\": $light,\n \"dark\": $dark\n) !default;\n// scss-docs-end theme-colors-map\n\n// scss-docs-start theme-colors-rgb\n$theme-colors-rgb: map-loop($theme-colors, to-rgb, \"$value\") !default;\n// scss-docs-end theme-colors-rgb\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio: 4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark: $black !default;\n$color-contrast-light: $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 80%) !default;\n$blue-200: tint-color($blue, 60%) !default;\n$blue-300: tint-color($blue, 40%) !default;\n$blue-400: tint-color($blue, 20%) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 20%) !default;\n$blue-700: shade-color($blue, 40%) !default;\n$blue-800: shade-color($blue, 60%) !default;\n$blue-900: shade-color($blue, 80%) !default;\n\n$indigo-100: tint-color($indigo, 80%) !default;\n$indigo-200: tint-color($indigo, 60%) !default;\n$indigo-300: tint-color($indigo, 40%) !default;\n$indigo-400: tint-color($indigo, 20%) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 20%) !default;\n$indigo-700: shade-color($indigo, 40%) !default;\n$indigo-800: shade-color($indigo, 60%) !default;\n$indigo-900: shade-color($indigo, 80%) !default;\n\n$purple-100: tint-color($purple, 80%) !default;\n$purple-200: tint-color($purple, 60%) !default;\n$purple-300: tint-color($purple, 40%) !default;\n$purple-400: tint-color($purple, 20%) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 20%) !default;\n$purple-700: shade-color($purple, 40%) !default;\n$purple-800: shade-color($purple, 60%) !default;\n$purple-900: shade-color($purple, 80%) !default;\n\n$pink-100: tint-color($pink, 80%) !default;\n$pink-200: tint-color($pink, 60%) !default;\n$pink-300: tint-color($pink, 40%) !default;\n$pink-400: tint-color($pink, 20%) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 20%) !default;\n$pink-700: shade-color($pink, 40%) !default;\n$pink-800: shade-color($pink, 60%) !default;\n$pink-900: shade-color($pink, 80%) !default;\n\n$red-100: tint-color($red, 80%) !default;\n$red-200: tint-color($red, 60%) !default;\n$red-300: tint-color($red, 40%) !default;\n$red-400: tint-color($red, 20%) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 20%) !default;\n$red-700: shade-color($red, 40%) !default;\n$red-800: shade-color($red, 60%) !default;\n$red-900: shade-color($red, 80%) !default;\n\n$orange-100: tint-color($orange, 80%) !default;\n$orange-200: tint-color($orange, 60%) !default;\n$orange-300: tint-color($orange, 40%) !default;\n$orange-400: tint-color($orange, 20%) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 20%) !default;\n$orange-700: shade-color($orange, 40%) !default;\n$orange-800: shade-color($orange, 60%) !default;\n$orange-900: shade-color($orange, 80%) !default;\n\n$yellow-100: tint-color($yellow, 80%) !default;\n$yellow-200: tint-color($yellow, 60%) !default;\n$yellow-300: tint-color($yellow, 40%) !default;\n$yellow-400: tint-color($yellow, 20%) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 20%) !default;\n$yellow-700: shade-color($yellow, 40%) !default;\n$yellow-800: shade-color($yellow, 60%) !default;\n$yellow-900: shade-color($yellow, 80%) !default;\n\n$green-100: tint-color($green, 80%) !default;\n$green-200: tint-color($green, 60%) !default;\n$green-300: tint-color($green, 40%) !default;\n$green-400: tint-color($green, 20%) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 20%) !default;\n$green-700: shade-color($green, 40%) !default;\n$green-800: shade-color($green, 60%) !default;\n$green-900: shade-color($green, 80%) !default;\n\n$teal-100: tint-color($teal, 80%) !default;\n$teal-200: tint-color($teal, 60%) !default;\n$teal-300: tint-color($teal, 40%) !default;\n$teal-400: tint-color($teal, 20%) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 20%) !default;\n$teal-700: shade-color($teal, 40%) !default;\n$teal-800: shade-color($teal, 60%) !default;\n$teal-900: shade-color($teal, 80%) !default;\n\n$cyan-100: tint-color($cyan, 80%) !default;\n$cyan-200: tint-color($cyan, 60%) !default;\n$cyan-300: tint-color($cyan, 40%) !default;\n$cyan-400: tint-color($cyan, 20%) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 20%) !default;\n$cyan-700: shade-color($cyan, 40%) !default;\n$cyan-800: shade-color($cyan, 60%) !default;\n$cyan-900: shade-color($cyan, 80%) !default;\n\n$blues: (\n \"blue-100\": $blue-100,\n \"blue-200\": $blue-200,\n \"blue-300\": $blue-300,\n \"blue-400\": $blue-400,\n \"blue-500\": $blue-500,\n \"blue-600\": $blue-600,\n \"blue-700\": $blue-700,\n \"blue-800\": $blue-800,\n \"blue-900\": $blue-900\n) !default;\n\n$indigos: (\n \"indigo-100\": $indigo-100,\n \"indigo-200\": $indigo-200,\n \"indigo-300\": $indigo-300,\n \"indigo-400\": $indigo-400,\n \"indigo-500\": $indigo-500,\n \"indigo-600\": $indigo-600,\n \"indigo-700\": $indigo-700,\n \"indigo-800\": $indigo-800,\n \"indigo-900\": $indigo-900\n) !default;\n\n$purples: (\n \"purple-100\": $purple-200,\n \"purple-200\": $purple-100,\n \"purple-300\": $purple-300,\n \"purple-400\": $purple-400,\n \"purple-500\": $purple-500,\n \"purple-600\": $purple-600,\n \"purple-700\": $purple-700,\n \"purple-800\": $purple-800,\n \"purple-900\": $purple-900\n) !default;\n\n$pinks: (\n \"pink-100\": $pink-100,\n \"pink-200\": $pink-200,\n \"pink-300\": $pink-300,\n \"pink-400\": $pink-400,\n \"pink-500\": $pink-500,\n \"pink-600\": $pink-600,\n \"pink-700\": $pink-700,\n \"pink-800\": $pink-800,\n \"pink-900\": $pink-900\n) !default;\n\n$reds: (\n \"red-100\": $red-100,\n \"red-200\": $red-200,\n \"red-300\": $red-300,\n \"red-400\": $red-400,\n \"red-500\": $red-500,\n \"red-600\": $red-600,\n \"red-700\": $red-700,\n \"red-800\": $red-800,\n \"red-900\": $red-900\n) !default;\n\n$oranges: (\n \"orange-100\": $orange-100,\n \"orange-200\": $orange-200,\n \"orange-300\": $orange-300,\n \"orange-400\": $orange-400,\n \"orange-500\": $orange-500,\n \"orange-600\": $orange-600,\n \"orange-700\": $orange-700,\n \"orange-800\": $orange-800,\n \"orange-900\": $orange-900\n) !default;\n\n$yellows: (\n \"yellow-100\": $yellow-100,\n \"yellow-200\": $yellow-200,\n \"yellow-300\": $yellow-300,\n \"yellow-400\": $yellow-400,\n \"yellow-500\": $yellow-500,\n \"yellow-600\": $yellow-600,\n \"yellow-700\": $yellow-700,\n \"yellow-800\": $yellow-800,\n \"yellow-900\": $yellow-900\n) !default;\n\n$greens: (\n \"green-100\": $green-100,\n \"green-200\": $green-200,\n \"green-300\": $green-300,\n \"green-400\": $green-400,\n \"green-500\": $green-500,\n \"green-600\": $green-600,\n \"green-700\": $green-700,\n \"green-800\": $green-800,\n \"green-900\": $green-900\n) !default;\n\n$teals: (\n \"teal-100\": $teal-100,\n \"teal-200\": $teal-200,\n \"teal-300\": $teal-300,\n \"teal-400\": $teal-400,\n \"teal-500\": $teal-500,\n \"teal-600\": $teal-600,\n \"teal-700\": $teal-700,\n \"teal-800\": $teal-800,\n \"teal-900\": $teal-900\n) !default;\n\n$cyans: (\n \"cyan-100\": $cyan-100,\n \"cyan-200\": $cyan-200,\n \"cyan-300\": $cyan-300,\n \"cyan-400\": $cyan-400,\n \"cyan-500\": $cyan-500,\n \"cyan-600\": $cyan-600,\n \"cyan-700\": $cyan-700,\n \"cyan-800\": $cyan-800,\n \"cyan-900\": $cyan-900\n) !default;\n// fusv-enable\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n (\"<\", \"%3c\"),\n (\">\", \"%3e\"),\n (\"#\", \"%23\"),\n (\"(\", \"%28\"),\n (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret: true !default;\n$enable-rounded: true !default;\n$enable-shadows: false !default;\n$enable-gradients: false !default;\n$enable-transitions: true !default;\n$enable-reduced-motion: true !default;\n$enable-smooth-scroll: true !default;\n$enable-grid-classes: true !default;\n$enable-cssgrid: false !default;\n$enable-button-pointers: true !default;\n$enable-rfs: true !default;\n$enable-validation-icons: true !default;\n$enable-negative-margins: false !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities: true !default;\n\n// Prefix for :root CSS variables\n\n$variable-prefix: bs- !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n// scss-docs-start variable-gradient\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n// scss-docs-end variable-gradient\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n// scss-docs-start spacer-variables-maps\n$spacer: 1rem !default;\n$spacers: (\n 0: 0,\n 1: $spacer * .25,\n 2: $spacer * .5,\n 3: $spacer,\n 4: $spacer * 1.5,\n 5: $spacer * 3,\n) !default;\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n// scss-docs-end spacer-variables-maps\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n// scss-docs-start position-map\n$position-values: (\n 0: 0,\n 50: 50%,\n 100: 100%\n) !default;\n// scss-docs-end position-map\n\n// Body\n//\n// Settings for the `` element.\n\n$body-bg: $white !default;\n$body-color: $gray-900 !default;\n$body-text-align: null !default;\n\n// Utilities maps\n//\n// Extends the default `$theme-colors` maps to help create our utilities.\n\n// Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign.\n// scss-docs-start utilities-colors\n$utilities-colors: $theme-colors-rgb !default;\n// scss-docs-end utilities-colors\n\n// scss-docs-start utilities-text-colors\n$utilities-text: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-color)\n )\n) !default;\n$utilities-text-colors: map-loop($utilities-text, rgba-css-var, \"$key\", \"text\") !default;\n// scss-docs-end utilities-text-colors\n\n// scss-docs-start utilities-bg-colors\n$utilities-bg: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-bg)\n )\n) !default;\n$utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, \"$key\", \"bg\") !default;\n// scss-docs-end utilities-bg-colors\n\n// Links\n//\n// Style anchor elements.\n\n$link-color: $primary !default;\n$link-decoration: underline !default;\n$link-shade-percentage: 20% !default;\n$link-hover-color: shift-color($link-color, $link-shade-percentage) !default;\n$link-hover-decoration: null !default;\n\n$stretched-link-pseudo-element: after !default;\n$stretched-link-z-index: 1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom: 1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n sm: 540px,\n md: 720px,\n lg: 960px,\n xl: 1140px,\n xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns: 12 !default;\n$grid-gutter-width: 1.5rem !default;\n$grid-row-columns: 6 !default;\n\n$gutters: $spacers !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width * .5 !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n// scss-docs-start border-variables\n$border-width: 1px !default;\n$border-widths: (\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n) !default;\n\n$border-color: $gray-300 !default;\n// scss-docs-end border-variables\n\n// scss-docs-start border-radius-variables\n$border-radius: .25rem !default;\n$border-radius-sm: .2rem !default;\n$border-radius-lg: .3rem !default;\n$border-radius-pill: 50rem !default;\n// scss-docs-end border-radius-variables\n\n// scss-docs-start box-shadow-variables\n$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;\n$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;\n$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;\n$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;\n// scss-docs-end box-shadow-variables\n\n$component-active-color: $white !default;\n$component-active-bg: $primary !default;\n\n// scss-docs-start caret-variables\n$caret-width: .3em !default;\n$caret-vertical-align: $caret-width * .85 !default;\n$caret-spacing: $caret-width * .85 !default;\n// scss-docs-end caret-variables\n\n$transition-base: all .2s ease-in-out !default;\n$transition-fade: opacity .15s linear !default;\n// scss-docs-start collapse-transition\n$transition-collapse: height .35s ease !default;\n$transition-collapse-width: width .35s ease !default;\n// scss-docs-end collapse-transition\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n \"1x1\": 100%,\n \"4x3\": calc(3 / 4 * 100%),\n \"16x9\": calc(9 / 16 * 100%),\n \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// scss-docs-start font-variables\n// stylelint-disable value-keyword-case\n$font-family-sans-serif: system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\" !default;\n$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n// stylelint-enable value-keyword-case\n$font-family-base: var(--#{$variable-prefix}font-sans-serif) !default;\n$font-family-code: var(--#{$variable-prefix}font-monospace) !default;\n\n// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins\n// $font-size-base affects the font size of the body text\n$font-size-root: null !default;\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$font-size-sm: $font-size-base * .875 !default;\n$font-size-lg: $font-size-base * 1.25 !default;\n\n$font-weight-lighter: lighter !default;\n$font-weight-light: 300 !default;\n$font-weight-normal: 400 !default;\n$font-weight-bold: 700 !default;\n$font-weight-bolder: bolder !default;\n\n$font-weight-base: $font-weight-normal !default;\n\n$line-height-base: 1.5 !default;\n$line-height-sm: 1.25 !default;\n$line-height-lg: 2 !default;\n\n$h1-font-size: $font-size-base * 2.5 !default;\n$h2-font-size: $font-size-base * 2 !default;\n$h3-font-size: $font-size-base * 1.75 !default;\n$h4-font-size: $font-size-base * 1.5 !default;\n$h5-font-size: $font-size-base * 1.25 !default;\n$h6-font-size: $font-size-base !default;\n// scss-docs-end font-variables\n\n// scss-docs-start font-sizes\n$font-sizes: (\n 1: $h1-font-size,\n 2: $h2-font-size,\n 3: $h3-font-size,\n 4: $h4-font-size,\n 5: $h5-font-size,\n 6: $h6-font-size\n) !default;\n// scss-docs-end font-sizes\n\n// scss-docs-start headings-variables\n$headings-margin-bottom: $spacer * .5 !default;\n$headings-font-family: null !default;\n$headings-font-style: null !default;\n$headings-font-weight: 500 !default;\n$headings-line-height: 1.2 !default;\n$headings-color: null !default;\n// scss-docs-end headings-variables\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n 1: 5rem,\n 2: 4.5rem,\n 3: 4rem,\n 4: 3.5rem,\n 5: 3rem,\n 6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n// scss-docs-start type-variables\n$lead-font-size: $font-size-base * 1.25 !default;\n$lead-font-weight: 300 !default;\n\n$small-font-size: .875em !default;\n\n$sub-sup-font-size: .75em !default;\n\n$text-muted: $gray-600 !default;\n\n$initialism-font-size: $small-font-size !default;\n\n$blockquote-margin-y: $spacer !default;\n$blockquote-font-size: $font-size-base * 1.25 !default;\n$blockquote-footer-color: $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y: $spacer !default;\n$hr-color: inherit !default;\n$hr-height: $border-width !default;\n$hr-opacity: .25 !default;\n\n$legend-margin-bottom: .5rem !default;\n$legend-font-size: 1.5rem !default;\n$legend-font-weight: null !default;\n\n$mark-padding: .2em !default;\n\n$dt-font-weight: $font-weight-bold !default;\n\n$nested-kbd-font-weight: $font-weight-bold !default;\n\n$list-inline-padding: .5rem !default;\n\n$mark-bg: #fcf8e3 !default;\n// scss-docs-end type-variables\n\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n\n// scss-docs-start table-variables\n$table-cell-padding-y: .5rem !default;\n$table-cell-padding-x: .5rem !default;\n$table-cell-padding-y-sm: .25rem !default;\n$table-cell-padding-x-sm: .25rem !default;\n\n$table-cell-vertical-align: top !default;\n\n$table-color: $body-color !default;\n$table-bg: transparent !default;\n$table-accent-bg: transparent !default;\n\n$table-th-font-weight: null !default;\n\n$table-striped-color: $table-color !default;\n$table-striped-bg-factor: .05 !default;\n$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color: $table-color !default;\n$table-active-bg-factor: .1 !default;\n$table-active-bg: rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color: $table-color !default;\n$table-hover-bg-factor: .075 !default;\n$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor: .1 !default;\n$table-border-width: $border-width !default;\n$table-border-color: $border-color !default;\n\n$table-striped-order: odd !default;\n\n$table-group-separator-color: currentColor !default;\n\n$table-caption-color: $text-muted !default;\n\n$table-bg-scale: -80% !default;\n// scss-docs-end table-variables\n\n// scss-docs-start table-loop\n$table-variants: (\n \"primary\": shift-color($primary, $table-bg-scale),\n \"secondary\": shift-color($secondary, $table-bg-scale),\n \"success\": shift-color($success, $table-bg-scale),\n \"info\": shift-color($info, $table-bg-scale),\n \"warning\": shift-color($warning, $table-bg-scale),\n \"danger\": shift-color($danger, $table-bg-scale),\n \"light\": $light,\n \"dark\": $dark,\n) !default;\n// scss-docs-end table-loop\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n// scss-docs-start input-btn-variables\n$input-btn-padding-y: .375rem !default;\n$input-btn-padding-x: .75rem !default;\n$input-btn-font-family: null !default;\n$input-btn-font-size: $font-size-base !default;\n$input-btn-line-height: $line-height-base !default;\n\n$input-btn-focus-width: .25rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-blur: 0 !default;\n$input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm: .25rem !default;\n$input-btn-padding-x-sm: .5rem !default;\n$input-btn-font-size-sm: $font-size-sm !default;\n\n$input-btn-padding-y-lg: .5rem !default;\n$input-btn-padding-x-lg: 1rem !default;\n$input-btn-font-size-lg: $font-size-lg !default;\n\n$input-btn-border-width: $border-width !default;\n// scss-docs-end input-btn-variables\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n// scss-docs-start btn-variables\n$btn-padding-y: $input-btn-padding-y !default;\n$btn-padding-x: $input-btn-padding-x !default;\n$btn-font-family: $input-btn-font-family !default;\n$btn-font-size: $input-btn-font-size !default;\n$btn-line-height: $input-btn-line-height !default;\n$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-padding-y-sm: $input-btn-padding-y-sm !default;\n$btn-padding-x-sm: $input-btn-padding-x-sm !default;\n$btn-font-size-sm: $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg: $input-btn-padding-y-lg !default;\n$btn-padding-x-lg: $input-btn-padding-x-lg !default;\n$btn-font-size-lg: $input-btn-font-size-lg !default;\n\n$btn-border-width: $input-btn-border-width !default;\n\n$btn-font-weight: $font-weight-normal !default;\n$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;\n$btn-focus-width: $input-btn-focus-width !default;\n$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$btn-disabled-opacity: .65 !default;\n$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;\n\n$btn-link-color: $link-color !default;\n$btn-link-hover-color: $link-hover-color !default;\n$btn-link-disabled-color: $gray-600 !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: $border-radius !default;\n$btn-border-radius-sm: $border-radius-sm !default;\n$btn-border-radius-lg: $border-radius-lg !default;\n\n$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$btn-hover-bg-shade-amount: 15% !default;\n$btn-hover-bg-tint-amount: 15% !default;\n$btn-hover-border-shade-amount: 20% !default;\n$btn-hover-border-tint-amount: 10% !default;\n$btn-active-bg-shade-amount: 20% !default;\n$btn-active-bg-tint-amount: 20% !default;\n$btn-active-border-shade-amount: 25% !default;\n$btn-active-border-tint-amount: 10% !default;\n// scss-docs-end btn-variables\n\n\n// Forms\n\n// scss-docs-start form-text-variables\n$form-text-margin-top: .25rem !default;\n$form-text-font-size: $small-font-size !default;\n$form-text-font-style: null !default;\n$form-text-font-weight: null !default;\n$form-text-color: $text-muted !default;\n// scss-docs-end form-text-variables\n\n// scss-docs-start form-label-variables\n$form-label-margin-bottom: .5rem !default;\n$form-label-font-size: null !default;\n$form-label-font-style: null !default;\n$form-label-font-weight: null !default;\n$form-label-color: null !default;\n// scss-docs-end form-label-variables\n\n// scss-docs-start form-input-variables\n$input-padding-y: $input-btn-padding-y !default;\n$input-padding-x: $input-btn-padding-x !default;\n$input-font-family: $input-btn-font-family !default;\n$input-font-size: $input-btn-font-size !default;\n$input-font-weight: $font-weight-base !default;\n$input-line-height: $input-btn-line-height !default;\n\n$input-padding-y-sm: $input-btn-padding-y-sm !default;\n$input-padding-x-sm: $input-btn-padding-x-sm !default;\n$input-font-size-sm: $input-btn-font-size-sm !default;\n\n$input-padding-y-lg: $input-btn-padding-y-lg !default;\n$input-padding-x-lg: $input-btn-padding-x-lg !default;\n$input-font-size-lg: $input-btn-font-size-lg !default;\n\n$input-bg: $body-bg !default;\n$input-disabled-bg: $gray-200 !default;\n$input-disabled-border-color: null !default;\n\n$input-color: $body-color !default;\n$input-border-color: $gray-400 !default;\n$input-border-width: $input-btn-border-width !default;\n$input-box-shadow: $box-shadow-inset !default;\n\n$input-border-radius: $border-radius !default;\n$input-border-radius-sm: $border-radius-sm !default;\n$input-border-radius-lg: $border-radius-lg !default;\n\n$input-focus-bg: $input-bg !default;\n$input-focus-border-color: tint-color($component-active-bg, 50%) !default;\n$input-focus-color: $input-color !default;\n$input-focus-width: $input-btn-focus-width !default;\n$input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$input-placeholder-color: $gray-600 !default;\n$input-plaintext-color: $body-color !default;\n\n$input-height-border: $input-border-width * 2 !default;\n\n$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;\n$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;\n$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !default;\n\n$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;\n$input-height-sm: add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;\n$input-height-lg: add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;\n\n$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-color-width: 3rem !default;\n// scss-docs-end form-input-variables\n\n// scss-docs-start form-check-variables\n$form-check-input-width: 1em !default;\n$form-check-min-height: $font-size-base * $line-height-base !default;\n$form-check-padding-start: $form-check-input-width + .5em !default;\n$form-check-margin-bottom: .125rem !default;\n$form-check-label-color: null !default;\n$form-check-label-cursor: null !default;\n$form-check-transition: null !default;\n\n$form-check-input-active-filter: brightness(90%) !default;\n\n$form-check-input-bg: $input-bg !default;\n$form-check-input-border: 1px solid rgba($black, .25) !default;\n$form-check-input-border-radius: .25em !default;\n$form-check-radio-border-radius: 50% !default;\n$form-check-input-focus-border: $input-focus-border-color !default;\n$form-check-input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$form-check-input-checked-color: $component-active-color !default;\n$form-check-input-checked-bg-color: $component-active-bg !default;\n$form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-check-radio-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-indeterminate-color: $component-active-color !default;\n$form-check-input-indeterminate-bg-color: $component-active-bg !default;\n$form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-disabled-opacity: .5 !default;\n$form-check-label-disabled-opacity: $form-check-input-disabled-opacity !default;\n$form-check-btn-check-disabled-opacity: $btn-disabled-opacity !default;\n\n$form-check-inline-margin-end: 1rem !default;\n// scss-docs-end form-check-variables\n\n// scss-docs-start form-switch-variables\n$form-switch-color: rgba($black, .25) !default;\n$form-switch-width: 2em !default;\n$form-switch-padding-start: $form-switch-width + .5em !default;\n$form-switch-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-border-radius: $form-switch-width !default;\n$form-switch-transition: background-position .15s ease-in-out !default;\n\n$form-switch-focus-color: $input-focus-border-color !default;\n$form-switch-focus-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-switch-checked-color: $component-active-color !default;\n$form-switch-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-checked-bg-position: right center !default;\n// scss-docs-end form-switch-variables\n\n// scss-docs-start input-group-variables\n$input-group-addon-padding-y: $input-padding-y !default;\n$input-group-addon-padding-x: $input-padding-x !default;\n$input-group-addon-font-weight: $input-font-weight !default;\n$input-group-addon-color: $input-color !default;\n$input-group-addon-bg: $gray-200 !default;\n$input-group-addon-border-color: $input-border-color !default;\n// scss-docs-end input-group-variables\n\n// scss-docs-start form-select-variables\n$form-select-padding-y: $input-padding-y !default;\n$form-select-padding-x: $input-padding-x !default;\n$form-select-font-family: $input-font-family !default;\n$form-select-font-size: $input-font-size !default;\n$form-select-indicator-padding: $form-select-padding-x * 3 !default; // Extra padding for background-image\n$form-select-font-weight: $input-font-weight !default;\n$form-select-line-height: $input-line-height !default;\n$form-select-color: $input-color !default;\n$form-select-bg: $input-bg !default;\n$form-select-disabled-color: null !default;\n$form-select-disabled-bg: $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position: right $form-select-padding-x center !default;\n$form-select-bg-size: 16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color: $gray-800 !default;\n$form-select-indicator: url(\"data:image/svg+xml,\") !default;\n\n$form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default;\n$form-select-feedback-icon-position: center right $form-select-indicator-padding !default;\n$form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width: $input-border-width !default;\n$form-select-border-color: $input-border-color !default;\n$form-select-border-radius: $input-border-radius !default;\n$form-select-box-shadow: $box-shadow-inset !default;\n\n$form-select-focus-border-color: $input-focus-border-color !default;\n$form-select-focus-width: $input-focus-width !default;\n$form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focus-color !default;\n\n$form-select-padding-y-sm: $input-padding-y-sm !default;\n$form-select-padding-x-sm: $input-padding-x-sm !default;\n$form-select-font-size-sm: $input-font-size-sm !default;\n$form-select-border-radius-sm: $input-border-radius-sm !default;\n\n$form-select-padding-y-lg: $input-padding-y-lg !default;\n$form-select-padding-x-lg: $input-padding-x-lg !default;\n$form-select-font-size-lg: $input-font-size-lg !default;\n$form-select-border-radius-lg: $input-border-radius-lg !default;\n\n$form-select-transition: $input-transition !default;\n// scss-docs-end form-select-variables\n\n// scss-docs-start form-range-variables\n$form-range-track-width: 100% !default;\n$form-range-track-height: .5rem !default;\n$form-range-track-cursor: pointer !default;\n$form-range-track-bg: $gray-300 !default;\n$form-range-track-border-radius: 1rem !default;\n$form-range-track-box-shadow: $box-shadow-inset !default;\n\n$form-range-thumb-width: 1rem !default;\n$form-range-thumb-height: $form-range-thumb-width !default;\n$form-range-thumb-bg: $component-active-bg !default;\n$form-range-thumb-border: 0 !default;\n$form-range-thumb-border-radius: 1rem !default;\n$form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default;\n$form-range-thumb-disabled-bg: $gray-500 !default;\n$form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n// scss-docs-end form-range-variables\n\n// scss-docs-start form-file-variables\n$form-file-button-color: $input-color !default;\n$form-file-button-bg: $input-group-addon-bg !default;\n$form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default;\n// scss-docs-end form-file-variables\n\n// scss-docs-start form-floating-variables\n$form-floating-height: add(3.5rem, $input-height-border) !default;\n$form-floating-line-height: 1.25 !default;\n$form-floating-padding-x: $input-padding-x !default;\n$form-floating-padding-y: 1rem !default;\n$form-floating-input-padding-t: 1.625rem !default;\n$form-floating-input-padding-b: .625rem !default;\n$form-floating-label-opacity: .65 !default;\n$form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default;\n$form-floating-transition: opacity .1s ease-in-out, transform .1s ease-in-out !default;\n// scss-docs-end form-floating-variables\n\n// Form validation\n\n// scss-docs-start form-feedback-variables\n$form-feedback-margin-top: $form-text-margin-top !default;\n$form-feedback-font-size: $form-text-font-size !default;\n$form-feedback-font-style: $form-text-font-style !default;\n$form-feedback-valid-color: $success !default;\n$form-feedback-invalid-color: $danger !default;\n\n$form-feedback-icon-valid-color: $form-feedback-valid-color !default;\n$form-feedback-icon-valid: url(\"data:image/svg+xml,\") !default;\n$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end form-feedback-variables\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n \"valid\": (\n \"color\": $form-feedback-valid-color,\n \"icon\": $form-feedback-icon-valid\n ),\n \"invalid\": (\n \"color\": $form-feedback-invalid-color,\n \"icon\": $form-feedback-icon-invalid\n )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown: 1000 !default;\n$zindex-sticky: 1020 !default;\n$zindex-fixed: 1030 !default;\n$zindex-offcanvas-backdrop: 1040 !default;\n$zindex-offcanvas: 1045 !default;\n$zindex-modal-backdrop: 1050 !default;\n$zindex-modal: 1055 !default;\n$zindex-popover: 1070 !default;\n$zindex-tooltip: 1080 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n// scss-docs-start nav-variables\n$nav-link-padding-y: .5rem !default;\n$nav-link-padding-x: 1rem !default;\n$nav-link-font-size: null !default;\n$nav-link-font-weight: null !default;\n$nav-link-color: $link-color !default;\n$nav-link-hover-color: $link-hover-color !default;\n$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color: $gray-600 !default;\n\n$nav-tabs-border-color: $gray-300 !default;\n$nav-tabs-border-width: $border-width !default;\n$nav-tabs-border-radius: $border-radius !default;\n$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color: $gray-700 !default;\n$nav-tabs-link-active-bg: $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius: $border-radius !default;\n$nav-pills-link-active-color: $component-active-color !default;\n$nav-pills-link-active-bg: $component-active-bg !default;\n// scss-docs-end nav-variables\n\n\n// Navbar\n\n// scss-docs-start navbar-variables\n$navbar-padding-y: $spacer * .5 !default;\n$navbar-padding-x: null !default;\n\n$navbar-nav-link-padding-x: .5rem !default;\n\n$navbar-brand-font-size: $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default;\n$navbar-brand-margin-end: 1rem !default;\n\n$navbar-toggler-padding-y: .25rem !default;\n$navbar-toggler-padding-x: .75rem !default;\n$navbar-toggler-font-size: $font-size-lg !default;\n$navbar-toggler-border-radius: $btn-border-radius !default;\n$navbar-toggler-focus-width: $btn-focus-width !default;\n$navbar-toggler-transition: box-shadow .15s ease-in-out !default;\n// scss-docs-end navbar-variables\n\n// scss-docs-start navbar-theme-variables\n$navbar-dark-color: rgba($white, .55) !default;\n$navbar-dark-hover-color: rgba($white, .75) !default;\n$navbar-dark-active-color: $white !default;\n$navbar-dark-disabled-color: rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-dark-toggler-border-color: rgba($white, .1) !default;\n\n$navbar-light-color: rgba($black, .55) !default;\n$navbar-light-hover-color: rgba($black, .7) !default;\n$navbar-light-active-color: rgba($black, .9) !default;\n$navbar-light-disabled-color: rgba($black, .3) !default;\n$navbar-light-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-light-toggler-border-color: rgba($black, .1) !default;\n\n$navbar-light-brand-color: $navbar-light-active-color !default;\n$navbar-light-brand-hover-color: $navbar-light-active-color !default;\n$navbar-dark-brand-color: $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;\n// scss-docs-end navbar-theme-variables\n\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n// scss-docs-start dropdown-variables\n$dropdown-min-width: 10rem !default;\n$dropdown-padding-x: 0 !default;\n$dropdown-padding-y: .5rem !default;\n$dropdown-spacer: .125rem !default;\n$dropdown-font-size: $font-size-base !default;\n$dropdown-color: $body-color !default;\n$dropdown-bg: $white !default;\n$dropdown-border-color: rgba($black, .15) !default;\n$dropdown-border-radius: $border-radius !default;\n$dropdown-border-width: $border-width !default;\n$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-divider-bg: $dropdown-border-color !default;\n$dropdown-divider-margin-y: $spacer * .5 !default;\n$dropdown-box-shadow: $box-shadow !default;\n\n$dropdown-link-color: $gray-900 !default;\n$dropdown-link-hover-color: shade-color($dropdown-link-color, 10%) !default;\n$dropdown-link-hover-bg: $gray-200 !default;\n\n$dropdown-link-active-color: $component-active-color !default;\n$dropdown-link-active-bg: $component-active-bg !default;\n\n$dropdown-link-disabled-color: $gray-500 !default;\n\n$dropdown-item-padding-y: $spacer * .25 !default;\n$dropdown-item-padding-x: $spacer !default;\n\n$dropdown-header-color: $gray-600 !default;\n$dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default;\n// scss-docs-end dropdown-variables\n\n// scss-docs-start dropdown-dark-variables\n$dropdown-dark-color: $gray-300 !default;\n$dropdown-dark-bg: $gray-800 !default;\n$dropdown-dark-border-color: $dropdown-border-color !default;\n$dropdown-dark-divider-bg: $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow: null !default;\n$dropdown-dark-link-color: $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color: $white !default;\n$dropdown-dark-link-hover-bg: rgba($white, .15) !default;\n$dropdown-dark-link-active-color: $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color: $gray-500 !default;\n// scss-docs-end dropdown-dark-variables\n\n\n// Pagination\n\n// scss-docs-start pagination-variables\n$pagination-padding-y: .375rem !default;\n$pagination-padding-x: .75rem !default;\n$pagination-padding-y-sm: .25rem !default;\n$pagination-padding-x-sm: .5rem !default;\n$pagination-padding-y-lg: .75rem !default;\n$pagination-padding-x-lg: 1.5rem !default;\n\n$pagination-color: $link-color !default;\n$pagination-bg: $white !default;\n$pagination-border-width: $border-width !default;\n$pagination-border-radius: $border-radius !default;\n$pagination-margin-start: -$pagination-border-width !default;\n$pagination-border-color: $gray-300 !default;\n\n$pagination-focus-color: $link-hover-color !default;\n$pagination-focus-bg: $gray-200 !default;\n$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$pagination-focus-outline: 0 !default;\n\n$pagination-hover-color: $link-hover-color !default;\n$pagination-hover-bg: $gray-200 !default;\n$pagination-hover-border-color: $gray-300 !default;\n\n$pagination-active-color: $component-active-color !default;\n$pagination-active-bg: $component-active-bg !default;\n$pagination-active-border-color: $pagination-active-bg !default;\n\n$pagination-disabled-color: $gray-600 !default;\n$pagination-disabled-bg: $white !default;\n$pagination-disabled-border-color: $gray-300 !default;\n\n$pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$pagination-border-radius-sm: $border-radius-sm !default;\n$pagination-border-radius-lg: $border-radius-lg !default;\n// scss-docs-end pagination-variables\n\n\n// Placeholders\n\n// scss-docs-start placeholders\n$placeholder-opacity-max: .5 !default;\n$placeholder-opacity-min: .2 !default;\n// scss-docs-end placeholders\n\n// Cards\n\n// scss-docs-start card-variables\n$card-spacer-y: $spacer !default;\n$card-spacer-x: $spacer !default;\n$card-title-spacer-y: $spacer * .5 !default;\n$card-border-width: $border-width !default;\n$card-border-color: rgba($black, .125) !default;\n$card-border-radius: $border-radius !default;\n$card-box-shadow: null !default;\n$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y: $card-spacer-y * .5 !default;\n$card-cap-padding-x: $card-spacer-x !default;\n$card-cap-bg: rgba($black, .03) !default;\n$card-cap-color: null !default;\n$card-height: null !default;\n$card-color: null !default;\n$card-bg: $white !default;\n$card-img-overlay-padding: $spacer !default;\n$card-group-margin: $grid-gutter-width * .5 !default;\n// scss-docs-end card-variables\n\n// Accordion\n\n// scss-docs-start accordion-variables\n$accordion-padding-y: 1rem !default;\n$accordion-padding-x: 1.25rem !default;\n$accordion-color: $body-color !default;\n$accordion-bg: $body-bg !default;\n$accordion-border-width: $border-width !default;\n$accordion-border-color: rgba($black, .125) !default;\n$accordion-border-radius: $border-radius !default;\n$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;\n\n$accordion-body-padding-y: $accordion-padding-y !default;\n$accordion-body-padding-x: $accordion-padding-x !default;\n\n$accordion-button-padding-y: $accordion-padding-y !default;\n$accordion-button-padding-x: $accordion-padding-x !default;\n$accordion-button-color: $accordion-color !default;\n$accordion-button-bg: $accordion-bg !default;\n$accordion-transition: $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg: tint-color($component-active-bg, 90%) !default;\n$accordion-button-active-color: shade-color($primary, 10%) !default;\n\n$accordion-button-focus-border-color: $input-focus-border-color !default;\n$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;\n\n$accordion-icon-width: 1.25rem !default;\n$accordion-icon-color: $accordion-button-color !default;\n$accordion-icon-active-color: $accordion-button-active-color !default;\n$accordion-icon-transition: transform .2s ease-in-out !default;\n$accordion-icon-transform: rotate(-180deg) !default;\n\n$accordion-button-icon: url(\"data:image/svg+xml,\") !default;\n$accordion-button-active-icon: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end accordion-variables\n\n// Tooltips\n\n// scss-docs-start tooltip-variables\n$tooltip-font-size: $font-size-sm !default;\n$tooltip-max-width: 200px !default;\n$tooltip-color: $white !default;\n$tooltip-bg: $black !default;\n$tooltip-border-radius: $border-radius !default;\n$tooltip-opacity: .9 !default;\n$tooltip-padding-y: $spacer * .25 !default;\n$tooltip-padding-x: $spacer * .5 !default;\n$tooltip-margin: 0 !default;\n\n$tooltip-arrow-width: .8rem !default;\n$tooltip-arrow-height: .4rem !default;\n$tooltip-arrow-color: $tooltip-bg !default;\n// scss-docs-end tooltip-variables\n\n// Form tooltips must come after regular tooltips\n// scss-docs-start tooltip-feedback-variables\n$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size: $tooltip-font-size !default;\n$form-feedback-tooltip-line-height: null !default;\n$form-feedback-tooltip-opacity: $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n// scss-docs-end tooltip-feedback-variables\n\n\n// Popovers\n\n// scss-docs-start popover-variables\n$popover-font-size: $font-size-sm !default;\n$popover-bg: $white !default;\n$popover-max-width: 276px !default;\n$popover-border-width: $border-width !default;\n$popover-border-color: rgba($black, .2) !default;\n$popover-border-radius: $border-radius-lg !default;\n$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow: $box-shadow !default;\n\n$popover-header-bg: shade-color($popover-bg, 6%) !default;\n$popover-header-color: $headings-color !default;\n$popover-header-padding-y: .5rem !default;\n$popover-header-padding-x: $spacer !default;\n\n$popover-body-color: $body-color !default;\n$popover-body-padding-y: $spacer !default;\n$popover-body-padding-x: $spacer !default;\n\n$popover-arrow-width: 1rem !default;\n$popover-arrow-height: .5rem !default;\n$popover-arrow-color: $popover-bg !default;\n\n$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;\n// scss-docs-end popover-variables\n\n\n// Toasts\n\n// scss-docs-start toast-variables\n$toast-max-width: 350px !default;\n$toast-padding-x: .75rem !default;\n$toast-padding-y: .5rem !default;\n$toast-font-size: .875rem !default;\n$toast-color: null !default;\n$toast-background-color: rgba($white, .85) !default;\n$toast-border-width: 1px !default;\n$toast-border-color: rgba($black, .1) !default;\n$toast-border-radius: $border-radius !default;\n$toast-box-shadow: $box-shadow !default;\n$toast-spacing: $container-padding-x !default;\n\n$toast-header-color: $gray-600 !default;\n$toast-header-background-color: rgba($white, .85) !default;\n$toast-header-border-color: rgba($black, .05) !default;\n// scss-docs-end toast-variables\n\n\n// Badges\n\n// scss-docs-start badge-variables\n$badge-font-size: .75em !default;\n$badge-font-weight: $font-weight-bold !default;\n$badge-color: $white !default;\n$badge-padding-y: .35em !default;\n$badge-padding-x: .65em !default;\n$badge-border-radius: $border-radius !default;\n// scss-docs-end badge-variables\n\n\n// Modals\n\n// scss-docs-start modal-variables\n$modal-inner-padding: $spacer !default;\n\n$modal-footer-margin-between: .5rem !default;\n\n$modal-dialog-margin: .5rem !default;\n$modal-dialog-margin-y-sm-up: 1.75rem !default;\n\n$modal-title-line-height: $line-height-base !default;\n\n$modal-content-color: null !default;\n$modal-content-bg: $white !default;\n$modal-content-border-color: rgba($black, .2) !default;\n$modal-content-border-width: $border-width !default;\n$modal-content-border-radius: $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs: $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up: $box-shadow !default;\n\n$modal-backdrop-bg: $black !default;\n$modal-backdrop-opacity: .5 !default;\n$modal-header-border-color: $border-color !default;\n$modal-footer-border-color: $modal-header-border-color !default;\n$modal-header-border-width: $modal-content-border-width !default;\n$modal-footer-border-width: $modal-header-border-width !default;\n$modal-header-padding-y: $modal-inner-padding !default;\n$modal-header-padding-x: $modal-inner-padding !default;\n$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-sm: 300px !default;\n$modal-md: 500px !default;\n$modal-lg: 800px !default;\n$modal-xl: 1140px !default;\n\n$modal-fade-transform: translate(0, -50px) !default;\n$modal-show-transform: none !default;\n$modal-transition: transform .3s ease-out !default;\n$modal-scale-transform: scale(1.02) !default;\n// scss-docs-end modal-variables\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n// scss-docs-start alert-variables\n$alert-padding-y: $spacer !default;\n$alert-padding-x: $spacer !default;\n$alert-margin-bottom: 1rem !default;\n$alert-border-radius: $border-radius !default;\n$alert-link-font-weight: $font-weight-bold !default;\n$alert-border-width: $border-width !default;\n$alert-bg-scale: -80% !default;\n$alert-border-scale: -70% !default;\n$alert-color-scale: 40% !default;\n$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n// scss-docs-end alert-variables\n\n\n// Progress bars\n\n// scss-docs-start progress-variables\n$progress-height: 1rem !default;\n$progress-font-size: $font-size-base * .75 !default;\n$progress-bg: $gray-200 !default;\n$progress-border-radius: $border-radius !default;\n$progress-box-shadow: $box-shadow-inset !default;\n$progress-bar-color: $white !default;\n$progress-bar-bg: $primary !default;\n$progress-bar-animation-timing: 1s linear infinite !default;\n$progress-bar-transition: width .6s ease !default;\n// scss-docs-end progress-variables\n\n\n// List group\n\n// scss-docs-start list-group-variables\n$list-group-color: $gray-900 !default;\n$list-group-bg: $white !default;\n$list-group-border-color: rgba($black, .125) !default;\n$list-group-border-width: $border-width !default;\n$list-group-border-radius: $border-radius !default;\n\n$list-group-item-padding-y: $spacer * .5 !default;\n$list-group-item-padding-x: $spacer !default;\n$list-group-item-bg-scale: -80% !default;\n$list-group-item-color-scale: 40% !default;\n\n$list-group-hover-bg: $gray-100 !default;\n$list-group-active-color: $component-active-color !default;\n$list-group-active-bg: $component-active-bg !default;\n$list-group-active-border-color: $list-group-active-bg !default;\n\n$list-group-disabled-color: $gray-600 !default;\n$list-group-disabled-bg: $list-group-bg !default;\n\n$list-group-action-color: $gray-700 !default;\n$list-group-action-hover-color: $list-group-action-color !default;\n\n$list-group-action-active-color: $body-color !default;\n$list-group-action-active-bg: $gray-200 !default;\n// scss-docs-end list-group-variables\n\n\n// Image thumbnails\n\n// scss-docs-start thumbnail-variables\n$thumbnail-padding: .25rem !default;\n$thumbnail-bg: $body-bg !default;\n$thumbnail-border-width: $border-width !default;\n$thumbnail-border-color: $gray-300 !default;\n$thumbnail-border-radius: $border-radius !default;\n$thumbnail-box-shadow: $box-shadow-sm !default;\n// scss-docs-end thumbnail-variables\n\n\n// Figures\n\n// scss-docs-start figure-variables\n$figure-caption-font-size: $small-font-size !default;\n$figure-caption-color: $gray-600 !default;\n// scss-docs-end figure-variables\n\n\n// Breadcrumbs\n\n// scss-docs-start breadcrumb-variables\n$breadcrumb-font-size: null !default;\n$breadcrumb-padding-y: 0 !default;\n$breadcrumb-padding-x: 0 !default;\n$breadcrumb-item-padding-x: .5rem !default;\n$breadcrumb-margin-bottom: 1rem !default;\n$breadcrumb-bg: null !default;\n$breadcrumb-divider-color: $gray-600 !default;\n$breadcrumb-active-color: $gray-600 !default;\n$breadcrumb-divider: quote(\"/\") !default;\n$breadcrumb-divider-flipped: $breadcrumb-divider !default;\n$breadcrumb-border-radius: null !default;\n// scss-docs-end breadcrumb-variables\n\n// Carousel\n\n// scss-docs-start carousel-variables\n$carousel-control-color: $white !default;\n$carousel-control-width: 15% !default;\n$carousel-control-opacity: .5 !default;\n$carousel-control-hover-opacity: .9 !default;\n$carousel-control-transition: opacity .15s ease !default;\n\n$carousel-indicator-width: 30px !default;\n$carousel-indicator-height: 3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer: 3px !default;\n$carousel-indicator-opacity: .5 !default;\n$carousel-indicator-active-bg: $white !default;\n$carousel-indicator-active-opacity: 1 !default;\n$carousel-indicator-transition: opacity .6s ease !default;\n\n$carousel-caption-width: 70% !default;\n$carousel-caption-color: $white !default;\n$carousel-caption-padding-y: 1.25rem !default;\n$carousel-caption-spacer: 1.25rem !default;\n\n$carousel-control-icon-width: 2rem !default;\n\n$carousel-control-prev-icon-bg: url(\"data:image/svg+xml,\") !default;\n$carousel-control-next-icon-bg: url(\"data:image/svg+xml,\") !default;\n\n$carousel-transition-duration: .6s !default;\n$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg: $black !default;\n$carousel-dark-caption-color: $black !default;\n$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;\n// scss-docs-end carousel-variables\n\n\n// Spinners\n\n// scss-docs-start spinner-variables\n$spinner-width: 2rem !default;\n$spinner-height: $spinner-width !default;\n$spinner-vertical-align: -.125em !default;\n$spinner-border-width: .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm: 1rem !default;\n$spinner-height-sm: $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n// scss-docs-end spinner-variables\n\n\n// Close\n\n// scss-docs-start close-variables\n$btn-close-width: 1em !default;\n$btn-close-height: $btn-close-width !default;\n$btn-close-padding-x: .25em !default;\n$btn-close-padding-y: $btn-close-padding-x !default;\n$btn-close-color: $black !default;\n$btn-close-bg: url(\"data:image/svg+xml,\") !default;\n$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;\n$btn-close-opacity: .5 !default;\n$btn-close-hover-opacity: .75 !default;\n$btn-close-focus-opacity: 1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;\n// scss-docs-end close-variables\n\n\n// Offcanvas\n\n// scss-docs-start offcanvas-variables\n$offcanvas-padding-y: $modal-inner-padding !default;\n$offcanvas-padding-x: $modal-inner-padding !default;\n$offcanvas-horizontal-width: 400px !default;\n$offcanvas-vertical-height: 30vh !default;\n$offcanvas-transition-duration: .3s !default;\n$offcanvas-border-color: $modal-content-border-color !default;\n$offcanvas-border-width: $modal-content-border-width !default;\n$offcanvas-title-line-height: $modal-title-line-height !default;\n$offcanvas-bg-color: $modal-content-bg !default;\n$offcanvas-color: $modal-content-color !default;\n$offcanvas-box-shadow: $modal-content-box-shadow-xs !default;\n$offcanvas-backdrop-bg: $modal-backdrop-bg !default;\n$offcanvas-backdrop-opacity: $modal-backdrop-opacity !default;\n// scss-docs-end offcanvas-variables\n\n// Code\n\n$code-font-size: $small-font-size !default;\n$code-color: $pink !default;\n\n$kbd-padding-y: .2rem !default;\n$kbd-padding-x: .4rem !default;\n$kbd-font-size: $code-font-size !default;\n$kbd-color: $white !default;\n$kbd-bg: $gray-900 !default;\n\n$pre-color: null !default;\n", + "@import \"../bootstrap/functions\";\n@import \"../bootstrap/variables\";\n@import \"../bootstrap/maps\";\n@import \"../bootstrap/utilities\";\n\n$utilities: (\n // scss-docs-start utils-vertical-align\n \"align\": (\n property: vertical-align,\n class: align,\n values: baseline top middle bottom text-bottom text-top\n ),\n // scss-docs-end utils-vertical-align\n // scss-docs-start utils-float\n \"float\": (\n responsive: true,\n property: float,\n values: (\n start: left,\n end: right,\n none: none,\n )\n ),\n // scss-docs-end utils-float\n // scss-docs-start utils-overflow\n \"overflow\": (\n property: overflow,\n values: auto hidden visible scroll,\n ),\n // scss-docs-end utils-overflow\n // scss-docs-start utils-display\n \"display\": (\n responsive: true,\n print: true,\n property: display,\n class: d,\n values: inline inline-block block grid table table-row table-cell flex inline-flex none\n ),\n // scss-docs-end utils-display\n // scss-docs-start utils-shadow\n \"shadow\": (\n property: box-shadow,\n class: shadow,\n values: (\n null: $box-shadow,\n xs: $box-shadow-xs,\n sm: $box-shadow-sm,\n md: $box-shadow,\n lg: $box-shadow-lg,\n xl: $box-shadow-xl,\n none: none,\n )\n ),\n // scss-docs-end utils-shadow\n // scss-docs-start utils-position\n \"position\": (\n property: position,\n values: static relative absolute fixed sticky\n ),\n \"top\": (\n property: top,\n values: $position-values\n ),\n \"bottom\": (\n property: bottom,\n values: $position-values\n ),\n \"start\": (\n property: left,\n class: start,\n values: $position-values\n ),\n \"end\": (\n property: right,\n class: end,\n values: $position-values\n ),\n \"translate-middle\": (\n property: transform,\n class: translate-middle,\n values: (\n null: translate(-50%, -50%),\n x: translateX(-50%),\n y: translateY(-50%),\n )\n ),\n //Scale\n \"transform\": (\n property: transform,\n class: transform-scale,\n responsive: true,\n values: (\n 5: scale(.5),\n 6: scale(.6),\n 7: scale(.7),\n 8: scale(.8),\n 9: scale(.9),\n 10: scale(1),\n )\n ),\n // scss-docs-end utils-position\n // scss-docs-start utils-borders\n \"border\": (\n property: border,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-top\": (\n property: border-top,\n responsive: true,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-end\": (\n property: border-right,\n responsive: true,\n class: border-end,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-bottom\": (\n property: border-bottom,\n responsive: true,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-start\": (\n property: border-left,\n responsive: true,\n class: border-start,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-color\": (\n property: border-color,\n class: border,\n values: map-merge($theme-colors, (\"white\": $white))\n ),\n \"border-width\": (\n property: border-width,\n class: border,\n values: $border-widths\n ),\n // scss-docs-end utils-borders\n // Sizing utilities\n // scss-docs-start utils-sizing\n \"width\": (\n property: width,\n responsive: true,\n class: w,\n values: $width\n ),\n \"max-width\": (\n property: max-width,\n class: mw,\n values: (100: 100%)\n ),\n \"viewport-width\": (\n property: width,\n class: vw,\n values: (100: 100vw)\n ),\n \"min-viewport-width\": (\n property: min-width,\n class: min-vw,\n values: (100: 100vw)\n ),\n \"height\": (\n property: height,\n class: h,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-height\": (\n property: max-height,\n class: mh,\n values: (100: 100%)\n ),\n \"viewport-height\": (\n property: height,\n class: vh,\n values: (100: 100vh)\n ),\n \"min-viewport-height\": (\n property: min-height,\n class: min-vh,\n values: (\n 25: $section-height-25-min-height,\n 35: $section-height-35-min-height,\n 45: $section-height-45-min-height,\n 50: $section-height-50-min-height,\n 55: $section-height-55-min-height,\n 65: $section-height-65-min-height,\n 70: $section-height-70-min-height,\n 75: $section-height-75-min-height,\n 80: $section-height-80-min-height,\n 85: $section-height-85-min-height,\n 90: $section-height-90-min-height,\n 95: $section-height-95-min-height,\n 100: 100vh\n )\n ),\n // scss-docs-end utils-sizing\n // Flex utilities\n // scss-docs-start utils-flex\n \"flex\": (\n responsive: true,\n property: flex,\n values: (fill: 1 1 auto)\n ),\n \"flex-direction\": (\n responsive: true,\n property: flex-direction,\n class: flex,\n values: row column row-reverse column-reverse\n ),\n \"flex-grow\": (\n responsive: true,\n property: flex-grow,\n class: flex,\n values: (\n grow-0: 0,\n grow-1: 1,\n )\n ),\n \"flex-shrink\": (\n responsive: true,\n property: flex-shrink,\n class: flex,\n values: (\n shrink-0: 0,\n shrink-1: 1,\n )\n ),\n \"flex-wrap\": (\n responsive: true,\n property: flex-wrap,\n class: flex,\n values: wrap nowrap wrap-reverse\n ),\n \"gap\": (\n responsive: true,\n property: gap,\n class: gap,\n values: $spacers\n ),\n \"justify-content\": (\n responsive: true,\n property: justify-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n evenly: space-evenly,\n )\n ),\n \"align-items\": (\n responsive: true,\n property: align-items,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"align-content\": (\n responsive: true,\n property: align-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n stretch: stretch,\n )\n ),\n \"align-self\": (\n responsive: true,\n property: align-self,\n values: (\n auto: auto,\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"order\": (\n responsive: true,\n property: order,\n values: (\n first: -1,\n 0: 0,\n 1: 1,\n 2: 2,\n 3: 3,\n 4: 4,\n 5: 5,\n last: 6,\n ),\n ),\n // scss-docs-end utils-flex\n // Margin utilities\n // scss-docs-start utils-spacing\n \"margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: map-merge($spacers, (auto: auto))\n ),\n // Negative margin utilities\n \"negative-margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: $negative-spacers\n ),\n \"negative-margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: $negative-spacers\n ),\n \"negative-margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: $negative-spacers\n ),\n \"negative-margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: $negative-spacers\n ),\n \"negative-margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: $negative-spacers\n ),\n \"negative-margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: $negative-spacers\n ),\n \"negative-margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: $negative-spacers\n ),\n // Padding utilities\n \"padding\": (\n responsive: true,\n property: padding,\n class: p,\n values: $spacers\n ),\n \"padding-x\": (\n responsive: true,\n property: padding-right padding-left,\n class: px,\n values: $spacers\n ),\n \"padding-y\": (\n responsive: true,\n property: padding-top padding-bottom,\n class: py,\n values: $spacers\n ),\n \"padding-top\": (\n responsive: true,\n property: padding-top,\n class: pt,\n values: $spacers\n ),\n \"padding-end\": (\n responsive: true,\n property: padding-right,\n class: pe,\n values: $spacers\n ),\n \"padding-bottom\": (\n responsive: true,\n property: padding-bottom,\n class: pb,\n values: $spacers\n ),\n \"padding-start\": (\n responsive: true,\n property: padding-left,\n class: ps,\n values: $spacers\n ),\n // scss-docs-end utils-spacing\n // Text\n // scss-docs-start utils-text\n \"font-family\": (\n property: font-family,\n class: font,\n values: (monospace: var(--#{$prefix}font-monospace))\n ),\n \"font-size\": (\n rfs: true,\n property: font-size,\n class: fs,\n values: $font-sizes\n ),\n \"font-style\": (\n property: font-style,\n class: fst,\n values: italic normal\n ),\n \"font-weight\": (\n property: font-weight,\n class: fw,\n values: (\n light: $font-weight-light,\n lighter: $font-weight-lighter,\n normal: $font-weight-normal,\n bold: $font-weight-bold,\n bolder: $font-weight-bolder\n )\n ),\n \"line-height\": (\n property: line-height,\n class: lh,\n values: (\n 1: 1,\n sm: $line-height-sm,\n base: $line-height-base,\n lg: $line-height-lg,\n )\n ),\n \"text-align\": (\n responsive: true,\n property: text-align,\n class: text,\n values: (\n start: left,\n end: right,\n center: center,\n )\n ),\n \"text-decoration\": (\n property: text-decoration,\n values: none underline line-through\n ),\n \"text-transform\": (\n property: text-transform,\n class: text,\n values: lowercase uppercase capitalize\n ),\n \"white-space\": (\n property: white-space,\n class: text,\n values: (\n wrap: normal,\n nowrap: nowrap,\n )\n ),\n \"word-wrap\": (\n property: word-wrap word-break,\n class: text,\n values: (break: break-word),\n rtl: false\n ),\n // scss-docs-end utils-text\n // scss-docs-start utils-color\n \"color\": (\n property: color,\n class: text,\n values: map-merge(\n $theme-colors,\n (\n \"white\": $white,\n \"body\": $body-color,\n \"muted\": $text-muted,\n \"black-50\": rgba($black, .5),\n \"white-50\": rgba($white, .5),\n \"reset\": inherit,\n )\n )\n ),\n // scss-docs-end utils-color\n // scss-docs-start utils-bg-color\n \"background-color\": (\n property: background-color,\n class: bg,\n values: map-merge(\n $theme-colors,\n (\n \"body\": $body-bg,\n \"white\": $white,\n \"transparent\": transparent,\n \"gray-100\": $gray-100,\n \"gray-200\": $gray-200,\n \"gray-300\": $gray-300,\n \"gray-400\": $gray-400,\n \"gray-500\": $gray-500,\n \"gray-600\": $gray-600,\n \"gray-700\": $gray-700,\n \"gray-800\": $gray-800,\n \"gray-900\": $gray-900,\n )\n )\n ),\n // scss-docs-end utils-bg-color\n \"gradient\": (\n property: background-image,\n class: bg,\n values: (gradient: var(--#{$prefix}gradient))\n ),\n // scss-docs-start utils-interaction\n \"user-select\": (\n property: user-select,\n values: all auto none\n ),\n \"pointer-events\": (\n property: pointer-events,\n class: pe,\n values: none auto,\n ),\n // scss-docs-end utils-interaction\n // scss-docs-start utils-border-radius\n \"rounded\": (\n property: border-radius,\n class: rounded,\n values: (\n null: $border-radius,\n 0: 0,\n 1: $border-radius-sm,\n 2: $border-radius,\n 3: $border-radius-lg,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"rounded-top\": (\n property: border-top-left-radius border-top-right-radius,\n class: rounded-top,\n values: (null: $border-radius)\n ),\n \"rounded-end\": (\n property: border-top-right-radius border-bottom-right-radius,\n class: rounded-end,\n values: (null: $border-radius)\n ),\n \"rounded-bottom\": (\n property: border-bottom-right-radius border-bottom-left-radius,\n class: rounded-bottom,\n values: (null: $border-radius)\n ),\n \"rounded-start\": (\n property: border-bottom-left-radius border-top-left-radius,\n class: rounded-start,\n values: (null: $border-radius)\n ),\n // scss-docs-end utils-border-radius\n // scss-docs-start utils-visibility\n \"visibility\": (\n property: visibility,\n class: null,\n values: (\n visible: visible,\n invisible: hidden,\n )\n ),\n // Opacity utilities\n \"opacity\": (\n property: opacity,\n values: (\n 0: 0,\n 1: .1,\n 2: .2,\n 3: .3,\n 4: .4,\n 5: .5,\n 6: .6,\n 7: .7,\n 8: .8,\n 9: .9,\n 10: 1\n ),\n ),\n // Z-index utilities\n \"z-index\": (\n property: z-index,\n values: (\n 0: 0,\n 1: 1,\n 2: 2,\n 3: 3\n ),\n ),\n // Letter spacing utilities\n \"letter-spacing\": (\n property: letter-spacing,\n values: (\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n ),\n ),\n // Border radius utilities\n \"border-top-left-radius\": (\n property: border-top-left-radius,\n class: border-radius-top-start,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"border-top-right-radius\": (\n property: border-top-right-radius,\n class: border-radius-top-end,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"border-bottom-left-radius\": (\n property: border-bottom-left-radius,\n class: border-radius-bottom-start,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"border-bottom-right-radius\": (\n property: border-bottom-right-radius,\n class: border-radius-bottom-end,\n responsive: true,\n values: (\n null: $border-radius,\n 0: 0,\n sm: $border-radius-sm,\n md: $border-radius,\n lg: $border-radius-lg,\n xl: $border-radius-xl,\n 2xl: $border-radius-2xl,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n // Max Height Values\n \"max-height-px\": (\n property: max-height,\n class: max-height,\n values: (\n 100: $max-height-100,\n 150: $max-height-150,\n 160: $max-height-160,\n 200: $max-height-200,\n 250: $max-height-250,\n 300: $max-height-300,\n 400: $max-height-400,\n 500: $max-height-500,\n 600: $max-height-600\n )\n ),\n // Max Height Values vh\n \"max-height-vh\": (\n property: max-height,\n class: max-height-vh,\n values: (\n 10: $max-height-vh-10,\n 20: $max-height-vh-20,\n 30: $max-height-vh-30,\n 40: $max-height-vh-40,\n 50: $max-height-vh-50,\n 60: $max-height-vh-60,\n 70: $max-height-vh-70,\n 80: $max-height-vh-80,\n 90: $max-height-vh-90,\n 100: $max-height-vh-100,\n )\n ),\n // Min Height Values\n \"min-height-px\": (\n property: min-height,\n class: min-height,\n values: (\n 100: $min-height-100,\n 150: $min-height-150,\n 160: $min-height-160,\n 200: $min-height-200,\n 250: $min-height-250,\n 300: $min-height-300,\n 400: $min-height-400,\n 500: $min-height-500,\n 600: $min-height-600\n )\n ),\n // Height Values\n \"height-px\": (\n property: height,\n class: height,\n values: (\n 100: $height-100,\n 150: $height-150,\n 200: $height-200,\n 300: $height-300,\n 400: $height-400,\n 500: $height-500,\n 600: $height-600\n )\n ),\n // Max Width Values\n \"max-width-px\": (\n property: max-width,\n class: max-width,\n values: (\n 100: $max-width-100,\n 200: $max-width-200,\n 300: $max-width-300,\n 400: $max-width-400,\n 500: $max-width-500\n )\n ),\n);\n", + "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n $prev-key: null;\n $prev-num: null;\n @each $key, $num in $map {\n @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n // Do nothing\n } @else if not comparable($prev-num, $num) {\n @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n } @else if $prev-num >= $num {\n @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n }\n $prev-key: $key;\n $prev-num: $num;\n }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n @if length($map) > 0 {\n $values: map-values($map);\n $first-value: nth($values, 1);\n @if $first-value != 0 {\n @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n }\n }\n}\n\n// Colors\n@function to-rgb($value) {\n @return red($value), green($value), blue($value);\n}\n\n// stylelint-disable scss/dollar-variable-pattern\n@function rgba-css-var($identifier, $target) {\n @if $identifier == \"body\" and $target == \"bg\" {\n @return rgba(var(--#{$prefix}#{$identifier}-bg-rgb), var(--#{$prefix}#{$target}-opacity));\n } @if $identifier == \"body\" and $target == \"text\" {\n @return rgba(var(--#{$prefix}#{$identifier}-color-rgb), var(--#{$prefix}#{$target}-opacity));\n } @else {\n @return rgba(var(--#{$prefix}#{$identifier}-rgb), var(--#{$prefix}#{$target}-opacity));\n }\n}\n\n@function map-loop($map, $func, $args...) {\n $_map: ();\n\n @each $key, $value in $map {\n // allow to pass the $key and $value of the map as an function argument\n $_args: ();\n @each $arg in $args {\n $_args: append($_args, if($arg == \"$key\", $key, if($arg == \"$value\", $value, $arg)));\n }\n\n $_map: map-merge($_map, ($key: call(get-function($func), $_args...)));\n }\n\n @return $_map;\n}\n// stylelint-enable scss/dollar-variable-pattern\n\n@function varify($list) {\n $result: null;\n @each $entry in $list {\n $result: append($result, var(--#{$prefix}#{$entry}), space);\n }\n @return $result;\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n $result: ();\n @each $key, $value in $map {\n @if $key != 0 {\n $result: map-merge($result, (\"n\" + $key: (-$value)));\n }\n }\n @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n $result: ();\n @each $key, $value in $map {\n @if (index($values, $key) != null) {\n $result: map-merge($result, ($key: $value));\n }\n }\n @return $result;\n}\n\n// Merge multiple maps\n@function map-merge-multiple($maps...) {\n $merged-maps: ();\n\n @each $map in $maps {\n $merged-maps: map-merge($merged-maps, $map);\n }\n @return $merged-maps;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n $index: str-index($string, $search);\n\n @if $index {\n @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n }\n\n @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n @if str-index($string, \"data:image/svg+xml\") {\n @each $char, $encoded in $escaped-characters {\n // Do not escape the url brackets\n @if str-index($string, \"url(\") == 1 {\n $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n } @else {\n $string: str-replace($string, $char, $encoded);\n }\n }\n }\n\n @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n $max-ratio: 0;\n $max-ratio-color: null;\n\n @each $color in $foregrounds {\n $contrast-ratio: contrast-ratio($background, $color);\n @if $contrast-ratio > $min-contrast-ratio {\n @return $color;\n } @else if $contrast-ratio > $max-ratio {\n $max-ratio: $contrast-ratio;\n $max-ratio-color: $color;\n }\n }\n\n @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n $l1: luminance($background);\n $l2: luminance(opaque($background, $foreground));\n\n @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n $rgb: (\n \"r\": red($color),\n \"g\": green($color),\n \"b\": blue($color)\n );\n\n @each $name, $value in $rgb {\n $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));\n $rgb: map-merge($rgb, ($name: $value));\n }\n\n @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n @if $value1 == null {\n @return $value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 + $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n @if $value1 == null and $value2 == null {\n @return null;\n }\n\n @if $value1 == null {\n @return -$value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 - $value2;\n }\n\n @if type-of($value2) != number {\n $value2: unquote(\"(\") + $value2 + unquote(\")\");\n }\n\n @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n\n@function divide($dividend, $divisor, $precision: 10) {\n $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n $dividend: abs($dividend);\n $divisor: abs($divisor);\n @if $dividend == 0 {\n @return 0;\n }\n @if $divisor == 0 {\n @error \"Cannot divide by 0\";\n }\n $remainder: $dividend;\n $result: 0;\n $factor: 10;\n @while ($remainder > 0 and $precision >= 0) {\n $quotient: 0;\n @while ($remainder >= $divisor) {\n $remainder: $remainder - $divisor;\n $quotient: $quotient + 1;\n }\n $result: $result * 10 + $quotient;\n $factor: $factor * .1;\n $remainder: $remainder * 10;\n $precision: $precision - 1;\n @if ($precision < 0 and $remainder >= $divisor * 5) {\n $result: $result + 1;\n }\n }\n $result: $result * $factor * $sign;\n $dividend-unit: unit($dividend);\n $divisor-unit: unit($divisor);\n $unit-map: (\n \"px\": 1px,\n \"rem\": 1rem,\n \"em\": 1em,\n \"%\": 1%\n );\n @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n $result: $result * map-get($unit-map, $dividend-unit);\n }\n @return $result;\n}\n", + "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// Color system\n\n// scss-docs-start gray-color-variables\n$white: #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black: #000 !default;\n// scss-docs-end gray-color-variables\n\n// fusv-disable\n// scss-docs-start gray-colors-map\n$grays: (\n \"100\": $gray-100,\n \"200\": $gray-200,\n \"300\": $gray-300,\n \"400\": $gray-400,\n \"500\": $gray-500,\n \"600\": $gray-600,\n \"700\": $gray-700,\n \"800\": $gray-800,\n \"900\": $gray-900\n) !default;\n// scss-docs-end gray-colors-map\n// fusv-enable\n\n// scss-docs-start color-variables\n$blue: #0d6efd !default;\n$indigo: #6610f2 !default;\n$purple: #6f42c1 !default;\n$pink: #d63384 !default;\n$red: #dc3545 !default;\n$orange: #fd7e14 !default;\n$yellow: #ffc107 !default;\n$green: #198754 !default;\n$teal: #20c997 !default;\n$cyan: #0dcaf0 !default;\n// scss-docs-end color-variables\n\n// scss-docs-start colors-map\n$colors: (\n \"blue\": $blue,\n \"indigo\": $indigo,\n \"purple\": $purple,\n \"pink\": $pink,\n \"red\": $red,\n \"orange\": $orange,\n \"yellow\": $yellow,\n \"green\": $green,\n \"teal\": $teal,\n \"cyan\": $cyan,\n \"black\": $black,\n \"white\": $white,\n \"gray\": $gray-600,\n \"gray-dark\": $gray-800\n) !default;\n// scss-docs-end colors-map\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio: 4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark: $black !default;\n$color-contrast-light: $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 80%) !default;\n$blue-200: tint-color($blue, 60%) !default;\n$blue-300: tint-color($blue, 40%) !default;\n$blue-400: tint-color($blue, 20%) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 20%) !default;\n$blue-700: shade-color($blue, 40%) !default;\n$blue-800: shade-color($blue, 60%) !default;\n$blue-900: shade-color($blue, 80%) !default;\n\n$indigo-100: tint-color($indigo, 80%) !default;\n$indigo-200: tint-color($indigo, 60%) !default;\n$indigo-300: tint-color($indigo, 40%) !default;\n$indigo-400: tint-color($indigo, 20%) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 20%) !default;\n$indigo-700: shade-color($indigo, 40%) !default;\n$indigo-800: shade-color($indigo, 60%) !default;\n$indigo-900: shade-color($indigo, 80%) !default;\n\n$purple-100: tint-color($purple, 80%) !default;\n$purple-200: tint-color($purple, 60%) !default;\n$purple-300: tint-color($purple, 40%) !default;\n$purple-400: tint-color($purple, 20%) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 20%) !default;\n$purple-700: shade-color($purple, 40%) !default;\n$purple-800: shade-color($purple, 60%) !default;\n$purple-900: shade-color($purple, 80%) !default;\n\n$pink-100: tint-color($pink, 80%) !default;\n$pink-200: tint-color($pink, 60%) !default;\n$pink-300: tint-color($pink, 40%) !default;\n$pink-400: tint-color($pink, 20%) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 20%) !default;\n$pink-700: shade-color($pink, 40%) !default;\n$pink-800: shade-color($pink, 60%) !default;\n$pink-900: shade-color($pink, 80%) !default;\n\n$red-100: tint-color($red, 80%) !default;\n$red-200: tint-color($red, 60%) !default;\n$red-300: tint-color($red, 40%) !default;\n$red-400: tint-color($red, 20%) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 20%) !default;\n$red-700: shade-color($red, 40%) !default;\n$red-800: shade-color($red, 60%) !default;\n$red-900: shade-color($red, 80%) !default;\n\n$orange-100: tint-color($orange, 80%) !default;\n$orange-200: tint-color($orange, 60%) !default;\n$orange-300: tint-color($orange, 40%) !default;\n$orange-400: tint-color($orange, 20%) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 20%) !default;\n$orange-700: shade-color($orange, 40%) !default;\n$orange-800: shade-color($orange, 60%) !default;\n$orange-900: shade-color($orange, 80%) !default;\n\n$yellow-100: tint-color($yellow, 80%) !default;\n$yellow-200: tint-color($yellow, 60%) !default;\n$yellow-300: tint-color($yellow, 40%) !default;\n$yellow-400: tint-color($yellow, 20%) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 20%) !default;\n$yellow-700: shade-color($yellow, 40%) !default;\n$yellow-800: shade-color($yellow, 60%) !default;\n$yellow-900: shade-color($yellow, 80%) !default;\n\n$green-100: tint-color($green, 80%) !default;\n$green-200: tint-color($green, 60%) !default;\n$green-300: tint-color($green, 40%) !default;\n$green-400: tint-color($green, 20%) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 20%) !default;\n$green-700: shade-color($green, 40%) !default;\n$green-800: shade-color($green, 60%) !default;\n$green-900: shade-color($green, 80%) !default;\n\n$teal-100: tint-color($teal, 80%) !default;\n$teal-200: tint-color($teal, 60%) !default;\n$teal-300: tint-color($teal, 40%) !default;\n$teal-400: tint-color($teal, 20%) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 20%) !default;\n$teal-700: shade-color($teal, 40%) !default;\n$teal-800: shade-color($teal, 60%) !default;\n$teal-900: shade-color($teal, 80%) !default;\n\n$cyan-100: tint-color($cyan, 80%) !default;\n$cyan-200: tint-color($cyan, 60%) !default;\n$cyan-300: tint-color($cyan, 40%) !default;\n$cyan-400: tint-color($cyan, 20%) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 20%) !default;\n$cyan-700: shade-color($cyan, 40%) !default;\n$cyan-800: shade-color($cyan, 60%) !default;\n$cyan-900: shade-color($cyan, 80%) !default;\n\n$blues: (\n \"blue-100\": $blue-100,\n \"blue-200\": $blue-200,\n \"blue-300\": $blue-300,\n \"blue-400\": $blue-400,\n \"blue-500\": $blue-500,\n \"blue-600\": $blue-600,\n \"blue-700\": $blue-700,\n \"blue-800\": $blue-800,\n \"blue-900\": $blue-900\n) !default;\n\n$indigos: (\n \"indigo-100\": $indigo-100,\n \"indigo-200\": $indigo-200,\n \"indigo-300\": $indigo-300,\n \"indigo-400\": $indigo-400,\n \"indigo-500\": $indigo-500,\n \"indigo-600\": $indigo-600,\n \"indigo-700\": $indigo-700,\n \"indigo-800\": $indigo-800,\n \"indigo-900\": $indigo-900\n) !default;\n\n$purples: (\n \"purple-100\": $purple-100,\n \"purple-200\": $purple-200,\n \"purple-300\": $purple-300,\n \"purple-400\": $purple-400,\n \"purple-500\": $purple-500,\n \"purple-600\": $purple-600,\n \"purple-700\": $purple-700,\n \"purple-800\": $purple-800,\n \"purple-900\": $purple-900\n) !default;\n\n$pinks: (\n \"pink-100\": $pink-100,\n \"pink-200\": $pink-200,\n \"pink-300\": $pink-300,\n \"pink-400\": $pink-400,\n \"pink-500\": $pink-500,\n \"pink-600\": $pink-600,\n \"pink-700\": $pink-700,\n \"pink-800\": $pink-800,\n \"pink-900\": $pink-900\n) !default;\n\n$reds: (\n \"red-100\": $red-100,\n \"red-200\": $red-200,\n \"red-300\": $red-300,\n \"red-400\": $red-400,\n \"red-500\": $red-500,\n \"red-600\": $red-600,\n \"red-700\": $red-700,\n \"red-800\": $red-800,\n \"red-900\": $red-900\n) !default;\n\n$oranges: (\n \"orange-100\": $orange-100,\n \"orange-200\": $orange-200,\n \"orange-300\": $orange-300,\n \"orange-400\": $orange-400,\n \"orange-500\": $orange-500,\n \"orange-600\": $orange-600,\n \"orange-700\": $orange-700,\n \"orange-800\": $orange-800,\n \"orange-900\": $orange-900\n) !default;\n\n$yellows: (\n \"yellow-100\": $yellow-100,\n \"yellow-200\": $yellow-200,\n \"yellow-300\": $yellow-300,\n \"yellow-400\": $yellow-400,\n \"yellow-500\": $yellow-500,\n \"yellow-600\": $yellow-600,\n \"yellow-700\": $yellow-700,\n \"yellow-800\": $yellow-800,\n \"yellow-900\": $yellow-900\n) !default;\n\n$greens: (\n \"green-100\": $green-100,\n \"green-200\": $green-200,\n \"green-300\": $green-300,\n \"green-400\": $green-400,\n \"green-500\": $green-500,\n \"green-600\": $green-600,\n \"green-700\": $green-700,\n \"green-800\": $green-800,\n \"green-900\": $green-900\n) !default;\n\n$teals: (\n \"teal-100\": $teal-100,\n \"teal-200\": $teal-200,\n \"teal-300\": $teal-300,\n \"teal-400\": $teal-400,\n \"teal-500\": $teal-500,\n \"teal-600\": $teal-600,\n \"teal-700\": $teal-700,\n \"teal-800\": $teal-800,\n \"teal-900\": $teal-900\n) !default;\n\n$cyans: (\n \"cyan-100\": $cyan-100,\n \"cyan-200\": $cyan-200,\n \"cyan-300\": $cyan-300,\n \"cyan-400\": $cyan-400,\n \"cyan-500\": $cyan-500,\n \"cyan-600\": $cyan-600,\n \"cyan-700\": $cyan-700,\n \"cyan-800\": $cyan-800,\n \"cyan-900\": $cyan-900\n) !default;\n// fusv-enable\n\n// scss-docs-start theme-color-variables\n$primary: $blue !default;\n$secondary: $gray-600 !default;\n$success: $green !default;\n$info: $cyan !default;\n$warning: $yellow !default;\n$danger: $red !default;\n$light: $gray-100 !default;\n$dark: $gray-900 !default;\n// scss-docs-end theme-color-variables\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n \"primary\": $primary,\n \"secondary\": $secondary,\n \"success\": $success,\n \"info\": $info,\n \"warning\": $warning,\n \"danger\": $danger,\n \"light\": $light,\n \"dark\": $dark\n) !default;\n// scss-docs-end theme-colors-map\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n (\"<\", \"%3c\"),\n (\">\", \"%3e\"),\n (\"#\", \"%23\"),\n (\"(\", \"%28\"),\n (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret: true !default;\n$enable-rounded: true !default;\n$enable-shadows: false !default;\n$enable-gradients: false !default;\n$enable-transitions: true !default;\n$enable-reduced-motion: true !default;\n$enable-smooth-scroll: true !default;\n$enable-grid-classes: true !default;\n$enable-container-classes: true !default;\n$enable-cssgrid: false !default;\n$enable-button-pointers: true !default;\n$enable-rfs: true !default;\n$enable-validation-icons: true !default;\n$enable-negative-margins: false !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities: true !default;\n\n// Prefix for :root CSS variables\n\n$variable-prefix: bs- !default; // Deprecated in v5.2.0 for the shorter `$prefix`\n$prefix: $variable-prefix !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n// scss-docs-start variable-gradient\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n// scss-docs-end variable-gradient\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n// scss-docs-start spacer-variables-maps\n$spacer: 1rem !default;\n$spacers: (\n 0: 0,\n 1: $spacer * .25,\n 2: $spacer * .5,\n 3: $spacer,\n 4: $spacer * 1.5,\n 5: $spacer * 3,\n) !default;\n// scss-docs-end spacer-variables-maps\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n// scss-docs-start position-map\n$position-values: (\n 0: 0,\n 50: 50%,\n 100: 100%\n) !default;\n// scss-docs-end position-map\n\n// Body\n//\n// Settings for the `` element.\n\n$body-bg: $white !default;\n$body-color: $gray-900 !default;\n$body-text-align: null !default;\n\n// Links\n//\n// Style anchor elements.\n\n$link-color: $primary !default;\n$link-decoration: underline !default;\n$link-shade-percentage: 20% !default;\n$link-hover-color: shift-color($link-color, $link-shade-percentage) !default;\n$link-hover-decoration: null !default;\n\n$stretched-link-pseudo-element: after !default;\n$stretched-link-z-index: 1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom: 1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n sm: 540px,\n md: 720px,\n lg: 960px,\n xl: 1140px,\n xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns: 12 !default;\n$grid-gutter-width: 1.5rem !default;\n$grid-row-columns: 6 !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n// scss-docs-start border-variables\n$border-width: 1px !default;\n$border-widths: (\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n) !default;\n\n$border-style: solid !default;\n$border-color: $gray-300 !default;\n$border-color-translucent: rgba($black, .175) !default;\n// scss-docs-end border-variables\n\n// scss-docs-start border-radius-variables\n$border-radius: .375rem !default;\n$border-radius-sm: .25rem !default;\n$border-radius-lg: .5rem !default;\n$border-radius-xl: 1rem !default;\n$border-radius-2xl: 2rem !default;\n$border-radius-pill: 50rem !default;\n// scss-docs-end border-radius-variables\n\n// scss-docs-start box-shadow-variables\n$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;\n$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;\n$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;\n$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;\n// scss-docs-end box-shadow-variables\n\n$component-active-color: $white !default;\n$component-active-bg: $primary !default;\n\n// scss-docs-start caret-variables\n$caret-width: .3em !default;\n$caret-vertical-align: $caret-width * .85 !default;\n$caret-spacing: $caret-width * .85 !default;\n// scss-docs-end caret-variables\n\n$transition-base: all .2s ease-in-out !default;\n$transition-fade: opacity .15s linear !default;\n// scss-docs-start collapse-transition\n$transition-collapse: height .35s ease !default;\n$transition-collapse-width: width .35s ease !default;\n// scss-docs-end collapse-transition\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n \"1x1\": 100%,\n \"4x3\": calc(3 / 4 * 100%),\n \"16x9\": calc(9 / 16 * 100%),\n \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// scss-docs-start font-variables\n// stylelint-disable value-keyword-case\n$font-family-sans-serif: system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\" !default;\n$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n// stylelint-enable value-keyword-case\n$font-family-base: var(--#{$prefix}font-sans-serif) !default;\n$font-family-code: var(--#{$prefix}font-monospace) !default;\n\n// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins\n// $font-size-base affects the font size of the body text\n$font-size-root: null !default;\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$font-size-sm: $font-size-base * .875 !default;\n$font-size-lg: $font-size-base * 1.25 !default;\n\n$font-weight-lighter: lighter !default;\n$font-weight-light: 300 !default;\n$font-weight-normal: 400 !default;\n$font-weight-semibold: 600 !default;\n$font-weight-bold: 700 !default;\n$font-weight-bolder: bolder !default;\n\n$font-weight-base: $font-weight-normal !default;\n\n$line-height-base: 1.5 !default;\n$line-height-sm: 1.25 !default;\n$line-height-lg: 2 !default;\n\n$h1-font-size: $font-size-base * 2.5 !default;\n$h2-font-size: $font-size-base * 2 !default;\n$h3-font-size: $font-size-base * 1.75 !default;\n$h4-font-size: $font-size-base * 1.5 !default;\n$h5-font-size: $font-size-base * 1.25 !default;\n$h6-font-size: $font-size-base !default;\n// scss-docs-end font-variables\n\n// scss-docs-start font-sizes\n$font-sizes: (\n 1: $h1-font-size,\n 2: $h2-font-size,\n 3: $h3-font-size,\n 4: $h4-font-size,\n 5: $h5-font-size,\n 6: $h6-font-size\n) !default;\n// scss-docs-end font-sizes\n\n// scss-docs-start headings-variables\n$headings-margin-bottom: $spacer * .5 !default;\n$headings-font-family: null !default;\n$headings-font-style: null !default;\n$headings-font-weight: 500 !default;\n$headings-line-height: 1.2 !default;\n$headings-color: null !default;\n// scss-docs-end headings-variables\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n 1: 5rem,\n 2: 4.5rem,\n 3: 4rem,\n 4: 3.5rem,\n 5: 3rem,\n 6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n// scss-docs-start type-variables\n$lead-font-size: $font-size-base * 1.25 !default;\n$lead-font-weight: 300 !default;\n\n$small-font-size: .875em !default;\n\n$sub-sup-font-size: .75em !default;\n\n$text-muted: rgba(var(--#{$prefix}body-color-rgb), .75) !default;\n\n$initialism-font-size: $small-font-size !default;\n\n$blockquote-margin-y: $spacer !default;\n$blockquote-font-size: $font-size-base * 1.25 !default;\n$blockquote-footer-color: $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y: $spacer !default;\n$hr-color: inherit !default;\n\n// fusv-disable\n$hr-bg-color: null !default; // Deprecated in v5.2.0\n$hr-height: null !default; // Deprecated in v5.2.0\n// fusv-enable\n\n$hr-border-color: null !default; // Allows for inherited colors\n$hr-border-width: $border-width !default;\n$hr-opacity: .25 !default;\n\n$legend-margin-bottom: .5rem !default;\n$legend-font-size: 1.5rem !default;\n$legend-font-weight: null !default;\n\n$dt-font-weight: $font-weight-bold !default;\n\n$list-inline-padding: .5rem !default;\n\n$mark-padding: .1875em !default;\n$mark-bg: $yellow-100 !default;\n// scss-docs-end type-variables\n\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n\n// scss-docs-start table-variables\n$table-cell-padding-y: .5rem !default;\n$table-cell-padding-x: .5rem !default;\n$table-cell-padding-y-sm: .25rem !default;\n$table-cell-padding-x-sm: .25rem !default;\n\n$table-cell-vertical-align: top !default;\n\n$table-color: var(--#{$prefix}body-color) !default;\n$table-bg: transparent !default;\n$table-accent-bg: transparent !default;\n\n$table-th-font-weight: null !default;\n\n$table-striped-color: $table-color !default;\n$table-striped-bg-factor: .05 !default;\n$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color: $table-color !default;\n$table-active-bg-factor: .1 !default;\n$table-active-bg: rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color: $table-color !default;\n$table-hover-bg-factor: .075 !default;\n$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor: .1 !default;\n$table-border-width: $border-width !default;\n$table-border-color: var(--#{$prefix}border-color) !default;\n\n$table-striped-order: odd !default;\n$table-striped-columns-order: even !default;\n\n$table-group-separator-color: currentcolor !default;\n\n$table-caption-color: $text-muted !default;\n\n$table-bg-scale: -80% !default;\n// scss-docs-end table-variables\n\n// scss-docs-start table-loop\n$table-variants: (\n \"primary\": shift-color($primary, $table-bg-scale),\n \"secondary\": shift-color($secondary, $table-bg-scale),\n \"success\": shift-color($success, $table-bg-scale),\n \"info\": shift-color($info, $table-bg-scale),\n \"warning\": shift-color($warning, $table-bg-scale),\n \"danger\": shift-color($danger, $table-bg-scale),\n \"light\": $light,\n \"dark\": $dark,\n) !default;\n// scss-docs-end table-loop\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n// scss-docs-start input-btn-variables\n$input-btn-padding-y: .375rem !default;\n$input-btn-padding-x: .75rem !default;\n$input-btn-font-family: null !default;\n$input-btn-font-size: $font-size-base !default;\n$input-btn-line-height: $line-height-base !default;\n\n$input-btn-focus-width: .25rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-blur: 0 !default;\n$input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm: .25rem !default;\n$input-btn-padding-x-sm: .5rem !default;\n$input-btn-font-size-sm: $font-size-sm !default;\n\n$input-btn-padding-y-lg: .5rem !default;\n$input-btn-padding-x-lg: 1rem !default;\n$input-btn-font-size-lg: $font-size-lg !default;\n\n$input-btn-border-width: $border-width !default;\n// scss-docs-end input-btn-variables\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n// scss-docs-start btn-variables\n$btn-padding-y: $input-btn-padding-y !default;\n$btn-padding-x: $input-btn-padding-x !default;\n$btn-font-family: $input-btn-font-family !default;\n$btn-font-size: $input-btn-font-size !default;\n$btn-line-height: $input-btn-line-height !default;\n$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-padding-y-sm: $input-btn-padding-y-sm !default;\n$btn-padding-x-sm: $input-btn-padding-x-sm !default;\n$btn-font-size-sm: $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg: $input-btn-padding-y-lg !default;\n$btn-padding-x-lg: $input-btn-padding-x-lg !default;\n$btn-font-size-lg: $input-btn-font-size-lg !default;\n\n$btn-border-width: $input-btn-border-width !default;\n\n$btn-font-weight: $font-weight-normal !default;\n$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;\n$btn-focus-width: $input-btn-focus-width !default;\n$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$btn-disabled-opacity: .65 !default;\n$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;\n\n$btn-link-color: var(--#{$prefix}link-color) !default;\n$btn-link-hover-color: var(--#{$prefix}link-hover-color) !default;\n$btn-link-disabled-color: $gray-600 !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: $border-radius !default;\n$btn-border-radius-sm: $border-radius-sm !default;\n$btn-border-radius-lg: $border-radius-lg !default;\n\n$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$btn-hover-bg-shade-amount: 15% !default;\n$btn-hover-bg-tint-amount: 15% !default;\n$btn-hover-border-shade-amount: 20% !default;\n$btn-hover-border-tint-amount: 10% !default;\n$btn-active-bg-shade-amount: 20% !default;\n$btn-active-bg-tint-amount: 20% !default;\n$btn-active-border-shade-amount: 25% !default;\n$btn-active-border-tint-amount: 10% !default;\n// scss-docs-end btn-variables\n\n\n// Forms\n\n// scss-docs-start form-text-variables\n$form-text-margin-top: .25rem !default;\n$form-text-font-size: $small-font-size !default;\n$form-text-font-style: null !default;\n$form-text-font-weight: null !default;\n$form-text-color: $text-muted !default;\n// scss-docs-end form-text-variables\n\n// scss-docs-start form-label-variables\n$form-label-margin-bottom: .5rem !default;\n$form-label-font-size: null !default;\n$form-label-font-style: null !default;\n$form-label-font-weight: null !default;\n$form-label-color: null !default;\n// scss-docs-end form-label-variables\n\n// scss-docs-start form-input-variables\n$input-padding-y: $input-btn-padding-y !default;\n$input-padding-x: $input-btn-padding-x !default;\n$input-font-family: $input-btn-font-family !default;\n$input-font-size: $input-btn-font-size !default;\n$input-font-weight: $font-weight-base !default;\n$input-line-height: $input-btn-line-height !default;\n\n$input-padding-y-sm: $input-btn-padding-y-sm !default;\n$input-padding-x-sm: $input-btn-padding-x-sm !default;\n$input-font-size-sm: $input-btn-font-size-sm !default;\n\n$input-padding-y-lg: $input-btn-padding-y-lg !default;\n$input-padding-x-lg: $input-btn-padding-x-lg !default;\n$input-font-size-lg: $input-btn-font-size-lg !default;\n\n$input-bg: $body-bg !default;\n$input-disabled-color: null !default;\n$input-disabled-bg: $gray-200 !default;\n$input-disabled-border-color: null !default;\n\n$input-color: $body-color !default;\n$input-border-color: $gray-400 !default;\n$input-border-width: $input-btn-border-width !default;\n$input-box-shadow: $box-shadow-inset !default;\n\n$input-border-radius: $border-radius !default;\n$input-border-radius-sm: $border-radius-sm !default;\n$input-border-radius-lg: $border-radius-lg !default;\n\n$input-focus-bg: $input-bg !default;\n$input-focus-border-color: tint-color($component-active-bg, 50%) !default;\n$input-focus-color: $input-color !default;\n$input-focus-width: $input-btn-focus-width !default;\n$input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$input-placeholder-color: $gray-600 !default;\n$input-plaintext-color: $body-color !default;\n\n$input-height-border: $input-border-width * 2 !default;\n\n$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;\n$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;\n$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !default;\n\n$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;\n$input-height-sm: add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;\n$input-height-lg: add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;\n\n$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-color-width: 3rem !default;\n// scss-docs-end form-input-variables\n\n// scss-docs-start form-check-variables\n$form-check-input-width: 1em !default;\n$form-check-min-height: $font-size-base * $line-height-base !default;\n$form-check-padding-start: $form-check-input-width + .5em !default;\n$form-check-margin-bottom: .125rem !default;\n$form-check-label-color: null !default;\n$form-check-label-cursor: null !default;\n$form-check-transition: null !default;\n\n$form-check-input-active-filter: brightness(90%) !default;\n\n$form-check-input-bg: $input-bg !default;\n$form-check-input-border: 1px solid rgba($black, .25) !default;\n$form-check-input-border-radius: .25em !default;\n$form-check-radio-border-radius: 50% !default;\n$form-check-input-focus-border: $input-focus-border-color !default;\n$form-check-input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$form-check-input-checked-color: $component-active-color !default;\n$form-check-input-checked-bg-color: $component-active-bg !default;\n$form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-check-radio-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-indeterminate-color: $component-active-color !default;\n$form-check-input-indeterminate-bg-color: $component-active-bg !default;\n$form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-disabled-opacity: .5 !default;\n$form-check-label-disabled-opacity: $form-check-input-disabled-opacity !default;\n$form-check-btn-check-disabled-opacity: $btn-disabled-opacity !default;\n\n$form-check-inline-margin-end: 1rem !default;\n// scss-docs-end form-check-variables\n\n// scss-docs-start form-switch-variables\n$form-switch-color: rgba($black, .25) !default;\n$form-switch-width: 2em !default;\n$form-switch-padding-start: $form-switch-width + .5em !default;\n$form-switch-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-border-radius: $form-switch-width !default;\n$form-switch-transition: background-position .15s ease-in-out !default;\n\n$form-switch-focus-color: $input-focus-border-color !default;\n$form-switch-focus-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-switch-checked-color: $component-active-color !default;\n$form-switch-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-checked-bg-position: right center !default;\n// scss-docs-end form-switch-variables\n\n// scss-docs-start input-group-variables\n$input-group-addon-padding-y: $input-padding-y !default;\n$input-group-addon-padding-x: $input-padding-x !default;\n$input-group-addon-font-weight: $input-font-weight !default;\n$input-group-addon-color: $input-color !default;\n$input-group-addon-bg: $gray-200 !default;\n$input-group-addon-border-color: $input-border-color !default;\n// scss-docs-end input-group-variables\n\n// scss-docs-start form-select-variables\n$form-select-padding-y: $input-padding-y !default;\n$form-select-padding-x: $input-padding-x !default;\n$form-select-font-family: $input-font-family !default;\n$form-select-font-size: $input-font-size !default;\n$form-select-indicator-padding: $form-select-padding-x * 3 !default; // Extra padding for background-image\n$form-select-font-weight: $input-font-weight !default;\n$form-select-line-height: $input-line-height !default;\n$form-select-color: $input-color !default;\n$form-select-bg: $input-bg !default;\n$form-select-disabled-color: null !default;\n$form-select-disabled-bg: $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position: right $form-select-padding-x center !default;\n$form-select-bg-size: 16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color: $gray-800 !default;\n$form-select-indicator: url(\"data:image/svg+xml,\") !default;\n\n$form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default;\n$form-select-feedback-icon-position: center right $form-select-indicator-padding !default;\n$form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width: $input-border-width !default;\n$form-select-border-color: $input-border-color !default;\n$form-select-border-radius: $input-border-radius !default;\n$form-select-box-shadow: $box-shadow-inset !default;\n\n$form-select-focus-border-color: $input-focus-border-color !default;\n$form-select-focus-width: $input-focus-width !default;\n$form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focus-color !default;\n\n$form-select-padding-y-sm: $input-padding-y-sm !default;\n$form-select-padding-x-sm: $input-padding-x-sm !default;\n$form-select-font-size-sm: $input-font-size-sm !default;\n$form-select-border-radius-sm: $input-border-radius-sm !default;\n\n$form-select-padding-y-lg: $input-padding-y-lg !default;\n$form-select-padding-x-lg: $input-padding-x-lg !default;\n$form-select-font-size-lg: $input-font-size-lg !default;\n$form-select-border-radius-lg: $input-border-radius-lg !default;\n\n$form-select-transition: $input-transition !default;\n// scss-docs-end form-select-variables\n\n// scss-docs-start form-range-variables\n$form-range-track-width: 100% !default;\n$form-range-track-height: .5rem !default;\n$form-range-track-cursor: pointer !default;\n$form-range-track-bg: $gray-300 !default;\n$form-range-track-border-radius: 1rem !default;\n$form-range-track-box-shadow: $box-shadow-inset !default;\n\n$form-range-thumb-width: 1rem !default;\n$form-range-thumb-height: $form-range-thumb-width !default;\n$form-range-thumb-bg: $component-active-bg !default;\n$form-range-thumb-border: 0 !default;\n$form-range-thumb-border-radius: 1rem !default;\n$form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default;\n$form-range-thumb-disabled-bg: $gray-500 !default;\n$form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n// scss-docs-end form-range-variables\n\n// scss-docs-start form-file-variables\n$form-file-button-color: $input-color !default;\n$form-file-button-bg: $input-group-addon-bg !default;\n$form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default;\n// scss-docs-end form-file-variables\n\n// scss-docs-start form-floating-variables\n$form-floating-height: add(3.5rem, $input-height-border) !default;\n$form-floating-line-height: 1.25 !default;\n$form-floating-padding-x: $input-padding-x !default;\n$form-floating-padding-y: 1rem !default;\n$form-floating-input-padding-t: 1.625rem !default;\n$form-floating-input-padding-b: .625rem !default;\n$form-floating-label-opacity: .65 !default;\n$form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default;\n$form-floating-transition: opacity .1s ease-in-out, transform .1s ease-in-out !default;\n// scss-docs-end form-floating-variables\n\n// Form validation\n\n// scss-docs-start form-feedback-variables\n$form-feedback-margin-top: $form-text-margin-top !default;\n$form-feedback-font-size: $form-text-font-size !default;\n$form-feedback-font-style: $form-text-font-style !default;\n$form-feedback-valid-color: $success !default;\n$form-feedback-invalid-color: $danger !default;\n\n$form-feedback-icon-valid-color: $form-feedback-valid-color !default;\n$form-feedback-icon-valid: url(\"data:image/svg+xml,\") !default;\n$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end form-feedback-variables\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n \"valid\": (\n \"color\": $form-feedback-valid-color,\n \"icon\": $form-feedback-icon-valid\n ),\n \"invalid\": (\n \"color\": $form-feedback-invalid-color,\n \"icon\": $form-feedback-icon-invalid\n )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown: 1000 !default;\n$zindex-sticky: 1020 !default;\n$zindex-fixed: 1030 !default;\n$zindex-offcanvas-backdrop: 1040 !default;\n$zindex-offcanvas: 1045 !default;\n$zindex-modal-backdrop: 1050 !default;\n$zindex-modal: 1055 !default;\n$zindex-popover: 1070 !default;\n$zindex-tooltip: 1080 !default;\n$zindex-toast: 1090 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n// scss-docs-start nav-variables\n$nav-link-padding-y: .5rem !default;\n$nav-link-padding-x: 1rem !default;\n$nav-link-font-size: null !default;\n$nav-link-font-weight: null !default;\n$nav-link-color: var(--#{$prefix}link-color) !default;\n$nav-link-hover-color: var(--#{$prefix}link-hover-color) !default;\n$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color: $gray-600 !default;\n\n$nav-tabs-border-color: $gray-300 !default;\n$nav-tabs-border-width: $border-width !default;\n$nav-tabs-border-radius: $border-radius !default;\n$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color: $gray-700 !default;\n$nav-tabs-link-active-bg: $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius: $border-radius !default;\n$nav-pills-link-active-color: $component-active-color !default;\n$nav-pills-link-active-bg: $component-active-bg !default;\n// scss-docs-end nav-variables\n\n\n// Navbar\n\n// scss-docs-start navbar-variables\n$navbar-padding-y: $spacer * .5 !default;\n$navbar-padding-x: null !default;\n\n$navbar-nav-link-padding-x: .5rem !default;\n\n$navbar-brand-font-size: $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default;\n$navbar-brand-margin-end: 1rem !default;\n\n$navbar-toggler-padding-y: .25rem !default;\n$navbar-toggler-padding-x: .75rem !default;\n$navbar-toggler-font-size: $font-size-lg !default;\n$navbar-toggler-border-radius: $btn-border-radius !default;\n$navbar-toggler-focus-width: $btn-focus-width !default;\n$navbar-toggler-transition: box-shadow .15s ease-in-out !default;\n// scss-docs-end navbar-variables\n\n// scss-docs-start navbar-theme-variables\n$navbar-dark-color: rgba($white, .55) !default;\n$navbar-dark-hover-color: rgba($white, .75) !default;\n$navbar-dark-active-color: $white !default;\n$navbar-dark-disabled-color: rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-dark-toggler-border-color: rgba($white, .1) !default;\n\n$navbar-light-color: rgba($black, .55) !default;\n$navbar-light-hover-color: rgba($black, .7) !default;\n$navbar-light-active-color: rgba($black, .9) !default;\n$navbar-light-disabled-color: rgba($black, .3) !default;\n$navbar-light-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-light-toggler-border-color: rgba($black, .1) !default;\n\n$navbar-light-brand-color: $navbar-light-active-color !default;\n$navbar-light-brand-hover-color: $navbar-light-active-color !default;\n$navbar-dark-brand-color: $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;\n// scss-docs-end navbar-theme-variables\n\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n// scss-docs-start dropdown-variables\n$dropdown-min-width: 10rem !default;\n$dropdown-padding-x: 0 !default;\n$dropdown-padding-y: .5rem !default;\n$dropdown-spacer: .125rem !default;\n$dropdown-font-size: $font-size-base !default;\n$dropdown-color: $body-color !default;\n$dropdown-bg: $white !default;\n$dropdown-border-color: var(--#{$prefix}border-color-translucent) !default;\n$dropdown-border-radius: $border-radius !default;\n$dropdown-border-width: $border-width !default;\n$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-divider-bg: $dropdown-border-color !default;\n$dropdown-divider-margin-y: $spacer * .5 !default;\n$dropdown-box-shadow: $box-shadow !default;\n\n$dropdown-link-color: $gray-900 !default;\n$dropdown-link-hover-color: shade-color($dropdown-link-color, 10%) !default;\n$dropdown-link-hover-bg: $gray-200 !default;\n\n$dropdown-link-active-color: $component-active-color !default;\n$dropdown-link-active-bg: $component-active-bg !default;\n\n$dropdown-link-disabled-color: $gray-500 !default;\n\n$dropdown-item-padding-y: $spacer * .25 !default;\n$dropdown-item-padding-x: $spacer !default;\n\n$dropdown-header-color: $gray-600 !default;\n$dropdown-header-padding-x: $dropdown-item-padding-x !default;\n$dropdown-header-padding-y: $dropdown-padding-y !default;\n// fusv-disable\n$dropdown-header-padding: $dropdown-header-padding-y $dropdown-header-padding-x !default; // Deprecated in v5.2.0\n// fusv-enable\n// scss-docs-end dropdown-variables\n\n// scss-docs-start dropdown-dark-variables\n$dropdown-dark-color: $gray-300 !default;\n$dropdown-dark-bg: $gray-800 !default;\n$dropdown-dark-border-color: $dropdown-border-color !default;\n$dropdown-dark-divider-bg: $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow: null !default;\n$dropdown-dark-link-color: $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color: $white !default;\n$dropdown-dark-link-hover-bg: rgba($white, .15) !default;\n$dropdown-dark-link-active-color: $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color: $gray-500 !default;\n// scss-docs-end dropdown-dark-variables\n\n\n// Pagination\n\n// scss-docs-start pagination-variables\n$pagination-padding-y: .375rem !default;\n$pagination-padding-x: .75rem !default;\n$pagination-padding-y-sm: .25rem !default;\n$pagination-padding-x-sm: .5rem !default;\n$pagination-padding-y-lg: .75rem !default;\n$pagination-padding-x-lg: 1.5rem !default;\n\n$pagination-font-size: $font-size-base !default;\n\n$pagination-color: var(--#{$prefix}link-color) !default;\n$pagination-bg: $white !default;\n$pagination-border-radius: $border-radius !default;\n$pagination-border-width: $border-width !default;\n$pagination-margin-start: calc($pagination-border-width * -1) !default; // stylelint-disable-line function-disallowed-list\n$pagination-border-color: $gray-300 !default;\n\n$pagination-focus-color: var(--#{$prefix}link-hover-color) !default;\n$pagination-focus-bg: $gray-200 !default;\n$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$pagination-focus-outline: 0 !default;\n\n$pagination-hover-color: var(--#{$prefix}link-hover-color) !default;\n$pagination-hover-bg: $gray-200 !default;\n$pagination-hover-border-color: $gray-300 !default;\n\n$pagination-active-color: $component-active-color !default;\n$pagination-active-bg: $component-active-bg !default;\n$pagination-active-border-color: $pagination-active-bg !default;\n\n$pagination-disabled-color: $gray-600 !default;\n$pagination-disabled-bg: $white !default;\n$pagination-disabled-border-color: $gray-300 !default;\n\n$pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$pagination-border-radius-sm: $border-radius-sm !default;\n$pagination-border-radius-lg: $border-radius-lg !default;\n// scss-docs-end pagination-variables\n\n\n// Placeholders\n\n// scss-docs-start placeholders\n$placeholder-opacity-max: .5 !default;\n$placeholder-opacity-min: .2 !default;\n// scss-docs-end placeholders\n\n// Cards\n\n// scss-docs-start card-variables\n$card-spacer-y: $spacer !default;\n$card-spacer-x: $spacer !default;\n$card-title-spacer-y: $spacer * .5 !default;\n$card-border-width: $border-width !default;\n$card-border-color: var(--#{$prefix}border-color-translucent) !default;\n$card-border-radius: $border-radius !default;\n$card-box-shadow: null !default;\n$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y: $card-spacer-y * .5 !default;\n$card-cap-padding-x: $card-spacer-x !default;\n$card-cap-bg: rgba($black, .03) !default;\n$card-cap-color: null !default;\n$card-height: null !default;\n$card-color: null !default;\n$card-bg: $white !default;\n$card-img-overlay-padding: $spacer !default;\n$card-group-margin: $grid-gutter-width * .5 !default;\n// scss-docs-end card-variables\n\n// Accordion\n\n// scss-docs-start accordion-variables\n$accordion-padding-y: 1rem !default;\n$accordion-padding-x: 1.25rem !default;\n$accordion-color: var(--#{$prefix}body-color) !default;\n$accordion-bg: $body-bg !default;\n$accordion-border-width: $border-width !default;\n$accordion-border-color: var(--#{$prefix}border-color) !default;\n$accordion-border-radius: $border-radius !default;\n$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;\n\n$accordion-body-padding-y: $accordion-padding-y !default;\n$accordion-body-padding-x: $accordion-padding-x !default;\n\n$accordion-button-padding-y: $accordion-padding-y !default;\n$accordion-button-padding-x: $accordion-padding-x !default;\n$accordion-button-color: $accordion-color !default;\n$accordion-button-bg: var(--#{$prefix}accordion-bg) !default;\n$accordion-transition: $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg: tint-color($component-active-bg, 90%) !default;\n$accordion-button-active-color: shade-color($primary, 10%) !default;\n\n$accordion-button-focus-border-color: $input-focus-border-color !default;\n$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;\n\n$accordion-icon-width: 1.25rem !default;\n$accordion-icon-color: $accordion-button-color !default;\n$accordion-icon-active-color: $accordion-button-active-color !default;\n$accordion-icon-transition: transform .2s ease-in-out !default;\n$accordion-icon-transform: rotate(-180deg) !default;\n\n$accordion-button-icon: url(\"data:image/svg+xml,\") !default;\n$accordion-button-active-icon: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end accordion-variables\n\n// Tooltips\n\n// scss-docs-start tooltip-variables\n$tooltip-font-size: $font-size-sm !default;\n$tooltip-max-width: 200px !default;\n$tooltip-color: $white !default;\n$tooltip-bg: $black !default;\n$tooltip-border-radius: $border-radius !default;\n$tooltip-opacity: .9 !default;\n$tooltip-padding-y: $spacer * .25 !default;\n$tooltip-padding-x: $spacer * .5 !default;\n$tooltip-margin: null !default; // TODO: remove this in v6\n\n$tooltip-arrow-width: .8rem !default;\n$tooltip-arrow-height: .4rem !default;\n// fusv-disable\n$tooltip-arrow-color: null !default; // Deprecated in Bootstrap 5.2.0 for CSS variables\n// fusv-enable\n// scss-docs-end tooltip-variables\n\n// Form tooltips must come after regular tooltips\n// scss-docs-start tooltip-feedback-variables\n$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size: $tooltip-font-size !default;\n$form-feedback-tooltip-line-height: null !default;\n$form-feedback-tooltip-opacity: $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n// scss-docs-end tooltip-feedback-variables\n\n\n// Popovers\n\n// scss-docs-start popover-variables\n$popover-font-size: $font-size-sm !default;\n$popover-bg: $white !default;\n$popover-max-width: 276px !default;\n$popover-border-width: $border-width !default;\n$popover-border-color: var(--#{$prefix}border-color-translucent) !default;\n$popover-border-radius: $border-radius-lg !default;\n$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow: $box-shadow !default;\n\n$popover-header-font-size: $font-size-base !default;\n$popover-header-bg: shade-color($popover-bg, 6%) !default;\n$popover-header-color: var(--#{$prefix}heading-color) !default;\n$popover-header-padding-y: .5rem !default;\n$popover-header-padding-x: $spacer !default;\n\n$popover-body-color: $body-color !default;\n$popover-body-padding-y: $spacer !default;\n$popover-body-padding-x: $spacer !default;\n\n$popover-arrow-width: 1rem !default;\n$popover-arrow-height: .5rem !default;\n// scss-docs-end popover-variables\n\n// fusv-disable\n// Deprecated in Bootstrap 5.2.0 for CSS variables\n$popover-arrow-color: $popover-bg !default;\n$popover-arrow-outer-color: var(--#{$prefix}border-color-translucent) !default;\n// fusv-enable\n\n\n// Toasts\n\n// scss-docs-start toast-variables\n$toast-max-width: 350px !default;\n$toast-padding-x: .75rem !default;\n$toast-padding-y: .5rem !default;\n$toast-font-size: .875rem !default;\n$toast-color: null !default;\n$toast-background-color: rgba($white, .85) !default;\n$toast-border-width: $border-width !default;\n$toast-border-color: var(--#{$prefix}border-color-translucent) !default;\n$toast-border-radius: $border-radius !default;\n$toast-box-shadow: $box-shadow !default;\n$toast-spacing: $container-padding-x !default;\n\n$toast-header-color: $gray-600 !default;\n$toast-header-background-color: rgba($white, .85) !default;\n$toast-header-border-color: rgba($black, .05) !default;\n// scss-docs-end toast-variables\n\n\n// Badges\n\n// scss-docs-start badge-variables\n$badge-font-size: .75em !default;\n$badge-font-weight: $font-weight-bold !default;\n$badge-color: $white !default;\n$badge-padding-y: .35em !default;\n$badge-padding-x: .65em !default;\n$badge-border-radius: $border-radius !default;\n// scss-docs-end badge-variables\n\n\n// Modals\n\n// scss-docs-start modal-variables\n$modal-inner-padding: $spacer !default;\n\n$modal-footer-margin-between: .5rem !default;\n\n$modal-dialog-margin: .5rem !default;\n$modal-dialog-margin-y-sm-up: 1.75rem !default;\n\n$modal-title-line-height: $line-height-base !default;\n\n$modal-content-color: null !default;\n$modal-content-bg: $white !default;\n$modal-content-border-color: var(--#{$prefix}border-color-translucent) !default;\n$modal-content-border-width: $border-width !default;\n$modal-content-border-radius: $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs: $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up: $box-shadow !default;\n\n$modal-backdrop-bg: $black !default;\n$modal-backdrop-opacity: .5 !default;\n\n$modal-header-border-color: var(--#{$prefix}border-color) !default;\n$modal-header-border-width: $modal-content-border-width !default;\n$modal-header-padding-y: $modal-inner-padding !default;\n$modal-header-padding-x: $modal-inner-padding !default;\n$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-footer-bg: null !default;\n$modal-footer-border-color: $modal-header-border-color !default;\n$modal-footer-border-width: $modal-header-border-width !default;\n\n$modal-sm: 300px !default;\n$modal-md: 500px !default;\n$modal-lg: 800px !default;\n$modal-xl: 1140px !default;\n\n$modal-fade-transform: translate(0, -50px) !default;\n$modal-show-transform: none !default;\n$modal-transition: transform .3s ease-out !default;\n$modal-scale-transform: scale(1.02) !default;\n// scss-docs-end modal-variables\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n// scss-docs-start alert-variables\n$alert-padding-y: $spacer !default;\n$alert-padding-x: $spacer !default;\n$alert-margin-bottom: 1rem !default;\n$alert-border-radius: $border-radius !default;\n$alert-link-font-weight: $font-weight-bold !default;\n$alert-border-width: $border-width !default;\n$alert-bg-scale: -80% !default;\n$alert-border-scale: -70% !default;\n$alert-color-scale: 40% !default;\n$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n// scss-docs-end alert-variables\n\n\n// Progress bars\n\n// scss-docs-start progress-variables\n$progress-height: 1rem !default;\n$progress-font-size: $font-size-base * .75 !default;\n$progress-bg: $gray-200 !default;\n$progress-border-radius: $border-radius !default;\n$progress-box-shadow: $box-shadow-inset !default;\n$progress-bar-color: $white !default;\n$progress-bar-bg: $primary !default;\n$progress-bar-animation-timing: 1s linear infinite !default;\n$progress-bar-transition: width .6s ease !default;\n// scss-docs-end progress-variables\n\n\n// List group\n\n// scss-docs-start list-group-variables\n$list-group-color: $gray-900 !default;\n$list-group-bg: $white !default;\n$list-group-border-color: rgba($black, .125) !default;\n$list-group-border-width: $border-width !default;\n$list-group-border-radius: $border-radius !default;\n\n$list-group-item-padding-y: $spacer * .5 !default;\n$list-group-item-padding-x: $spacer !default;\n$list-group-item-bg-scale: -80% !default;\n$list-group-item-color-scale: 40% !default;\n\n$list-group-hover-bg: $gray-100 !default;\n$list-group-active-color: $component-active-color !default;\n$list-group-active-bg: $component-active-bg !default;\n$list-group-active-border-color: $list-group-active-bg !default;\n\n$list-group-disabled-color: $gray-600 !default;\n$list-group-disabled-bg: $list-group-bg !default;\n\n$list-group-action-color: $gray-700 !default;\n$list-group-action-hover-color: $list-group-action-color !default;\n\n$list-group-action-active-color: $body-color !default;\n$list-group-action-active-bg: $gray-200 !default;\n// scss-docs-end list-group-variables\n\n\n// Image thumbnails\n\n// scss-docs-start thumbnail-variables\n$thumbnail-padding: .25rem !default;\n$thumbnail-bg: $body-bg !default;\n$thumbnail-border-width: $border-width !default;\n$thumbnail-border-color: var(--#{$prefix}border-color) !default;\n$thumbnail-border-radius: $border-radius !default;\n$thumbnail-box-shadow: $box-shadow-sm !default;\n// scss-docs-end thumbnail-variables\n\n\n// Figures\n\n// scss-docs-start figure-variables\n$figure-caption-font-size: $small-font-size !default;\n$figure-caption-color: $gray-600 !default;\n// scss-docs-end figure-variables\n\n\n// Breadcrumbs\n\n// scss-docs-start breadcrumb-variables\n$breadcrumb-font-size: null !default;\n$breadcrumb-padding-y: 0 !default;\n$breadcrumb-padding-x: 0 !default;\n$breadcrumb-item-padding-x: .5rem !default;\n$breadcrumb-margin-bottom: 1rem !default;\n$breadcrumb-bg: null !default;\n$breadcrumb-divider-color: $gray-600 !default;\n$breadcrumb-active-color: $gray-600 !default;\n$breadcrumb-divider: quote(\"/\") !default;\n$breadcrumb-divider-flipped: $breadcrumb-divider !default;\n$breadcrumb-border-radius: null !default;\n// scss-docs-end breadcrumb-variables\n\n// Carousel\n\n// scss-docs-start carousel-variables\n$carousel-control-color: $white !default;\n$carousel-control-width: 15% !default;\n$carousel-control-opacity: .5 !default;\n$carousel-control-hover-opacity: .9 !default;\n$carousel-control-transition: opacity .15s ease !default;\n\n$carousel-indicator-width: 30px !default;\n$carousel-indicator-height: 3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer: 3px !default;\n$carousel-indicator-opacity: .5 !default;\n$carousel-indicator-active-bg: $white !default;\n$carousel-indicator-active-opacity: 1 !default;\n$carousel-indicator-transition: opacity .6s ease !default;\n\n$carousel-caption-width: 70% !default;\n$carousel-caption-color: $white !default;\n$carousel-caption-padding-y: 1.25rem !default;\n$carousel-caption-spacer: 1.25rem !default;\n\n$carousel-control-icon-width: 2rem !default;\n\n$carousel-control-prev-icon-bg: url(\"data:image/svg+xml,\") !default;\n$carousel-control-next-icon-bg: url(\"data:image/svg+xml,\") !default;\n\n$carousel-transition-duration: .6s !default;\n$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg: $black !default;\n$carousel-dark-caption-color: $black !default;\n$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;\n// scss-docs-end carousel-variables\n\n\n// Spinners\n\n// scss-docs-start spinner-variables\n$spinner-width: 2rem !default;\n$spinner-height: $spinner-width !default;\n$spinner-vertical-align: -.125em !default;\n$spinner-border-width: .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm: 1rem !default;\n$spinner-height-sm: $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n// scss-docs-end spinner-variables\n\n\n// Close\n\n// scss-docs-start close-variables\n$btn-close-width: 1em !default;\n$btn-close-height: $btn-close-width !default;\n$btn-close-padding-x: .25em !default;\n$btn-close-padding-y: $btn-close-padding-x !default;\n$btn-close-color: $black !default;\n$btn-close-bg: url(\"data:image/svg+xml,\") !default;\n$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;\n$btn-close-opacity: .5 !default;\n$btn-close-hover-opacity: .75 !default;\n$btn-close-focus-opacity: 1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;\n// scss-docs-end close-variables\n\n\n// Offcanvas\n\n// scss-docs-start offcanvas-variables\n$offcanvas-padding-y: $modal-inner-padding !default;\n$offcanvas-padding-x: $modal-inner-padding !default;\n$offcanvas-horizontal-width: 400px !default;\n$offcanvas-vertical-height: 30vh !default;\n$offcanvas-transition-duration: .3s !default;\n$offcanvas-border-color: $modal-content-border-color !default;\n$offcanvas-border-width: $modal-content-border-width !default;\n$offcanvas-title-line-height: $modal-title-line-height !default;\n$offcanvas-bg-color: $modal-content-bg !default;\n$offcanvas-color: $modal-content-color !default;\n$offcanvas-box-shadow: $modal-content-box-shadow-xs !default;\n$offcanvas-backdrop-bg: $modal-backdrop-bg !default;\n$offcanvas-backdrop-opacity: $modal-backdrop-opacity !default;\n// scss-docs-end offcanvas-variables\n\n// Code\n\n$code-font-size: $small-font-size !default;\n$code-color: $pink !default;\n\n$kbd-padding-y: .1875rem !default;\n$kbd-padding-x: .375rem !default;\n$kbd-font-size: $code-font-size !default;\n$kbd-color: var(--#{$prefix}body-bg) !default;\n$kbd-bg: var(--#{$prefix}body-color) !default;\n$nested-kbd-font-weight: null !default; // Deprecated in v5.2.0, removing in v6\n\n$pre-color: null !default;\n", + "// Re-assigned maps\n//\n// Placed here so that others can override the default Sass maps and see automatic updates to utilities and more.\n\n// scss-docs-start theme-colors-rgb\n$theme-colors-rgb: map-loop($theme-colors, to-rgb, \"$value\") !default;\n// scss-docs-end theme-colors-rgb\n\n// Utilities maps\n//\n// Extends the default `$theme-colors` maps to help create our utilities.\n\n// Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign.\n// scss-docs-start utilities-colors\n$utilities-colors: $theme-colors-rgb !default;\n// scss-docs-end utilities-colors\n\n// scss-docs-start utilities-text-colors\n$utilities-text: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-color)\n )\n) !default;\n$utilities-text-colors: map-loop($utilities-text, rgba-css-var, \"$key\", \"text\") !default;\n// scss-docs-end utilities-text-colors\n\n// scss-docs-start utilities-bg-colors\n$utilities-bg: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-bg)\n )\n) !default;\n$utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, \"$key\", \"bg\") !default;\n// scss-docs-end utilities-bg-colors\n\n// scss-docs-start utilities-border-colors\n$utilities-border: map-merge(\n $utilities-colors,\n (\n \"white\": to-rgb($white)\n )\n) !default;\n$utilities-border-colors: map-loop($utilities-border, rgba-css-var, \"$key\", \"border\") !default;\n// scss-docs-end utilities-border-colors\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n\n$gutters: $spacers !default;\n", + "// Utilities\n\n$utilities: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$utilities: map-merge(\n (\n // scss-docs-start utils-vertical-align\n \"align\": (\n property: vertical-align,\n class: align,\n values: baseline top middle bottom text-bottom text-top\n ),\n // scss-docs-end utils-vertical-align\n // scss-docs-start utils-float\n \"float\": (\n responsive: true,\n property: float,\n values: (\n start: left,\n end: right,\n none: none,\n )\n ),\n // scss-docs-end utils-float\n // Opacity utilities\n // scss-docs-start utils-opacity\n \"opacity\": (\n property: opacity,\n values: (\n 0: 0,\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1,\n )\n ),\n // scss-docs-end utils-opacity\n // scss-docs-start utils-overflow\n \"overflow\": (\n property: overflow,\n values: auto hidden visible scroll,\n ),\n // scss-docs-end utils-overflow\n // scss-docs-start utils-display\n \"display\": (\n responsive: true,\n print: true,\n property: display,\n class: d,\n values: inline inline-block block grid table table-row table-cell flex inline-flex none\n ),\n // scss-docs-end utils-display\n // scss-docs-start utils-shadow\n \"shadow\": (\n property: box-shadow,\n class: shadow,\n values: (\n null: $box-shadow,\n sm: $box-shadow-sm,\n lg: $box-shadow-lg,\n none: none,\n )\n ),\n // scss-docs-end utils-shadow\n // scss-docs-start utils-position\n \"position\": (\n property: position,\n values: static relative absolute fixed sticky\n ),\n \"top\": (\n property: top,\n values: $position-values\n ),\n \"bottom\": (\n property: bottom,\n values: $position-values\n ),\n \"start\": (\n property: left,\n class: start,\n values: $position-values\n ),\n \"end\": (\n property: right,\n class: end,\n values: $position-values\n ),\n \"translate-middle\": (\n property: transform,\n class: translate-middle,\n values: (\n null: translate(-50%, -50%),\n x: translateX(-50%),\n y: translateY(-50%),\n )\n ),\n // scss-docs-end utils-position\n // scss-docs-start utils-borders\n \"border\": (\n property: border,\n values: (\n null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),\n 0: 0,\n )\n ),\n \"border-top\": (\n property: border-top,\n values: (\n null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),\n 0: 0,\n )\n ),\n \"border-end\": (\n property: border-right,\n class: border-end,\n values: (\n null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),\n 0: 0,\n )\n ),\n \"border-bottom\": (\n property: border-bottom,\n values: (\n null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),\n 0: 0,\n )\n ),\n \"border-start\": (\n property: border-left,\n class: border-start,\n values: (\n null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color),\n 0: 0,\n )\n ),\n \"border-color\": (\n property: border-color,\n class: border,\n local-vars: (\n \"border-opacity\": 1\n ),\n values: $utilities-border-colors\n ),\n \"border-width\": (\n css-var: true,\n css-variable-name: border-width,\n class: border,\n values: $border-widths\n ),\n \"border-opacity\": (\n css-var: true,\n class: border-opacity,\n values: (\n 10: .1,\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1\n )\n ),\n // scss-docs-end utils-borders\n // Sizing utilities\n // scss-docs-start utils-sizing\n \"width\": (\n property: width,\n class: w,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-width\": (\n property: max-width,\n class: mw,\n values: (100: 100%)\n ),\n \"viewport-width\": (\n property: width,\n class: vw,\n values: (100: 100vw)\n ),\n \"min-viewport-width\": (\n property: min-width,\n class: min-vw,\n values: (100: 100vw)\n ),\n \"height\": (\n property: height,\n class: h,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-height\": (\n property: max-height,\n class: mh,\n values: (100: 100%)\n ),\n \"viewport-height\": (\n property: height,\n class: vh,\n values: (100: 100vh)\n ),\n \"min-viewport-height\": (\n property: min-height,\n class: min-vh,\n values: (100: 100vh)\n ),\n // scss-docs-end utils-sizing\n // Flex utilities\n // scss-docs-start utils-flex\n \"flex\": (\n responsive: true,\n property: flex,\n values: (fill: 1 1 auto)\n ),\n \"flex-direction\": (\n responsive: true,\n property: flex-direction,\n class: flex,\n values: row column row-reverse column-reverse\n ),\n \"flex-grow\": (\n responsive: true,\n property: flex-grow,\n class: flex,\n values: (\n grow-0: 0,\n grow-1: 1,\n )\n ),\n \"flex-shrink\": (\n responsive: true,\n property: flex-shrink,\n class: flex,\n values: (\n shrink-0: 0,\n shrink-1: 1,\n )\n ),\n \"flex-wrap\": (\n responsive: true,\n property: flex-wrap,\n class: flex,\n values: wrap nowrap wrap-reverse\n ),\n \"justify-content\": (\n responsive: true,\n property: justify-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n evenly: space-evenly,\n )\n ),\n \"align-items\": (\n responsive: true,\n property: align-items,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"align-content\": (\n responsive: true,\n property: align-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n stretch: stretch,\n )\n ),\n \"align-self\": (\n responsive: true,\n property: align-self,\n values: (\n auto: auto,\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"order\": (\n responsive: true,\n property: order,\n values: (\n first: -1,\n 0: 0,\n 1: 1,\n 2: 2,\n 3: 3,\n 4: 4,\n 5: 5,\n last: 6,\n ),\n ),\n // scss-docs-end utils-flex\n // Margin utilities\n // scss-docs-start utils-spacing\n \"margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: map-merge($spacers, (auto: auto))\n ),\n // Negative margin utilities\n \"negative-margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: $negative-spacers\n ),\n \"negative-margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: $negative-spacers\n ),\n \"negative-margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: $negative-spacers\n ),\n \"negative-margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: $negative-spacers\n ),\n \"negative-margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: $negative-spacers\n ),\n \"negative-margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: $negative-spacers\n ),\n \"negative-margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: $negative-spacers\n ),\n // Padding utilities\n \"padding\": (\n responsive: true,\n property: padding,\n class: p,\n values: $spacers\n ),\n \"padding-x\": (\n responsive: true,\n property: padding-right padding-left,\n class: px,\n values: $spacers\n ),\n \"padding-y\": (\n responsive: true,\n property: padding-top padding-bottom,\n class: py,\n values: $spacers\n ),\n \"padding-top\": (\n responsive: true,\n property: padding-top,\n class: pt,\n values: $spacers\n ),\n \"padding-end\": (\n responsive: true,\n property: padding-right,\n class: pe,\n values: $spacers\n ),\n \"padding-bottom\": (\n responsive: true,\n property: padding-bottom,\n class: pb,\n values: $spacers\n ),\n \"padding-start\": (\n responsive: true,\n property: padding-left,\n class: ps,\n values: $spacers\n ),\n // Gap utility\n \"gap\": (\n responsive: true,\n property: gap,\n class: gap,\n values: $spacers\n ),\n // scss-docs-end utils-spacing\n // Text\n // scss-docs-start utils-text\n \"font-family\": (\n property: font-family,\n class: font,\n values: (monospace: var(--#{$prefix}font-monospace))\n ),\n \"font-size\": (\n rfs: true,\n property: font-size,\n class: fs,\n values: $font-sizes\n ),\n \"font-style\": (\n property: font-style,\n class: fst,\n values: italic normal\n ),\n \"font-weight\": (\n property: font-weight,\n class: fw,\n values: (\n light: $font-weight-light,\n lighter: $font-weight-lighter,\n normal: $font-weight-normal,\n bold: $font-weight-bold,\n semibold: $font-weight-semibold,\n bolder: $font-weight-bolder\n )\n ),\n \"line-height\": (\n property: line-height,\n class: lh,\n values: (\n 1: 1,\n sm: $line-height-sm,\n base: $line-height-base,\n lg: $line-height-lg,\n )\n ),\n \"text-align\": (\n responsive: true,\n property: text-align,\n class: text,\n values: (\n start: left,\n end: right,\n center: center,\n )\n ),\n \"text-decoration\": (\n property: text-decoration,\n values: none underline line-through\n ),\n \"text-transform\": (\n property: text-transform,\n class: text,\n values: lowercase uppercase capitalize\n ),\n \"white-space\": (\n property: white-space,\n class: text,\n values: (\n wrap: normal,\n nowrap: nowrap,\n )\n ),\n \"word-wrap\": (\n property: word-wrap word-break,\n class: text,\n values: (break: break-word),\n rtl: false\n ),\n // scss-docs-end utils-text\n // scss-docs-start utils-color\n \"color\": (\n property: color,\n class: text,\n local-vars: (\n \"text-opacity\": 1\n ),\n values: map-merge(\n $utilities-text-colors,\n (\n \"muted\": $text-muted,\n \"black-50\": rgba($black, .5), // deprecated\n \"white-50\": rgba($white, .5), // deprecated\n \"reset\": inherit,\n )\n )\n ),\n \"text-opacity\": (\n css-var: true,\n class: text-opacity,\n values: (\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1\n )\n ),\n // scss-docs-end utils-color\n // scss-docs-start utils-bg-color\n \"background-color\": (\n property: background-color,\n class: bg,\n local-vars: (\n \"bg-opacity\": 1\n ),\n values: map-merge(\n $utilities-bg-colors,\n (\n \"transparent\": transparent\n )\n )\n ),\n \"bg-opacity\": (\n css-var: true,\n class: bg-opacity,\n values: (\n 10: .1,\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1\n )\n ),\n // scss-docs-end utils-bg-color\n \"gradient\": (\n property: background-image,\n class: bg,\n values: (gradient: var(--#{$prefix}gradient))\n ),\n // scss-docs-start utils-interaction\n \"user-select\": (\n property: user-select,\n values: all auto none\n ),\n \"pointer-events\": (\n property: pointer-events,\n class: pe,\n values: none auto,\n ),\n // scss-docs-end utils-interaction\n // scss-docs-start utils-border-radius\n \"rounded\": (\n property: border-radius,\n class: rounded,\n values: (\n null: var(--#{$prefix}border-radius),\n 0: 0,\n 1: var(--#{$prefix}border-radius-sm),\n 2: var(--#{$prefix}border-radius),\n 3: var(--#{$prefix}border-radius-lg),\n 4: var(--#{$prefix}border-radius-xl),\n 5: var(--#{$prefix}border-radius-2xl),\n circle: 50%,\n pill: var(--#{$prefix}border-radius-pill)\n )\n ),\n \"rounded-top\": (\n property: border-top-left-radius border-top-right-radius,\n class: rounded-top,\n values: (null: var(--#{$prefix}border-radius))\n ),\n \"rounded-end\": (\n property: border-top-right-radius border-bottom-right-radius,\n class: rounded-end,\n values: (null: var(--#{$prefix}border-radius))\n ),\n \"rounded-bottom\": (\n property: border-bottom-right-radius border-bottom-left-radius,\n class: rounded-bottom,\n values: (null: var(--#{$prefix}border-radius))\n ),\n \"rounded-start\": (\n property: border-bottom-left-radius border-top-left-radius,\n class: rounded-start,\n values: (null: var(--#{$prefix}border-radius))\n ),\n // scss-docs-end utils-border-radius\n // scss-docs-start utils-visibility\n \"visibility\": (\n property: visibility,\n class: null,\n values: (\n visible: visible,\n invisible: hidden,\n )\n )\n // scss-docs-end utils-visibility\n ),\n $utilities\n);\n", + "/*!\n * Bootstrap v5.2.0-beta1 (https://getbootstrap.com/)\n * Copyright 2011-2022 The Bootstrap Authors\n * Copyright 2011-2022 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n */\n\n// scss-docs-start import-stack\n// Configuration\n@import \"functions\";\n@import \"variables\";\n@import \"maps\";\n@import \"mixins\";\n@import \"utilities\";\n\n// Layout & components\n@import \"root\";\n@import \"reboot\";\n@import \"type\";\n@import \"images\";\n@import \"containers\";\n@import \"grid\";\n@import \"tables\";\n@import \"forms\";\n@import \"buttons\";\n@import \"transitions\";\n@import \"dropdown\";\n@import \"button-group\";\n@import \"nav\";\n@import \"navbar\";\n@import \"card\";\n@import \"accordion\";\n@import \"breadcrumb\";\n@import \"pagination\";\n@import \"badge\";\n@import \"alert\";\n@import \"progress\";\n@import \"list-group\";\n@import \"close\";\n@import \"toasts\";\n@import \"modal\";\n@import \"tooltip\";\n@import \"popover\";\n@import \"carousel\";\n@import \"spinners\";\n@import \"offcanvas\";\n@import \"placeholders\";\n\n// Helpers\n@import \"helpers\";\n\n// Utilities\n@import \"utilities/api\";\n// scss-docs-end import-stack\n", + "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n $prev-key: null;\n $prev-num: null;\n @each $key, $num in $map {\n @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n // Do nothing\n } @else if not comparable($prev-num, $num) {\n @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n } @else if $prev-num >= $num {\n @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n }\n $prev-key: $key;\n $prev-num: $num;\n }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n @if length($map) > 0 {\n $values: map-values($map);\n $first-value: nth($values, 1);\n @if $first-value != 0 {\n @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n }\n }\n}\n\n// Colors\n@function to-rgb($value) {\n @return red($value), green($value), blue($value);\n}\n\n// stylelint-disable scss/dollar-variable-pattern\n@function rgba-css-var($identifier, $target) {\n @if $identifier == \"body\" and $target == \"bg\" {\n @return rgba(var(--#{$prefix}#{$identifier}-bg-rgb), var(--#{$prefix}#{$target}-opacity));\n } @if $identifier == \"body\" and $target == \"text\" {\n @return rgba(var(--#{$prefix}#{$identifier}-color-rgb), var(--#{$prefix}#{$target}-opacity));\n } @else {\n @return rgba(var(--#{$prefix}#{$identifier}-rgb), var(--#{$prefix}#{$target}-opacity));\n }\n}\n\n@function map-loop($map, $func, $args...) {\n $_map: ();\n\n @each $key, $value in $map {\n // allow to pass the $key and $value of the map as an function argument\n $_args: ();\n @each $arg in $args {\n $_args: append($_args, if($arg == \"$key\", $key, if($arg == \"$value\", $value, $arg)));\n }\n\n $_map: map-merge($_map, ($key: call(get-function($func), $_args...)));\n }\n\n @return $_map;\n}\n// stylelint-enable scss/dollar-variable-pattern\n\n@function varify($list) {\n $result: null;\n @each $entry in $list {\n $result: append($result, var(--#{$prefix}#{$entry}), space);\n }\n @return $result;\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n $result: ();\n @each $key, $value in $map {\n @if $key != 0 {\n $result: map-merge($result, (\"n\" + $key: (-$value)));\n }\n }\n @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n $result: ();\n @each $key, $value in $map {\n @if (index($values, $key) != null) {\n $result: map-merge($result, ($key: $value));\n }\n }\n @return $result;\n}\n\n// Merge multiple maps\n@function map-merge-multiple($maps...) {\n $merged-maps: ();\n\n @each $map in $maps {\n $merged-maps: map-merge($merged-maps, $map);\n }\n @return $merged-maps;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n $index: str-index($string, $search);\n\n @if $index {\n @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n }\n\n @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n @if str-index($string, \"data:image/svg+xml\") {\n @each $char, $encoded in $escaped-characters {\n // Do not escape the url brackets\n @if str-index($string, \"url(\") == 1 {\n $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n } @else {\n $string: str-replace($string, $char, $encoded);\n }\n }\n }\n\n @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n $max-ratio: 0;\n $max-ratio-color: null;\n\n @each $color in $foregrounds {\n $contrast-ratio: contrast-ratio($background, $color);\n @if $contrast-ratio > $min-contrast-ratio {\n @return $color;\n } @else if $contrast-ratio > $max-ratio {\n $max-ratio: $contrast-ratio;\n $max-ratio-color: $color;\n }\n }\n\n @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n $l1: luminance($background);\n $l2: luminance(opaque($background, $foreground));\n\n @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n $rgb: (\n \"r\": red($color),\n \"g\": green($color),\n \"b\": blue($color)\n );\n\n @each $name, $value in $rgb {\n $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));\n $rgb: map-merge($rgb, ($name: $value));\n }\n\n @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n @if $value1 == null {\n @return $value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 + $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n @if $value1 == null and $value2 == null {\n @return null;\n }\n\n @if $value1 == null {\n @return -$value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 - $value2;\n }\n\n @if type-of($value2) != number {\n $value2: unquote(\"(\") + $value2 + unquote(\")\");\n }\n\n @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n\n@function divide($dividend, $divisor, $precision: 10) {\n $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n $dividend: abs($dividend);\n $divisor: abs($divisor);\n @if $dividend == 0 {\n @return 0;\n }\n @if $divisor == 0 {\n @error \"Cannot divide by 0\";\n }\n $remainder: $dividend;\n $result: 0;\n $factor: 10;\n @while ($remainder > 0 and $precision >= 0) {\n $quotient: 0;\n @while ($remainder >= $divisor) {\n $remainder: $remainder - $divisor;\n $quotient: $quotient + 1;\n }\n $result: $result * 10 + $quotient;\n $factor: $factor * .1;\n $remainder: $remainder * 10;\n $precision: $precision - 1;\n @if ($precision < 0 and $remainder >= $divisor * 5) {\n $result: $result + 1;\n }\n }\n $result: $result * $factor * $sign;\n $dividend-unit: unit($dividend);\n $divisor-unit: unit($divisor);\n $unit-map: (\n \"px\": 1px,\n \"rem\": 1rem,\n \"em\": 1em,\n \"%\": 1%\n );\n @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n $result: $result * map-get($unit-map, $dividend-unit);\n }\n @return $result;\n}\n", + "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// Color system\n\n// scss-docs-start gray-color-variables\n$white: #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black: #000 !default;\n// scss-docs-end gray-color-variables\n\n// fusv-disable\n// scss-docs-start gray-colors-map\n$grays: (\n \"100\": $gray-100,\n \"200\": $gray-200,\n \"300\": $gray-300,\n \"400\": $gray-400,\n \"500\": $gray-500,\n \"600\": $gray-600,\n \"700\": $gray-700,\n \"800\": $gray-800,\n \"900\": $gray-900\n) !default;\n// scss-docs-end gray-colors-map\n// fusv-enable\n\n// scss-docs-start color-variables\n$blue: #0d6efd !default;\n$indigo: #6610f2 !default;\n$purple: #6f42c1 !default;\n$pink: #d63384 !default;\n$red: #dc3545 !default;\n$orange: #fd7e14 !default;\n$yellow: #ffc107 !default;\n$green: #198754 !default;\n$teal: #20c997 !default;\n$cyan: #0dcaf0 !default;\n// scss-docs-end color-variables\n\n// scss-docs-start colors-map\n$colors: (\n \"blue\": $blue,\n \"indigo\": $indigo,\n \"purple\": $purple,\n \"pink\": $pink,\n \"red\": $red,\n \"orange\": $orange,\n \"yellow\": $yellow,\n \"green\": $green,\n \"teal\": $teal,\n \"cyan\": $cyan,\n \"black\": $black,\n \"white\": $white,\n \"gray\": $gray-600,\n \"gray-dark\": $gray-800\n) !default;\n// scss-docs-end colors-map\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio: 4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark: $black !default;\n$color-contrast-light: $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 80%) !default;\n$blue-200: tint-color($blue, 60%) !default;\n$blue-300: tint-color($blue, 40%) !default;\n$blue-400: tint-color($blue, 20%) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 20%) !default;\n$blue-700: shade-color($blue, 40%) !default;\n$blue-800: shade-color($blue, 60%) !default;\n$blue-900: shade-color($blue, 80%) !default;\n\n$indigo-100: tint-color($indigo, 80%) !default;\n$indigo-200: tint-color($indigo, 60%) !default;\n$indigo-300: tint-color($indigo, 40%) !default;\n$indigo-400: tint-color($indigo, 20%) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 20%) !default;\n$indigo-700: shade-color($indigo, 40%) !default;\n$indigo-800: shade-color($indigo, 60%) !default;\n$indigo-900: shade-color($indigo, 80%) !default;\n\n$purple-100: tint-color($purple, 80%) !default;\n$purple-200: tint-color($purple, 60%) !default;\n$purple-300: tint-color($purple, 40%) !default;\n$purple-400: tint-color($purple, 20%) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 20%) !default;\n$purple-700: shade-color($purple, 40%) !default;\n$purple-800: shade-color($purple, 60%) !default;\n$purple-900: shade-color($purple, 80%) !default;\n\n$pink-100: tint-color($pink, 80%) !default;\n$pink-200: tint-color($pink, 60%) !default;\n$pink-300: tint-color($pink, 40%) !default;\n$pink-400: tint-color($pink, 20%) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 20%) !default;\n$pink-700: shade-color($pink, 40%) !default;\n$pink-800: shade-color($pink, 60%) !default;\n$pink-900: shade-color($pink, 80%) !default;\n\n$red-100: tint-color($red, 80%) !default;\n$red-200: tint-color($red, 60%) !default;\n$red-300: tint-color($red, 40%) !default;\n$red-400: tint-color($red, 20%) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 20%) !default;\n$red-700: shade-color($red, 40%) !default;\n$red-800: shade-color($red, 60%) !default;\n$red-900: shade-color($red, 80%) !default;\n\n$orange-100: tint-color($orange, 80%) !default;\n$orange-200: tint-color($orange, 60%) !default;\n$orange-300: tint-color($orange, 40%) !default;\n$orange-400: tint-color($orange, 20%) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 20%) !default;\n$orange-700: shade-color($orange, 40%) !default;\n$orange-800: shade-color($orange, 60%) !default;\n$orange-900: shade-color($orange, 80%) !default;\n\n$yellow-100: tint-color($yellow, 80%) !default;\n$yellow-200: tint-color($yellow, 60%) !default;\n$yellow-300: tint-color($yellow, 40%) !default;\n$yellow-400: tint-color($yellow, 20%) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 20%) !default;\n$yellow-700: shade-color($yellow, 40%) !default;\n$yellow-800: shade-color($yellow, 60%) !default;\n$yellow-900: shade-color($yellow, 80%) !default;\n\n$green-100: tint-color($green, 80%) !default;\n$green-200: tint-color($green, 60%) !default;\n$green-300: tint-color($green, 40%) !default;\n$green-400: tint-color($green, 20%) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 20%) !default;\n$green-700: shade-color($green, 40%) !default;\n$green-800: shade-color($green, 60%) !default;\n$green-900: shade-color($green, 80%) !default;\n\n$teal-100: tint-color($teal, 80%) !default;\n$teal-200: tint-color($teal, 60%) !default;\n$teal-300: tint-color($teal, 40%) !default;\n$teal-400: tint-color($teal, 20%) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 20%) !default;\n$teal-700: shade-color($teal, 40%) !default;\n$teal-800: shade-color($teal, 60%) !default;\n$teal-900: shade-color($teal, 80%) !default;\n\n$cyan-100: tint-color($cyan, 80%) !default;\n$cyan-200: tint-color($cyan, 60%) !default;\n$cyan-300: tint-color($cyan, 40%) !default;\n$cyan-400: tint-color($cyan, 20%) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 20%) !default;\n$cyan-700: shade-color($cyan, 40%) !default;\n$cyan-800: shade-color($cyan, 60%) !default;\n$cyan-900: shade-color($cyan, 80%) !default;\n\n$blues: (\n \"blue-100\": $blue-100,\n \"blue-200\": $blue-200,\n \"blue-300\": $blue-300,\n \"blue-400\": $blue-400,\n \"blue-500\": $blue-500,\n \"blue-600\": $blue-600,\n \"blue-700\": $blue-700,\n \"blue-800\": $blue-800,\n \"blue-900\": $blue-900\n) !default;\n\n$indigos: (\n \"indigo-100\": $indigo-100,\n \"indigo-200\": $indigo-200,\n \"indigo-300\": $indigo-300,\n \"indigo-400\": $indigo-400,\n \"indigo-500\": $indigo-500,\n \"indigo-600\": $indigo-600,\n \"indigo-700\": $indigo-700,\n \"indigo-800\": $indigo-800,\n \"indigo-900\": $indigo-900\n) !default;\n\n$purples: (\n \"purple-100\": $purple-100,\n \"purple-200\": $purple-200,\n \"purple-300\": $purple-300,\n \"purple-400\": $purple-400,\n \"purple-500\": $purple-500,\n \"purple-600\": $purple-600,\n \"purple-700\": $purple-700,\n \"purple-800\": $purple-800,\n \"purple-900\": $purple-900\n) !default;\n\n$pinks: (\n \"pink-100\": $pink-100,\n \"pink-200\": $pink-200,\n \"pink-300\": $pink-300,\n \"pink-400\": $pink-400,\n \"pink-500\": $pink-500,\n \"pink-600\": $pink-600,\n \"pink-700\": $pink-700,\n \"pink-800\": $pink-800,\n \"pink-900\": $pink-900\n) !default;\n\n$reds: (\n \"red-100\": $red-100,\n \"red-200\": $red-200,\n \"red-300\": $red-300,\n \"red-400\": $red-400,\n \"red-500\": $red-500,\n \"red-600\": $red-600,\n \"red-700\": $red-700,\n \"red-800\": $red-800,\n \"red-900\": $red-900\n) !default;\n\n$oranges: (\n \"orange-100\": $orange-100,\n \"orange-200\": $orange-200,\n \"orange-300\": $orange-300,\n \"orange-400\": $orange-400,\n \"orange-500\": $orange-500,\n \"orange-600\": $orange-600,\n \"orange-700\": $orange-700,\n \"orange-800\": $orange-800,\n \"orange-900\": $orange-900\n) !default;\n\n$yellows: (\n \"yellow-100\": $yellow-100,\n \"yellow-200\": $yellow-200,\n \"yellow-300\": $yellow-300,\n \"yellow-400\": $yellow-400,\n \"yellow-500\": $yellow-500,\n \"yellow-600\": $yellow-600,\n \"yellow-700\": $yellow-700,\n \"yellow-800\": $yellow-800,\n \"yellow-900\": $yellow-900\n) !default;\n\n$greens: (\n \"green-100\": $green-100,\n \"green-200\": $green-200,\n \"green-300\": $green-300,\n \"green-400\": $green-400,\n \"green-500\": $green-500,\n \"green-600\": $green-600,\n \"green-700\": $green-700,\n \"green-800\": $green-800,\n \"green-900\": $green-900\n) !default;\n\n$teals: (\n \"teal-100\": $teal-100,\n \"teal-200\": $teal-200,\n \"teal-300\": $teal-300,\n \"teal-400\": $teal-400,\n \"teal-500\": $teal-500,\n \"teal-600\": $teal-600,\n \"teal-700\": $teal-700,\n \"teal-800\": $teal-800,\n \"teal-900\": $teal-900\n) !default;\n\n$cyans: (\n \"cyan-100\": $cyan-100,\n \"cyan-200\": $cyan-200,\n \"cyan-300\": $cyan-300,\n \"cyan-400\": $cyan-400,\n \"cyan-500\": $cyan-500,\n \"cyan-600\": $cyan-600,\n \"cyan-700\": $cyan-700,\n \"cyan-800\": $cyan-800,\n \"cyan-900\": $cyan-900\n) !default;\n// fusv-enable\n\n// scss-docs-start theme-color-variables\n$primary: $blue !default;\n$secondary: $gray-600 !default;\n$success: $green !default;\n$info: $cyan !default;\n$warning: $yellow !default;\n$danger: $red !default;\n$light: $gray-100 !default;\n$dark: $gray-900 !default;\n// scss-docs-end theme-color-variables\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n \"primary\": $primary,\n \"secondary\": $secondary,\n \"success\": $success,\n \"info\": $info,\n \"warning\": $warning,\n \"danger\": $danger,\n \"light\": $light,\n \"dark\": $dark\n) !default;\n// scss-docs-end theme-colors-map\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n (\"<\", \"%3c\"),\n (\">\", \"%3e\"),\n (\"#\", \"%23\"),\n (\"(\", \"%28\"),\n (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret: true !default;\n$enable-rounded: true !default;\n$enable-shadows: false !default;\n$enable-gradients: false !default;\n$enable-transitions: true !default;\n$enable-reduced-motion: true !default;\n$enable-smooth-scroll: true !default;\n$enable-grid-classes: true !default;\n$enable-container-classes: true !default;\n$enable-cssgrid: false !default;\n$enable-button-pointers: true !default;\n$enable-rfs: true !default;\n$enable-validation-icons: true !default;\n$enable-negative-margins: false !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities: true !default;\n\n// Prefix for :root CSS variables\n\n$variable-prefix: bs- !default; // Deprecated in v5.2.0 for the shorter `$prefix`\n$prefix: $variable-prefix !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n// scss-docs-start variable-gradient\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n// scss-docs-end variable-gradient\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n// scss-docs-start spacer-variables-maps\n$spacer: 1rem !default;\n$spacers: (\n 0: 0,\n 1: $spacer * .25,\n 2: $spacer * .5,\n 3: $spacer,\n 4: $spacer * 1.5,\n 5: $spacer * 3,\n) !default;\n// scss-docs-end spacer-variables-maps\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n// scss-docs-start position-map\n$position-values: (\n 0: 0,\n 50: 50%,\n 100: 100%\n) !default;\n// scss-docs-end position-map\n\n// Body\n//\n// Settings for the `` element.\n\n$body-bg: $white !default;\n$body-color: $gray-900 !default;\n$body-text-align: null !default;\n\n// Links\n//\n// Style anchor elements.\n\n$link-color: $primary !default;\n$link-decoration: underline !default;\n$link-shade-percentage: 20% !default;\n$link-hover-color: shift-color($link-color, $link-shade-percentage) !default;\n$link-hover-decoration: null !default;\n\n$stretched-link-pseudo-element: after !default;\n$stretched-link-z-index: 1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom: 1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n sm: 540px,\n md: 720px,\n lg: 960px,\n xl: 1140px,\n xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns: 12 !default;\n$grid-gutter-width: 1.5rem !default;\n$grid-row-columns: 6 !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n// scss-docs-start border-variables\n$border-width: 1px !default;\n$border-widths: (\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n) !default;\n\n$border-style: solid !default;\n$border-color: $gray-300 !default;\n$border-color-translucent: rgba($black, .175) !default;\n// scss-docs-end border-variables\n\n// scss-docs-start border-radius-variables\n$border-radius: .375rem !default;\n$border-radius-sm: .25rem !default;\n$border-radius-lg: .5rem !default;\n$border-radius-xl: 1rem !default;\n$border-radius-2xl: 2rem !default;\n$border-radius-pill: 50rem !default;\n// scss-docs-end border-radius-variables\n\n// scss-docs-start box-shadow-variables\n$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;\n$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;\n$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;\n$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;\n// scss-docs-end box-shadow-variables\n\n$component-active-color: $white !default;\n$component-active-bg: $primary !default;\n\n// scss-docs-start caret-variables\n$caret-width: .3em !default;\n$caret-vertical-align: $caret-width * .85 !default;\n$caret-spacing: $caret-width * .85 !default;\n// scss-docs-end caret-variables\n\n$transition-base: all .2s ease-in-out !default;\n$transition-fade: opacity .15s linear !default;\n// scss-docs-start collapse-transition\n$transition-collapse: height .35s ease !default;\n$transition-collapse-width: width .35s ease !default;\n// scss-docs-end collapse-transition\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n \"1x1\": 100%,\n \"4x3\": calc(3 / 4 * 100%),\n \"16x9\": calc(9 / 16 * 100%),\n \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// scss-docs-start font-variables\n// stylelint-disable value-keyword-case\n$font-family-sans-serif: system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\" !default;\n$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n// stylelint-enable value-keyword-case\n$font-family-base: var(--#{$prefix}font-sans-serif) !default;\n$font-family-code: var(--#{$prefix}font-monospace) !default;\n\n// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins\n// $font-size-base affects the font size of the body text\n$font-size-root: null !default;\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$font-size-sm: $font-size-base * .875 !default;\n$font-size-lg: $font-size-base * 1.25 !default;\n\n$font-weight-lighter: lighter !default;\n$font-weight-light: 300 !default;\n$font-weight-normal: 400 !default;\n$font-weight-semibold: 600 !default;\n$font-weight-bold: 700 !default;\n$font-weight-bolder: bolder !default;\n\n$font-weight-base: $font-weight-normal !default;\n\n$line-height-base: 1.5 !default;\n$line-height-sm: 1.25 !default;\n$line-height-lg: 2 !default;\n\n$h1-font-size: $font-size-base * 2.5 !default;\n$h2-font-size: $font-size-base * 2 !default;\n$h3-font-size: $font-size-base * 1.75 !default;\n$h4-font-size: $font-size-base * 1.5 !default;\n$h5-font-size: $font-size-base * 1.25 !default;\n$h6-font-size: $font-size-base !default;\n// scss-docs-end font-variables\n\n// scss-docs-start font-sizes\n$font-sizes: (\n 1: $h1-font-size,\n 2: $h2-font-size,\n 3: $h3-font-size,\n 4: $h4-font-size,\n 5: $h5-font-size,\n 6: $h6-font-size\n) !default;\n// scss-docs-end font-sizes\n\n// scss-docs-start headings-variables\n$headings-margin-bottom: $spacer * .5 !default;\n$headings-font-family: null !default;\n$headings-font-style: null !default;\n$headings-font-weight: 500 !default;\n$headings-line-height: 1.2 !default;\n$headings-color: null !default;\n// scss-docs-end headings-variables\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n 1: 5rem,\n 2: 4.5rem,\n 3: 4rem,\n 4: 3.5rem,\n 5: 3rem,\n 6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n// scss-docs-start type-variables\n$lead-font-size: $font-size-base * 1.25 !default;\n$lead-font-weight: 300 !default;\n\n$small-font-size: .875em !default;\n\n$sub-sup-font-size: .75em !default;\n\n$text-muted: rgba(var(--#{$prefix}body-color-rgb), .75) !default;\n\n$initialism-font-size: $small-font-size !default;\n\n$blockquote-margin-y: $spacer !default;\n$blockquote-font-size: $font-size-base * 1.25 !default;\n$blockquote-footer-color: $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y: $spacer !default;\n$hr-color: inherit !default;\n\n// fusv-disable\n$hr-bg-color: null !default; // Deprecated in v5.2.0\n$hr-height: null !default; // Deprecated in v5.2.0\n// fusv-enable\n\n$hr-border-color: null !default; // Allows for inherited colors\n$hr-border-width: $border-width !default;\n$hr-opacity: .25 !default;\n\n$legend-margin-bottom: .5rem !default;\n$legend-font-size: 1.5rem !default;\n$legend-font-weight: null !default;\n\n$dt-font-weight: $font-weight-bold !default;\n\n$list-inline-padding: .5rem !default;\n\n$mark-padding: .1875em !default;\n$mark-bg: $yellow-100 !default;\n// scss-docs-end type-variables\n\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n\n// scss-docs-start table-variables\n$table-cell-padding-y: .5rem !default;\n$table-cell-padding-x: .5rem !default;\n$table-cell-padding-y-sm: .25rem !default;\n$table-cell-padding-x-sm: .25rem !default;\n\n$table-cell-vertical-align: top !default;\n\n$table-color: var(--#{$prefix}body-color) !default;\n$table-bg: transparent !default;\n$table-accent-bg: transparent !default;\n\n$table-th-font-weight: null !default;\n\n$table-striped-color: $table-color !default;\n$table-striped-bg-factor: .05 !default;\n$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color: $table-color !default;\n$table-active-bg-factor: .1 !default;\n$table-active-bg: rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color: $table-color !default;\n$table-hover-bg-factor: .075 !default;\n$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor: .1 !default;\n$table-border-width: $border-width !default;\n$table-border-color: var(--#{$prefix}border-color) !default;\n\n$table-striped-order: odd !default;\n$table-striped-columns-order: even !default;\n\n$table-group-separator-color: currentcolor !default;\n\n$table-caption-color: $text-muted !default;\n\n$table-bg-scale: -80% !default;\n// scss-docs-end table-variables\n\n// scss-docs-start table-loop\n$table-variants: (\n \"primary\": shift-color($primary, $table-bg-scale),\n \"secondary\": shift-color($secondary, $table-bg-scale),\n \"success\": shift-color($success, $table-bg-scale),\n \"info\": shift-color($info, $table-bg-scale),\n \"warning\": shift-color($warning, $table-bg-scale),\n \"danger\": shift-color($danger, $table-bg-scale),\n \"light\": $light,\n \"dark\": $dark,\n) !default;\n// scss-docs-end table-loop\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n// scss-docs-start input-btn-variables\n$input-btn-padding-y: .375rem !default;\n$input-btn-padding-x: .75rem !default;\n$input-btn-font-family: null !default;\n$input-btn-font-size: $font-size-base !default;\n$input-btn-line-height: $line-height-base !default;\n\n$input-btn-focus-width: .25rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-blur: 0 !default;\n$input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm: .25rem !default;\n$input-btn-padding-x-sm: .5rem !default;\n$input-btn-font-size-sm: $font-size-sm !default;\n\n$input-btn-padding-y-lg: .5rem !default;\n$input-btn-padding-x-lg: 1rem !default;\n$input-btn-font-size-lg: $font-size-lg !default;\n\n$input-btn-border-width: $border-width !default;\n// scss-docs-end input-btn-variables\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n// scss-docs-start btn-variables\n$btn-padding-y: $input-btn-padding-y !default;\n$btn-padding-x: $input-btn-padding-x !default;\n$btn-font-family: $input-btn-font-family !default;\n$btn-font-size: $input-btn-font-size !default;\n$btn-line-height: $input-btn-line-height !default;\n$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-padding-y-sm: $input-btn-padding-y-sm !default;\n$btn-padding-x-sm: $input-btn-padding-x-sm !default;\n$btn-font-size-sm: $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg: $input-btn-padding-y-lg !default;\n$btn-padding-x-lg: $input-btn-padding-x-lg !default;\n$btn-font-size-lg: $input-btn-font-size-lg !default;\n\n$btn-border-width: $input-btn-border-width !default;\n\n$btn-font-weight: $font-weight-normal !default;\n$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;\n$btn-focus-width: $input-btn-focus-width !default;\n$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$btn-disabled-opacity: .65 !default;\n$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;\n\n$btn-link-color: var(--#{$prefix}link-color) !default;\n$btn-link-hover-color: var(--#{$prefix}link-hover-color) !default;\n$btn-link-disabled-color: $gray-600 !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: $border-radius !default;\n$btn-border-radius-sm: $border-radius-sm !default;\n$btn-border-radius-lg: $border-radius-lg !default;\n\n$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$btn-hover-bg-shade-amount: 15% !default;\n$btn-hover-bg-tint-amount: 15% !default;\n$btn-hover-border-shade-amount: 20% !default;\n$btn-hover-border-tint-amount: 10% !default;\n$btn-active-bg-shade-amount: 20% !default;\n$btn-active-bg-tint-amount: 20% !default;\n$btn-active-border-shade-amount: 25% !default;\n$btn-active-border-tint-amount: 10% !default;\n// scss-docs-end btn-variables\n\n\n// Forms\n\n// scss-docs-start form-text-variables\n$form-text-margin-top: .25rem !default;\n$form-text-font-size: $small-font-size !default;\n$form-text-font-style: null !default;\n$form-text-font-weight: null !default;\n$form-text-color: $text-muted !default;\n// scss-docs-end form-text-variables\n\n// scss-docs-start form-label-variables\n$form-label-margin-bottom: .5rem !default;\n$form-label-font-size: null !default;\n$form-label-font-style: null !default;\n$form-label-font-weight: null !default;\n$form-label-color: null !default;\n// scss-docs-end form-label-variables\n\n// scss-docs-start form-input-variables\n$input-padding-y: $input-btn-padding-y !default;\n$input-padding-x: $input-btn-padding-x !default;\n$input-font-family: $input-btn-font-family !default;\n$input-font-size: $input-btn-font-size !default;\n$input-font-weight: $font-weight-base !default;\n$input-line-height: $input-btn-line-height !default;\n\n$input-padding-y-sm: $input-btn-padding-y-sm !default;\n$input-padding-x-sm: $input-btn-padding-x-sm !default;\n$input-font-size-sm: $input-btn-font-size-sm !default;\n\n$input-padding-y-lg: $input-btn-padding-y-lg !default;\n$input-padding-x-lg: $input-btn-padding-x-lg !default;\n$input-font-size-lg: $input-btn-font-size-lg !default;\n\n$input-bg: $body-bg !default;\n$input-disabled-color: null !default;\n$input-disabled-bg: $gray-200 !default;\n$input-disabled-border-color: null !default;\n\n$input-color: $body-color !default;\n$input-border-color: $gray-400 !default;\n$input-border-width: $input-btn-border-width !default;\n$input-box-shadow: $box-shadow-inset !default;\n\n$input-border-radius: $border-radius !default;\n$input-border-radius-sm: $border-radius-sm !default;\n$input-border-radius-lg: $border-radius-lg !default;\n\n$input-focus-bg: $input-bg !default;\n$input-focus-border-color: tint-color($component-active-bg, 50%) !default;\n$input-focus-color: $input-color !default;\n$input-focus-width: $input-btn-focus-width !default;\n$input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$input-placeholder-color: $gray-600 !default;\n$input-plaintext-color: $body-color !default;\n\n$input-height-border: $input-border-width * 2 !default;\n\n$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;\n$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;\n$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !default;\n\n$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;\n$input-height-sm: add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;\n$input-height-lg: add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;\n\n$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-color-width: 3rem !default;\n// scss-docs-end form-input-variables\n\n// scss-docs-start form-check-variables\n$form-check-input-width: 1em !default;\n$form-check-min-height: $font-size-base * $line-height-base !default;\n$form-check-padding-start: $form-check-input-width + .5em !default;\n$form-check-margin-bottom: .125rem !default;\n$form-check-label-color: null !default;\n$form-check-label-cursor: null !default;\n$form-check-transition: null !default;\n\n$form-check-input-active-filter: brightness(90%) !default;\n\n$form-check-input-bg: $input-bg !default;\n$form-check-input-border: 1px solid rgba($black, .25) !default;\n$form-check-input-border-radius: .25em !default;\n$form-check-radio-border-radius: 50% !default;\n$form-check-input-focus-border: $input-focus-border-color !default;\n$form-check-input-focus-box-shadow: $input-btn-focus-box-shadow !default;\n\n$form-check-input-checked-color: $component-active-color !default;\n$form-check-input-checked-bg-color: $component-active-bg !default;\n$form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-check-radio-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-indeterminate-color: $component-active-color !default;\n$form-check-input-indeterminate-bg-color: $component-active-bg !default;\n$form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-check-input-disabled-opacity: .5 !default;\n$form-check-label-disabled-opacity: $form-check-input-disabled-opacity !default;\n$form-check-btn-check-disabled-opacity: $btn-disabled-opacity !default;\n\n$form-check-inline-margin-end: 1rem !default;\n// scss-docs-end form-check-variables\n\n// scss-docs-start form-switch-variables\n$form-switch-color: rgba($black, .25) !default;\n$form-switch-width: 2em !default;\n$form-switch-padding-start: $form-switch-width + .5em !default;\n$form-switch-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-border-radius: $form-switch-width !default;\n$form-switch-transition: background-position .15s ease-in-out !default;\n\n$form-switch-focus-color: $input-focus-border-color !default;\n$form-switch-focus-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-switch-checked-color: $component-active-color !default;\n$form-switch-checked-bg-image: url(\"data:image/svg+xml,\") !default;\n$form-switch-checked-bg-position: right center !default;\n// scss-docs-end form-switch-variables\n\n// scss-docs-start input-group-variables\n$input-group-addon-padding-y: $input-padding-y !default;\n$input-group-addon-padding-x: $input-padding-x !default;\n$input-group-addon-font-weight: $input-font-weight !default;\n$input-group-addon-color: $input-color !default;\n$input-group-addon-bg: $gray-200 !default;\n$input-group-addon-border-color: $input-border-color !default;\n// scss-docs-end input-group-variables\n\n// scss-docs-start form-select-variables\n$form-select-padding-y: $input-padding-y !default;\n$form-select-padding-x: $input-padding-x !default;\n$form-select-font-family: $input-font-family !default;\n$form-select-font-size: $input-font-size !default;\n$form-select-indicator-padding: $form-select-padding-x * 3 !default; // Extra padding for background-image\n$form-select-font-weight: $input-font-weight !default;\n$form-select-line-height: $input-line-height !default;\n$form-select-color: $input-color !default;\n$form-select-bg: $input-bg !default;\n$form-select-disabled-color: null !default;\n$form-select-disabled-bg: $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position: right $form-select-padding-x center !default;\n$form-select-bg-size: 16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color: $gray-800 !default;\n$form-select-indicator: url(\"data:image/svg+xml,\") !default;\n\n$form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default;\n$form-select-feedback-icon-position: center right $form-select-indicator-padding !default;\n$form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width: $input-border-width !default;\n$form-select-border-color: $input-border-color !default;\n$form-select-border-radius: $input-border-radius !default;\n$form-select-box-shadow: $box-shadow-inset !default;\n\n$form-select-focus-border-color: $input-focus-border-color !default;\n$form-select-focus-width: $input-focus-width !default;\n$form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focus-color !default;\n\n$form-select-padding-y-sm: $input-padding-y-sm !default;\n$form-select-padding-x-sm: $input-padding-x-sm !default;\n$form-select-font-size-sm: $input-font-size-sm !default;\n$form-select-border-radius-sm: $input-border-radius-sm !default;\n\n$form-select-padding-y-lg: $input-padding-y-lg !default;\n$form-select-padding-x-lg: $input-padding-x-lg !default;\n$form-select-font-size-lg: $input-font-size-lg !default;\n$form-select-border-radius-lg: $input-border-radius-lg !default;\n\n$form-select-transition: $input-transition !default;\n// scss-docs-end form-select-variables\n\n// scss-docs-start form-range-variables\n$form-range-track-width: 100% !default;\n$form-range-track-height: .5rem !default;\n$form-range-track-cursor: pointer !default;\n$form-range-track-bg: $gray-300 !default;\n$form-range-track-border-radius: 1rem !default;\n$form-range-track-box-shadow: $box-shadow-inset !default;\n\n$form-range-thumb-width: 1rem !default;\n$form-range-thumb-height: $form-range-thumb-width !default;\n$form-range-thumb-bg: $component-active-bg !default;\n$form-range-thumb-border: 0 !default;\n$form-range-thumb-border-radius: 1rem !default;\n$form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default;\n$form-range-thumb-disabled-bg: $gray-500 !default;\n$form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n// scss-docs-end form-range-variables\n\n// scss-docs-start form-file-variables\n$form-file-button-color: $input-color !default;\n$form-file-button-bg: $input-group-addon-bg !default;\n$form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default;\n// scss-docs-end form-file-variables\n\n// scss-docs-start form-floating-variables\n$form-floating-height: add(3.5rem, $input-height-border) !default;\n$form-floating-line-height: 1.25 !default;\n$form-floating-padding-x: $input-padding-x !default;\n$form-floating-padding-y: 1rem !default;\n$form-floating-input-padding-t: 1.625rem !default;\n$form-floating-input-padding-b: .625rem !default;\n$form-floating-label-opacity: .65 !default;\n$form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default;\n$form-floating-transition: opacity .1s ease-in-out, transform .1s ease-in-out !default;\n// scss-docs-end form-floating-variables\n\n// Form validation\n\n// scss-docs-start form-feedback-variables\n$form-feedback-margin-top: $form-text-margin-top !default;\n$form-feedback-font-size: $form-text-font-size !default;\n$form-feedback-font-style: $form-text-font-style !default;\n$form-feedback-valid-color: $success !default;\n$form-feedback-invalid-color: $danger !default;\n\n$form-feedback-icon-valid-color: $form-feedback-valid-color !default;\n$form-feedback-icon-valid: url(\"data:image/svg+xml,\") !default;\n$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end form-feedback-variables\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n \"valid\": (\n \"color\": $form-feedback-valid-color,\n \"icon\": $form-feedback-icon-valid\n ),\n \"invalid\": (\n \"color\": $form-feedback-invalid-color,\n \"icon\": $form-feedback-icon-invalid\n )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown: 1000 !default;\n$zindex-sticky: 1020 !default;\n$zindex-fixed: 1030 !default;\n$zindex-offcanvas-backdrop: 1040 !default;\n$zindex-offcanvas: 1045 !default;\n$zindex-modal-backdrop: 1050 !default;\n$zindex-modal: 1055 !default;\n$zindex-popover: 1070 !default;\n$zindex-tooltip: 1080 !default;\n$zindex-toast: 1090 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n// scss-docs-start nav-variables\n$nav-link-padding-y: .5rem !default;\n$nav-link-padding-x: 1rem !default;\n$nav-link-font-size: null !default;\n$nav-link-font-weight: null !default;\n$nav-link-color: var(--#{$prefix}link-color) !default;\n$nav-link-hover-color: var(--#{$prefix}link-hover-color) !default;\n$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color: $gray-600 !default;\n\n$nav-tabs-border-color: $gray-300 !default;\n$nav-tabs-border-width: $border-width !default;\n$nav-tabs-border-radius: $border-radius !default;\n$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color: $gray-700 !default;\n$nav-tabs-link-active-bg: $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius: $border-radius !default;\n$nav-pills-link-active-color: $component-active-color !default;\n$nav-pills-link-active-bg: $component-active-bg !default;\n// scss-docs-end nav-variables\n\n\n// Navbar\n\n// scss-docs-start navbar-variables\n$navbar-padding-y: $spacer * .5 !default;\n$navbar-padding-x: null !default;\n\n$navbar-nav-link-padding-x: .5rem !default;\n\n$navbar-brand-font-size: $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default;\n$navbar-brand-margin-end: 1rem !default;\n\n$navbar-toggler-padding-y: .25rem !default;\n$navbar-toggler-padding-x: .75rem !default;\n$navbar-toggler-font-size: $font-size-lg !default;\n$navbar-toggler-border-radius: $btn-border-radius !default;\n$navbar-toggler-focus-width: $btn-focus-width !default;\n$navbar-toggler-transition: box-shadow .15s ease-in-out !default;\n// scss-docs-end navbar-variables\n\n// scss-docs-start navbar-theme-variables\n$navbar-dark-color: rgba($white, .55) !default;\n$navbar-dark-hover-color: rgba($white, .75) !default;\n$navbar-dark-active-color: $white !default;\n$navbar-dark-disabled-color: rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-dark-toggler-border-color: rgba($white, .1) !default;\n\n$navbar-light-color: rgba($black, .55) !default;\n$navbar-light-hover-color: rgba($black, .7) !default;\n$navbar-light-active-color: rgba($black, .9) !default;\n$navbar-light-disabled-color: rgba($black, .3) !default;\n$navbar-light-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-light-toggler-border-color: rgba($black, .1) !default;\n\n$navbar-light-brand-color: $navbar-light-active-color !default;\n$navbar-light-brand-hover-color: $navbar-light-active-color !default;\n$navbar-dark-brand-color: $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;\n// scss-docs-end navbar-theme-variables\n\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n// scss-docs-start dropdown-variables\n$dropdown-min-width: 10rem !default;\n$dropdown-padding-x: 0 !default;\n$dropdown-padding-y: .5rem !default;\n$dropdown-spacer: .125rem !default;\n$dropdown-font-size: $font-size-base !default;\n$dropdown-color: $body-color !default;\n$dropdown-bg: $white !default;\n$dropdown-border-color: var(--#{$prefix}border-color-translucent) !default;\n$dropdown-border-radius: $border-radius !default;\n$dropdown-border-width: $border-width !default;\n$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-divider-bg: $dropdown-border-color !default;\n$dropdown-divider-margin-y: $spacer * .5 !default;\n$dropdown-box-shadow: $box-shadow !default;\n\n$dropdown-link-color: $gray-900 !default;\n$dropdown-link-hover-color: shade-color($dropdown-link-color, 10%) !default;\n$dropdown-link-hover-bg: $gray-200 !default;\n\n$dropdown-link-active-color: $component-active-color !default;\n$dropdown-link-active-bg: $component-active-bg !default;\n\n$dropdown-link-disabled-color: $gray-500 !default;\n\n$dropdown-item-padding-y: $spacer * .25 !default;\n$dropdown-item-padding-x: $spacer !default;\n\n$dropdown-header-color: $gray-600 !default;\n$dropdown-header-padding-x: $dropdown-item-padding-x !default;\n$dropdown-header-padding-y: $dropdown-padding-y !default;\n// fusv-disable\n$dropdown-header-padding: $dropdown-header-padding-y $dropdown-header-padding-x !default; // Deprecated in v5.2.0\n// fusv-enable\n// scss-docs-end dropdown-variables\n\n// scss-docs-start dropdown-dark-variables\n$dropdown-dark-color: $gray-300 !default;\n$dropdown-dark-bg: $gray-800 !default;\n$dropdown-dark-border-color: $dropdown-border-color !default;\n$dropdown-dark-divider-bg: $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow: null !default;\n$dropdown-dark-link-color: $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color: $white !default;\n$dropdown-dark-link-hover-bg: rgba($white, .15) !default;\n$dropdown-dark-link-active-color: $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color: $gray-500 !default;\n// scss-docs-end dropdown-dark-variables\n\n\n// Pagination\n\n// scss-docs-start pagination-variables\n$pagination-padding-y: .375rem !default;\n$pagination-padding-x: .75rem !default;\n$pagination-padding-y-sm: .25rem !default;\n$pagination-padding-x-sm: .5rem !default;\n$pagination-padding-y-lg: .75rem !default;\n$pagination-padding-x-lg: 1.5rem !default;\n\n$pagination-font-size: $font-size-base !default;\n\n$pagination-color: var(--#{$prefix}link-color) !default;\n$pagination-bg: $white !default;\n$pagination-border-radius: $border-radius !default;\n$pagination-border-width: $border-width !default;\n$pagination-margin-start: calc($pagination-border-width * -1) !default; // stylelint-disable-line function-disallowed-list\n$pagination-border-color: $gray-300 !default;\n\n$pagination-focus-color: var(--#{$prefix}link-hover-color) !default;\n$pagination-focus-bg: $gray-200 !default;\n$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$pagination-focus-outline: 0 !default;\n\n$pagination-hover-color: var(--#{$prefix}link-hover-color) !default;\n$pagination-hover-bg: $gray-200 !default;\n$pagination-hover-border-color: $gray-300 !default;\n\n$pagination-active-color: $component-active-color !default;\n$pagination-active-bg: $component-active-bg !default;\n$pagination-active-border-color: $pagination-active-bg !default;\n\n$pagination-disabled-color: $gray-600 !default;\n$pagination-disabled-bg: $white !default;\n$pagination-disabled-border-color: $gray-300 !default;\n\n$pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$pagination-border-radius-sm: $border-radius-sm !default;\n$pagination-border-radius-lg: $border-radius-lg !default;\n// scss-docs-end pagination-variables\n\n\n// Placeholders\n\n// scss-docs-start placeholders\n$placeholder-opacity-max: .5 !default;\n$placeholder-opacity-min: .2 !default;\n// scss-docs-end placeholders\n\n// Cards\n\n// scss-docs-start card-variables\n$card-spacer-y: $spacer !default;\n$card-spacer-x: $spacer !default;\n$card-title-spacer-y: $spacer * .5 !default;\n$card-border-width: $border-width !default;\n$card-border-color: var(--#{$prefix}border-color-translucent) !default;\n$card-border-radius: $border-radius !default;\n$card-box-shadow: null !default;\n$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y: $card-spacer-y * .5 !default;\n$card-cap-padding-x: $card-spacer-x !default;\n$card-cap-bg: rgba($black, .03) !default;\n$card-cap-color: null !default;\n$card-height: null !default;\n$card-color: null !default;\n$card-bg: $white !default;\n$card-img-overlay-padding: $spacer !default;\n$card-group-margin: $grid-gutter-width * .5 !default;\n// scss-docs-end card-variables\n\n// Accordion\n\n// scss-docs-start accordion-variables\n$accordion-padding-y: 1rem !default;\n$accordion-padding-x: 1.25rem !default;\n$accordion-color: var(--#{$prefix}body-color) !default;\n$accordion-bg: $body-bg !default;\n$accordion-border-width: $border-width !default;\n$accordion-border-color: var(--#{$prefix}border-color) !default;\n$accordion-border-radius: $border-radius !default;\n$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;\n\n$accordion-body-padding-y: $accordion-padding-y !default;\n$accordion-body-padding-x: $accordion-padding-x !default;\n\n$accordion-button-padding-y: $accordion-padding-y !default;\n$accordion-button-padding-x: $accordion-padding-x !default;\n$accordion-button-color: $accordion-color !default;\n$accordion-button-bg: var(--#{$prefix}accordion-bg) !default;\n$accordion-transition: $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg: tint-color($component-active-bg, 90%) !default;\n$accordion-button-active-color: shade-color($primary, 10%) !default;\n\n$accordion-button-focus-border-color: $input-focus-border-color !default;\n$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;\n\n$accordion-icon-width: 1.25rem !default;\n$accordion-icon-color: $accordion-button-color !default;\n$accordion-icon-active-color: $accordion-button-active-color !default;\n$accordion-icon-transition: transform .2s ease-in-out !default;\n$accordion-icon-transform: rotate(-180deg) !default;\n\n$accordion-button-icon: url(\"data:image/svg+xml,\") !default;\n$accordion-button-active-icon: url(\"data:image/svg+xml,\") !default;\n// scss-docs-end accordion-variables\n\n// Tooltips\n\n// scss-docs-start tooltip-variables\n$tooltip-font-size: $font-size-sm !default;\n$tooltip-max-width: 200px !default;\n$tooltip-color: $white !default;\n$tooltip-bg: $black !default;\n$tooltip-border-radius: $border-radius !default;\n$tooltip-opacity: .9 !default;\n$tooltip-padding-y: $spacer * .25 !default;\n$tooltip-padding-x: $spacer * .5 !default;\n$tooltip-margin: null !default; // TODO: remove this in v6\n\n$tooltip-arrow-width: .8rem !default;\n$tooltip-arrow-height: .4rem !default;\n// fusv-disable\n$tooltip-arrow-color: null !default; // Deprecated in Bootstrap 5.2.0 for CSS variables\n// fusv-enable\n// scss-docs-end tooltip-variables\n\n// Form tooltips must come after regular tooltips\n// scss-docs-start tooltip-feedback-variables\n$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size: $tooltip-font-size !default;\n$form-feedback-tooltip-line-height: null !default;\n$form-feedback-tooltip-opacity: $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n// scss-docs-end tooltip-feedback-variables\n\n\n// Popovers\n\n// scss-docs-start popover-variables\n$popover-font-size: $font-size-sm !default;\n$popover-bg: $white !default;\n$popover-max-width: 276px !default;\n$popover-border-width: $border-width !default;\n$popover-border-color: var(--#{$prefix}border-color-translucent) !default;\n$popover-border-radius: $border-radius-lg !default;\n$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow: $box-shadow !default;\n\n$popover-header-font-size: $font-size-base !default;\n$popover-header-bg: shade-color($popover-bg, 6%) !default;\n$popover-header-color: var(--#{$prefix}heading-color) !default;\n$popover-header-padding-y: .5rem !default;\n$popover-header-padding-x: $spacer !default;\n\n$popover-body-color: $body-color !default;\n$popover-body-padding-y: $spacer !default;\n$popover-body-padding-x: $spacer !default;\n\n$popover-arrow-width: 1rem !default;\n$popover-arrow-height: .5rem !default;\n// scss-docs-end popover-variables\n\n// fusv-disable\n// Deprecated in Bootstrap 5.2.0 for CSS variables\n$popover-arrow-color: $popover-bg !default;\n$popover-arrow-outer-color: var(--#{$prefix}border-color-translucent) !default;\n// fusv-enable\n\n\n// Toasts\n\n// scss-docs-start toast-variables\n$toast-max-width: 350px !default;\n$toast-padding-x: .75rem !default;\n$toast-padding-y: .5rem !default;\n$toast-font-size: .875rem !default;\n$toast-color: null !default;\n$toast-background-color: rgba($white, .85) !default;\n$toast-border-width: $border-width !default;\n$toast-border-color: var(--#{$prefix}border-color-translucent) !default;\n$toast-border-radius: $border-radius !default;\n$toast-box-shadow: $box-shadow !default;\n$toast-spacing: $container-padding-x !default;\n\n$toast-header-color: $gray-600 !default;\n$toast-header-background-color: rgba($white, .85) !default;\n$toast-header-border-color: rgba($black, .05) !default;\n// scss-docs-end toast-variables\n\n\n// Badges\n\n// scss-docs-start badge-variables\n$badge-font-size: .75em !default;\n$badge-font-weight: $font-weight-bold !default;\n$badge-color: $white !default;\n$badge-padding-y: .35em !default;\n$badge-padding-x: .65em !default;\n$badge-border-radius: $border-radius !default;\n// scss-docs-end badge-variables\n\n\n// Modals\n\n// scss-docs-start modal-variables\n$modal-inner-padding: $spacer !default;\n\n$modal-footer-margin-between: .5rem !default;\n\n$modal-dialog-margin: .5rem !default;\n$modal-dialog-margin-y-sm-up: 1.75rem !default;\n\n$modal-title-line-height: $line-height-base !default;\n\n$modal-content-color: null !default;\n$modal-content-bg: $white !default;\n$modal-content-border-color: var(--#{$prefix}border-color-translucent) !default;\n$modal-content-border-width: $border-width !default;\n$modal-content-border-radius: $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs: $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up: $box-shadow !default;\n\n$modal-backdrop-bg: $black !default;\n$modal-backdrop-opacity: .5 !default;\n\n$modal-header-border-color: var(--#{$prefix}border-color) !default;\n$modal-header-border-width: $modal-content-border-width !default;\n$modal-header-padding-y: $modal-inner-padding !default;\n$modal-header-padding-x: $modal-inner-padding !default;\n$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-footer-bg: null !default;\n$modal-footer-border-color: $modal-header-border-color !default;\n$modal-footer-border-width: $modal-header-border-width !default;\n\n$modal-sm: 300px !default;\n$modal-md: 500px !default;\n$modal-lg: 800px !default;\n$modal-xl: 1140px !default;\n\n$modal-fade-transform: translate(0, -50px) !default;\n$modal-show-transform: none !default;\n$modal-transition: transform .3s ease-out !default;\n$modal-scale-transform: scale(1.02) !default;\n// scss-docs-end modal-variables\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n// scss-docs-start alert-variables\n$alert-padding-y: $spacer !default;\n$alert-padding-x: $spacer !default;\n$alert-margin-bottom: 1rem !default;\n$alert-border-radius: $border-radius !default;\n$alert-link-font-weight: $font-weight-bold !default;\n$alert-border-width: $border-width !default;\n$alert-bg-scale: -80% !default;\n$alert-border-scale: -70% !default;\n$alert-color-scale: 40% !default;\n$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n// scss-docs-end alert-variables\n\n\n// Progress bars\n\n// scss-docs-start progress-variables\n$progress-height: 1rem !default;\n$progress-font-size: $font-size-base * .75 !default;\n$progress-bg: $gray-200 !default;\n$progress-border-radius: $border-radius !default;\n$progress-box-shadow: $box-shadow-inset !default;\n$progress-bar-color: $white !default;\n$progress-bar-bg: $primary !default;\n$progress-bar-animation-timing: 1s linear infinite !default;\n$progress-bar-transition: width .6s ease !default;\n// scss-docs-end progress-variables\n\n\n// List group\n\n// scss-docs-start list-group-variables\n$list-group-color: $gray-900 !default;\n$list-group-bg: $white !default;\n$list-group-border-color: rgba($black, .125) !default;\n$list-group-border-width: $border-width !default;\n$list-group-border-radius: $border-radius !default;\n\n$list-group-item-padding-y: $spacer * .5 !default;\n$list-group-item-padding-x: $spacer !default;\n$list-group-item-bg-scale: -80% !default;\n$list-group-item-color-scale: 40% !default;\n\n$list-group-hover-bg: $gray-100 !default;\n$list-group-active-color: $component-active-color !default;\n$list-group-active-bg: $component-active-bg !default;\n$list-group-active-border-color: $list-group-active-bg !default;\n\n$list-group-disabled-color: $gray-600 !default;\n$list-group-disabled-bg: $list-group-bg !default;\n\n$list-group-action-color: $gray-700 !default;\n$list-group-action-hover-color: $list-group-action-color !default;\n\n$list-group-action-active-color: $body-color !default;\n$list-group-action-active-bg: $gray-200 !default;\n// scss-docs-end list-group-variables\n\n\n// Image thumbnails\n\n// scss-docs-start thumbnail-variables\n$thumbnail-padding: .25rem !default;\n$thumbnail-bg: $body-bg !default;\n$thumbnail-border-width: $border-width !default;\n$thumbnail-border-color: var(--#{$prefix}border-color) !default;\n$thumbnail-border-radius: $border-radius !default;\n$thumbnail-box-shadow: $box-shadow-sm !default;\n// scss-docs-end thumbnail-variables\n\n\n// Figures\n\n// scss-docs-start figure-variables\n$figure-caption-font-size: $small-font-size !default;\n$figure-caption-color: $gray-600 !default;\n// scss-docs-end figure-variables\n\n\n// Breadcrumbs\n\n// scss-docs-start breadcrumb-variables\n$breadcrumb-font-size: null !default;\n$breadcrumb-padding-y: 0 !default;\n$breadcrumb-padding-x: 0 !default;\n$breadcrumb-item-padding-x: .5rem !default;\n$breadcrumb-margin-bottom: 1rem !default;\n$breadcrumb-bg: null !default;\n$breadcrumb-divider-color: $gray-600 !default;\n$breadcrumb-active-color: $gray-600 !default;\n$breadcrumb-divider: quote(\"/\") !default;\n$breadcrumb-divider-flipped: $breadcrumb-divider !default;\n$breadcrumb-border-radius: null !default;\n// scss-docs-end breadcrumb-variables\n\n// Carousel\n\n// scss-docs-start carousel-variables\n$carousel-control-color: $white !default;\n$carousel-control-width: 15% !default;\n$carousel-control-opacity: .5 !default;\n$carousel-control-hover-opacity: .9 !default;\n$carousel-control-transition: opacity .15s ease !default;\n\n$carousel-indicator-width: 30px !default;\n$carousel-indicator-height: 3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer: 3px !default;\n$carousel-indicator-opacity: .5 !default;\n$carousel-indicator-active-bg: $white !default;\n$carousel-indicator-active-opacity: 1 !default;\n$carousel-indicator-transition: opacity .6s ease !default;\n\n$carousel-caption-width: 70% !default;\n$carousel-caption-color: $white !default;\n$carousel-caption-padding-y: 1.25rem !default;\n$carousel-caption-spacer: 1.25rem !default;\n\n$carousel-control-icon-width: 2rem !default;\n\n$carousel-control-prev-icon-bg: url(\"data:image/svg+xml,\") !default;\n$carousel-control-next-icon-bg: url(\"data:image/svg+xml,\") !default;\n\n$carousel-transition-duration: .6s !default;\n$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg: $black !default;\n$carousel-dark-caption-color: $black !default;\n$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;\n// scss-docs-end carousel-variables\n\n\n// Spinners\n\n// scss-docs-start spinner-variables\n$spinner-width: 2rem !default;\n$spinner-height: $spinner-width !default;\n$spinner-vertical-align: -.125em !default;\n$spinner-border-width: .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm: 1rem !default;\n$spinner-height-sm: $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n// scss-docs-end spinner-variables\n\n\n// Close\n\n// scss-docs-start close-variables\n$btn-close-width: 1em !default;\n$btn-close-height: $btn-close-width !default;\n$btn-close-padding-x: .25em !default;\n$btn-close-padding-y: $btn-close-padding-x !default;\n$btn-close-color: $black !default;\n$btn-close-bg: url(\"data:image/svg+xml,\") !default;\n$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;\n$btn-close-opacity: .5 !default;\n$btn-close-hover-opacity: .75 !default;\n$btn-close-focus-opacity: 1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;\n// scss-docs-end close-variables\n\n\n// Offcanvas\n\n// scss-docs-start offcanvas-variables\n$offcanvas-padding-y: $modal-inner-padding !default;\n$offcanvas-padding-x: $modal-inner-padding !default;\n$offcanvas-horizontal-width: 400px !default;\n$offcanvas-vertical-height: 30vh !default;\n$offcanvas-transition-duration: .3s !default;\n$offcanvas-border-color: $modal-content-border-color !default;\n$offcanvas-border-width: $modal-content-border-width !default;\n$offcanvas-title-line-height: $modal-title-line-height !default;\n$offcanvas-bg-color: $modal-content-bg !default;\n$offcanvas-color: $modal-content-color !default;\n$offcanvas-box-shadow: $modal-content-box-shadow-xs !default;\n$offcanvas-backdrop-bg: $modal-backdrop-bg !default;\n$offcanvas-backdrop-opacity: $modal-backdrop-opacity !default;\n// scss-docs-end offcanvas-variables\n\n// Code\n\n$code-font-size: $small-font-size !default;\n$code-color: $pink !default;\n\n$kbd-padding-y: .1875rem !default;\n$kbd-padding-x: .375rem !default;\n$kbd-font-size: $code-font-size !default;\n$kbd-color: var(--#{$prefix}body-bg) !default;\n$kbd-bg: var(--#{$prefix}body-color) !default;\n$nested-kbd-font-weight: null !default; // Deprecated in v5.2.0, removing in v6\n\n$pre-color: null !default;\n", + "// Re-assigned maps\n//\n// Placed here so that others can override the default Sass maps and see automatic updates to utilities and more.\n\n// scss-docs-start theme-colors-rgb\n$theme-colors-rgb: map-loop($theme-colors, to-rgb, \"$value\") !default;\n// scss-docs-end theme-colors-rgb\n\n// Utilities maps\n//\n// Extends the default `$theme-colors` maps to help create our utilities.\n\n// Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign.\n// scss-docs-start utilities-colors\n$utilities-colors: $theme-colors-rgb !default;\n// scss-docs-end utilities-colors\n\n// scss-docs-start utilities-text-colors\n$utilities-text: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-color)\n )\n) !default;\n$utilities-text-colors: map-loop($utilities-text, rgba-css-var, \"$key\", \"text\") !default;\n// scss-docs-end utilities-text-colors\n\n// scss-docs-start utilities-bg-colors\n$utilities-bg: map-merge(\n $utilities-colors,\n (\n \"black\": to-rgb($black),\n \"white\": to-rgb($white),\n \"body\": to-rgb($body-bg)\n )\n) !default;\n$utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, \"$key\", \"bg\") !default;\n// scss-docs-end utilities-bg-colors\n\n// scss-docs-start utilities-border-colors\n$utilities-border: map-merge(\n $utilities-colors,\n (\n \"white\": to-rgb($white)\n )\n) !default;\n$utilities-border-colors: map-loop($utilities-border, rgba-css-var, \"$key\", \"border\") !default;\n// scss-docs-end utilities-border-colors\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n\n$gutters: $spacers !default;\n", "// Toggles\n//\n// Used in conjunction with global variables to enable certain theme features.\n\n// Vendor\n@import \"vendor/rfs\";\n\n// Deprecate\n@import \"mixins/deprecate\";\n\n// Helpers\n@import \"mixins/breakpoints\";\n@import \"mixins/color-scheme\";\n@import \"mixins/image\";\n@import \"mixins/resize\";\n@import \"mixins/visually-hidden\";\n@import \"mixins/reset-text\";\n@import \"mixins/text-truncate\";\n\n// Utilities\n@import \"mixins/utilities\";\n\n// Components\n@import \"mixins/alert\";\n@import \"mixins/backdrop\";\n@import \"mixins/buttons\";\n@import \"mixins/caret\";\n@import \"mixins/pagination\";\n@import \"mixins/lists\";\n@import \"mixins/list-group\";\n@import \"mixins/forms\";\n@import \"mixins/table-variants\";\n\n// Skins\n@import \"mixins/border-radius\";\n@import \"mixins/box-shadow\";\n@import \"mixins/gradients\";\n@import \"mixins/transition\";\n\n// Layout\n@import \"mixins/clearfix\";\n@import \"mixins/container\";\n@import \"mixins/grid\";\n", "// stylelint-disable property-blacklist, scss/dollar-variable-default\n\n// SCSS RFS mixin\n//\n// Automated responsive values for font sizes, paddings, margins and much more\n//\n// Licensed under MIT (https://github.com/twbs/rfs/blob/main/LICENSE)\n\n// Configuration\n\n// Base value\n$rfs-base-value: 1.25rem !default;\n$rfs-unit: rem !default;\n\n@if $rfs-unit != rem and $rfs-unit != px {\n @error \"`#{$rfs-unit}` is not a valid unit for $rfs-unit. Use `px` or `rem`.\";\n}\n\n// Breakpoint at where values start decreasing if screen width is smaller\n$rfs-breakpoint: 1200px !default;\n$rfs-breakpoint-unit: px !default;\n\n@if $rfs-breakpoint-unit != px and $rfs-breakpoint-unit != em and $rfs-breakpoint-unit != rem {\n @error \"`#{$rfs-breakpoint-unit}` is not a valid unit for $rfs-breakpoint-unit. Use `px`, `em` or `rem`.\";\n}\n\n// Resize values based on screen height and width\n$rfs-two-dimensional: false !default;\n\n// Factor of decrease\n$rfs-factor: 10 !default;\n\n@if type-of($rfs-factor) != number or $rfs-factor <= 1 {\n @error \"`#{$rfs-factor}` is not a valid $rfs-factor, it must be greater than 1.\";\n}\n\n// Mode. Possibilities: \"min-media-query\", \"max-media-query\"\n$rfs-mode: min-media-query !default;\n\n// Generate enable or disable classes. Possibilities: false, \"enable\" or \"disable\"\n$rfs-class: false !default;\n\n// 1 rem = $rfs-rem-value px\n$rfs-rem-value: 16 !default;\n\n// Safari iframe resize bug: https://github.com/twbs/rfs/issues/14\n$rfs-safari-iframe-resize-bug-fix: false !default;\n\n// Disable RFS by setting $enable-rfs to false\n$enable-rfs: true !default;\n\n// Cache $rfs-base-value unit\n$rfs-base-value-unit: unit($rfs-base-value);\n\n@function divide($dividend, $divisor, $precision: 10) {\n $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n $dividend: abs($dividend);\n $divisor: abs($divisor);\n @if $dividend == 0 {\n @return 0;\n }\n @if $divisor == 0 {\n @error \"Cannot divide by 0\";\n }\n $remainder: $dividend;\n $result: 0;\n $factor: 10;\n @while ($remainder > 0 and $precision >= 0) {\n $quotient: 0;\n @while ($remainder >= $divisor) {\n $remainder: $remainder - $divisor;\n $quotient: $quotient + 1;\n }\n $result: $result * 10 + $quotient;\n $factor: $factor * .1;\n $remainder: $remainder * 10;\n $precision: $precision - 1;\n @if ($precision < 0 and $remainder >= $divisor * 5) {\n $result: $result + 1;\n }\n }\n $result: $result * $factor * $sign;\n $dividend-unit: unit($dividend);\n $divisor-unit: unit($divisor);\n $unit-map: (\n \"px\": 1px,\n \"rem\": 1rem,\n \"em\": 1em,\n \"%\": 1%\n );\n @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n $result: $result * map-get($unit-map, $dividend-unit);\n }\n @return $result;\n}\n\n// Remove px-unit from $rfs-base-value for calculations\n@if $rfs-base-value-unit == px {\n $rfs-base-value: divide($rfs-base-value, $rfs-base-value * 0 + 1);\n}\n@else if $rfs-base-value-unit == rem {\n $rfs-base-value: divide($rfs-base-value, divide($rfs-base-value * 0 + 1, $rfs-rem-value));\n}\n\n// Cache $rfs-breakpoint unit to prevent multiple calls\n$rfs-breakpoint-unit-cache: unit($rfs-breakpoint);\n\n// Remove unit from $rfs-breakpoint for calculations\n@if $rfs-breakpoint-unit-cache == px {\n $rfs-breakpoint: divide($rfs-breakpoint, $rfs-breakpoint * 0 + 1);\n}\n@else if $rfs-breakpoint-unit-cache == rem or $rfs-breakpoint-unit-cache == \"em\" {\n $rfs-breakpoint: divide($rfs-breakpoint, divide($rfs-breakpoint * 0 + 1, $rfs-rem-value));\n}\n\n// Calculate the media query value\n$rfs-mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{divide($rfs-breakpoint, $rfs-rem-value)}#{$rfs-breakpoint-unit});\n$rfs-mq-property-width: if($rfs-mode == max-media-query, max-width, min-width);\n$rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height);\n\n// Internal mixin used to determine which media query needs to be used\n@mixin _rfs-media-query {\n @if $rfs-two-dimensional {\n @if $rfs-mode == max-media-query {\n @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}), (#{$rfs-mq-property-height}: #{$rfs-mq-value}) {\n @content;\n }\n }\n @else {\n @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}) and (#{$rfs-mq-property-height}: #{$rfs-mq-value}) {\n @content;\n }\n }\n }\n @else {\n @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}) {\n @content;\n }\n }\n}\n\n// Internal mixin that adds disable classes to the selector if needed.\n@mixin _rfs-rule {\n @if $rfs-class == disable and $rfs-mode == max-media-query {\n // Adding an extra class increases specificity, which prevents the media query to override the property\n &,\n .disable-rfs &,\n &.disable-rfs {\n @content;\n }\n }\n @else if $rfs-class == enable and $rfs-mode == min-media-query {\n .enable-rfs &,\n &.enable-rfs {\n @content;\n }\n }\n @else {\n @content;\n }\n}\n\n// Internal mixin that adds enable classes to the selector if needed.\n@mixin _rfs-media-query-rule {\n\n @if $rfs-class == enable {\n @if $rfs-mode == min-media-query {\n @content;\n }\n\n @include _rfs-media-query {\n .enable-rfs &,\n &.enable-rfs {\n @content;\n }\n }\n }\n @else {\n @if $rfs-class == disable and $rfs-mode == min-media-query {\n .disable-rfs &,\n &.disable-rfs {\n @content;\n }\n }\n @include _rfs-media-query {\n @content;\n }\n }\n}\n\n// Helper function to get the formatted non-responsive value\n@function rfs-value($values) {\n // Convert to list\n $values: if(type-of($values) != list, ($values,), $values);\n\n $val: '';\n\n // Loop over each value and calculate value\n @each $value in $values {\n @if $value == 0 {\n $val: $val + ' 0';\n }\n @else {\n // Cache $value unit\n $unit: if(type-of($value) == \"number\", unit($value), false);\n\n @if $unit == px {\n // Convert to rem if needed\n $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $value * 0 + $rfs-rem-value)}rem, $value);\n }\n @else if $unit == rem {\n // Convert to px if needed\n $val: $val + ' ' + if($rfs-unit == px, #{divide($value, $value * 0 + 1) * $rfs-rem-value}px, $value);\n }\n @else {\n // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value\n $val: $val + ' ' + $value;\n }\n }\n }\n\n // Remove first space\n @return unquote(str-slice($val, 2));\n}\n\n// Helper function to get the responsive value calculated by RFS\n@function rfs-fluid-value($values) {\n // Convert to list\n $values: if(type-of($values) != list, ($values,), $values);\n\n $val: '';\n\n // Loop over each value and calculate value\n @each $value in $values {\n @if $value == 0 {\n $val: $val + ' 0';\n }\n\n @else {\n // Cache $value unit\n $unit: if(type-of($value) == \"number\", unit($value), false);\n\n // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value\n @if not $unit or $unit != px and $unit != rem {\n $val: $val + ' ' + $value;\n }\n\n @else {\n // Remove unit from $value for calculations\n $value: divide($value, $value * 0 + if($unit == px, 1, divide(1, $rfs-rem-value)));\n\n // Only add the media query if the value is greater than the minimum value\n @if abs($value) <= $rfs-base-value or not $enable-rfs {\n $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $rfs-rem-value)}rem, #{$value}px);\n }\n @else {\n // Calculate the minimum value\n $value-min: $rfs-base-value + divide(abs($value) - $rfs-base-value, $rfs-factor);\n\n // Calculate difference between $value and the minimum value\n $value-diff: abs($value) - $value-min;\n\n // Base value formatting\n $min-width: if($rfs-unit == rem, #{divide($value-min, $rfs-rem-value)}rem, #{$value-min}px);\n\n // Use negative value if needed\n $min-width: if($value < 0, -$min-width, $min-width);\n\n // Use `vmin` if two-dimensional is enabled\n $variable-unit: if($rfs-two-dimensional, vmin, vw);\n\n // Calculate the variable width between 0 and $rfs-breakpoint\n $variable-width: #{divide($value-diff * 100, $rfs-breakpoint)}#{$variable-unit};\n\n // Return the calculated value\n $val: $val + ' calc(' + $min-width + if($value < 0, ' - ', ' + ') + $variable-width + ')';\n }\n }\n }\n }\n\n // Remove first space\n @return unquote(str-slice($val, 2));\n}\n\n// RFS mixin\n@mixin rfs($values, $property: font-size) {\n @if $values != null {\n $val: rfs-value($values);\n $fluidVal: rfs-fluid-value($values);\n\n // Do not print the media query if responsive & non-responsive values are the same\n @if $val == $fluidVal {\n #{$property}: $val;\n }\n @else {\n @include _rfs-rule {\n #{$property}: if($rfs-mode == max-media-query, $val, $fluidVal);\n\n // Include safari iframe resize fix if needed\n min-width: if($rfs-safari-iframe-resize-bug-fix, (0 * 1vw), null);\n }\n\n @include _rfs-media-query-rule {\n #{$property}: if($rfs-mode == max-media-query, $fluidVal, $val);\n }\n }\n }\n}\n\n// Shorthand helper mixins\n@mixin font-size($value) {\n @include rfs($value);\n}\n\n@mixin padding($value) {\n @include rfs($value, padding);\n}\n\n@mixin padding-top($value) {\n @include rfs($value, padding-top);\n}\n\n@mixin padding-right($value) {\n @include rfs($value, padding-right);\n}\n\n@mixin padding-bottom($value) {\n @include rfs($value, padding-bottom);\n}\n\n@mixin padding-left($value) {\n @include rfs($value, padding-left);\n}\n\n@mixin margin($value) {\n @include rfs($value, margin);\n}\n\n@mixin margin-top($value) {\n @include rfs($value, margin-top);\n}\n\n@mixin margin-right($value) {\n @include rfs($value, margin-right);\n}\n\n@mixin margin-bottom($value) {\n @include rfs($value, margin-bottom);\n}\n\n@mixin margin-left($value) {\n @include rfs($value, margin-left);\n}\n", "// Deprecate mixin\n//\n// This mixin can be used to deprecate mixins or functions.\n// `$enable-deprecation-messages` is a global variable, `$ignore-warning` is a variable that can be passed to\n// some deprecated mixins to suppress the warning (for example if the mixin is still be used in the current version of Bootstrap)\n@mixin deprecate($name, $deprecate-version, $remove-version, $ignore-warning: false) {\n @if ($enable-deprecation-messages != false and $ignore-warning != true) {\n @warn \"#{$name} has been deprecated as of #{$deprecate-version}. It will be removed entirely in #{$remove-version}.\";\n }\n}\n", - "// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @if not $n {\n @error \"breakpoint `#{$name}` not found in `#{$breakpoints}`\";\n }\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {\n $min: map-get($breakpoints, $name);\n @return if($min != 0, $min, null);\n}\n\n// Maximum breakpoint width.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - .02, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, \"\", \"-#{$name}\");\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Media that spans multiple breakpoint widths.\n// Makes the @content apply between the min and max breakpoints\n@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($lower, $breakpoints);\n $max: breakpoint-max($upper, $breakpoints);\n\n @if $min != null and $max != null {\n @media (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else if $max == null {\n @include media-breakpoint-up($lower, $breakpoints) {\n @content;\n }\n } @else if $min == null {\n @include media-breakpoint-down($upper, $breakpoints) {\n @content;\n }\n }\n}\n\n// Media between the breakpoint's minimum and maximum widths.\n// No minimum for the smallest breakpoint, and no maximum for the largest one.\n// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.\n@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n $next: breakpoint-next($name, $breakpoints);\n $max: breakpoint-max($next);\n\n @if $min != null and $max != null {\n @media (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else if $max == null {\n @include media-breakpoint-up($name, $breakpoints) {\n @content;\n }\n } @else if $min == null {\n @include media-breakpoint-down($next, $breakpoints) {\n @content;\n }\n }\n}\n", + "// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px)\n//\n// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl xxl))\n// md\n@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @if not $n {\n @error \"breakpoint `#{$name}` not found in `#{$breakpoints}`\";\n }\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {\n $min: map-get($breakpoints, $name);\n @return if($min != 0, $min, null);\n}\n\n// Maximum breakpoint width.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - .02, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, \"\", \"-#{$name}\");\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Media that spans multiple breakpoint widths.\n// Makes the @content apply between the min and max breakpoints\n@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($lower, $breakpoints);\n $max: breakpoint-max($upper, $breakpoints);\n\n @if $min != null and $max != null {\n @media (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else if $max == null {\n @include media-breakpoint-up($lower, $breakpoints) {\n @content;\n }\n } @else if $min == null {\n @include media-breakpoint-down($upper, $breakpoints) {\n @content;\n }\n }\n}\n\n// Media between the breakpoint's minimum and maximum widths.\n// No minimum for the smallest breakpoint, and no maximum for the largest one.\n// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.\n@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n $next: breakpoint-next($name, $breakpoints);\n $max: breakpoint-max($next, $breakpoints);\n\n @if $min != null and $max != null {\n @media (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else if $max == null {\n @include media-breakpoint-up($name, $breakpoints) {\n @content;\n }\n } @else if $min == null {\n @include media-breakpoint-down($next, $breakpoints) {\n @content;\n }\n }\n}\n", "// scss-docs-start mixin-color-scheme\n@mixin color-scheme($name) {\n @media (prefers-color-scheme: #{$name}) {\n @content;\n }\n}\n// scss-docs-end mixin-color-scheme\n", "// Image Mixins\n// - Responsive image\n// - Retina image\n\n\n// Responsive image\n//\n// Keep images from scaling beyond the width of their parents.\n\n@mixin img-fluid {\n // Part 1: Set a maximum relative to the parent\n max-width: 100%;\n // Part 2: Override the height to auto, otherwise images will be stretched\n // when setting a width and height attribute on the img element.\n height: auto;\n}\n", "// Resize anything\n\n@mixin resizable($direction) {\n overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible`\n resize: $direction; // Options: horizontal, vertical, both\n}\n", "// stylelint-disable declaration-no-important\n\n// Hide content visually while keeping it accessible to assistive technologies\n//\n// See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/\n// See: https://kittygiraudel.com/2016/10/13/css-hide-and-seek/\n\n@mixin visually-hidden() {\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n margin: -1px !important; // Fix for https://github.com/twbs/bootstrap/issues/25686\n overflow: hidden !important;\n clip: rect(0, 0, 0, 0) !important;\n white-space: nowrap !important;\n border: 0 !important;\n}\n\n// Use to only display content when it's focused, or one of its child elements is focused\n// (i.e. when focus is within the element/container that the class was applied to)\n//\n// Useful for \"Skip to main content\" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1\n\n@mixin visually-hidden-focusable() {\n &:not(:focus):not(:focus-within) {\n @include visually-hidden();\n }\n}\n", - "@mixin reset-text {\n font-family: $font-family-base;\n // We deliberately do NOT reset font-size or overflow-wrap / word-wrap.\n font-style: normal;\n font-weight: $font-weight-normal;\n line-height: $line-height-base;\n text-align: left; // Fallback for where `start` is not supported\n text-align: start;\n text-decoration: none;\n text-shadow: none;\n text-transform: none;\n letter-spacing: normal;\n word-break: normal;\n word-spacing: normal;\n white-space: normal;\n line-break: auto;\n}\n", + "@mixin reset-text {\n font-family: $font-family-base;\n // We deliberately do NOT reset font-size or overflow-wrap / word-wrap.\n font-style: normal;\n font-weight: $font-weight-normal;\n line-height: $line-height-base;\n text-align: left; // Fallback for where `start` is not supported\n text-align: start;\n text-decoration: none;\n text-shadow: none;\n text-transform: none;\n letter-spacing: normal;\n word-break: normal;\n white-space: normal;\n word-spacing: normal;\n line-break: auto;\n}\n", "// Text truncate\n// Requires inline-block or block for proper styling\n\n@mixin text-truncate() {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n", - "// Utility generator\n// Used to generate utilities & print utilities\n@mixin generate-utility($utility, $infix, $is-rfs-media-query: false) {\n $values: map-get($utility, values);\n\n // If the values are a list or string, convert it into a map\n @if type-of($values) == \"string\" or type-of(nth($values, 1)) != \"list\" {\n $values: zip($values, $values);\n }\n\n @each $key, $value in $values {\n $properties: map-get($utility, property);\n\n // Multiple properties are possible, for example with vertical or horizontal margins or paddings\n @if type-of($properties) == \"string\" {\n $properties: append((), $properties);\n }\n\n // Use custom class if present\n $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1));\n $property-class: if($property-class == null, \"\", $property-class);\n\n // State params to generate pseudo-classes\n $state: if(map-has-key($utility, state), map-get($utility, state), ());\n\n $infix: if($property-class == \"\" and str-slice($infix, 1, 1) == \"-\", str-slice($infix, 2), $infix);\n\n // Don't prefix if value key is null (eg. with shadow class)\n $property-class-modifier: if($key, if($property-class == \"\" and $infix == \"\", \"\", \"-\") + $key, \"\");\n\n @if map-get($utility, rfs) {\n // Inside the media query\n @if $is-rfs-media-query {\n $val: rfs-value($value);\n\n // Do not render anything if fluid and non fluid values are the same\n $value: if($val == rfs-fluid-value($value), null, $val);\n }\n @else {\n $value: rfs-fluid-value($value);\n }\n }\n\n $is-css-var: map-get($utility, css-var);\n $is-local-vars: map-get($utility, local-vars);\n $is-rtl: map-get($utility, rtl);\n\n @if $value != null {\n @if $is-rtl == false {\n /* rtl:begin:remove */\n }\n\n @if $is-css-var {\n .#{$property-class + $infix + $property-class-modifier} {\n --#{$variable-prefix}#{$property-class}: #{$value};\n }\n\n @each $pseudo in $state {\n .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {\n --#{$variable-prefix}#{$property-class}: #{$value};\n }\n }\n } @else {\n .#{$property-class + $infix + $property-class-modifier} {\n @each $property in $properties {\n @if $is-local-vars {\n @each $local-var, $value in $is-local-vars {\n --#{$variable-prefix}#{$local-var}: #{$value};\n }\n }\n #{$property}: $value if($enable-important-utilities, !important, null);\n }\n }\n\n @each $pseudo in $state {\n .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {\n @each $property in $properties {\n #{$property}: $value if($enable-important-utilities, !important, null);\n }\n }\n }\n }\n\n @if $is-rtl == false {\n /* rtl:end:remove */\n }\n }\n }\n}\n", - "// scss-docs-start alert-variant-mixin\n@mixin alert-variant($background, $border, $color) {\n color: $color;\n @include gradient-bg($background);\n border-color: $border;\n\n .alert-link {\n color: shade-color($color, 20%);\n }\n}\n// scss-docs-end alert-variant-mixin\n", + "// Utility generator\n// Used to generate utilities & print utilities\n@mixin generate-utility($utility, $infix, $is-rfs-media-query: false) {\n $values: map-get($utility, values);\n\n // If the values are a list or string, convert it into a map\n @if type-of($values) == \"string\" or type-of(nth($values, 1)) != \"list\" {\n $values: zip($values, $values);\n }\n\n @each $key, $value in $values {\n $properties: map-get($utility, property);\n\n // Multiple properties are possible, for example with vertical or horizontal margins or paddings\n @if type-of($properties) == \"string\" {\n $properties: append((), $properties);\n }\n\n // Use custom class if present\n $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1));\n $property-class: if($property-class == null, \"\", $property-class);\n\n // Use custom CSS variable name if present, otherwise default to `class`\n $css-variable-name: if(map-has-key($utility, css-variable-name), map-get($utility, css-variable-name), map-get($utility, class));\n\n // State params to generate pseudo-classes\n $state: if(map-has-key($utility, state), map-get($utility, state), ());\n\n $infix: if($property-class == \"\" and str-slice($infix, 1, 1) == \"-\", str-slice($infix, 2), $infix);\n\n // Don't prefix if value key is null (eg. with shadow class)\n $property-class-modifier: if($key, if($property-class == \"\" and $infix == \"\", \"\", \"-\") + $key, \"\");\n\n @if map-get($utility, rfs) {\n // Inside the media query\n @if $is-rfs-media-query {\n $val: rfs-value($value);\n\n // Do not render anything if fluid and non fluid values are the same\n $value: if($val == rfs-fluid-value($value), null, $val);\n }\n @else {\n $value: rfs-fluid-value($value);\n }\n }\n\n $is-css-var: map-get($utility, css-var);\n $is-local-vars: map-get($utility, local-vars);\n $is-rtl: map-get($utility, rtl);\n\n @if $value != null {\n @if $is-rtl == false {\n /* rtl:begin:remove */\n }\n\n @if $is-css-var {\n .#{$property-class + $infix + $property-class-modifier} {\n --#{$prefix}#{$css-variable-name}: #{$value};\n }\n\n @each $pseudo in $state {\n .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {\n --#{$prefix}#{$css-variable-name}: #{$value};\n }\n }\n } @else {\n .#{$property-class + $infix + $property-class-modifier} {\n @each $property in $properties {\n @if $is-local-vars {\n @each $local-var, $variable in $is-local-vars {\n --#{$prefix}#{$local-var}: #{$variable};\n }\n }\n #{$property}: $value if($enable-important-utilities, !important, null);\n }\n }\n\n @each $pseudo in $state {\n .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {\n @each $property in $properties {\n #{$property}: $value if($enable-important-utilities, !important, null);\n }\n }\n }\n }\n\n @if $is-rtl == false {\n /* rtl:end:remove */\n }\n }\n }\n}\n", + "// scss-docs-start alert-variant-mixin\n@mixin alert-variant($background, $border, $color) {\n --#{$prefix}alert-color: #{$color};\n --#{$prefix}alert-bg: #{$background};\n --#{$prefix}alert-border-color: #{$border};\n\n @if $enable-gradients {\n background-image: var(--#{$prefix}gradient);\n }\n\n .alert-link {\n color: shade-color($color, 20%);\n }\n}\n// scss-docs-end alert-variant-mixin\n", "// Shared between modals and offcanvases\n@mixin overlay-backdrop($zindex, $backdrop-bg, $backdrop-opacity) {\n position: fixed;\n top: 0;\n left: 0;\n z-index: $zindex;\n width: 100vw;\n height: 100vh;\n background-color: $backdrop-bg;\n\n // Fade for backdrop\n &.fade { opacity: 0; }\n &.show { opacity: $backdrop-opacity; }\n}\n", - "// Button variants\n//\n// Easily pump out default styles, as well as :hover, :focus, :active,\n// and disabled options for all buttons\n\n// scss-docs-start btn-variant-mixin\n@mixin button-variant(\n $background,\n $border,\n $color: color-contrast($background),\n $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),\n $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),\n $hover-color: color-contrast($hover-background),\n $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),\n $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),\n $active-color: color-contrast($active-background),\n $disabled-background: $background,\n $disabled-border: $border,\n $disabled-color: color-contrast($disabled-background)\n) {\n color: $color;\n @include gradient-bg($background);\n border-color: $border;\n @include box-shadow($btn-box-shadow);\n\n &:hover {\n color: $hover-color;\n @include gradient-bg($hover-background);\n border-color: $hover-border;\n }\n\n .btn-check:focus + &,\n &:focus {\n color: $hover-color;\n @include gradient-bg($hover-background);\n border-color: $hover-border;\n @if $enable-shadows {\n @include box-shadow($btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));\n } @else {\n // Avoid using mixin so we can pass custom focus shadow properly\n box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);\n }\n }\n\n .btn-check:checked + &,\n .btn-check:active + &,\n &:active,\n &.active,\n .show > &.dropdown-toggle {\n color: $active-color;\n background-color: $active-background;\n // Remove CSS gradients if they're enabled\n background-image: if($enable-gradients, none, null);\n border-color: $active-border;\n\n &:focus {\n @if $enable-shadows {\n @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));\n } @else {\n // Avoid using mixin so we can pass custom focus shadow properly\n box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);\n }\n }\n }\n\n &:disabled,\n &.disabled {\n color: $disabled-color;\n background-color: $disabled-background;\n // Remove CSS gradients if they're enabled\n background-image: if($enable-gradients, none, null);\n border-color: $disabled-border;\n }\n}\n// scss-docs-end btn-variant-mixin\n\n// scss-docs-start btn-outline-variant-mixin\n@mixin button-outline-variant(\n $color,\n $color-hover: color-contrast($color),\n $active-background: $color,\n $active-border: $color,\n $active-color: color-contrast($active-background)\n) {\n color: $color;\n border-color: $color;\n\n &:hover {\n color: $color-hover;\n background-color: $active-background;\n border-color: $active-border;\n }\n\n .btn-check:focus + &,\n &:focus {\n box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);\n }\n\n .btn-check:checked + &,\n .btn-check:active + &,\n &:active,\n &.active,\n &.dropdown-toggle.show {\n color: $active-color;\n background-color: $active-background;\n border-color: $active-border;\n\n &:focus {\n @if $enable-shadows {\n @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5));\n } @else {\n // Avoid using mixin so we can pass custom focus shadow properly\n box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);\n }\n }\n }\n\n &:disabled,\n &.disabled {\n color: $color;\n background-color: transparent;\n }\n}\n// scss-docs-end btn-outline-variant-mixin\n\n// scss-docs-start btn-size-mixin\n@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {\n padding: $padding-y $padding-x;\n @include font-size($font-size);\n // Manually declare to provide an override to the browser default\n @include border-radius($border-radius, 0);\n}\n// scss-docs-end btn-size-mixin\n", + "// stylelint-disable custom-property-empty-line-before\n\n// Button variants\n//\n// Easily pump out default styles, as well as :hover, :focus, :active,\n// and disabled options for all buttons\n\n// scss-docs-start btn-variant-mixin\n@mixin button-variant(\n $background,\n $border,\n $color: color-contrast($background),\n $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),\n $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),\n $hover-color: color-contrast($hover-background),\n $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),\n $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),\n $active-color: color-contrast($active-background),\n $disabled-background: $background,\n $disabled-border: $border,\n $disabled-color: color-contrast($disabled-background)\n) {\n --#{$prefix}btn-color: #{$color};\n --#{$prefix}btn-bg: #{$background};\n --#{$prefix}btn-border-color: #{$border};\n --#{$prefix}btn-hover-color: #{$hover-color};\n --#{$prefix}btn-hover-bg: #{$hover-background};\n --#{$prefix}btn-hover-border-color: #{$hover-border};\n --#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix($color, $border, 15%))};\n --#{$prefix}btn-active-color: #{$active-color};\n --#{$prefix}btn-active-bg: #{$active-background};\n --#{$prefix}btn-active-border-color: #{$active-border};\n --#{$prefix}btn-active-shadow: #{$btn-active-box-shadow};\n --#{$prefix}btn-disabled-color: #{$disabled-color};\n --#{$prefix}btn-disabled-bg: #{$disabled-background};\n --#{$prefix}btn-disabled-border-color: #{$disabled-border};\n}\n// scss-docs-end btn-variant-mixin\n\n// scss-docs-start btn-outline-variant-mixin\n@mixin button-outline-variant(\n $color,\n $color-hover: color-contrast($color),\n $active-background: $color,\n $active-border: $color,\n $active-color: color-contrast($active-background)\n) {\n --#{$prefix}btn-color: #{$color};\n --#{$prefix}btn-border-color: #{$color};\n --#{$prefix}btn-hover-color: #{$color-hover};\n --#{$prefix}btn-hover-bg: #{$active-background};\n --#{$prefix}btn-hover-border-color: #{$active-border};\n --#{$prefix}btn-focus-shadow-rgb: #{to-rgb($color)};\n --#{$prefix}btn-active-color: #{$active-color};\n --#{$prefix}btn-active-bg: #{$active-background};\n --#{$prefix}btn-active-border-color: #{$active-border};\n --#{$prefix}btn-active-shadow: #{$btn-active-box-shadow};\n --#{$prefix}btn-disabled-color: #{$color};\n --#{$prefix}btn-disabled-bg: transparent;\n --#{$prefix}gradient: none;\n}\n// scss-docs-end btn-outline-variant-mixin\n\n// scss-docs-start btn-size-mixin\n@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {\n --#{$prefix}btn-padding-y: #{$padding-y};\n --#{$prefix}btn-padding-x: #{$padding-x};\n @include rfs($font-size, --#{$prefix}btn-font-size);\n --#{$prefix}btn-border-radius: #{$border-radius};\n}\n// scss-docs-end btn-size-mixin\n", "// scss-docs-start caret-mixins\n@mixin caret-down {\n border-top: $caret-width solid;\n border-right: $caret-width solid transparent;\n border-bottom: 0;\n border-left: $caret-width solid transparent;\n}\n\n@mixin caret-up {\n border-top: 0;\n border-right: $caret-width solid transparent;\n border-bottom: $caret-width solid;\n border-left: $caret-width solid transparent;\n}\n\n@mixin caret-end {\n border-top: $caret-width solid transparent;\n border-right: 0;\n border-bottom: $caret-width solid transparent;\n border-left: $caret-width solid;\n}\n\n@mixin caret-start {\n border-top: $caret-width solid transparent;\n border-right: $caret-width solid;\n border-bottom: $caret-width solid transparent;\n}\n\n@mixin caret($direction: down) {\n @if $enable-caret {\n &::after {\n display: inline-block;\n margin-left: $caret-spacing;\n vertical-align: $caret-vertical-align;\n content: \"\";\n @if $direction == down {\n @include caret-down();\n } @else if $direction == up {\n @include caret-up();\n } @else if $direction == end {\n @include caret-end();\n }\n }\n\n @if $direction == start {\n &::after {\n display: none;\n }\n\n &::before {\n display: inline-block;\n margin-right: $caret-spacing;\n vertical-align: $caret-vertical-align;\n content: \"\";\n @include caret-start();\n }\n }\n\n &:empty::after {\n margin-left: 0;\n }\n }\n}\n// scss-docs-end caret-mixins\n", - "// Pagination\n\n// scss-docs-start pagination-mixin\n@mixin pagination-size($padding-y, $padding-x, $font-size, $border-radius) {\n .page-link {\n padding: $padding-y $padding-x;\n @include font-size($font-size);\n }\n\n .page-item {\n @if $pagination-margin-start == (-$pagination-border-width) {\n &:first-child {\n .page-link {\n @include border-start-radius($border-radius);\n }\n }\n\n &:last-child {\n .page-link {\n @include border-end-radius($border-radius);\n }\n }\n } @else {\n //Add border-radius to all pageLinks in case they have left margin\n .page-link {\n @include border-radius($border-radius);\n }\n }\n }\n}\n// scss-docs-end pagination-mixin\n", + "// Pagination\n\n// scss-docs-start pagination-mixin\n@mixin pagination-size($padding-y, $padding-x, $font-size, $border-radius) {\n --#{$prefix}pagination-padding-x: #{$padding-x};\n --#{$prefix}pagination-padding-y: #{$padding-y};\n @include rfs($font-size, --#{$prefix}pagination-font-size);\n --#{$prefix}pagination-border-radius: #{$border-radius}; // stylelint-disable-line custom-property-empty-line-before\n}\n// scss-docs-end pagination-mixin\n", "// Lists\n\n// Unstyled keeps list items block level, just removes default browser padding and list-style\n@mixin list-unstyled {\n padding-left: 0;\n list-style: none;\n}\n", "// List Groups\n\n// scss-docs-start list-group-mixin\n@mixin list-group-item-variant($state, $background, $color) {\n .list-group-item-#{$state} {\n color: $color;\n background-color: $background;\n\n &.list-group-item-action {\n &:hover,\n &:focus {\n color: $color;\n background-color: shade-color($background, 10%);\n }\n\n &.active {\n color: $white;\n background-color: $color;\n border-color: $color;\n }\n }\n }\n}\n// scss-docs-end list-group-mixin\n", - "// This mixin uses an `if()` technique to be compatible with Dart Sass\n// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details\n\n// scss-docs-start form-validation-mixins\n@mixin form-validation-state-selector($state) {\n @if ($state == \"valid\" or $state == \"invalid\") {\n .was-validated #{if(&, \"&\", \"\")}:#{$state},\n #{if(&, \"&\", \"\")}.is-#{$state} {\n @content;\n }\n } @else {\n #{if(&, \"&\", \"\")}.is-#{$state} {\n @content;\n }\n }\n}\n\n@mixin form-validation-state(\n $state,\n $color,\n $icon,\n $tooltip-color: color-contrast($color),\n $tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity),\n $focus-box-shadow: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity)\n) {\n .#{$state}-feedback {\n display: none;\n width: 100%;\n margin-top: $form-feedback-margin-top;\n @include font-size($form-feedback-font-size);\n font-style: $form-feedback-font-style;\n color: $color;\n }\n\n .#{$state}-tooltip {\n position: absolute;\n top: 100%;\n z-index: 5;\n display: none;\n max-width: 100%; // Contain to parent when possible\n padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;\n margin-top: .1rem;\n @include font-size($form-feedback-tooltip-font-size);\n line-height: $form-feedback-tooltip-line-height;\n color: $tooltip-color;\n background-color: $tooltip-bg-color;\n @include border-radius($form-feedback-tooltip-border-radius);\n }\n\n @include form-validation-state-selector($state) {\n ~ .#{$state}-feedback,\n ~ .#{$state}-tooltip {\n display: block;\n }\n }\n\n .form-control {\n @include form-validation-state-selector($state) {\n border-color: $color;\n\n @if $enable-validation-icons {\n padding-right: $input-height-inner;\n background-image: escape-svg($icon);\n background-repeat: no-repeat;\n background-position: right $input-height-inner-quarter center;\n background-size: $input-height-inner-half $input-height-inner-half;\n }\n\n &:focus {\n border-color: $color;\n box-shadow: $focus-box-shadow;\n }\n }\n }\n\n // stylelint-disable-next-line selector-no-qualifying-type\n textarea.form-control {\n @include form-validation-state-selector($state) {\n @if $enable-validation-icons {\n padding-right: $input-height-inner;\n background-position: top $input-height-inner-quarter right $input-height-inner-quarter;\n }\n }\n }\n\n .form-select {\n @include form-validation-state-selector($state) {\n border-color: $color;\n\n @if $enable-validation-icons {\n &:not([multiple]):not([size]),\n &:not([multiple])[size=\"1\"] {\n padding-right: $form-select-feedback-icon-padding-end;\n background-image: escape-svg($form-select-indicator), escape-svg($icon);\n background-position: $form-select-bg-position, $form-select-feedback-icon-position;\n background-size: $form-select-bg-size, $form-select-feedback-icon-size;\n }\n }\n\n &:focus {\n border-color: $color;\n box-shadow: $focus-box-shadow;\n }\n }\n }\n\n .form-check-input {\n @include form-validation-state-selector($state) {\n border-color: $color;\n\n &:checked {\n background-color: $color;\n }\n\n &:focus {\n box-shadow: $focus-box-shadow;\n }\n\n ~ .form-check-label {\n color: $color;\n }\n }\n }\n .form-check-inline .form-check-input {\n ~ .#{$state}-feedback {\n margin-left: .5em;\n }\n }\n\n .input-group .form-control,\n .input-group .form-select {\n @include form-validation-state-selector($state) {\n @if $state == \"valid\" {\n z-index: 1;\n } @else if $state == \"invalid\" {\n z-index: 2;\n }\n &:focus {\n z-index: 3;\n }\n }\n }\n}\n// scss-docs-end form-validation-mixins\n", - "// scss-docs-start table-variant\n@mixin table-variant($state, $background) {\n .table-#{$state} {\n $color: color-contrast(opaque($body-bg, $background));\n $hover-bg: mix($color, $background, percentage($table-hover-bg-factor));\n $striped-bg: mix($color, $background, percentage($table-striped-bg-factor));\n $active-bg: mix($color, $background, percentage($table-active-bg-factor));\n\n --#{$variable-prefix}table-bg: #{$background};\n --#{$variable-prefix}table-striped-bg: #{$striped-bg};\n --#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)};\n --#{$variable-prefix}table-active-bg: #{$active-bg};\n --#{$variable-prefix}table-active-color: #{color-contrast($active-bg)};\n --#{$variable-prefix}table-hover-bg: #{$hover-bg};\n --#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)};\n\n color: $color;\n border-color: mix($color, $background, percentage($table-border-factor));\n }\n}\n// scss-docs-end table-variant\n", + "// This mixin uses an `if()` technique to be compatible with Dart Sass\n// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details\n\n// scss-docs-start form-validation-mixins\n@mixin form-validation-state-selector($state) {\n @if ($state == \"valid\" or $state == \"invalid\") {\n .was-validated #{if(&, \"&\", \"\")}:#{$state},\n #{if(&, \"&\", \"\")}.is-#{$state} {\n @content;\n }\n } @else {\n #{if(&, \"&\", \"\")}.is-#{$state} {\n @content;\n }\n }\n}\n\n@mixin form-validation-state(\n $state,\n $color,\n $icon,\n $tooltip-color: color-contrast($color),\n $tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity),\n $focus-box-shadow: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity)\n) {\n .#{$state}-feedback {\n display: none;\n width: 100%;\n margin-top: $form-feedback-margin-top;\n @include font-size($form-feedback-font-size);\n font-style: $form-feedback-font-style;\n color: $color;\n }\n\n .#{$state}-tooltip {\n position: absolute;\n top: 100%;\n z-index: 5;\n display: none;\n max-width: 100%; // Contain to parent when possible\n padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;\n margin-top: .1rem;\n @include font-size($form-feedback-tooltip-font-size);\n line-height: $form-feedback-tooltip-line-height;\n color: $tooltip-color;\n background-color: $tooltip-bg-color;\n @include border-radius($form-feedback-tooltip-border-radius);\n }\n\n @include form-validation-state-selector($state) {\n ~ .#{$state}-feedback,\n ~ .#{$state}-tooltip {\n display: block;\n }\n }\n\n .form-control {\n @include form-validation-state-selector($state) {\n border-color: $color;\n\n @if $enable-validation-icons {\n padding-right: $input-height-inner;\n background-image: escape-svg($icon);\n background-repeat: no-repeat;\n background-position: right $input-height-inner-quarter center;\n background-size: $input-height-inner-half $input-height-inner-half;\n }\n\n &:focus {\n border-color: $color;\n box-shadow: $focus-box-shadow;\n }\n }\n }\n\n // stylelint-disable-next-line selector-no-qualifying-type\n textarea.form-control {\n @include form-validation-state-selector($state) {\n @if $enable-validation-icons {\n padding-right: $input-height-inner;\n background-position: top $input-height-inner-quarter right $input-height-inner-quarter;\n }\n }\n }\n\n .form-select {\n @include form-validation-state-selector($state) {\n border-color: $color;\n\n @if $enable-validation-icons {\n &:not([multiple]):not([size]),\n &:not([multiple])[size=\"1\"] {\n padding-right: $form-select-feedback-icon-padding-end;\n background-image: escape-svg($form-select-indicator), escape-svg($icon);\n background-position: $form-select-bg-position, $form-select-feedback-icon-position;\n background-size: $form-select-bg-size, $form-select-feedback-icon-size;\n }\n }\n\n &:focus {\n border-color: $color;\n box-shadow: $focus-box-shadow;\n }\n }\n }\n\n .form-control-color {\n @include form-validation-state-selector($state) {\n @if $enable-validation-icons {\n width: add($form-color-width, $input-height-inner);\n }\n }\n }\n\n .form-check-input {\n @include form-validation-state-selector($state) {\n border-color: $color;\n\n &:checked {\n background-color: $color;\n }\n\n &:focus {\n box-shadow: $focus-box-shadow;\n }\n\n ~ .form-check-label {\n color: $color;\n }\n }\n }\n .form-check-inline .form-check-input {\n ~ .#{$state}-feedback {\n margin-left: .5em;\n }\n }\n\n .input-group .form-control,\n .input-group .form-select {\n @include form-validation-state-selector($state) {\n @if $state == \"valid\" {\n z-index: 1;\n } @else if $state == \"invalid\" {\n z-index: 2;\n }\n &:focus {\n z-index: 3;\n }\n }\n }\n}\n// scss-docs-end form-validation-mixins\n", + "// scss-docs-start table-variant\n@mixin table-variant($state, $background) {\n .table-#{$state} {\n $color: color-contrast(opaque($body-bg, $background));\n $hover-bg: mix($color, $background, percentage($table-hover-bg-factor));\n $striped-bg: mix($color, $background, percentage($table-striped-bg-factor));\n $active-bg: mix($color, $background, percentage($table-active-bg-factor));\n $border-color: mix($color, $background, percentage($table-border-factor));\n\n --#{$prefix}table-color: #{$color};\n --#{$prefix}table-bg: #{$background};\n --#{$prefix}table-border-color: #{$border-color};\n --#{$prefix}table-striped-bg: #{$striped-bg};\n --#{$prefix}table-striped-color: #{color-contrast($striped-bg)};\n --#{$prefix}table-active-bg: #{$active-bg};\n --#{$prefix}table-active-color: #{color-contrast($active-bg)};\n --#{$prefix}table-hover-bg: #{$hover-bg};\n --#{$prefix}table-hover-color: #{color-contrast($hover-bg)};\n\n color: var(--#{$prefix}table-color);\n border-color: var(--#{$prefix}table-border-color);\n }\n}\n// scss-docs-end table-variant\n", "// stylelint-disable property-disallowed-list\n// Single side border-radius\n\n// Helper function to replace negative values with 0\n@function valid-radius($radius) {\n $return: ();\n @each $value in $radius {\n @if type-of($value) == number {\n $return: append($return, max($value, 0));\n } @else {\n $return: append($return, $value);\n }\n }\n @return $return;\n}\n\n// scss-docs-start border-radius-mixins\n@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {\n @if $enable-rounded {\n border-radius: valid-radius($radius);\n }\n @else if $fallback-border-radius != false {\n border-radius: $fallback-border-radius;\n }\n}\n\n@mixin border-top-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-left-radius: valid-radius($radius);\n border-top-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-end-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-right-radius: valid-radius($radius);\n border-bottom-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-bottom-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-bottom-right-radius: valid-radius($radius);\n border-bottom-left-radius: valid-radius($radius);\n }\n}\n\n@mixin border-start-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-left-radius: valid-radius($radius);\n border-bottom-left-radius: valid-radius($radius);\n }\n}\n\n@mixin border-top-start-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-left-radius: valid-radius($radius);\n }\n}\n\n@mixin border-top-end-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-top-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-bottom-end-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-bottom-right-radius: valid-radius($radius);\n }\n}\n\n@mixin border-bottom-start-radius($radius: $border-radius) {\n @if $enable-rounded {\n border-bottom-left-radius: valid-radius($radius);\n }\n}\n// scss-docs-end border-radius-mixins\n", "@mixin box-shadow($shadow...) {\n @if $enable-shadows {\n $result: ();\n\n @each $value in $shadow {\n @if $value != null {\n $result: append($result, $value, \"comma\");\n }\n @if $value == none and length($shadow) > 1 {\n @warn \"The keyword 'none' must be used as a single argument.\";\n }\n }\n\n @if (length($result) > 0) {\n box-shadow: $result;\n }\n }\n}\n", - "// Gradients\n\n// scss-docs-start gradient-bg-mixin\n@mixin gradient-bg($color: null) {\n background-color: $color;\n\n @if $enable-gradients {\n background-image: var(--#{$variable-prefix}gradient);\n }\n}\n// scss-docs-end gradient-bg-mixin\n\n// scss-docs-start gradient-mixins\n// Horizontal gradient, from left to right\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n@mixin gradient-x($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {\n background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);\n}\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n@mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: null, $end-percent: null) {\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);\n}\n\n@mixin gradient-directional($start-color: $gray-700, $end-color: $gray-800, $deg: 45deg) {\n background-image: linear-gradient($deg, $start-color, $end-color);\n}\n\n@mixin gradient-x-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {\n background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);\n}\n\n@mixin gradient-y-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {\n background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);\n}\n\n@mixin gradient-radial($inner-color: $gray-700, $outer-color: $gray-800) {\n background-image: radial-gradient(circle, $inner-color, $outer-color);\n}\n\n@mixin gradient-striped($color: rgba($white, .15), $angle: 45deg) {\n background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);\n}\n// scss-docs-end gradient-mixins\n", + "// Gradients\n\n// scss-docs-start gradient-bg-mixin\n@mixin gradient-bg($color: null) {\n background-color: $color;\n\n @if $enable-gradients {\n background-image: var(--#{$prefix}gradient);\n }\n}\n// scss-docs-end gradient-bg-mixin\n\n// scss-docs-start gradient-mixins\n// Horizontal gradient, from left to right\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n@mixin gradient-x($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {\n background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);\n}\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n@mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: null, $end-percent: null) {\n background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);\n}\n\n@mixin gradient-directional($start-color: $gray-700, $end-color: $gray-800, $deg: 45deg) {\n background-image: linear-gradient($deg, $start-color, $end-color);\n}\n\n@mixin gradient-x-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {\n background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);\n}\n\n@mixin gradient-y-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {\n background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);\n}\n\n@mixin gradient-radial($inner-color: $gray-700, $outer-color: $gray-800) {\n background-image: radial-gradient(circle, $inner-color, $outer-color);\n}\n\n@mixin gradient-striped($color: rgba($white, .15), $angle: 45deg) {\n background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);\n}\n// scss-docs-end gradient-mixins\n", "// stylelint-disable property-disallowed-list\n@mixin transition($transition...) {\n @if length($transition) == 0 {\n $transition: $transition-base;\n }\n\n @if length($transition) > 1 {\n @each $value in $transition {\n @if $value == null or $value == none {\n @warn \"The keyword 'none' or 'null' must be used as a single argument.\";\n }\n }\n }\n\n @if $enable-transitions {\n @if nth($transition, 1) != null {\n transition: $transition;\n }\n\n @if $enable-reduced-motion and nth($transition, 1) != null and nth($transition, 1) != none {\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n }\n }\n}\n", "// scss-docs-start clearfix\n@mixin clearfix() {\n &::after {\n display: block;\n clear: both;\n content: \"\";\n }\n}\n// scss-docs-end clearfix\n", - "// Container mixins\n\n@mixin make-container($gutter: $container-padding-x) {\n width: 100%;\n padding-right: var(--#{$variable-prefix}gutter-x, #{$gutter});\n padding-left: var(--#{$variable-prefix}gutter-x, #{$gutter});\n margin-right: auto;\n margin-left: auto;\n}\n", - "// Grid system\n//\n// Generate semantic grid columns with these mixins.\n\n@mixin make-row($gutter: $grid-gutter-width) {\n --#{$variable-prefix}gutter-x: #{$gutter};\n --#{$variable-prefix}gutter-y: 0;\n display: flex;\n flex-wrap: wrap;\n // TODO: Revisit calc order after https://github.com/react-bootstrap/react-bootstrap/issues/6039 is fixed\n margin-top: calc(-1 * var(--#{$variable-prefix}gutter-y)); // stylelint-disable-line function-disallowed-list\n margin-right: calc(-.5 * var(--#{$variable-prefix}gutter-x)); // stylelint-disable-line function-disallowed-list\n margin-left: calc(-.5 * var(--#{$variable-prefix}gutter-x)); // stylelint-disable-line function-disallowed-list\n}\n\n@mixin make-col-ready($gutter: $grid-gutter-width) {\n // Add box sizing if only the grid is loaded\n box-sizing: if(variable-exists(include-column-box-sizing) and $include-column-box-sizing, border-box, null);\n // Prevent columns from becoming too narrow when at smaller grid tiers by\n // always setting `width: 100%;`. This works because we set the width\n // later on to override this initial width.\n flex-shrink: 0;\n width: 100%;\n max-width: 100%; // Prevent `.col-auto`, `.col` (& responsive variants) from breaking out the grid\n padding-right: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list\n padding-left: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list\n margin-top: var(--#{$variable-prefix}gutter-y);\n}\n\n@mixin make-col($size: false, $columns: $grid-columns) {\n @if $size {\n flex: 0 0 auto;\n width: percentage(divide($size, $columns));\n\n } @else {\n flex: 1 1 0;\n max-width: 100%;\n }\n}\n\n@mixin make-col-auto() {\n flex: 0 0 auto;\n width: auto;\n}\n\n@mixin make-col-offset($size, $columns: $grid-columns) {\n $num: divide($size, $columns);\n margin-left: if($num == 0, 0, percentage($num));\n}\n\n// Row columns\n//\n// Specify on a parent element(e.g., .row) to force immediate children into NN\n// numberof columns. Supports wrapping to new lines, but does not do a Masonry\n// style grid.\n@mixin row-cols($count) {\n > * {\n flex: 0 0 auto;\n width: divide(100%, $count);\n }\n}\n\n// Framework grid generation\n//\n// Used only by Bootstrap to generate the correct number of grid classes given\n// any value of `$grid-columns`.\n\n@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {\n @each $breakpoint in map-keys($breakpoints) {\n $infix: breakpoint-infix($breakpoint, $breakpoints);\n\n @include media-breakpoint-up($breakpoint, $breakpoints) {\n // Provide basic `.col-{bp}` classes for equal-width flexbox columns\n .col#{$infix} {\n flex: 1 0 0%; // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4\n }\n\n .row-cols#{$infix}-auto > * {\n @include make-col-auto();\n }\n\n @if $grid-row-columns > 0 {\n @for $i from 1 through $grid-row-columns {\n .row-cols#{$infix}-#{$i} {\n @include row-cols($i);\n }\n }\n }\n\n .col#{$infix}-auto {\n @include make-col-auto();\n }\n\n @if $columns > 0 {\n @for $i from 1 through $columns {\n .col#{$infix}-#{$i} {\n @include make-col($i, $columns);\n }\n }\n\n // `$columns - 1` because offsetting by the width of an entire row isn't possible\n @for $i from 0 through ($columns - 1) {\n @if not ($infix == \"\" and $i == 0) { // Avoid emitting useless .offset-0\n .offset#{$infix}-#{$i} {\n @include make-col-offset($i, $columns);\n }\n }\n }\n }\n\n // Gutters\n //\n // Make use of `.g-*`, `.gx-*` or `.gy-*` utilities to change spacing between the columns.\n @each $key, $value in $gutters {\n .g#{$infix}-#{$key},\n .gx#{$infix}-#{$key} {\n --#{$variable-prefix}gutter-x: #{$value};\n }\n\n .g#{$infix}-#{$key},\n .gy#{$infix}-#{$key} {\n --#{$variable-prefix}gutter-y: #{$value};\n }\n }\n }\n }\n}\n\n@mixin make-cssgrid($columns: $grid-columns, $breakpoints: $grid-breakpoints) {\n @each $breakpoint in map-keys($breakpoints) {\n $infix: breakpoint-infix($breakpoint, $breakpoints);\n\n @include media-breakpoint-up($breakpoint, $breakpoints) {\n @if $columns > 0 {\n @for $i from 1 through $columns {\n .g-col#{$infix}-#{$i} {\n grid-column: auto / span $i;\n }\n }\n\n // Start with `1` because `0` is and invalid value.\n // Ends with `$columns - 1` because offsetting by the width of an entire row isn't possible.\n @for $i from 1 through ($columns - 1) {\n .g-start#{$infix}-#{$i} {\n grid-column-start: $i;\n }\n }\n }\n }\n }\n}\n", - "// stylelint-disable indentation\n\n// Utilities\n\n$utilities: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$utilities: map-merge(\n (\n // scss-docs-start utils-vertical-align\n \"align\": (\n property: vertical-align,\n class: align,\n values: baseline top middle bottom text-bottom text-top\n ),\n // scss-docs-end utils-vertical-align\n // scss-docs-start utils-float\n \"float\": (\n responsive: true,\n property: float,\n values: (\n start: left,\n end: right,\n none: none,\n )\n ),\n // scss-docs-end utils-float\n // Opacity utilities\n // scss-docs-start utils-opacity\n \"opacity\": (\n property: opacity,\n values: (\n 0: 0,\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1,\n )\n ),\n // scss-docs-end utils-opacity\n // scss-docs-start utils-overflow\n \"overflow\": (\n property: overflow,\n values: auto hidden visible scroll,\n ),\n // scss-docs-end utils-overflow\n // scss-docs-start utils-display\n \"display\": (\n responsive: true,\n print: true,\n property: display,\n class: d,\n values: inline inline-block block grid table table-row table-cell flex inline-flex none\n ),\n // scss-docs-end utils-display\n // scss-docs-start utils-shadow\n \"shadow\": (\n property: box-shadow,\n class: shadow,\n values: (\n null: $box-shadow,\n sm: $box-shadow-sm,\n lg: $box-shadow-lg,\n none: none,\n )\n ),\n // scss-docs-end utils-shadow\n // scss-docs-start utils-position\n \"position\": (\n property: position,\n values: static relative absolute fixed sticky\n ),\n \"top\": (\n property: top,\n values: $position-values\n ),\n \"bottom\": (\n property: bottom,\n values: $position-values\n ),\n \"start\": (\n property: left,\n class: start,\n values: $position-values\n ),\n \"end\": (\n property: right,\n class: end,\n values: $position-values\n ),\n \"translate-middle\": (\n property: transform,\n class: translate-middle,\n values: (\n null: translate(-50%, -50%),\n x: translateX(-50%),\n y: translateY(-50%),\n )\n ),\n // scss-docs-end utils-position\n // scss-docs-start utils-borders\n \"border\": (\n property: border,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-top\": (\n property: border-top,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-end\": (\n property: border-right,\n class: border-end,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-bottom\": (\n property: border-bottom,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-start\": (\n property: border-left,\n class: border-start,\n values: (\n null: $border-width solid $border-color,\n 0: 0,\n )\n ),\n \"border-color\": (\n property: border-color,\n class: border,\n values: map-merge($theme-colors, (\"white\": $white))\n ),\n \"border-width\": (\n property: border-width,\n class: border,\n values: $border-widths\n ),\n // scss-docs-end utils-borders\n // Sizing utilities\n // scss-docs-start utils-sizing\n \"width\": (\n property: width,\n class: w,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-width\": (\n property: max-width,\n class: mw,\n values: (100: 100%)\n ),\n \"viewport-width\": (\n property: width,\n class: vw,\n values: (100: 100vw)\n ),\n \"min-viewport-width\": (\n property: min-width,\n class: min-vw,\n values: (100: 100vw)\n ),\n \"height\": (\n property: height,\n class: h,\n values: (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n )\n ),\n \"max-height\": (\n property: max-height,\n class: mh,\n values: (100: 100%)\n ),\n \"viewport-height\": (\n property: height,\n class: vh,\n values: (100: 100vh)\n ),\n \"min-viewport-height\": (\n property: min-height,\n class: min-vh,\n values: (100: 100vh)\n ),\n // scss-docs-end utils-sizing\n // Flex utilities\n // scss-docs-start utils-flex\n \"flex\": (\n responsive: true,\n property: flex,\n values: (fill: 1 1 auto)\n ),\n \"flex-direction\": (\n responsive: true,\n property: flex-direction,\n class: flex,\n values: row column row-reverse column-reverse\n ),\n \"flex-grow\": (\n responsive: true,\n property: flex-grow,\n class: flex,\n values: (\n grow-0: 0,\n grow-1: 1,\n )\n ),\n \"flex-shrink\": (\n responsive: true,\n property: flex-shrink,\n class: flex,\n values: (\n shrink-0: 0,\n shrink-1: 1,\n )\n ),\n \"flex-wrap\": (\n responsive: true,\n property: flex-wrap,\n class: flex,\n values: wrap nowrap wrap-reverse\n ),\n \"gap\": (\n responsive: true,\n property: gap,\n class: gap,\n values: $spacers\n ),\n \"justify-content\": (\n responsive: true,\n property: justify-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n evenly: space-evenly,\n )\n ),\n \"align-items\": (\n responsive: true,\n property: align-items,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"align-content\": (\n responsive: true,\n property: align-content,\n values: (\n start: flex-start,\n end: flex-end,\n center: center,\n between: space-between,\n around: space-around,\n stretch: stretch,\n )\n ),\n \"align-self\": (\n responsive: true,\n property: align-self,\n values: (\n auto: auto,\n start: flex-start,\n end: flex-end,\n center: center,\n baseline: baseline,\n stretch: stretch,\n )\n ),\n \"order\": (\n responsive: true,\n property: order,\n values: (\n first: -1,\n 0: 0,\n 1: 1,\n 2: 2,\n 3: 3,\n 4: 4,\n 5: 5,\n last: 6,\n ),\n ),\n // scss-docs-end utils-flex\n // Margin utilities\n // scss-docs-start utils-spacing\n \"margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: map-merge($spacers, (auto: auto))\n ),\n \"margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: map-merge($spacers, (auto: auto))\n ),\n // Negative margin utilities\n \"negative-margin\": (\n responsive: true,\n property: margin,\n class: m,\n values: $negative-spacers\n ),\n \"negative-margin-x\": (\n responsive: true,\n property: margin-right margin-left,\n class: mx,\n values: $negative-spacers\n ),\n \"negative-margin-y\": (\n responsive: true,\n property: margin-top margin-bottom,\n class: my,\n values: $negative-spacers\n ),\n \"negative-margin-top\": (\n responsive: true,\n property: margin-top,\n class: mt,\n values: $negative-spacers\n ),\n \"negative-margin-end\": (\n responsive: true,\n property: margin-right,\n class: me,\n values: $negative-spacers\n ),\n \"negative-margin-bottom\": (\n responsive: true,\n property: margin-bottom,\n class: mb,\n values: $negative-spacers\n ),\n \"negative-margin-start\": (\n responsive: true,\n property: margin-left,\n class: ms,\n values: $negative-spacers\n ),\n // Padding utilities\n \"padding\": (\n responsive: true,\n property: padding,\n class: p,\n values: $spacers\n ),\n \"padding-x\": (\n responsive: true,\n property: padding-right padding-left,\n class: px,\n values: $spacers\n ),\n \"padding-y\": (\n responsive: true,\n property: padding-top padding-bottom,\n class: py,\n values: $spacers\n ),\n \"padding-top\": (\n responsive: true,\n property: padding-top,\n class: pt,\n values: $spacers\n ),\n \"padding-end\": (\n responsive: true,\n property: padding-right,\n class: pe,\n values: $spacers\n ),\n \"padding-bottom\": (\n responsive: true,\n property: padding-bottom,\n class: pb,\n values: $spacers\n ),\n \"padding-start\": (\n responsive: true,\n property: padding-left,\n class: ps,\n values: $spacers\n ),\n // scss-docs-end utils-spacing\n // Text\n // scss-docs-start utils-text\n \"font-family\": (\n property: font-family,\n class: font,\n values: (monospace: var(--#{$variable-prefix}font-monospace))\n ),\n \"font-size\": (\n rfs: true,\n property: font-size,\n class: fs,\n values: $font-sizes\n ),\n \"font-style\": (\n property: font-style,\n class: fst,\n values: italic normal\n ),\n \"font-weight\": (\n property: font-weight,\n class: fw,\n values: (\n light: $font-weight-light,\n lighter: $font-weight-lighter,\n normal: $font-weight-normal,\n bold: $font-weight-bold,\n bolder: $font-weight-bolder\n )\n ),\n \"line-height\": (\n property: line-height,\n class: lh,\n values: (\n 1: 1,\n sm: $line-height-sm,\n base: $line-height-base,\n lg: $line-height-lg,\n )\n ),\n \"text-align\": (\n responsive: true,\n property: text-align,\n class: text,\n values: (\n start: left,\n end: right,\n center: center,\n )\n ),\n \"text-decoration\": (\n property: text-decoration,\n values: none underline line-through\n ),\n \"text-transform\": (\n property: text-transform,\n class: text,\n values: lowercase uppercase capitalize\n ),\n \"white-space\": (\n property: white-space,\n class: text,\n values: (\n wrap: normal,\n nowrap: nowrap,\n )\n ),\n \"word-wrap\": (\n property: word-wrap word-break,\n class: text,\n values: (break: break-word),\n rtl: false\n ),\n // scss-docs-end utils-text\n // scss-docs-start utils-color\n \"color\": (\n property: color,\n class: text,\n local-vars: (\n \"text-opacity\": 1\n ),\n values: map-merge(\n $utilities-text-colors,\n (\n \"muted\": $text-muted,\n \"black-50\": rgba($black, .5), // deprecated\n \"white-50\": rgba($white, .5), // deprecated\n \"reset\": inherit,\n )\n )\n ),\n \"text-opacity\": (\n css-var: true,\n class: text-opacity,\n values: (\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1\n )\n ),\n // scss-docs-end utils-color\n // scss-docs-start utils-bg-color\n \"background-color\": (\n property: background-color,\n class: bg,\n local-vars: (\n \"bg-opacity\": 1\n ),\n values: map-merge(\n $utilities-bg-colors,\n (\n \"transparent\": transparent\n )\n )\n ),\n \"bg-opacity\": (\n css-var: true,\n class: bg-opacity,\n values: (\n 10: .1,\n 25: .25,\n 50: .5,\n 75: .75,\n 100: 1\n )\n ),\n // scss-docs-end utils-bg-color\n \"gradient\": (\n property: background-image,\n class: bg,\n values: (gradient: var(--#{$variable-prefix}gradient))\n ),\n // scss-docs-start utils-interaction\n \"user-select\": (\n property: user-select,\n values: all auto none\n ),\n \"pointer-events\": (\n property: pointer-events,\n class: pe,\n values: none auto,\n ),\n // scss-docs-end utils-interaction\n // scss-docs-start utils-border-radius\n \"rounded\": (\n property: border-radius,\n class: rounded,\n values: (\n null: $border-radius,\n 0: 0,\n 1: $border-radius-sm,\n 2: $border-radius,\n 3: $border-radius-lg,\n circle: 50%,\n pill: $border-radius-pill\n )\n ),\n \"rounded-top\": (\n property: border-top-left-radius border-top-right-radius,\n class: rounded-top,\n values: (null: $border-radius)\n ),\n \"rounded-end\": (\n property: border-top-right-radius border-bottom-right-radius,\n class: rounded-end,\n values: (null: $border-radius)\n ),\n \"rounded-bottom\": (\n property: border-bottom-right-radius border-bottom-left-radius,\n class: rounded-bottom,\n values: (null: $border-radius)\n ),\n \"rounded-start\": (\n property: border-bottom-left-radius border-top-left-radius,\n class: rounded-start,\n values: (null: $border-radius)\n ),\n // scss-docs-end utils-border-radius\n // scss-docs-start utils-visibility\n \"visibility\": (\n property: visibility,\n class: null,\n values: (\n visible: visible,\n invisible: hidden,\n )\n )\n // scss-docs-end utils-visibility\n ),\n $utilities\n);\n", - ":root {\n // Note: Custom variable values only support SassScript inside `#{}`.\n\n // Colors\n //\n // Generate palettes for full colors, grays, and theme colors.\n\n @each $color, $value in $colors {\n --#{$variable-prefix}#{$color}: #{$value};\n }\n\n @each $color, $value in $grays {\n --#{$variable-prefix}gray-#{$color}: #{$value};\n }\n\n @each $color, $value in $theme-colors {\n --#{$variable-prefix}#{$color}: #{$value};\n }\n\n @each $color, $value in $theme-colors-rgb {\n --#{$variable-prefix}#{$color}-rgb: #{$value};\n }\n\n --#{$variable-prefix}white-rgb: #{to-rgb($white)};\n --#{$variable-prefix}black-rgb: #{to-rgb($black)};\n --#{$variable-prefix}body-color-rgb: #{to-rgb($body-color)};\n --#{$variable-prefix}body-bg-rgb: #{to-rgb($body-bg)};\n\n // Fonts\n\n // Note: Use `inspect` for lists so that quoted items keep the quotes.\n // See https://github.com/sass/sass/issues/2383#issuecomment-336349172\n --#{$variable-prefix}font-sans-serif: #{inspect($font-family-sans-serif)};\n --#{$variable-prefix}font-monospace: #{inspect($font-family-monospace)};\n --#{$variable-prefix}gradient: #{$gradient};\n\n // Root and body\n // stylelint-disable custom-property-empty-line-before\n // scss-docs-start root-body-variables\n @if $font-size-root != null {\n --#{$variable-prefix}root-font-size: #{$font-size-root};\n }\n --#{$variable-prefix}body-font-family: #{$font-family-base};\n --#{$variable-prefix}body-font-size: #{$font-size-base};\n --#{$variable-prefix}body-font-weight: #{$font-weight-base};\n --#{$variable-prefix}body-line-height: #{$line-height-base};\n --#{$variable-prefix}body-color: #{$body-color};\n @if $body-text-align != null {\n --#{$variable-prefix}body-text-align: #{$body-text-align};\n }\n --#{$variable-prefix}body-bg: #{$body-bg};\n // scss-docs-end root-body-variables\n // stylelint-enable custom-property-empty-line-before\n}\n", - "// stylelint-disable declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix\n\n\n// Reboot\n//\n// Normalization of HTML elements, manually forked from Normalize.css to remove\n// styles targeting irrelevant browsers while applying new styles.\n//\n// Normalize is licensed MIT. https://github.com/necolas/normalize.css\n\n\n// Document\n//\n// Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n\n// Root\n//\n// Ability to the value of the root font sizes, affecting the value of `rem`.\n// null by default, thus nothing is generated.\n\n:root {\n @if $font-size-root != null {\n font-size: var(--#{$variable-prefix}root-font-size);\n }\n\n @if $enable-smooth-scroll {\n @media (prefers-reduced-motion: no-preference) {\n scroll-behavior: smooth;\n }\n }\n}\n\n\n// Body\n//\n// 1. Remove the margin in all browsers.\n// 2. As a best practice, apply a default `background-color`.\n// 3. Prevent adjustments of font size after orientation changes in iOS.\n// 4. Change the default tap highlight to be completely transparent in iOS.\n\n// scss-docs-start reboot-body-rules\nbody {\n margin: 0; // 1\n font-family: var(--#{$variable-prefix}body-font-family);\n @include font-size(var(--#{$variable-prefix}body-font-size));\n font-weight: var(--#{$variable-prefix}body-font-weight);\n line-height: var(--#{$variable-prefix}body-line-height);\n color: var(--#{$variable-prefix}body-color);\n text-align: var(--#{$variable-prefix}body-text-align);\n background-color: var(--#{$variable-prefix}body-bg); // 2\n -webkit-text-size-adjust: 100%; // 3\n -webkit-tap-highlight-color: rgba($black, 0); // 4\n}\n// scss-docs-end reboot-body-rules\n\n\n// Content grouping\n//\n// 1. Reset Firefox's gray color\n// 2. Set correct height and prevent the `size` attribute to make the `hr` look like an input field\n\nhr {\n margin: $hr-margin-y 0;\n color: $hr-color; // 1\n background-color: currentColor;\n border: 0;\n opacity: $hr-opacity;\n}\n\nhr:not([size]) {\n height: $hr-height; // 2\n}\n\n\n// Typography\n//\n// 1. Remove top margins from headings\n// By default, `

`-`

` all receive top and bottom margins. We nuke the top\n// margin for easier control within type scales as it avoids margin collapsing.\n\n%heading {\n margin-top: 0; // 1\n margin-bottom: $headings-margin-bottom;\n font-family: $headings-font-family;\n font-style: $headings-font-style;\n font-weight: $headings-font-weight;\n line-height: $headings-line-height;\n color: $headings-color;\n}\n\nh1 {\n @extend %heading;\n @include font-size($h1-font-size);\n}\n\nh2 {\n @extend %heading;\n @include font-size($h2-font-size);\n}\n\nh3 {\n @extend %heading;\n @include font-size($h3-font-size);\n}\n\nh4 {\n @extend %heading;\n @include font-size($h4-font-size);\n}\n\nh5 {\n @extend %heading;\n @include font-size($h5-font-size);\n}\n\nh6 {\n @extend %heading;\n @include font-size($h6-font-size);\n}\n\n\n// Reset margins on paragraphs\n//\n// Similarly, the top margin on `

`s get reset. However, we also reset the\n// bottom margin to use `rem` units instead of `em`.\n\np {\n margin-top: 0;\n margin-bottom: $paragraph-margin-bottom;\n}\n\n\n// Abbreviations\n//\n// 1. Duplicate behavior to the data-bs-* attribute for our tooltip plugin\n// 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.\n// 3. Add explicit cursor to indicate changed behavior.\n// 4. Prevent the text-decoration to be skipped.\n\nabbr[title],\nabbr[data-bs-original-title] { // 1\n text-decoration: underline dotted; // 2\n cursor: help; // 3\n text-decoration-skip-ink: none; // 4\n}\n\n\n// Address\n\naddress {\n margin-bottom: 1rem;\n font-style: normal;\n line-height: inherit;\n}\n\n\n// Lists\n\nol,\nul {\n padding-left: 2rem;\n}\n\nol,\nul,\ndl {\n margin-top: 0;\n margin-bottom: 1rem;\n}\n\nol ol,\nul ul,\nol ul,\nul ol {\n margin-bottom: 0;\n}\n\ndt {\n font-weight: $dt-font-weight;\n}\n\n// 1. Undo browser default\n\ndd {\n margin-bottom: .5rem;\n margin-left: 0; // 1\n}\n\n\n// Blockquote\n\nblockquote {\n margin: 0 0 1rem;\n}\n\n\n// Strong\n//\n// Add the correct font weight in Chrome, Edge, and Safari\n\nb,\nstrong {\n font-weight: $font-weight-bolder;\n}\n\n\n// Small\n//\n// Add the correct font size in all browsers\n\nsmall {\n @include font-size($small-font-size);\n}\n\n\n// Mark\n\nmark {\n padding: $mark-padding;\n background-color: $mark-bg;\n}\n\n\n// Sub and Sup\n//\n// Prevent `sub` and `sup` elements from affecting the line height in\n// all browsers.\n\nsub,\nsup {\n position: relative;\n @include font-size($sub-sup-font-size);\n line-height: 0;\n vertical-align: baseline;\n}\n\nsub { bottom: -.25em; }\nsup { top: -.5em; }\n\n\n// Links\n\na {\n color: $link-color;\n text-decoration: $link-decoration;\n\n &:hover {\n color: $link-hover-color;\n text-decoration: $link-hover-decoration;\n }\n}\n\n// And undo these styles for placeholder links/named anchors (without href).\n// It would be more straightforward to just use a[href] in previous block, but that\n// causes specificity issues in many other styles that are too complex to fix.\n// See https://github.com/twbs/bootstrap/issues/19402\n\na:not([href]):not([class]) {\n &,\n &:hover {\n color: inherit;\n text-decoration: none;\n }\n}\n\n\n// Code\n\npre,\ncode,\nkbd,\nsamp {\n font-family: $font-family-code;\n @include font-size(1em); // Correct the odd `em` font sizing in all browsers.\n direction: ltr #{\"/* rtl:ignore */\"};\n unicode-bidi: bidi-override;\n}\n\n// 1. Remove browser default top margin\n// 2. Reset browser default of `1em` to use `rem`s\n// 3. Don't allow content to break outside\n\npre {\n display: block;\n margin-top: 0; // 1\n margin-bottom: 1rem; // 2\n overflow: auto; // 3\n @include font-size($code-font-size);\n color: $pre-color;\n\n // Account for some code outputs that place code tags in pre tags\n code {\n @include font-size(inherit);\n color: inherit;\n word-break: normal;\n }\n}\n\ncode {\n @include font-size($code-font-size);\n color: $code-color;\n word-wrap: break-word;\n\n // Streamline the style when inside anchors to avoid broken underline and more\n a > & {\n color: inherit;\n }\n}\n\nkbd {\n padding: $kbd-padding-y $kbd-padding-x;\n @include font-size($kbd-font-size);\n color: $kbd-color;\n background-color: $kbd-bg;\n @include border-radius($border-radius-sm);\n\n kbd {\n padding: 0;\n @include font-size(1em);\n font-weight: $nested-kbd-font-weight;\n }\n}\n\n\n// Figures\n//\n// Apply a consistent margin strategy (matches our type styles).\n\nfigure {\n margin: 0 0 1rem;\n}\n\n\n// Images and content\n\nimg,\nsvg {\n vertical-align: middle;\n}\n\n\n// Tables\n//\n// Prevent double borders\n\ntable {\n caption-side: bottom;\n border-collapse: collapse;\n}\n\ncaption {\n padding-top: $table-cell-padding-y;\n padding-bottom: $table-cell-padding-y;\n color: $table-caption-color;\n text-align: left;\n}\n\n// 1. Removes font-weight bold by inheriting\n// 2. Matches default `` alignment by inheriting `text-align`.\n// 3. Fix alignment for Safari\n\nth {\n font-weight: $table-th-font-weight; // 1\n text-align: inherit; // 2\n text-align: -webkit-match-parent; // 3\n}\n\nthead,\ntbody,\ntfoot,\ntr,\ntd,\nth {\n border-color: inherit;\n border-style: solid;\n border-width: 0;\n}\n\n\n// Forms\n//\n// 1. Allow labels to use `margin` for spacing.\n\nlabel {\n display: inline-block; // 1\n}\n\n// Remove the default `border-radius` that macOS Chrome adds.\n// See https://github.com/twbs/bootstrap/issues/24093\n\nbutton {\n // stylelint-disable-next-line property-disallowed-list\n border-radius: 0;\n}\n\n// Explicitly remove focus outline in Chromium when it shouldn't be\n// visible (e.g. as result of mouse click or touch tap). It already\n// should be doing this automatically, but seems to currently be\n// confused and applies its very visible two-tone outline anyway.\n\nbutton:focus:not(:focus-visible) {\n outline: 0;\n}\n\n// 1. Remove the margin in Firefox and Safari\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n margin: 0; // 1\n font-family: inherit;\n @include font-size(inherit);\n line-height: inherit;\n}\n\n// Remove the inheritance of text transform in Firefox\nbutton,\nselect {\n text-transform: none;\n}\n// Set the cursor for non-`