/* Styles pour la template par défaut */
.custom-events-widget.template-default .events-list {display: flex; flex-direction: column;  gap: 20px;}
.custom-events-widget.template-default .block-event {display: flex; background-color: #F2F2F2; border-radius: 10px; padding: 20px; gap: 20px;}
.custom-events-widget.template-default .block-event p {margin-inline-start: 0px; margin-block-end: 0px;}

.custom-events-widget.template-default .block-date {width: 20%; background-color: #0094F6; border-radius: 10px; padding: 20px;
    display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; align-content: center; gap: 10px; }
    
.custom-events-widget.template-default .block-date-jour {color: #ffffff; font-size: 42px; font-family: "Almarai", Sans-serif; font-weight: 900; text-align: center;}

.custom-events-widget.template-default .block-date .le-mois {color: #ffffff; font-size: 16px; font-family: "Almarai", Sans-serif; font-weight: 700; text-align: center;}
.custom-events-widget.template-default .block-texte-lieu .list-items-inline {display: flex; gap: 20px; justify-content: flex-start; padding-inline-start: 0px;}
.custom-events-widget.template-default .block-texte-titre1 h4 {margin-block-start: 0px; margin-block-end: 10px;}
.custom-events-widget.template-default .le-titre1 a {color: black;}
.custom-events-widget.template-default .le-sous-titre {margin-bottom: 5px;}
.custom-events-widget.template-default .le-sous-titre a {color: #6A6A6A;}
.custom-events-widget.template-default .block-event .elementor-icon-list-icon svg {fill: #23232326;}
.custom-events-widget.template-default .mon-lieu, .mon-heure {font-family: Almarai, sans-serif; font-size: 16px; font-weight: 700; color: #6A6A6A;}
.custom-events-widget.template-default .block-texte-lieu .elementor-icon-list-item {gap: 5px;}

.nos-spectacles .custom-events-widget.template-default .events-list { gap: 40px;}

/* Styles pour la template grid */
.custom-events-widget.template-grid .block-event {
    background-color: #e0f7fa;
    border: 1px solid #00acc1;
    padding: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}


/* Grille avec 1, 2, 3 ou 4 colonnes */
.grille-de-boucle.columns-1 {
    display: grid;
    grid-template-columns: 1fr;
}

.grille-de-boucle.columns-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.grille-de-boucle.columns-3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.grille-de-boucle.columns-4 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

/* Ajout de grid-gap (espacement entre les éléments) */
.grille-de-boucle {
    grid-gap: 20px; /* Valeur par défaut si pas définie dynamiquement */
}