assets/themes/j1/core/css/themes/unolight/bootstrap.css in j1-template-2022.5.2 vs assets/themes/j1/core/css/themes/unolight/bootstrap.css in j1-template-2022.5.3
- old
+ new
@@ -84,11 +84,11 @@
# BS4 version requires an additional argument ?!
# Issue seen 2019-03-10 after reset!
# -----------------------------------------------------------------------------
*/
/*!
- * Bootstrap v5.2.0 (https://getbootstrap.com/)
+ * Bootstrap v5.2.1 (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 {
@@ -2178,10 +2178,11 @@
left: 0;
width: 100%;
height: 100%;
padding: 1rem 0;
overflow: hidden;
+ text-align: start;
text-overflow: ellipsis;
white-space: nowrap;
pointer-events: none;
border: 1px solid transparent;
transform-origin: 0 0;
@@ -2233,16 +2234,16 @@
width: 1%;
min-width: 0; }
.input-group > .form-control:focus,
.input-group > .form-select:focus,
.input-group > .form-floating:focus-within {
- z-index: 3; }
+ z-index: 5; }
.input-group .btn {
position: relative;
z-index: 2; }
.input-group .btn:focus {
- z-index: 3; }
+ z-index: 5; }
.input-group-text {
display: flex;
align-items: center;
padding: 0.4375rem 0;
@@ -2288,14 +2289,17 @@
.input-group.has-validation > .form-floating:nth-last-child(n + 3) > .form-control,
.input-group.has-validation > .form-floating:nth-last-child(n + 3) > .form-select {
border-top-right-radius: 0;
border-bottom-right-radius: 0; }
-.input-group > :not(:first-child):not(.dropdown-menu):not(.form-floating):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback),
+.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
+ margin-left: -1px;
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0; }
+
.input-group > .form-floating:not(:first-child) > .form-control,
.input-group > .form-floating:not(:first-child) > .form-select {
- margin-left: -1px;
border-top-left-radius: 0;
border-bottom-left-radius: 0; }
.valid-feedback {
display: none;
@@ -2362,18 +2366,16 @@
color: #4caf50; }
.form-check-inline .form-check-input ~ .valid-feedback {
margin-left: .5em; }
-.was-validated .input-group .form-control:valid, .input-group .form-control.is-valid, .was-validated
-.input-group .form-select:valid,
-.input-group .form-select.is-valid {
- z-index: 1; }
- .was-validated .input-group .form-control:valid:focus, .input-group .form-control.is-valid:focus, .was-validated
- .input-group .form-select:valid:focus,
- .input-group .form-select.is-valid:focus {
- z-index: 3; }
+.was-validated .input-group > .form-control:not(:focus):valid, .input-group > .form-control:not(:focus).is-valid, .was-validated
+.input-group > .form-select:not(:focus):valid,
+.input-group > .form-select:not(:focus).is-valid, .was-validated
+.input-group > .form-floating:not(:focus-within):valid,
+.input-group > .form-floating:not(:focus-within).is-valid {
+ z-index: 3; }
.invalid-feedback {
display: none;
width: 100%;
margin-top: 0.25rem;
@@ -2438,18 +2440,16 @@
color: #f44336; }
.form-check-inline .form-check-input ~ .invalid-feedback {
margin-left: .5em; }
-.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid, .was-validated
-.input-group .form-select:invalid,
-.input-group .form-select.is-invalid {
- z-index: 2; }
- .was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus, .was-validated
- .input-group .form-select:invalid:focus,
- .input-group .form-select.is-invalid:focus {
- z-index: 3; }
+.was-validated .input-group > .form-control:not(:focus):invalid, .input-group > .form-control:not(:focus).is-invalid, .was-validated
+.input-group > .form-select:not(:focus):invalid,
+.input-group > .form-select:not(:focus).is-invalid, .was-validated
+.input-group > .form-floating:not(:focus-within):invalid,
+.input-group > .form-floating:not(:focus-within).is-invalid {
+ z-index: 4; }
.btn {
--bs-btn-padding-x: 1rem;
--bs-btn-padding-y: 0.46875rem;
--bs-btn-font-family: ;
@@ -2459,10 +2459,11 @@
--bs-btn-color: #424242;
--bs-btn-bg: transparent;
--bs-btn-border-width: 1px;
--bs-btn-border-color: transparent;
--bs-btn-border-radius: 0.1rem;
+ --bs-btn-hover-border-color: transparent;
--bs-btn-box-shadow: none;
--bs-btn-disabled-opacity: 0.65;
--bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
display: inline-block;
padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
@@ -2482,28 +2483,32 @@
box-shadow: var(--bs-btn-box-shadow);
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; }
@media (prefers-reduced-motion: reduce) {
.btn {
transition: none; } }
- .btn:hover {
+ :not(.btn-check) + .btn:hover, .btn:first-child:hover {
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 {
+ .btn:focus-visible {
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: var(--bs-btn-box-shadow), var(--bs-btn-focus-box-shadow); }
+ .btn-check:focus-visible + .btn {
+ border-color: var(--bs-btn-hover-border-color);
+ outline: 0;
+ box-shadow: var(--bs-btn-box-shadow), var(--bs-btn-focus-box-shadow); }
.btn-check:checked + .btn,
- .btn-check:active + .btn, .btn:active, .btn.active, .btn.show {
+ :not(.btn-check) + .btn:active, .btn:first-child: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);
box-shadow: var(--bs-btn-active-shadow); }
- .btn-check:checked + .btn:focus,
- .btn-check:active + .btn:focus, .btn:active:focus, .btn.active:focus, .btn.show:focus {
+ .btn-check:checked + .btn:focus-visible,
+ :not(.btn-check) + .btn:active:focus-visible, .btn:first-child:active:focus-visible, .btn.active:focus-visible, .btn.show:focus-visible {
box-shadow: var(--bs-btn-active-shadow), var(--bs-btn-focus-box-shadow); }
.btn:disabled, .btn.disabled,
fieldset:disabled .btn {
color: var(--bs-btn-disabled-color);
pointer-events: none;
@@ -2780,11 +2785,11 @@
--bs-btn-disabled-color: rgba(0, 0, 0, 0.26);
--bs-btn-disabled-border-color: transparent;
--bs-btn-box-shadow: none;
--bs-btn-focus-shadow-rgb: 28, 128, 207;
text-decoration: underline; }
- .btn-link:focus {
+ .btn-link:focus-visible {
color: var(--bs-btn-color); }
.btn-link:hover {
color: var(--bs-btn-hover-color); }
.btn-lg, .btn-group-lg > .btn {
@@ -2846,10 +2851,11 @@
border-left: 0.3em solid transparent; }
.dropdown-toggle:empty::after {
margin-left: 0; }
.dropdown-menu {
+ --bs-dropdown-zindex: 1000;
--bs-dropdown-min-width: 10rem;
--bs-dropdown-padding-x: 0;
--bs-dropdown-padding-y: 0.5rem;
--bs-dropdown-spacer: 0.125rem;
--bs-dropdown-font-size: 1rem;
@@ -2872,11 +2878,11 @@
--bs-dropdown-item-padding-y: 0.25rem;
--bs-dropdown-header-color: #757575;
--bs-dropdown-header-padding-x: 1rem;
--bs-dropdown-header-padding-y: 0.5rem;
position: absolute;
- z-index: 1000;
+ z-index: var(--bs-dropdown-zindex);
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);
@@ -3129,11 +3135,11 @@
.btn-toolbar .input-group {
width: auto; }
.btn-group {
border-radius: 0.1rem; }
- .btn-group > .btn:not(:first-child),
+ .btn-group > :not(.btn-check:first-child) + .btn,
.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 {
@@ -3226,11 +3232,11 @@
--bs-nav-tabs-link-active-color: #616161;
--bs-nav-tabs-link-active-bg: #fff;
--bs-nav-tabs-link-active-border-color: #e0e0e0 #e0e0e0 #fff;
border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color); }
.nav-tabs .nav-link {
- margin-bottom: calc(var(--bs-nav-tabs-border-width) * -1);
+ margin-bottom: calc(-1 * var(--bs-nav-tabs-border-width));
background: none;
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 {
@@ -3244,11 +3250,11 @@
.nav-tabs .nav-item.show .nav-link {
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: calc(var(--bs-nav-tabs-border-width) * -1);
+ margin-top: calc(-1 * var(--bs-nav-tabs-border-width));
border-top-left-radius: 0;
border-top-right-radius: 0; }
.nav-pills {
--bs-nav-pills-border-radius: 0.1rem;
@@ -3785,11 +3791,11 @@
.card-group > .card:not(:first-child) .card-img-bottom,
.card-group > .card:not(:first-child) .card-footer {
border-bottom-left-radius: 0; } }
.accordion {
- --bs-accordion-color: #000;
+ --bs-accordion-color: var(--bs-body-color);
--bs-accordion-bg: #fff;
--bs-accordion-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, border-radius 0.15s ease;
--bs-accordion-border-color: var(--bs-border-color);
--bs-accordion-border-width: 1px;
--bs-accordion-border-radius: 0.1rem;
@@ -3828,11 +3834,11 @@
.accordion-button {
transition: none; } }
.accordion-button:not(.collapsed) {
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); }
+ box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color); }
.accordion-button:not(.collapsed)::after {
background-image: var(--bs-accordion-btn-active-icon);
transform: var(--bs-accordion-btn-icon-transform); }
.accordion-button::after {
flex-shrink: 0;
@@ -3892,11 +3898,11 @@
border-radius: 0; }
.accordion-flush .accordion-item:first-child {
border-top: 0; }
.accordion-flush .accordion-item:last-child {
border-bottom: 0; }
- .accordion-flush .accordion-item .accordion-button {
+ .accordion-flush .accordion-item .accordion-button, .accordion-flush .accordion-item .accordion-button.collapsed {
border-radius: 0; }
.breadcrumb {
--bs-breadcrumb-padding-x: 0;
--bs-breadcrumb-padding-y: 0;
@@ -3989,13 +3995,18 @@
border-color: var(--bs-pagination-disabled-border-color); }
.page-item:not(:first-child) .page-link {
margin-left: 0; }
-.page-item .page-link {
- border-radius: var(--bs-pagination-border-radius); }
+.page-item:first-child .page-link {
+ 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: var(--bs-pagination-border-radius);
+ border-bottom-right-radius: var(--bs-pagination-border-radius); }
+
.pagination-lg {
--bs-pagination-padding-x: 0;
--bs-pagination-padding-y: 0.75rem;
--bs-pagination-font-size: 1.25rem;
--bs-pagination-border-radius: 0.1rem; }
@@ -4231,118 +4242,118 @@
background-color: var(--bs-list-group-active-bg);
border-color: var(--bs-list-group-active-border-color); }
.list-group-item + .list-group-item {
border-top-width: 0; }
.list-group-item + .list-group-item.active {
- margin-top: calc(var(--bs-list-group-border-width) * -1);
+ margin-top: calc(-1 * var(--bs-list-group-border-width));
border-top-width: var(--bs-list-group-border-width); }
.list-group-horizontal {
flex-direction: row; }
- .list-group-horizontal > .list-group-item:first-child {
+ .list-group-horizontal > .list-group-item:first-child:not(:last-child) {
border-bottom-left-radius: var(--bs-list-group-border-radius);
border-top-right-radius: 0; }
- .list-group-horizontal > .list-group-item:last-child {
+ .list-group-horizontal > .list-group-item:last-child:not(:first-child) {
border-top-right-radius: var(--bs-list-group-border-radius);
border-bottom-left-radius: 0; }
.list-group-horizontal > .list-group-item.active {
margin-top: 0; }
.list-group-horizontal > .list-group-item + .list-group-item {
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: calc(var(--bs-list-group-border-width) * -1);
+ margin-left: calc(-1 * var(--bs-list-group-border-width));
border-left-width: var(--bs-list-group-border-width); }
@media (min-width: 576px) {
.list-group-horizontal-sm {
flex-direction: row; }
- .list-group-horizontal-sm > .list-group-item:first-child {
+ .list-group-horizontal-sm > .list-group-item:first-child:not(:last-child) {
border-bottom-left-radius: var(--bs-list-group-border-radius);
border-top-right-radius: 0; }
- .list-group-horizontal-sm > .list-group-item:last-child {
+ .list-group-horizontal-sm > .list-group-item:last-child:not(:first-child) {
border-top-right-radius: var(--bs-list-group-border-radius);
border-bottom-left-radius: 0; }
.list-group-horizontal-sm > .list-group-item.active {
margin-top: 0; }
.list-group-horizontal-sm > .list-group-item + .list-group-item {
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: calc(var(--bs-list-group-border-width) * -1);
+ margin-left: calc(-1 * var(--bs-list-group-border-width));
border-left-width: var(--bs-list-group-border-width); } }
@media (min-width: 768px) {
.list-group-horizontal-md {
flex-direction: row; }
- .list-group-horizontal-md > .list-group-item:first-child {
+ .list-group-horizontal-md > .list-group-item:first-child:not(:last-child) {
border-bottom-left-radius: var(--bs-list-group-border-radius);
border-top-right-radius: 0; }
- .list-group-horizontal-md > .list-group-item:last-child {
+ .list-group-horizontal-md > .list-group-item:last-child:not(:first-child) {
border-top-right-radius: var(--bs-list-group-border-radius);
border-bottom-left-radius: 0; }
.list-group-horizontal-md > .list-group-item.active {
margin-top: 0; }
.list-group-horizontal-md > .list-group-item + .list-group-item {
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: calc(var(--bs-list-group-border-width) * -1);
+ margin-left: calc(-1 * var(--bs-list-group-border-width));
border-left-width: var(--bs-list-group-border-width); } }
@media (min-width: 992px) {
.list-group-horizontal-lg {
flex-direction: row; }
- .list-group-horizontal-lg > .list-group-item:first-child {
+ .list-group-horizontal-lg > .list-group-item:first-child:not(:last-child) {
border-bottom-left-radius: var(--bs-list-group-border-radius);
border-top-right-radius: 0; }
- .list-group-horizontal-lg > .list-group-item:last-child {
+ .list-group-horizontal-lg > .list-group-item:last-child:not(:first-child) {
border-top-right-radius: var(--bs-list-group-border-radius);
border-bottom-left-radius: 0; }
.list-group-horizontal-lg > .list-group-item.active {
margin-top: 0; }
.list-group-horizontal-lg > .list-group-item + .list-group-item {
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: calc(var(--bs-list-group-border-width) * -1);
+ margin-left: calc(-1 * var(--bs-list-group-border-width));
border-left-width: var(--bs-list-group-border-width); } }
@media (min-width: 1200px) {
.list-group-horizontal-xl {
flex-direction: row; }
- .list-group-horizontal-xl > .list-group-item:first-child {
+ .list-group-horizontal-xl > .list-group-item:first-child:not(:last-child) {
border-bottom-left-radius: var(--bs-list-group-border-radius);
border-top-right-radius: 0; }
- .list-group-horizontal-xl > .list-group-item:last-child {
+ .list-group-horizontal-xl > .list-group-item:last-child:not(:first-child) {
border-top-right-radius: var(--bs-list-group-border-radius);
border-bottom-left-radius: 0; }
.list-group-horizontal-xl > .list-group-item.active {
margin-top: 0; }
.list-group-horizontal-xl > .list-group-item + .list-group-item {
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: calc(var(--bs-list-group-border-width) * -1);
+ margin-left: calc(-1 * var(--bs-list-group-border-width));
border-left-width: var(--bs-list-group-border-width); } }
@media (min-width: 1400px) {
.list-group-horizontal-xxl {
flex-direction: row; }
- .list-group-horizontal-xxl > .list-group-item:first-child {
+ .list-group-horizontal-xxl > .list-group-item:first-child:not(:last-child) {
border-bottom-left-radius: var(--bs-list-group-border-radius);
border-top-right-radius: 0; }
- .list-group-horizontal-xxl > .list-group-item:last-child {
+ .list-group-horizontal-xxl > .list-group-item:last-child:not(:first-child) {
border-top-right-radius: var(--bs-list-group-border-radius);
border-bottom-left-radius: 0; }
.list-group-horizontal-xxl > .list-group-item.active {
margin-top: 0; }
.list-group-horizontal-xxl > .list-group-item + .list-group-item {
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: calc(var(--bs-list-group-border-width) * -1);
+ margin-left: calc(-1 * var(--bs-list-group-border-width));
border-left-width: var(--bs-list-group-border-width); } }
.list-group-flush {
border-radius: 0; }
.list-group-flush > .list-group-item {
@@ -4463,10 +4474,11 @@
.btn-close-white {
filter: invert(1) grayscale(100%) brightness(200%); }
.toast {
+ --bs-toast-zindex: 1090;
--bs-toast-padding-x: 0.75rem;
--bs-toast-padding-y: 0.5rem;
--bs-toast-spacing: 1.5rem;
--bs-toast-max-width: 350px;
--bs-toast-font-size: 0.875rem;
@@ -4494,11 +4506,11 @@
.toast:not(.show) {
display: none; }
.toast-container {
position: absolute;
- z-index: 1090;
+ z-index: var(--bs-toast-zindex);
width: max-content;
max-width: 100%;
pointer-events: none; }
.toast-container > :not(:last-child) {
margin-bottom: var(--bs-toast-spacing); }
@@ -4512,11 +4524,11 @@
background-clip: padding-box;
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: calc(var(--bs-toast-padding-x) * -.5);
+ margin-right: calc(-.5 * var(--bs-toast-padding-x));
margin-left: var(--bs-toast-padding-x); }
.toast-body {
padding: var(--bs-toast-padding-x);
word-wrap: break-word; }
@@ -4622,11 +4634,11 @@
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: 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; }
+ margin: calc(-.5 * var(--bs-modal-header-padding-y)) calc(-.5 * var(--bs-modal-header-padding-x)) calc(-.5 * var(--bs-modal-header-padding-y)) auto; }
.modal-title {
margin-bottom: 0;
line-height: var(--bs-modal-title-line-height); }
@@ -4865,11 +4877,11 @@
--bs-popover-inner-border-radius: calc(0.1rem - 1px);
--bs-popover-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
--bs-popover-header-padding-x: 1rem;
--bs-popover-header-padding-y: 0.5rem;
--bs-popover-header-font-size: 1rem;
- --bs-popover-header-color: var(--bs-heading-color);
+ --bs-popover-header-color: ;
--bs-popover-header-bg: #f0f0f0;
--bs-popover-body-padding-x: 1rem;
--bs-popover-body-padding-y: 1rem;
--bs-popover-body-color: #424242;
--bs-popover-arrow-width: 1rem;
@@ -4910,11 +4922,11 @@
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((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width)); }
+ bottom: calc(-1 * (var(--bs-popover-arrow-height)) - 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-top-color: var(--bs-popover-arrow-border); }
@@ -4922,11 +4934,11 @@
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((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width));
+ left: calc(-1 * (var(--bs-popover-arrow-height)) - 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 {
@@ -4936,11 +4948,11 @@
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((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width)); }
+ top: calc(-1 * (var(--bs-popover-arrow-height)) - 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-bottom-color: var(--bs-popover-arrow-border); }
@@ -4952,17 +4964,17 @@
position: absolute;
top: 0;
left: 50%;
display: block;
width: var(--bs-popover-arrow-width);
- margin-left: calc(var(--bs-popover-arrow-width) * -.5);
+ margin-left: calc(-.5 * var(--bs-popover-arrow-width));
content: "";
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((var(--bs-popover-arrow-height) * -1) - var(--bs-popover-border-width));
+ right: calc(-1 * (var(--bs-popover-arrow-height)) - 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 {
@@ -5218,10 +5230,11 @@
.spinner-border,
.spinner-grow {
--bs-spinner-animation-speed: 1.5s; } }
.offcanvas-sm, .offcanvas-md, .offcanvas-lg, .offcanvas-xl, .offcanvas-xxl, .offcanvas {
+ --bs-offcanvas-zindex: 1045;
--bs-offcanvas-width: 400px;
--bs-offcanvas-height: 30vh;
--bs-offcanvas-padding-x: 1rem;
--bs-offcanvas-padding-y: 1rem;
--bs-offcanvas-color: ;
@@ -5232,11 +5245,11 @@
@media (max-width: 575.98px) {
.offcanvas-sm {
position: fixed;
bottom: 0;
- z-index: 1045;
+ z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: 100%;
color: var(--bs-offcanvas-color);
visibility: hidden;
@@ -5298,11 +5311,11 @@
@media (max-width: 767.98px) {
.offcanvas-md {
position: fixed;
bottom: 0;
- z-index: 1045;
+ z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: 100%;
color: var(--bs-offcanvas-color);
visibility: hidden;
@@ -5364,11 +5377,11 @@
@media (max-width: 991.98px) {
.offcanvas-lg {
position: fixed;
bottom: 0;
- z-index: 1045;
+ z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: 100%;
color: var(--bs-offcanvas-color);
visibility: hidden;
@@ -5430,11 +5443,11 @@
@media (max-width: 1199.98px) {
.offcanvas-xl {
position: fixed;
bottom: 0;
- z-index: 1045;
+ z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: 100%;
color: var(--bs-offcanvas-color);
visibility: hidden;
@@ -5496,11 +5509,11 @@
@media (max-width: 1399.98px) {
.offcanvas-xxl {
position: fixed;
bottom: 0;
- z-index: 1045;
+ z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: 100%;
color: var(--bs-offcanvas-color);
visibility: hidden;
@@ -5561,11 +5574,11 @@
background-color: transparent !important; } }
.offcanvas {
position: fixed;
bottom: 0;
- z-index: 1045;
+ z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: 100%;
color: var(--bs-offcanvas-color);
visibility: hidden;
@@ -5627,13 +5640,13 @@
align-items: center;
justify-content: space-between;
padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x); }
.offcanvas-header .btn-close {
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); }
+ margin-top: calc(-.5 * var(--bs-offcanvas-padding-y));
+ margin-right: calc(-.5 * var(--bs-offcanvas-padding-x));
+ margin-bottom: calc(-.5 * var(--bs-offcanvas-padding-y)); }
.offcanvas-title {
margin-bottom: 0;
line-height: 1.5; }
@@ -10658,26 +10671,22 @@
.is-focused .form-check-inline .form-check-input ~ .valid-feedback,
.is-focused .form-check-inline .form-check-input ~ .valid-feedback {
margin-left: .5em; }
-.was-validated .is-focused .input-group .form-control:valid, .is-focused .input-group .form-control.is-valid, .was-validated
-.is-focused .input-group .form-select:valid,
-.is-focused .input-group .form-select.is-valid, .was-validated
-.is-focused .input-group .form-control:valid,
-.is-focused .input-group .form-control.is-valid, .was-validated
-.is-focused .input-group .form-select:valid,
-.is-focused .input-group .form-select.is-valid {
- z-index: 1; }
- .was-validated .is-focused .input-group .form-control:valid:focus, .is-focused .input-group .form-control.is-valid:focus, .was-validated
- .is-focused .input-group .form-select:valid:focus,
- .is-focused .input-group .form-select.is-valid:focus, .was-validated
- .is-focused .input-group .form-control:valid:focus,
- .is-focused .input-group .form-control.is-valid:focus, .was-validated
- .is-focused .input-group .form-select:valid:focus,
- .is-focused .input-group .form-select.is-valid:focus {
- z-index: 3; }
+.was-validated .is-focused .input-group > .form-control:not(:focus):valid, .is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.is-focused .input-group > .form-select:not(:focus):valid,
+.is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.is-focused .input-group > .form-floating:not(:focus-within):valid,
+.is-focused .input-group > .form-floating:not(:focus-within).is-valid, .was-validated
+.is-focused .input-group > .form-control:not(:focus):valid,
+.is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.is-focused .input-group > .form-select:not(:focus):valid,
+.is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.is-focused .input-group > .form-floating:not(:focus-within):valid,
+.is-focused .input-group > .form-floating:not(:focus-within).is-valid {
+ z-index: 3; }
.is-focused [class^='bmd-label'],
.is-focused [class*=' bmd-label'],
.is-focused [class^='bmd-label'],
.is-focused [class*=' bmd-label'] {
@@ -10788,22 +10797,20 @@
color: #4caf50; }
.has-success .is-focused .form-check-inline .form-check-input ~ .valid-feedback, .has-success.is-focused .form-check-inline .form-check-input ~ .valid-feedback {
margin-left: .5em; }
-.was-validated .has-success .is-focused .input-group .form-control:valid, .has-success .is-focused .input-group .form-control.is-valid, .was-validated
-.has-success .is-focused .input-group .form-select:valid,
-.has-success .is-focused .input-group .form-select.is-valid, .was-validated .has-success.is-focused .input-group .form-control:valid, .has-success.is-focused .input-group .form-control.is-valid, .was-validated
-.has-success.is-focused .input-group .form-select:valid,
-.has-success.is-focused .input-group .form-select.is-valid {
- z-index: 1; }
- .was-validated .has-success .is-focused .input-group .form-control:valid:focus, .has-success .is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-success .is-focused .input-group .form-select:valid:focus,
- .has-success .is-focused .input-group .form-select.is-valid:focus, .was-validated .has-success.is-focused .input-group .form-control:valid:focus, .has-success.is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-success.is-focused .input-group .form-select:valid:focus,
- .has-success.is-focused .input-group .form-select.is-valid:focus {
- z-index: 3; }
+.was-validated .has-success .is-focused .input-group > .form-control:not(:focus):valid, .has-success .is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-success .is-focused .input-group > .form-select:not(:focus):valid,
+.has-success .is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-success .is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-success .is-focused .input-group > .form-floating:not(:focus-within).is-valid, .was-validated .has-success.is-focused .input-group > .form-control:not(:focus):valid, .has-success.is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-success.is-focused .input-group > .form-select:not(:focus):valid,
+.has-success.is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-success.is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-success.is-focused .input-group > .form-floating:not(:focus-within).is-valid {
+ z-index: 3; }
.has-success .is-focused [class^='bmd-label'],
.has-success .is-focused [class*=' bmd-label'], .has-success.is-focused [class^='bmd-label'],
.has-success.is-focused [class*=' bmd-label'] {
color: #4caf50; }
@@ -10910,22 +10917,20 @@
color: #00bcd4; }
.has-info .is-focused .form-check-inline .form-check-input ~ .valid-feedback, .has-info.is-focused .form-check-inline .form-check-input ~ .valid-feedback {
margin-left: .5em; }
-.was-validated .has-info .is-focused .input-group .form-control:valid, .has-info .is-focused .input-group .form-control.is-valid, .was-validated
-.has-info .is-focused .input-group .form-select:valid,
-.has-info .is-focused .input-group .form-select.is-valid, .was-validated .has-info.is-focused .input-group .form-control:valid, .has-info.is-focused .input-group .form-control.is-valid, .was-validated
-.has-info.is-focused .input-group .form-select:valid,
-.has-info.is-focused .input-group .form-select.is-valid {
- z-index: 1; }
- .was-validated .has-info .is-focused .input-group .form-control:valid:focus, .has-info .is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-info .is-focused .input-group .form-select:valid:focus,
- .has-info .is-focused .input-group .form-select.is-valid:focus, .was-validated .has-info.is-focused .input-group .form-control:valid:focus, .has-info.is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-info.is-focused .input-group .form-select:valid:focus,
- .has-info.is-focused .input-group .form-select.is-valid:focus {
- z-index: 3; }
+.was-validated .has-info .is-focused .input-group > .form-control:not(:focus):valid, .has-info .is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-info .is-focused .input-group > .form-select:not(:focus):valid,
+.has-info .is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-info .is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-info .is-focused .input-group > .form-floating:not(:focus-within).is-valid, .was-validated .has-info.is-focused .input-group > .form-control:not(:focus):valid, .has-info.is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-info.is-focused .input-group > .form-select:not(:focus):valid,
+.has-info.is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-info.is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-info.is-focused .input-group > .form-floating:not(:focus-within).is-valid {
+ z-index: 3; }
.has-info .is-focused [class^='bmd-label'],
.has-info .is-focused [class*=' bmd-label'], .has-info.is-focused [class^='bmd-label'],
.has-info.is-focused [class*=' bmd-label'] {
color: #00bcd4; }
@@ -11032,22 +11037,20 @@
color: #ffeb3b; }
.has-warning .is-focused .form-check-inline .form-check-input ~ .valid-feedback, .has-warning.is-focused .form-check-inline .form-check-input ~ .valid-feedback {
margin-left: .5em; }
-.was-validated .has-warning .is-focused .input-group .form-control:valid, .has-warning .is-focused .input-group .form-control.is-valid, .was-validated
-.has-warning .is-focused .input-group .form-select:valid,
-.has-warning .is-focused .input-group .form-select.is-valid, .was-validated .has-warning.is-focused .input-group .form-control:valid, .has-warning.is-focused .input-group .form-control.is-valid, .was-validated
-.has-warning.is-focused .input-group .form-select:valid,
-.has-warning.is-focused .input-group .form-select.is-valid {
- z-index: 1; }
- .was-validated .has-warning .is-focused .input-group .form-control:valid:focus, .has-warning .is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-warning .is-focused .input-group .form-select:valid:focus,
- .has-warning .is-focused .input-group .form-select.is-valid:focus, .was-validated .has-warning.is-focused .input-group .form-control:valid:focus, .has-warning.is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-warning.is-focused .input-group .form-select:valid:focus,
- .has-warning.is-focused .input-group .form-select.is-valid:focus {
- z-index: 3; }
+.was-validated .has-warning .is-focused .input-group > .form-control:not(:focus):valid, .has-warning .is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-warning .is-focused .input-group > .form-select:not(:focus):valid,
+.has-warning .is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-warning .is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-warning .is-focused .input-group > .form-floating:not(:focus-within).is-valid, .was-validated .has-warning.is-focused .input-group > .form-control:not(:focus):valid, .has-warning.is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-warning.is-focused .input-group > .form-select:not(:focus):valid,
+.has-warning.is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-warning.is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-warning.is-focused .input-group > .form-floating:not(:focus-within).is-valid {
+ z-index: 3; }
.has-warning .is-focused [class^='bmd-label'],
.has-warning .is-focused [class*=' bmd-label'], .has-warning.is-focused [class^='bmd-label'],
.has-warning.is-focused [class*=' bmd-label'] {
color: #ffeb3b; }
@@ -11154,21 +11157,19 @@
color: #f44336; }
.has-danger .is-focused .form-check-inline .form-check-input ~ .valid-feedback, .has-danger.is-focused .form-check-inline .form-check-input ~ .valid-feedback {
margin-left: .5em; }
-.was-validated .has-danger .is-focused .input-group .form-control:valid, .has-danger .is-focused .input-group .form-control.is-valid, .was-validated
-.has-danger .is-focused .input-group .form-select:valid,
-.has-danger .is-focused .input-group .form-select.is-valid, .was-validated .has-danger.is-focused .input-group .form-control:valid, .has-danger.is-focused .input-group .form-control.is-valid, .was-validated
-.has-danger.is-focused .input-group .form-select:valid,
-.has-danger.is-focused .input-group .form-select.is-valid {
- z-index: 1; }
- .was-validated .has-danger .is-focused .input-group .form-control:valid:focus, .has-danger .is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-danger .is-focused .input-group .form-select:valid:focus,
- .has-danger .is-focused .input-group .form-select.is-valid:focus, .was-validated .has-danger.is-focused .input-group .form-control:valid:focus, .has-danger.is-focused .input-group .form-control.is-valid:focus, .was-validated
- .has-danger.is-focused .input-group .form-select:valid:focus,
- .has-danger.is-focused .input-group .form-select.is-valid:focus {
- z-index: 3; }
+.was-validated .has-danger .is-focused .input-group > .form-control:not(:focus):valid, .has-danger .is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-danger .is-focused .input-group > .form-select:not(:focus):valid,
+.has-danger .is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-danger .is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-danger .is-focused .input-group > .form-floating:not(:focus-within).is-valid, .was-validated .has-danger.is-focused .input-group > .form-control:not(:focus):valid, .has-danger.is-focused .input-group > .form-control:not(:focus).is-valid, .was-validated
+.has-danger.is-focused .input-group > .form-select:not(:focus):valid,
+.has-danger.is-focused .input-group > .form-select:not(:focus).is-valid, .was-validated
+.has-danger.is-focused .input-group > .form-floating:not(:focus-within):valid,
+.has-danger.is-focused .input-group > .form-floating:not(:focus-within).is-valid {
+ z-index: 3; }
.has-danger .is-focused [class^='bmd-label'],
.has-danger .is-focused [class*=' bmd-label'], .has-danger.is-focused [class^='bmd-label'],
.has-danger.is-focused [class*=' bmd-label'] {
color: #f44336; }