/* Feuille de match — voir feuille-match.js.
   Depuis le 29/09 elle n'a plus de fenêtre à elle : elle se pose SOUS
   l'affiche du match (PLBUI.afficheMatch, styles .vsx-* de ligue-ui.css),
   et en reprend le style — sombre, Outfit, les couleurs des deux clubs
   (--ha pour le domicile, --hb pour l'extérieur, posées par l'affiche). */

/* Un score cliquable : se soulève au survol, comme les pastilles d'équipe. */
[data-fdm-fx], [data-fdm-ev] {
  cursor: pointer; border-radius: 6px;
  transition: transform .12s, box-shadow .12s, background .12s;
}
[data-fdm-fx]:hover, [data-fdm-ev]:hover,
[data-fdm-fx]:focus-visible, [data-fdm-ev]:focus-visible {
  transform: translateY(-1px);
  background: var(--surface2, rgba(127,127,127,.12));
  box-shadow: 0 2px 8px rgba(0,0,0,.28), inset 0 0 0 1px var(--border, rgba(127,127,127,.35));
  outline: none;
}

/* Préfixe fdm- : .fm appartient aux pastilles de forme de ligue-ui.css. */
.fdm { font-size: .86rem; color: var(--text, #E6EDF3); }

/* Le fil : chaque fait du côté de SON équipe, dans une bulle à liseré de
   ses couleurs — gauche = domicile, droite = extérieur, comme l'affiche. */
.fdm-fil { display: flex; flex-direction: column; gap: 3px; }
.fdm-ligne { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px; }
.fdm-g:not(:empty), .fdm-d:not(:empty) {
  display: flex; align-items: center; gap: 6px; min-width: 0;
  padding: 4px 9px; border-radius: 9px; line-height: 1.25;
  background: var(--surface2, #1a2035);
}
.fdm-g:not(:empty) {
  box-shadow: inset 3px 0 0 hsl(var(--ha, 170) 65% 55%);
  background: linear-gradient(90deg, hsl(var(--ha, 170) 60% 45% / .18), var(--surface2, #1a2035) 70%);
}
.fdm-d:not(:empty) {
  justify-content: flex-end; text-align: right;
  box-shadow: inset -3px 0 0 hsl(var(--hb, 20) 65% 55%);
  background: linear-gradient(270deg, hsl(var(--hb, 20) 60% 45% / .18), var(--surface2, #1a2035) 70%);
}
.fdm-g b, .fdm-d b { font-family: 'Outfit', sans-serif; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fdm-e { font-size: 1.05rem; line-height: 1; flex: none; }
.fdm-l { color: var(--muted, #8B949E); font-size: .74rem; white-space: nowrap; }
.fdm-min {
  flex: none; font: 800 .68rem/1 'Outfit', sans-serif; font-style: normal; font-variant-numeric: tabular-nums;
  padding: 3px 5px; border-radius: 6px; background: rgba(0,0,0,.35); color: var(--text, #E6EDF3);
}
.fdm-phase {
  text-align: center; color: var(--muted, #8B949E); padding: 4px 0;
  font: 700 .64rem/1.2 'Outfit', sans-serif; letter-spacing: .16em; text-transform: uppercase;
}

/* Sans fil saisi : les buts en ballons, chacun de son côté. */
.fdm-buts { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px; font-size: 1.05rem; letter-spacing: .1em; }
.fdm-buts > div {
  padding: 5px 9px; border-radius: 9px; background: var(--surface2, #1a2035); overflow-wrap: anywhere;
}
.fdm-buts .fdm-g { box-shadow: inset 3px 0 0 hsl(var(--ha, 170) 65% 55%); }
.fdm-buts .fdm-d { box-shadow: inset -3px 0 0 hsl(var(--hb, 20) 65% 55%); text-align: right; }
.fdm-zero { color: var(--muted, #8B949E); }
.fdm-note { margin-top: 6px; color: var(--muted, #8B949E); font-size: .74rem; line-height: 1.45; text-align: center; }

/* Votes du match : réservé aux membres de l'équipe, tout en bas, sous un verrou. */
.fdm-vt {
  margin-top: 14px; padding: 12px; border-radius: 14px;
  background: linear-gradient(160deg, rgba(255,216,107,.1), transparent 60%), var(--surface2, #1a2035);
  border: 1px solid rgba(255,216,107,.25);
}
.fdm-vt-tete { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 10px; }
.fdm-vt-tete b { font-family: 'Outfit', sans-serif; font-weight: 800; letter-spacing: .04em; }
.fdm-vt-lock { font-size: 1.05rem; line-height: 1.2; }
.fdm-vt-why { color: var(--muted, #8B949E); font-size: .72rem; line-height: 1.4; margin-top: 2px; }
.fdm-vt-cat + .fdm-vt-cat { margin-top: 10px; }
.fdm-vt-titre { font: 700 .8rem 'Outfit', sans-serif; margin-bottom: 4px; }
.fdm-vt-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.fdm-vt-liste li { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 8px; background: rgba(0,0,0,.18); }
.fdm-vt-rg {
  width: 20px; height: 20px; flex: none; border-radius: 50%; display: grid; place-items: center;
  font: 800 .68rem/1 'Outfit', sans-serif; font-variant-numeric: tabular-nums;
  background: rgba(var(--ink,255,255,255),.08); color: var(--muted, #8B949E);
}
.fdm-vt-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fdm-vt-n { color: var(--muted, #8B949E); font-size: .74rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fdm-vt-liste li.win { background: linear-gradient(90deg, rgba(255,216,107,.22), rgba(0,0,0,.18)); }
.fdm-vt-liste li.win .fdm-vt-nom { font-weight: 700; }
.fdm-vt-liste li.win .fdm-vt-rg { background: #ffd86b; color: #3a2a06; }

/* MODE CLAIR (theme-mode.js) : les voiles NOIRS qui creusaient les bulles
   sur le fond sombre deviennent un voile d'encre léger — sur du blanc, un
   noir à 35 % sous un texte foncé le rendait illisible. */
:root[data-theme="light"] .fdm-min { background: rgba(15,20,32,.07); }
:root[data-theme="light"] .fdm-vt-liste li { background: rgba(15,20,32,.04); }
:root[data-theme="light"] .fdm-vt-liste li.win { background: linear-gradient(90deg, rgba(255,216,107,.4), rgba(15,20,32,.04)); }
:root[data-theme="light"] .fdm-vt { border-color: rgba(176,136,0,.35); }
:root[data-theme="light"] [data-fdm-fx]:hover, :root[data-theme="light"] [data-fdm-ev]:hover,
:root[data-theme="light"] [data-fdm-fx]:focus-visible, :root[data-theme="light"] [data-fdm-ev]:focus-visible {
  box-shadow: 0 2px 8px rgba(15,20,32,.12), inset 0 0 0 1px var(--border, rgba(127,127,127,.35));
}