/* Bloc « Colonnes » : empilement en grille sous 1025px, rendu natif au-dessus. */

:where(.wp-block-columns.has-background) {
    padding: 0;
}

.wp-block-columns:not(.is-not-stacked-on-mobile) {
    display: grid;
    grid-template-columns: 1fr;
}

/* 2 colonnes. */
@media (min-width: 576px) {
    .wp-block-columns:not(.is-not-stacked-on-mobile):has(> .wp-block-column:nth-child(2)) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* 3 colonnes. Le `:has()` évite de créer une piste vide sur un bloc qui
   ne compte que 2 colonnes : il garderait alors 2 colonnes. */
@media (min-width: 768px) {
    .wp-block-columns:not(.is-not-stacked-on-mobile):has(> .wp-block-column:nth-child(3)) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Retour au rendu natif : flex sur une seule ligne, largeurs de colonnes
   définies dans l'éditeur respectées. */
@media (min-width: 1025px) {
    .wp-block-columns:not(.is-not-stacked-on-mobile) {
        display: flex;
    }
}