/* public/css/leaderboard.css — views/leaderboard.php
   Reuses .home-section / .lb-table* from home.css; this file only carries
   the page-specific chrome (season pills, filter bar, sortable headers,
   empty state). */

.lb-page { padding-top: 1.5rem; }

/* ── Season pills ─────────────────────────────────────────────────────── */
.lb-season-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 1rem;
}

.lb-season-pill {
    padding: 6px 16px;
    border-radius: 20px;
    background: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-muted);
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.lb-season-pill:hover { color: var(--text-primary); }
.lb-season-pill.active {
    background: rgba(0, 217, 255, 0.12);
    border-color: rgba(0, 217, 255, 0.35);
    color: var(--accent-primary);
}

/* ── Filter bar ───────────────────────────────────────────────────────── */
.lb-filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-bottom: 1.25rem;
}
.lb-filter-bar .filter-input-wrap { flex: 1 1 220px; }

.lb-filter-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.lb-filter-label .filter-select { min-width: 0; }

/* ── Sortable column headers ──────────────────────────────────────────── */
.lb-th-sortable {
    cursor: pointer;
    user-select: none;
    position: relative;
}
.lb-th-sortable:hover { color: var(--text-primary) !important; }
.lb-th-sortable::after {
    content: '↕';
    margin-left: 5px;
    opacity: 0.35;
    font-size: 0.7rem;
}
.lb-th-sortable.lb-th-desc::after { content: '↓'; opacity: 0.9; }
.lb-th-sortable.lb-th-asc::after  { content: '↑'; opacity: 0.9; }

/* ── Empty state ──────────────────────────────────────────────────────── */
.lb-empty {
    text-align: center;
    padding: 3.5rem 1rem;
    color: var(--text-muted);
}
.lb-empty i {
    font-size: 2.4rem;
    opacity: 0.3;
    margin-bottom: 0.75rem;
    display: block;
}
.lb-empty h3 { color: var(--text-primary); margin: 0 0 6px; }
.lb-empty p { margin: 0; font-size: 0.88rem; }

@media (max-width: 640px) {
    .lb-filter-bar { flex-direction: column; align-items: stretch; }
    .lb-filter-label { justify-content: space-between; }
}