/* matches.css — Page « مباريات » (footarabi-tabs). RTL. */
.fa-mb-wrap { --fa-red:#c8102e; --fa-bg:#0f1822; --fa-card:#16212e; --fa-line:#26333f;
    direction:rtl; font-family:inherit; color:#eef3f7; background:var(--fa-bg);
    border-radius:14px; padding:14px; max-width:760px; margin:0 auto; }

.fa-mb-header { text-align:center; margin-bottom:12px; }
.fa-mb-h-title { font-size:1.25rem; font-weight:800; }

/* Barre de navigation : 5 boutons, droite→gauche */
.fa-mb-nav { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; margin-bottom:12px; }
.fa-mb-btn { display:flex; align-items:center; gap:6px; cursor:pointer;
    background:var(--fa-card); color:#cdd8e2; border:1px solid var(--fa-line);
    border-radius:999px; padding:8px 14px; font-size:.95rem; font-weight:700;
    transition:all .15s ease; }
.fa-mb-btn:hover { border-color:var(--fa-red); color:#fff; }
.fa-mb-btn.active { background:var(--fa-red); border-color:var(--fa-red); color:#fff; }
.fa-mb-ico { font-size:1rem; }

.fa-mb-datebar { display:flex; justify-content:center; margin-bottom:10px; }
.fa-mb-date-label { font-size:.9rem; color:#cdd8e2; display:flex; align-items:center; gap:8px; }
.fa-mb-date { background:var(--fa-card); color:#fff; border:1px solid var(--fa-line);
    border-radius:8px; padding:6px 10px; font-size:.95rem; }

.fa-mb-subtitle { text-align:center; font-size:.95rem; color:#9fb0bf; margin-bottom:12px; font-weight:700; }

/* Groupe par compétition */
.fa-mb-group { margin-bottom:16px; }
.fa-mb-comp { display:flex; align-items:center; gap:8px; font-weight:800; font-size:1rem;
    color:#fff; padding:8px 10px; background:linear-gradient(90deg,rgba(200,16,46,.18),transparent);
    border-right:3px solid var(--fa-red); border-radius:6px; margin-bottom:8px; }
.fa-mb-clogo { width:22px; height:22px; object-fit:contain; }

/* Carte match */
.fa-mb-card { background:var(--fa-card); border:1px solid var(--fa-line);
    border-radius:10px; padding:10px 12px; margin-bottom:8px; }
.fa-mb-card.is-live { border-color:var(--fa-red); box-shadow:0 0 0 1px rgba(200,16,46,.35) inset; }
.fa-mb-row { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; }

.fa-mb-team { display:flex; align-items:center; gap:8px; min-width:0; }
.fa-mb-home { justify-content:flex-start; }
.fa-mb-away { justify-content:flex-start; flex-direction:row-reverse; text-align:left; }
.fa-mb-logo { width:30px; height:30px; object-fit:contain; flex:0 0 auto; }
.fa-mb-nologo { display:inline-flex; align-items:center; justify-content:center; font-size:18px; }
.fa-mb-tname { font-weight:700; font-size:.95rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.fa-mb-mid { display:flex; flex-direction:column; align-items:center; gap:4px; min-width:88px; }
.fa-mb-score { font-size:1.3rem; font-weight:900; letter-spacing:1px; }
.fa-mb-time { display:flex; flex-direction:column; align-items:center; line-height:1.2; }
.fa-mb-t-ma { font-size:1.1rem; font-weight:800; }
.fa-mb-t-other { font-size:.7rem; color:#8aa0b2; }

.fa-mb-badge { font-size:.72rem; font-weight:800; padding:2px 8px; border-radius:999px; }
.fa-mb-badge-live { background:var(--fa-red); color:#fff; animation:fa-mb-pulse 1.4s infinite; }
.fa-mb-badge-done { background:#26333f; color:#9fb0bf; }
.fa-mb-badge-other{ background:#3a2a12; color:#f0c060; }
@keyframes fa-mb-pulse { 0%,100%{opacity:1;} 50%{opacity:.55;} }

.fa-mb-meta { margin-top:8px; padding-top:8px; border-top:1px dashed var(--fa-line); text-align:center; }
.fa-mb-channel { font-size:.82rem; color:#aebeca; font-weight:700; }

.fa-mb-empty, .fa-mb-error { text-align:center; padding:24px; color:#9fb0bf; font-weight:700; }
.fa-mb-error { color:#ffb4b4; }
.fa-mb-foot { text-align:center; font-size:.72rem; color:#6f8294; margin-top:10px; }

/* Spinner réutilisé du plugin (au cas où non chargé) */
.fa-mb-list .fa-loading { text-align:center; padding:28px; }
.fa-mb-list .fa-spin { width:30px; height:30px; border:3px solid var(--fa-line);
    border-top-color:var(--fa-red); border-radius:50%; margin:0 auto 10px; animation:fa-mb-spin .8s linear infinite; }
@keyframes fa-mb-spin { to { transform:rotate(360deg); } }

@media (max-width:480px) {
    .fa-mb-tname { font-size:.82rem; max-width:90px; }
    .fa-mb-mid { min-width:72px; }
    .fa-mb-btn { padding:7px 11px; font-size:.85rem; }
}