/**
BOOTBOX
*/
.custom-bb .modal-title, .custom-bb .modal-body {
    font-size: 0.875rem !important;
}

.custom-bb .modal-footer button {
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-font-size: 0.75rem;
    --bs-btn-border-radius: 0.25rem;
}

.custom-bb .bootbox-close-button {
    color: #ffffff;
    opacity: 1;
    filter: brightness(0) invert(1);
}

.custom-bb .modal-title {
    color: #ffffff;
}

.bb-error-modal .modal-header { background: #dc3545; }
.bb-success-modal .modal-header { background: #2d9206; }
.bb-warn-modal .modal-header { background: #FFC107; }
.bb-warn-modal .modal-title { color: #34383d; }
.bb-warn-modal .bootbox-close-button {
    filter: none;
    opacity: 0.5;
}

/**
STEPPER
https://codepen.io/t_afif/pen/xxJNGdr
<ol class="stepper">
   <li>Step A</li>
   <li>Step B</li>
   <li class="active">Step C</li>
   <li>Step D</li>
   <li>Step E</li>
</ol>
 */
ol.stepper {
    --default-b: lightgrey;
    --default-c: black;
    --active-b: #0d6efd;
    --active-c: white;
    --circle: 2.5em; /* size of circle */
    --b: 1px; /* line thickness */

    display: flex;
    list-style: none;
    justify-content: space-between;
    background:
            linear-gradient(var(--default-b) 0 0) no-repeat
            50% calc((var(--circle) - var(--b))/2)/100% var(--b);
    counter-reset: step;
    margin: 20px;
    padding: 0;
    font-size: 1em;
    font-weight: bold;
    counter-reset: step;
    overflow: hidden;
    background-position-y: 24px;
}
ol.stepper li {
    display: grid;
    place-items: center;
    gap: 5px;
    font-family: sans-serif;
    position: relative;
}
ol.stepper li::before {
    content: counter(step) " ";
    counter-increment: step;
    display: grid;
    place-content: center;
    aspect-ratio: 1;
    height: var(--circle);
    border: 5px solid #fff;
    box-sizing: border-box;
    background: var(--active-b);
    color: var(--active-c);
    border-radius: 50%;
    font-family: monospace;
    z-index: 1;
    font-size: 1.25em;
}
ol.stepper li.active ~ li::before{
    background: var(--default-b);
    color: var(--default-c);
}
ol.stepper li.active::after {
    content: "";
    position: absolute;
    height: var(--b);
    right: 100%;
    /*top: calc((var(--circle) - var(--b))/2);*/
    top:24px;
    width: 100vw;
    background: var(--active-b);
}

/**
CUSTOM FORM
 */
.form-control {
    border: none;
    -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    background: #fff;
}

/**
ACCOUNT REGISTARTION, LOGIN, PASSW
 */
.bsb-btn-xl {
    --bs-btn-padding-y:0.625rem;
    --bs-btn-padding-x:1.25rem;
    --bs-btn-font-size:calc(1.26rem + 0.12vw);
    --bs-btn-border-radius:var(--bs-border-radius-lg)
}
@media(min-width:1200px) {
    .bsb-btn-xl{--bs-btn-font-size:1.35rem
    }
}
.bsb-btn-2xl {
    --bs-btn-padding-y:0.75rem;
    --bs-btn-padding-x:1.5rem;
    --bs-btn-font-size:calc(1.27rem + 0.24vw);
    --bs-btn-border-radius:var(--bs-border-radius-lg)
}
@media(min-width:1200px) {
    .bsb-btn-2xl{--bs-btn-font-size:1.45rem}
}
.bsb-btn-3xl {
    --bs-btn-padding-y:0.875rem;
    --bs-btn-padding-x:1.75rem;
    --bs-btn-font-size:calc(1.28rem + 0.36vw);
    --bs-btn-border-radius:var(--bs-border-radius-lg)
}
@media(min-width:1200px) {
    .bsb-btn-3xl{--bs-btn-font-size:1.55rem}
}
.bsb-btn-4xl {
    --bs-btn-padding-y:1rem;
    --bs-btn-padding-x:2rem;
    --bs-btn-font-size:calc(1.29rem + 0.48vw);
    --bs-btn-border-radius:var(--bs-border-radius-lg)
}
@media(min-width:1200px) {
    .bsb-btn-4xl{--bs-btn-font-size:1.65rem}
}
.bsb-btn-5xl{
    --bs-btn-padding-y:1.125rem;
    --bs-btn-padding-x:2.25rem;
    --bs-btn-font-size:calc(1.3rem + 0.6vw);
    --bs-btn-border-radius:var(--bs-border-radius-lg)
}
@media(min-width:1200px){
    .bsb-btn-5xl{--bs-btn-font-size:1.75rem}
}
.bsb-tpl-bg-platinum{
    background:#e5e5e5!important
}
.bsb-tpl-bg-lotion{
    background:#fafafa!important
}
@media(max-width:800px) {
    /*.img-logo {*/
    /*    max-width: 80px;*/
    /*}*/
}

/**
Misc
 */
.img-logo-base {
    max-height:72px;
}