/* WayFood navigation progress + Livewire page transitions. */
:root {
    --wf-nav-progress: #176b4d;
    --wf-nav-progress-highlight: #6dd3a4;
}

#wayfood-navigation-progress {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 2147483647;
    height: 3px;
    pointer-events: none;
    opacity: 0;
    transform: translateZ(0);
    transition: opacity 160ms ease;
    contain: layout paint style;
}

#wayfood-navigation-progress[data-active="true"] { opacity: 1; }

#wayfood-navigation-progress .wf-nav-progress-track {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: rgba(23, 107, 77, .08);
}

#wayfood-navigation-progress .wf-nav-progress-bar {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: 100%;
    transform: scaleX(.02);
    transform-origin: right center;
    border-radius: 0 0 0 999px;
    background: linear-gradient(90deg, var(--wf-nav-progress), var(--wf-nav-progress-highlight), var(--wf-nav-progress));
    box-shadow: 0 0 10px rgba(23, 107, 77, .28), 0 2px 8px rgba(23, 107, 77, .18);
    transition: transform 220ms cubic-bezier(.22, .7, .2, 1);
    will-change: transform;
}

#wayfood-navigation-progress[data-finishing="true"] .wf-nav-progress-bar {
    transition-duration: 130ms;
}

html.wf-navigation-busy { cursor: progress; }
html.wf-navigation-busy body { cursor: inherit; }

/* Keep navigation animation scoped to page content. Headers/sidebars stay stable. */
::view-transition-old(livewire-navigate) {
    animation: wf-navigate-out 110ms ease-in both;
}

::view-transition-new(livewire-navigate) {
    animation: wf-navigate-in 190ms cubic-bezier(.16, 1, .3, 1) both;
}

@keyframes wf-navigate-out {
    to { opacity: .88; transform: translateY(-2px); }
}

@keyframes wf-navigate-in {
    from { opacity: .72; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    #wayfood-navigation-progress,
    #wayfood-navigation-progress .wf-nav-progress-bar {
        transition-duration: .01ms !important;
    }

    ::view-transition-old(livewire-navigate),
    ::view-transition-new(livewire-navigate) {
        animation-duration: .01ms !important;
    }
}