/* ============================================================
   شكل موحّد لبطاقات الموقع كله، بلا ظلال

   كانت كل صفحة (بل كل كتلة) بزاوية وظل مختلفين: 6/7/8/9/10/12/14/16/18/20/25/30
   وظلال على تبويبات الهدافين والملخص وبطاقات الأخبار والانتقالات واللاعب، وأخرى في
   الداكن دون الفاتح. صارت كلها على نمط عمود المباريات: خلفية البطاقة وحدٌّ رفيع،
   بلا ظل، في الوضعين. السلّم:

     بطاقة/قسم قائم بذاته على خلفية الصفحة            14px  حد رفيع، بلا ظل
     عنصر قائمة، زر، شريط تبويبات، حقل                 10px  بلا ظل
     جزء صغير داخل عنصر (التبويب المختار، صندوق النتيجة، صورة مصغّرة)   8px
     الحبوب المستديرة (999px) والصور الدائرية (50%) تبقى كما هي: شكلها مقصود.

   لا يُمس ما يطفو فوق الصفحة (القوائم المنسدلة، النوافذ المنبثقة، رسائل التنبيه،
   التلميحات): ظلها يفصلها عمّا تحتها. ولا الحلقات التي تُرسم بالظل لتركيز لوحة
   المفاتيح ومفاتيح التبديل.

   الملف آخر الأنماط تحميلاً (layout/header)، فيعلو style.css و light.css و
   responsive.css و match-header-desktop.css وبقية الملفات التي تكرّرت فيها القواعد.
   الأساس داكن، و html.light للفاتح كبقية الموقع.
   ============================================================ */
:root {
  --ui-card: #151825;
  --ui-inset: #11131e;
  --ui-line: #1e2235;
  --ui-head: rgba(255, 255, 255, 0.03);
  --ui-r-card: 14px;
  --ui-r-item: 10px;
  --ui-r-small: 8px;
}

html.light {
  --ui-card: #ffffff;
  --ui-inset: #f8f9fc;
  --ui-line: #e6eaf3;
  --ui-head: #eef1f7;
}

/* ============================================================
   ١. البطاقات والأقسام
   ============================================================ */

/* بطاقات بخلفية البطاقة نفسها */
.championship-wrap:not(.championship-wrap *),
.home-news.team-page-news,
.news-details-wrap .news-page__article,
.news-detail-page-root .news-page__comments,
.news-related,
.news-sections,
.transfer-filters-card,
.stats-block-wrap,
.p-r-s-position-block,
.p-r-s-radar-block,
.p-r-s-team-card,
.p-r-s-monthly-card,
.p-r-s-matches-wrapper,
.lineup-intro,
.faq-list,
.related-links-block > ul,
.lineup-featured-image,
.match-detail-content :is(
  .match-quick-link,
  .match-events-wrap,
  .teams-stats-wrap,
  .match-stats-block,
  .prediction-poll-card,
  .match-teams-rank,
  .teams-last-matches,
  .team-form-grid,
  .news-comments-wrapper
),
:is(.match-detail-content, .champ-tab-item) .match-info-collapse {
  background-color: var(--ui-card) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-r-card) !important;
  box-shadow: none !important;
}

/* بطاقات تحتفظ بخلفيتها (صورة الخبر، صندوق التطبيق) */
.news-page__hero,
.download-app-wrapper {
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-r-card) !important;
  box-shadow: none !important;
}

/* رؤوس الصفحات على الكمبيوتر (على الجوال تمتد بعرض الشاشة) */
@media (min-width: 768px) {
  .profile-header-wrapper,
  .page-breadcrumb .breadcrumb-wrap {
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--ui-r-card) !important;
    box-shadow: none !important;
  }
}

@media (max-width: 767px) {
  .profile-header-wrapper,
  .page-breadcrumb .breadcrumb-wrap {
    box-shadow: none !important;
  }
}

/* ============================================================
   ٢. العناصر والأزرار والحقول
   ============================================================ */
.news-item,
.big-news-card,
.ajax-match-item.inline-match-item:not(.mb-row),
.matches-wrapper > .header,
.transform-item,
.transform-history-item,
.pn-card,
.general-stats-item,
.penalties-stats,
.penalty-info-item,
.total-goals,
.player-info-item,
.p-r-s-match-row,
.p-r-s-stat-box,
.p-r-s-league,
.tab-filter-item,
.price-wrap,
.rank-key,
.rank-keys-items,
.show-more-matches,
.view-all-button,
.transfer-load-more-btn,
.transfer-filter-pill,
.download-app-btn,
.season-dropdown-btn,
.inline-date-filter {
  border-radius: var(--ui-r-item) !important;
  box-shadow: none !important;
}

/* عناصر قائمة قائمة بذاتها على خلفية الصفحة في تفاصيل المباراة: خلفية البطاقة وحدّها.
   صفوف جدول القنوات والمعلقين ليست منها (القسم ٧). و‎#news_list_more‎ في قاعدة وحده:
   داخل :is() كان يرفع قوة القاعدة كلها فتغلب تصميم صفوف ذلك الجدول. */
.match-detail-content :is(.match-info-item, .inline-player-item, .news-item):not(.match-info-collapse *),
.match-detail-content #news_list_more {
  background-color: var(--ui-card) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-r-item) !important;
  box-shadow: none !important;
}

/* عنصر داخل بطاقة: خلفية أغمق قليلاً بلا حد (لا حدود داخل حدود)،
   التعليقات وحقل الكتابة وزر المزيد في ركن الجماهير وفي تعليقات الخبر */
:is(.match-detail-content .news-comments-wrapper, .news-detail-page-root .news-page__comments) :is(.comment-item, textarea, .news-page__more-btn) {
  background-color: var(--ui-inset) !important;
  border: 0 !important;
  border-radius: var(--ui-r-item) !important;
  box-shadow: none !important;
}

/* حقل الكتابة بلا حد يحتاج في الفاتح خلفية أوضح من التعليقات حتى يُعرف أنه حقل */
html.light :is(.match-detail-content .news-comments-wrapper, .news-detail-page-root .news-page__comments) textarea {
  background-color: var(--ui-head) !important;
}

/* خطوط الفصل داخل بطاقة المواجهات بلون الحد نفسه */
.match-detail-content .full-m-item {
  border-color: var(--ui-line) !important;
}

/* ============================================================
   ٣. أشرطة التبويبات (الهدافون/صناع الأهداف، الأبرز/الكل، الفريقان...)
   تبويبات مراحل الترتيب (.rank-stages-flow) حبوب شفافة بتصميمها، فتُستثنى.
   ============================================================ */
.inline-tabs-items:not(.rank-stages-flow .inline-tabs-items):not(#stages_target) {
  background-color: var(--ui-card) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-r-item) !important;
  box-shadow: none !important;
}

.inline-tabs-items:not(.rank-stages-flow .inline-tabs-items):not(#stages_target) .inline-tab-item {
  border-radius: var(--ui-r-small) !important;
  box-shadow: none !important;
}

/* غلاف الشريط كان يزيحه 4px عن حافتي المحتوى تحته */
.tab-area > .inline-tabs-wrapper {
  padding-inline: 0 !important;
}

/* ============================================================
   ٤. أجزاء صغيرة: صندوق النتيجة والصور المصغّرة
   ============================================================ */
.result-wrap,
.news-img,
.player-img,
.pn-thumb {
  border-radius: var(--ui-r-small) !important;
}

/* ============================================================
   ٥. ظلال أخرى بلا داعٍ (الأشكال باقية)
   ============================================================ */
.mm-league-chip,
.p-r-s-rating-inner,
.lineup-wrap .img,
.transform-item .img,
.transfer-page .img {
  box-shadow: none !important;
}

/* ============================================================
   ٦. الجوال: بطاقات تفاصيل المباراة بالهامش نفسه
   (بعضها كان ممتداً حتى حافة الشاشة بزوايا مدوّرة)
   ============================================================ */
@media (max-width: 767px) {
  /* الملخص (match-quick-link) يأخذ الهامش من غلافه أصلاً.
     بعضها عرضه 100% (الترتيب وعناصر التشكيلة)، فكان الهامش يدفعه 10px خارج
     يسار الشاشة؛ الحد الأقصى يُبقيه داخلها. */
  .match-detail-content :is(
    .match-events-wrap,
    .teams-stats-wrap,
    .match-stats-block,
    .prediction-poll-card,
    .match-teams-rank,
    .teams-last-matches,
    .team-form-grid,
    .match-info-collapse,
    .news-comments-wrapper,
    .match-info-item,
    .inline-player-item,
    .news-item,
    .inline-tabs-items,
    .view-all-button,
    .hint-item
  ):not(.match-info-collapse *),
  .match-detail-content #news_list_more {
    box-sizing: border-box !important;
    max-width: calc(100% - 20px) !important;
    margin-inline: 10px !important;
  }
}

/* ============================================================
   ٧. جداول داخل بطاقة (القنوات والمعلقون، والترتيب في تفاصيل المباراة):
   جدول واحد بلا إطارات داخلية. شريط عناوين بعرض البطاقة، ثم صفوف بلا خلفية
   ولا زوايا بينها خط رفيع. صفوف القنوات مصمّمة هكذا في match-info-block.css،
   والترتيب صار مثلها (كانت صفوفه في الداكن مربعات منفصلة داخل البطاقة).
   ============================================================ */
.match-detail-content .match-teams-rank {
  padding: 0 !important;
  overflow: hidden !important;
}

.match-detail-content .match-teams-rank .rank-row {
  margin: 0 !important;
  padding: 0 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ui-line) !important;
  border-radius: 0 !important;
}

.match-detail-content .match-teams-rank .rank-row:last-child {
  border-bottom: 0 !important;
}

/* شريط العناوين بلون شريط جدول القنوات وارتفاعه */
.match-detail-content .match-teams-rank .rank-row.header {
  min-height: 40px;
  background: var(--ui-head) !important;
}

/* على الجوال يبقى عمود النقاط وحده (يُخفى فاز/تعادل/خسر) بعرض 14%، وهو أضيق من
   "النقاط" و Points و Puntos على الشاشات الضيقة فتتداخل الكلمة مع ف.أ. العرض نفسه
   للعناوين والصفوف حتى تبقى الأرقام تحت عنوانها. */
@media (max-width: 767px) {
  /* مسافة أصغر للأعمدة الضيقة، بقدر هامش البطاقة */
  .match-detail-content .match-teams-rank .rank-row {
    padding: 0 10px !important;
  }

  .match-detail-content .match-teams-rank .rank-group.results {
    width: max(14%, 46px) !important;
  }

  .match-detail-content .match-teams-rank .rank-group.results .rank-col {
    margin: 0 !important;
  }
}

/* ============================================================
   ٨. قائمة خيارات التعليق (•••): كانت تتوسّط زرها الملاصق لحافة التعليق،
   فيخرج جزء منها خارج الشاشة على الجوال (ويُقصّ داخل لوحة الرئيسية).
   تنفتح الآن من جهة الزر نحو داخل التعليق، في العربية واللغات الأخرى.
   ============================================================ */
.comments-dropdown {
  inset-inline-end: 0 !important;
  inset-inline-start: auto !important;
  transform: none !important;
}

/* ============================================================
   ٩. قوائم المباريات (match-board.css) لها إطارها: إطار واحد في كل صفحة (حول
   العمود على الكمبيوتر، وحول الغلاف الداخلي على الجوال، وبلا إطار في الرئيسية
   على الجوال)، ومباريات البطولة الواحدة كتلة واحدة بينها خط رفيع. ألوانها هي
   ألوان السلّم نفسها، فتأخذ منه الزوايا فقط. كان القسم ١ يضيف إطاراً ثانياً حول
   ‎#match_list_conf‎ بفارق 1px (إطار مزدوج)، والقسم ٢ يدوّر كل مباراة وحدها.
   ============================================================ */
html:root {
  --mb-panel-radius: var(--ui-r-card);
  --mb-radius: var(--ui-r-item);
}

/* ============================================================
   ١٠. قوائم المباريات بشكل التصميم الأصلي (public/site): الرئيسية وصفحة
   المباريات وصفحات الأندية والبطولات. القائمة على خلفية الصفحة بلا إطار، رأس
   كل مجموعة شريط مستقل (37px، عنوان 12px، شعار 20px)، وكل مباراة مستطيل وحدها
   بفسحة 5px لا كتلة واحدة بخطوط بينها. ما داخل المباراة (الوقت والنتيجة) لا يُمس.
   الداكن بألوان التصميم: الشريط #191d2d والمباراة #151825 على #0e1019.
   الفاتح (لا فاتح في التصميم): الشريط رمادي والمباراة بيضاء على خلفية الصفحة.
   ============================================================ */

/* بلا إطار: الرئيسية وصفحة المباريات (الغلاف الداخلي)، والأندية والبطولات
   (العمود على الكمبيوتر، وتبويب المباريات على الجوال) */
#match_list_conf.home-matches-panel > .championship-wrap.important-matches,
#match_list_conf:not(.home-matches-panel):has(> .matches-wrapper.wide),
#match_list_conf:not(.home-matches-panel) .champ-tab-item.matches {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* لون المباراة الجارية والمتوقفة مثل غيرها كما في التصميم (كل الصناديق #151825).
   ‎--mb-row-bg-live‎ معرَّف على html بقيمة var(--mb-row-bg) فيُحسب هناك من القيمة
   القديمة (#191d2d) ولا يتبع تغييرها هنا، فيُعطى قيمته صراحة. */
/* الكمبيوتر: عمود المباريات بالحشوة الجانبية لأعمدة الصفحة (نصف مسافة الأعمدة)، فتصطف
   بطاقاته مع رأس البطولة أو النادي وشعار الموقع وبطاقات الأخبار بجانبه. كانت 0 بعد
   إزالة الإطار فبرزت الصفوف 10px خارج تلك الحافة (6px في الرئيسية مع حشوة 4px داخلية). */
@media (min-width: 992px) {
  #match_list_conf.home-matches-panel,
  #match_list_conf:not(.home-matches-panel):has(> .matches-wrapper.wide) {
    padding-inline: calc(var(--bs-gutter-x, 1.3rem) * .5) !important;
  }

  #match_list_conf.home-matches-panel #match_block_list {
    padding-inline: 0 !important;
  }
}

html:not(.light) #match_list_conf {
  --mb-row-bg: #151825;
  --mb-row-bg-live: #151825;
}

/* الأندية والبطولات: ترويسة التاريخ والجولة شريط مثل رأس البطولة في الرئيسية،
   بلا الخيط الأزرق قبلها (كما أُزيل الخط الأخضر من رأس البطولة)، و10px بين
   المجموعات (هامش الترويسة يندمج مع هامش 5px تحت آخر مباراة فيُكتب 10px) */
#match_list_conf:not(.home-matches-panel) .matches-week-title.two-rows-title {
  min-height: 37px !important;
  margin: 0 0 3px !important;
  padding-block: 0 !important;
  padding-inline: 10px 20px !important;
  border: 0 !important;
  border-radius: var(--ui-r-item) !important;
}

html:not(.light) #match_list_conf:not(.home-matches-panel) .matches-week-title.two-rows-title {
  background: #191d2d !important;
}

html.light #match_list_conf:not(.home-matches-panel) .matches-week-title.two-rows-title {
  background: var(--mb-champ-header-bg, #e2e7f0) !important;
}

#match_list_conf:not(.home-matches-panel) .matches-week-title.two-rows-title::before {
  display: none !important;
}

#match_list_conf:not(.home-matches-panel) .mb-row-shell + .matches-week-title {
  margin-top: 10px !important;
}

/* الشعار 20px (التصميم 16px، وطلب صاحب الموقع تكبيره ثم تصغيره قليلاً عن 24px) والشريط يبقى 37px */
#match_list_conf:not(.home-matches-panel) .matches-week-title.two-rows-title .champ-title .img {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
}

#match_list_conf:not(.home-matches-panel) .matches-week-title.two-rows-title .champ-title .img img {
  width: 20px !important;
  height: 20px !important;
  object-fit: contain;
}

/* بين البطولات 10px فقط، ومن الرأس إلى أول مباراة 3px */
#match_list_conf.home-matches-panel .matches-wrapper:not(:first-child) {
  margin-top: 0 !important;
}

#match_list_conf.home-matches-panel .matches-wrapper > .header {
  min-height: 37px !important;
  margin: 0 0 3px !important;
  padding-block: 0 !important;
  padding-inline: 10px 20px !important;
}

html:not(.light) #match_list_conf.home-matches-panel .matches-wrapper > .header {
  background: #191d2d !important;
}

#match_list_conf.home-matches-panel .matches-wrapper > .header .champ-title {
  gap: 10px !important;
}

/* الشعار 20px (التصميم 16px، وطلب صاحب الموقع تكبيره ثم تصغيره قليلاً عن 24px) والشريط يبقى 37px.
   والصورة نفسها مقيسة صراحة، فسمة width في partials/champ-logo لا تتحكم بها. */
#match_list_conf.home-matches-panel .matches-wrapper > .header .champ-title .img {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
}

#match_list_conf.home-matches-panel .matches-wrapper > .header .champ-title .img :is(img, svg) {
  width: 20px !important;
  height: 20px !important;
  object-fit: contain;
}

#match_list_conf.home-matches-panel .matches-wrapper > .header .champ-title b {
  font-size: 12px !important;
  font-weight: 700 !important;
}

html:not(.light) #match_list_conf.home-matches-panel .matches-wrapper > .header .champ-title b {
  color: #bfc3d4 !important;
}

/* كل مباراة مستطيل وحدها في كل القوائم: بلا خط فاصل ولا ربط للزوايا */
#match_list_conf .mb-row-shell::after {
  content: none !important;
}

#match_list_conf .mb-row-shell .mb-row {
  margin-bottom: 5px !important;
  border-radius: var(--ui-r-item) !important;
}

#match_list_conf .mb-row-shell:last-child .mb-row {
  margin-bottom: 0 !important;
}

/* زر "المزيد" تحت قوائم الأندية والبطولات صار على خلفية الصفحة بعد إزالة الإطار،
   ولونه الفاتح (#f4f6fb بلا حد) كاد يختفي عليها: أبيض بحدّ رفيع كمستطيلات المباريات */
html.light #match_list_conf .matches-wrapper.wide > .show-more-matches.view-all-button {
  background: #ffffff !important;
  border: 1px solid var(--ui-line) !important;
}

html.light #match_list_conf .matches-wrapper.wide > .show-more-matches.view-all-button:hover {
  background: #eef1f8 !important;
}

/* ============================================================
   ١١. أخبار الرئيسية بلا إطار رئيسي، مثل المباريات بجانبها وكما في التصميم
   الأصلي (public/site/index.html): العنوان ثم بطاقات الأخبار على خلفية الصفحة
   مباشرة بلون مستطيلات المباريات (الداكن #151825، الفاتح أبيض). كانت بطاقات
   داخل بطاقة. ‎.home-content-panel‎ عمود الرئيسية وحده.
   ============================================================ */
.home-content-panel .home-news.team-page-news {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* العنوان بارتفاع شريط عنوان المباريات وحشوته، فيقع الخطّان تحتهما على سطر واحد */
.home-content-panel .home-news.team-page-news > .inner-section-title {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 50px;
  padding: 10px 10px 12px !important;
  margin-bottom: 6px !important;
}

/* ‎.team-page-news‎ في المحدِّد لتعادل قوة قاعدة team-news.css التي تصبغ البطاقات
   في الفاتح بـ #f4f6fb (‎!important‎)، فهذا الملف بعدها يغلب. ذلك اللون كان
   يظهر داخل الإطار الأبيض، وعلى خلفية الصفحة #f8f9fc يكاد يختفي. */
/* عنوانا القائمتين ("الأخبار" و"مباريات اليوم") بلون عناوين الأقسام في الموقع كله
   وكما في التصميم الأصلي: #39dbbf في الداكن و#10816E في الفاتح (كانا أبيض وأسود
   وحدهما). عنوان تبويب الأخبار في الأندية والبطولات وصفحة المباريات يتبعانهما. */
html:not(.light) #match_list_conf.home-matches-panel > .championship-wrap.important-matches > .section-title h3,
html:not(.light) .home-news.team-page-news .inner-section-title {
  color: #39dbbf !important;
}

html.light #match_list_conf.home-matches-panel > .championship-wrap.important-matches > .section-title h3,
html.light .home-news.team-page-news .inner-section-title {
  color: #10816e !important;
}

/* العنوانان أقرب إلى قائمتيهما منهما إلى ما فوقهما فيُقرآن رأساً لهما (طلب صاحب
   الموقع): الحشوة العليا أكبر والسفلى أصغر بنفس المجموع، فلا يتحرك ما تحتهما.
   كان النص على 15px من أعلى الشريط و23px من أول بطولة. */
#match_list_conf.home-matches-panel > .championship-wrap.important-matches > .section-title,
.home-content-panel .home-news.team-page-news > .inner-section-title {
  padding-top: 18px !important;
  padding-bottom: 4px !important;
}

@media (max-width: 575px) {
  #match_list_conf.home-matches-panel > .championship-wrap.important-matches > .section-title {
    padding-top: 6px !important;
    padding-bottom: 4px !important;
  }
}

/* الجوال: شريط اليوم قريب من شريط الشعار فوقه (طلب صاحب الموقع). هامش 26px تحت
   ‎.mobile-header‎ كان يفصلهما؛ يُقلَّص في الرئيسية وحدها (‎.championships-section‎
   لا يوجد إلا فيها)، وبقية الصفحات تحتفظ بمسافتها. */
.mobile-header:has(~ .championships-section) {
  margin-bottom: 8px !important;
}

/* بلا خط تحت عناوين القوائم كما في التصميم الأصلي: شريط أدوات المباريات وعنوان
   الأخبار في الرئيسية، وعنوان "المباريات القادمة/انتهت" والأخبار في الأندية والبطولات */
#match_list_conf.home-matches-panel > .championship-wrap.important-matches > .section-title,
.home-news.team-page-news .inner-section-title,
#match_list_conf .matches-wrapper.wide > div:has(> .matches-top-title) {
  border-bottom: 0 !important;
}

html:not(.light) .home-content-panel .home-news.team-page-news .news-item {
  background-color: #151825 !important;
}

html.light .home-content-panel .home-news.team-page-news .news-item {
  background-color: #ffffff !important;
}

/* غلاف الصورة داخل بطاقة الخبر بلون البطاقة نفسها كما في التصميم الأصلي: كان
   رمادياً فاتحاً (#f4f6fb) في الفاتح و#191d2d في الداكن، فيظهر إطاراً حول الصورة
   بحشوته 10px. المحدِّدات تعادل قوة قواعد team-news.css (فيها ‎.light‎ و‎.news-row‎)
   فتغلب بالترتيب، في الرئيسية وصفحات الأندية والبطولات وعلى الجوال. */
html.light .home-news.team-page-news :is(.news-row, .mini-news-items) .news-item .news-img,
html:not(.light) .home-news.team-page-news :is(.news-row, .mini-news-items) .news-item .news-img,
html.light .home-news.team-page-news .big-news-item :is(.news-img, .big-news-card__media),
html:not(.light) .home-news.team-page-news .big-news-item :is(.news-img, .big-news-card__media) {
  background: transparent !important;
}

/* ============================================================
   ١٢. صفحات الأندية والبطولات بلا إطارات تضم بطاقات، مثل الرئيسية
   (الأخبار على الكمبيوتر يغطيها القسم ١١: عمودها ‎.home-content-panel‎ أيضاً).
   ما كان إطاراً كبيراً حول بطاقات صار على خلفية الصفحة، وما بقي بطاقة مستقلة
   أخذ ألوان السلّم وزاوية 14 (كانت 12 و16 و18 وألوان رمادية من خارج الموقع).
   ============================================================ */

/* تبويب الأخبار على الجوال: نفس أخبار الرئيسية */
#match_list_conf .champ-tab-item .home-news.team-page-news {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

html:not(.light) #match_list_conf .champ-tab-item .home-news .news-item {
  background-color: #151825 !important;
}

html.light #match_list_conf .champ-tab-item .home-news .news-item {
  background-color: #ffffff !important;
}

/* إحصائيات النادي: "متوسط إحصائيات الفريق بالمباراة" كان بطاقة تضم بطاقات */
.match-stats-block.new_statics:not(.match-detail-content *) {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* بطاقات الأرقام وملخص الموسم ومتوسطات المباراة وقوائم اللاعبين وفريق الجولة */
:is(.team-stat-card, .season-summary-card, .progress-state-item, .squad-leaderboard-wrap, .round-xi-card, .round-xi-list):not(.match-detail-content *) {
  background-color: var(--ui-card) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-r-card) !important;
  box-shadow: none !important;
}

/* ملعب فريق الجولة بلا البطاقة المحيطة به: الملعب نفسه بزاوية البطاقة */
.round-xi-pitch-wrap {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: var(--ui-r-card) !important;
  overflow: hidden !important;
}

/* جدول الأعلى والأدنى في إحصائيات البطولة بألوان الموقع */
.season-highest-lowest-table {
  background-color: var(--ui-card) !important;
  border-color: var(--ui-line) !important;
  border-radius: var(--ui-r-card) !important;
}

.season-highest-lowest-table th {
  background-color: var(--ui-head) !important;
}

.season-highest-lowest-table :is(th, td, tr) {
  border-color: var(--ui-line) !important;
}

/* ============================================================
   ١٣. رأس المباراة: النتيجتان على منتصف الدائرة في كل الحالات (طلب صاحب الموقع).
   في الحالات الجارية يُحجز فوق الدائرة مكان شارة الشوط (24px جوال، 28px كمبيوتر)
   داخل عمود الدائرة وحده، فكانت النتيجتان تتوسطان العمود كله (المكان + الدائرة)
   وتعلوان 12-15px عن منتصف الدائرة. تأخذان المكان نفسه فوقهما فيتطابق المنتصفان.
   الحالات المتوقفة (الاستراحة، فواصل الأشواط الإضافية، الترجيح) لا تحجز مكاناً
   والنتيجة فيها على منتصف الدائرة أصلاً.
   ============================================================ */
@media (max-width: 767px) {
  .profile-header-wrapper.match .match-details.live-match:not(.stopped-match) .main-result > b {
    padding-top: 24px;
  }
}

@media (min-width: 768px) {
  .profile-header-wrapper.match .match-details.live-match:not(.stopped-match) .main-result > b {
    padding-top: 28px;
  }
}

/* شارة "نهاية الشوط" التي يضعها السكربت عند الانتقال الحي إلى الاستراحة كانت داخل
   الدائرة في التدفق فتدفعها 30px إلى أسفل؛ صارت فوقها خارج التدفق كشارات الحالات
   الأخرى، فيطابق الشكل ما تُرسم به الاستراحة عند فتح الصفحة. */
.profile-header-wrapper.match .match-inner-progress-wrap.stopped > .live-match-status {
  position: absolute !important;
  bottom: calc(100% + 5px) !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
}

/* ============================================================
   ١٤. بطاقات كان فوق لونها طبقة متدرّجة في الداكن (ملخص إحصائيات المباراة، تبويب
   الإحصائيات، بطاقات الأرقام في إحصائيات الأندية والبطولات): صارت مثل بطاقة تصويت
   الجمهور، لون البطاقة نفسه بلا تدرّج (طلب صاحب الموقع). لون الخلفية كان موحّداً
   أصلاً، لكن التدرّج صورة خلفية تُرسم فوقه.
   ============================================================ */
.match-detail-content :is(.teams-stats-wrap, .match-stats-block),
.team-stat-card:not(.match-detail-content *) {
  background-image: none !important;
}

/* ============================================================
   ١٥. ملاحظة المباراة (سبب الإلغاء أو التأجيل، ‎.hint-item‎) بشكل صفوف معلومات اللقاء
   تحتها (طلب صاحب الموقع): كانت حبّة مدوّرة تماماً (50px)، وعلى الجوال من حافة
   الشاشة إلى حافتها. صارت بزاوية 10 وهامش الجوال (القسم ٦) كالصفوف، وتبقى بألوانها
   الزرقاء السابقة (خلفية وحدّ أزرقان) حتى تلفت النظر.
   ============================================================ */
.match-detail-content .hint-item {
  background-color: rgba(90, 131, 255, 0.15) !important;
  border: 1px solid #5a83ff !important;
  border-radius: var(--ui-r-item) !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-size: 13px;
  line-height: 1.6;
}

html.light .match-detail-content .hint-item {
  border-color: rgba(90, 131, 255, 0.5) !important;
  color: #2b62ff !important;
}

/* ============================================================
   ١٦. شريط تاريخ المباراة في قوائم الأندية والبطولات وغيرها: اسم البطولة في أوله
   والتاريخ في آخره، أي التاريخ يساراً في العربية ويميناً في الإنجليزية وبقية اللغات
   (طلب صاحب الموقع). و«مباراة الذهاب/الإياب» تُحذف من الاسم في القوالب
   (App\Support\RoundTitle). الرئيسية مستثناة: ‎two-rows-title‎ فيها رؤوس تجميع زمني.
   ============================================================ */
.matches-week-title.two-rows-title:not(.home-matches-panel *) > .date {
  order: 2;
  margin-inline-start: auto !important;
}

/* ============================================================
   ١٧. معايير كسر التعادل تحت جدول الترتيب (‎.match-rules-block‎) جدول واحد في البطاقة
   (طلب صاحب الموقع): كانت القائمة صندوقاً رمادياً بزوايا 8 داخل البطاقة بهامش 10px،
   أي إطار داخل إطار. صارت صفوفها في البطاقة نفسها بخط رفيع بينها كجدول القنوات.
   والخط الفاصل تحت شريط العنوان انتقل إلى أعلى القائمة: حين تُطوى كان يلاصق حدّ
   البطاقة السفلي فيظهر خطاً مضاعفاً. لون الشريط المفتوح (الأخضر الخفيف) علامة الحالة.
   ============================================================ */
.match-info-collapse.match-rules-block > .collapse-header {
  border-bottom: 0 !important;
}

.match-info-collapse.match-rules-block .match-rules-panel {
  padding: 0 !important;
  border-top: 1px solid var(--ui-line);
}

.match-info-collapse.match-rules-block .match-rules-list {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.match-info-collapse.match-rules-block .match-rules-list__item {
  padding: 11px 14px !important;
  border-bottom: 1px solid var(--ui-line) !important;
}

.match-info-collapse.match-rules-block .match-rules-list__item:last-child {
  border-bottom: 0 !important;
}

.match-info-collapse.match-rules-block .match-rules-list__num {
  border-radius: var(--ui-r-small) !important;
}

/* ============================================================
   ١٨. جرس البطولة (‎.add-fav-champ‎) وجرس الفريق (‎.follow-btn.team-bell‎، كان زر «متابعة»
   نصياً) في رأسي صفحتيهما بشكل جرس المباراة (طلب صاحب
   الموقع): دائرة 36px بأيقونة جرس خطية وألوان أزرار شريط المباراة، وأخضر حين يكون
   مفعّلاً كـ ‎.mm-bell.is-on‎. كان أيقونة مجردة على الكمبيوتر ومربعاً بزوايا 10 على
   الجوال. قواعد قديمة تملأ ‎svg path‎ داخله بلون (أقواها في championship-mobile.css)،
   فتُلغى للأيقونة الخطية بمحدِّدات أقوى منها. التلميح في header-login-btn.css.
   ============================================================ */
.profile-header-wrapper :is(.add-fav-champ, .follow-btn.team-bell) {
  position: relative;
  min-width: 0 !important;
  min-height: 36px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  line-height: 0;
  cursor: pointer;
}

html.light .profile-header-wrapper :is(.add-fav-champ, .follow-btn.team-bell) {
  border-color: rgba(14, 16, 25, 0.12) !important;
  background: rgba(255, 255, 255, 0.85) !important;
  color: #2a3142 !important;
  box-shadow: 0 1px 4px rgba(14, 16, 25, 0.06) !important;
}

.profile-header-wrapper :is(.add-fav-champ, .follow-btn.team-bell).active {
  color: #39dbbf !important;
  border-color: rgba(57, 219, 191, 0.42) !important;
  background: rgba(57, 219, 191, 0.12) !important;
}

html.light .profile-header-wrapper :is(.add-fav-champ, .follow-btn.team-bell).active {
  color: #16ae94 !important;
  border-color: rgba(22, 174, 148, 0.5) !important;
  background: rgba(22, 174, 148, 0.08) !important;
}

.profile-header-wrapper :is(.add-fav-champ, .follow-btn.team-bell) svg.champ-bell-svg {
  display: block;
  width: 16px !important;
  height: 16px !important;
}

.profile-header-wrapper :is(.add-fav-champ, .follow-btn.team-bell) svg.champ-bell-svg path,
.profile-header-wrapper .add-fav-champ.active svg.champ-bell-svg path:last-child,
html.light .profile-header-wrapper.mini.club .season-dropdown-wrap .add-fav-champ svg.champ-bell-svg path {
  fill: none !important;
  stroke: currentColor !important;
}

/* نص التلميح بحسب الحالة */
:is(.add-fav-champ, .team-bell):not(.active) .champ-bell-label--on,
:is(.add-fav-champ, .team-bell).active .champ-bell-label--off {
  display: none !important;
}

/* بجانب زر الموسم وعلى مركزه: هامش علوي 18px وإزاحة ‎translateY(-50%)‎ قديمان كانا
   يرفعان الجرس 9px عن مركز الزر */
.profile-header-wrapper .season-dropdown-wrap .profile-actions {
  margin: 0 10px !important;
  transform: none !important;
}

/* جرس الفريق في صف الشعار والاسم وعلى مركزه: زر «متابعة» القديم كان مطلقاً في منتصف
   الرأس كله (مع شريط التبويبات) فيقع تحت الاسم؛ الصف مرن والجرس في طرفه. */
.profile-header-wrapper .team-header-top:has(> .follow-btn.team-bell) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px;
  align-self: stretch;
  width: 100%;
}

.profile-header-wrapper .team-header-top > .follow-btn.team-bell {
  position: relative !important;
  top: auto !important;
  inset-inline: auto !important;
  transform: none !important;
}

/* غلاف الشعار والتبويبات كان بعرض محتواه، فيلاصق الجرس اسم الفريق؛ يمتد بعرض الرأس
   فيقع الجرس في طرفه بمسافة الشعار من الطرف الآخر، والشعار والتبويبات في مكانها */
.profile-header-wrapper .club-profile-info:has(.follow-btn.team-bell) {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 0;
}

/* ============================================================
   ١٩. رأس البطولة على الجوال (طلب صاحب الموقع: الشعار والاسم غير متناسقين): الشعار
   والاسم وزر الموسم والجرس على خط واحد ومركز واحد (كانت مراكزها 38 و49 و59px)، بلا
   الخط الأخضر قبل الشعار، والشعار داخل دائرة ناعمة من عائلة دائرة الجرس، والاسم 16px
   يلتف على سطرين إن طال.
   ============================================================ */
@media (max-width: 767px) {
  .profile-header-wrapper .champ-header-top { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px; }
  .profile-header-wrapper .champ-header-top > .club-logo { display: flex !important; align-items: center !important; gap: 10px !important; min-width: 0; flex: 1 1 auto; margin: 0 !important; padding: 0 !important; }
  .profile-header-wrapper .champ-header-top > .club-logo::before { display: none !important; }
  .profile-header-wrapper .champ-header-top > .club-logo > img { flex: 0 0 48px; width: 48px !important; height: 48px !important; padding: 8px; box-sizing: border-box; border-radius: 50%; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.08); object-fit: contain; margin: 0 !important; }
  html.light .profile-header-wrapper .champ-header-top > .club-logo > img { background: #ffffff; border-color: rgba(14, 16, 25, 0.12); }
  .profile-header-wrapper .champ-header-top > .club-logo > .page-heading { margin: 0 !important; font-size: 16px !important; line-height: 1.35 !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .profile-header-wrapper .champ-header-top > .champ-header-actions { flex: 0 0 auto; display: flex !important; align-items: center !important; gap: 8px; margin: 0 !important; }
}

/* ============================================================
   ٢٠. بلا علامة الإيقاف المؤقت (خطّان صغيران تحت الوقت في دائرة المباراة) في قوائم
   المباريات عند الاستراحة وفواصل الأشواط الإضافية والترجيح (طلب صاحب الموقع)؛
   الوقت واللون الأصفر ونص الحالة تحت الدائرة تكفي.
   ============================================================ */
#match_list_conf .mb-row .match-inner-progress-wrap:is(.stopped, .stopped_ex) .percent::after {
  content: none !important;
  display: none !important;
}

/* ============================================================
   ٢١. شعار الدوري الإنجليزي الممتاز يتبع الوضع (طلب صاحب الموقع): ملفه أسد بنفسجي
   للخلفية الفاتحة ويكاد لا يُرى في الوضع الداكن، ولا نسخة داكنة له في البيانات
   (image_light فارغ، و image يقرؤه تطبيق الجوال في وضعيه فلا يُبدَّل هناك). على
   الموقع وحده تحلّ محله في الداكن نسخة بيضاء من الملف نفسه، أينما ظهر وبأي مقاس.
   الصورة في public/images/champ-dark باسم الملف الأصلي؛ إن رُفع للبطولة شعار جديد
   (اسم ملف آخر) توقفت القاعدة من تلقاء نفسها.
   ============================================================ */
html:not(.light) img[src*="/championship/"][src*="/3411694791422.png"] {
  content: url("/images/champ-dark/3411694791422.png");
}

/* ============================================================
   ٢٢. «القادمة / النتائج / المؤجلة» تبويبات بدل الأقسام تحت بعضها (طلب صاحب الموقع)،
   في صفحات البطولة والنادي والمدرب والحكم والمعلق والملعب. partials/match-status-tabs
   يُطبع قبل أول قسم، و data-active عليه يُظهر قسماً واحداً من أول رسم فلا تتحرك الصفحة
   (app-js/match-status-tabs.js يبدّله عند الضغط). المباريات الجارية قبل الشريط فتبقى
   ظاهرة. كل قسم يُعرف بقائمته: ‎#coming_match_load / #end_match_load /
   #postponed_match_load‎، و ‎#stad_coming_matches / #stad_end_matches‎ في الملعب.
   الأزرار بشكل أزرار مراحل الترتيب (rank-stage-pill) بلا ظل، بعرض متساوٍ.
   ============================================================ */
.match-status-tabs {
  display: flex;
  gap: 8px;
  /* بعرض عمود المباريات في البطولة والنادي، ولا يمتد بعرض صفحة الملعب كلها */
  max-width: 500px;
  margin: 0 0 10px;
}
.match-status-tab {
  flex: 1 1 0;
  min-width: 0;
  height: 38px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-r-item);
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(25, 29, 45, 0.9);
  color: rgba(255, 255, 255, 0.55);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: none;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.match-status-tab:hover {
  color: rgba(255, 255, 255, 0.88);
  border-color: rgba(255, 255, 255, 0.14);
}
.match-status-tab[aria-selected="true"] {
  background: #39dbbf;
  border-color: #39dbbf;
  color: #0e1019;
}
.match-status-tab:focus-visible {
  outline: 2px solid #39dbbf;
  outline-offset: 2px;
}
html.light .match-status-tab {
  background: #ffffff;
  border-color: rgba(14, 16, 25, 0.1);
  color: #6b7080;
}
html.light .match-status-tab:hover {
  color: #2a3142;
  border-color: rgba(14, 16, 25, 0.16);
}
html.light .match-status-tab[aria-selected="true"] {
  background: #39dbbf;
  border-color: #39dbbf;
  color: #0e1019;
}
@media (max-width: 767px) {
  .match-status-tab {
    height: 36px;
    font-size: 12.5px;
  }
}

/* قسم واحد ظاهر */
.match-status-tabs[data-active="coming"] ~ :is(.matches-wrapper, .stad-matches-block):is(:has(> #end_match_load), :has(> #postponed_match_load), :has(> #stad_end_matches)),
.match-status-tabs[data-active="end"] ~ :is(.matches-wrapper, .stad-matches-block):is(:has(> #coming_match_load), :has(> #postponed_match_load), :has(> #stad_coming_matches)),
.match-status-tabs[data-active="postponed"] ~ :is(.matches-wrapper, .stad-matches-block):is(:has(> #coming_match_load), :has(> #end_match_load)) {
  display: none !important;
}

/* الشريط يغني عن عنوان كل قسم */
.match-status-tabs ~ .matches-wrapper > div:has(> .matches-top-title),
.match-status-tabs ~ .stad-matches-block > .stad-matches-heading {
  display: none !important;
}

/* ============================================================
   ٢٣. تبويب الإحصائيات في البطولة والنادي (طلب صاحب الموقع: أكثر تناسقاً مع التصميم).
   كانت بطاقتا الأهداف والمباريات بعرض الجوال وارتفاع 140px، والأرقام الصغيرة بطاقات
   طويلة بأيقونة فوق الرقم تترك فراغاً حين يكون عددها فردياً، وجدول الأعلى والأقل
   بشعارات لا تصطف وصفوف بارتفاع 128px على الجوال. صارت:
   - الأرقام الكبرى صفاً واحداً بأعمدة متساوية (اثنان في البطولة، ثلاثة في النادي).
   - الأرقام الصغيرة بطاقات قصيرة: الرقم ثم اسمه من بداية السطر والأيقونة في الطرف،
     ثلاثة أعمدة على الأوسع وعمودان على الجوال (الأخيرة بعرض الصف إن بقيت وحدها).
   - جدول الأعلى والأقل بشكل جداول الموقع: الشعار والاسم من بداية الخانة في عمود
     واحد، والرقم في طرفها.
   بألوان الموقع وزواياه، بلا ظل ولا حركة. القوالب كما هي (أعمدة bootstrap تُلغى هنا).
   ============================================================ */
.champ-tab-item.statics .row:has(> [class*="col"] > .team-stat-card) {
  display: grid;
  gap: 8px;
  margin: 0 0 12px !important;
}
.champ-tab-item.statics .row:has(> [class*="col"] > .team-stat-card) > [class*="col"] {
  width: auto;
  max-width: none;
  margin: 0 !important;
  padding: 0 !important;
}
.champ-tab-item.statics .row:has(> [class*="col"] > .team-stat-card-large) {
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
}
.champ-tab-item.statics .row:has(> [class*="col"] > .team-stat-card:not(.team-stat-card-large)) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 767px) {
  .champ-tab-item.statics .row:has(> [class*="col"] > .team-stat-card:not(.team-stat-card-large)) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .champ-tab-item.statics .row:has(> [class*="col"] > .team-stat-card:not(.team-stat-card-large)) > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

.champ-tab-item.statics .team-stat-card {
  position: relative;
  height: 100%;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 6px;
  padding: 14px 16px !important;
  text-align: start !important;
  transform: none !important;
  transition: none !important;
}
.champ-tab-item.statics .team-stat-card:hover {
  transform: none !important;
  box-shadow: none !important;
  border-color: var(--ui-line) !important;
}
.champ-tab-item.statics :is(.team-stat-value, .team-stat-value-small) {
  margin: 0 !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}
.champ-tab-item.statics .team-stat-value {
  font-size: 28px !important;
}
.champ-tab-item.statics .team-stat-value-small {
  font-size: 22px !important;
}
.champ-tab-item.statics .team-stat-title {
  margin: 0;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.35;
  color: #9aa0b5 !important;
}
.champ-tab-item.statics .team-stat-icon {
  position: absolute;
  top: 14px;
  inset-inline-end: 14px;
  margin: 0 !important;
  line-height: 0;
}
.champ-tab-item.statics .team-stat-icon svg {
  width: 20px !important;
  height: 20px !important;
  filter: none !important;
}
html.light .champ-tab-item.statics :is(.team-stat-value, .team-stat-value-small) {
  color: #131521 !important;
}
html.light .champ-tab-item.statics .team-stat-title {
  color: #6b7289 !important;
}
@media (min-width: 768px) {
  .champ-tab-item.statics .team-stat-value {
    font-size: 32px !important;
  }
  .champ-tab-item.statics .team-stat-value-small {
    font-size: 24px !important;
  }
}

/* جدول الأعلى والأقل */
.champ-tab-item.statics .season-highest-lowest {
  margin-top: 0 !important;
}
.champ-tab-item.statics .season-highest-lowest-table-wrapper {
  border-radius: var(--ui-r-card) !important;
}
.champ-tab-item.statics .season-highest-lowest-table {
  table-layout: fixed;
  border: 1px solid var(--ui-line) !important;
}
.champ-tab-item.statics .season-highest-lowest-table th {
  padding: 10px 14px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-align: start !important;
  color: #9aa0b5 !important;
  border-bottom: 1px solid var(--ui-line) !important;
}
.champ-tab-item.statics .season-highest-lowest-table th.highest-header {
  color: #5bd286 !important;
}
.champ-tab-item.statics .season-highest-lowest-table th.lowest-header {
  color: #fc4d4d !important;
}
.champ-tab-item.statics .season-highest-lowest-table td {
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--ui-line) !important;
  vertical-align: middle;
}
.champ-tab-item.statics .season-highest-lowest-table tbody tr:last-child td {
  border-bottom: 0 !important;
}
.champ-tab-item.statics .season-highest-lowest-table tbody tr:hover {
  background: transparent !important;
}
.champ-tab-item.statics .season-stat-name {
  width: 30% !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #e3e6f0 !important;
  white-space: normal !important;
}
.champ-tab-item.statics .season-stat-team-cell {
  width: 35% !important;
  text-align: start !important;
}
.champ-tab-item.statics .season-stat-team {
  display: flex !important;
  width: 100%;
  min-width: 0 !important;
  justify-content: flex-start !important;
  align-items: center;
  gap: 8px !important;
}
.champ-tab-item.statics .season-stat-team img {
  width: 24px !important;
  height: 24px !important;
}
.champ-tab-item.statics .season-stat-team-info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  justify-content: space-between;
  gap: 6px !important;
}
.champ-tab-item.statics .season-stat-team-name {
  min-width: 0;
  /* الاسم الطويل (Club Brugge في الإنجليزية على الجوال) ينزل سطراً ثانياً بدل أن يُقطع */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.25;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #bfc3d4 !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}
.champ-tab-item.statics .season-stat-team:hover .season-stat-team-name {
  color: #39dbbf !important;
}
.champ-tab-item.statics .season-stat-team-value {
  flex: 0 0 auto;
  min-width: 0 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}
html.light .champ-tab-item.statics .season-highest-lowest-table th {
  color: #6b7289 !important;
}
html.light .champ-tab-item.statics .season-highest-lowest-table th.highest-header {
  color: #2a9d5c !important;
}
html.light .champ-tab-item.statics .season-highest-lowest-table th.lowest-header {
  color: #d63b3b !important;
}
html.light .champ-tab-item.statics .season-stat-name {
  color: #131521 !important;
}
html.light .champ-tab-item.statics .season-stat-team-name {
  color: #2a3142 !important;
}
html.light .champ-tab-item.statics .season-stat-team:hover .season-stat-team-name {
  color: #16ae94 !important;
}
html.light .champ-tab-item.statics .season-stat-team-value {
  color: #131521 !important;
}
@media (max-width: 767px) {
  .champ-tab-item.statics .season-highest-lowest-table :is(th, td) {
    padding-inline: 6px !important;
  }
  .champ-tab-item.statics .season-stat-name {
    width: 25% !important;
    font-size: 12.5px !important;
  }
  .champ-tab-item.statics .season-stat-team-cell {
    width: 37.5% !important;
  }
  .champ-tab-item.statics .season-stat-team {
    gap: 5px !important;
  }
  .champ-tab-item.statics .season-stat-team-info {
    gap: 5px !important;
  }
  .champ-tab-item.statics .season-stat-team img {
    width: 20px !important;
    height: 20px !important;
  }
  .champ-tab-item.statics .season-stat-team-name {
    font-size: 12px !important;
  }
}

/* ============================================================
   ٢٤. بقية تبويب إحصائيات النادي بشكل البطاقات أعلاه (طلب صاحب الموقع):
   - «إحصائيات الموسم»: كان رأسها شريطاً أخضر ممتلئاً بظل، وأرقامها في الوسط والقيمة
     السوقية خضراء. صار الرأس شريط عناوين جداول الموقع، والأرقام كبطاقات الأرقام: الرقم
     ثم اسمه من بداية السطر، أربعة أعمدة على الأوسع وعمودان على الجوال.
   - أزرار البطولات فوق الأرقام (tab-statics-filter): كانت المختارة خضراء ممتلئة بظل
     وترتفع عند التمرير، وتخرج عن حافة الجوال. صارت بشكل أزرار البطولات في تبويب
     الترتيب (tab-filter-item) نفسه.
   ============================================================ */
.champ-tab-item.statics .season-summary-card {
  overflow: hidden;
  backdrop-filter: none !important;
  margin-bottom: 12px;
}
.champ-tab-item.statics .season-summary-header {
  padding: 10px 16px !important;
  background: var(--ui-head) !important;
  border-bottom: 1px solid var(--ui-line);
  box-shadow: none !important;
  color: #e3e6f0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-align: start !important;
}
.champ-tab-item.statics .season-summary-body {
  display: grid !important;
  /* أعمدة بعدد الأرقام: ثلاثة حين تُخفى القيمة السوقية الغائبة، وأربعة حين توجد */
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 14px 12px !important;
  padding: 14px 16px !important;
  text-align: start !important;
}
.champ-tab-item.statics .season-summary-item {
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
  padding: 0 !important;
}
.champ-tab-item.statics .season-summary-item .label {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  color: #9aa0b5 !important;
}
.champ-tab-item.statics .season-summary-item .value,
.champ-tab-item.statics .season-summary-item .value.accent {
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  color: #ffffff !important;
}
html.light .champ-tab-item.statics .season-summary-header {
  color: #131521 !important;
}
html.light .champ-tab-item.statics .season-summary-item .label {
  color: #6b7289 !important;
}
html.light .champ-tab-item.statics .season-summary-item :is(.value, .value.accent) {
  color: #131521 !important;
}

/* على الكمبيوتر يلفّ سكربت التمرير الأفقي (mCustomScrollbar) الأزرار في غلاف كتلي،
   فتبقى الأزرار مضمّنة (inline-flex) والمسافة بينها هامشاً لا gap */
.champ-tab-item.statics .champ-filters {
  display: flex !important;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 0 !important;
  margin: 0 0 12px !important;
  padding: 0 0 2px !important;
}
.champ-tab-item.statics .tab-statics-filter {
  flex-shrink: 0;
  display: inline-flex !important;
  vertical-align: middle;
  align-items: center;
  gap: 8px !important;
  height: 36px;
  padding: 0 12px !important;
  margin: 0 !important;
  margin-inline-end: 8px !important;
  border-radius: var(--ui-r-item) !important;
  border: 1px solid #2a2f45 !important;
  background: #1f2130 !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 18px;
  text-decoration: none;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.champ-tab-item.statics .tab-statics-filter:hover {
  color: #ffffff !important;
}
.champ-tab-item.statics .tab-statics-filter.active {
  background: rgba(57, 219, 191, 0.12) !important;
  border-color: #39dbbf !important;
  color: #ffffff !important;
}
.champ-tab-item.statics .tab-statics-filter .img img {
  width: 20px !important;
  height: 20px !important;
}
html.light .champ-tab-item.statics .tab-statics-filter {
  background: #f4f5fa !important;
  border-color: #e3e5f0 !important;
  color: #0e1019 !important;
}
html.light .champ-tab-item.statics .tab-statics-filter.active {
  background: rgba(22, 174, 148, 0.1) !important;
  border-color: #10816e !important;
  color: #0e1019 !important;
}

/* «متوسط إحصائيات الفريق بالمباراة»: كانت بين البطاقات 31px (فراغ الشبكة 16 وهامش
   كل بطاقة 15)، صارت 8px كبطاقات الأرقام */
.champ-tab-item.statics .match-stats-block.new_statics {
  gap: 8px !important;
}
.champ-tab-item.statics .new_statics .progress-state-item {
  margin: 0 !important;
  padding: 12px 16px !important;
}

/* ============================================================
   ٢٥. فريق الجولة في البطولة (partials/round-xi-tab، طلب صاحب الموقع: أكثر تناسقاً
   مع التصميم). الشكل وحده؛ القالب وأسماء العناصر التي يبدّلها سكربت الجولات كما هي.
   - أزرار الجولات بشكل شريط «القادمة / المنتهية» (القسم ٢٢)، وكانت حبوباً مدوّرة.
   - الخطة ومتوسط التقييم بشكل بطاقات الأرقام في الإحصائيات (القسم ٢٣).
   - بطاقتا لاعب الجولة والمدرب بلا ظل ولا مربع حول النجمة، والتقييم شارة صغيرة بدل
     الدائرة المحاطة بحلقة، واسم الفريق بلون النص (كان أزرق الروابط الافتراضي).
   - الملعب: الخطة كانت نصاً أبيض على شريحة بيضاء فلا تُقرأ، فصارت على شريحة داكنة،
     وبلا ظل تحت الصور. شعارات الأندية وحدها بلا دائرة بيضاء (قاعدة صاحب الموقع لكل
     عمل جديد).
   - قائمة الفريق برأس جداول الموقع.
   ============================================================ */
.round-xi-page .round-xi-toolbar {
  margin: 0 0 10px;
}
.round-xi-page .round-xi-meta-line {
  font-size: 15px;
  font-weight: 800;
}
.round-xi-page .round-xi-stats {
  gap: 8px;
}
.round-xi-page .round-xi-stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  min-width: 96px;
  padding: 10px 14px;
  background: var(--ui-card);
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-r-item);
  text-align: start;
}
.round-xi-page .round-xi-stat b {
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  color: #ffffff;
}
.round-xi-page .round-xi-stat span {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #9aa0b5;
}

.round-xi-page .round-xi-rounds {
  gap: 8px;
  padding: 0 0 12px;
}
.round-xi-page .round-xi-chip {
  height: 36px;
  padding: 0 16px;
  border-radius: var(--ui-r-item);
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(25, 29, 45, 0.9);
  color: rgba(255, 255, 255, 0.55);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.round-xi-page .round-xi-chip:hover {
  color: rgba(255, 255, 255, 0.88);
  border-color: rgba(255, 255, 255, 0.14);
}
.round-xi-page .round-xi-chip:is(.is-on, [aria-pressed="true"]) {
  background: #39dbbf;
  border-color: #39dbbf;
  color: #0e1019;
}

.round-xi-page .round-xi-highlights {
  gap: 8px;
  margin-bottom: 12px;
}
.round-xi-page .round-xi-card {
  padding: 14px 16px;
  background: var(--ui-card);
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-r-card);
  box-shadow: none !important;
}
.round-xi-page .round-xi-card-label {
  gap: 6px;
  margin-bottom: 10px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #9aa0b5;
}
.round-xi-page .round-xi-star {
  width: auto;
  height: auto;
  background: none;
  border-radius: 0;
  font-size: 14px;
  color: #ffc420;
}
.round-xi-page :is(.round-xi-motm img, .round-xi-coach > a:first-child img) {
  width: 52px;
  height: 52px;
}
.round-xi-page :is(.round-xi-motm, .round-xi-coach) h2 {
  font-size: 15px;
  font-weight: 800;
}
.round-xi-page :is(.round-xi-motm, .round-xi-coach) p {
  font-size: 12.5px;
  color: #9aa0b5;
}
.round-xi-page .round-xi-rating {
  min-width: 0;
  height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: var(--ui-r-small);
  background: rgba(255, 196, 32, 0.14);
  color: #ffc420;
  font-size: 15px;
  font-weight: 800;
}
.round-xi-page .round-xi-coach p a {
  color: #9aa0b5;
  text-decoration: none;
  transition: color 0.2s ease;
}
.round-xi-page .round-xi-coach p a:hover {
  color: #39dbbf;
}
.round-xi-page .round-xi-coach p strong {
  font-weight: 600;
}
.round-xi-page .round-xi-coach-badge {
  background: none;
  border-color: transparent;
  border-radius: 0;
}

/* تحت الملعب كان شريط بلون البطاقة: ظل غلافه (round-xi.css) يظهر في هامش 32px فارغ
   تحت أرضية الملعب داخل الغلاف */
.round-xi-pitch-wrap {
  box-shadow: none !important;
  margin-bottom: 12px !important;
}
.champ-tab-item .round-xi-page .teams-lineup .lineup-wrap {
  margin-bottom: 0;
}
/* على الكمبيوتر كان الملعب 3:4 بعرض العمود (قرابة 900px) بفراغات واسعة بين الصفوف؛
   صار مربعاً (قرابة 680px) والصفوف تتوزع عليه بنسبها */
@media (min-width: 768px) {
  .champ-tab-item .round-xi-page .teams-lineup .lineup-wrap {
    aspect-ratio: 1 / 1;
  }
}
.round-xi-page .lineup-player-item .img {
  box-shadow: none;
}
.round-xi-page .team_cap img {
  background: none;
  border-radius: 0;
}
html .round-xi-page .lineup-custom-row .logo {
  width: auto;
  height: auto;
  background: none;
  border-radius: 0;
}
.round-xi-page .lineup-custom-row .logo img {
  height: 14px;
  opacity: 0.8;
}
html .round-xi-page .lineup-custom-row .lineup-text {
  padding: 4px 10px;
  border-radius: var(--ui-r-small);
  background: rgba(0, 0, 0, 0.35);
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-shadow: none;
}

.round-xi-page .round-xi-list {
  background: var(--ui-card);
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-r-card);
}
.round-xi-page .round-xi-list h3 {
  padding: 10px 16px;
  background: var(--ui-head);
  border-bottom: 1px solid var(--ui-line);
  font-size: 13px;
  font-weight: 700;
  color: #e3e6f0;
}
.round-xi-page .round-xi-list a {
  grid-template-columns: 28px 36px minmax(0, 1fr) auto;
  gap: 10px;
  padding: 8px 16px;
  border-bottom-color: var(--ui-line);
}
.round-xi-page .round-xi-list a:hover {
  background: var(--ui-head);
}
.round-xi-page .round-xi-list img {
  width: 36px;
  height: 36px;
}
.round-xi-page .round-xi-list .n {
  font-size: 13px;
  font-weight: 700;
  color: #9aa0b5;
}
.round-xi-page .round-xi-list .nm {
  font-size: 13.5px;
  font-weight: 700;
}
.round-xi-page .round-xi-list .rt {
  font-size: 14px;
  font-weight: 800;
}

html.light .round-xi-page .round-xi-stat b {
  color: #131521;
}
html.light .round-xi-page :is(.round-xi-stat span, .round-xi-card-label, .round-xi-motm p, .round-xi-coach p, .round-xi-coach p a, .round-xi-list .n) {
  color: #6b7289;
}
html.light .round-xi-page .round-xi-coach p a:hover {
  color: #16ae94;
}
html.light .round-xi-page .round-xi-chip {
  background: #ffffff;
  border-color: rgba(14, 16, 25, 0.1);
  color: #6b7080;
}
html.light .round-xi-page .round-xi-chip:hover {
  color: #2a3142;
  border-color: rgba(14, 16, 25, 0.16);
}
html.light .round-xi-page .round-xi-chip:is(.is-on, [aria-pressed="true"]) {
  background: #39dbbf;
  border-color: #39dbbf;
  color: #0e1019;
}
html.light .round-xi-page .round-xi-star {
  color: #c88800;
}
html.light .round-xi-page .round-xi-rating {
  background: rgba(200, 136, 0, 0.12);
  color: #a66f00;
}
html.light .round-xi-page .round-xi-list h3 {
  color: #131521;
}

/* ============================================================
   ٢٦. زر «مباشر» في رأس قائمة المباريات (الرئيسية وصفحة المباريات،
   partials/matches-toolbar؛ طلب صاحب الموقع: غير متناسق وغير لطيف). كان حبّة مدوّرة
   تماماً بخط 11px ونقطة رمادية، وعلى الجوال أعلى من شريط التاريخ بجانبه (28 مقابل
   26)، وحين يعمل يتوهج بظل أحمر. صار بشكل شريط التاريخ: زاويته 10 وارتفاعه وخلفيته
   وحدّه، ونقطته حمراء دائماً (علامة البث المباشر)، وحين يعمل يتلوّن بالأحمر وتنبض
   النقطة بلا توهج.
   ============================================================ */
#match_list_conf.home-matches-panel .section-actions .live-only-toggle {
  height: 28px;
  gap: 6px;
  padding: 0 10px;
  border-radius: var(--ui-r-item);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  box-shadow: none;
}
#match_list_conf.home-matches-panel .section-actions .live-only-led {
  width: 7px;
  height: 7px;
  background: #fc4d4d;
  box-shadow: none;
}
html.light #match_list_conf.home-matches-panel .section-actions .live-only-led {
  background: #e5484d;
}
#match_list_conf.home-matches-panel .section-actions .live-only-toggle.is-on {
  color: #ff6b6b;
  border-color: rgba(252, 77, 77, 0.5);
  background: rgba(252, 77, 77, 0.12);
  box-shadow: none;
}
html.light #match_list_conf.home-matches-panel .section-actions .live-only-toggle.is-on {
  color: #d63b3b;
  border-color: rgba(214, 59, 59, 0.45);
  background: rgba(214, 59, 59, 0.08);
}
#match_list_conf.home-matches-panel .section-actions .live-only-toggle.is-on .live-only-led {
  box-shadow: none;
  animation: yss-live-dot 1.4s ease-in-out infinite;
}
@keyframes yss-live-dot {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.35;
  }
}
@media (prefers-reduced-motion: reduce) {
  #match_list_conf.home-matches-panel .section-actions .live-only-toggle.is-on .live-only-led {
    animation: none;
  }
}
@media (max-width: 767px) {
  #match_list_conf.home-matches-panel .section-actions .live-only-toggle {
    height: 26px;
    padding: 0 9px;
    font-size: 11.5px;
  }
}

/* ============================================================
   ٢٧. بطاقات الأخبار في الوضع الفاتح (الرئيسية وتبويبات الأخبار في الأندية والبطولات؛
   طلب صاحب الموقع: بالكاد تُرى). البطاقة بيضاء على خلفية الصفحة ‎#f8f9fc‎ بحدّ شفاف،
   فالفرق بينهما قرابة 1٪. صار لها حدّ رفيع ‎#dde2ec‎ يرسم حوافها، بلا ظل؛ وعند
   التمرير يتلوّن الحدّ كما كان. الداكن كما هو.
   ============================================================ */
html.light .home-news.team-page-news :is(.big-news-item, .news-row, .mini-news-items) .news-item {
  border: 1px solid #dde2ec !important;
}
html.light .home-news.team-page-news :is(.big-news-item, .news-row, .mini-news-items) .news-item:hover {
  border-color: rgba(22, 174, 148, 0.45) !important;
}

/* ============================================================
   ٢٨. بطاقة أحداث المباراة (match_events: تبويب الأحداث في صفحة المباراة، ولوحة
   التفاصيل التي تفتح من قوائم الرئيسية والأندية والبطولات؛ طلب صاحب الموقع: غير
   متناسقة خاصة في الداكن). كان فوق لون البطاقة طبقة متدرّجة أفتح من أعلاها، وشريط
   «انتهت المباراة» (وبداية المباراة ونهاية الشوط) بلون ثالث، والزاويتان السفليتان
   مربعتين (صفّها الأخير يرسم خلفيته فوقهما)، وزر الفيديو دائرة زرقاء ممتلئة. صارت
   بلون البطاقات وحدّها وزاويتها بلا تدرّج، والشرائط بلون رؤوس الجداول، والفواصل بلون
   الخط، وزر الفيديو بلون أيقونة الملخص في قوائم المباريات.
   ============================================================ */
:is(.match-detail-content, .dynamic-content-area-wrap) .match-events-wrap {
  background-color: var(--ui-card) !important;
  background-image: none !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-r-card) !important;
  box-shadow: none !important;
  overflow: hidden;
}
:is(.match-detail-content, .dynamic-content-area-wrap) .match-events-wrap .match-event-item {
  border-color: var(--ui-line) !important;
}
:is(.match-detail-content, .dynamic-content-area-wrap) .match-event-item .video-icon svg :is(path, circle) {
  fill: #53c3b7;
}
/* شرائط بداية المباراة ونهايتها ونهاية الأشواط بلون «الداخل» في الموقع (‎--ui-inset‎:
   أغمق قليلاً من البطاقة في الداكن، ورمادي فاتح جداً في الفاتح)، وهو لون العناصر داخل
   البطاقات. طلب صاحب الموقع لوناً موجوداً قريباً من البطاقة بعد أن لم يعجبه رمادي رؤوس
   الجداول ولا صبغة الأخضر. النص رمادي هادئ والصافرة بلونها الأصلي. */
:is(.match-detail-content, .dynamic-content-area-wrap) .match-events-wrap .match-event-item.start-end-match {
  background: var(--ui-inset) !important;
  color: #9aa0b5 !important;
}
:is(.match-detail-content, .dynamic-content-area-wrap) .match-events-wrap .match-event-item.start-end-match :is(.title, .subtitle) {
  color: inherit !important;
}
:is(.match-detail-content, .dynamic-content-area-wrap) .match-events-wrap .match-event-item.start-end-match .m-result {
  color: #ffffff;
}
html.light :is(.match-detail-content, .dynamic-content-area-wrap) .match-events-wrap .match-event-item.start-end-match {
  color: #6b7289 !important;
}
html.light :is(.match-detail-content, .dynamic-content-area-wrap) .match-events-wrap .match-event-item.start-end-match .m-result {
  color: #131521;
}
html.light :is(.match-detail-content, .dynamic-content-area-wrap) .match-event-item .video-icon svg :is(path, circle) {
  fill: #2b9186;
}
/* زر الفيديو على الطرف الخارجي لجهة صاحب الحدث (خارج التدفق)، فكان آخر الاسم الطويل
   يمرّ تحته على الجوال في اللغتين (أناستاسيوس دوفيكاس). يُحجز مكانه على طرفي السطر
   فتبقى دائرة الدقيقة في المنتصف */
:is(.match-detail-content, .dynamic-content-area-wrap) .match-event-item.has_video .t-side.team-a {
  padding-inline-start: 36px;
}
:is(.match-detail-content, .dynamic-content-area-wrap) .match-event-item.has_video .t-side.team-b {
  padding-inline-end: 36px;
}

/* ============================================================
   ٢٩. بقية بطاقات لوحة تفاصيل المباراة (‎.ajax-details-wrapper‎ التي تفتح من قوائم
   الرئيسية والأندية والبطولات، وصفحة المباراة؛ طلب صاحب الموقع: بطاقة الفيديو مختلفة
   عن الموقع، وكل ما يشبهها). بطاقات الفيديو وملخص الاستحواذ والإحصائيات كان فوق لونها
   التدرّج نفسه الذي أُزيل عن بطاقة الأحداث (القسم ٢٨)، فصارت بلون البطاقات وحدّها
   وزاويتها.
   وأيقونات بطاقات الفيديو (الأهداف، الملخص، المباراة الكاملة) كانت بثلاثة أساليب
   وألوان (كرة خضراء، شاشة زرقاء بنجمة ونقاط، ملعب بنفسجي): صارت كلها بلون واحد يتبع
   الوضع، وأيقونة الملخص مرسومة من جديد (partials/icons/match_highlight).
   ============================================================ */
:is(.ajax-details-wrapper, .dynamic-content-area-wrap, .match-detail-content) :is(.match-quick-link, .match-stats-block, .teams-stats-wrap) {
  background-color: var(--ui-card) !important;
  background-image: none !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-r-card) !important;
  box-shadow: none !important;
}
.match-quick-link svg {
  height: 26px !important;
  width: auto !important;
  color: #39dbbf;
}
.match-quick-link svg :is(path, circle):not([fill="none"]) {
  fill: currentColor;
}
html.light .match-quick-link svg {
  color: #16ae94;
}

/* ============================================================
   ٣٠. «الأخبار المتعلقة» في صفحة الخبر (طلب صاحب الموقع: الأخبار متلاصقة بلا فاصل،
   خاصة في الفاتح). صارت كصفوف جداول الموقع داخل البطاقة: خط رفيع بلون الخط بين كل خبر
   والذي يليه بدل الفراغ الصغير، في الوضعين.
   ============================================================ */
.news-related .news-related__list {
  gap: 0 !important;
}
.news-related .news-related__list > .news-related__item {
  margin: 0 !important;
  padding-block: 12px !important;
  border-radius: 0 !important;
}
.news-related .news-related__list > .news-related__item + .news-related__item {
  border-top: 1px solid var(--ui-line) !important;
}

/* ============================================================
   ٣١. صور بطاقات الأخبار الصغيرة (شبكة أخبار الرئيسية، وتبويبات الأخبار في الأندية
   والبطولات؛ طلب صاحب الموقع: الصورة تأتي مقصوصة). إطارها كان 16:9 (و16:10 على
   الأجهزة المتوسطة) وصور الأخبار نحو 3:2 (640×410 و640×427)، فكان يُقص 16 إلى 20٪ من
   ارتفاع كل صورة. صار الإطار 3:2 في كل المقاسات فتظهر الصورة كاملة تقريباً. البطاقة
   الكبرى (820×472 في إطار 1.76) كما هي.
   ============================================================ */
.home-news.team-page-news .news-row .news-item .news-img {
  aspect-ratio: 3 / 2 !important;
}
/* «الأخبار المتعلقة» في صفحة الخبر: المصغّرة كانت 108×70 على الكمبيوتر و92×70 على
   الجوال (يُقص حتى 40٪ من عرض الصورة)؛ صارت 105×70 (3:2) في المقاسين */
.news-related .news-related__list > .news-related__item {
  grid-template-columns: 105px minmax(0, 1fr) !important;
}
.news-related .news-related__list > .news-related__item .news-related__thumb {
  width: 105px !important;
  height: 70px !important;
  aspect-ratio: 3 / 2 !important;
}

/* ============================================================
   ٣٢. البطولات المطويّة في قائمة المباريات (الرئيسية وصفحة المباريات؛ طلب صاحب الموقع:
   البطولة غير الموجودة في جدول season_list_view للغة تظهر باسمها وحده وتُفتح بالضغط
   عليه؛ App\Support\SeasonListView و partials/matches-list-body). يُخفى ما تحت رأسها،
   وعدد مبارياتها وسهم ينقلب حين تُفتح ثابتان بجانب ⋯ ليصطفّا في كل البطولات.
   في وضع «مباشر» تظهر الجارية منها.
   ============================================================ */
#match_list_conf:not(.live-only-on) .matches-wrapper.is-collapsed > :not(.header) {
  display: none !important;
}
/* الشريط: الاسم والشعار رابط صفحة البطولة بعرض محتواه فقط، والعدد وزر السهم ملاصقان لـ ⋯
   في الطرف (طلب صاحب الموقع؛ كانا بعد الاسم فيتغيّر مكانهما بطوله). الضغط في فراغ الشريط
   يفتح ويطوي كالزر (partials/champ-collapse-script). */
.matches-wrapper.is-collapsible > .header {
  justify-content: flex-start !important;
  cursor: pointer;
}
.matches-wrapper.is-collapsible > .header .champ-title {
  flex: 0 1 auto !important;
  min-width: 0;
}
.matches-wrapper.is-collapsible > .header .champ-collapse-count {
  margin-inline-start: auto;
}
/* بلا هامش ⋯ القديم (24 من style.css، كان يفصلها عن روابط أُزيلت) فيلاصقها السهم */
.matches-wrapper.is-collapsible > .header .champ-actions,
.matches-wrapper.is-collapsible > .header .champ-settings-dropdown-wrap {
  margin-inline-start: 0;
}
.champ-collapse-meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 4px;
  border: 0;
  border-radius: var(--ui-r-small);
  background: none;
  color: #8b90a5;
  line-height: 1;
  cursor: pointer;
}
.champ-collapse-meta:focus-visible {
  outline: 2px solid #39dbbf;
  outline-offset: 2px;
}
/* وضع «مباشر»: جاريات البطولة المطويّة ظاهرة كلها، فلا عدد ولا سهم (طلب صاحب الموقع)،
   والشريط لا يفتح ولا يطوي (partials/champ-collapse-script) */
#match_list_conf.live-only-on .matches-wrapper.is-collapsible > .header .champ-collapse-count,
#match_list_conf.live-only-on .matches-wrapper.is-collapsible > .header .champ-collapse-meta {
  display: none !important;
}
#match_list_conf.live-only-on .matches-wrapper.is-collapsible > .header .champ-actions {
  margin-inline-start: auto;
}
#match_list_conf.live-only-on .matches-wrapper.is-collapsible > .header {
  cursor: default;
}
.champ-collapse-count {
  flex: 0 0 auto;
  min-width: 20px;
  height: 20px;
  margin-inline-start: 8px;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-r-small);
  background: rgba(255, 255, 255, 0.06);
  color: #8b90a5;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.champ-collapse-chevron {
  transition: transform 0.2s ease;
}
.matches-wrapper.is-collapsible:not(.is-collapsed) .champ-collapse-chevron {
  transform: rotate(180deg);
}
html.light .champ-collapse-meta {
  color: #6b7289;
}
html.light .champ-collapse-count {
  background: rgba(14, 16, 25, 0.06);
  color: #6b7289;
}
/* البطولة المطويّة التي فيها مباراة جارية (طلب صاحب الموقع: لون مميز بسيط): عدد
   مبارياتها بلون زر «مباشر» ونقطة تنبض. ‎:has()‎ يتبع الصفوف فيتغيّر وحده حين تبدأ
   المباراة أو تنتهي. */
.matches-wrapper.is-collapsible:has(.mb-row.active-match) .champ-collapse-count {
  background: rgba(252, 77, 77, 0.14);
  color: #ff6b6b;
}
.matches-wrapper.is-collapsible:has(.mb-row.active-match) .champ-collapse-count::before {
  content: "";
  flex: 0 0 auto;
  width: 6px;
  height: 6px;
  margin-inline-end: 5px;
  border-radius: 50%;
  background: #fc4d4d;
  animation: yss-live-dot 1.4s ease-in-out infinite;
}
html.light .matches-wrapper.is-collapsible:has(.mb-row.active-match) .champ-collapse-count {
  background: rgba(214, 59, 59, 0.1);
  color: #d63b3b;
}
html.light .matches-wrapper.is-collapsible:has(.mb-row.active-match) .champ-collapse-count::before {
  background: #e5484d;
}
@media (prefers-reduced-motion: reduce) {
  .matches-wrapper.is-collapsible:has(.mb-row.active-match) .champ-collapse-count::before {
    animation: none;
  }
}

/* ============================================================
   ٣٣. رسائل النتائج الحية في الرئيسية (‎#matchResultNotifications‎، تصلها من الويب سوكيت
   عبر resources/js/reverb.js) لا تظهر على الهاتف ولا الشاشة الصغيرة (طلب صاحب الموقع).
   الخادم يخفيها للهاتف من متصفحه (‎.is-hidden-handset‎ في HomeController)، لكنه لا يعرف
   عرض الشاشة، فكانت تظهر في نافذة كمبيوتر مصغّرة وفي هاتف بنسخة الكمبيوتر. الحدّ 767 هو
   عرض تصميم الجوال نفسه (يظهر عنده شريط الأسفل)، فالتابلت فوقه وتبقى له كما كانت.
   ============================================================ */
@media (max-width: 767px) {
  .match-result-notifications {
    display: none;
  }
}

/* ============================================================
   ٣٤. «الغائبون» في التشكيلة (تبويب التشكيلة في صفحة المباراة وصفحة التشكيلة، صنف
   ‎.missed‎ من lineup.js و partials/lineup_ssr_missed_item؛ طلب صاحب الموقع: مثل
   التطبيق). رقم القميص على زاوية الصورة كالبدلاء، وتحت اسم المصاب سطرا «نوع الإصابة» و
   «العودة المتوقعة» (App\Support\LineupInjury) وأيقونة صغيرة في الفراغ بين الصورة والنص.
   الفراغ نفسه لكل الغائبين فتبدأ الأسماء على خط واحد، والسبب («مصاب») يبقى على طرف السطر
   في الجوال (كانت عناصر القائمة تلتف هناك) والنص الطويل يلتف داخل عموده.
   ============================================================ */
.inline-player-item.missed {
  flex-wrap: nowrap !important;
}
.inline-player-item.missed > .player {
  flex: 0 1 auto;
  min-width: 0;
}
.inline-player-item.missed .player .img {
  width: 40px;
  height: 40px;
  margin-inline-start: 0 !important;
  margin-inline-end: 30px !important;
}
.inline-player-item.missed .player .text {
  min-width: 0;
}
.inline-player-item.missed .reason {
  flex: 0 0 auto;
  padding-inline-start: 12px;
}
.inline-player-item.missed .absent-injury {
  position: relative;
  margin-top: 4px;
}
.inline-player-item.missed .player .absent-injury span {
  display: block;
  font-size: 12px;
  line-height: 1.6;
}
.inline-player-item.missed .absent-injury-icon {
  position: absolute;
  top: 50%;
  inset-inline-start: -21px;
  width: 12px;
  height: 12px;
  margin-top: -6px;
}
/* الجوال: فراغ أضيق حتى يتسع السطر لاسم الإصابة الطويل */
@media (max-width: 767px) {
  .inline-player-item.missed .player .img {
    margin-inline-end: 22px !important;
  }
  .inline-player-item.missed .absent-injury-icon {
    inset-inline-start: -17px;
  }
  .inline-player-item.missed .reason {
    padding-inline-start: 8px;
  }
}