/* =========================================================================
   1ʳᵉ Compagnie d’Arc – Sarrebourg
   Feuille de style : Blog
   Fichier  : assets/css/blog.css
   Date     : 28/10/2025
   Version  : 1.2.0
   Description :
   - Mise en forme responsive des cartes
   - Intégration/compactage du module Facebook
   - Corrections de syntaxe CSS (sélecteurs, accolades)
   ========================================================================= */

/* ───────────────────────────────────────────────────────────────────────────
   Cartes d'actualité
   ───────────────────────────────────────────────────────────────────────── */
#zonePosts .card {
    aspect-ratio: 1 / 2; /* Carte en format vertical : visuel + corps */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Espace titre/extrait/bouton */
}

/* Image ou bloc d’image
   NOTE : la version initiale contenait une virgule finale + un sélecteur
   commenté, ce qui invalidait la règle. On rétablit les deux sélecteurs. */
#zonePosts .card-img-wrapper,
#zonePosts .card-img-top {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Remplissage sans déformation notable */
}

/* Harmonisation titres et textes */
#zonePosts .card-title {
    font-size: 1rem;
    line-height: 1.1;
}

#zonePosts .card-text {
    flex-grow: 1; /* Pousse le bouton en bas de carte */
}

/* ───────────────────────────────────────────────────────────────────────────
   Module Facebook (habillage + compactage en colonne)
   ───────────────────────────────────────────────────────────────────────── */
#facebook {
    background-color: #f8f9fa; /* léger gris clair */
    border-radius: .5rem;
    padding: 1rem;
    margin-bottom: 0; /* compactage en contexte colonne */
}

#facebook h2 {
    font-size: 1.25rem;
    margin-bottom: 1rem;
    text-align: center;
}

/* Compactage lorsque le module est inséré en colonne (blog) */
#facebook .container {
    padding-left: 0;
    padding-right: 0;
}
/* Dans la colonne blog on masque le titre du module pour réduire la redondance
   visuelle (le titre de page joue déjà ce rôle). */
#facebook h2 {
    display: none;
}

/* ───────────────────────────────────────────────────────────────────────────
   Accessibilité & préférences utilisateur
   (aucun impact sur le texte, uniquement confort visuel)
   ───────────────────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
