/* EventOps' own rules, on top of the theme build (app.min.css). Small on purpose. */

/* No overflow rule on html, on purpose. The theme's body { overflow-x: hidden } already reaches the
   viewport, because html itself stays visible. Give html a value of its own (hidden or clip) and
   body's stops propagating: body becomes its own scroll container and the sticky top bar scrolls
   away with the page. Measured both ways, 2026-09-18. */

/* A segmented tab bar (.btn-group of links) never shrinks below the width of its labels, so on a
   phone the last tab falls off the edge. Let the strip scroll sideways instead, the way tables do. */
.tab-strip {
    display: flex;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.tab-strip::-webkit-scrollbar {
    display: none;
}
.tab-strip > .btn {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* Page numbers wrap rather than run off the screen. */
.pagination {
    flex-wrap: wrap;
    row-gap: .5rem;
}