/* Temps mort, la ligue entre amis : le direct lisible (6/11, Mathias : « plus minimaliste sans perdre aucune
   proposition », « il faut juste que ça soit plus lisible »).
   Le tableau de bord du match en direct (ligue-ui.js, vueTableauMatch). La règle : pendant le match, le score, le temps
   et ce que le coach peut faire maintenant se lisent d'un coup d'œil ; le reste est à une touche et ne mange plus
   l'image.
   - Le bandeau du score reste toujours visible : les feuilles (Coaching, Stats, Le fil, Chambrer) s'ouvrent sous lui.
   - Le fil, les stats et chambrer s'ouvrent sur le côté droit : la salle reste à l'image pendant qu'on lit.
   - Au téléphone couché, la salle prend la place : les chiffres en bref sous la salle et les colonnes Rb et Pd des deux
     équipes se lisent dans la feuille Stats (Rebonds, Passes décisives, Tirs, À 3 points, Balles perdues, Dans la
     raquette, avec les mêmes chiffres) ; la note, les points, les fautes et l'énergie restent à côté de chaque joueur.
   - Sous « Coaching », ce qui joue maintenant (tes cartes ou ton plan).
   Chargé après ligue-ipad.css : ses règles, à spécificité égale, passent devant. Rien d'ici ne touche le calcul. */

/* la hauteur du bandeau du score, partagée avec les feuilles qui s'ouvrent dessous */
body{--tbH:2.95rem}
.tb .tbTete{height:var(--tbH);min-height:var(--tbH);box-sizing:border-box;flex-wrap:nowrap;overflow:hidden}
.tb .tbScore{align-self:stretch}
.tb .tbScore .edEq{min-height:0}
.tb .tbScore .edEq .edPts,.tb .tbScore .edHeure b,.tb .tbQ b{font-variant-numeric:tabular-nums}
/* pas de texte sous 12 px : les étiquettes des quarts-temps et du chrono, les titres de colonnes, les cartes au sol */
.tb .tbQ small,.tb .tbScore .edHeure small{font-size:max(12px,.75rem)}
.tb .tbJ thead th,.tb .tbJ .tbBancT th{font-size:max(12px,.75rem)}
.tb .tbCm span{font-size:max(12px,.72rem)}
.tb .dsCarte .fc small,.tb .dsCarte .fc i{font-size:max(12px,.72rem)}
.tb .tbBloc .lien{min-height:44px}

/* les feuilles : sous le bandeau (le score et le temps restent lisibles) */
.tb~.edVoile.tbV{top:var(--tbH)}
.tb~.edFeuille.tbF{top:var(--tbH)}
/* le fil, les stats, chambrer : un panneau à droite, le voile léger, la salle reste visible à gauche */
.tb~.edVoile.tbV:is(.tbV-fil,.tbV-stats,.tbV-chambrer){background:rgba(0,0,0,.28)}
.tb~.edFeuille.tbF:is(.tbF-fil,.tbF-stats,.tbF-chambrer){left:auto;right:0;bottom:0;transform:none;width:min(34rem,58vw);max-height:none;border:0;border-left:2px solid var(--orange);border-radius:0;box-shadow:-1rem 0 2rem rgba(0,0,0,.5)}
.tb~.edFeuille.tbF-stats .feuilles{grid-template-columns:minmax(0,1fr)}
/* « Les stats en direct » redisait le titre de la feuille : le titre de la feuille suffit (le mot reste dans la page) */
.tb~.edFeuille.tbF-stats .edFCorps>.titreSection:first-child{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* le bouton Coaching dit ce qui joue maintenant */
.tbBarre .edB.tbBDeux>span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05;min-width:0}
.tbBarre .edB .tbBSous{display:block;max-width:100%;font:600 12px/1.15 var(--corps,inherit);text-transform:none;letter-spacing:0;color:var(--texte2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------------------------------------------------------------- le téléphone couché (844 x 390) */
@media (orientation:landscape) and (max-height:560px){
  body{--tbH:46px}
  .tb .tbTete{padding:0 .4rem 0 0;gap:0}
  /* le score en grand, le temps juste à côté */
  .tb .tbScore .edEq{padding-block:0}
  .tb .tbScore .edEq b{font-size:1.05rem}
  .tb .tbScore .edEq .edPts{font-size:1.85rem;line-height:1}
  .tb .tbScore .edHeure{padding:0 .55rem}
  .tb .tbScore .edHeure b{font-size:1.4rem;line-height:1}
  .tb .tbScore .edHeure small{font-size:12px}
  .tb .tbQs{margin:0 .35rem}
  .tb .tbQ{padding:.05em .4em}
  .tb .tbQ small{font-size:12px;line-height:1}
  .tb .tbQ b{font-size:.9rem}
  .tb .edEtat{margin-left:.35rem}
  .tb .tbPage{margin-left:auto;min-height:44px;display:inline-flex;align-items:center;padding-left:.5rem;font-size:.85rem;white-space:nowrap}
  /* la salle prend la place : trois colonnes 1 / 1,6 / 1, les chiffres en bref dans la feuille Stats */
  .tbGrille{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr)}
  .tb .tbChiffres{display:none}
  .tb .tbJ .tbRb,.tb .tbJ .tbPd{display:none}
  /* les équipes : 12 px au moins, les numéros en colonne */
  .tb .tbJ thead th,.tb .tbJ .tbBancT th{font-size:12px}
  .tb .tbJ tbody th,.tb .tbJ tbody th .tbxFiche{font-size:12.5px}
  .tb .tbJ td.n{font-size:13px;font-variant-numeric:tabular-nums}
  .tb .tbJ td.note{font-size:.95rem}
  .tb .tbJ .edNum{font-size:12px;width:1.55rem}
  .tb .tbJ th,.tb .tbJ td{padding:.12rem .14rem}
  .tb .tbJ .tbE{width:1.8rem}
  /* l'en-tête de chaque équipe sur deux lignes au plus */
  .tb .tbEqT{padding-top:.3rem;padding-bottom:.3rem}
  .tb .tbEqN b{font-size:1rem}
  .tb .tbEqN small{font-size:12px;line-height:1.2}
  .tb .tbEqT>.edNum{display:none}
  /* le bouton Coaching sur deux lignes */
  .tb .tbBarre .edB.tbBDeux{max-width:13rem}
  /* les feuilles sous le bandeau : toute la hauteur qui reste */
  .tb~.edFeuille.tbF{bottom:0;max-height:none;border-radius:0}
  .tb~.edFeuille.tbF .edFTete{min-height:44px}
}
/* (9/11) un téléphone couché étroit (900 px et moins ; un iPhone SE fait 667) : les colonnes des joueurs demandent 200 px.
   À 1 / 1,6 / 1 il n'en restait que 184 sur un téléphone de 667 px : l'énergie, la dernière colonne, sortait à droite
   et chaque colonne glissait de côté. Les deux équipes gardent leur largeur, la salle prend ce qui reste (11 rem au
   moins : sur les plus petits téléphones, ce sont les colonnes qui cèdent). */
@media (orientation:landscape) and (max-height:560px) and (max-width:900px){
  .tbGrille{grid-template-columns:minmax(0,13.6rem) minmax(11rem,1fr) minmax(0,13.6rem)}
}
/* le bandeau de l'équipe, en tête de colonne, va d'un bord à l'autre : ses marges suivent celles de la colonne au
   téléphone couché (0,4 rem, puis 0,3 rem sous 720 px). Avec les marges de l'ordinateur (0,5 rem), il dépassait de 2 à
   3 px et la colonne glissait de côté. */
@media (orientation:landscape) and (max-height:560px){
  .tb .tbCol .tbEqT{margin-left:-.4rem;margin-right:-.4rem;width:calc(100% + .8rem)}
}
@media (orientation:landscape) and (max-height:560px) and (max-width:720px){
  .tb .tbCol .tbEqT{margin-left:-.3rem;margin-right:-.3rem;width:calc(100% + .6rem)}
}

/* ---------------------------------------------------------------- l'ordinateur et la tablette */
@media (min-width:900px) and (min-height:561px){
  body{--tbH:3.4rem}
  .tb .tbScore .edEq b{font-size:1.3rem}
  .tb .tbScore .edEq .edPts{font-size:2.2rem;line-height:1}
  .tb .tbScore .edHeure b{font-size:1.75rem;line-height:1}
  .tb .tbQ b{font-size:1.05rem}
  .tb .tbJ td.n,.tb .tbJ tbody th{font-size:max(12.5px,1em)}
  /* le coaching reste au milieu, sous le bandeau */
  .tb~.edFeuille.tbF-coaching{top:calc(var(--tbH) + (100vh - var(--tbH)) / 2);max-height:calc(100vh - var(--tbH) - 2rem)}
  .tb~.edFeuille.tbF:is(.tbF-fil,.tbF-stats,.tbF-chambrer){width:min(40rem,42vw)}
}
@media (min-width:1400px) and (min-height:700px){
  body{--tbH:4rem}
}
/* le grand écran (2560 x 1440) : le bandeau se lit de loin */
@media (min-width:1900px) and (min-height:1000px){
  body{--tbH:5.4rem}
  .tb .tbTete{padding-right:1.2rem}
  .tb .tbTete .edRond{width:5.4rem;font-size:1.8rem}
  .tb .tbScore .edEq{padding-inline:1.6rem 1.4rem}
  .tb .tbScore .edEq.ext{padding-inline:1.4rem 1.6rem}
  .tb .tbScore .edEq b{font-size:2rem}
  .tb .tbScore .edEq .edPts{font-size:3.5rem;line-height:1}
  .tb .tbScore .edHeure{padding:0 1.2rem}
  .tb .tbScore .edHeure small{font-size:1rem}
  .tb .tbScore .edHeure b{font-size:2.7rem;line-height:1}
  .tb .tbQs{margin:0 1rem;gap:4px}
  .tb .tbQ{padding:.2em .8em}
  .tb .tbQ small{font-size:.9rem}
  .tb .tbQ b{font-size:1.45rem}
  .tb .edEtat{font-size:1.3rem;margin-left:1rem;padding:.45rem 1.3rem .45rem .9rem}
  .tb .tbTitre{font-size:1.25rem}
  .tb .tbPage{font-size:1.1rem}
  /* ce qu'on peut faire maintenant : la barre du coach à la taille de l'écran */
  .tb .tbBarre{gap:.6rem;padding-top:.35rem}
  .tb .tbBarre .edB{min-height:4.2rem;max-width:16rem;font-size:1.25rem;gap:.7rem}
  .tb .tbBarre .edB svg{width:1.7rem;height:1.7rem}
  .tb .tbBarre .edB .tbBSous{font-size:.95rem}
  .tb .tbBarre .edB.tbBDeux{max-width:24rem}
  /* les chiffres en bref sous la salle */
  .tb .tbCm{font-size:1rem}
  .tb .tbCm>b{font-size:1.2rem}
  .tb .tbCm span{font-size:.9rem}
  .tb .tbCm .cmB{height:.5rem}
  .tbBloc h3{font-size:1rem}
  .tbEnJeu{font-size:1.05rem}
  .tbBloc .lien{font-size:1rem}
}

/* ---------------------------------------------------------------- la feuille Coaching, en trois colonnes
   Avant : le banc, les cartes et la fin coulaient en colonnes de journal (une phrase coupée d'une colonne à l'autre).
   Maintenant trois colonnes qui défilent chacune : tes cartes (ce qui se change le plus), ton banc (l'appel qui vient,
   ce qui joue, le temps mort, puis les changements), la fin du match. Le même contenu, dans le même ordre de lecture. */
.tb~.edFeuille.tbF-coaching .edFCorps:has(>.banc+.jeu){columns:auto;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.1fr) minmax(0,.8fr);grid-template-rows:auto minmax(0,1fr);gap:.6rem .9rem;overflow:hidden}
.tbF-coaching .edFCorps:has(>.banc+.jeu)>*{min-height:0;margin:0!important;overflow-y:auto;overscroll-behavior:contain}
.tbF-coaching .edFCorps:has(>.banc+.jeu)>.nfxLigne{grid-column:3;grid-row:1;overflow:visible}
.tbF-coaching .edFCorps:has(>.banc+.jeu)>.banc{grid-column:2;grid-row:1 / 3;display:flex;flex-direction:column}
.tbF-coaching .edFCorps:has(>.banc+.jeu)>.banc+.jeu{grid-column:1;grid-row:1 / 3}
.tbF-coaching .edFCorps:has(>.banc+.jeu)>.banc+.jeu+.jeu{grid-column:3;grid-row:2}
/* dans le banc : d'abord l'appel qui vient, ce qui joue et le temps mort ; les changements dessous */
.tbF-coaching .edFCorps>.banc>*{flex:none}
.tbF-coaching .edFCorps>.banc>.cinq{order:2;margin-top:.6rem;padding-top:.5rem;border-top:1px solid var(--trait)}
.tbF-coaching .edFCorps>.banc .compte{font-size:1.1rem;line-height:1.15;margin:.15rem 0 .25rem}
.tbF-coaching .edFCorps>.banc .compte b{color:var(--jaune)}
/* les cartes : deux par rangée, le rythme sur une rangée */
.tbF-coaching .edFCorps>.banc+.jeu .plans{grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem}
.tbF-coaching .edFCorps>.banc+.jeu .plans.trois{grid-template-columns:repeat(3,minmax(0,1fr))}
.tbF-coaching .edFCorps>.banc+.jeu+.jeu .plans{grid-template-columns:minmax(0,1fr)}
.tbF-coaching .edFCorps .plan{min-height:44px;break-inside:auto}
@media (orientation:landscape) and (max-height:560px){
  .tb~.edFeuille.tbF-coaching .edFCorps:has(>.banc+.jeu){gap:.3rem .5rem;padding-bottom:.35rem}
  .tbF-coaching .edFCorps:has(>.banc+.jeu)>.carte{padding:.25rem .4rem}
  .tbF-coaching .edFCorps>.banc+.jeu .plan{padding:.2rem .35rem}
  .tbF-coaching .edFCorps>.banc+.jeu .plan b{font-size:.85rem}
  .tbF-coaching .edFCorps>.banc+.jeu .plan small{font-size:12px;line-height:1.15}
  .tbF-coaching .edFCorps>.banc .cj{flex:1 1 9rem}
  .tbF-coaching .edFCorps>.banc .compte{font-size:1rem}
}
@media (min-width:900px) and (min-height:561px){
  .tb~.edFeuille.tbF-coaching{width:min(96rem,calc(100vw - 3rem));height:calc(100vh - var(--tbH) - 2rem)}
}
@media (min-width:1900px) and (min-height:1000px){
  .tbF-coaching .edFCorps .plan b{font-size:1.1rem}
  .tbF-coaching .edFCorps .plan small{font-size:.95rem}
  .tbF-coaching .edFCorps .sous,.tbF-coaching .edFCorps .etiq{font-size:1rem!important}
  .tb~.edFeuille.tbF-fil .fil div{font-size:1.05rem}
}

/* l'ordinateur moyen (1180 à 1400 de large) : les deux équipes assez larges pour toutes leurs colonnes */
@media (min-width:900px) and (max-width:1399px) and (min-height:561px){
  .tbGrille{grid-template-columns:minmax(20rem,1fr) minmax(0,2.2fr) minmax(20rem,1fr)}
  .tb .tbJ th,.tb .tbJ td{padding-left:.14rem;padding-right:.14rem}
  .tb .tbJ tbody th{white-space:normal;overflow-wrap:anywhere;line-height:1.1}
}
/* le nom d'un joueur s'ouvre sur toute la hauteur de sa ligne (la zone à toucher, pas le texte) */
.tb .tbJ tbody th .tbxFiche{position:relative}
.tb .tbJ tbody th .tbxFiche::after{content:"";position:absolute;inset:-.45rem -.3rem}
/* la feuille Coaching : 12 px au moins (les explications des cartes, les étiquettes, les fautes de chaque joueur) */
.tb~.edFeuille.tbF-coaching .edFCorps :is(small,.etiq,.cjt,.cjf){font-size:max(12px,.8rem)}
