/*
 * Compatibilité Bootstrap 4 -> 5.
 * Rétablit le rendu de classes Bootstrap 4 supprimées en Bootstrap 5 mais encore
 * présentes dans les templates (ou ciblées par style.css / admin.css / pwa.css).
 * À supprimer au fur et à mesure que ces classes sont retirées du HTML.
 */

/*
 * Bootstrap 4 : les colonnes étaient position: relative, donc l'ancre des éléments en position: absolute
 * (ex. les pastilles .custom-tooltip de custom-tooltip.js, calées en right: 0 / top: position().top).
 * Bootstrap 5 a retiré ce position: relative.
 */
.col,
[class^="col-"],
[class*=" col-"] {
    position: relative;
}

/*
 * Bootstrap 5 : `.row > *` impose width: 100% (+ padding de gouttière) à tous les enfants directs d'une .row.
 * custom-tooltip.js y injecte une pastille en position: absolute (.custom-tooltip) suivie du popup (.tooltip) :
 * en Bootstrap 4 ils avaient la largeur de leur contenu.
 */
.row > .custom-tooltip,
.row > .tooltip {
    width: auto;
    max-width: none;
}

.row > .tooltip {
    padding-right: 0;
    padding-left: 0;
}

/* Bootstrap 4 : margin-bottom sur tous les labels (Bootstrap 5 : seulement .form-label) */
label {
    margin-bottom: .5rem;
}

/* .form-group n'existe plus en Bootstrap 5 (style.css cible encore .form-group) */
.form-group {
    margin-bottom: 1rem;
}

/* .btn-block n'existe plus en Bootstrap 5 (les css de formulaires produit y accrochent des règles) */
.btn-block {
    display: block;
    width: 100%;
}

.btn-block + .btn-block {
    margin-top: .5rem;
}

/* .thead-dark : Bootstrap 5 ne l'a plus, admin.css ne fixe que le fond */
.table .thead-dark th {
    color: #fff;
    border-color: #454d55;
}

/* .card-deck : supprimé en Bootstrap 5 (écran des modes de livraison, admin) */
.card-deck {
    display: flex;
    flex-direction: column;
}

@media (min-width: 576px) {
    .card-deck {
        flex-flow: row wrap;
        margin-right: -15px;
        margin-left: -15px;
    }

    .card-deck .card {
        flex: 1 0 0%;
        margin-right: 15px;
        margin-bottom: 0;
        margin-left: 15px;
    }
}