/* =============================================================================
   assets/css/borda-2027.css - turf.bzh
   -----------------------------------------------------------------------------
   Fenetres de la methode Borda au gabarit 2027 (11/10/2026) :
   « Personnaliser » (#configModal) et « Detail Borda » (#bordaModal).
   Balisage et logique : borda-custom.php (renderTags, bdRendre).
   « Mes configurations Borda » porte ses propres styles (js/borda-config.js).

   Ce qui ne change pas, pour garder les habitudes : les options d'affichage,
   les 3 boutons rapides, les libelles des criteres, l'aspect des puces
   (bleu #336699, formules MathBZH en rouge, Vos donnees en violet), Valider
   et Annuler. Les regles de assets/borda-custom.css restent en place ; cette
   feuille vient apres elle et ne vise que #configModal.

   Ce qui s'ajoute : criteres ranges par famille (ou ordre habituel, au choix),
   recherche, compteur, pied fixe avec Valider toujours visible, note sur les
   indicateurs sans sens favorable.

   Contrastes mesures sur blanc : texte #0f172a 17,8:1 ; titres de famille
   #475569 7,6:1 ; badge « nouveau » #075d6e sur #e0f2f6 6,5:1 ; erreur
   #b91c1c 6,47:1 ; puce active #fff sur #336699 6,0:1 ; badge sur puce cochee #2b5680 sur #fff 7,6:1.

   Aucune bordure gauche d'accent (consigne de Paul).

   @author Claude (2026-10-11)
   @version 1.0.0
   ========================================================================== */

#configModal {
  --bc-ink:     #0f172a;
  --bc-ink2:    #1e293b;
  --bc-mut:     #475569;
  --bc-mut2:    #64748b;
  --bc-bd:      #e2e8f0;
  --bc-bd-soft: #eef2f7;
  --bc-soft:    #f1f5f9;
  --bc-fond:    #f8fafc;
  --bc-acc:     #0a7c91;
  --bc-acc-d:   #075d6e;
  --bc-acc-l:   #e0f2f6;
  --bc-bleu:    #336699;
  --bc-bleu-d:  #2b5680;
  --bc-ko:      #b91c1c;
  --bc-pad:     1.5rem;
}

/* ── La fenetre ──────────────────────────────────────────────────────────── */
#configModal .config-modal-content {
  max-height: min(90vh, 90dvh);   /* iPhone : barre de Safari deduite */
  padding: var(--bc-pad) var(--bc-pad) 0;
  color: var(--bc-ink);
  box-shadow: 0 20px 50px -12px rgba(15, 23, 42, .35);
}
#configModal .config-modal-content h2 {
  margin: 0 0 1rem;
  padding: 0 40px;
  font-size: clamp(1.15rem, 1rem + .8vw, 1.45rem);
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  color: var(--bc-ink);
}
#configModal .config-modal-close {
  top: 8px;
  right: 8px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 10px;
  font-size: 1.6rem;
  line-height: 1;
  color: var(--bc-mut);
}
#configModal .config-modal-close:hover { background: var(--bc-soft); color: var(--bc-ink); }
#configModal .config-modal-close:focus-visible { outline: 2px solid var(--bc-acc); outline-offset: 1px; }

/* Options d'affichage : les 2 listes et le lien du Guide sur une ligne,
   comme en production sur un ecran d'ordinateur. */
#configModal .config-options {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.15fr);
  gap: .75rem 1.25rem;
  align-items: center;
  padding: .9rem 1.25rem 1.1rem;
  margin-bottom: 1rem;
}
/* Bootstrap fait flotter la legende : sans cela elle prendrait une case de
   la grille au lieu de la ligne du haut. */
#configModal .config-options legend { grid-column: 1 / -1; text-align: center; margin-bottom: 0; }
#configModal .config-control { margin: 0; min-width: 0; }
#configModal .borda-guide-wrapper { margin: 0; }
#configModal .borda-guide-link { width: 100%; justify-content: center; box-sizing: border-box; }
#configModal .config-quick-actions { margin: .75rem 0; }

#configModal hr {
  margin: 4px 0 14px;
  border: 0;
  border-top: 1px solid var(--bc-bd);
  opacity: 1;
}

/* ── Recherche et presentation ───────────────────────────────────────────── */
#configModal .bc-barre {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
  margin: 0 0 6px;
}
#configModal .bc-recherche {
  position: relative;
  flex: 1 1 260px;
  min-width: 0;
  margin: 0;
  display: block;
}
#configModal .bc-recherche i {
  position: absolute;
  left: 13px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--bc-mut2);
  font-size: 14px;
  pointer-events: none;
}
#configModal .bc-recherche input {
  width: 100%;
  min-height: 42px;
  padding: 8px 12px 8px 38px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: var(--bc-ink);
  font-size: 15px;
  box-sizing: border-box;
}
#configModal .bc-recherche input::placeholder { color: var(--bc-mut2); }
#configModal .bc-recherche input:focus {
  outline: none;
  border-color: var(--bc-acc);
  box-shadow: 0 0 0 3px rgba(10, 124, 145, .18);
}
.bc-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

#configModal .bc-affichage {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 2px;
  padding: 3px;
  background: var(--bc-soft);
  border: 1px solid var(--bc-bd);
  border-radius: 10px;
}
#configModal .bc-affichage button {
  min-height: 34px;
  padding: 6px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--bc-ink2);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
}
#configModal .bc-affichage button i { font-size: 12.5px; color: var(--bc-mut2); }
#configModal .bc-affichage button[aria-pressed="true"] {
  background: #fff;
  color: var(--bc-acc-d);
  box-shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px -1px rgba(15, 23, 42, .06);
}
#configModal .bc-affichage button[aria-pressed="true"] i { color: var(--bc-acc); }
#configModal .bc-affichage button:focus-visible { outline: 2px solid var(--bc-acc); outline-offset: 1px; }

/* ── Les puces (aspect d'origine, quelques finitions) ─────────────────────── */
#configModal .criterion-tag {
  min-height: 36px;
  line-height: 1.25;
  display: inline-flex;
  align-items: center;
}
/* Survol d'une puce deja choisie : elle restait blanche sur fond clair
   (texte illisible). Seulement les criteres fixes : formules (rouge) et
   donnees (violet) gardent leurs regles. Bleu fonce seulement avec une
   souris (sur ecran tactile, l'etat
   survole reste colle apres le toucher : la puce garde son bleu). */
#configModal .criterion-tag.active:not(.mathbzh-tag):not(.custom-manual-tag):hover { background: var(--bc-bleu); color: #fff; }
@media (hover: hover) {
  #configModal .criterion-tag.active:not(.mathbzh-tag):not(.custom-manual-tag):hover { background: var(--bc-bleu-d); }
}
#configModal .criterion-tag:focus-visible { outline: 2px solid var(--bc-acc); outline-offset: 2px; }

#configModal .bc-neuf {
  display: inline-block;
  margin-left: 7px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--bc-acc-l);
  color: var(--bc-acc-d);
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .04em;
  text-transform: uppercase;
}
#configModal .criterion-tag.active .bc-neuf { background: #fff; color: var(--bc-bleu-d); }

/* ── Par famille : le nom a gauche, les puces a droite ───────────────────── */
#configModal .criteria-tags.bc-familles {
  display: block;
  margin: 0;
}
#configModal .bc-famille {
  display: grid;
  grid-template-columns: minmax(150px, 210px) minmax(0, 1fr);
  gap: 8px 18px;
  align-items: start;
  padding: 10px 0;
  border-top: 1px solid var(--bc-bd-soft);
}
#configModal .bc-famille:first-child { border-top: 0; padding-top: 4px; }
#configModal .bc-famille-titre {
  margin: 0;
  padding-top: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  justify-content: flex-start;
  color: var(--bc-mut);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
}
#configModal .bc-famille-titre .bc-neuf { margin-left: 0; }
#configModal .bc-famille-n {
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--bc-bleu);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
#configModal .bc-famille-n:empty { display: none; }
#configModal .bc-famille-formules .bc-famille-n { background: #8D1A2C; }
#configModal .bc-famille-donnees .bc-famille-n { background: #6c5ce7; }
#configModal .bc-puces {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

#configModal .bc-vide {
  margin: 14px 0;
  color: var(--bc-mut);
  font-size: 14px;
  text-align: center;
}

/* ── Note sur les indicateurs sans sens favorable ─────────────────────────── */
#configModal .bc-note {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 14px 0 0;
  padding: 10px 13px;
  background: var(--bc-fond);
  border: 1px solid var(--bc-bd);
  border-radius: 10px;
  color: var(--bc-mut);
  font-size: 13px;
  line-height: 1.5;
}
#configModal .bc-note i { flex: 0 0 auto; margin-top: 3px; color: var(--bc-acc); }
#configModal .bc-note span { flex: 1 1 auto; text-align: left; }

/* ── Pied fixe : compteur, Valider, Annuler ───────────────────────────────── */
#configModal .config-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px 10px;
  margin: 14px calc(-1 * var(--bc-pad)) 0;
  padding: 12px var(--bc-pad);
  background: #fff;
  border-top: 1px solid var(--bc-bd);
  box-shadow: 0 -8px 16px -14px rgba(15, 23, 42, .45);
  text-align: right;
}
#configModal .config-actions button {
  margin-left: 0;
  min-height: 42px;
  padding: 8px 20px;
  border-radius: 8px;
}
#configModal .config-actions button:focus-visible { outline: 2px solid var(--bc-acc); outline-offset: 2px; }
#configModal .config-modal-content:focus { outline: none; }

/* Ligne d'aide : le critere touche, survole ou atteint au clavier, et le
   sens du classement. Toute la largeur du pied, au-dessus des boutons. */
#configModal .bc-aide {
  flex: 1 1 100%;
  margin: 0;
  color: var(--bc-mut);
  font-size: 13px;
  line-height: 1.45;
  text-align: left;
}
#configModal .bc-aide strong { color: var(--bc-ink); font-weight: 700; }

#configModal .bc-compte {
  margin-right: auto;
  color: var(--bc-mut);
  font-size: 14px;
  font-weight: 600;
  text-align: left;
}
#configModal .bc-compte.is-erreur { color: var(--bc-ko); }

/* ── Tablette : les 2 listes cote a cote, le Guide en dessous ─────────────── */
@media (min-width: 641px) and (max-width: 899px) {
  #configModal .config-options { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #configModal .borda-guide-wrapper { grid-column: 1 / -1; }
  #configModal .borda-guide-link { width: auto; }
}

/* ── Telephone ───────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
  #configModal { --bc-pad: 1rem; }
  #configModal .config-modal-content h2 { padding: 0 40px 0 4px; text-align: left; }
  #configModal .config-options {
    grid-template-columns: minmax(0, 1fr);
    padding: .75rem .9rem .9rem;
    gap: .75rem;
  }
  #configModal .config-quick-actions { gap: .5rem; margin: .75rem 0; }
  #configModal .config-quick-actions button { flex: 1 1 auto; justify-content: center; }
  #configModal .bc-recherche { flex-basis: 100%; }
  #configModal .bc-recherche input { font-size: 16px; }   /* pas de zoom automatique sur iPhone */
  #configModal .bc-affichage { flex: 1 1 100%; }
  #configModal .bc-affichage button { flex: 1 1 50%; }
  #configModal .bc-famille { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  #configModal .bc-famille-titre { padding-top: 0; }
  #configModal .config-actions button { flex: 1 1 0; }
  #configModal .bc-compte { flex: 1 1 100%; margin-right: 0; }
}


/* =============================================================================
   DETAIL BORDA (#bordaModal)
   Rang, pronostic mis en evidence, arrivee, points (ou valeurs) de chaque
   critere avec une teinte proportionnelle aux points, total avec jauge.
   Colonnes Rang et Cheval figees a gauche, Total fige a droite, en-tete fige :
   on lit tout le tableau sur telephone en le faisant defiler.
   ========================================================================== */

#bordaModal {
  --bd-ink:     #0f172a;
  --bd-mut:     #475569;
  --bd-mut2:    #64748b;
  --bd-bd:      #e2e8f0;
  --bd-bd-soft: #eef2f7;
  --bd-soft:    #f1f5f9;
  --bd-fond:    #f8fafc;
  --bd-acc:     #0a7c91;
  --bd-acc-d:   #075d6e;
  --bd-acc-l:   #e0f2f6;
  --bd-prono:   #f2fafb;
}

#bordaModal .borda-modal-content.bd {
  display: flex;
  flex-direction: column;
  width: min(96vw, 1240px);
  max-height: 90vh;
  max-height: min(90vh, 90dvh);
  margin: max(16px, 4vh) auto 16px;
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
  color: var(--bd-ink);
  box-shadow: 0 20px 50px -12px rgba(15, 23, 42, .35);
}
#bordaModal .borda-modal-content.bd:focus { outline: none; }

#bordaModal .borda-modal-close {
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 10px;
  font-size: 1.6rem;
  line-height: 1;
  color: var(--bd-mut);
  z-index: 5;
}
#bordaModal .borda-modal-close:hover { background: var(--bd-soft); color: var(--bd-ink); }
#bordaModal .borda-modal-close:focus-visible { outline: 2px solid var(--bd-acc); outline-offset: 1px; }

#bordaModal .bd-tete { padding: 18px 60px 6px 22px; flex: 0 0 auto; text-align: left; }
#bordaModal .bd-tete h2 {
  margin: 0;
  font-size: clamp(1.15rem, 1rem + .8vw, 1.45rem);
  font-weight: 700;
  line-height: 1.3;
  text-align: left;
  color: var(--bd-ink);
}
#bordaModal .bd-resume { margin: 4px 0 0; color: var(--bd-mut); font-size: 14px; line-height: 1.45; }

#bordaModal .bd-barre {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 22px 12px;
}
#bordaModal .bd-affichage {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: var(--bd-soft);
  border: 1px solid var(--bd-bd);
  border-radius: 10px;
}
#bordaModal .bd-affichage button {
  min-height: 34px;
  padding: 6px 14px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #1e293b;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
}
#bordaModal .bd-affichage button[aria-pressed="true"] {
  background: #fff;
  color: var(--bd-acc-d);
  box-shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px -1px rgba(15, 23, 42, .06);
}
#bordaModal .bd-export {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 7px 14px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: var(--bd-ink);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
}
#bordaModal .bd-export i { color: #15803d; }
#bordaModal .bd-export:hover { background: var(--bd-fond); border-color: #94a3b8; }
#bordaModal .bd-affichage button:focus-visible,
#bordaModal .bd-export:focus-visible,
#bordaModal .bd-tri:focus-visible { outline: 2px solid var(--bd-acc); outline-offset: 1px; }

/* Zone qui defile, dans les 2 sens. */
#bordaModal .bd-defil {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  border-top: 1px solid var(--bd-bd);
  border-bottom: 1px solid var(--bd-bd);
  -webkit-overflow-scrolling: touch;
}
#bordaModal .bd-defil:focus-visible { outline: 2px solid var(--bd-acc); outline-offset: -2px; }

#bordaModal .bd-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  margin: 0;
}
#bordaModal .bd-table th,
#bordaModal .bd-table td {
  padding: 8px 8px;
  border-bottom: 1px solid var(--bd-bd-soft);
  text-align: center;
  vertical-align: middle;
  background-clip: padding-box;
}
#bordaModal .bd-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bd-fond);
  border-bottom: 1px solid var(--bd-bd);
  color: var(--bd-mut);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.25;
  vertical-align: bottom;
}
#bordaModal .bd-table thead th.bd-c-crit { min-width: 74px; max-width: 128px; }
#bordaModal .bd-tri {
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
  gap: 4px;
  max-width: 100%;
  padding: 2px 4px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: center;
  cursor: pointer;
}
#bordaModal .bd-tri:hover { color: var(--bd-acc-d); }
#bordaModal .bd-tri.is-actif { color: var(--bd-acc-d); box-shadow: inset 0 -2px 0 var(--bd-acc); border-radius: 0; }
#bordaModal .bd-sens { font-size: 12px; margin-bottom: 1px; color: var(--bd-acc); }

/* Colonnes figees : rang et cheval a gauche, total a droite. */
#bordaModal .bd-table .bd-c-rang {
  position: sticky;
  left: 0;
  z-index: 1;
  box-sizing: border-box;
  width: 52px;
  min-width: 52px;
  max-width: 52px;
  padding-left: 4px;
  padding-right: 4px;
  background: #fff;
}
#bordaModal .bd-table .bd-c-cheval {
  position: sticky;
  left: 52px;
  z-index: 1;
  min-width: 170px;
  text-align: left;
  background: #fff;
  box-shadow: 1px 0 0 var(--bd-bd);
}
#bordaModal .bd-table .bd-c-total {
  position: sticky;
  right: 0;
  z-index: 1;
  min-width: 78px;
  background: #fff;
  box-shadow: -1px 0 0 var(--bd-bd);
}
#bordaModal .bd-table thead th.bd-c-rang,
#bordaModal .bd-table thead th.bd-c-cheval,
#bordaModal .bd-table thead th.bd-c-total { z-index: 3; background: var(--bd-fond); }
#bordaModal .bd-table .bd-c-cheval { text-align: left; }

#bordaModal .bd-table .bd-prono .bd-c-rang,
#bordaModal .bd-table .bd-prono .bd-c-cheval,
#bordaModal .bd-table .bd-prono .bd-c-total { background: var(--bd-prono); }
#bordaModal .bd-coupure td { border-bottom: 2px solid var(--bd-acc); }

#bordaModal .bd-rang {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--bd-soft);
  color: var(--bd-ink);
  font-weight: 700;
  box-sizing: border-box;
}
#bordaModal .bd-prono .bd-rang { background: var(--bd-acc); color: #fff; }

#bordaModal .bd-num {
  display: inline-block;
  min-width: 24px;
  margin-right: 6px;
  color: var(--bd-acc-d);
  font-weight: 800;
}
#bordaModal .bd-nom { font-weight: 600; color: var(--bd-ink); }
#bordaModal .bd-arrivee {
  display: inline-block;
  margin-left: 7px;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
  background: var(--bd-soft);
  color: #334155;
}
#bordaModal .bd-arrivee i { margin-right: 4px; font-size: 10px; }
#bordaModal .bd-arrivee-1 { background: #fef3c7; color: #854d0e; }
#bordaModal .bd-arrivee-2,
#bordaModal .bd-arrivee-3 { background: var(--bd-acc-l); color: var(--bd-acc-d); }

/* Points de chaque critere : teinte proportionnelle (le texte reste lisible :
   au plus 30 % de bleu turf.bzh sous un texte #0f172a, contraste > 11:1). */
#bordaModal .bd-c-crit {
  background-color: rgba(10, 124, 145, calc(var(--bd-i, 0) * .30));
  font-weight: 600;
}
#bordaModal .bd-c-crit.is-zero { color: var(--bd-mut2); font-weight: 500; }
#bordaModal .bd-nc { color: var(--bd-mut2); font-size: 12.5px; font-weight: 500; }
#bordaModal .is-valeurs .bd-c-crit { line-height: 1.25; }
#bordaModal .bd-val { display: block; font-weight: 600; white-space: nowrap; }
#bordaModal .bd-sous { display: block; margin-top: 1px; color: var(--bd-mut); font-size: 11.5px; font-weight: 500; white-space: nowrap; }

#bordaModal .bd-tot { display: block; font-size: 15px; font-weight: 800; }
#bordaModal .bd-jauge {
  display: block;
  height: 4px;
  margin: 4px auto 0;
  max-width: 64px;
  border-radius: 999px;
  background: var(--bd-bd);
  overflow: hidden;
}
#bordaModal .bd-jauge span { display: block; height: 100%; border-radius: 999px; background: var(--bd-acc); }

#bordaModal .bd-legende {
  flex: 0 0 auto;
  margin: 0;
  padding: 10px 22px 16px;
  color: var(--bd-mut);
  font-size: 13px;
  line-height: 1.5;
  text-align: left;
}

@media (max-width: 640px) {
  #bordaModal .borda-modal-content.bd { width: calc(100vw - 16px); margin-top: 8px; max-height: min(94vh, 94dvh); border-radius: 12px; }
  #bordaModal .bd-tete { padding: 14px 54px 4px 14px; }
  #bordaModal .bd-barre { padding: 8px 14px 10px; }
  #bordaModal .bd-legende { padding: 8px 14px 12px; font-size: 12.5px; line-height: 1.45; }
  #bordaModal .bd-table { font-size: 13px; }
  #bordaModal .bd-table th,
  #bordaModal .bd-table td { padding: 7px 6px; }
  #bordaModal .bd-table thead th { font-size: 12px; }
  #bordaModal .bd-table thead th.bd-c-crit { min-width: 64px; }
  #bordaModal .bd-table .bd-c-rang { width: 40px; min-width: 40px; max-width: 40px; padding-left: 2px; padding-right: 2px; }
  #bordaModal .bd-table .bd-c-cheval { left: 40px; min-width: 112px; }
  #bordaModal .bd-num { min-width: 0; margin-right: 4px; }
  #bordaModal .bd-table .bd-c-total { min-width: 62px; }
  #bordaModal .bd-rang { min-width: 26px; height: 26px; padding: 0 4px; }
}
/* Petit telephone : le total n'est plus fige, pour laisser la place a
   2 criteres de plus ; le rang dit deja l'ordre. */
@media (max-width: 480px) {
  #bordaModal .bd-table tbody .bd-c-total { position: static; box-shadow: none; }
  #bordaModal .bd-table thead th.bd-c-total { right: auto; box-shadow: none; }
}