/* ==========================================================================
   Le P'tit Club — Front styles (blocs offre-active)

   Le mode résumé (fiche club) utilise les classes natives WPBakery/Ave/Bootstrap
   pour le layout, le titre, le bouton et l'image.
   Seul le mode complet (page inscription) a besoin de CSS custom minimal.
   ========================================================================== */

/* Conteneur principal */
.lpc-offre-active {
    font-family: inherit;
}

/* === Mode complet (page inscription) === */

.lpc-offre-active h2 {
    /* Taille et poids gérés en inline style dans le PHP */
}

.lpc-offre-description {
    font-size: 16px;
    margin: 0 0 20px;
    color: #333;
}

.lpc-offre-description strong {
    color: #1d2327;
}

.lpc-offre-texte {
    font-size: 16px;
    margin: 0 0 20px;
    color: #333;
}

.lpc-offre-affiche {
    margin: 20px 0;
    text-align: center;
}

.lpc-offre-affiche img.lpc-offre-img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}

.lpc-offre-plannings {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    margin: 20px 0;
}

.lpc-offre-plannings img.lpc-offre-img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}

@media (min-width: 768px) {
    .lpc-offre-plannings img.lpc-offre-img {
        max-width: 48%;
    }
}

.lpc-offre-cta {
    margin: 24px 0 0;
}

/* === Mode résumé (fiche club) ===
   Le layout utilise les classes natives WPBakery/Bootstrap :
     vc_row, ld-container, row ld-row, vc_col-md-6, vc_col-md-offset-1 vc_col-md-5
   Le titre utilise ld-fancy-heading + inline styles (40px/50px/600/uppercase)
   Le bouton utilise btn btn-solid btn-sm round + inline styles
   L'image utilise liquid-img-group-* avec data-shadow-style et data-roundness
   → Aucun CSS custom nécessaire pour le résumé. */

/* Description du résumé — pas de classes WPBakery pour ça */
.lpc-resume-description a {
    color: inherit;
    text-decoration: underline;
}

/* Colonne image résumé — espacement uniquement quand les colonnes s'empilent */
@media (max-width: 767px) {
    .lpc-resume-image-wrapper {
        margin-top: 30px;
    }
}

/* === Placeholder (aucune offre) === */

.lpc-offre-placeholder {
    padding: 20px;
    text-align: center;
    color: #888;
    font-style: italic;
}