#main {
  display: flex;
  flex-direction: column;

  /* 100dvh = mieux sur mobile que 100vh */
  min-height: calc(100dvh - var(--nav-height, 0px));
}

/* Le form doit prendre toute la hauteur dispo */
#solution-form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 100%;
}

/* Ta barre sticky/CTA (celle avec bg-gradient-dark...) */
#solution-form > .bg-gradient-dark.border-top.text-white.py-4.mt-auto.sticky-bottom {
  margin-top: auto;
  z-index: 1020; /* optionnel si besoin */
}

footer {
  flex-shrink: 0;
}

.navbar-brand-light {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.cart-nav {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 5rem;
    width: max-content;
    margin: auto;
}
.cart-nav:before {
    content: "";
    display: block;
    position: absolute;
    height: 2px;
    width: calc(100% - 6rem);
    left: 3rem;
    top: calc(1.5rem - 1px);
    background: grey;
    z-index: -1;
    opacity: 0.2;
}
.cart-nav-pill {
    position: relative;
    flex-shrink: 0;
    text-align: center;
    text-decoration: none;
}
.cart-nav-pill:hover {
    color: inherit;
}
.cart-nav-pill:before {
    content: "";
    position: absolute;
    display: block;
    height: 4rem;
    width: 4rem;
    background: white;
    border-radius: 100px;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    margin: auto;
}
.cart-nav-badge {
    position: relative;
    height: 3rem;
    width: 3rem;
    border: 2px solid grey;
    padding: 1rem;
    border-radius: 100px;
    line-height: 1rem;
    text-align: center;
    flex-shrink: 0;
    opacity: 0.2;
    margin: auto;
    margin-bottom: 0.5rem;
    font-weight: bold;
}
.cart-nav-text {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.75rem;
    opacity: 0.2;
}
.cart-nav-pill.active .cart-nav-badge {
    opacity: 1;
    border-color: var(--bs-primary);
}
.cart-nav-pill.active .cart-nav-text, .cart-nav-pill.completed .cart-nav-text {
    opacity: 1;
}
.cart-nav-pill.completed .cart-nav-badge {
    opacity: 1;
    border-color: var(--bs-primary);
    background-color: var(--bs-primary);
}
.cart-nav-pill.completed .cart-nav-badge:after {
    position: absolute;
    content: "\F26E";
    background: var(--bs-primary);
    font-size: 1.6rem;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.125em;
    -webkit-font-smoothing: antialiased;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.cart-nav-badge-mb {
    position: relative;
    height: 3rem;
    width: 3rem;
    border: 2px solid #ededee;
    padding: 0.92rem 0.7rem;
    border-radius: 100px;
    line-height: 1rem;
    text-align: center;
    flex-shrink: 0;
    font-weight: bold;
}
.cart-nav-badge-mb:after {
    content: " ";
    display: block;
    position: absolute;
    border-radius: 100px;
    transform:rotate(45deg);
    top: -2px;
    left: -2px;
    bottom: -2px;
    right: -2px;
    border: 2px solid #ededee;
}
.cart-nav-badge-mb.step-1:after {border-color:#23D63E #ededee #ededee #ededee}
.cart-nav-badge-mb.step-2:after {border-color:#23D63E #23D63E #ededee #ededee}
.cart-nav-badge-mb.step-3:after {border-color:#23D63E #23D63E #23D63E #ededee}
.cart-nav-badge-mb.step-4:after {border-color:#23D63E #23D63E #23D63E #23D63E}

.loader-tmp {
    width: 50px;
    padding: 8px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: #25b09b;
    --_m: 
        conic-gradient(#0000 10%,#000),
        linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
            mask: var(--_m);
    -webkit-mask-composite: source-out;
            mask-composite: subtract;
    animation: l3 1s infinite linear;
}
@keyframes l3 {to{transform: rotate(1turn)}}

label.card.card-input:has(input:checked),
.card.card-input:has(> label:first-of-type input:checked) {
    border-color: #23D63E !important;
}

/* Cerclage commun aux deux cas */
label.card.card-input:has(input:checked)::before,
.card.card-input:has(> label:first-of-type input:checked)::before {
    content: "";
    display: block;
    position: absolute;
    inset: 0;                 /* top/right/bottom/left: 0 */
    z-index: 0;
    border-radius: 6px;
    box-shadow: inset 0 0 0 3px #23D63E;
    pointer-events: none;
}

.card.card-input > * {
    position: relative;
    z-index: 1;
}
.pspChoiceBtn, .pspChoiceBtn:disabled, .pspChoiceBtn.disabled, fieldset:disabled .pspChoiceBtn {
    border-color: #ddd;
    border-radius: 8px;
}
.pspChoiceBtn:not(.collapsed) {
    border: 3px solid #23D63E!important;
}
.quantity-number {
    width: 36px!important;
}

g {
    color: #23D63E;
}
.price-width {
    min-width: 8em;
}
@media (min-width: 1200px) {
.quantity-number.form-control {
    min-width: 50px;
}
.quantity-number-one {
    width: 99px;
}
}
.product-height {
    max-height: 60px;
    max-width: 60px;
}