/* ============================================================
   Carrousel Réalisations – styles front
   (Utilise --brand si défini globalement, sinon vert #64A57B)
   ============================================================ */

.galerie-carrousel-selection{
  max-width: 100%;
  --arrow-color: var(--brand, #64A57B);
  --dot-color: #ddd;
  --dot-active: var(--brand, #64A57B);
}

/* Cartes */
.galerie-carrousel-selection .slide{ padding: 8px; }
.galerie-carrousel-selection .slide a{
  display:block; position:relative; overflow:hidden;
  border-radius:8px; box-shadow:0 4px 8px rgba(0,0,0,.15);
}
.galerie-carrousel-selection .slide img{
  width:100%;
  height:var(--wpz-carousel-h, 250px);
  object-fit:cover;
  transition:transform .3s ease;
}
.galerie-carrousel-selection .slide img:hover{ transform:scale(1.05); }

/* Flèches Slick (desktop/tablette) */
.galerie-carrousel-selection .slick-prev,
.galerie-carrousel-selection .slick-next{
  background:none !important; border:none !important; box-shadow:none !important;
  border-radius:50% !important; width:40px !important; height:40px !important;
  z-index:10 !important; top:45% !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  font-size:0 !important; outline:none !important;
}
.galerie-carrousel-selection .slick-prev{ left:-20px !important; }
.galerie-carrousel-selection .slick-next{ right:-20px !important; }
.galerie-carrousel-selection .slick-prev::before,
.galerie-carrousel-selection .slick-next::before{
  font-size:24px !important; line-height:1 !important; color:var(--arrow-color) !important;
}
.galerie-carrousel-selection .slick-prev::before{ content:"←" !important; }
.galerie-carrousel-selection .slick-next::before{ content:"→" !important; }

/* Dots Slick */
.galerie-carrousel-selection .slick-dots li button{
  background:none !important; border:none !important; box-shadow:none !important;
  outline:none !important; padding:0 !important; width:auto !important; height:auto !important;
}
.galerie-carrousel-selection .slick-dots li button:before{
  font-size:10px; color:var(--dot-color); opacity:1;
}
.galerie-carrousel-selection .slick-dots li.slick-active button:before{
  color:var(--dot-active);
}

/* Mobile : pas de flèches ni de dots, peek plus net */
@media (max-width:768px){
  .galerie-carrousel-selection .slick-arrow,
  .galerie-carrousel-selection .slick-dots{ display:none !important; }
  .galerie-carrousel-selection .slide{ padding:6px; }
}

/* ============================================================
   LIGHTGALLERY – overlay au-dessus de tout + toolbar propre
   ============================================================ */

/* Toujours au-dessus de tout */
.lg-container, .lg-backdrop, .lg-outer, .lg-inner{ z-index:99999 !important; }

/* Fond assombri élégant */
.lg-backdrop{ background:rgba(0,0,0,0.9) !important; }

/* Image grande arrondie + ombre */
.lg-container .lg-current .lg-img-wrap img,
.lg-container .lg-inner .lg-image,
.lg-container .lg-outer .lg-img-wrap img{
  border-radius:5px !important;
  box-shadow:0 8px 28px rgba(0,0,0,0.45);
}

/* Miniatures arrondies */
.lg-thumb-outer img{ border-radius:5px; }

/* Toolbar en flex (plus de chevauchement) */
.lg-toolbar{
  background:transparent !important;
  z-index:100000 !important;
  display:flex !important; align-items:center !important;
  gap:8px !important; padding:10px 12px !important;
  pointer-events:auto !important;
}
/* Compteur à gauche */
.lg-counter{
  margin-right:auto !important; color:#fff !important; font-weight:500;
}

/* Icônes (zoom, close, bouton natif de partage) */
.lg-toolbar .lg-icon,
.lg-toolbar .lg-native-share{
  position:static !important;
  width:38px; height:38px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,0.35); backdrop-filter:blur(4px);
  color:#fff !important; transition:transform .2s ease, background .2s ease, opacity .2s ease;
}
.lg-toolbar .lg-icon:hover,
.lg-toolbar .lg-native-share:hover{
  transform:scale(1.08);
  background:color-mix(in oklab, var(--brand, #64A57B) 65%, rgba(0,0,0,.3));
}

/* Fermer (X) un peu plus grand */
.lg-toolbar .lg-close{ font-size:26px !important; }

/* Icône du bouton "partager" natif (inserrée côté JS) */
.lg-toolbar .lg-native-share::before{
  content:"⤴"; font-size:18px; line-height:1;
}

/* Très petit mobile : on masque les zooms pour gagner de la place */
@media (max-width:420px){
  .lg-toolbar .lg-zoom-in, .lg-toolbar .lg-zoom-out{ display:none !important; }
}