/* ==========================================================================
   WEEKLY LINEUP PAGE - CUSTOM STYLES
   ==========================================================================
   Specific styles for the weekly lineup table extending the base table styles
   Now matches the dashboard layout and styling
   ========================================================================== */

/* ===== PAGE SPECIFIC - WITH HERO BANNER ===== */
body.page-weekly-lineup {
    --weekly-accent-primary: var(--emerald-500);
    --weekly-accent-secondary: var(--gold-400);
    --weekly-surface: rgba(8, 16, 28, 0.75);
    --weekly-border: rgba(80, 100, 130, 0.25);
    --weekly-text: #e6f2f6;
    --dashboard-topline-height: 91px; /* 20% bump from 76px for logo/text */

    /* Zebra Stripe Overrides - High Contrast with More Transparency */
    --zebra-odd: rgba(4, 12, 24, 0.15);
    --zebra-even: rgba(30, 55, 85, 0.08);

    background-color: rgba(3, 11, 22, 0.18);
    background-image: url('../../JB_Bearish_Market_FULL_page.png');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
    isolation: isolate;
}

/* ===== OVERLAY EFFECTS - SOFT GRADIENT OVER HERO ===== */
body.page-weekly-lineup::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background: linear-gradient(180deg,
        rgba(4, 10, 20, 0.12) 0%,
        rgba(4, 10, 20, 0.10) 15%,
        rgba(4, 10, 20, 0.08) 30%,
        rgba(4, 10, 20, 0.14) 50%,
        rgba(4, 10, 20, 0.18) 75%,
        rgba(4, 10, 20, 0.25) 100%);
    pointer-events: none;
    opacity: 0.2; /* even lighter overlay to further fade hero */
}

/* Additional wash to fade the bear image */
body.page-weekly-lineup::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    background: rgba(3, 11, 22, 0.75);
    mix-blend-mode: multiply;
    pointer-events: none;
}

/* ==========================================================================
   NAV & HEADER (weekly lineup - floating/transparent)
   ========================================================================== */
body.page-weekly-lineup .brand-nav {
    background: transparent;
    border-bottom: none;
    box-shadow: none;
    padding-left: 0.5in;
    padding-right: 0.5in;
}

body.page-weekly-lineup .nav-link {
    color: rgba(222, 235, 240, 0.86);
}

body.page-weekly-lineup .nav-link:hover,
body.page-weekly-lineup .nav-link:focus-visible {
    color: #fefefe;
    text-shadow: 0 2px 10px rgba(0, 214, 137, 0.35);
}

body.page-weekly-lineup .nav-link.active {
    color: #fdfdfd;
    border-bottom: 2px solid var(--weekly-accent-primary);
}

/* ==========================================================================
   LAYOUT SHELL (weekly lineup - matching dashboard)
   ========================================================================== */
body.page-weekly-lineup .main-container {
    padding: 0 0 20px;
    margin-top: 12px; /* tighter gap below nav */
}

body.page-weekly-lineup .main-dashboard-layout {
    gap: 8px;
}

/* ===== DASHBOARD TOPLINE - FLOATING/TRANSPARENT ===== */
body.page-weekly-lineup .dashboard-topline {
    background: transparent;
    border: none;
    box-shadow: none;
    border-radius: 0;
    padding: 6px 0.5in 8px; /* tighter vertical spacing above the table */
}

/* ===== BRAND HEADER STYLING ===== */
body.page-weekly-lineup .brand-header-inline,
body.page-weekly-lineup .brand-header {
    background: transparent;
    border: none;
    box-shadow: none;
    border-radius: 0;
}

body.page-weekly-lineup .brand-line-1,
body.page-weekly-lineup .brand-line-2 {
    color: var(--weekly-text);
}

/* ==========================================================================
   KPI TILES (weekly lineup - matching dashboard)
   ========================================================================== */
body.page-weekly-lineup .kpi-tiles {
    gap: 10px;
    padding: 0 4px;
}

body.page-weekly-lineup .kpi-tile {
    background: linear-gradient(160deg, rgba(10, 18, 32, 0.82) 0%, rgba(8, 16, 28, 0.78) 100%);
    border: 1px solid rgba(80, 100, 130, 0.25);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
    border-radius: 8px;
}

body.page-weekly-lineup .kpi-tile:hover {
    border-color: rgba(100, 120, 150, 0.35);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45);
    transform: translateY(-1px);
}

body.page-weekly-lineup .kpi-tile-layer.active {
    animation: weeklyTileFade 280ms ease;
}

body.page-weekly-lineup .kpi-label {
    color: rgba(214, 232, 236, 0.8);
    letter-spacing: 0.08em;
}

body.page-weekly-lineup .kpi-value {
    font-size: 1.32rem;
    letter-spacing: 0.01em;
}

body.page-weekly-lineup .kpi-subtext {
    color: var(--weekly-accent-secondary);
    opacity: 0.95;
}

@keyframes weeklyTileFade {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== INTRO SECTION (legacy, hidden) ===== */
.page-weekly-lineup .weekly-lineup-intro {
    display: none;
}

/* ===== SEGMENT KEY ===== */
.page-weekly-lineup .segment-key {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.page-weekly-lineup .segment-key .segment-chip {
    padding: 0.25rem 0.75rem;
    border-radius: 4px;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ==========================================================================
   TABLE CONTAINER (weekly lineup - semi-transparent)
   ========================================================================== */
body.page-weekly-lineup .table-container,
.page-weekly-lineup .weekly-lineup-table-wrapper {
    margin-top: 0;
    margin-left: 0.5in;
    margin-right: 0.5in;
    width: calc(100% - 1in);
    box-sizing: border-box;
    /* Don't create a stacking context that traps dropdowns */
    position: relative;
    z-index: 1;
    overflow: visible !important; /* Allow dropdowns to overflow */
    background: rgba(5, 12, 22, 0.40);
    border: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    padding: 0;
    position: relative;
    overflow: visible; /* allow page scroll so sticky header anchors to viewport */
    contain: none !important; /* CRITICAL: don't trap dropdown cards in a containment context */
}

.page-weekly-lineup .weekly-lineup-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    /* CRITICAL: header filter dropdown cards live inside table markup; don't clip them */
    overflow: visible !important;
}

/* Ensure nothing in the header row clips dropdown cards */
.page-weekly-lineup .weekly-lineup-table thead,
.page-weekly-lineup .weekly-lineup-table thead tr,
.page-weekly-lineup .weekly-lineup-table thead th {
    overflow: visible !important;
}

/* Prevent table cell overflow - add ellipsis for long content */
.weekly-lineup-table td {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    word-wrap: break-word !important;
    white-space: nowrap !important;
    max-width: 0 !important; /* Required for ellipsis with table-layout: fixed */
    padding: 0.5rem 0.75rem !important;
}

/* Allow specific cells to wrap when needed (Matchup, Pick) */
.weekly-lineup-table td:nth-child(3),
.weekly-lineup-table td[data-label="Matchup"] {
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    word-wrap: break-word !important;
    max-width: 0 !important;
}

.weekly-lineup-table td:nth-child(5),
.weekly-lineup-table td[data-label="Pick"] {
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    word-wrap: break-word !important;
    max-width: 0 !important;
}

/* Column widths for weekly lineup - 10 columns */
.weekly-lineup-table thead th:nth-child(1) { width: 8%; }   /* Date & Time */
.weekly-lineup-table thead th:nth-child(2) { width: 5%; }   /* League */
.weekly-lineup-table thead th:nth-child(3) { width: 18%; }  /* Matchup */
.weekly-lineup-table thead th:nth-child(4) { width: 7%; }   /* Segment */
.weekly-lineup-table thead th:nth-child(5) { width: 15%; }  /* Pick */
.weekly-lineup-table thead th:nth-child(6) { width: 10%; }  /* Model */
.weekly-lineup-table thead th:nth-child(7) { width: 10%; }  /* Market */
.weekly-lineup-table thead th:nth-child(8) { width: 6%; }   /* Edge */
.weekly-lineup-table thead th:nth-child(9) { width: 8%; }   /* Fire */
.weekly-lineup-table thead th:nth-child(10) { width: 5%; }  /* Tracker */

/* Tracker column header - prevent overflow */
.weekly-lineup-table thead th:last-child .header-main-text {
    font-size: 0.75rem;
    white-space: nowrap;
}

/* ===== TABLE HEADERS - TRANSPARENT GREEN GRADIENT ===== */
body.page-weekly-lineup .picks-table thead th,
.weekly-lineup-table thead th {
    background: linear-gradient(180deg,
        rgba(0, 214, 137, 0.15) 0%,
        rgba(0, 214, 137, 0.08) 45%,
        rgba(8, 12, 22, 0.50) 100%);
    background-color: rgba(8, 12, 22, 0.50);
    border-bottom: 1px solid rgba(0, 214, 137, 0.30);
    border-right: 1px solid rgba(0, 214, 137, 0.12); /* faint separators between headers */
    padding: 0.75rem 0.75rem;
    text-align: center;
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #f4fbff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    line-height: 1.2;
    position: relative;
}

.weekly-lineup-table thead th:first-child {
    border-top-left-radius: 8px;
}

.weekly-lineup-table thead th:last-child {
    border-top-right-radius: 8px;
    border-right: none;
}

/* Sticky header: lock th to top with its own stacking context */
.page-weekly-lineup .weekly-lineup-table thead,
.page-weekly-lineup .picks-table thead {
    position: sticky !important;
    top: 0;
    z-index: 110;
    background: linear-gradient(180deg,
        rgba(0, 214, 137, 0.45) 0%,
        rgba(0, 214, 137, 0.30) 45%,
        rgba(8, 12, 22, 0.95) 100%);
    background-color: rgba(8, 12, 22, 0.98);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.page-weekly-lineup .weekly-lineup-table thead th,
.page-weekly-lineup .picks-table thead th {
    position: relative; /* Contain absolutely positioned filter button */
    text-align: center;
    padding: 0.75rem 0.5rem !important; /* Symmetric padding - text is truly centered */
    background-clip: padding-box;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}

/* Center header labels without filter buttons offsetting alignment */
.page-weekly-lineup .weekly-lineup-table .th-header-shell {
    position: static; /* Let filter button position relative to th, not shell */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 0; /* Remove gap so filter button doesn't affect centering */
}

.page-weekly-lineup .weekly-lineup-table .th-sort-btn {
    /* Sort button centered - no extra padding needed since filter is absolutely positioned to th */
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2px 4px !important;
}

/* Filter button - absolutely positioned relative to th cell (not shell) */
body.page-weekly-lineup .weekly-lineup-table thead th .th-filter-btn,
.page-weekly-lineup .weekly-lineup-table thead th .th-filter-btn,
body.page-weekly-lineup .picks-table.weekly-lineup-table thead th .th-filter-btn,
.page-weekly-lineup .picks-table.weekly-lineup-table thead th .th-filter-btn {
    position: absolute !important;
    right: 2px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 102 !important;
    pointer-events: auto !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* Sticky header fix: ensure tbody starts below header when sticky */
.page-weekly-lineup .picks-table tbody {
    position: relative;
    z-index: 10;
    background: rgba(8, 12, 22, 0.75);
}

/* ===== TABLE BODY - 50% TRANSPARENT ZEBRA STRIPES ===== */
body.page-weekly-lineup .picks-table tbody tr,
.weekly-lineup-table tbody tr {
    border-bottom: 1px solid rgba(80, 100, 130, 0.08);
    transition: background-color 0.2s ease;
    background: transparent;
}

body.page-weekly-lineup .picks-table tbody tr:nth-child(odd),
.weekly-lineup-table tbody tr:nth-child(odd) {
    background: rgba(4, 12, 24, 0.32);
}

body.page-weekly-lineup .picks-table tbody tr:nth-child(even),
.weekly-lineup-table tbody tr:nth-child(even) {
    background: rgba(30, 55, 85, 0.20);
}

body.page-weekly-lineup .picks-table tbody tr:hover,
.weekly-lineup-table tbody tr:hover {
    background: rgba(40, 60, 90, 0.35);
}

.weekly-lineup-table tbody td {
    padding: 0.4rem 0.4rem;
    color: rgba(232, 240, 242, 0.95);
    vertical-align: middle;
    font-family: var(--font-body, 'Inter', sans-serif);
    font-weight: 500;
    font-size: 0.825rem;
    line-height: 1.2;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

/* Center the Recommended Pick column (3rd column) */
.weekly-lineup-table tbody td:nth-child(3) {
    text-align: center;
}

/* ===== TIME CELL ===== */
.weekly-lineup-table .cell-time {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 500;
    font-size: 0.8rem;
    color: var(--neutral-300);
    letter-spacing: 0.02em;
}

/* ===== MATCHUP CELL - INLINE COMPACT ===== */
.weekly-lineup-table .matchup-inline {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    white-space: nowrap;
}

.weekly-lineup-table .matchup-inline .team-logo {
    width: 18px;
    height: 18px;
    object-fit: contain;
    border-radius: 2px;
    flex-shrink: 0;
}

.weekly-lineup-table .matchup-inline .team-abbr {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 600;
    font-size: 0.825rem;
    color: var(--neutral-100);
    letter-spacing: 0.02em;
}

.weekly-lineup-table .matchup-inline .vs-at {
    color: var(--neutral-500);
    font-size: 0.65rem;
    font-weight: 400;
    margin: 0 0.1rem;
}

/* ===== PICK CELL - INLINE COMPACT ===== */
.weekly-lineup-table .pick-inline {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
}

.weekly-lineup-table .pick-inline .pick-team-logo {
    width: 16px;
    height: 16px;
    object-fit: contain;
    border-radius: 2px;
    flex-shrink: 0;
}

.weekly-lineup-table .pick-inline .pick-team {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.825rem;
    color: var(--emerald-400);
    letter-spacing: 0.02em;
}

.weekly-lineup-table .pick-inline .pick-direction {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.825rem;
    color: var(--emerald-400);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.weekly-lineup-table .pick-inline .pick-line {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 600;
    font-size: 0.825rem;
    color: var(--neutral-100);
}

.weekly-lineup-table .pick-inline .pick-odds {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--neutral-400);
}

/* ===== PICK CELL - UNIFIED STYLING ===== */
/* Team name in pick cell */
.weekly-lineup-table .pick-team-name {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--emerald-400);
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

/* Line value (spread number or ML) */
.weekly-lineup-table .pick-line-value {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--neutral-100);
    letter-spacing: 0.01em;
}

/* Odds display - matches team-record color */
.weekly-lineup-table .pick-odds {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--neutral-400);
    letter-spacing: 0.01em;
}

/* Legacy - keep for backwards compat */
.weekly-lineup-table .pick-team-abbr {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--emerald-400);
    letter-spacing: 0.02em;
}

.weekly-lineup-table .pick-odds-line {
    font-family: var(--font-display, 'Oswald', sans-serif) !important;
    font-weight: 500;
    font-size: 0.8rem;
    color: var(--neutral-400);
    letter-spacing: 0.01em;
}

/* ===== MODEL CELL ===== */
.weekly-lineup-table .cell-model {
    font-family: var(--font-display, 'Oswald', sans-serif) !important;
    font-weight: 500;
    font-size: 0.8rem;
    color: var(--neutral-200);
}

/* ===== MARKET CELL ===== */
.weekly-lineup-table .cell-market .market-odds {
    font-family: var(--font-display, 'Oswald', sans-serif) !important;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--gold-400);
    padding: 0.15rem 0.35rem;
    background: rgba(255, 193, 7, 0.08);
    border: 1px solid rgba(255, 193, 7, 0.2);
    border-radius: 4px;
    display: inline-block;
}

/* ===== EDGE + FIRE CELL ===== */
.weekly-lineup-table .edge-fire-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    white-space: nowrap;
}

.weekly-lineup-table .edge-value {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.85rem;
    padding: 0.15rem 0.35rem;
    border-radius: 4px;
    display: inline-block;
    min-width: 42px;
    text-align: center;
}

.weekly-lineup-table .edge-value.edge-hot {
    color: #ff4444;
    background: rgba(255, 68, 68, 0.15);
    border: 1px solid rgba(255, 68, 68, 0.3);
    text-shadow: 0 0 8px rgba(255, 68, 68, 0.5);
}

.weekly-lineup-table .edge-value.edge-good {
    color: var(--emerald-400);
    background: rgba(0, 214, 137, 0.12);
    border: 1px solid rgba(0, 214, 137, 0.3);
}

.weekly-lineup-table .edge-value.edge-ok {
    color: var(--gold-400);
    background: rgba(255, 193, 7, 0.12);
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.weekly-lineup-table .edge-value.edge-low {
    color: var(--neutral-400);
    background: rgba(100, 116, 139, 0.12);
    border: 1px solid rgba(100, 116, 139, 0.3);
}

/* Fire indicators - integrated compact style */
.weekly-lineup-table .fire-max {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.6rem;
    color: #fff;
    background: linear-gradient(135deg, #ff4444 0%, #ff6600 100%);
    padding: 0.15rem 0.3rem;
    border-radius: 3px;
    letter-spacing: 0.05em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    animation: fireGlow 1.5s ease-in-out infinite alternate;
}

@keyframes fireGlow {
    from { box-shadow: 0 0 4px rgba(255, 68, 68, 0.4); }
    to { box-shadow: 0 0 10px rgba(255, 102, 0, 0.6); }
}

/* Fire MAX badge - red on fire type effect */
.weekly-lineup-table .fire-max-badge {
    display: inline-block;
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 700;
    font-size: 0.65rem;
    color: #fff;
    background: linear-gradient(135deg, #ff2222 0%, #ff6600 50%, #ffaa00 100%);
    padding: 0.15rem 0.35rem;
    border-radius: 3px;
    letter-spacing: 0.08em;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    animation: fireBadgeGlow 1s ease-in-out infinite alternate;
    vertical-align: middle;
    margin-left: 0.25rem;
}

@keyframes fireBadgeGlow {
    from {
        box-shadow: 0 0 4px rgba(255, 34, 34, 0.6), 0 0 8px rgba(255, 102, 0, 0.4);
        filter: brightness(1);
    }
    to {
        box-shadow: 0 0 8px rgba(255, 102, 0, 0.8), 0 0 16px rgba(255, 170, 0, 0.5);
        filter: brightness(1.1);
    }
}

.weekly-lineup-table .fire-high {
    color: #ff6600;
    font-size: 0.6rem;
    letter-spacing: -1px;
}

.weekly-lineup-table .fire-med {
    color: var(--gold-400);
    font-size: 0.6rem;
    letter-spacing: -1px;
}

.weekly-lineup-table .fire-low {
    color: var(--neutral-400);
    font-size: 0.6rem;
    letter-spacing: -1px;
}

.weekly-lineup-table .fire-min {
    color: var(--neutral-600);
    font-size: 0.6rem;
}

/* ===== TRACKER BUTTON - COMPACT ===== */
.weekly-lineup-table .tracker-btn {
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 4px;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    background: linear-gradient(135deg, var(--emerald-600) 0%, var(--emerald-500) 100%);
    color: white;
    border: 1px solid var(--emerald-400);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.weekly-lineup-table .tracker-btn:hover {
    background: linear-gradient(135deg, var(--emerald-500) 0%, var(--emerald-400) 100%);
    box-shadow: 0 0 12px var(--emerald-400);
    transform: scale(1.05);
}

.weekly-lineup-table .tracker-btn.added {
    background: transparent;
    color: var(--emerald-400);
    border-color: var(--emerald-400);
}

.weekly-lineup-table .tracker-btn.added::before {
    content: '✓';
}

.weekly-lineup-table .matchup-stack .versus {
    color: var(--neutral-400);
    font-size: 0.875rem;
}

/* ===== DATE/TIME CELLS ===== */
.weekly-lineup-table .cell-date {
    font-weight: 600;
    color: var(--neutral-100);
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.weekly-lineup-table .cell-time {
    font-size: 0.85rem;
    color: var(--neutral-400);
}

/* ===== CONFIDENCE METER ===== */
.page-weekly-lineup .confidence-meter {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.page-weekly-lineup .confidence-meter .confidence-score {
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--neutral-100);
    min-width: 2.5rem;
}

.page-weekly-lineup .confidence-meter .confidence-bars {
    display: flex;
    gap: 2px;
}

.page-weekly-lineup .confidence-meter .bar {
    width: 12px;
    height: 8px;
    background: rgba(0, 214, 137, 0.15);
    border-radius: 2px;
    transition: all 0.3s ease;
}

.page-weekly-lineup .confidence-meter .bar.filled {
    background: linear-gradient(90deg,
        var(--emerald-500) 0%,
        var(--emerald-400) 100%);
    box-shadow: 0 0 4px var(--emerald-500);
}

.page-weekly-lineup .confidence-meter .bar.half {
    background: linear-gradient(90deg,
        var(--emerald-500) 0%,
        var(--emerald-500) 50%,
        rgba(0, 214, 137, 0.15) 50%,
        rgba(0, 214, 137, 0.15) 100%);
}

/* ===== RATIONALE COLUMN ===== */
.weekly-lineup-table td[data-label="Rationale"] {
    font-size: 0.875rem;
    color: var(--neutral-300);
    line-height: 1.4;
}

/* ===== ANIMATIONS ===== */
@keyframes slideIn {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideOut {
    from {
        transform: translateX(0);
        opacity: 1;
    }
    to {
        transform: translateX(100%);
        opacity: 0;
    }
}

/* ===== FILTER DROPDOWNS ===== */
/* NOTE: `.th-header-shell` is already fully defined earlier for weekly lineup headers.
   Keeping a second, generic definition here causes header centering + filter button
   positioning to fight each other. */

/* ==========================================================================
   FILTER DROPDOWNS - Card Style (drops DOWN below header)
   Works both inside page context AND when moved to body
   ========================================================================== */

/* ==========================================================================
   FILTER DROPDOWN CARDS - High Contrast Readable Design
   ========================================================================== */

/* Global dropdown container (legacy) */
.th-filter-dropdown.open:not(.weekly-lineup-filter-dropdown) {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: fixed !important;
    z-index: 2147483647 !important;
    min-width: 200px !important;
    max-width: 260px !important;
    background: #0d1117 !important;
    border: 1px solid rgba(48, 54, 61, 0.8) !important;
    border-radius: 6px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(0, 0, 0, 0.3) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 !important;
    pointer-events: auto !important;
}

/* Dropdown header */
.th-filter-dropdown .filter-header-integrated {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 12px !important;
    background: rgba(22, 27, 34, 0.95) !important;
    border-bottom: 1px solid rgba(48, 54, 61, 0.6) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
}

.th-filter-dropdown .filter-title {
    font-family: var(--font-display, 'Oswald', sans-serif) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #e6edf3 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
}

/* Filter sections */
.th-filter-dropdown .filter-section-compact,
.th-filter-dropdown .date-range-selector {
    padding: 10px 12px !important;
    border-bottom: 1px solid rgba(48, 54, 61, 0.4) !important;
}

.th-filter-dropdown .filter-section-compact:last-child {
    border-bottom: none !important;
    padding-bottom: 12px !important;
}

.th-filter-dropdown .section-label {
    display: block !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #8b949e !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    margin-bottom: 8px !important;
}

/* ==========================================================================
   UNIFIED FILTER OPTION - High contrast buttons
   ========================================================================== */
.th-filter-dropdown .league-filter-chip,
.th-filter-dropdown .segment-chip,
.th-filter-dropdown .segment-pill,
.th-filter-dropdown .edge-filter-chip,
.th-filter-dropdown .fire-filter-chip,
.th-filter-dropdown .bet-type-chip,
.th-filter-dropdown .range-filter-chip,
.th-filter-dropdown .date-range-btn,
.th-filter-dropdown .time-slot,
.th-filter-dropdown .book-chip,
.th-filter-dropdown .league-pill,
.th-filter-dropdown .ticket-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 6px 10px !important;
    background: rgba(33, 38, 45, 0.8) !important;
    border: 1px solid rgba(48, 54, 61, 0.8) !important;
    border-radius: 4px !important;
    color: #c9d1d9 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.12s ease !important;
    white-space: nowrap !important;
}

/* Hover state - clear visual feedback */
.th-filter-dropdown .league-filter-chip:hover,
.th-filter-dropdown .segment-chip:hover,
.th-filter-dropdown .segment-pill:hover,
.th-filter-dropdown .edge-filter-chip:hover,
.th-filter-dropdown .fire-filter-chip:hover,
.th-filter-dropdown .bet-type-chip:hover,
.th-filter-dropdown .range-filter-chip:hover,
.th-filter-dropdown .date-range-btn:hover,
.th-filter-dropdown .time-slot:hover,
.th-filter-dropdown .book-chip:hover,
.th-filter-dropdown .league-pill:hover,
.th-filter-dropdown .ticket-pill:hover {
    background: rgba(48, 54, 61, 0.9) !important;
    border-color: rgba(139, 148, 158, 0.4) !important;
    color: #f0f6fc !important;
}

/* Active state - clear green accent */
.th-filter-dropdown .league-filter-chip.active,
.th-filter-dropdown .segment-chip.active,
.th-filter-dropdown .segment-pill.active,
.th-filter-dropdown .edge-filter-chip.active,
.th-filter-dropdown .fire-filter-chip.active,
.th-filter-dropdown .bet-type-chip.active,
.th-filter-dropdown .range-filter-chip.active,
.th-filter-dropdown .date-range-btn.active,
.th-filter-dropdown .time-slot.active,
.th-filter-dropdown .book-chip.active,
.th-filter-dropdown .league-pill.active,
.th-filter-dropdown .ticket-pill.active {
    background: rgba(46, 160, 67, 0.15) !important;
    border-color: rgba(46, 160, 67, 0.5) !important;
    color: #3fb950 !important;
    font-weight: 600 !important;
}

/* Quick action buttons - clear and clickable */
.th-filter-dropdown .filter-action-btn {
    padding: 4px 8px !important;
    background: rgba(33, 38, 45, 0.6) !important;
    border: 1px solid rgba(48, 54, 61, 0.6) !important;
    border-radius: 4px !important;
    color: #8b949e !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    cursor: pointer !important;
    transition: all 0.1s ease !important;
}

.th-filter-dropdown .filter-action-btn:hover {
    background: rgba(48, 54, 61, 0.8) !important;
    border-color: rgba(139, 148, 158, 0.4) !important;
    color: #c9d1d9 !important;
}

/* All grid/flex containers - readable spacing */
.th-filter-dropdown .league-filter-grid,
.th-filter-dropdown .fire-filter-grid,
.th-filter-dropdown .edge-filter-grid,
.th-filter-dropdown .bet-type-grid,
.th-filter-dropdown .range-filter-grid,
.th-filter-dropdown .segment-pills,
.th-filter-dropdown .time-slots,
.th-filter-dropdown .sportsbook-chips,
.th-filter-dropdown .league-pills,
.th-filter-dropdown .ticket-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.th-filter-dropdown .filter-quick-actions {
    display: flex !important;
    gap: 6px !important;
}

/* Chip logo/icon sizing */
.th-filter-dropdown .chip-logo {
    width: 16px !important;
    height: 16px !important;
    object-fit: contain !important;
    opacity: 0.9 !important;
}

.th-filter-dropdown .chip-indicator {
    font-size: 6px !important;
    color: #3fb950 !important;
}

.th-filter-dropdown .chip-text,
.th-filter-dropdown .bet-label,
.th-filter-dropdown .edge-chip-label,
.th-filter-dropdown .fire-chip-label {
    font-size: 11px !important;
    font-weight: 500 !important;
}

/* Edge tier indicators - clear color coding */
.th-filter-dropdown .edge-tier {
    width: 8px !important;
    height: 8px !important;
    border-radius: 2px !important;
}
.th-filter-dropdown .edge-tier.tier-hot { background: #f85149 !important; }
.th-filter-dropdown .edge-tier.tier-good { background: #3fb950 !important; }
.th-filter-dropdown .edge-tier.tier-ok { background: #d29922 !important; }
.th-filter-dropdown .edge-tier.tier-low { background: #6e7681 !important; }

/* Fire bars - signal strength style */
.th-filter-dropdown .fire-bars {
    display: flex !important;
    align-items: flex-end !important;
    gap: 2px !important;
    height: 12px !important;
}
.th-filter-dropdown .fire-bars i {
    display: block !important;
    width: 3px !important;
    background: #484f58 !important;
    border-radius: 1px !important;
}
.th-filter-dropdown .fire-bars i:nth-child(1) { height: 4px !important; }
.th-filter-dropdown .fire-bars i:nth-child(2) { height: 6px !important; }
.th-filter-dropdown .fire-bars i:nth-child(3) { height: 8px !important; }
.th-filter-dropdown .fire-bars i:nth-child(4) { height: 10px !important; }
.th-filter-dropdown .fire-bars i:nth-child(5) { height: 12px !important; }

/* Active fire - orange glow */
.th-filter-dropdown .fire-filter-chip.active .fire-bars i {
    background: #d29922 !important;
}
.th-filter-dropdown .fire-filter-chip.fire-max.active .fire-bars i {
    background: #f85149 !important;
}

/* Book chip checkbox hidden */
.th-filter-dropdown .book-chip input[type="checkbox"] {
    display: none !important;
}

/* Filter dropdowns - High contrast compact style (legacy fallback) */
body.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown),
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) {
    position: fixed !important;
    min-width: 180px !important;
    max-width: 240px !important;
    max-height: 320px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;

    /* High contrast dark background */
    background: rgba(8, 12, 20, 0.98) !important;

    /* Green accent border for visibility */
    border: 1px solid rgba(0, 214, 137, 0.35) !important;
    border-radius: 8px !important;
    padding: 0 !important;

    /* Clean shadow */
    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.65),
        0 0 0 1px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;

    z-index: 2147483647 !important;
    pointer-events: auto !important;

    display: none;
    flex-direction: column !important;

    isolation: isolate !important;
}

/* Hidden state */
body.page-weekly-lineup .th-filter-dropdown[hidden],
.page-weekly-lineup .th-filter-dropdown[hidden] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Open state with animation (legacy) */
body.page-weekly-lineup .th-filter-dropdown.open:not(.weekly-lineup-filter-dropdown),
.page-weekly-lineup .th-filter-dropdown.open:not(.weekly-lineup-filter-dropdown) {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    animation: filterCardDrop 120ms ease-out !important;
    pointer-events: auto !important;
    z-index: 2147483647 !important;
}

@keyframes filterCardDrop {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Dropdown header bar */
body.page-weekly-lineup .filter-header-integrated,
.page-weekly-lineup .filter-header-integrated {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 1rem 1.25rem !important;
    background: linear-gradient(
        180deg,
        rgba(0, 214, 137, 0.08) 0%,
        transparent 100%
    ) !important;
    border-bottom: 1px solid rgba(0, 214, 137, 0.15) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
}

body.page-weekly-lineup .filter-title,
.page-weekly-lineup .filter-title {
    font-family: var(--font-display, 'Oswald', sans-serif) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: var(--emerald-400) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
}

/* Quick action buttons in dropdown header */
.page-weekly-lineup .filter-quick-actions {
    display: flex;
    gap: 0.5rem;
}

.page-weekly-lineup .filter-action-btn {
    padding: 0.35rem 0.65rem;
    background: rgba(0, 214, 137, 0.08);
    border: 1px solid rgba(0, 214, 137, 0.25);
    border-radius: 4px;
    color: var(--neutral-200);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.15s ease;
}

.page-weekly-lineup .filter-action-btn:hover {
    background: rgba(0, 214, 137, 0.18);
    border-color: var(--emerald-400);
    color: var(--emerald-300);
    transform: translateY(-1px);
}

/* Filter content sections */
.page-weekly-lineup .filter-section-compact {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(80, 100, 130, 0.12);
}

.page-weekly-lineup .filter-section-compact:last-child {
    border-bottom: none;
}

.page-weekly-lineup .section-label {
    display: block;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--neutral-400);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.75rem;
}

/* League filter chips - grid of logo buttons */
.page-weekly-lineup .league-filter-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.page-weekly-lineup .league-filter-chip {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    padding: 0.4rem 0.6rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.page-weekly-lineup .league-filter-chip:hover {
    background: rgba(180, 160, 120, 0.08);
    border-color: rgba(180, 160, 120, 0.25);
}

.page-weekly-lineup .league-filter-chip.active {
    background: rgba(180, 160, 120, 0.12);
    border-color: rgba(200, 180, 140, 0.4);
}

.page-weekly-lineup .league-filter-chip .chip-logo {
    width: 16px;
    height: 16px;
    object-fit: contain;
    opacity: 0.85;
}

.page-weekly-lineup .league-filter-chip.active .chip-logo {
    opacity: 1;
}

/* Chip indicator dot for "All" option */
.page-weekly-lineup .league-filter-chip .chip-indicator {
    font-size: 0.5rem;
    color: rgba(180, 160, 120, 0.6);
}

.page-weekly-lineup .league-filter-chip.active .chip-indicator {
    color: rgba(220, 200, 160, 1);
}

.page-weekly-lineup .league-filter-chip .chip-text {
    font-size: 0.6rem;
    font-weight: 500;
    color: rgba(200, 210, 220, 0.8);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.page-weekly-lineup .league-filter-chip.active .chip-text {
    color: rgba(220, 200, 160, 1);
}

/* Segment/bet type pills - compact premium style */
.page-weekly-lineup .segment-pills,
.page-weekly-lineup .bet-type-chips,
.page-weekly-lineup .bet-type-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.page-weekly-lineup .segment-pill,
.page-weekly-lineup .bet-type-chip {
    padding: 0.3rem 0.55rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 3px;
    font-size: 0.6rem;
    font-weight: 500;
    color: rgba(200, 210, 220, 0.8);
    cursor: pointer;
    transition: all 0.12s ease;
    white-space: nowrap;
}

.page-weekly-lineup .segment-pill:hover,
.page-weekly-lineup .bet-type-chip:hover {
    background: rgba(180, 160, 120, 0.08);
    border-color: rgba(180, 160, 120, 0.25);
}

.page-weekly-lineup .segment-pill.active,
.page-weekly-lineup .bet-type-chip.active {
    background: rgba(180, 160, 120, 0.12);
    border-color: rgba(200, 180, 140, 0.4);
    color: rgba(220, 200, 160, 1);
}

/* Date range buttons */
.page-weekly-lineup .date-range-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

/* Date range buttons - premium compact */
.page-weekly-lineup .date-range-btn {
    padding: 0.3rem 0.55rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 4px;
    font-size: 0.6rem;
    font-weight: 500;
    color: rgba(200, 210, 220, 0.8);
    cursor: pointer;
    transition: all 0.12s ease;
}

.page-weekly-lineup .date-range-btn:hover {
    background: rgba(180, 160, 120, 0.08);
    border-color: rgba(180, 160, 120, 0.25);
}

.page-weekly-lineup .date-range-btn.active {
    background: rgba(180, 160, 120, 0.12);
    border-color: rgba(200, 180, 140, 0.4);
    color: rgba(220, 200, 160, 1);
}

/* Time slots grid - compact */
.page-weekly-lineup .time-slots {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.page-weekly-lineup .time-slot {
    padding: 0.25rem 0.5rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 3px;
    font-size: 0.55rem;
    font-weight: 500;
    color: rgba(180, 190, 200, 0.75);
    cursor: pointer;
    transition: all 0.12s ease;
}

.page-weekly-lineup .time-slot:hover {
    background: rgba(180, 160, 120, 0.06);
    border-color: rgba(180, 160, 120, 0.2);
}

.page-weekly-lineup .time-slot.active {
    background: rgba(180, 160, 120, 0.1);
    border-color: rgba(200, 180, 140, 0.35);
    color: rgba(220, 200, 160, 0.95);
}

/* Edge/Fire filter chips */
.page-weekly-lineup .edge-filter-chips,
.page-weekly-lineup .fire-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.page-weekly-lineup .edge-filter-chip,
.page-weekly-lineup .fire-filter-chip {
    padding: 0.5rem 0.75rem;
    background: rgba(30, 45, 70, 0.35);
    border: 1px solid rgba(80, 100, 130, 0.25);
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--neutral-200);
    cursor: pointer;
    transition: all 0.15s ease;
}

.page-weekly-lineup .edge-filter-chip:hover,
.page-weekly-lineup .fire-filter-chip:hover {
    background: rgba(0, 214, 137, 0.1);
    border-color: rgba(0, 214, 137, 0.4);
}

.page-weekly-lineup .edge-filter-chip.active,
.page-weekly-lineup .fire-filter-chip.active {
    background: rgba(0, 214, 137, 0.2);
    border-color: var(--emerald-400);
    color: var(--emerald-300);
}

/* Sportsbook chips */
.page-weekly-lineup .sportsbook-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.page-weekly-lineup .book-chip {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.65rem;
    background: rgba(30, 45, 70, 0.35);
    border: 1px solid rgba(80, 100, 130, 0.25);
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--neutral-300);
    cursor: pointer;
    transition: all 0.15s ease;
}

.page-weekly-lineup .book-chip input[type="checkbox"] {
    display: none;
}

.page-weekly-lineup .book-chip:hover {
    background: rgba(0, 214, 137, 0.1);
    border-color: rgba(0, 214, 137, 0.4);
}

.page-weekly-lineup .book-chip.active {
    background: rgba(0, 214, 137, 0.15);
    border-color: var(--emerald-400);
    color: var(--emerald-300);
}

/* Team search box */
.page-weekly-lineup .teams-search-box {
    margin-bottom: 0.75rem;
}

.page-weekly-lineup .team-search {
    width: 100%;
    padding: 0.6rem 0.85rem;
    background: rgba(10, 20, 35, 0.6);
    border: 1px solid rgba(80, 100, 130, 0.3);
    border-radius: 6px;
    color: var(--neutral-100);
    font-size: 0.85rem;
    transition: all 0.2s ease;
}

.page-weekly-lineup .team-search:focus {
    outline: none;
    border-color: var(--emerald-400);
    box-shadow: 0 0 0 3px rgba(0, 214, 137, 0.15);
}

.page-weekly-lineup .team-search::placeholder {
    color: var(--neutral-500);
}

/* Filter section list (checkbox style) */
.page-weekly-lineup .filter-section-list {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    max-height: 180px;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.page-weekly-lineup .checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 0.6rem;
    background: rgba(30, 45, 70, 0.25);
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.page-weekly-lineup .checkbox-row:hover {
    background: rgba(0, 214, 137, 0.08);
}

.page-weekly-lineup .checkbox-row input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--emerald-500);
    cursor: pointer;
}

/* Filter footer with apply button */
.page-weekly-lineup .filter-footer {
    padding: 1rem 1.25rem;
    background: linear-gradient(
        180deg,
        transparent 0%,
        rgba(0, 214, 137, 0.05) 100%
    );
    border-top: 1px solid rgba(0, 214, 137, 0.1);
}

.page-weekly-lineup .filter-apply-btn {
    width: 100%;
    padding: 0.65rem 1rem;
    background: linear-gradient(135deg, var(--emerald-600) 0%, var(--emerald-500) 100%);
    border: 1px solid var(--emerald-400);
    border-radius: 6px;
    color: white;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(0, 214, 137, 0.25);
}

.page-weekly-lineup .filter-apply-btn:hover {
    background: linear-gradient(135deg, var(--emerald-500) 0%, var(--emerald-400) 100%);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0, 214, 137, 0.35);
    cursor: pointer;
    transition: all 0.3s ease;
}

.page-weekly-lineup .filter-apply-btn:hover {
    background: linear-gradient(135deg, var(--emerald-500) 0%, var(--emerald-400) 100%);
    box-shadow: 0 0 12px var(--emerald-400);
}

/* ===== FILTER CHIPS WRAPPER ===== */
.page-weekly-lineup .table-filter-chips-wrapper {
    position: relative;
    margin-bottom: 12px;
    margin-left: 24px;
    margin-right: 24px;
    z-index: 101; /* Above table z-index (100) */
    min-height: 0;
    transition: min-height 0.3s ease;
}

.page-weekly-lineup .table-filter-chips-wrapper:has([data-has-chips="true"]) {
    min-height: 60px;
}

/* ===== FILTER CHIPS ===== */
.page-weekly-lineup .table-filter-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 16px 20px;
    min-height: 62px;
    background: rgba(6, 12, 28, 0.92);
    border: 1px solid rgba(0, 214, 137, 0.25);
    border-radius: 14px;
    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    animation: filterChipsPopIn 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform-origin: top center;
    position: relative;
}

.page-weekly-lineup .table-filter-chips[data-has-chips="false"] {
    display: none !important;
}

@keyframes filterChipsPopIn {
    from {
        opacity: 0;
        transform: translateY(-10px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.page-weekly-lineup .filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.875rem;
    background: linear-gradient(135deg,
        rgba(0, 214, 137, 0.2) 0%,
        rgba(0, 180, 120, 0.15) 100%);
    border: 1px solid rgba(0, 214, 137, 0.5);
    border-radius: 20px;
    font-size: 0.875rem;
    color: var(--emerald-300);
    font-weight: 500;
    box-shadow: 
        0 2px 8px rgba(0, 0, 0, 0.2),
        0 0 12px rgba(0, 214, 137, 0.15);
    transition: all 0.2s ease;
    animation: chipSlideIn 0.25s ease-out;
}

@keyframes chipSlideIn {
    from {
        opacity: 0;
        transform: translateX(-8px) scale(0.9);
    }
    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

.page-weekly-lineup .filter-chip:hover {
    background: linear-gradient(135deg,
        rgba(0, 214, 137, 0.25) 0%,
        rgba(0, 180, 120, 0.2) 100%);
    border-color: rgba(0, 214, 137, 0.7);
    box-shadow: 
        0 4px 12px rgba(0, 0, 0, 0.3),
        0 0 16px rgba(0, 214, 137, 0.25);
    transform: translateY(-1px);
}

.page-weekly-lineup .filter-chip .chip-label {
    font-weight: 500;
    letter-spacing: 0.02em;
}

.page-weekly-lineup .filter-chip .chip-remove {
    background: rgba(0, 0, 0, 0.2);
    border: none;
    color: var(--emerald-300);
    cursor: pointer;
    padding: 2px 6px;
    font-size: 1rem;
    line-height: 1;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    margin-left: 4px;
}

.page-weekly-lineup .filter-chip .chip-remove:hover {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
    transform: scale(1.1);
}

/* ===== DATE FILTER SPECIFIC ===== */
.page-weekly-lineup .date-filter-compact {
    min-width: 320px;
}

.page-weekly-lineup .date-range-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.page-weekly-lineup .date-range-btn {
    padding: 0.375rem 0.75rem;
    background: transparent;
    border: 1px solid rgba(0, 214, 137, 0.2);
    border-radius: 4px;
    color: var(--neutral-300);
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.page-weekly-lineup .date-range-btn.active,
.page-weekly-lineup .date-range-btn:hover {
    background: rgba(0, 214, 137, 0.1);
    border-color: var(--emerald-400);
    color: var(--emerald-400);
}

.page-weekly-lineup .time-slots {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* ===== TIME SLOT BUTTONS ===== */
.page-weekly-lineup .time-slot {
    padding: 0.375rem 0.75rem;
    background: transparent;
    border: 1px solid var(--neutral-600);
    border-radius: 4px;
    color: var(--neutral-300);
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.page-weekly-lineup .time-slot.active,
.page-weekly-lineup .time-slot:hover {
    background: linear-gradient(135deg,
        var(--emerald-600) 0%,
        var(--emerald-500) 100%);
    border-color: var(--emerald-400);
    color: white;
}

/* ===== LEAGUE SELECTOR ===== */
.page-weekly-lineup .league-selector {
    display: flex;
    gap: 0.5rem;
}

.page-weekly-lineup .league-btn {
    padding: 0.25rem 0.625rem;
    background: transparent;
    border: 1px solid var(--neutral-600);
    border-radius: 4px;
    color: var(--neutral-300);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
}

.page-weekly-lineup .league-btn.active,
.page-weekly-lineup .league-btn:hover {
    background: var(--emerald-500);
    border-color: var(--emerald-400);
    color: white;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .weekly-lineup-table {
        table-layout: auto;
    }

    .weekly-lineup-table thead th {
        width: auto !important;
        min-width: 80px;
    }
}

@media (max-width: 768px) {
    .weekly-lineup-intro {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
    }

    .segment-key {
        width: 100%;
        justify-content: flex-start;
    }

    .weekly-lineup-table td,
    .weekly-lineup-table th {
        padding: 0.75rem 0.5rem;
    }

    .confidence-meter .bar {
        width: 10px;
        height: 6px;
    }
}

/* ==========================================================================
   IMPORT BUTTON (Metallic Transparent Glow Style)
   ========================================================================== */

.page-weekly-lineup .import-tile {
    position: relative;
    display: flex;
    align-items: flex-end; /* Align to bottom edge */
    height: var(--dashboard-topline-height, 76px); /* Match KPI tile container height */
    margin-left: auto; /* Push to far right */
    z-index: 1001;
}

.page-weekly-lineup .import-tile-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 36px;
    padding: 0 18px;
    min-width: 110px;

    /* Metallic Transparent Look */
    background: linear-gradient(145deg,
        rgba(25, 40, 65, 0.6) 0%,
        rgba(15, 28, 50, 0.7) 100%);
    border: 1px solid rgba(100, 140, 200, 0.25);
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.25s ease;

    /* Metallic glow effect */
    box-shadow:
        0 0 12px rgba(80, 120, 180, 0.12),
        0 0 20px rgba(60, 100, 160, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.page-weekly-lineup .import-tile-btn:hover {
    background: linear-gradient(145deg,
        rgba(30, 50, 80, 0.7) 0%,
        rgba(20, 35, 60, 0.8) 100%);
    border-color: rgba(120, 160, 220, 0.35);
    box-shadow:
        0 0 18px rgba(80, 130, 200, 0.2),
        0 0 30px rgba(60, 100, 160, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

.page-weekly-lineup .import-tile-btn[aria-expanded="true"] {
    background: linear-gradient(145deg,
        rgba(20, 35, 55, 0.75) 0%,
        rgba(12, 25, 42, 0.85) 100%);
    border-color: var(--color-primary, var(--emerald-400));
    box-shadow:
        0 0 16px rgba(0, 214, 137, 0.15),
        0 0 24px rgba(0, 180, 120, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.page-weekly-lineup .import-tile-icon {
    font-size: 0.55rem;
    font-weight: 400;
    color: var(--color-primary, var(--emerald-400)); /* Same green as sort icons */
    transition: transform 0.3s ease, color 0.2s ease;
    margin-top: 1px;
}

.page-weekly-lineup .import-tile-btn:hover .import-tile-icon {
    color: var(--color-primary, var(--emerald-400));
}

.page-weekly-lineup .import-tile-btn[aria-expanded="true"] .import-tile-icon {
    transform: rotate(180deg);
    color: var(--color-primary, var(--emerald-400));
}

.page-weekly-lineup .import-tile-label {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(180, 200, 230, 0.85); /* Light silver-blue text */
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.page-weekly-lineup .import-tile-btn:hover .import-tile-label,
.page-weekly-lineup .import-tile-btn[aria-expanded="true"] .import-tile-label {
    color: #fff;
}

/* Hide the sublabel */
.page-weekly-lineup .import-tile-sublabel {
    display: none;
}

/* Dropdown Panel Positioning - Anchor Right */
.page-weekly-lineup .import-tile .import-dropdown-panel {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    left: auto;
    width: 320px;
    background: rgba(10, 20, 30, 0.98); /* Deep dark blue-grey, not pitch black */
    border: 1px solid rgba(0, 214, 137, 0.25);
    border-radius: 6px;
    box-shadow: 
        0 16px 48px rgba(0, 0, 0, 0.75), 
        0 4px 12px rgba(0, 0, 0, 0.5),
        0 0 0 1px rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    z-index: 10000; /* Extremely high z-index to avoid overlap issues */
    overflow: hidden;
    transform-origin: top right;
    animation: dropdownFadeIn 0.2s ease-out;
}

.page-weekly-lineup .import-dropdown-panel:not([hidden]) {
    display: block !important;
}

@keyframes dropdownFadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ==========================================================================
   DROPDOWN PANEL CONTENT
   ========================================================================== */

.page-weekly-lineup .import-dropdown-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: linear-gradient(90deg, rgba(0, 214, 137, 0.05) 0%, rgba(6, 13, 25, 0) 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.page-weekly-lineup .import-dropdown-title {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: var(--emerald-400);
    text-transform: uppercase;
}

.page-weekly-lineup .import-dropdown-close {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    color: var(--neutral-400);
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
}

.page-weekly-lineup .import-dropdown-close:hover {
    background: rgba(239, 68, 68, 0.15);
    border-color: rgba(239, 68, 68, 0.3);
    color: #ef4444;
}

.page-weekly-lineup .import-dropdown-body {
    padding: 16px;
}

/* Paste Section - Cleaned Up */
.page-weekly-lineup .import-section-label {
    display: block;
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--neutral-400);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}

.page-weekly-lineup .import-paste-textarea {
    width: 100%;
    min-height: 120px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    color: var(--neutral-100);
    font-family: var(--font-body, 'Inter', sans-serif) !important;
    font-size: 0.8rem;
    line-height: 1.4;
    resize: none;
    transition: border-color 0.2s ease;
}

.page-weekly-lineup .import-paste-textarea:focus {
    outline: none;
    border-color: var(--emerald-400);
    background: rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 0 1px rgba(0, 214, 137, 0.2);
}

.page-weekly-lineup .import-paste-textarea::placeholder {
    color: rgba(255, 255, 255, 0.2);
}

.page-weekly-lineup .import-paste-actions {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 8px;
    margin-top: 12px;
}

.page-weekly-lineup .import-btn {
    padding: 8px 12px;
    border-radius: 4px;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.2s ease;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-weekly-lineup .import-btn.primary {
    background: linear-gradient(135deg, var(--emerald-600) 0%, var(--emerald-500) 100%);
    border: 1px solid var(--emerald-400);
    color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.page-weekly-lineup .import-btn.primary:hover {
    background: linear-gradient(135deg, var(--emerald-500) 0%, var(--emerald-400) 100%);
    box-shadow: 0 0 12px rgba(0, 214, 137, 0.4);
    transform: translateY(-1px);
}

.page-weekly-lineup .import-btn.secondary {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: var(--neutral-400);
}

.page-weekly-lineup .import-btn.secondary:hover {
    border-color: rgba(255, 255, 255, 0.3);
    color: var(--neutral-200);
    background: rgba(255, 255, 255, 0.05);
}

/* File Upload Section - Minimal */
.page-weekly-lineup .import-file-section {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.page-weekly-lineup .import-file-zone {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px dashed rgba(255, 255, 255, 0.15);
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.page-weekly-lineup .import-file-zone:hover {
    border-color: var(--emerald-400);
    background: rgba(0, 214, 137, 0.05);
}

.page-weekly-lineup .import-file-icon {
    font-size: 1.1rem;
    filter: grayscale(1);
    opacity: 0.7;
}

.page-weekly-lineup .import-file-text {
    font-size: 0.75rem;
    color: var(--neutral-400);
}

.page-weekly-lineup #file-list {
    margin: 0.5rem 0;
    display: none;
}

.page-weekly-lineup #upload-files-btn {
    width: 100%;
    margin-bottom: 1rem;
    display: none;
}

.page-weekly-lineup #upload-status {
    margin-top: 1rem;
    padding: 0.75rem;
    border-radius: 6px;
    display: none;
}

/* ==========================================================================
   PARSED PICKS PREVIEW - VEGAS SPORTSBOOK STYLE
   ========================================================================== */

.page-weekly-lineup .parsed-picks-container {
    background: linear-gradient(180deg, 
        rgba(8, 16, 32, 0.95) 0%, 
        rgba(4, 10, 22, 0.98) 100%);
    border: 1px solid rgba(0, 214, 137, 0.15);
    border-radius: 8px;
    margin-bottom: 1.5rem;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.page-weekly-lineup .parsed-picks-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: linear-gradient(90deg, 
        rgba(0, 214, 137, 0.12) 0%, 
        rgba(0, 180, 120, 0.05) 50%,
        transparent 100%);
    border-bottom: 1px solid rgba(0, 214, 137, 0.2);
}

.page-weekly-lineup .parsed-picks-title {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--emerald-400);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.page-weekly-lineup .parsed-count {
    color: rgba(255, 255, 255, 0.6);
    font-weight: 400;
    font-size: 0.85rem;
}

.page-weekly-lineup .parsed-picks-actions {
    display: flex;
    gap: 0.5rem;
}

.page-weekly-lineup .select-all-btn,
.page-weekly-lineup .clear-selection-btn {
    padding: 0.4rem 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    color: var(--neutral-400);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.2s ease;
}

.page-weekly-lineup .select-all-btn:hover,
.page-weekly-lineup .clear-selection-btn:hover {
    background: rgba(0, 214, 137, 0.15);
    border-color: var(--emerald-400);
    color: var(--emerald-400);
}

/* Vegas-style grid layout */
.page-weekly-lineup .parsed-picks-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 8px;
    padding: 12px;
    max-height: 420px;
    overflow-y: auto;
}

/* Betting card style */
.page-weekly-lineup .parsed-pick-item {
    display: flex;
    flex-direction: column;
    background: linear-gradient(145deg, 
        rgba(20, 35, 60, 0.8) 0%, 
        rgba(12, 24, 45, 0.9) 100%);
    border: 1px solid rgba(80, 120, 180, 0.2);
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    overflow: hidden;
    position: relative;
}

.page-weekly-lineup .parsed-pick-item:hover {
    border-color: rgba(0, 214, 137, 0.4);
    box-shadow: 0 4px 16px rgba(0, 214, 137, 0.1);
    transform: translateY(-2px);
}

.page-weekly-lineup .parsed-pick-item.selected {
    background: linear-gradient(145deg, 
        rgba(0, 60, 40, 0.6) 0%, 
        rgba(0, 40, 30, 0.8) 100%);
    border-color: var(--emerald-500);
    box-shadow: 
        0 0 20px rgba(0, 214, 137, 0.2),
        inset 0 0 30px rgba(0, 214, 137, 0.05);
}

.page-weekly-lineup .parsed-pick-item.selected::before {
    content: '✓';
    position: absolute;
    top: 8px;
    right: 8px;
    width: 20px;
    height: 20px;
    background: var(--emerald-500);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    color: white;
    font-weight: bold;
}

/* Hide default checkbox */
.page-weekly-lineup .parsed-pick-checkbox {
    display: none;
}

/* Card header - Team & Matchup */
.page-weekly-lineup .parsed-pick-info {
    padding: 10px 12px 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.page-weekly-lineup .parsed-pick-team {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 500;
    color: #fff;
    font-size: 1rem;
    letter-spacing: 0.02em;
    margin-bottom: 2px;
}

.page-weekly-lineup .parsed-pick-details {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
}

/* Card body - Odds display */
.page-weekly-lineup .parsed-pick-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px 10px;
}

.page-weekly-lineup .parsed-pick-segment {
    flex: 1;
}

.page-weekly-lineup .parsed-pick-segment .segment-chip {
    font-size: 0.65rem;
    padding: 3px 8px;
    border-radius: 3px;
}

.page-weekly-lineup .parsed-pick-odds {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 600;
    font-size: 1.1rem;
    color: var(--emerald-400);
    padding: 4px 10px;
    background: rgba(0, 214, 137, 0.1);
    border: 1px solid rgba(0, 214, 137, 0.3);
    border-radius: 4px;
    min-width: auto;
    text-align: center;
}

.page-weekly-lineup .parsed-pick-risk {
    font-weight: 600;
    color: var(--gold-400);
    font-size: 0.85rem;
    margin-left: 8px;
}

/* Footer with actions */
.page-weekly-lineup .parsed-picks-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: rgba(0, 0, 0, 0.3);
    border-top: 1px solid rgba(0, 214, 137, 0.15);
}

.page-weekly-lineup .selected-summary {
    color: var(--neutral-400);
    font-size: 0.85rem;
}

.page-weekly-lineup .selected-summary #selected-count {
    color: var(--emerald-400);
    font-weight: 700;
    font-size: 1rem;
}

.page-weekly-lineup .add-bets-btn {
    padding: 0.6rem 1.25rem;
    background: linear-gradient(135deg, var(--emerald-600) 0%, var(--emerald-500) 100%);
    border: 1px solid var(--emerald-400);
    border-radius: 5px;
    color: white;
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.3s ease;
}

.page-weekly-lineup .add-bets-btn:hover:not(:disabled) {
    background: linear-gradient(135deg, var(--emerald-500) 0%, var(--emerald-400) 100%);
    box-shadow: 0 0 16px var(--emerald-400);
}

.page-weekly-lineup .add-bets-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==========================================================================
   BET MODAL STYLES
   ========================================================================== */

.page-weekly-lineup .bet-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 2rem;
}

.page-weekly-lineup .bet-modal-overlay[hidden] {
    display: none;
}

.page-weekly-lineup .bet-modal {
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    background: linear-gradient(180deg, 
        rgba(10, 20, 35, 0.98) 0%, 
        rgba(5, 12, 25, 0.98) 100%);
    border: 1px solid rgba(0, 214, 137, 0.3);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(0, 214, 137, 0.1);
    display: flex;
    flex-direction: column;
}

.page-weekly-lineup .bet-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    background: linear-gradient(180deg,
        rgba(0, 214, 137, 0.1) 0%,
        rgba(0, 214, 137, 0.03) 100%);
    border-bottom: 1px solid rgba(0, 214, 137, 0.2);
}

.page-weekly-lineup .bet-modal-header h2 {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--gold-400);
    margin: 0;
}

.page-weekly-lineup .bet-modal-close {
    width: 36px;
    height: 36px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    color: var(--neutral-400);
    font-size: 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-weekly-lineup .bet-modal-close:hover {
    background: rgba(239, 68, 68, 0.2);
    border-color: #ef4444;
    color: #ef4444;
}

.page-weekly-lineup .bet-modal-content {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
}

.page-weekly-lineup .bet-unit-config {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    margin-bottom: 1rem;
}

.page-weekly-lineup .bet-unit-config label {
    color: var(--neutral-300);
    font-weight: 500;
}

.page-weekly-lineup .bet-unit-config input {
    width: 100px;
    padding: 0.5rem 0.75rem;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(0, 214, 137, 0.3);
    border-radius: 6px;
    color: var(--neutral-100);
    font-weight: 600;
    text-align: right;
}

.page-weekly-lineup .bet-unit-config input:focus {
    outline: none;
    border-color: var(--emerald-400);
}

.page-weekly-lineup .unit-hint {
    color: var(--neutral-500);
    font-size: 0.8rem;
}

.page-weekly-lineup .bet-input-mode {
    display: flex;
    gap: 1.5rem;
    padding: 0.75rem 0;
    margin-bottom: 1rem;
}

.page-weekly-lineup .mode-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: var(--neutral-300);
}

.page-weekly-lineup .mode-option input[type="radio"] {
    appearance: none;
    width: 18px;
    height: 18px;
    border: 2px solid var(--neutral-500);
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
}

.page-weekly-lineup .mode-option input[type="radio"]:checked {
    border-color: var(--emerald-400);
    background: var(--emerald-500);
}

.page-weekly-lineup .mode-option input[type="radio"]:checked::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6px;
    height: 6px;
    background: white;
    border-radius: 50%;
}

.page-weekly-lineup .selected-picks-bet-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.page-weekly-lineup .bet-pick-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(0, 214, 137, 0.15);
    border-radius: 8px;
    gap: 1rem;
}

.page-weekly-lineup .bet-pick-info {
    flex: 1;
}

.page-weekly-lineup .bet-pick-team {
    font-weight: 600;
    color: var(--neutral-100);
    display: block;
}

.page-weekly-lineup .bet-pick-line {
    font-size: 0.875rem;
    color: var(--emerald-400);
    display: block;
    margin-top: 0.25rem;
}

.page-weekly-lineup .bet-pick-segment {
    font-size: 0.8rem;
    color: var(--neutral-500);
}

.page-weekly-lineup .bet-pick-input {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.page-weekly-lineup .input-prefix {
    color: var(--neutral-400);
    font-weight: 600;
}

.page-weekly-lineup .bet-amount-input {
    width: 80px;
    padding: 0.5rem;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(0, 214, 137, 0.3);
    border-radius: 6px;
    color: var(--neutral-100);
    font-weight: 600;
    text-align: right;
}

.page-weekly-lineup .bet-amount-input:focus {
    outline: none;
    border-color: var(--emerald-400);
    box-shadow: 0 0 0 2px rgba(0, 214, 137, 0.15);
}

.page-weekly-lineup .calculated-amount {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 120px;
}

.page-weekly-lineup .calc-label {
    color: var(--neutral-500);
    font-size: 0.8rem;
}

.page-weekly-lineup .calc-value {
    color: var(--gold-400);
    font-weight: 600;
    font-size: 0.9rem;
}

.page-weekly-lineup .bet-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background: rgba(0, 0, 0, 0.2);
    border-top: 1px solid rgba(0, 214, 137, 0.1);
}

.page-weekly-lineup .bet-modal-btn {
    padding: 0.75rem 1.5rem;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.page-weekly-lineup .bet-modal-btn.cancel {
    background: transparent;
    border: 1px solid var(--neutral-600);
    color: var(--neutral-300);
}

.page-weekly-lineup .bet-modal-btn.cancel:hover {
    border-color: var(--neutral-400);
    color: var(--neutral-200);
}

.page-weekly-lineup .bet-modal-btn.confirm {
    background: linear-gradient(135deg, var(--emerald-600) 0%, var(--emerald-500) 100%);
    border: 1px solid var(--emerald-400);
    color: white;
}

.page-weekly-lineup .bet-modal-btn.confirm:hover:not(:disabled) {
    background: linear-gradient(135deg, var(--emerald-500) 0%, var(--emerald-400) 100%);
    box-shadow: 0 0 16px var(--emerald-400);
}

.page-weekly-lineup .bet-modal-btn.confirm:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Notification Animation */
.page-weekly-lineup .weekly-notification {
    font-family: var(--font-body);
}

/* Responsive for KPI Row and Import */
@media (max-width: 1200px) {
    .page-weekly-lineup .kpi-tiles-row {
        flex-wrap: wrap;
    }
    
    .page-weekly-lineup .kpi-tiles-row .kpi-tiles {
        flex: 1 1 100%;
        justify-content: center;
    }
    
    .import-tile {
        flex: 1 1 100%;
        justify-content: center;
        margin-top: 0.5rem;
    }
    
    .import-tile-btn {
        width: 100%;
        flex-direction: row;
        gap: 0.75rem;
        padding: 0.875rem 1.5rem;
    }
    
    .import-tile-sublabel {
        display: none;
    }
}

@media (max-width: 768px) {
    .page-weekly-lineup .kpi-tiles-row .kpi-tiles {
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .page-weekly-lineup .import-tile .import-dropdown-panel {
        width: calc(100vw - 2rem);
        right: -1rem;
    }

    .page-weekly-lineup .parsed-picks-header {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-weekly-lineup .parsed-picks-footer {
        flex-direction: column;
        gap: 1rem;
    }

    .page-weekly-lineup .add-bets-btn {
        width: 100%;
    }

    .page-weekly-lineup .bet-modal {
        max-width: 100%;
        margin: 1rem;
    }

    .page-weekly-lineup .bet-pick-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .page-weekly-lineup .bet-pick-input {
        width: 100%;
        justify-content: flex-start;
    }
}

/* ==========================================================================
   FIRE RATING STYLES
   ========================================================================== */

/* Fire Rating Styling - allow MAX badge to show */
.weekly-lineup-table .fire-rating {
    font-size: 0.8rem;
    letter-spacing: -0.02em;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    overflow: visible;
}

/* Pick Display */
.weekly-lineup-table .pick-display {
    font-weight: 600;
    color: var(--neutral-100);
    font-size: 0.95rem;
}

/* Center alignment for specific columns */
.weekly-lineup-table td.center,
.weekly-lineup-table th.center {
    text-align: center;
}

/* Matchup cell with @ separator */
.weekly-lineup-table .matchup-cell.matchup-full-names {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.weekly-lineup-table .matchup-cell .vs-divider {
    color: var(--neutral-500);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0 0.25rem;
}

.weekly-lineup-table .matchup-cell .team-line {
    display: flex;
    align-items: center;
}

.weekly-lineup-table .matchup-cell .team-name-full {
    font-weight: 600;
    color: var(--neutral-100);
    font-size: 0.9rem;
}

.weekly-lineup-table .matchup-cell .team-record {
    color: var(--neutral-400);
    font-size: 0.75rem;
    font-weight: 500;
    margin-left: 0.25rem;
    opacity: 0.85;
}

/* DateTime cell */
.weekly-lineup-table .datetime-cell {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.weekly-lineup-table .datetime-cell .date-value {
    font-weight: 600;
    color: var(--neutral-100);
    font-size: 0.9rem;
}

.weekly-lineup-table .datetime-cell .time-value {
    font-size: 0.8rem;
    color: var(--neutral-400);
}

/* ==========================================================================
   TEAM LOGO STYLES (Matching Dashboard)
   ========================================================================== */

/* Team logos in matchup cell */
.weekly-lineup-table .team-logo {
    width: 24px;
    height: 24px;
    object-fit: contain;
    border-radius: 2px;
    flex-shrink: 0;
}

/* Team line layout with logo */
.weekly-lineup-table .team-line {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Matchup cell layout */
.weekly-lineup-table .matchup-cell {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.weekly-lineup-table .vs-divider {
    color: var(--neutral-500);
    font-size: 0.65rem;
    font-weight: 500;
    text-transform: uppercase;
    padding-left: 2rem;
    line-height: 1;
}

/* Segment column styling */
.weekly-lineup-table .segment-value {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--neutral-400);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

/* Pick cell - centered stacked format: Logo | School / Mascot (odds) */
.weekly-lineup-table .pick-cell {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    white-space: nowrap;
    padding: 0.25rem 0;
}

.weekly-lineup-table .pick-team-logo {
    width: 24px;
    height: 24px;
    object-fit: contain;
    border-radius: 2px;
    flex-shrink: 0;
}

.weekly-lineup-table .pick-details {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.35rem;
    min-width: 0;
    text-align: left;
}

/* School name (top line) - consistent typography */
.weekly-lineup-table .pick-school {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--emerald-400);
    line-height: 1.2;
    white-space: nowrap;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

/* Mascot (bottom line) - consistent typography with school */
.weekly-lineup-table .pick-mascot {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 400;
    font-size: 0.8rem;
    color: var(--neutral-300);
    white-space: nowrap;
    line-height: 1.2;
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    letter-spacing: 0.01em;
}

/* Legacy - keep for backwards compat */
.weekly-lineup-table .pick-team-full {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--emerald-400);
    font-family: var(--font-display, 'Oswald', sans-serif);
    line-height: 1.2;
    white-space: nowrap;
}

.weekly-lineup-table .pick-type-line {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.75rem;
    color: var(--neutral-400);
    font-weight: 500;
    white-space: nowrap;
}

.weekly-lineup-table .pick-direction-full {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--emerald-400);
    font-family: var(--font-display, 'Oswald', sans-serif);
    text-transform: uppercase;
    line-height: 1.15;
    letter-spacing: 0.02em;
}

/* Legacy classes (keeping for backwards compatibility) */
.weekly-lineup-table .pick-team-abbr {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--emerald-400);
    font-family: var(--font-display, 'Oswald', sans-serif);
}

.weekly-lineup-table .pick-line {
    font-weight: 600;
    color: var(--neutral-100);
    font-size: 0.9rem;
    font-family: var(--font-display, 'Oswald', sans-serif);
}

.weekly-lineup-table .pick-odds {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.85rem;
    color: var(--neutral-400);
    font-weight: 500;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

/* Total pick styling (Over/Under) - single line layout */
.weekly-lineup-table .pick-cell-total {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.35rem;
    white-space: nowrap;
}

.weekly-lineup-table .pick-direction {
    font-weight: 700;
    color: var(--emerald-400);
    font-size: 0.9rem;
    text-transform: uppercase;
    font-family: var(--font-display, 'Oswald', sans-serif);
    letter-spacing: 0.02em;
}

/* ===== PREDICTION CELLS (Model & Market) ===== */
.weekly-lineup-table .prediction-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
}

.weekly-lineup-table .prediction-logo {
    width: 18px;
    height: 18px;
    object-fit: contain;
    border-radius: 2px;
    flex-shrink: 0;
}

.weekly-lineup-table .prediction-text {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--neutral-200);
    white-space: nowrap;
    letter-spacing: 0.01em;
}

/* Prediction odds - muted color in parentheses */
.weekly-lineup-table .prediction-odds {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.75rem;
    color: var(--neutral-400);
    font-weight: 500;
    letter-spacing: 0.01em;
    margin-left: 0.25rem;
}

/* League cell - centered with logo stacked above text */
.weekly-lineup-table .league-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
}

.weekly-lineup-table .league-logo {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.weekly-lineup-table .league-abbr {
    font-family: var(--font-display, 'Oswald', sans-serif);
    font-weight: 600;
    font-size: 0.7rem;
    color: var(--neutral-400);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* Zebra striping */
.weekly-lineup-table tbody tr.even {
    background: rgba(0, 0, 0, 0.15);
}

.weekly-lineup-table tbody tr.odd {
    background: rgba(0, 0, 0, 0.08);
}

.weekly-lineup-table tbody tr:hover {
    background: rgba(0, 214, 137, 0.08);
}

/* ==========================================================================
   ENHANCED FILTER SYSTEM - VISUAL FILTER CARDS
   ========================================================================== */

/* ===== LEAGUE FILTER GRID ===== */
.page-weekly-lineup .league-filter-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.page-weekly-lineup .league-filter-chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 12px 8px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.page-weekly-lineup .league-filter-chip:hover {
    background: rgba(0, 214, 137, 0.1);
    border-color: rgba(0, 214, 137, 0.3);
}

.page-weekly-lineup .league-filter-chip.active {
    background: linear-gradient(135deg, rgba(0, 214, 137, 0.2) 0%, rgba(0, 180, 120, 0.15) 100%);
    border-color: var(--emerald-400);
    box-shadow: 0 0 12px rgba(0, 214, 137, 0.2);
}

.page-weekly-lineup .league-filter-chip .chip-logo {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.page-weekly-lineup .league-filter-chip .chip-icon {
    font-size: 1.25rem;
}

.page-weekly-lineup .league-filter-chip .chip-text {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--neutral-300);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.page-weekly-lineup .league-filter-chip.active .chip-text {
    color: var(--emerald-300);
}

/* ===== BET TYPE / PICK FILTER GRID ===== */
.page-weekly-lineup .pick-filter-wide {
    min-width: 340px;
}

.page-weekly-lineup .bet-type-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.page-weekly-lineup .bet-type-chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 14px 12px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.25s ease;
    text-align: center;
}

.page-weekly-lineup .bet-type-chip:hover {
    background: rgba(0, 214, 137, 0.1);
    border-color: rgba(0, 214, 137, 0.3);
    transform: translateY(-2px);
}

.page-weekly-lineup .bet-type-chip.active {
    background: linear-gradient(135deg, rgba(0, 214, 137, 0.25) 0%, rgba(0, 180, 120, 0.2) 100%);
    border-color: var(--emerald-400);
    box-shadow: 0 4px 16px rgba(0, 214, 137, 0.25);
}

.page-weekly-lineup .bet-type-chip .bet-icon {
    font-size: 1.2rem;
    margin-bottom: 2px;
}

.page-weekly-lineup .bet-type-chip .bet-label {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--neutral-200);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.page-weekly-lineup .bet-type-chip .bet-desc {
    font-size: 0.7rem;
    font-weight: 400;
    color: var(--neutral-500);
}

.page-weekly-lineup .bet-type-chip.active .bet-label {
    color: var(--emerald-300);
}

.page-weekly-lineup .bet-type-chip.active .bet-desc {
    color: var(--emerald-400);
}

/* First chip (All Picks) spans full width */
.page-weekly-lineup .bet-type-chip[data-market="all"] {
    grid-column: 1 / -1;
    flex-direction: row;
    justify-content: center;
    gap: 10px;
    padding: 10px 16px;
}

/* ===== RANGE FILTER GRID (Model, Market) ===== */
.page-weekly-lineup .range-filter-grid {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.page-weekly-lineup .range-filter-chip {
    display: block;
    width: 100%;
    padding: 0.35rem 0.6rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 3px;
    text-align: left;
    font-size: 0.6rem;
    font-weight: 500;
    color: rgba(200, 210, 220, 0.8);
    cursor: pointer;
    transition: all 0.2s ease;
}

.page-weekly-lineup .range-filter-chip:hover {
    background: rgba(180, 160, 120, 0.08);
    border-color: rgba(180, 160, 120, 0.25);
}

.page-weekly-lineup .range-filter-chip.active {
    background: rgba(180, 160, 120, 0.12);
    border-color: rgba(200, 180, 140, 0.4);
    color: rgba(220, 200, 160, 1);
}

/* ===== EDGE FILTER GRID ===== */
.page-weekly-lineup .edge-filter-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

/* Edge filter chips - premium compact style */
.page-weekly-lineup .edge-filter-chip {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0.35rem 0.6rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.12s ease;
}

.page-weekly-lineup .edge-filter-chip:hover {
    background: rgba(180, 160, 120, 0.08);
    border-color: rgba(180, 160, 120, 0.25);
}

.page-weekly-lineup .edge-filter-chip.active {
    background: rgba(180, 160, 120, 0.12);
    border-color: rgba(200, 180, 140, 0.4);
}

/* Edge tier indicator bars */
.page-weekly-lineup .edge-tier {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    flex-shrink: 0;
}
.page-weekly-lineup .edge-tier.tier-hot { background: #e53935; }
.page-weekly-lineup .edge-tier.tier-good { background: #43a047; }
.page-weekly-lineup .edge-tier.tier-ok { background: #c9a227; }
.page-weekly-lineup .edge-tier.tier-low { background: #607080; }

.page-weekly-lineup .edge-filter-chip .edge-chip-label {
    font-size: 0.65rem;
    font-weight: 500;
    color: rgba(200, 210, 220, 0.85);
    letter-spacing: 0.02em;
}

.page-weekly-lineup .edge-filter-chip.active .edge-chip-label {
    color: rgba(220, 200, 160, 1);
}

/* Edge tier color accents on active */
.page-weekly-lineup .edge-filter-chip.edge-hot.active {
    border-color: rgba(229, 57, 53, 0.5);
}
.page-weekly-lineup .edge-filter-chip.edge-good.active {
    border-color: rgba(67, 160, 71, 0.5);
}
.page-weekly-lineup .edge-filter-chip.edge-ok.active {
    border-color: rgba(201, 162, 39, 0.5);
}
.page-weekly-lineup .edge-filter-chip.edge-low.active {
    border-color: rgba(96, 112, 128, 0.5);
}

/* ===== FIRE FILTER GRID - Premium Compact ===== */
.page-weekly-lineup .fire-filter-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.page-weekly-lineup .fire-filter-chip {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0.35rem 0.6rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.12s ease;
}

.page-weekly-lineup .fire-filter-chip:hover {
    background: rgba(180, 160, 120, 0.08);
    border-color: rgba(180, 160, 120, 0.25);
}

.page-weekly-lineup .fire-filter-chip.active {
    background: rgba(180, 160, 120, 0.12);
    border-color: rgba(200, 180, 140, 0.4);
}

/* Fire bars - elegant signal strength indicator */
.page-weekly-lineup .fire-bars {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 12px;
}

.page-weekly-lineup .fire-bars i {
    display: block;
    width: 3px;
    background: rgba(200, 180, 140, 0.6);
    border-radius: 1px;
}

/* Bar heights - ascending signal */
.page-weekly-lineup .fire-bars i:nth-child(1) { height: 4px; }
.page-weekly-lineup .fire-bars i:nth-child(2) { height: 6px; }
.page-weekly-lineup .fire-bars i:nth-child(3) { height: 8px; }
.page-weekly-lineup .fire-bars i:nth-child(4) { height: 10px; }
.page-weekly-lineup .fire-bars i:nth-child(5) { height: 12px; }

/* Active fire bars - warm amber glow */
.page-weekly-lineup .fire-filter-chip.active .fire-bars i {
    background: rgba(220, 160, 80, 0.9);
}

/* MAX fire special styling */
.page-weekly-lineup .fire-filter-chip.fire-max.active {
    border-color: rgba(220, 160, 80, 0.6);
}
.page-weekly-lineup .fire-filter-chip.fire-max.active .fire-bars i {
    background: linear-gradient(180deg, #f0a030 0%, #e07020 100%);
}

.page-weekly-lineup .fire-filter-chip .fire-chip-label {
    font-size: 0.65rem;
    font-weight: 500;
    color: rgba(200, 210, 220, 0.85);
    letter-spacing: 0.02em;
}

.page-weekly-lineup .fire-filter-chip.active .fire-chip-label {
    color: rgba(220, 200, 160, 1);
}

/* ===== ENHANCED FILTER CARDS (Above Table) ===== */
.page-weekly-lineup .table-filter-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    min-height: 52px;

    /* Enhanced styling - Vegas sportsbook card feel */
    background: linear-gradient(145deg,
        rgba(0, 30, 45, 0.85) 0%,
        rgba(0, 20, 35, 0.9) 100%);
    border: 1px solid rgba(0, 214, 137, 0.4);
    border-radius: 12px;
    box-shadow:
        0 6px 24px rgba(0, 0, 0, 0.5),
        0 0 40px rgba(0, 214, 137, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -2px 0 rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);

    animation: filterChipsPopIn 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform-origin: top center;
}

.page-weekly-lineup .filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: linear-gradient(135deg,
        rgba(0, 214, 137, 0.25) 0%,
        rgba(0, 180, 120, 0.18) 100%);
    border: 1px solid rgba(0, 214, 137, 0.5);
    border-radius: 24px;
    font-size: 0.9rem;
    color: #fff;
    font-weight: 600;
    letter-spacing: 0.02em;
    box-shadow:
        0 3px 12px rgba(0, 0, 0, 0.3),
        0 0 16px rgba(0, 214, 137, 0.2);
    transition: all 0.25s ease;
    animation: chipSlideIn 0.3s ease-out;
}

.page-weekly-lineup .filter-chip:hover {
    background: linear-gradient(135deg,
        rgba(0, 214, 137, 0.35) 0%,
        rgba(0, 180, 120, 0.25) 100%);
    border-color: rgba(0, 214, 137, 0.7);
    box-shadow:
        0 5px 16px rgba(0, 0, 0, 0.4),
        0 0 24px rgba(0, 214, 137, 0.3);
    transform: translateY(-2px);
}

.page-weekly-lineup .filter-chip .chip-icon {
    font-size: 1rem;
}

.page-weekly-lineup .filter-chip .chip-label {
    font-weight: 600;
    letter-spacing: 0.03em;
}

.page-weekly-lineup .filter-chip .chip-remove {
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    padding: 0;
    font-size: 0.85rem;
    line-height: 1;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    margin-left: 4px;
}

.page-weekly-lineup .filter-chip .chip-remove:hover {
    background: rgba(239, 68, 68, 0.3);
    border-color: rgba(239, 68, 68, 0.5);
    color: #fff;
    transform: scale(1.1);
}

/* Clear All Filters button */
.page-weekly-lineup .table-filter-chips .clear-all-filters {
    margin-left: auto;
    padding: 6px 14px;
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 6px;
    color: rgba(239, 68, 68, 0.9);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.2s ease;
}

.page-weekly-lineup .table-filter-chips .clear-all-filters:hover {
    background: rgba(239, 68, 68, 0.25);
    border-color: rgba(239, 68, 68, 0.5);
    color: #ef4444;
}

/* Active Filters Label */
.page-weekly-lineup .table-filter-chips::before {
    content: 'Active Filters:';
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--emerald-400);
    margin-right: 8px;
}

/* ==========================================================================
   FILTER BUTTON - Invisible box, prominent icon
   Position is set in thead th context above - this is for styling only
   ========================================================================== */
body.page-weekly-lineup .th-filter-btn,
.page-weekly-lineup .th-filter-btn {
    width: 22px !important;
    height: 22px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.15s ease !important;
    z-index: 102 !important;
    pointer-events: auto !important;
    /* Position is absolute - set in thead th context above */
}

/* Hover state - subtle background + glow */
body.page-weekly-lineup .th-filter-btn:hover,
.page-weekly-lineup .th-filter-btn:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.1) !important;
    border-radius: 4px !important;
}

/* Active/pressed state */
body.page-weekly-lineup .th-filter-btn:active,
.page-weekly-lineup .th-filter-btn:active {
    opacity: 0.8;
}

/* Expanded state (dropdown open) */
body.page-weekly-lineup .th-filter-btn[aria-expanded="true"],
.page-weekly-lineup .th-filter-btn[aria-expanded="true"] {
    opacity: 1;
}

/* Filter icon styling - Clean Gold/White Theme */
body.page-weekly-lineup .th-filter-icon,
.page-weekly-lineup .th-filter-icon {
    font-size: 1.2rem;
    line-height: 1;
    color: rgba(255, 255, 255, 0.75);
    opacity: 1;
    letter-spacing: 0.12em;
    pointer-events: none;
    font-weight: bold;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    transition: all 0.2s ease;
}

body.page-weekly-lineup .th-filter-btn:hover .th-filter-icon,
.page-weekly-lineup .th-filter-btn:hover .th-filter-icon {
    color: #fff;
    transform: scale(1.1);
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.3);
}

body.page-weekly-lineup .th-filter-btn[aria-expanded="true"] .th-filter-icon,
.page-weekly-lineup .th-filter-btn[aria-expanded="true"] .th-filter-icon {
    color: #d4af37; /* Vegas Gold */
    text-shadow: 0 0 12px rgba(212, 175, 55, 0.4);
}

/* Hide the ::before pseudo-element (icon is in markup) */
body.page-weekly-lineup .th-filter-btn::before,
.page-weekly-lineup .th-filter-btn::before {
    content: none !important;
}

/* Active filter indicator dot - Gold */
body.page-weekly-lineup .th-filter-btn.has-filter::after,
.page-weekly-lineup .th-filter-btn.has-filter::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 2px;
    width: 6px;
    height: 6px;
    background: #d4af37;
    border-radius: 50%;
    box-shadow: 0 0 6px rgba(212, 175, 55, 0.6);
    pointer-events: none;
}

/* ==========================================================================
   COMPACT FILTER DROPDOWNS - Premium Vegas Sportsbook Design (Refined)
   ========================================================================== */

/* Compact dropdown container (legacy) */
.page-weekly-lineup .th-filter-dropdown.open:not(.weekly-lineup-filter-dropdown) {
    min-width: 140px !important;
    max-width: 200px !important;
    padding: 8px !important;
    background: #0a0a0a !important; /* Pure matte black */
    border: 1px solid #333 !important; /* Subtle dark grey border */
    border-radius: 6px !important;
    box-shadow: 
        0 12px 32px rgba(0, 0, 0, 0.9),
        0 2px 4px rgba(0, 0, 0, 0.5) !important;
}

/* Compact section (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-section-compact {
    padding: 0 !important;
    border-bottom: none !important;
}

/* Filter grid - compact 3 column (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 4px !important;
}

/* League grid - 2 column for more space (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .league-grid-compact {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 4px !important;
}

/* Fire grid - single row (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .fire-grid {
    grid-template-columns: repeat(4, 1fr) !important;
}

/* Base filter option button (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt,
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .league-chip {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 4px !important;
    background: transparent !important;
    border: 1px solid #2a2a2a !important;
    border-radius: 4px !important;
    color: #888 !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 0.05em !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
    text-align: center !important;
}

/* Hover state (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt:hover,
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .league-chip:hover {
    background: #1a1a1a !important;
    border-color: #444 !important;
    color: #ccc !important;
    transform: translateY(-1px);
}

/* Active state - Gold Theme (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.active,
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .league-chip.active {
    background: linear-gradient(135deg, #1c1c1c 0%, #111 100%) !important;
    border: 1px solid #d4af37 !important; /* Gold border */
    color: #d4af37 !important; /* Gold text */
    box-shadow: inset 0 0 10px rgba(212, 175, 55, 0.1) !important;
    font-weight: 600 !important;
}

/* Edge tier colors (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.edge-hot { border-left: 3px solid #ff6b35 !important; }
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.edge-good { border-left: 3px solid #00d68f !important; }
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.edge-ok { border-left: 3px solid #ffb800 !important; }
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.edge-low { border-left: 3px solid #666 !important; }

/* Fire tier colors (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.fire-max,
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.fire-5 { border-left: 3px solid #ff4444 !important; }
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.fire-4 { border-left: 3px solid #ff6b35 !important; }
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.fire-3 { border-left: 3px solid #ffb800 !important; }
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.fire-2 { border-left: 3px solid #666 !important; }
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .filter-opt.fire-1 { border-left: 3px solid #444 !important; }

/* Team search input (legacy) */
.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .team-search-input {
    width: 100% !important;
    padding: 8px 10px !important;
    background: #111 !important;
    border: 1px solid #333 !important;
    border-radius: 4px !important;
    color: #eee !important;
    font-size: 11px !important;
    outline: none !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .team-search-input::placeholder {
    color: #555 !important;
}

.page-weekly-lineup .th-filter-dropdown:not(.weekly-lineup-filter-dropdown) .team-search-input:focus {
    border-color: #d4af37 !important;
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.2) !important;
}

/* ==========================================================================
   WEEKLY LINEUP (ONLY): FILTER DROPDOWN CARDS (when moved to <body>)
   --------------------------------------------------------------------------
   weekly-lineup.js appends dropdown panels to document.body on open to escape
   table stacking contexts. That breaks `.page-weekly-lineup …` scoped styling.
   These selectors use an explicit class added by JS so styling remains intact.
   ========================================================================== */

/* ==========================================================================
   COMPACT FILTER DROPDOWN - High Contrast, Efficient Layout
   ========================================================================== */

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown {
    /* Base hidden state */
    display: none;
    position: fixed;
    z-index: 2147483647;

    /* Compact card - tighter sizing */
    min-width: 180px !important;
    max-width: 240px !important;

    /* High contrast dark background */
    background: rgba(8, 12, 20, 0.98) !important;
    border: 1px solid rgba(0, 214, 137, 0.35) !important;
    border-radius: 8px !important;
    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.65),
        0 0 0 1px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    overflow: hidden !important;
    isolation: isolate;
}

/* Top accent line - clean green bar */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg,
        rgba(0, 214, 137, 0.6) 0%,
        rgba(0, 214, 137, 0.9) 50%,
        rgba(0, 214, 137, 0.6) 100%);
    z-index: 3;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown.open {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: fixed !important;
    bottom: auto !important;
    right: auto !important;
    animation: wlFilterDropIn 120ms ease-out forwards !important;
}

@keyframes wlFilterDropIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Compact header */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .wl-filter-header {
    display: block;
    padding: 0;
    background: transparent;
    border-bottom: none;
    min-height: 0;
    position: relative;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .wl-filter-title {
    display: none;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .wl-filter-close {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 999px;
    color: #c8d7e6;
    font-size: 12px;
    cursor: pointer;
    transition: all 100ms ease;
    position: absolute;
    top: 6px;
    right: 6px;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .wl-filter-close:hover {
    background: rgba(255, 100, 100, 0.2);
    border-color: rgba(255, 100, 100, 0.4);
    color: #ff8888;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .wl-filter-close:active {
    transform: scale(0.95);
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .wl-filter-close:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 214, 137, 0.3);
}

/* Compact sections */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-section-compact {
    padding: 8px 10px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-section-compact:last-child {
    border-bottom: none !important;
}

/* Tighter grids */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 4px !important;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .league-grid-compact {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 4px !important;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-grid.fire-grid {
    grid-template-columns: repeat(4, 1fr) !important;
}

body.page-weekly-lineup #filter-date.th-filter-dropdown.weekly-lineup-filter-dropdown .filter-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 4px !important;
}

/* Full-width "All" buttons */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-segment="all"],
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-market="all"],
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-model="all"],
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-odds="all"],
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-edge="all"],
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-fire="all"] {
    grid-column: 1 / -1;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .league-chip[data-league="all"] {
    grid-column: 1 / -1;
}

/* Compact, high-contrast buttons */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt,
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .league-chip {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    background: rgba(30, 35, 45, 0.95) !important;
    color: #c8d7e6 !important;
    border-radius: 5px !important;
    padding: 6px 8px !important;
    min-height: 28px;
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.80rem !important;
    font-weight: 650 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: transform 140ms ease, background 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
    user-select: none;
}

/* Market odds: make ranges readable (single-column list + normal casing) */
body.page-weekly-lineup #filter-market.th-filter-dropdown.weekly-lineup-filter-dropdown .filter-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
}

body.page-weekly-lineup #filter-market.th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt {
    text-transform: none !important;
    letter-spacing: 0.02em !important;
    font-family: var(--font-ui, var(--font-body, 'Inter', sans-serif));
    font-weight: 650 !important;
}

body.page-weekly-lineup #filter-market.th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-odds="fav"],
body.page-weekly-lineup #filter-market.th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-odds="even"],
body.page-weekly-lineup #filter-market.th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt[data-odds="dog"] {
    font-variant-numeric: tabular-nums;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt:hover,
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .league-chip:hover {
    background: rgba(0, 214, 137, 0.18) !important;
    border-color: #00d689 !important;
    color: #fff !important;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt:active,
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .league-chip:active {
    transform: scale(0.98);
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.active,
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .league-chip.active {
    background: linear-gradient(135deg, rgba(0, 214, 137, 0.3) 0%, rgba(0, 180, 120, 0.35) 100%) !important;
    border-color: #00d689 !important;
    color: #00ff9d !important;
    box-shadow: 0 0 8px rgba(0, 214, 137, 0.3);
}

/* Preserve existing edge/fire tier hints (left accent) */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.edge-hot { border-left: 3px solid rgba(255, 68, 68, 0.85) !important; }
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.edge-good { border-left: 3px solid rgba(0, 214, 137, 0.85) !important; }
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.edge-ok { border-left: 3px solid rgba(255, 184, 0, 0.85) !important; }
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.edge-low { border-left: 3px solid rgba(110, 118, 129, 0.9) !important; }

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.fire-max,
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.fire-5 { border-left: 3px solid rgba(255, 68, 68, 0.85) !important; }
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.fire-4 { border-left: 3px solid rgba(255, 107, 53, 0.85) !important; }
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.fire-3 { border-left: 3px solid rgba(255, 184, 0, 0.85) !important; }
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.fire-2 { border-left: 3px solid rgba(110, 118, 129, 0.9) !important; }
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .filter-opt.fire-1 { border-left: 3px solid rgba(75, 85, 99, 0.9) !important; }

/* Search input (Matchup filter) - compact */
body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .team-search-input {
    width: 100% !important;
    padding: 8px 10px !important;
    border-radius: 5px !important;
    background: rgba(15, 20, 28, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    outline: none !important;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .team-search-input::placeholder {
    color: rgba(180, 195, 210, 0.6) !important;
}

body.page-weekly-lineup .th-filter-dropdown.weekly-lineup-filter-dropdown .team-search-input:focus {
    border-color: #00d689 !important;
    box-shadow: 0 0 0 2px rgba(0, 214, 137, 0.2) !important;
}

/* ==========================================================================
   ULTRA-COMPACT MICRO FILTER STYLES
   ========================================================================== */

/* ==========================================================================
   MICRO FILTER SYSTEM - High Contrast Compact Design
   Optimized for readability and efficient space usage
   ========================================================================== */

/* Micro filter container - tight, centered */
.micro-filter {
    padding: 8px !important;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 3px;
}

/* Micro row - tight horizontal layout */
.micro-row {
    display: flex;
    gap: 3px;
    justify-content: center;
    flex-wrap: nowrap;
}

.micro-row.micro-sub {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

/* Micro button - high contrast, compact */
.micro-btn {
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    background: rgba(30, 35, 45, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 4px;
    color: #c8d7e6;
    cursor: pointer;
    transition: all 0.1s ease;
    white-space: nowrap;
}

.micro-btn:hover {
    background: rgba(0, 214, 137, 0.25);
    border-color: #00d689;
    color: #fff;
}

.micro-btn.active {
    background: linear-gradient(135deg, rgba(0, 214, 137, 0.35) 0%, rgba(0, 180, 120, 0.4) 100%);
    border-color: #00d689;
    color: #00ff9d;
    box-shadow: 0 0 8px rgba(0, 214, 137, 0.3);
}

.micro-btn.xs {
    padding: 4px 7px;
    font-size: 10px;
}

/* Micro 2x2 grid - tight compact layout */
.micro-grid-2x2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3px;
}

/* League row - horizontal logo buttons */
.league-row {
    display: flex;
    gap: 4px;
    justify-content: center;
    flex-wrap: nowrap;
}

.league-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 5px;
    background: rgba(30, 35, 45, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.1s ease;
    font-size: 9px;
    font-weight: 800;
    color: #b0c4d8;
}

.league-btn:hover {
    background: rgba(0, 214, 137, 0.2);
    border-color: #00d689;
    transform: scale(1.05);
}

.league-btn.active {
    background: linear-gradient(135deg, rgba(0, 214, 137, 0.3) 0%, rgba(0, 180, 120, 0.35) 100%);
    border-color: #00d689;
    color: #00ff9d;
    box-shadow: 0 0 10px rgba(0, 214, 137, 0.35);
}

.league-btn img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    filter: brightness(1) saturate(0.9);
    transition: all 0.1s ease;
}

.league-btn:hover img,
.league-btn.active img {
    filter: brightness(1.2) saturate(1.1);
}

/* Micro search - high contrast input */
.micro-search {
    width: 100%;
    padding: 8px 10px;
    font-size: 12px;
    font-weight: 500;
    background: rgba(15, 20, 28, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 5px;
    color: #fff;
    outline: none;
}

.micro-search::placeholder {
    color: rgba(180, 195, 210, 0.6);
}

.micro-search:focus {
    border-color: #00d689;
    box-shadow: 0 0 0 2px rgba(0, 214, 137, 0.2);
}

/* Edge row - compact with colored indicators */
.edge-row {
    display: flex;
    gap: 3px;
    justify-content: center;
    flex-wrap: nowrap;
}

.edge-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    font-size: 10px;
    font-weight: 700;
    background: rgba(30, 35, 45, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    color: #c8d7e6;
    cursor: pointer;
    transition: all 0.1s ease;
}

.edge-btn:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}

.edge-btn.active {
    background: linear-gradient(135deg, rgba(0, 214, 137, 0.3) 0%, rgba(0, 180, 120, 0.35) 100%);
    border-color: #00d689;
    color: #00ff9d;
    box-shadow: 0 0 8px rgba(0, 214, 137, 0.25);
}

.edge-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.edge-dot.all { background: linear-gradient(135deg, #00d689, #ff6b35, #888); }
.edge-dot.hot { background: #ff4444; box-shadow: 0 0 6px rgba(255, 68, 68, 0.7); }
.edge-dot.good { background: #00d689; box-shadow: 0 0 4px rgba(0, 214, 137, 0.5); }
.edge-dot.ok { background: #ffb800; box-shadow: 0 0 4px rgba(255, 184, 0, 0.4); }
.edge-dot.low { background: #777; }

/* Fire row - compact with visual hierarchy */
.fire-row {
    display: flex;
    gap: 3px;
    justify-content: center;
    flex-wrap: nowrap;
}

.fire-btn {
    padding: 6px 10px;
    font-size: 10px;
    font-weight: 800;
    background: rgba(30, 35, 45, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    color: #c8d7e6;
    cursor: pointer;
    transition: all 0.1s ease;
}

.fire-btn:hover {
    background: rgba(255, 107, 53, 0.25);
    border-color: #ff6b35;
    color: #ffb090;
}

.fire-btn.active {
    background: linear-gradient(135deg, rgba(255, 107, 53, 0.35) 0%, rgba(255, 80, 40, 0.4) 100%);
    border-color: #ff6b35;
    color: #ffa366;
    box-shadow: 0 0 8px rgba(255, 107, 53, 0.35);
}

.fire-btn.max {
    background: rgba(255, 50, 50, 0.25);
    border-color: rgba(255, 68, 68, 0.4);
    color: #ff6666;
}

.fire-btn.max:hover,
.fire-btn.max.active {
    background: linear-gradient(135deg, rgba(255, 50, 50, 0.4) 0%, rgba(220, 30, 30, 0.45) 100%);
    border-color: #ff4444;
    color: #ff7777;
    box-shadow: 0 0 10px rgba(255, 68, 68, 0.4);
}

/* ==========================================================================
   SECURITY & ACCESSIBILITY ELEMENTS
   ========================================================================== */

/* Credential hint text */
.credential-hint {
    display: block;
    font-size: 0.65rem;
    color: rgba(180, 195, 210, 0.7);
    margin-top: 4px;
    font-style: italic;
    letter-spacing: 0.01em;
}

/* Noscript warning */
.noscript-warning {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.15) 0%, rgba(185, 28, 28, 0.12) 100%);
    border: 1px solid rgba(239, 68, 68, 0.4);
    border-radius: 8px;
    padding: 16px 20px;
    margin: 16px 24px;
    color: #fca5a5;
    text-align: center;
    font-size: 0.9rem;
}

.noscript-warning strong {
    color: #f87171;
    display: block;
    margin-bottom: 4px;
}

/* Loading state for table */
.loading-row {
    background: transparent !important;
}

.loading-cell {
    text-align: center;
    padding: 48px 24px !important;
    color: rgba(180, 200, 220, 0.8);
    font-size: 0.95rem;
}

.loading-spinner {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.loading-spinner::before {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid rgba(0, 214, 137, 0.3);
    border-top-color: rgba(0, 214, 137, 0.9);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ==========================================================================
   FILTER TOOLBAR (ft-* namespace)
   Left-aligned filters, right-aligned actions
   ========================================================================== */
.filter-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0 10px;
    margin: 0 24px;
    /* Above sticky table header (which sits around z-index ~110) */
    position: relative;
    z-index: 10050;
}

.ft-left, .ft-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Pills */
.ft-pill {
    padding: 5px 12px;
    font-size: 0.72rem;
    font-weight: 500;
    font-family: inherit;
    color: rgba(180, 195, 210, 0.85);
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.12s ease;
}

.ft-pill:hover {
    color: #fff;
    border-color: rgba(0, 214, 137, 0.4);
}

.ft-pill.active {
    color: #00e08a;
    border-color: rgba(0, 214, 137, 0.55);
    background: rgba(0, 214, 137, 0.1);
}

/* Dropdown */
.ft-dropdown {
    position: relative;
    z-index: 10060;
}

.ft-dropdown-btn {
    padding: 5px 12px;
    font-size: 0.72rem;
    font-weight: 500;
    font-family: inherit;
    color: rgba(180, 195, 210, 0.85);
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.12s ease;
}

.ft-dropdown-btn:hover,
.ft-dropdown-btn.open {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.25);
}

.ft-dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 4px;
    min-width: 140px;
    background: rgba(12, 18, 28, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    padding: 4px;
    /* Must sit above sticky header and table content */
    z-index: 10070;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

.ft-dropdown-menu.open {
    display: block;
}

.ft-dropdown-item {
    display: block;
    width: 100%;
    padding: 7px 12px;
    font-size: 0.72rem;
    font-weight: 500;
    font-family: inherit;
    color: rgba(200, 210, 220, 0.9);
    background: transparent;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-align: left;
    transition: background 0.1s ease;
}

.ft-dropdown-item:hover {
    background: rgba(255, 255, 255, 0.08);
}

.ft-dropdown-item.active {
    color: #00e08a;
    background: rgba(0, 214, 137, 0.12);
}

/* Divider between filter groups */
.ft-divider {
    width: 1px;
    height: 18px;
    background: rgba(255, 255, 255, 0.12);
    margin: 0 4px;
}

/* Clear button */
.ft-clear {
    padding: 5px 10px;
    font-size: 0.68rem;
    font-weight: 500;
    font-family: inherit;
    color: rgba(180, 180, 180, 0.6);
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.12s ease;
}

.ft-clear:hover {
    color: #ef5050;
    border-color: rgba(239, 68, 68, 0.4);
    background: rgba(239, 68, 68, 0.08);
}

/* Menu divider */
.ft-menu-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    margin: 4px 0;
}

/* Fetch button dropdown */
.ft-fetch-btn {
    color: #00d689 !important;
    background: rgba(0, 214, 137, 0.08) !important;
    border-color: rgba(0, 214, 137, 0.3) !important;
    font-weight: 600 !important;
}

.ft-fetch-btn:hover,
.ft-fetch-btn.open {
    background: rgba(0, 214, 137, 0.15) !important;
    border-color: rgba(0, 214, 137, 0.5) !important;
}

.ft-fetch-menu {
    right: 0;
    left: auto;
}

.ft-fetch-btn:disabled {
    opacity: 0.6;
    cursor: wait;
}

@media (max-width: 768px) {
    .filter-toolbar {
        flex-wrap: wrap;
        gap: 8px;
        margin: 0 12px;
    }
    .ft-left, .ft-right {
        gap: 6px;
    }
}