/*
CTC Separate Stylesheet
Updated: 2025-06-03 19:05:37
*/

/* --- Styles pour le bloc "Requête de boucles" (vos événements) --- */

/* Conteneur principal du bloc Requête de boucles */
.wp-block-query {
    display: grid; /* Utilise la grille pour le layout */
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* 2 ou 3 colonnes flexibles sur desktop, 1 sur mobile */
    gap: 20px; /* Espacement entre les "cartes" d'événements */
    margin-bottom: 30px; /* Marge en dessous de la section */
}

/* Style de chaque événement/article à l'intérieur de la boucle */
.wp-block-post { /* C'est la classe par défaut pour un élément dans Query Loop */
    background-color: #ffffff; /* Fond blanc pour la carte */
    border: 1px solid #e0e0e0; /* Petite bordure */
    border-radius: 8px; /* Bords légèrement arrondis */
    overflow: hidden; /* S'assure que l'image ne dépasse pas les bords arrondis */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Ombre légère pour donner un effet de "carte" */
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; /* Effet au survol */
}

.wp-block-post:hover {
    transform: translateY(-5px); /* Remonte légèrement au survol */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Ombre plus prononcée au survol */
}

/* Style de l'image mise en avant */
.wp-block-post-featured-image {
    width: 100%; /* L'image prend toute la largeur de la carte */
    height: 200px; /* Hauteur fixe pour les images (ajuster si besoin) */
    overflow: hidden; /* Cache le dépassement */
    position: relative;
}

.wp-block-post-featured-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Recadre l'image pour couvrir l'espace sans la déformer */
}

/* Conteneur pour le texte (titre, extrait) */
.wp-block-post-template .wp-block-post-title,
.wp-block-post-template .wp-block-post-excerpt {
    padding: 15px; /* Espacement interne pour le contenu texte */
}

/* Style du titre de l'événement */
.wp-block-post-title {
    font-size: 1.25em; /* Taille de police du titre */
    margin-top: 0;
    margin-bottom: 10px;
}

.wp-block-post-title a {
    text-decoration: none; /* Pas de soulignement sur les liens du titre */
    color: #333; /* Couleur du titre (ajuster si besoin) */
}

.wp-block-post-title a:hover {
    color: #0073aa; /* Couleur au survol (ajuster si besoin) */
}

/* Style de l'extrait/description courte */
.wp-block-post-excerpt {
    font-size: 0.9em; /* Taille de police de l'extrait */
    color: #555; /* Couleur du texte (ajuster si besoin) */
    line-height: 1.6;
}

/* Ajustements pour les écrans plus petits (mobile) */
@media (max-width: 768px) {
    .wp-block-query {
        grid-template-columns: 1fr; /* Une seule colonne sur mobile */
    }
}