.gallery-controls-container {
    display: none; /* Caché par défaut et sur mobile */
}

@media (min-width: 769px) {
    /* Ajout de la transition pour une animation fluide de la grille */
    .gallery {
        transition:
            grid-template-columns 0.5s ease-in-out,
            gap 0.5s ease-in-out;
    }

    .gallery-controls-container {
        /* Variables pour une personnalisation facile des icônes */
        --gallery-icon-size: 24px;
        --gallery-icon-color: grey;
        --gallery-icon-hover-color: black;
        --gallery-icon-active-color: black;
        --gallery-icon-9-cols-content: '\f00a'; /* Correction: Unicode for fa-table-cells-large */
        --gallery-icon-3-cols-content: '\f009'; /* Correction: Unicode for fa-table-cells */
        display: flex;
        justify-content: space-between;
        align-items: center;
        max-width: 1200px; /* Assurez-vous que cela correspond à la largeur de votre galerie */
        margin: -80px auto 20px; /* Marge négative pour remonter sous le h1, puis marge inférieure */
        padding: 0 20px;
        position: relative;
        z-index: 10;
    }

    .gallery-controls-container i {
        font-size: var(--gallery-icon-size);
        color: var(--gallery-icon-color);
        cursor: pointer;
        transition: color 0.3s ease-in-out;
    }

    /* Applique le contenu des icônes via les variables CSS. */
    /* Cela surcharge la classe FontAwesome (ex: fa-table-cells-large) dans le HTML. */
    .gallery-controls-container #viewNineCols::before {
        content: var(--gallery-icon-9-cols-content);
    }
    .gallery-controls-container #viewThreeCols::before {
        content: var(--gallery-icon-3-cols-content);
    }

    .gallery-controls-container i:hover {
        color: var(--gallery-icon-hover-color);
    }

    .gallery-controls-container i.active {
        color: var(--gallery-icon-active-color);
    }

    .gallery.nine-columns {
        grid-template-columns: repeat(9, 1fr);
        gap: 15px; /* Moitié de l'espacement par défaut */
    }
}
