/* ════════════════════════════════════════════════════════════════════
   MatchChase — MOBILE MAINPAGE (anasayfa fixture table)
   ════════════════════════════════════════════════════════════════════
   SCOPE: Sadece anasayfa Maçlar tab'ı (.mc-mainpage-table marker class —
   mc_mainpage.js:444 atar). Lig/Takım/H2H fixture sayfalarına ETKİ ETMEZ.
   Renderer'a dokunulmaz.

   Yaklaşım A (kullanıcı onayı 2026-05-09): saat ayrı sütunda kalır,
   sezon (25/26) gizli, kompakt sütun genişlikleri.

   Post-process (mc_mainpage.js:574-585) ile mobile DOM dönüşümü:
     - 2. td (saat) ve hide-mobile td'ler JS ile DOM'dan SİLİNİR
       (visibility:collapse Mobile Safari'de yer kaplıyor)
     - Saat span (.mc-fx-time-mobile) 1. td'nin başına eklenir
     - Sezon div CSS ile gizli
   ════════════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {

    /* Mobile için table-layout: auto override — fixed-layout col mapping bug'ından
       (Chrome) kaçınıyor. Tablo içeriğine göre sütun genişliklerini dağıtır.
       Width zorlaması yok; sadece display:none / visibility:collapse ile gizleme. */
    .mc-mainpage-table {
        table-layout: auto !important;
        width: 100% !important;
    }

    /* ÖNEMLİ: Tüm match-row kuralları tr[data-match-row] scope'u ile sarmalı —
       league-separator (bayrak + lig ismi siyah bantı) etkilenmesin. */

    /* 1. td: sezon div (25/26) gizli */
    .mc-mainpage-table tbody tr[data-match-row] td:nth-child(1) > div {
        display: none !important;
    }
    .mc-mainpage-table tbody tr[data-match-row] td:nth-child(1) {
        width: 60px !important;                 /* simetri: aksiyon ile eşit */
        min-width: 60px !important;
        max-width: 60px !important;
        padding: 3px 4px 3px 6px !important;
        font-size: 0.75rem !important;
        text-align: left !important;
        line-height: 1.15 !important;
    }
    /* Saat span (post-process) — 1. td içinde block, üstte vurgu */
    .mc-mainpage-table tbody tr[data-match-row] td:nth-child(1) .mc-fx-time-mobile {
        display: block;
        font-weight: 700;
        color: var(--text-primary);
        font-size: 0.85rem;
        line-height: 1.1;
        margin-bottom: 1px;
    }

    /* Ev takım — SABİT 90px + font 0.78 (Galatasaray SK / Çaykur Rizespor sığar) */
    .mc-mainpage-table tbody tr[data-match-row] td.home-team-cell {
        width: 90px !important;
        min-width: 90px !important;
        max-width: 90px !important;
        font-size: 0.78rem !important;
        padding: 3px 4px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* MS skor — SABİT 38px (renderer min-width 36 inline + 2 padding) */
    .mc-mainpage-table tbody tr[data-match-row] td:nth-child(3) {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        padding: 3px 1px !important;
    }

    /* İY skor — SABİT 24px ("0-2" gibi 3 char rakam sığar) */
    .mc-mainpage-table tbody tr[data-match-row] td:nth-child(4) {
        width: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        padding: 3px 1px !important;
        font-size: 0.7rem !important;
    }

    /* Dep takım — SABİT 90px (ev ile eşit, simetri) + font 0.78 */
    .mc-mainpage-table tbody tr[data-match-row] td.away-team-cell {
        width: 90px !important;
        min-width: 90px !important;
        max-width: 90px !important;
        font-size: 0.78rem !important;
        padding: 3px 4px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* League-separator (siyah bant: bayrak + lig ismi) — mobil için kompakt padding */
    .mc-mainpage-table tbody tr.league-separator td {
        padding: 6px 10px !important;
        font-size: 0.78rem !important;
    }
    .mc-mainpage-table tbody tr.league-separator .fi {
        font-size: 1.1rem !important;          /* bayrak ikonu daha büyük + okunaklı */
    }

    /* Aksiyon (last-child) — SABİT 60px (1. td ile simetri); 3 ikon kompakt font */
    .mc-mainpage-table tbody tr[data-match-row] td:last-child {
        width: 60px !important;
        min-width: 60px !important;
        max-width: 60px !important;
        text-align: right !important;
        padding: 3px 6px 3px 4px !important;
        white-space: nowrap !important;
    }
    .mc-mainpage-table tbody tr[data-match-row] td:last-child button {
        margin: 0 !important;
        padding: 1px 1px !important;
    }
    /* Aksiyon ikon font'larını kompaktla — 60 px'e 3 ikon sığsın */
    .mc-mainpage-table tbody tr[data-match-row] td:last-child i {
        font-size: 0.78rem !important;
    }
}