<?php

function save_config_rank_data()
{
    $upload_dir = wp_upload_dir(); // Lấy đường dẫn thư mục uploads
    $json_file = $upload_dir['basedir'] . '/sport-plugin/config-rank.js';

    // Kiểm tra quyền ghi vào thư mục uploads
    if (is_writable(dirname($json_file))) {
        // Xóa tệp cũ nếu có
        if (file_exists($json_file)) {
            unlink($json_file);
        }

        // Tạo và ghi dữ liệu JSON vào tệp
        $json_data = '
            window.isStandingView = true;
            // addEventListener("load", (event) => {
            //     const titleElement = document.getElementById("TitleLeft");
            //     if (titleElement) {
            //         titleElement.innerHTML = titleElement.innerHTML.replace("Lịch thi đấu", "Bảng xếp hạng");
            //     }
            // });
        ';

        file_put_contents($json_file, $json_data);

        ?>
        <script src="<?= home_url() . '/wp-content/uploads/sport-plugin/config-rank.js' ?>" defer></script>
        <?php

    } else {
        // Nếu không có quyền ghi, hiển thị thông báo
        error_log("Không thể ghi vào thư mục uploads để tạo tệp config-rank.js.");
    }
}

function bongdako_shortcode_rank($atts)
{
    $atts = shortcode_atts(
        array(
            'type' => 0,
        ),
        $atts
    );

    $type = $atts['type'];

    $saved_bgcolor_rank = get_option('bg_color_rank');
    $assets = plugin_dir_url(__FILE__) . '/';
    $assets_root = trailingslashit(dirname(dirname(dirname(plugin_dir_url(__FILE__))))) . 'assets/';

    $font = get_option('typography_main_rank', []);
    $data_leagues = get_option('hot_leagues_list', []) ?? []; // mảng các id cần map

    // Lấy dữ liệu mới nhất, bỏ qua cache
    $league_data = bongdako_get_leagues();

    // Mảng chứa dữ liệu map từ $league_data
    $mapped_leagues = [];

    foreach ($data_leagues as $id) {
        // Kiểm tra xem id có tồn tại trong $league_data không
        if (isset($league_data[$id])) {
            // Chuyển đổi dữ liệu thành định dạng mong muốn
            $league = $league_data[$id];

            $mapped_leagues[] = [
                $league['type'], // Ví dụ "cupmatch"
                $league['id'],   // ID của league
                $league['name'], // 'left_menu.FIFA_Club_World_Cup' (thay tên theo cách bạn muốn)
                $league['slug'], // "fifa-club-world-cup"
                str_replace("/assets/upload/football/league_match/images/", "", $league['logo']), // Đường dẫn tới logo
                $league['subSclassID'] ?? 0
            ];
        }
    }

    $first_data = $mapped_leagues[0] ?? null; // Lấy dữ liệu đầu tiên nếu có
    $league_data = [
        'name' => '2025 AFF U23 Championship',
        'id' => 2319,
        'season' => '2025',
        'type' => 'cupmatch',
        'type_link' => 'c',
        'img' => '1h8jmpat5ns.png'
    ];

    if (!empty($first_data)) {
        $league_data['id'] = $first_data[1]; // Chuyển id từ mảng đầu tiên
        $league_data['name'] = $first_data[2]; // Chuyển tên từ mảng đầu tiên
        $league_data['type'] = $first_data[0]; // Chuyển type từ mảng đầu tiên
        $league_data['img'] = $first_data[4]; // Chuyển logo từ mảng đầu tiên

        if ($first_data[0] != 'cupmatch') {
            $league_data['type_link'] = 's';
        }
    }


    $js_content = bongdako_fetch_and_save_js_data('/jsdata/leagueseason/sea' . $league_data['id'] . '.js', 'sport-season-data-' . $league_data['id'] . '.js');

    preg_match('/var arrSeason = (\[.*?\]);/', $js_content, $matches);

    if (!empty($matches[1])) {
        // Chuyển dấu nháy đơn thành nháy đôi để biến thành chuỗi JSON hợp lệ
        $json_str = str_replace("'", '"', $matches[1]);

        // Giải mã chuỗi JSON
        $season_str = json_decode($json_str, true)[0];

        if (!empty($season_str)) {
            $league_data['season'] = $season_str;
        }
    }
    $league_id = $league_data["id"];
    $league_img = $league_data['img'];
    $arrLeauge = json_encode($mapped_leagues, JSON_UNESCAPED_UNICODE);

    bongdako_fetch_and_save_js_data('/jsdata/matchResult/' . $league_data['season'] . '/' . $league_data['type_link'] . $league_data['id'] . '_vn.js', 'sport-result-data-' . $league_data['id'] . '.js');
    $js_content = <<<JS
        var _config = {};
        Object.defineProperties(_config, {
            defaultOddsFormat: {
                value: parseInt('1')
            },
            defaultOddsType: {
                value: 'O'
            },
            defaultCompanyID: {
                value: parseInt('31')
            },
            defaultEuroCompanyID: {
                value: parseInt('474')
            }
        });
        var lang = 2;
        var jh = new Object();
        var teamHelper = new Object();
        var selectSeason = '{$league_data["season"]}';
        var currentSeason = '{$league_data["season"]}';
        var selectRound = -1;
        var SclassID = '{$league_data["id"]}';
        var SubSclassID = 0;
        var forLoc = 1;
        var isConference = false;
        var _leaTitleTail = "";
        var disableRouterPush = true;
        window.typeLeague = {$type}
        window._imgS3 = "https://img.winfast.dev";
       
        window.leagueData = JSON.stringify({
            "titleLeague": 'Lịch thi đấu bóng đá {$league_data["name"]}',
            "title": 'Lịch thi đấu bóng đá {$league_data["name"]}',
            "layout": '{$league_data["type"]}',
            "SclassID": {$league_id},
            "id": {$league_id},
            "SubSclassID": "0",
            "selectedSeason": -1,
            "imgLeague": "<img alt='{$league_data["name"]}' src='" + window._imgS3 + "/assets/upload/football/league_match/images/{$league_img}' width='52' align='middle'>"
        });
    JS;
    if (!empty($first_data)) {
        $js_content .= <<<JS
            window.arrLeauge = {$arrLeauge}
        JS;
    }
    bongdako_save_js_data($js_content, 'rank-options-' . $league_id . '.js');
    ob_start();
    ?>

    <?php if ($type == 2) save_config_rank_data(); ?>


    <?php
    static $sport_plugin_rank_existed = false;
    if (!$sport_plugin_rank_existed) {
        ?>
        <link rel="preload" as="style"
              href="<?= BONGDAKO_BUILD ?>css/assets/css/iframe_rank.css?v=<?= ASSETS_VERSION ?>"/>
        <link rel="stylesheet" href="<?= BONGDAKO_BUILD ?>css/assets/css/iframe_rank.css?v=<?= ASSETS_VERSION ?>"/>
        <?php
        bongdako_layout_assets();
        add_action('wp_footer', function () use ($league_id) {
            bongdako_assets_js();

            ?>
            <script src="<?= home_url() . '/wp-content/uploads/sport-plugin/rank-options-' . $league_id . '.js?v=' . ASSETS_VERSION ?>"
                    defer></script>
            <script src="<?= home_url() . '/wp-content/uploads/sport-plugin/sport-season-data-' . $league_id . '.js?v=' . ASSETS_VERSION ?>"
                    defer></script>
            <script src="<?= home_url() . '/wp-content/uploads/sport-plugin/sport-result-data-' . $league_id . '.js?v=' . ASSETS_VERSION ?>"
                    defer></script>
            <script src="<?= BONGDAKO_PLUGIN_DIR_URL ?>/layouts/shortcode/rank/leagueodds.js?v=<?= ASSETS_VERSION ?>"
                    defer></script>
            <script type="module" src="<?= BONGDAKO_BUILD ?>rank_iframe/assets/js/index.js?v=<?= ASSETS_VERSION ?>"
                    defer></script>
            <script defer>
                document.addEventListener('DOMContentLoaded', function () {
                    var typeWrap = $('.wrap-league-1 #TitleLeft .ttd');
                    if (typeWrap.length > 0) {
                        var dataText = $('#TitleLeft .ttd').text();
                        typeWrap.text(dataText.replace('Bảng xếp hạng', 'Lịch thi đấu'));
                    }
                    $('.top-nav-vuejs-wrap .swiper-slide .item-sw#boxl-item-<?= $league_id?>').addClass('on');
                    $('#vue-left-sidebar .box-league ul li a').on('click', function () {
                        $('#vue-left-sidebar .box-league ul li a').removeClass('on');
                        $(this).addClass('on');

                    });

                    $('.top-nav-vuejs-wrap .swiper-slide .item-sw').on('click', function () {
                        $('.top-nav-vuejs-wrap .swiper-slide .item-sw').removeClass('on');
                        $(this).addClass('on');
                    });

                    let text2 = $('.ttd').text();
                    if (!text2) {
                        $('.ttd').text($('.ttd').data('default'))
                    }
                });
            </script>
            <?php
        });

        $sport_plugin_rank_existed = true;
    }
    ?>

    <link href="<?= $assets ?>style.css?v=<?= ASSETS_VERSION ?>" rel="stylesheet">

    <style>
        .outteam,
        .score,
        .team-ins,
        .td-home,
        .td-away,
        .td-score ,
        table tr td a{
            pointer-events: none;
        }

        #scrollIframe #info.vue #i_main {
            box-sizing: border-box;
        }

        #scrollIframe .data-sync.top-league #Table3 tr td {
            text-align: center;
        }

        #scrollIframe .data-sync.top-league #Table3 tr td .box-set {
            margin-left: auto;
            margin-right: auto;
        }

        #scrollIframe #info.version-2.data-sync.top-league {
            padding: 0px !important;
            background-color: #e5e5e5 !important;
        }
        #scrollIframe #info.vue #i_main{
            padding: 0 !important;
        }

        #scrollIframe .second-version #SubSelectDiv {
            display: block !important;
        }

        #scrollIframe .version-2 #i_main {
            background-color: #e5e5e5 !important;
        }

        .wrap-rank-iframe {
            max-width: 1208px;
        }

        .wrap-rank-iframe #info.vue #main {
            gap: 16px;
            justify-content: unset;
        }

        .wrap-rank-iframe {
            max-width: 1208px !important;
        }

        #rank_iframe {
            margin: unset;
            width: 100%;
            display: flex;
            flex-direction: column;
        }

        #scrollIframe #rank_iframe .odds {
            width: 100%;
            box-sizing: border-box;
        }

        #scrollIframe #rank_iframe .odds:hover {
            background: initial !important;
        }

        #scrollIframe .allno {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/images/icon-trash.svg") !important;
        }

        #scrollIframe .data-sync .radio-check input[type=radio] {
            -webkit-appearance: auto;
            -moz-appearance: auto;
            appearance: auto;
        }

        #scrollIframe #table_live tr i.icon.iconfont.icon-font-collect-off::before {
            content: "";
            background-image: url("<?= IMGS3_PLUGINS ?>/images/rating-light.png");
            background-size: contain;
            background-repeat: no-repeat;
        }

        #scrollIframe #table_live tr.Leaguestitle i.icon.iconfont.icon-font-collect-off::before {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/football-vn/images/rating-title-light.png");
        }

        .dark #scrollIframe .second-version .analyze-icon::before {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/football-vn/images/icon-analytics-dark.svg");
        }

        #scrollIframe .second-version .odds-icon, .second-version .odds-icon1x2 {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/football-vn/images/SquareTransferVertical.svg");
            cursor: pointer;
        }

        .dark #scrollIframe .second-version .analyze-icon {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/football-vn/images/data-analytics.svg");
        }

        .dark #scrollIframe .second-version .odds-icon, .dark .second-version .odds-icon1x2 {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/football-vn/images/SquareTransferVertical.svg");
        }

        #scrollIframe .second-version .analyze-icon::before {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/images/icon-analytics.svg");
        }

        .dark #scrollIframe .second-version .analyze-icon::before {
            background-image: url("<?= IMGS3_PLUGINS ?>/assets/images/icon-analytics-dark.svg");
        }

        <?php if ($saved_bgcolor_rank): ?>
        #scrollIframe.rank-iframe {
            background-color: <?php echo esc_attr($saved_bgcolor_rank); ?> !important;
        }

        #scrollIframe.rank-iframe #tools {
            background-color: <?php echo esc_attr($saved_bgcolor_rank); ?> !important;
        }

        #scrollIframe.rank-iframe #appHome {
            background-color: <?php echo esc_attr($saved_bgcolor_rank); ?> !important;
        }

        <?php else: ?>
        #scrollIframe.rank-iframe {
            background-color: #e6e6e6 !important;
        }

        #scrollIframe.rank-iframe #tools {
            background-color: #e6e6e6 !important;
        }

        #scrollIframe.rank-iframe #appHome {
            background-color: #e6e6e6 !important;
        }

        <?php endif; ?>
        html body .wrap-league-1 #info #left,
        html body .wrap-league-2 #info #left,
        #view-tap-top,
        html #scrollIframe .second-version .sub_menu.menu {
            display: none !important;
        }

        /* html #scrollIframe.wrap-league-0 .second-version .sub_menu.menu#view-tap-top {
            display: block !important;
        } */

        #scrollIframe .analyze-icon:hover:after, {
            content: "<?php esc_html_e('Phân tích', 'sport') ?>" !important;
        }
    </style>

    <style>
        #scrollIframe #main {

        #Table3 > thead {
            border-bottom: 1px solid #ccc;
        }

        }

        #scrollIframe.wrap-iframe-rank *, #scrollIframe.wrap-iframe-rank input::placeholder {
            font-family: <?php echo $font['font-family'] ?? ""; ?> !important;
        }


        #scrollIframe #main, #scrollIframe .version-2 {
            width: 100% !important;
        }

        #scrollIframe {
            padding-left: 1px;
            padding-right: 1px;
        }

        #scrollIframe .top-nav-vuejs {
            max-width: 10000px !important;
        }

        div#i_main {
            padding-left: 5px;
        }

        body #scrollIframe.wrap-iframe-rank #min .tools li.filterLi2.xz .dropdown-toggle {
            background: transparent;
        }

        #scrollIframe .second-version tr.head-tr strong:not(.six-game) {
            display: block;
            text-align: center;
            line-height: 1.3;
        }

        #scrollIframe .second-version .rank-head td {
            text-align: center;
        }

        #rank_iframe {
            background: <?php echo get_option('background_item_color_rank'); ?> !important;
            background-color: <?php echo get_option('background_item_color_rank'); ?> !important;
        }

        #scrollIframe .version-2 #i_main {
            background: <?php echo get_option('background_item_2_color_rank'); ?> !important;
            background-color: <?php echo get_option('background_item_2_color_rank'); ?> !important;
        }

        .league-layout {
            background-color: <?php echo get_option('background_item_2_color_rank'); ?> !important;
        }

        #scrollIframe .top-nav-vuejs {
            background-color: <?php echo get_option('background_item_2_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank.wrap-iframe,
        body #scrollIframe.wrap-iframe-rank .match-list-head,
        body #scrollIframe.wrap-iframe-rank.resultIframe #tools,
        body #scrollIframe.wrap-iframe-rank.fixture-iframe #tools,
        body #scrollIframe.wrap-iframe-rank .Leaguestitle,
        body #scrollIframe.wrap-iframe-rank.fixture-iframe #appHome,
        body #scrollIframe.wrap-iframe-rank.rate_iframe #appHome,
        body #scrollIframe.wrap-iframe-rank.resultIframe #mintable,
        body #scrollIframe.wrap-iframe-rank.resultIframe #appHome,
        body #scrollIframe.wrap-iframe-rank.fixture-iframe #mintable {
            background: <?php echo get_option('background_color_rank'); ?> !important;
            background-color: <?php echo get_option('background_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .button-df.active,
        body #scrollIframe.wrap-iframe-rank #app6in1 .custom-select-02.show.button-df {
            border: 1px solid <?php echo get_option('background_main_color_rank'); ?> !important;
            background: <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        #scrollIframe .second-version .sub_menu.menu a.on,
        body #scrollIframe.wrap-iframe-rank .btn-item-now.active,
        body #scrollIframe.wrap-iframe-rank .tools .switch-view-btn span.on,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_ShowAll.on,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_FilterHot.on,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_FilterLea.on,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_FilterCdi.on,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_FilterCdi.active,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_ShowAll:hover,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_FilterHot:hover,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_FilterLea:hover,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li#li_FilterCdi:hover,
        body #scrollIframe.wrap-iframe-rank .filterLi2.xz .dropdown-toggle:hover,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li.on,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li.active,
        body #scrollIframe.wrap-iframe-rank #min .tools ul li:hover {
            background-color: <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank #showFilterBox .rbl .el-radio > input[type=radio]:checked + .el-radio-style, #scrollIframe .top-nav-vuejs .swiper-slide .on {
            background: <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank #showoptional2 .bts:nth-of-type(3) span input:checked + label {
            border: 1px solid <?php echo get_option('background_main_color_rank'); ?> !important;
            color: <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank #table_live tr.tds td .match-state,
        body #scrollIframe.wrap-iframe-rank .time-bx,
        body #scrollIframe.wrap-iframe-rank #main .idx-homepage td .scored-s.no-score {
            /*color: var(--text_sub_rank, #888) !important;*/
        }

        body #scrollIframe.wrap-iframe-rank .cup-match-tags a {
            background-color: <?php echo get_option('background_league_color_rank'); ?> !important;
            color: <?php echo get_option('text_league_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank #app6in1 .button-df:hover {
            border: 1px solid <?php echo get_option('background_main_color_rank'); ?> !important;
            background: <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .filter-select-rate,
        body #scrollIframe.wrap-iframe-rank .filter-select-company {
            border: 1px solid <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        #scrollIframe .data-sync .nav_select li.nav_selected {
            border-bottom: 1px solid <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        #scrollIframe .data-sync #Table3 tr td .box-set,
        body #scrollIframe.wrap-iframe-rank .live-match .odds.normal,
        body #scrollIframe.wrap-iframe-rank .bet-match-item-repeated:nth-child(2n) .bet-match-item .odds.normal,
        body #scrollIframe.wrap-iframe-rank #table_live .odds1,
        body #scrollIframe.wrap-iframe-rank #table_live .odds2,
        body #scrollIframe.wrap-iframe-rank #table_live .odds3,
        body #scrollIframe.wrap-iframe-rank #homepage .game-rate #game-rate .container-sp .table-core-odds-value .odds-number,
        body #scrollIframe.wrap-iframe-rank .odds-bg.odds-normal > span,
        body #scrollIframe.wrap-iframe-rank #game-rate .odds-number,
        body #scrollIframe.wrap-iframe-rank .odds.normal {
            background: <?php echo get_option('background_odd_color_rank'); ?> !important;
            background-color: <?php echo get_option('background_odd_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .odds:hover {
            background: <?php echo get_option('background_odd_hover_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .odds.down,
        body #scrollIframe.wrap-iframe-rank #table_live .odds1.resultColor,
        body #scrollIframe.wrap-iframe-rank #table_live .odds2.resultColor,
        body #scrollIframe.wrap-iframe-rank .odds2 > span.down,
        body #scrollIframe.wrap-iframe-rank .odds-bg.odds-normal > span.down,
        body #scrollIframe.wrap-iframe-rank #table_live .new-home-tr .odds1.odds-down,
        body #scrollIframe.wrap-iframe-rank #table_live .new_oddsChangePopup .popup-odds-change .odds-down,
        body #scrollIframe.wrap-iframe-rank #homepage .game-rate #game-rate .container-sp .table-core-odds-value .odds-number.odds-down,
        body #scrollIframe.wrap-iframe-rank #game-rate .odds-number.odds-down {
            background: <?php echo get_option('background_odd_down_rank'); ?> !important;
            background-color: <?php echo get_option('background_odd_down_rank'); ?> !important;
        }

        html body #scrollIframe.wrap-iframe-rank.wrap-iframe .mcontent .table-view .league-item .bet-match-list .bet-match-item-repeated .bet-match-item .bet-match-item-child .odds-title-item .odds.normal.down:hover {
            background: <?php echo get_option('background_odd_down_hover_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .odds.up,
        body #scrollIframe.wrap-iframe-rank #table_live .odds3.resultColor,
        body #scrollIframe.wrap-iframe-rank .odds-bg.odds-normal > span.up,
        body #scrollIframe.wrap-iframe-rank #table_live .new-home-tr .odds1.odds-up,
        body #scrollIframe.wrap-iframe-rank #homepage .game-rate #game-rate .container-sp .table-core-odds-value .odds-number.odds-up,
        body #scrollIframe.wrap-iframe-rank #table_live .new_oddsChangePopup .popup-odds-change .odds-up,
        body #scrollIframe.wrap-iframe-rank .odds2 > span.up,
        body #scrollIframe.wrap-iframe-rank #game-rate .odds-number.odds-up {
            background: <?php echo get_option('background_odd_up_rank'); ?> !important;
            background-color: <?php echo get_option('background_odd_up_rank'); ?> !important;
        }

        html body #scrollIframe.wrap-iframe-rank.wrap-iframe .mcontent .table-view .league-item .bet-match-list .bet-match-item-repeated .bet-match-item .bet-match-item-child .odds-title-item .odds.normal.up:hover {
            background: <?php echo get_option('background_odd_up_hover_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .live-status {
            color: <?php echo get_option('text_live_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .score-lst .score,
        #scrollIframe .data-sync #Table3 tr td .score,
        body #scrollIframe.wrap-iframe-rank .handpoint.score-color b.match-finished,
        body #scrollIframe.wrap-iframe-rank #main .idx-homepage td.score-color b,
        body #scrollIframe.wrap-iframe-rank #main .idx-homepage .handpoint.score-color b.match-not-finished {
            color: <?php echo get_option('text_score_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .match-during-time.running, #scrollIframe .data-sync #Table3 tr td.match-time * {
            color: <?php echo get_option('text_time_color_rank'); ?> !important;
        }

        #scrollIframe .filterLi2.xz .dropdown-menu .dropdown-menu-inner .option.active, #scrollIframe .filterLi2.xz .dropdown-menu .dropdown-menu-inner .option:hover {
            color: <?php echo get_option('text_drop_color_rank'); ?> !important;
            background-color: <?php echo get_option('background_drop_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .toggle-bet {
            background: <?php echo get_option('background_button_more_bet_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .toggle-bet > div,
        #scrollIframe .second-version .sub_menu.menu a:not(.on):hover,
        body #scrollIframe.wrap-iframe-rank .toggle-bet span {
            color: <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        #scrollIframe.wrap-iframe-rank .toggle-bet.active > div, #scrollIframe.wrap-iframe-rank .toggle-bet.active span {
            color: #fff !important;
        }

        body #scrollIframe.wrap-iframe-rank.wrap-iframe,
        body #scrollIframe.wrap-iframe-rank.wrap-iframe td,
        body #scrollIframe.wrap-iframe-rank .odds-title-item,
        body #scrollIframe.wrap-iframe-rank .team-box > a,
        body #scrollIframe.wrap-iframe-rank #table_live .upper-live-titlez td,
        body #scrollIframe.wrap-iframe-rank #table_live tr.upper-live-title td,
        body #scrollIframe.wrap-iframe-rank #table_live #CompanySel #dropSelect,
        body #scrollIframe.wrap-iframe-rank #table_live tr td,
        body #scrollIframe.wrap-iframe-rank #table_live tr:not(.Leaguestitle):not(.scoretitle) td[name="timeData"],
        body #scrollIframe.wrap-iframe-rank .filterLi2.xz .dropdown-toggle,
        body #scrollIframe.wrap-iframe-rank #table_live tr.scoretitle td,
        body #scrollIframe.wrap-iframe-rank #min .tools li,
        body #scrollIframe.wrap-iframe-rank #game-rate .table-score-container .odds-name,
        body #scrollIframe.wrap-iframe-rank #game-rate span.text-uppercase,
        body #scrollIframe.wrap-iframe-rank #main #table_live tr[id^=tr1_] td.toolimg span,
        body #scrollIframe.wrap-iframe-rank #table_live .status-time-match span,
        body #scrollIframe.wrap-iframe-rank #main #table_live tr[id^=tr1_].tds td[id^=ht_] a,
        body #scrollIframe.wrap-iframe-rank #main #table_live tr[id^=tr1_].tds td[id^=gt_] a,
        body #scrollIframe.wrap-iframe-rank.fixture-iframe #table_live tr.tds td,
        body #scrollIframe.wrap-iframe-rank #fixture_iframe .team-name,
        body #scrollIframe.wrap-iframe-rank #main #tableCoreSP .status-time-match {
            color: <?php echo get_option('text_main_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .odds,
        #scrollIframe .data-sync #Table3 tr td .box-set,
        #scrollIframe .data-sync #Table3 tr td .box-set,
        body #scrollIframe.wrap-iframe-rank #table_live .odds1,
        body #scrollIframe.wrap-iframe-rank #table_live .odds2,
        body #scrollIframe.wrap-iframe-rank #table_live .odds3,
        body #scrollIframe.wrap-iframe-rank #homepage .game-rate #game-rate .container-sp .table-core-odds-value .odds-number,
        body #scrollIframe.wrap-iframe-rank .odds-bg.odds-normal > span,
        body #scrollIframe.wrap-iframe-rank #table_live .new-home-tr .odds1.odds-down,
        body #scrollIframe.wrap-iframe-rank #table_live .new-home-tr .odds1.odds-up,
        body #scrollIframe.wrap-iframe-rank #table_live .new_oddsChangePopup .popup-odds-change .odds-up,
        body #scrollIframe.wrap-iframe-rank #table_live .new_oddsChangePopup .popup-odds-change .odds-down,
        body #scrollIframe.wrap-iframe-rank #game-rate .odds-number {
            color: <?php echo get_option('text_odd_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .league-name,
        body #scrollIframe.wrap-iframe-rank.resultIframe .football-team-name,
        body #scrollIframe.wrap-iframe-rank.fixture-iframe .football-team-name,
        body #scrollIframe.wrap-iframe-rank .football-team-name,
        body #scrollIframe.wrap-iframe-rank .LGname,
        body #scrollIframe.wrap-iframe-rank.rate_iframe .football-team-name {
            color: <?php echo get_option('text_title_league_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank #homepage .game-rate #live #tr_upper-live-title td {
            background: <?php echo get_option('background_item_2_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .wrap-loadmore .load-more-btn {
            background-color: <?php echo get_option('background_main_color_rank'); ?> !important;
            background-image: url(/wp-content/plugins/sport-plugin/assets/images/double-alt-arrow-down.svg);
            background-repeat: no-repeat;
            background-position: right 20px top 6px;
        }

        body #scrollIframe.wrap-iframe-rank .ods-detail-item {
            background: <?php echo get_option('background_more_bet_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .toggle-bet.active,
        body #scrollIframe.wrap-iframe-rank #game-rate .btn-live-chanel,
        body #scrollIframe.wrap-iframe-rank #homepage .game-rate #live .btn-live {
            background: <?php echo get_option('background_main_color_rank'); ?> !important;
        }

        body .score-detail .secont-half,
        body #scrollIframe.wrap-iframe-rank #table_live .corner-text {
            color: <?php echo get_option('text_score_corner_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank #table_live tr.tds td,
        body #scrollIframe.wrap-iframe-rank #table_live tr:not(.Leaguestitle):not(.scoretitle),
        body #scrollIframe.wrap-iframe-rank .league-item-head,
        body #scrollIframe.wrap-iframe-rank .bet-match-item-repeated .bet-match-item,
        body #scrollIframe.wrap-iframe-rank #table_live .upper-live-titlez,
        body #scrollIframe.wrap-iframe-rank #table_live tr.scoretitle td,
        body #scrollIframe.wrap-iframe-rank #game-rate .core-container,
        body #scrollIframe.wrap-iframe-rank #game-rate #tableCore,
        body #scrollIframe.wrap-iframe-rank #main #table_live tr[id^=tr1_],
        body #scrollIframe.wrap-iframe-rank .match-box {
            background-color: <?php echo get_option('background_item_color_rank'); ?> !important;
            background: <?php echo get_option('background_item_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .bet-match-item-repeated:nth-child(2n) .bet-match-item,
        body #scrollIframe.wrap-iframe-rank #main .idx-homepage #table_live tr[id^=tr1_] .league-detail-mobile,
        body #scrollIframe.wrap-iframe-rank #main .idx-favorite #table_live tr[id^=tr1_] .league-detail-mobile {
            background: <?php echo get_option('background_item_2_color_rank'); ?> !important;
            background-color: <?php echo get_option('background_item_2_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .grey,
        body #scrollIframe.wrap-iframe-rank .odds.no-bg,
        body #scrollIframe.wrap-iframe-rank .odds.no-bg.down {
            color: <?php echo get_option('text_odd_option_color_rank'); ?> !important;
        }

        body #scrollIframe.wrap-iframe-rank .team-hg, #scrollIframe .bftab .rank,
        body #scrollIframe.wrap-iframe-rank #main #table_live .new-home-tr .odds1::before,
        body #scrollIframe.wrap-iframe-rank #homepage .game-rate #game-rate .container-sp .table-core-odds-value .odds-number::before,
        body #scrollIframe.wrap-iframe-rank #main #table_live tr[id^=tr1_].tds .status-time-sched {
            color: <?php echo get_option('text_sub_color_rank'); ?> !important;
        }

        #scrollIframe .second-version table#Table3 .box-set {
            color: <?php echo get_option('text_odd_color_rank','#070f03'); ?> !important;
        }

        @media (min-width: 1001px) {
        <?php if (get_option('tags_cup_rank') === "medium"){?>
            #scrollIframe .cup-match-tags a {
                font-size: 13px;
                line-height: 16px;
                padding: 6px 9px;
            }

        <?php }?>
        <?php if (get_option('tags_cup_rank') === "small"){?>
            #scrollIframe .cup-match-tags a {
                font-size: 12px;
                line-height: 14px;
                padding: 5px 7px;
            }

        <?php }?>

        <?php if (get_option('search_team_rank') === "medium"){?>
            #scrollIframe #iframe_6in1 .filter-box .filter-search-row .filter-search-name input {
                padding: 6px 12px 5px;
            }

            #scrollIframe .filter-search-name input {
                padding: 12px;
                line-height: 16px;
                font-size: 12px;
            }

        <?php }?>
        <?php if (get_option('search_team_rank') === "small"){?>

            #scrollIframe #iframe_6in1 .filter-box .filter-search-row .filter-search-name input {
                padding: 5px 10px;
            }

            #scrollIframe .filter-search-name input {
                padding: 10px;
                line-height: 14px;
                font-size: 10px;
            }

        <?php }?>

        <?php if (get_option('search_league_rank') === "medium"){?>
            #scrollIframe #iframe_6in1 .filter-box .filter-search-row .filter-cup-match .filter-cup-match-box {
                height: 28px;
                padding: 5px 10px;
            }

            #scrollIframe .filter-cup-match .custom-select-02 .custom-select {
                font-size: 12px;
            }

            #scrollIframe .sixmix-container .filter-box #sixinoneFilterLeague {
                top: 32px;

            }

        <?php }?>
        <?php if (get_option('search_league_rank') === "small"){?>

            #scrollIframe #iframe_6in1 .filter-box .filter-search-row .filter-cup-match .filter-cup-match-box {
                height: 26px;
                padding: 5px 10px;
            }

            #scrollIframe .filter-cup-match .custom-select-02 .custom-select {
                font-size: 10px;
            }

            #scrollIframe .sixmix-container .filter-box #sixinoneFilterLeague {
                top: 30px;

            }

        <?php }?>

            #scrollIframe .odds-title-item.two-line-start {
                flex: 1 1 <?php echo get_option('odd_1_1_rank') ?>px;
                width: <?php echo get_option('odd_1_1_rank') ?>px;
            }

            #scrollIframe .odds-title-item.two-line-end {
                flex: 1 1 <?php echo get_option('odd_1_2_rank') ?>px;
                width: <?php echo get_option('odd_1_2_rank') ?>px;
            }

        <?php if (get_option('filter_date_rank') === "medium"){?>
            #scrollIframe .btn-item-now, #scrollIframe .btn-item-now.ttnow {
                padding: 6px;
            }

            #scrollIframe .filter-select-rate, #scrollIframe .filter-select-company {

                font-size: 12px;

                line-height: 22px;
                padding: 6px 10px;

            }

        <?php }?>
        <?php if (get_option('filter_date_rank') === "small"){?>

            #scrollIframe .btn-item-now, #scrollIframe .btn-item-now.ttnow {
                padding: 4px;
                min-height: 20px;
            }

            #scrollIframe .filter-select-rate, #scrollIframe .filter-select-company {
                font-size: 10px;
                line-height: 18px;
                padding: 5px 8px;

            }

        <?php }?>

            #scrollIframe #iframe_6in1 .info-teams {

                max-width: <?php echo get_option('team_w_rank')?>px;
            }

            #scrollIframe #table_live tr {
                height: <?php echo get_option('league-item-head_rank');?>
            }

        <?php if (get_option('action_size_sixinone') === "lager"){?>
            #scrollIframe .icon-14 {
                width: 18px;
                height: 18px;
            }

            #scrollIframe .icon-16 {
                width: 20px;
                height: 20px;
            }

        <?php }?>
        <?php if (get_option('action_size_sixinone') === "small"){?>

            #scrollIframe .icon-14 {
                width: 12px;
                height: 12px;
            }

            #scrollIframe .icon-16 {
                width: 14px;
                height: 14px;
            }

        <?php }?>
        }

        #scrollIframe #rank_iframe .td-detail .analyze-icon:hover:after ,#scrollIframe .league-layout .analyze-icon:hover::after{
            content: "<?php esc_html_e('Phân tích', 'sport') ?>" !important;
        }
        #scrollIframe #rank_iframe .td-detail .odds-icon:hover:after ,#scrollIframe .league-layout .odds-icon:hover::after{
            content: "<?php esc_html_e('Chi tiết', 'sport') ?>" !important;
        }
    </style>

    <div id="scrollIframe" class="wrap-iframe-rank wrap-iframe wrap-rank-iframe wrap-league-<?= $type ?> tm_12-scroll tm_12-league" data-type="<?= $type ?>">
        <div id="info" class="vue version-2 data-sync top-league league-container tm_12-info tm_12-container">
            <div id="breadcrumbs" class="hide tm_12-breadcrumbs"></div>
            <div id="main" class="main-home-page-mobile tm_12-main tm_12-mobile">
                <div id="left" class="home-page-left tm_12-left tm_12-sidebar">
                    <div id="vue-left-sidebar" class="tm_12-vue-sidebar"></div>
                </div>
                <div id="rank_iframe" class="index idx-homepage css-home-page home-page-mobile tm_12-rank tm_12-iframe"></div>
            </div>
        </div>
    </div>

    <script>
        document.addEventListener("DOMContentLoaded", function () {
            const el = document.querySelector('.option.cursor-pointer.active');
            if (el) el.click();
        });
    </script>
    <?php
    $content = ob_get_contents();
    ob_end_clean();
    return $content;
}

add_shortcode('bongdako_rank', 'bongdako_shortcode_rank');


function bongdako_fetch_and_save_js_data($url, $fileName)
{
    // Tạo URL đầy đủ với phiên bản
    $remote_url = DB_DOMAIN . $url . "?v=" . bongdako_timestamp();

    // Lấy nội dung file từ URL
    $response = wp_remote_get($remote_url, [
        'headers' => [
            'Referer' => home_url(),
        ],
        'timeout' => 60,
        'sslverify' => false,
        'curl' => [
            CURLOPT_SSL_VERIFYPEER => 0,
        ],
    ]);

    if (is_wp_error($response)) {
        error_log('Lỗi khi tải dữ liệu: ' . $response->get_error_message());
        return;
    }

    $js_content = wp_remote_retrieve_body($response);

    return bongdako_save_js_data($js_content, $fileName);
}