/*
 * This app's own Tailwind build (resources/css/app.css) is never compiled into these Filament
 * panels -- there's no @vite() reference anywhere in AdminPanelProvider/BarPanelProvider, and
 * public/build doesn't exist. Utility classes written directly in a panel Blade view only
 * "work" by chance, if Filament's own pre-built CSS happens to already define that exact
 * class (most common ones do, since Filament's own components use them constantly -- but an
 * uncommon one like `py-2.5` or `text-end` silently does nothing). Hand-written CSS
 * registered via FilamentAsset, as here, sidesteps that entirely.
 */
.gambit-standings-table {
    width: 100%;
    text-align: start;
    border-collapse: collapse;
}

.gambit-standings-cell {
    padding: 0.625rem 1rem;
    text-align: start;
}

.gambit-standings-cell-numeric {
    text-align: end;
}

/*
 * The combined weekly/season table: Rank and Player stay put while the week columns scroll
 * sideways on a narrow screen. Sticky cells need a background of their own, the section's
 * (white, or Filament's gray-900 in dark mode), or the scrolled columns show through them.
 */
.gambit-standings-scroll {
    overflow-x: auto;
}

.gambit-standings-sticky {
    position: sticky;
    z-index: 1;
    background: #fff;
}

.dark .gambit-standings-sticky {
    background: var(--gray-900);
}

.gambit-standings-rank {
    left: 0;
    width: 4.5rem;
    min-width: 4.5rem;
}

.gambit-standings-player {
    left: 4.5rem;
    text-align: start;
}

/* A week's winner: a star (read out as "week winner") and a tinted, bold cell -- never colour
   alone. Amber-100 behind near-black text, amber-900 behind white in dark mode, both well past
   4.5:1. */
.gambit-standings-winner {
    background: rgb(254 243 199);
    color: rgb(17 24 39);
    font-weight: 700;
}

.dark .gambit-standings-winner {
    background: rgb(120 53 15);
    color: #fff;
}

.gambit-standings-legend {
    display: inline-block;
    padding: 0 0.375rem;
    border-radius: 0.25rem;
}

.gambit-standings-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}