/* JNMFO-26 — effects.css : animations & options globales (toutes les pages) */

/* Transition d'entrée de page */
@keyframes fxPageIn{from{opacity:0}to{opacity:1}}
body{animation:fxPageIn .55s ease both}
body.fx-leave{opacity:0;transition:opacity .22s ease}

/* Barre de progression de lecture */
.fx-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:300;pointer-events:none;background:transparent}
.fx-progress i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--gold2),var(--teal2));transform:scaleX(0);transform-origin:left;box-shadow:0 0 10px rgba(226,185,59,.6)}
body.rtl .fx-progress i{transform-origin:right}

/* Apparition au scroll (animation : n'entre pas en conflit avec les :hover) */
@keyframes fxUp{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
.fx-reveal:not(.fx-in){opacity:0}
.fx-reveal.fx-in{animation:fxUp .75s var(--ease) backwards;animation-delay:var(--fxd,0ms)}

/* Survols raffinés */
.tl-card,.dl-btn,.date-row,.transport-card,.attend-card,.partner-logo{transition:translate .3s var(--ease),box-shadow .3s,border-color .3s,background .3s}
.tl-card:hover,.dl-btn:hover,.transport-card:hover,.attend-card:hover{translate:0 -4px;box-shadow:var(--sh2);border-color:var(--teal2)}
.date-row:hover{translate:6px 0}
body.rtl .date-row:hover{translate:-6px 0}

/* Effet « ripple » des boutons */
.btn-primary,.btn-outline,.btn-dark,.submit-btn{position:relative;overflow:hidden}
.fx-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.45);transform:scale(0);animation:fxRipple .6s ease-out forwards;pointer-events:none}
@keyframes fxRipple{to{transform:scale(1);opacity:0}}

/* Retour en haut */
.fx-top{position:fixed;right:22px;bottom:22px;z-index:250;width:46px;height:46px;border:0;border-radius:50%;cursor:pointer;
  background:linear-gradient(135deg,var(--navy2),var(--teal));color:var(--gold2);font-size:1.2rem;display:grid;place-items:center;
  box-shadow:0 10px 24px rgba(var(--b800-rgb),.35);opacity:0;visibility:hidden;translate:0 16px;transition:opacity .3s,translate .3s var(--ease),visibility .3s,box-shadow .3s}
.fx-top.show{opacity:1;visibility:visible;translate:0 0}
.fx-top:hover{box-shadow:0 14px 30px rgba(var(--b800-rgb),.5);translate:0 -3px}
body.rtl .fx-top{right:auto;left:22px}

/* Bouton d'inscription flottant */
.fx-cta{position:fixed;left:22px;bottom:24px;z-index:250;display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:40px;
  background:linear-gradient(120deg,var(--gold),var(--gold2));color:#2b2200;font-weight:700;font-size:.88rem;text-decoration:none;
  box-shadow:0 10px 26px rgba(184,146,30,.45);opacity:0;visibility:hidden;translate:0 20px;transition:opacity .35s,translate .35s var(--ease),visibility .35s,box-shadow .3s}
.fx-cta.show{opacity:1;visibility:visible;translate:0 0;animation:fxPulse 3.2s ease-in-out 1.2s infinite}
.fx-cta:hover{box-shadow:0 14px 34px rgba(184,146,30,.65)}
body.rtl .fx-cta{left:auto;right:22px}
@keyframes fxPulse{0%,100%{box-shadow:0 10px 26px rgba(184,146,30,.45)}50%{box-shadow:0 10px 26px rgba(184,146,30,.45),0 0 0 10px rgba(226,185,59,.18)}}

/* Accessibilité */
.fx-skip{position:fixed;left:12px;top:-60px;z-index:400;background:var(--gold2);color:#2b2200;padding:10px 18px;border-radius:0 0 10px 10px;font-weight:700;text-decoration:none;transition:top .25s}
.fx-skip:focus{top:0}
:focus-visible{outline:3px solid var(--gold2);outline-offset:3px;border-radius:4px}

@media(max-width:760px){
  .fx-top{right:14px;bottom:14px;width:42px;height:42px}
  body.rtl .fx-top{left:14px}
  .fx-cta{left:14px;bottom:16px;padding:10px 18px;font-size:.82rem}
  body.rtl .fx-cta{right:14px}
}
button.btn-outline{font-family:inherit;background:transparent;line-height:inherit}
