/* Top progress bar — port of the legacy ngx-loading-bar look.
   ideasfor.events renders <ngx-loading-bar class="loading-bar-fixed"> at the
   app root and shows it while its HTTP calls are in flight. Captured from the
   live site, the visual contract is:

     ngx-loading-bar #loading-bar .bar   background #000   (legacy override)
     ngx-loading-bar .spinner-icon       display none      (legacy hides it)
     .loading-bar-fixed > div .bar       position fixed
     .loading-bar-fixed > div .peg       display block
     .peg                                70px wide, right-aligned, height 2px,
                                         opacity .45, box-shadow 1px 0 6px 1px,
                                         border-radius 100%

   The library's own geometry (2px tall, full width, width transition, high
   z-index) is reproduced here rather than pulled in as a dependency —
   ngx-loading-bar is Angular-only. */

#loading-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    z-index: 10002;
    pointer-events: none;
    opacity: 0;
    transition: opacity 250ms linear;
}

/* The peg sits at the bar's right edge and is 70px wide, so at width 0 it
   hangs from -70px to 0, off the left of the viewport. `overflow: hidden`
   here does NOT clip it — .bar is position:fixed (the legacy spec), and a
   fixed element escapes the overflow of any ancestor without a transform.
   The element is instead removed from the DOM when idle (loading-bar.js),
   which is also what ngx-loading-bar does; this rule keeps it invisible for
   the frames between insertion and the first width update. */
#loading-bar:not(.active) .peg {
    display: none;
}

#loading-bar.active {
    opacity: 1;
}

#loading-bar .bar {
    position: fixed;
    top: 0;
    left: 0;
    height: 2px;
    width: 0;
    background: #000;
    border-top-right-radius: 1px;
    border-bottom-right-radius: 1px;
    transition: width 350ms ease;
}

/* The glow that trails the leading edge. */
#loading-bar .peg {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 70px;
    height: 2px;
    opacity: 0.45;
    box-shadow: #000 1px 0 6px 1px;
    color: #000;
    border-radius: 100%;
}

/* Legacy hides the spinner that ships with the library; no element is
   emitted here at all, but the rule is kept so the intent survives if one is
   ever added. */
#loading-bar .spinner-icon {
    display: none;
}
