/**
 * GATARD Pro Pages 1.9.72
 * Page CMS 8 uniquement — ordre uniforme de toutes les cartes emplacement.
 * Desktop/tablette paysage : photo à gauche, contenu au centre, carte à droite.
 * Mobile/tablette compacte : photo, contenu, carte, toujours dans le même ordre.
 */

html body.cms-id-8 #gatard-locations .gatard-locations__list {
    min-width: 0 !important;
    max-width: 100% !important;
}

html body.cms-id-8 #gatard-locations .gatard-location-card,
html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

/* Desktop et tablette paysage : même composition que la première carte. */
@media (min-width: 901px) {
    html body.cms-id-8 #gatard-locations .gatard-location-card,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) {
        display: grid !important;
        grid-template-columns: minmax(300px, 420px) minmax(0, 1fr) minmax(210px, 260px) !important;
        grid-template-areas: "photo content map" !important;
        align-items: stretch !important;
        gap: 0 !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__photo,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__photo {
        grid-area: photo !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__content,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__content {
        grid-area: content !important;
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__map,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__map {
        grid-area: map !important;
        grid-column: 3 !important;
        grid-row: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 24px 24px 24px 0 !important;
    }
}

/* Tablettes : même ordre, avec des colonnes proportionnées à l'espace utile. */
@media (min-width: 901px) and (max-width: 1199px) {
    html body.cms-id-8 #gatard-locations .gatard-location-card,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) {
        grid-template-columns: minmax(230px, 30%) minmax(0, 1fr) minmax(150px, 190px) !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__content,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__content {
        padding: 28px !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__map,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__map {
        margin: 18px 18px 18px 0 !important;
    }
}

/* Mobile et tablette compacte : ordre naturel identique pour toutes les cartes. */
@media (max-width: 900px) {
    html body.cms-id-8 #gatard-locations .gatard-location-card,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas:
            "photo"
            "content"
            "map" !important;
        gap: 0 !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__photo,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__photo {
        grid-area: photo !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
        order: 1 !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__content,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__content {
        grid-area: content !important;
        grid-column: 1 !important;
        grid-row: 2 !important;
        order: 2 !important;
    }

    html body.cms-id-8 #gatard-locations .gatard-location-card__map,
    html body.cms-id-8 #gatard-locations .gatard-location-card:nth-child(even) .gatard-location-card__map {
        grid-area: map !important;
        grid-column: 1 !important;
        grid-row: 3 !important;
        order: 3 !important;
    }
}