/*
 * 3PE Sauvy sous ilucid-v2 : seulement ce que les classes Tailwind du thème
 * ne couvrent pas. Chargée après la feuille `custom` du thème
 * (inc/pe3-habillage.php).
 */

/* CUSTOM: carrousels de l'accueil (carrousel du thème). Activités : cartes
   horizontales larges, 44 rem au plus (86 % de l'écran en mobile), la carte
   courante centrée et ses voisines visibles de part et d'autre, comme sur
   l'ancien accueil. Prestations : cartes de 300 px. */
.ilucid-slider.pe3-carrousel--activites {
  --ilucid-slider-inset: calc((100% - min(44rem, 86vw)) / 2);
}
.ilucid-slider .ilucid-slider__track > .pe3-carrousel__carte {
  scroll-snap-align: start;
  margin: 0;
}
.pe3-carrousel--activites .ilucid-slider__track > .pe3-carrousel__carte {
  flex: 0 0 min(44rem, 86vw);
}
.pe3-carrousel--prestations .ilucid-slider__track > .pe3-carrousel__carte {
  flex: 0 0 min(300px, 80vw);
}

/* CUSTOM: palette et tailles de l'éditeur de l'ancien thème (breakdance-zero,
   options « couleur par défaut Gutenberg »), encore utilisées par des
   paragraphes colorés des contenus ; sans elles, ces textes perdraient leur
   couleur ou leur taille. */
.has-couleur-1-color { color: #000000; }
.has-couleur-2-color { color: #abb8c3; }
.has-couleur-3-color { color: #ffffff; }
.has-couleur-4-color { color: #f78da7; }
.has-couleur-5-color { color: #cf2e2e; }
.has-couleur-6-color { color: #ff6900; }
.has-moyen-font-size { font-size: 20px; }
.has-medium-font-size { font-size: 20px; }
.has-large-font-size { font-size: 24px; }

/* CUSTOM: bulle de la carte des activités, reprise de Vignerons Bio et de
   Terres en Mêlées (css/tem.css). MapLibre pose une marge intérieure qui
   ferait un liseré blanc autour de la photo, impose sa police, et sa croix
   disparaîtrait sur une photo claire. Classes posées par js/pe3-liste.js :
   le CSS compilé du thème ne les connaît pas. */
[data-pe3-carte] .maplibregl-popup-content {
  font-family: var(--font-corps);
  width: 300px;
  padding: 0;
  overflow: hidden;
  border-radius: var(--radius-card, 2px);
}
.pe3-bulle__texte {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.75rem;
}
.pe3-bulle__titre {
  margin: 0;
  font-family: var(--font-titres);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  text-wrap: balance;
}
.pe3-bulle__titre a {
  color: var(--color-noir);
  text-decoration: none;
}
.pe3-bulle__titre a:hover {
  text-decoration: underline;
}
.pe3-bulle__lieu {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-muted);
}
.pe3-bulle__resume {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--color-noir);
}
.pe3-bulle__image img {
  display: block;
  width: 100%;
  height: 150px;
  object-fit: cover;
}
[data-pe3-carte] .maplibregl-popup-close-button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  background: #ffffff;
  color: #1c1917;
  font-size: 18px;
  line-height: 26px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}

/* CUSTOM: plein écran de la carte sous 1120 px : le bouton « Revenir en
   haut » du thème passerait par-dessus. */
.pe3-carte-plein-ecran .ilucid-back-to-top,
.pe3-carte-plein-ecran #back-to-top {
  display: none !important;
}

/* CUSTOM: le formulaire de contact de l'activité dans sa fenêtre : la
   fenêtre défile, pas la page. */
dialog[data-pe3-contact] {
  max-height: calc(100dvh - 2rem);
  overflow-y: auto;
}

/* CUSTOM: logos des références de l'accueil en couleur, comme sur l'ancien
   site (le thème les grise jusqu'au survol), et un peu plus hauts (60 px,
   48 px en mobile), comme sur Terres en Mêlées. */
.ilucid-accueil-logos__item img {
  filter: none;
  max-height: none;
  height: 3rem;
  width: auto;
  max-width: 14rem;
  object-fit: contain;
}
@media (min-width: 768px) {
  .ilucid-accueil-logos__item img { height: 3.75rem; }
}

/* CUSTOM: la bande des références de l'accueil défile bord à bord, sur toute
   la largeur de la fenêtre, sans marge à gauche ni à droite (demande de
   Julien, 13 novembre 2026, comme sur Terres en Mêlées). Le titre reste
   aligné sur ceux des autres sections. */
.ilucid-accueil-logos {
  padding-left: 0;
  padding-right: 0;
}
.ilucid-accueil-logos__inner {
  max-width: none;
}
.ilucid-accueil-logos .ilucid-entete-section {
  box-sizing: border-box;
  max-width: var(--container-page);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--ilucid-gutter);
  padding-right: var(--ilucid-gutter);
}