/* Offline indicator — slim bar shown under the navbar when the service worker
   served a cached page but its background refresh failed (we are offline).
   Toggled by static/js/offline-indicator.js via the .is-visible class. */
.offline-indicator {
    /* position:relative so z-index applies (a plain in-flow block ignores it) and the
       bar paints in front of the fixed notification bell (navbar.css, z-index 1020)
       instead of behind it. Stays in flow, so it still pushes page content down. */
    position: relative;
    z-index: 1030;
    overflow: hidden;
    max-height: 0;
    background: #b45309;            /* amber-700: "stale but usable", not error red */
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    text-align: center;
    line-height: 1.2;
    padding: 0 12px;
    transition: max-height 0.25s ease, padding 0.25s ease;
}

.offline-indicator.is-visible {
    max-height: 44px;
    padding: 8px 12px;
}

.offline-indicator .bi {
    margin-right: 6px;
}