/* =====================================================================================
   TABLEAUX LISIBLES SUR TELEPHONE — 27/09/2026
   Un audit a 390 et 360 px l'a montre : Reputation, Pantheon des presidents, Histoire
   du club et Effectif forcaient une largeur minimale (520 a 703 px) dans une carte de
   330. La colonne qui compte — la reputation, les points, le fait marquant, les boutons
   Prolonger / Vendre — etait tout a droite, donc hors de l'ecran, sans indice qu'il
   fallait faire glisser le tableau.
   Le principe : l'ESSENTIEL ne defile jamais. Sous 520 px, les colonnes de detail
   (classe `col-opt`) s'effacent et le tableau reprend la largeur de sa carte. Au-dessus,
   rien ne change : les largeurs minimales vivent ici (tbl-mw520 / tbl-mw620) au lieu
   d'etre ecrites en ligne, pour qu'une seule regle puisse les lever.
   ===================================================================================== */

/* Largeurs minimales d'origine, identiques au rendu desktop d'avant. */
.tbl-mw520{min-width:520px}
.tbl-mw620{min-width:620px}

/* Ce qui ne s'affiche QUE sur telephone (ex. le statut du classement mondial, remonte
   sous le nom quand sa colonne disparait). */
.mob-seul{display:none}

@media (max-width:520px){
  /* La largeur minimale saute, et le tableau redevient un vrai tableau : la regle
     generale « sous 640 px, tout tableau devient un bloc qui defile » (index.html) le
     tassait a gauche une fois les colonnes retirees. */
  .card table.tbl-etroit,.content table.tbl-etroit{display:table;width:100%;min-width:0}
  .col-opt{display:none}
  .mob-seul{display:block}
  /* Un nom de club long se replie sur deux lignes plutot que de repousser la
     reputation hors de la carte. */
  .tbl-etroit .clt-club{white-space:normal}

  /* ---- EFFECTIF ----
     Sous 820 px, index.html retirait deja les colonnes eff-m ; restaient 703 px. */
  .eff-cadre table.eff-table{display:table;width:100%}
  .eff-table th,.eff-table td{padding-left:4px;padding-right:4px}
  /* En-tetes plus serres : a 360 px, « POSTE ▲ » et « FORME » imposaient a eux seuls
     la largeur de leur colonne, bien plus large que son contenu. */
  .eff-table th{letter-spacing:0;font-size:9.5px}
  .eff-table .eff-fl{margin-left:2px}
  /* Le contrat se lit dans la fiche du joueur (Prolonger y mene) : il cede sa place. */
  .eff-table .eff-c-contrat{display:none}
  /* La forme en pastille seule : la couleur dit l'essentiel, le chiffre et le mot
     (« émoussé », « en jambes ») coupaient la colonne en plein milieu. */
  .eff-table .eff-forme b,.eff-table .eff-forme .eff-jambes{display:none}
  .eff-table .eff-c-nom{white-space:normal}
  .eff-table .eff-nom{min-width:110px;gap:6px}
  .eff-table .eff-nom .avatar-sm{flex:0 0 auto}
  /* Les boutons d'action s'empilent : cote a cote, ils faisaient a eux seuls la
     moitie d'un ecran. */
  .eff-table .eff-actions .btn{display:block;width:100%;margin:0 0 4px;padding:6px 6px;font-size:11px;letter-spacing:0}
  .eff-table .eff-poste{min-width:30px}
  .eff-table .eff-actions .btn:last-child{margin-bottom:0}
}

/* ---- 27/09/2026 — CLASSEMENT MONDIAL EN LIGNE ET LIVRE D'OR ----
   Le classement en ligne (public/classement-mondial.js) reprend tbl-mw520 et les classes
   ci-dessus. Les deux tableaux du Livre d'or (vue Histoire) etaient forces en ligne a 420
   et 460 px : ces largeurs vivent ici, desktop inchange, et la regle `.tbl-etroit` sous
   520 px les leve comme les autres. */
.tbl-mw420{min-width:420px}
.tbl-mw460{min-width:460px}