/*
 * Sport Plugin host-page responsive containment
 * Prevents fixed-width odds widgets from expanding the WordPress document on
 * narrow screens. The widget remains full-width and any genuinely wide table
 * scrolls inside its own region instead of forcing Safari to zoom the page.
 */
#scrollIframe,
#scrollIframe.tm_12-scroll,
#scrollIframe.tm_12-scrollIframe,
#scrollIframe.sport-optimized {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    box-sizing: border-box !important;
    container-type: inline-size;
    contain: layout inline-size;
    isolation: isolate;
    position: relative !important;
    display: block !important;
    overflow-x: hidden !important;
}

#scrollIframe *,
#scrollIframe *::before,
#scrollIframe *::after {
    box-sizing: border-box;
}

/* The server-rendered snapshot is the first thing Safari measures. Keep every
   fallback layer inside the shortcode's own formatting context. */
body #scrollIframe .sport-ssr-loader,
body #scrollIframe .sport-ssr-fallback,
body #scrollIframe .sport-ssr-table-wrap,
body #scrollIframe #fake_iframe6in1,
body #scrollIframe #iframe_6in1 {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

body #scrollIframe .sport-ssr-table-wrap {
    overflow-x: hidden !important;
    contain: layout inline-size paint;
}

body #scrollIframe table.sport-ssr-table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Override legacy 802px/960px roots bundled with the data provider. */
body #scrollIframe .mcontent > #main > #min,
body #scrollIframe #main > #min,
body #scrollIframe #soccer,
body #scrollIframe #homepage,
body #scrollIframe #homepage.mcontent,
body #scrollIframe .mcontent,
body #scrollIframe #main,
body #scrollIframe #appHome,
body #scrollIframe #app6in1,
body #scrollIframe #rate_iframe,
body #scrollIframe #result_iframe,
body #scrollIframe #fixture_iframe,
body #scrollIframe #rank_iframe,
body #scrollIframe #iframe_6in1,
body #scrollIframe .fake_iframe {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Wide tables may scroll inside the plugin, never at document level. */
#scrollIframe .sport-ssr-table-wrap,
#scrollIframe #mintable,
#scrollIframe #live,
#scrollIframe .table-view,
#scrollIframe .data-sync,
#scrollIframe .table-responsive,
#scrollIframe .odds-table-scroll {
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

@media screen and (max-width: 900px) {
    #scrollIframe,
    #scrollIframe.tm_12-scroll,
    #scrollIframe.tm_12-scrollIframe,
    #scrollIframe.sport-optimized {
        overflow-x: clip !important;
    }

    body #scrollIframe .sport-ssr-table-wrap,
    body #scrollIframe .fake_iframe,
    body #scrollIframe #fake_iframe6in1,
    body #scrollIframe #iframe_6in1,
    body #scrollIframe .table-view,
    body #scrollIframe #mintable {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        transform: none !important;
        zoom: 1 !important;
    }

    /* The legacy mobile bundle incorrectly creates a 371px + 1fr grid. */
    body #scrollIframe #homepage .game-rate #game-rate {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        gap: 0 !important;
    }

    body #scrollIframe #homepage .game-rate #game-rate > *,
    body #scrollIframe #homepage .game-rate #game-rate .live-frame,
    body #scrollIframe #homepage .game-rate #game-rate #tableCore,
    body #scrollIframe #homepage .game-rate #game-rate .container-sp,
    body #scrollIframe #homepage .game-rate #game-rate .box-infmtch,
    body #scrollIframe #homepage .game-rate #game-rate .ov {
        grid-column: auto !important;
        grid-row: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    /* Keep the mobile league selector inside the widget. */
    body #scrollIframe #filter-box-on-mobile #sixinoneFilterLeague {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        right: auto !important;
        left: 0 !important;
        transform: none !important;
    }

    body #scrollIframe img,
    body #scrollIframe svg,
    body #scrollIframe video,
    body #scrollIframe canvas,
    body #scrollIframe iframe {
        max-width: 100% !important;
    }
}

@supports not (overflow: clip) {
    @media screen and (max-width: 900px) {
        #scrollIframe,
        #scrollIframe.tm_12-scroll,
        #scrollIframe.tm_12-scrollIframe,
        #scrollIframe.sport-optimized {
            overflow-x: hidden !important;
        }
    }
}
