/* Shared mobile layout for Passing, Rushing and Receiving Intelligence.
   Loaded after the desktop intelligence styles on screens up to 991.98px. */

@media (max-width: 991.98px) {
    .ri-research-header {
        padding-top: 1.15rem;
        padding-bottom: 1.15rem;
    }

    .ri-header-grid {
        gap: 1rem;
    }

    .ri-title-block h1 {
        margin-bottom: .55rem;
        font-size: clamp(2.15rem, 9vw, 3rem);
        line-height: 1;
    }

    .ri-title-block p {
        margin-bottom: 0;
        font-size: .78rem;
        line-height: 1.55;
    }

    .ri-dataset-strip {
        gap: 0;
    }

    .ri-dataset-item {
        min-height: 58px;
        padding: .68rem .75rem;
    }

    .ri-dataset-item span {
        margin-bottom: .18rem;
    }

    .ri-toolbar {
        gap: .65rem;
        padding: .85rem;
    }

    .ri-filter-field {
        gap: .28rem;
    }

    .ri-filter-field select,
    .ri-search-field input,
    .ri-reset-button {
        min-height: 42px;
    }

    .ri-analysis-tabs,
    .ri-trend-tabs,
    .ri-baseline-tabs {
        display: flex;
        flex-wrap: nowrap;
        gap: .28rem;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .ri-analysis-tabs::-webkit-scrollbar,
    .ri-trend-tabs::-webkit-scrollbar,
    .ri-baseline-tabs::-webkit-scrollbar {
        display: none;
    }

    .ri-analysis-tab,
    .ri-trend-tab,
    .ri-baseline-tab {
        flex: 0 0 auto;
        min-height: 34px;
        padding: .42rem .7rem;
        scroll-snap-align: start;
        font-size: .62rem;
    }
}

@media (max-width: 620px) {
    /* The analytical table remains the primary mobile experience. */
    .ri-table-frame,
    .ri-table-frame[hidden] {
        display: block !important;
    }

    .ri-card-view,
    .ri-card-view[hidden] {
        display: none !important;
    }

    .ri-summary-actions {
        display: none !important;
    }

    .ri-summary-bar {
        min-height: 48px;
        padding: .7rem .75rem;
    }

    .ri-summary-title {
        font-size: .64rem;
    }

    .ri-table-scroll {
        height: min(72vh, 690px);
        min-height: 470px;
        overflow: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .ri-table-scroll::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }

    .ri-main-grid {
        font-size: .67rem;
    }

    .ri-main-grid th,
    .ri-main-grid td {
        height: 41px;
        padding: .42rem .52rem;
    }

    .ri-group-row th {
        height: 28px;
        font-size: .54rem;
        letter-spacing: .075em;
    }

    .ri-column-row th {
        height: 36px;
        font-size: .61rem;
    }

    /* Keep only Player frozen and deliberately narrow. Team and Pos scroll. */
    .ri-sticky-col,
    .ri-player-col,
    body[data-page="passing-intelligence"] .ri-main-grid--categories .ri-player-col,
    body[data-page="passing-intelligence"] .ri-main-grid--categories tbody td:first-child {
        width: 150px !important;
        min-width: 150px !important;
        max-width: 150px !important;
    }

    .ri-player-cell {
        gap: .42rem;
        min-width: 0;
    }

    .ri-player-position {
        width: 28px;
        min-width: 28px;
        height: 28px;
        padding: 0;
        font-size: .57rem;
    }

    .ri-player-name {
        min-width: 0;
        max-width: 104px !important;
    }

    .ri-player-link {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: .69rem;
    }

    .ri-player-name small,
    .ri-player-cell small {
        font-size: .54rem;
    }

    /* Do not freeze Position beside Player in team views on a phone. */
    body[data-page="receiving-intelligence"] .ri-main-grid--team .ri-team-pos-col,
    body[data-page="rushing-intelligence"] .ri-main-grid--team .ri-team-pos-col {
        position: static !important;
        left: auto !important;
        min-width: 48px;
        box-shadow: none !important;
    }

    body[data-page="receiving-intelligence"] .ri-main-grid--team,
    body[data-page="rushing-intelligence"] .ri-main-grid--team {
        --ri-team-player-width: 150px;
    }

    .ri-grid-footer {
        gap: .65rem;
        padding: .85rem .75rem;
        font-size: .63rem;
    }
}

@media (max-width: 620px) {
    /* Overview group header: anchor Identity directly above the frozen Player column. */
    .ri-group-row .ri-mobile-identity-group {
        position: sticky !important;
        left: 0 !important;
        z-index: 40 !important;
        width: 150px;
        min-width: 150px;
        max-width: 150px;
        background: #111718;
        box-shadow: 1px 0 0 var(--ri-grid-line, rgba(255, 255, 255, .12));
    }

    .ri-group-row .ri-mobile-team-pos-group {
        min-width: 96px;
        background: #111718;
    }
}


@media (max-width: 479.98px) {
    .ri-sticky-col,
    .ri-player-col,
    body[data-page="passing-intelligence"] .ri-main-grid--categories .ri-player-col,
    body[data-page="passing-intelligence"] .ri-main-grid--categories tbody td:first-child {
        width: 142px !important;
        min-width: 142px !important;
        max-width: 142px !important;
    }

    .ri-player-name {
        max-width: 96px !important;
    }

    body[data-page="receiving-intelligence"] .ri-main-grid--team,
    body[data-page="rushing-intelligence"] .ri-main-grid--team {
        --ri-team-player-width: 142px;
    }

    .ri-group-row .ri-mobile-identity-group {
        width: 142px;
        min-width: 142px;
        max-width: 142px;
    }
}


@media (max-width: 991.98px) {
    .ri-mobile-team-pos-group { display: none !important; }
    .ri-group-row .ri-overview-identity-group {
        position: sticky !important;
        left: 0 !important;
        z-index: 40 !important;
        width: 150px;
        min-width: 150px;
        max-width: 150px;
        background: var(--ri-surface-strong, #111819);
    }
}

@media (max-width: 479.98px) {
    .ri-group-row .ri-overview-identity-group {
        width: 142px;
        min-width: 142px;
        max-width: 142px;
    }
}