/* Rules for classes the markup uses but the deployed Tailwind build does not contain.
 *
 * The bundle in public/build/assets is compiled at build time and this host cannot rebuild it,
 * so a class added to a Blade file after the last build has no rule and silently renders as
 * nothing. `bar-dark` is used as a dark header bar in four components and has been invisible
 * since at least the 21 September build, which is why the quick view modal, the results ticker
 * and the match and league page headers all render as white boxes.
 *
 * Loaded on every page, after the bundle, so these rules win. Keep it small: the right home for
 * anything in here is the Tailwind source, next time the bundle is rebuilt. Added 27 Oct 2026.
 */

.ap-rail-sticky,
.ap-rail-sticky-lg {
    min-width: 0;
}

/* Sticky rails. align-self:start matters more than it looks: a grid item stretches to the
   full row height by default, which leaves sticky nothing to move within and silently does
   nothing. No height cap and no inner scrollbar (owner, 3 Nov): every card shows in full.
   The trade-off is that a rail taller than the viewport pins with its lower cards below
   the fold, so keep these rails shorter than a screen where that matters. */
@media (min-width: 1024px) {
    .ap-rail-sticky-lg {
        position: sticky;
        top: 5rem;
        align-self: start;
    }
}

@media (min-width: 1280px) {
    .ap-rail-sticky {
        position: sticky;
        top: 5rem;
        align-self: start;
    }
}

.bar-dark {
    background: #0f172a;
    color: #ffffff;
}

.bar-dark a,
.bar-dark .text-ink-muted,
.bar-dark .text-ink-secondary {
    color: #e2e8f0;
}