/* ==========================================
   試合結果ページ専用 スマホ並び順カスタマイズ (768px以下)
   ========================================== */
@media screen and (max-width: 768px) {
    .main-layout-rally-result {
        display: flex;
        flex-direction: column;
    }

    /* ラッパーの枠組みを解除して直下要素をFlexソート可能にする */
    .main-layout-rally-result .sidebar-right,
    .main-layout-rally-result .main-content {
        display: contents;
    }

    /* スマホ時の表示順序を指定 */
    .sp-order-1 { order: 1; } /* 1. 試合結果・データ（最上部） */
    .sp-order-2 { order: 2; } /* 2. 試合選択 */
    .sp-order-3 { order: 3; } /* 3. サイドバー広告・バナー */
    .sp-order-4 { order: 4; } /* 4. ナビゲーションボタン */
    .sp-order-5 { order: 5; } /* 5. 最下部広告 */
}

/* ==========================================
   viewsGames・GridView はみ出し防止処理
   ========================================== */

/* メインコンテンツ枠の溢れ防止（最重要） */
.main-content, 
.result-section {
    min-width: 0 !important; /* Grid/Flex内で要素がはみ出すのを防ぐおまじない */
    max-width: 100%;
}

/* ラッパーの設定 */
.views-games-wrapper {
    width: 100%;
    overflow-x: auto; /* 横幅を超えたらスムーズにスクロール */
    -webkit-overflow-scrolling: touch;
    margin-bottom: 15px;
}

/* テーブル（gridGame・tblListMod）自体の折り返し制御 */
.views-games-wrapper table {
    width: 100% !important;
    max-width: 100%;
    table-layout: auto; /* コンテンツに合わせて伸縮 */
}

.views-games-wrapper th, 
.views-games-wrapper td {
    white-space: nowrap; /* 文字崩れを防ぐために一行表示（必要に応じて折り返し） */
    padding: 8px 6px;
    font-size: 0.85rem;
}

/* 表示切り替えボタン・動的テーブルのスタイル調整 */
.toggle-view-link {
    margin: 10px 0;
    text-align: center;
}

.table-mod-container {
    width: 100%;
    overflow-x: auto;
}