/*
  NJ — Reading Progress
  Barre fixe tout en haut de l'écran (au-dessus du header sticky, z-index 40).
  Dégradé "feu" : orange (#ff7a3c, l'accent du site) vers le rouge.
  Le dégradé reste ancré sur toute la largeur de l'écran : la barre est
  révélée par un masque (clip-path piloté par le JS) au lieu d'être écrasée.
*/

.nj-reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  z-index: 9990;
  pointer-events: none;
  background: transparent;
  /* Lueur de braise autour de la partie remplie. */
  filter: drop-shadow(0 0 5px rgba(255, 74, 31, 0.55));
}

.nj-reading-progress__bar {
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    #ffb347 0%,
    var(--accent, #ff7a3c) 28%,
    #ff4a1f 62%,
    #e5261c 100%
  );
  background-size: 200% 100%;
  background-position: 0% 50%;
  clip-path: inset(0 100% 0 0);
  animation: nj-reading-progress-flame 5s ease-in-out infinite alternate;
}

/* Légère ondulation des flammes. */
@keyframes nj-reading-progress-flame {
  from { background-position: 0% 50%; }
  to   { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .nj-reading-progress__bar { animation: none; }
}

/* Barre d'admin WordPress : la décaler pour ne pas la masquer. */
body.admin-bar .nj-reading-progress { top: 32px; }
@media (max-width: 782px) {
  body.admin-bar .nj-reading-progress { top: 46px; }
}

@media print {
  .nj-reading-progress { display: none; }
}