/* تنسيقات جداول المعلقين والمباريات (.mt-*) وملء الشاشة للـ iframe — منقولة من Additional CSS السابق */
:root {
    /* ألوان البنفسجي */
    --header-bg: #483D8B;         /* بنفسجي داكن */
    --league-header-bg: #8A2BE2; /* بنفسجي أزرق (BlueViolet) */
    --time-bg: #EADCFD;          /* بنفسجي فاتح جداً */

    /* ألوان الذهبي والبرتقالي */
    --golden-text: #FFD700;      /* ذهبي لامع للعناوين */
    --team-text: #B8860B;         /* ذهبي داكن لأسماء الفرق */
    --time-text: #BF5700;        /* برتقالي داكن للوقت */

    /* ألوان محايدة */
    --row-bg: #FFFFFF;           /* أبيض نقي للصفوف */
    --border-color: #E0E0E0;
    --text-color: #333333;
    --font-family: 'Tajawal', sans-serif;
}

/* ---------------------------------- */
/* 1. الحاوية العامة للجدول            */
/*    #TheJadwal ← .mt-table          */
/* ---------------------------------- */
.mt-table {
    font-family: var(--font-family);
    box-shadow: 0 5px 25px rgba(72, 61, 139, 0.2);
    margin-top: 25px;
    background-color: #f7f7f7; /* خلفية رمادية فاتحة جداً لإبراز البطاقات */
    padding: 10px 0; /* إضافة حشو علوي وسفلي */
    border-radius: 8px;
    overflow: hidden;
}

/* ---------------------------------- */
/* 2. الترويسة الرئيسية (العنوان + التاريخ) */
/*    .enwan ← .mt-header             */
/* ---------------------------------- */
.mt-table .mt-header {
    background: var(--header-bg);
    color: var(--golden-text); /* ✅ لون ذهبي للعنوان الرئيسي */
    padding: 16px;
    text-align: center;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
    border-bottom: 2px solid var(--golden-text);
}

.mt-table .mt-header h2 {
    font-size: clamp(1.2rem, 4vw, 1.5rem);
    font-weight: 700;
    margin: 0 0 6px;
    color: var(--golden-text) !important; /* يتجاوز تنسيق h2 العام في أعلى الملف */
}

.mt-table .mt-header .mt-date {
    font-size: 0.95rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9);
    opacity: 0.92;
}

/* ---------------------------------- */
/* 3. عنوان البطولة (فاصل بين المجموعات) */
/*    .enwan2 / .league-section ← .mt-league */
/*    (لا يوجد صندوق تغليف في البنية الجديدة، */
/*     لذا نعتمد التباعد + الخط الذهبي بدل الصندوق) */
/* ---------------------------------- */
.mt-table .mt-league {
    position: relative;
    background: var(--league-header-bg);
    color: var(--golden-text); /* ✅ لون ذهبي لعنوان الدوري */
    padding: 12px;
    text-align: center;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
    margin-top: 20px; /* تباعد بين مجموعة وأخرى */
}

.mt-table .mt-league h3 {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    color: var(--golden-text) !important;
}

/* خط ذهبي فاصل قبل كل مجموعة بطولة جديدة */
.mt-table .mt-league::before {
    content: '';
    position: absolute;
    top: -11px;
    left: 5%;
    width: 90%;
    height: 2px;
    background: linear-gradient(to right, transparent, var(--golden-text), transparent);
    opacity: 0.6;
}

/* إزالة المسافة والخط من أول بطولة تلي الترويسة الرئيسية مباشرة */
.mt-table .mt-header + .mt-league {
    margin-top: 0;
}
.mt-table .mt-header + .mt-league::before {
    display: none;
}

/* ---------------------------------- */
/* 4. بطاقة المباراة                   */
/*    .Mobarah ← .mt-match             */
/* ---------------------------------- */
.mt-table .mt-match {
    background: var(--row-bg);
    border-top: 1px solid var(--border-color);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.mt-table .mt-match:hover {
    transform: scale(1.02);
    box-shadow: 0 6px 20px rgba(72, 61, 139, 0.15);
    z-index: 10;
    position: relative;
}

/* ---------------------------------- */
/* 5. صف الفريقين والوقت               */
/*    .team1 / .Waqt / .team2 ← .mt-match-row > .mt-team / .mt-time */
/* ---------------------------------- */
.mt-table .mt-match-row {
    display: flex;
    align-items: center;
}

.mt-table .mt-match-row .mt-team,
.mt-table .mt-match-row .mt-time {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 10px;
    border-left: 1px solid var(--border-color);
    font-size: 0.95rem;
    text-align: center;
}

.mt-table .mt-match-row .mt-team:first-child {
    border-right: none;
}

/* الفريقان (كلاهما بنفس الكلاس mt-team، نميّزهما بالترتيب) */
.mt-table .mt-match-row .mt-team {
    flex: 0 0 40%;
    font-weight: 700;
    color: var(--team-text);
}

/* الوقت في المنتصف */
.mt-table .mt-match-row .mt-time {
    flex: 0 0 20%;
    background: var(--time-bg);
    font-weight: bold;
    color: var(--time-text);
}

/* ---------------------------------- */
/* 6. صف المعلق والقناة                */
/*    .Mo3lq / .Qanah ← .mt-info > .mt-commentator / .mt-channel */
/* ---------------------------------- */
.mt-table .mt-info {
    display: flex;
    border-top: 1px dashed var(--border-color);
}

.mt-table .mt-info .mt-commentator,
.mt-table .mt-info .mt-channel {
    flex: 0 0 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px;
    font-size: 0.9rem;
    color: var(--text-color);
    text-align: center;
}

.mt-table .mt-info .mt-commentator {
    border-left: 1px solid var(--border-color);
}

/* أيقونات ذهبية (تُبقي الرمز النصي 🎤/📺 الموجود أصلاً بدون تكرار) */
.mt-table .mt-info .mt-commentator::before,
.mt-table .mt-info .mt-channel::before {
    color: var(--team-text);
}

/* ---------------------------------- */
/* 7. تذييل الجدول                     */
/*    عنصر جديد لا يوجد له مقابل قديم — .mt-footer */
/* ---------------------------------- */
.mt-table .mt-footer {
    background: var(--header-bg);
    color: var(--golden-text);
    text-align: center;
    font-size: 0.85rem;
    padding: 10px;
    font-weight: 500;
}

/* ---------------------------------- */
/* 8. التجاوب مع شاشات الموبايل        */
/* ---------------------------------- */
@media (max-width: 820px) {
    .mt-table .mt-league { margin-top: 15px; }

    .mt-table .mt-match-row {
        flex-direction: column;
        padding: 12px 12px 0;
        gap: 10px;
    }
    .mt-table .mt-match-row .mt-team,
    .mt-table .mt-match-row .mt-time {
        width: 100%;
        flex-basis: auto;
        border: none;
        padding: 6px 0;
    }
    .mt-table .mt-match-row .mt-team {
        font-size: 1rem;
    }
    /* الوقت يظهر أولاً كما في التصميم القديم */
    .mt-table .mt-match-row .mt-time {
        order: -1;
        font-size: 1.1rem;
        background-color: transparent;
        padding-bottom: 10px;
        border-bottom: 1px dashed var(--border-color);
    }

    .mt-table .mt-info {
        flex-direction: column;
        padding-bottom: 12px;
    }
    .mt-table .mt-info .mt-commentator {
        border-left: none;
        border-bottom: 1px dashed var(--border-color);
    }
}

/* إجبار الأيفريم على ملء الشاشة بالكامل في وضع الفول سكرين */
iframe:fullscreen {
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100% !important;
    max-height: 100% !important;
}

/* دعم متصفحات سفاري والآيفون (WebKit) */
iframe:-webkit-full-screen {
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100% !important;
    max-height: 100% !important;
}

/* دعم متصفحات فايرفوكس (Gecko) */
iframe:-moz-full-screen {
    width: 100vw !important;
    height: 100vh !important;
}