/* ===================================================
   NAVIGATION PROGRESS BAR
   A thin bar at the very top of the viewport that
   trickles forward while the next page is loading,
   then vanishes when it arrives.

   Replaces the old full-screen splash overlay: it
   signals activity without blanking the page or
   hiding content, which reads as more polished for a
   content/catalog site (cf. GitHub, YouTube, Medium).

   Driven by resources/js/nav-progress.js. Used on the
   public layout, the admin layout, and the login page.
   =================================================== */

.nav-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0;
    background: linear-gradient(90deg, #c8902d, #e8b44a);
    box-shadow: 0 0 10px rgba(200, 144, 45, 0.7),
                0 0 4px rgba(200, 144, 45, 0.5);
    border-radius: 0 2px 2px 0;
    z-index: 99999;
    opacity: 0;
    pointer-events: none;
    /* width eases as the bar trickles; opacity fades it in/out */
    transition: width 0.2s ease, opacity 0.35s ease;
}

.nav-progress.is-active {
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .nav-progress {
        transition: opacity 0.2s ease;
    }
}