/*
  Carrousel de la page d'accueil (jr-slideshow.js). Remplace slideshow.css.
  La hauteur vient du ratio du format (padding-top pose en ligne par
  jr_slides_render) : la boite est reservee avant le chargement des images,
  aucun decalage de mise en page, quelle que soit la taille des fichiers.
*/
.jr-slider{position:relative;width:100%;margin:6px auto 14px;box-sizing:border-box;}
.jr-slider__viewport{position:relative;height:0;overflow:hidden;border-radius:6px;background:#f3f3f3;}
.jr-slider__slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;visibility:hidden;z-index:1;}
.jr-slider__slide.is-active{opacity:1;visibility:visible;z-index:2;}
.jr-slider__slide a{display:block;width:100%;height:100%;}
.jr-slider__slide img{display:block;width:100%;height:100%;object-fit:cover;border:0;}

/* Fondu */
.jr-slider--fade .jr-slider__slide{transition:opacity .6s ease,visibility 0s linear .6s;}
.jr-slider--fade .jr-slider__slide.is-active{transition:opacity .6s ease,visibility 0s linear 0s;}

/* Glissement : le script pose les translateX en ligne */
.jr-slider--slide .jr-slider__slide{opacity:1;transition:transform .6s ease;}
.jr-slider--slide .jr-slider__slide.is-entering{visibility:visible;z-index:3;}

/* Fleches : discretes, apparaissent au survol ; toujours visibles sur ecran tactile */
.jr-slider__arrow{position:absolute;top:50%;z-index:5;width:40px;height:40px;margin-top:-20px;padding:0;border:0;border-radius:50%;
  background:rgba(255,255,255,.85);color:#222;font:32px/36px Arial,sans-serif;cursor:pointer;
  box-shadow:0 1px 4px rgba(0,0,0,.25);opacity:0;transition:opacity .2s ease,background .2s ease;}
.jr-slider__arrow span{display:block;margin-top:-3px;}
.jr-slider__arrow--prev{left:10px;}
.jr-slider__arrow--next{right:10px;}
.jr-slider:hover .jr-slider__arrow,.jr-slider__arrow:focus{opacity:1;}
.jr-slider__arrow:hover{background:#fff;}
@media (hover:none){.jr-slider__arrow{opacity:.9;}}

/* Pastilles : zone cliquable de 24px (cible tactile) autour d'un point de 10px */
.jr-slider__dots{position:absolute;left:50%;bottom:8px;z-index:5;transform:translateX(-50%);display:flex;padding:0 6px;
  border-radius:12px;background:rgba(0,0,0,.28);}
.jr-slider__dot{position:relative;width:24px;height:24px;margin:0;padding:0;border:0;background:none;cursor:pointer;}
.jr-slider__dot:after{content:"";position:absolute;top:7px;left:7px;width:10px;height:10px;border-radius:50%;
  background:rgba(255,255,255,.55);transition:background .2s ease,transform .2s ease;}
.jr-slider__dot:hover:after{background:rgba(255,255,255,.85);}
.jr-slider__dot.is-active:after{background:#fff;transform:scale(1.2);}

.jr-slider__arrow:focus-visible,.jr-slider__dot:focus-visible,.jr-slider__slide a:focus-visible{outline:2px solid #e3004f;outline-offset:2px;}

/* Sans JavaScript : seule la premiere banniere, pas de commandes inertes */
.jr-slider:not(.is-ready) .jr-slider__arrow,.jr-slider:not(.is-ready) .jr-slider__dots{display:none;}

@media (prefers-reduced-motion:reduce){
  .jr-slider__slide,.jr-slider--fade .jr-slider__slide,.jr-slider--fade .jr-slider__slide.is-active,.jr-slider--slide .jr-slider__slide{transition:none;}
}
