/* Up Next card while the tracker is flying it (js/liveleg.js) */
#scheduled-flights-section .sched-bubble.is-live { --live: var(--career-primary, #4092cc); }
body.airline-branding #scheduled-flights-section .sched-bubble.is-live { --live: var(--airline-color, var(--career-primary, #4092cc)); }

/* Route line: flown part solid, the rest stays dotted, plane sits at the current progress */
#scheduled-flights-section .sched-bubble.is-live .sb-dots { gap: .35rem; }
#scheduled-flights-section .sched-bubble.is-live .sb-dots::before { flex-grow: var(--p, 0); flex-basis: 0; border-top: 3px solid var(--live); border-radius: 2px; }
#scheduled-flights-section .sched-bubble.is-live .sb-dots::after {
    flex-grow: calc(100 - var(--p, 0)); flex-basis: 0; border-top: 0; height: 2px;
    background: repeating-linear-gradient(90deg, color-mix(in srgb, var(--live) 55%, transparent) 0 4px, transparent 4px 8px);
    animation: sl-march .9s linear infinite;
}

/* Day chain: the live hop fills to the current progress, a glowing marker rides the line, the tail marches */
#sf-chain .sf-hop.live { --live: var(--career-primary, #4092cc); }
body.airline-branding #sf-chain .sf-hop.live { --live: var(--airline-color, var(--career-primary, #4092cc)); }
#sf-chain .sf-hop.live::before {
    border-top: 0; top: 18px; height: 3px; border-radius: 2px;
    background: linear-gradient(var(--live), var(--live)) 0 0 / calc(var(--p, 0) * 1%) 100% no-repeat,
                repeating-linear-gradient(90deg, color-mix(in srgb, var(--live) 50%, transparent) 0 6px, transparent 6px 11px);
    animation: sl-march-hop 1s linear infinite;
}
#sf-chain .sf-hop.live::after {
    content: '\f072'; font: 900 .8rem/1 'Font Awesome 6 Free'; color: var(--live);
    position: absolute; top: 19.5px; left: calc(var(--p, 0) * 1%); transform: translate(-50%, -50%);
}
#sf-chain .sf-hop.live .sf-lbl { z-index: 1; color: #16a34a; }
#sf-chain .sf-hop.live .sf-lbl i { animation: sl-blink 1.4s ease-in-out infinite; }
#sf-chain .sf-hop.live .sf-tm { color: #16a34a; font-weight: 600; }
#scheduled-flights-section .sched-bubble.is-live .sb-dots i { width: auto; height: auto; background: none; box-shadow: none; font-size: 1rem; color: var(--live); animation: sl-drift 2.4s ease-in-out infinite; }

/* Status pill: green, blinking dot */
#scheduled-flights-section .sched-bubble.is-live .sb-status.is-next { color: #16a34a; }
#scheduled-flights-section .sched-bubble.is-live .sb-status .sb-status-dot { background: #16a34a; animation: sl-blink 1.4s ease-in-out infinite; }

.sb-live { margin-top: .8rem; padding: .75rem .85rem .6rem; border-radius: 10px; background: color-mix(in srgb, var(--live) 6%, #f8fafc); border: 1px solid color-mix(in srgb, var(--live) 18%, #e8edf3); font-family: 'Poppins', sans-serif; }
.sl-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .5rem; }
.sl-stats em { font-style: normal; font-size: .7rem; font-weight: 500; color: #94a3b8; }
.sl-stats small { display: block; font-size: .6rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #94a3b8; }
.sl-stats b { font-size: .92rem; font-weight: 600; color: #1e293b; white-space: nowrap; }
.sl-stats b i { font-size: .72rem; color: var(--live); }
.sl-foot { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-top: .6rem; padding-top: .5rem; border-top: 1px dashed color-mix(in srgb, var(--live) 18%, #e2e8f0); font-size: .68rem; color: #94a3b8; }
.sl-foot a { color: var(--live); font-weight: 600; text-decoration: none; }
.sl-dot { display: inline-block; width: 6px; height: 6px; margin-right: .4rem; border-radius: 50%; background: #16a34a; vertical-align: middle; animation: sl-blink 1.4s ease-in-out infinite; }

/* Route map: live aircraft position, rotated to heading */
.sl-map-plane i { display: grid; place-items: center; width: 26px; height: 26px; font-size: 20px; color: #fff; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .7)); transition: transform .6s ease; }

@keyframes sl-blink { 50% { opacity: .35; } }
@keyframes sl-drift { 50% { transform: translateX(3px); } }
@keyframes sl-march { to { background-position: 8px 0; } }
@keyframes sl-march-hop { from { background-position: 0 0, 0 0; } to { background-position: 0 0, 11px 0; } }
@media (prefers-reduced-motion: reduce) {
    #scheduled-flights-section .sched-bubble.is-live .sb-dots i,
    #scheduled-flights-section .sched-bubble.is-live .sb-dots::after,
    #scheduled-flights-section .sched-bubble.is-live .sb-status .sb-status-dot,
    #sf-chain .sf-hop.live::before, #sf-chain .sf-hop.live::after, #sf-chain .sf-hop.live .sf-lbl i,
    .sl-dot { animation: none; }
}

body.dark-mode .sb-live { background: color-mix(in srgb, var(--live) 10%, #242426); border-color: color-mix(in srgb, var(--live) 25%, #3a3a3c); }
body.dark-mode .sl-stats b { color: #f1f5f9; }
body.dark-mode .sl-foot { border-color: #3a3a3c; }

@media (max-width: 640px) {
    .sl-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: .6rem; }
}