.elementor-kit-4{--e-global-color-primary:#FF6B35;--e-global-color-secondary:#00A7E1;--e-global-color-text:#4C4C4C;--e-global-color-accent:#FF6B35;--e-global-color-a6efafe:#FF6B35;--e-global-color-22a6df1:#00A7E1;--e-global-color-6dc5586:#5CB85C;--e-global-color-84da6b6:#E74C3C;--e-global-color-251c427:#FFB84D;--e-global-color-f2a68ab:#FFFFFF;--e-global-typography-primary-font-family:"Kodchasan";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Kodchasan";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Kodchasan";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Kodchasan";--e-global-typography-accent-font-weight:500;}.elementor-kit-4 button,.elementor-kit-4 input[type="button"],.elementor-kit-4 input[type="submit"],.elementor-kit-4 .elementor-button{background-color:var( --e-global-color-primary );border-radius:12px 12px 12px 12px;}.elementor-kit-4 e-page-transition{background-color:#FFBC7D;}.elementor-kit-4 a{font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-4 a:hover{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-4 h1{font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-4 h2{font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-4 h3{font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-4 h4{font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-4 h5{font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-4 h6{font-family:var( --e-global-typography-primary-font-family ), Kodchasan;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ========================================================
   AGENDA - THE EVENTS CALENDAR + ELEMENTOR PRO
   Adapté depuis agenda.css (Le CLEE)
   À coller dans : Apparence → Personnaliser → CSS additionnel
   OU Elementor → Kit du site → CSS personnalisé
======================================================== */
 
/* -------------------------------------------------------
   1. VARIABLES DE COULEUR (charte Le CLEE)
------------------------------------------------------- */
:root {
  --primary-900: #1a2e4a;
  --primary-800: #1e3a5f;
  --primary-600: #5b7be8;
  --primary-400: #8da4f0;
  --primary-100: #dce4f5;
  --primary-50:  #eef2fb;
  --grey-900: #111827;
  --grey-800: #1f2937;
  --grey-700: #374151;
  --grey-600: #4b5563;
  --grey-300: #d1d5db;
  --grey-200: #e5e7eb;
  --grey-100: #f3f4f6;
  --grey-50:  #f9fafb;
  --orange-clee: #f59e0b;
}
 
/* -------------------------------------------------------
   2. CONTENEUR GÉNÉRAL
------------------------------------------------------- */
.tribe-events,
.tribe-common {
  font-family: inherit;
  background: transparent;
}
 
/* -------------------------------------------------------
   3. BARRE DE NAVIGATION (mois + flèches)
------------------------------------------------------- */
 
/* Zone de navigation globale */
.tribe-events-c-top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  background: var(--grey-50);
  border-radius: 12px;
  margin-bottom: 30px;
}
 
/* Affichage du mois / de la date */
.tribe-events-c-top-bar__datepicker,
.tribe-events-c-top-bar__datepicker-desktop {
  font-size: 28px;
  font-weight: 600;
  color: var(--primary-800);
  text-transform: capitalize;
  background: transparent;
  border: none;
  cursor: pointer;
}
 
/* Boutons précédent / suivant */
.tribe-events-c-nav__prev-button,
.tribe-events-c-nav__next-button {
  width: 50px;
  height: 50px;
  border: 2px solid var(--primary-400) !important;
  background: white !important;
  border-radius: 50% !important;
  font-size: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-600) !important;
}
 
.tribe-events-c-nav__prev-button:hover,
.tribe-events-c-nav__next-button:hover {
  background: var(--primary-600) !important;
  color: white !important;
  transform: scale(1.1);
}
 
/* Flèches SVG à l'intérieur des boutons nav */
.tribe-events-c-nav__prev-button .tribe-common-c-btn__icon-svg,
.tribe-events-c-nav__next-button .tribe-common-c-btn__icon-svg {
  fill: currentColor;
}
 
/* -------------------------------------------------------
   4. SÉLECTEUR DE VUE (Mois / Liste / Jour…)
------------------------------------------------------- */
.tribe-events-c-view-.elementor-kit-4__list {
  display: flex;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0 0 30px 0;
  justify-content: center;
  flex-wrap: wrap;
}
 
.tribe-events-c-view-.elementor-kit-4__list-item-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 22px;
  border: 2px solid var(--grey-300) !important;
  background: white !important;
  border-radius: 8px !important;
  font-size: 15px;
  font-weight: 600;
  color: var(--grey-700) !important;
  text-decoration: none;
  transition: all 0.3s ease;
}
 
.tribe-events-c-view-.elementor-kit-4__list-item-link:hover {
  border-color: var(--primary-400) !important;
  background: var(--primary-50) !important;
  color: var(--primary-600) !important;
}
 
/* Bouton de vue actif */
.tribe-events-c-view-.elementor-kit-4__list-item--active .tribe-events-c-view-.elementor-kit-4__list-item-link {
  border-color: var(--primary-600) !important;
  background: var(--primary-600) !important;
  color: white !important;
}
 
/* Icône dans les boutons de vue */
.tribe-events-c-view-.elementor-kit-4__list-item-icon {
  width: 18px;
  height: 18px;
  fill: currentColor;
}
 
/* -------------------------------------------------------
   5. BARRE DE RECHERCHE / FILTRES
------------------------------------------------------- */
.tribe-events-c-search__input-control,
.tribe-events-c-search__input {
  padding: 12px 16px !important;
  border: 1px solid var(--grey-300) !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  background: white !important;
  transition: all 0.3s ease;
}
 
.tribe-events-c-search__input-control:hover,
.tribe-events-c-search__input:hover {
  border-color: var(--primary-400) !important;
}
 
.tribe-events-c-search__input-control:focus,
.tribe-events-c-search__input:focus {
  outline: none !important;
  border-color: var(--primary-600) !important;
  box-shadow: 0 0 0 3px rgba(91, 123, 232, 0.15) !important;
}
 
/* Bouton "Find Events" / "Rechercher" */
.tribe-events-c-search__button {
  padding: 12px 24px !important;
  background: var(--primary-600) !important;
  border: none !important;
  border-radius: 8px !important;
  color: white !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  cursor: pointer;
  transition: all 0.3s ease;
}
 
.tribe-events-c-search__button:hover {
  background: var(--primary-800) !important;
  transform: translateY(-1px);
}
 
/* -------------------------------------------------------
   6. VUE CALENDRIER MENSUEL — EN-TÊTES DES JOURS
------------------------------------------------------- */
.tribe-events-calendar-month__header-column {
  text-align: center;
  font-weight: 600 !important;
  padding: 15px !important;
  background: var(--primary-100) !important;
  color: var(--primary-800) !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px;
}
 
/* -------------------------------------------------------
   7. VUE CALENDRIER MENSUEL — CELLULES DES JOURS
------------------------------------------------------- */
.tribe-events-calendar-month__body-cell {
  min-height: 110px !important;
  padding: 10px !important;
  border: 1px solid var(--grey-200) !important;
  border-radius: 8px !important;
  background: white !important;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
}
 
.tribe-events-calendar-month__body-cell:hover {
  border-color: var(--primary-400) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}
 
/* Jours du mois précédent / suivant */
.tribe-events-calendar-month__body-cell--not-current-month {
  background: var(--grey-50) !important;
  opacity: 0.5;
}
 
/* Aujourd'hui */
.tribe-events-calendar-month__body-cell--today {
  border: 2px solid var(--primary-600) !important;
  background: var(--primary-50) !important;
}
 
/* -------------------------------------------------------
   8. NUMÉROS DE JOURS
------------------------------------------------------- */
.tribe-events-calendar-month__day-date,
.tribe-events-calendar-month__day-date-link {
  font-weight: 600 !important;
  color: var(--orange-clee) !important;
  font-size: 15px !important;
  text-decoration: none !important;
  display: block;
  margin-bottom: 6px;
}
 
.tribe-events-calendar-month__body-cell--today .tribe-events-calendar-month__day-date,
.tribe-events-calendar-month__body-cell--today .tribe-events-calendar-month__day-date-link {
  color: var(--orange-clee) !important;
}
 
/* -------------------------------------------------------
   9. BADGES D'ÉVÉNEMENTS (vue mensuelle)
------------------------------------------------------- */
.tribe-events-calendar-month__calendar-event-title,
.tribe-events-calendar-month__calendar-event-title a {
  display: block;
  width: 100%;
  padding: 3px 7px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: white !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none !important;
  margin-bottom: 3px;
}
 
/* Couleur par défaut des badges */
.tribe-events-calendar-month__calendar-event {
  background: var(--primary-600);
  border-radius: 4px;
  margin-bottom: 3px;
}
 
/* Couleurs par catégorie d'événement
   (remplace "conference", "atelier", etc. par les slugs de tes catégories WordPress) */
.tribe-events-calendar-month__calendar-event.cat-conference,
.tribe-events-calendar-month__calendar-event.tribe-event-category-conference {
  background: #3b82f6;
}
.tribe-events-calendar-month__calendar-event.cat-atelier,
.tribe-events-calendar-month__calendar-event.tribe-event-category-atelier {
  background: #10b981;
}
.tribe-events-calendar-month__calendar-event.cat-forum,
.tribe-events-calendar-month__calendar-event.tribe-event-category-forum {
  background: #f59e0b;
}
.tribe-events-calendar-month__calendar-event.cat-rencontre,
.tribe-events-calendar-month__calendar-event.tribe-event-category-rencontre {
  background: #8b5cf6;
}
.tribe-events-calendar-month__calendar-event.cat-salon,
.tribe-events-calendar-month__calendar-event.tribe-event-category-salon {
  background: #ec4899;
}
 
/* -------------------------------------------------------
   10. VUE LISTE — STRUCTURE GÉNÉRALE
------------------------------------------------------- */
.tribe-events-calendar-list {
  max-width: 900px;
  margin: 0 auto;
}
 
/* Séparateur de mois */
.tribe-events-calendar-list__month-separator-text {
  font-size: 22px !important;
  font-weight: 600 !important;
  color: var(--primary-800) !important;
  text-transform: capitalize;
  border-bottom: 2px solid var(--primary-100);
  padding-bottom: 10px;
  margin-bottom: 20px;
}
 
/* -------------------------------------------------------
   11. VUE LISTE — CARTE D'ÉVÉNEMENT
------------------------------------------------------- */
.tribe-events-calendar-list__event-article {
  background: white !important;
  border: 1px solid var(--grey-200) !important;
  border-radius: 12px !important;
  padding: 24px !important;
  transition: all 0.3s ease;
  display: flex;
  gap: 20px;
  margin-bottom: 20px !important;
}
 
.tribe-events-calendar-list__event-article:hover {
  border-color: var(--primary-400) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(-3px);
}
 
/* Badge date (carré coloré avec le jour + mois) */
.tribe-events-calendar-list__event-date-tag {
  flex-shrink: 0;
  width: 75px !important;
  min-height: 75px !important;
  background: var(--primary-600) !important;
  border-radius: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  color: white !important;
  text-align: center;
}
 
/* Numéro du jour dans le badge */
.tribe-events-calendar-list__event-date-tag-daynum {
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: white !important;
}
 
/* Mois dans le badge */
.tribe-events-calendar-list__event-date-tag-month {
  font-size: 13px !important;
  text-transform: uppercase !important;
  margin-top: 4px !important;
  color: white !important;
  font-weight: 500;
}
 
/* Titre de l'événement */
.tribe-events-calendar-list__event-title,
.tribe-events-calendar-list__event-title a {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--grey-900) !important;
  text-decoration: none !important;
  margin-bottom: 8px !important;
  line-height: 1.3;
}
 
.tribe-events-calendar-list__event-title a:hover {
  color: var(--primary-600) !important;
}
 
/* Infos (heure, lieu…) */
.tribe-events-calendar-list__event-datetime,
.tribe-events-calendar-list__event-venue {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--grey-600) !important;
  font-size: 14px !important;
  margin-bottom: 6px;
}
 
/* Description */
.tribe-events-calendar-list__event-description {
  color: var(--grey-700) !important;
  line-height: 1.6 !important;
  font-size: 14px !important;
  margin-top: 10px;
}
 
/* Lien "Voir l'événement" */
.tribe-events-calendar-list__event-details-link {
  display: inline-block;
  margin-top: 12px;
  padding: 8px 18px;
  background: var(--primary-50);
  border: 1px solid var(--primary-400);
  border-radius: 8px;
  color: var(--primary-600) !important;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none !important;
  transition: all 0.3s ease;
}
 
.tribe-events-calendar-list__event-details-link:hover {
  background: var(--primary-600);
  color: white !important;
}
 
/* -------------------------------------------------------
   12. POPUP / TOOLTIP ÉVÉNEMENT (vue mensuelle)
------------------------------------------------------- */
.tribe-events-calendar-month-grid-cell__events-popup {
  background: white !important;
  border-radius: 12px !important;
  border: 1px solid var(--grey-200) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12) !important;
  padding: 16px !important;
}
 
.tribe-events-calendar-month-grid-cell__events-popup-title,
.tribe-events-calendar-month-grid-cell__events-popup-title a {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--grey-900) !important;
  text-decoration: none !important;
}
 
.tribe-events-calendar-month-grid-cell__events-popup-datetime {
  font-size: 13px !important;
  color: var(--grey-600) !important;
}
 
/* Bouton fermer le popup */
.tribe-events-calendar-month-grid-cell__events-popup-close {
  background: var(--grey-100) !important;
  border-radius: 50% !important;
  width: 30px !important;
  height: 30px !important;
  transition: all 0.3s ease;
}
 
.tribe-events-calendar-month-grid-cell__events-popup-close:hover {
  background: var(--grey-200) !important;
  transform: rotate(90deg);
}
 
/* -------------------------------------------------------
   13. RESPONSIVE MOBILE
------------------------------------------------------- */
@media (max-width: 768px) {
 
  .tribe-events-c-view-.elementor-kit-4__list {
    flex-direction: column;
    align-items: center;
  }
 
  .tribe-events-c-view-.elementor-kit-4__list-item-link {
    width: 100%;
    justify-content: center;
  }
 
  .tribe-events-calendar-month__body-cell {
    min-height: 70px !important;
    padding: 5px !important;
  }
 
  .tribe-events-calendar-month__day-date,
  .tribe-events-calendar-month__day-date-link {
    font-size: 12px !important;
  }
 
  .tribe-events-calendar-month__calendar-event-title,
  .tribe-events-calendar-month__calendar-event-title a {
    font-size: 9px !important;
    padding: 2px 4px !important;
  }
 
  .tribe-events-calendar-list__event-article {
    flex-direction: column !important;
    padding: 16px !important;
  }
 
  .tribe-events-calendar-list__event-date-tag {
    width: 100% !important;
    min-height: 50px !important;
    flex-direction: row !important;
    gap: 8px;
    padding: 10px !important;
  }
 
  .tribe-events-calendar-list__event-title,
  .tribe-events-calendar-list__event-title a {
    font-size: 17px !important;
  }
}/* End custom CSS */