/* ============================================================
   WAFU-A Matchs — frontend.css  (reprend le style du HTML preview)
   ============================================================ */
:root {
  --wafm-vert:  #00843D;
  --wafm-gd:    #005a2b;
  --wafm-jaune: #FDEF00;
  --wafm-rouge: #E2001A;
  --wafm-rd:    #aa0013;
  --wafm-noir:  #111;
  --wafm-t:     .2s ease;
}

.wafm-wrap { font-family:'Lato',sans-serif; }

/* ── ONGLETS ── */
.wafm-tabs { display:flex; border-bottom:3px solid var(--wafm-vert); margin-bottom:20px; }
.wafm-tab { background:none; border:none; padding:12px 28px; font-family:'Oswald',sans-serif; font-size:14px; letter-spacing:1.5px; text-transform:uppercase; cursor:pointer; color:#777; border-bottom:3px solid transparent; margin-bottom:-3px; transition:all var(--wafm-t); }
.wafm-tab:hover { color:var(--wafm-vert); }
.wafm-tab.active { color:var(--wafm-vert); border-bottom-color:var(--wafm-vert); font-weight:700; }
.wafm-tab-panel { display:none; }
.wafm-tab-panel.active { display:block; }

/* ── CARTE DE MATCH ── */
.wafm-match-card {
  background:#fff;
  border:1px solid #e8e8e8;
  margin-bottom:12px;
  border-left:4px solid var(--wafm-vert);
  transition:box-shadow var(--wafm-t), border-color var(--wafm-t);
}
.wafm-match-card:hover { box-shadow:0 6px 20px rgba(0,0,0,.08); }
.wafm-match-card.wafm-mc-live     { border-left-color:var(--wafm-rouge); }
.wafm-match-card.wafm-mc-mi_temps { border-left-color:var(--wafm-rouge); }
.wafm-match-card.wafm-mc-programme{ border-left-color:#1a3a6e; }
.wafm-match-card.wafm-mc-reporte  { border-left-color:#999; }
.wafm-match-card.wafm-mc-annule   { border-left-color:#ccc; opacity:.7; }

/* Header de la carte */
.wafm-mc-header {
  display:flex; justify-content:space-between; align-items:center;
  padding:8px 18px; background:#f8f8f8; border-bottom:1px solid #eee;
  font-size:11px; text-transform:uppercase; letter-spacing:.8px;
}
.wafm-mc-competition { font-family:'Oswald',sans-serif; font-weight:700; color:var(--wafm-gd); }
.wafm-mc-competition em { color:#888; font-style:normal; font-weight:400; }
.wafm-mc-date { color:#888; }

/* Corps de la carte */
.wafm-mc-body {
  display:flex; align-items:center;
  padding:20px 18px; gap:10px;
}

/* Équipe */
.wafm-mc-team {
  flex:1; display:flex; align-items:center; gap:12px;
}
.wafm-mc-ext { flex-direction:row-reverse; text-align:right; }
.wafm-mc-flag { font-size:32px; line-height:1; }
.wafm-mc-logo { width:48px; height:48px; object-fit:contain; }
.wafm-mc-team-name { font-family:'Oswald',sans-serif; font-size:18px; font-weight:700; color:#111; white-space:nowrap; }

/* Bloc score central */
.wafm-mc-score-block {
  min-width:120px; text-align:center; padding:0 12px;
  display:flex; flex-direction:column; align-items:center; gap:4px;
}
.wafm-mc-score {
  display:flex; align-items:center; gap:6px;
  font-family:'Oswald',sans-serif; font-size:36px; font-weight:700;
}
.wafm-mc-score .s-dom, .wafm-mc-score .s-ext { color:var(--wafm-gd); }
.wafm-mc-score .s-sep { color:#ccc; }
.wafm-mc-kickoff { font-family:'Oswald',sans-serif; font-size:22px; font-weight:700; color:#1a3a6e; }
.wafm-mc-halftime { font-size:11px; color:#888; }

/* Statut badge */
.wafm-mc-statut {
  font-family:'Oswald',sans-serif; font-size:10px; letter-spacing:2px;
  text-transform:uppercase; padding:3px 10px; background:#f0f0f0; color:#666;
  font-weight:700;
}
.wafm-mc-statut.is-live {
  background:var(--wafm-rouge); color:#fff;
  animation:wafm-blink 1.2s infinite;
}
@keyframes wafm-blink { 0%,100%{opacity:1} 50%{opacity:.55} }

/* Footer carte */
.wafm-mc-footer {
  display:flex; justify-content:space-between; align-items:center;
  padding:8px 18px; background:#fafafa; border-top:1px solid #eee;
  font-size:12px;
}
.wafm-mc-venue { color:#888; }
.wafm-mc-links { display:flex; gap:8px; }
.wafm-link-live   { background:var(--wafm-rouge); color:#fff !important; padding:3px 10px; font-family:'Oswald',sans-serif; font-size:10px; letter-spacing:1px; text-decoration:none; }
.wafm-link-ticket { background:var(--wafm-vert);  color:#fff !important; padding:3px 10px; font-family:'Oswald',sans-serif; font-size:10px; letter-spacing:1px; text-decoration:none; }
.wafm-link-report { background:#555; color:#fff !important; padding:3px 10px; font-family:'Oswald',sans-serif; font-size:10px; letter-spacing:1px; text-decoration:none; }
.wafm-link-live:hover,.wafm-link-ticket:hover,.wafm-link-report:hover { opacity:.85; }

/* ── TABLEAU DE CLASSEMENT (front) ── */
.wafm-standings-block { margin-bottom:32px; }
.wafm-standings-header { background:var(--wafm-gd); padding:12px 16px; }
.wafm-standings-title { font-family:'Oswald',sans-serif; font-size:15px; font-weight:700; color:var(--wafm-jaune); letter-spacing:1px; text-transform:uppercase; }

.wafm-standings-table-front { width:100%; border-collapse:collapse; font-size:13px; }
.wafm-standings-table-front thead th {
  background:var(--wafm-gd); color:var(--wafm-jaune);
  font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:1.5px;
  text-transform:uppercase; padding:10px 12px; text-align:center; cursor:help;
}
.wafm-standings-table-front .col-equipe { text-align:left; }
.wafm-standings-table-front td { padding:11px 12px; border-bottom:1px solid #eee; text-align:center; }
.wafm-standings-table-front tbody tr:hover td { background:#f0f9f4; }
.wafm-standings-table-front tr.leader td { background:#fffce0; font-weight:700; }
.wafm-standings-table-front tr.qualification td { background:#f0f9f4; }

.wafm-standings-table-front .col-pos .pos-num { font-family:'Oswald',sans-serif; font-size:16px; font-weight:700; color:var(--wafm-gd); }
.wafm-standings-table-front .col-equipe { min-width:160px; }
.wafm-standings-table-front .eq-flag { font-size:20px; margin-right:8px; }
.wafm-standings-table-front .eq-name { font-weight:600; }
.wafm-standings-table-front .col-pts strong { font-family:'Oswald',sans-serif; font-size:17px; color:var(--wafm-rouge); }
.wafm-standings-table-front .db-pos { color:var(--wafm-vert); font-weight:700; }
.wafm-standings-table-front .db-neg { color:var(--wafm-rouge); }

/* Forme */
.col-forme { min-width:80px; }
.fb { display:inline-block; width:16px; height:16px; border-radius:50%; font-size:9px; font-weight:700; line-height:16px; text-align:center; margin:0 1px; }
.fv { background:#00843D; color:#fff; }
.fn { background:#888; color:#fff; }
.fd { background:#E2001A; color:#fff; }

/* ── PROCHAIN MATCH (Countdown) ── */
.wafm-next-match {
  background:linear-gradient(135deg, var(--wafm-gd) 0%, #001a10 100%);
  padding:28px; color:#fff; text-align:center;
}
.wafm-nm-competition { font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:18px; }
.wafm-nm-competition span { color:rgba(255,255,255,.4); }
.wafm-nm-teams { display:flex; align-items:center; justify-content:center; gap:24px; margin-bottom:16px; }
.wafm-nm-team { display:flex; flex-direction:column; align-items:center; gap:8px; }
.wafm-nm-flag { font-size:48px; }
.wafm-nm-name { font-family:'Oswald',sans-serif; font-size:18px; font-weight:700; letter-spacing:2px; text-transform:uppercase; }
.wafm-nm-vs { font-family:'Oswald',sans-serif; font-size:14px; font-weight:700; color:rgba(255,255,255,.4); }
.wafm-nm-meta { display:flex; justify-content:center; gap:20px; font-size:12px; color:rgba(255,255,255,.6); margin-bottom:20px; flex-wrap:wrap; }
.wafm-countdown { display:flex; justify-content:center; align-items:center; gap:4px; margin-bottom:20px; }
.wafm-cd-unit { text-align:center; min-width:64px; }
.wafm-cd-val { display:block; font-family:'Oswald',sans-serif; font-size:42px; font-weight:700; color:var(--wafm-jaune); line-height:1; }
.wafm-cd-label { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.5); }
.wafm-cd-sep { font-family:'Oswald',sans-serif; font-size:36px; font-weight:700; color:rgba(255,255,255,.2); align-self:flex-start; margin-top:4px; }
.wafm-nm-ticket { display:inline-block; background:var(--wafm-rouge); color:#fff !important; font-family:'Oswald',sans-serif; font-size:13px; letter-spacing:2px; text-transform:uppercase; padding:12px 28px; text-decoration:none; margin-top:4px; transition:background var(--wafm-t); }
.wafm-nm-ticket:hover { background:var(--wafm-rd); }

.wafm-no-content { color:#888; font-style:italic; padding:20px; text-align:center; }

/* ── RESPONSIVE ── */
@media (max-width:600px) {
  .wafm-mc-team-name { font-size:14px; }
  .wafm-mc-score { font-size:28px; }
  .wafm-mc-flag { font-size:24px; }
  .wafm-mc-header { flex-direction:column; gap:4px; align-items:flex-start; }
  .wafm-standings-table-front .col-forme,
  .wafm-standings-table-front .col-db { display:none; }
  .wafm-tab { padding:10px 14px; font-size:12px; }
  .wafm-nm-flag { font-size:36px; }
  .wafm-cd-val { font-size:30px; }
  .wafm-cd-unit { min-width:48px; }
}
