/*
 * Correctifs maison par-dessus le thème GXON.
 * Le thème n'est jamais modifié : tout ce qui suit vient après styles.css.
 */

/*
 * GXON pose `--bs-card-height: calc(100% - var(--bs-gutter-x))` sur .card, pour
 * que la carte d'une colonne remplisse la rangée et que les colonnes voisines
 * s'alignent. Le thème n'utilise qu'UNE carte par colonne.
 *
 * Dès qu'une colonne en empile plusieurs, chacune réclame la hauteur entière de
 * la colonne : les blocs deviennent démesurés et le surplus déborde par-dessus
 * le pied de page (le fameux bandeau clair en travers de la page).
 *
 * On rend donc leur hauteur naturelle aux cartes empilées, en laissant intact
 * le comportement d'origine quand la colonne n'en contient qu'une.
 */
[class*="col-"] > .card:not(:only-child) {
    height: auto;
}

/* ------------------------------------------------------------------------ */
/* La visionneuse : la maquette à gauche, les retours à droite, sur toute la  */
/* hauteur de l'écran.                                                       */
/* ------------------------------------------------------------------------ */
.visionneuse {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background: var(--bs-body-bg);
}

.visionneuse-barre {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--app-header-bg, var(--bs-body-bg));
}

.visionneuse-corps {
    display: flex;
    flex: 1;
    min-height: 0;
}

.visionneuse-scene {
    flex: 1;
    min-width: 0;
    background: #fff;
}

.visionneuse-scene iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.visionneuse-panneau {
    width: 340px;
    flex: 0 0 340px;
    border-left: 1px solid var(--bs-border-color);
    overflow-y: auto;
    background: var(--bs-body-bg);
}

.min-w-0 {
    min-width: 0;
}

@media (max-width: 991.98px) {
    .visionneuse-corps {
        flex-direction: column;
    }

    .visionneuse-scene {
        min-height: 55vh;
    }

    .visionneuse-panneau {
        width: auto;
        flex: 1 1 auto;
        border-left: 0;
        border-top: 1px solid var(--bs-border-color);
    }
}