/* Feuille de match officielle Hockey Québec (réplique du modèle Spordle) : traits et bandeaux bleu HQ,
   libellés bilingues (anglais en italique), six colonnes en miroir, une page lettre paysage à l'impression. */
:root { --hq: #1d4f9c; --hq-trait: #5f82c2; --hq-pale: #dce6f5; --hq-clair: #eef3fb; --encre: #111; --l: 24px; }
* { box-sizing: border-box; }
body { margin: 0; background: #e6e8ec; color: var(--encre); font: 11px/1.2 Arial, Helvetica, sans-serif; }
.barre-ecran { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 16px; background: #0B1D3F; }
.barre-ecran a { color: #fff; font-weight: 700; text-decoration: none; font-size: 14px; }
.barre-ecran .etat { color: #ffd166; font-weight: 700; font-size: 13px; }
.barre-ecran button { background: #D7132E; color: #fff; border: 0; border-radius: 6px; padding: 8px 14px; font-weight: 700; font-size: 14px; cursor: pointer; }
.page { overflow-x: auto; padding: 16px 8px; }
.feuille { width: 1300px; margin: 0 auto; background: #fff; padding: 10px 12px 6px; }
.cadre { border: 2px solid var(--hq); border-radius: 8px; overflow: hidden; }

/* Libellés : condensés, bleus, majuscules ; anglais en italique. */
.lib, .bande, .sous, th { font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif; text-transform: uppercase; color: var(--hq); font-weight: 600; letter-spacing: .1px; }
.lib em, .bande em, .sous em, th em { font-style: italic; font-weight: 600; }
.bande { background: var(--hq); color: #fff; text-align: center; font-size: 13px; font-weight: 700; padding: 2px 4px; line-height: 1.15; }
.bande em { color: #fff; }
.sous { background: var(--hq-pale); text-align: center; font-size: 11px; padding: 1px 4px; }

/* Tableaux : lignes fines bleues, hauteur de ligne fixe. */
table { border-collapse: collapse; width: 100%; table-layout: fixed; }
th, td { border: 1px solid var(--hq-trait); padding: 0 3px; height: var(--l); text-align: center; overflow: hidden; white-space: nowrap; }
th { background: var(--hq-pale); font-size: 10px; line-height: 1; padding: 1px 2px; }
th small { display: block; font-size: 8px; font-style: italic; font-weight: 600; }
td { font-size: 12px; }
td.g, th.g { text-align: left; }
tr:first-child > th { border-top: 0; }
tr > *:first-child { border-left: 0; }
tr > *:last-child { border-right: 0; }

/* Ligne du haut : valeur au-dessus, libellé bilingue en dessous. */
.tete { display: grid; grid-template-columns: 2.1fr 1.4fr 1.3fr 0.9fr 0.9fr 1.1fr 1.6fr; gap: 6px; padding: 3px 8px 2px; border-bottom: 2px solid var(--hq); }
.tete > div { display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; }
.tete .val { font-size: 13px; text-align: center; padding: 0 6px 0 48px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tete .lib { font-size: 9px; line-height: 1; margin-top: -3px; }
.tete .ligue { flex-direction: row; align-items: center; gap: 6px; }
.tete .ligue .lib { margin: 0; width: 34px; }
.tete .ligue .val { padding: 0; font-size: 11px; flex: 1; }
.tete .ville { text-transform: uppercase; }

/* Corps : six colonnes 2 : 1 : 2 : 2 : 1 : 2, en miroir. */
.corps { display: grid; grid-template-columns: 250px 140px 1fr 1fr 140px 250px; grid-template-rows: auto auto auto auto; }
.corps > * { min-width: 0; }
.exterieur { grid-row: 1 / 5; position: relative; overflow: hidden; }
.exterieur.gauche { grid-column: 1; border-right: 2px solid var(--hq); }
.exterieur.droite { grid-column: 6; border-left: 2px solid var(--hq); }
.exterieur > .remplir { position: absolute; inset: 0; }
.pun-colonnes { display: grid; grid-template-columns: 1fr 1fr; }
.pun-colonnes > div + div { border-left: 2px solid var(--hq); }
.pun-colonnes table tr > *:first-child { border-left: 0; }
.suspendus td:first-child { width: 30px; }
.suspendus td:last-child { width: 44px; }
.suspendus th:last-child { font-size: 7px; line-height: 1; }
.pun .n { width: 26px; }
.pun .code { width: 34px; }
.pun .tps { width: 40px; }
.pun .per { width: 22px; }

/* En-tête d'équipe au-dessus des colonnes centrales. */
.equipe { grid-row: 1; display: flex; align-items: center; gap: 8px; padding: 2px 8px; border-bottom: 2px solid var(--hq); min-height: 40px; }
.equipe.vis { grid-column: 2 / 4; border-right: 1px solid var(--hq); }
.equipe.loc { grid-column: 4 / 6; border-left: 1px solid var(--hq); }
.equipe .cote { font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif; font-weight: 800; font-size: 32px; color: var(--hq); line-height: 1; }
.equipe .lib { font-size: 9px; line-height: 1.05; }
.equipe .nom { flex: 1; text-align: center; font-size: 15px; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Colonne POINTAGE - SCORE : table remplie jusqu'au bloc fusillade, calé en bas. */
.score { grid-row: 2 / 4; position: relative; }
.score.vis { grid-column: 2; border-right: 1px solid var(--hq); }
.score.loc { grid-column: 5; border-left: 1px solid var(--hq); }
.score > .remplir { position: absolute; inset: 0; display: flex; flex-direction: column; }
.score .tab { flex: 1; overflow: hidden; }
.score th { font-size: 9px; }
.score .n { width: 24px; }
.score .tps { width: 48px; }
.score .per { width: 20px; }
.ord { text-transform: none; }
.score td { font-size: 12px; }
.score .fd { font-size: 7px; color: var(--hq); vertical-align: top; }
.fus { border-top: 2px solid var(--hq); padding-bottom: 4px; }
.fus .sous { font-size: 11px; border-bottom: 1px solid var(--hq-trait); }
.fus .cases { display: grid; grid-template-columns: 1fr 1fr; gap: 0 4px; padding: 2px 4px 0; }
.fus .lib { text-align: center; font-size: 9px; line-height: 1; padding-left: 14px; }
.fus ol { list-style: none; margin: 1px 0 0; padding: 0; }
.fus li { display: flex; align-items: center; gap: 2px; height: 21px; }
.fus li span { width: 14px; text-align: right; color: var(--hq); font-size: 12px; }
.fus li b { flex: 1; height: 19px; border: 1px solid var(--hq-trait); font-weight: 400; font-size: 12px; line-height: 17px; text-align: center; }
.fus li b.but { background: var(--hq-pale); font-weight: 700; }
.fus .total { text-align: center; font-size: 10px; padding-top: 2px; }

/* Colonne NO. | NOMS - NAMES | C.A JA ; la hauteur de cette colonne règle celle du corps. */
.noms { grid-row: 2; }
.noms.vis { grid-column: 3; }
.noms.loc { grid-column: 4; border-left: 2px solid var(--hq); }
.noms .no { width: 32px; }
.noms .ca { width: 32px; }
.noms th { font-size: 12px; }
.noms th.ca { font-size: 8px; line-height: 1; }
.noms td { text-align: left; text-transform: uppercase; }
.noms td.no, .noms td.ca { text-align: center; }
.noms td.ca { font-size: 10px; }
.noms tr.gardien td { position: relative; }
.noms tr.gardien td.nom::after { content: 'G'; position: absolute; right: 6px; top: 1px; color: var(--hq); font-size: 17px; font-weight: 400; }
.noms tr.gardien:nth-child(3) td { border-bottom: 2px solid var(--hq); }

/* Officiels d'équipe de part et d'autre du médaillon. */
.officiels-equipe { grid-row: 3; grid-column: 3 / 5; display: grid; grid-template-columns: 1fr 100px 1fr; align-items: end; border-top: 2px solid var(--hq); }
.officiels-equipe .lignes { align-self: stretch; }
.officiels-equipe .lignes div { height: 21px; border-bottom: 1px solid var(--hq-trait); padding: 2px 6px 0; text-transform: uppercase; font-size: 12px; }
.officiels-equipe .lignes div:last-child { border-bottom: 0; }
.officiels-equipe .lignes div:first-child { border-top: 1px solid var(--hq-trait); }
.medaillon { width: 84px; height: 84px; margin: 2px auto; border-radius: 50%; border: 3px solid var(--hq); display: grid; place-items: center; grid-template-rows: 14px 1fr 14px; color: var(--hq); font-family: 'Barlow Condensed', sans-serif; font-weight: 800; text-transform: uppercase; background: #fff; }
.medaillon small { font-size: 8px; letter-spacing: .5px; font-weight: 700; }
.medaillon b { font-size: 30px; line-height: 1; font-style: italic; }

/* Bande des gardiens : TOTAL · SUPP. · 3e · 2e · 1re · GARDIENS No | No · 1re · 2e · 3e · SUPP. · TOTAL. */
.gardiens { grid-row: 4; grid-column: 2 / 6; border-top: 2px solid var(--hq); }
.gardiens th { font-size: 8px; line-height: 1; padding: 1px; }
.gardiens thead tr:first-child th { background: #fff; font-size: 9px; border-bottom: 0; }
.gardiens thead tr:first-child th em { font-size: 8px; }
.gardiens th.no, .gardiens td.no { border-left: 2px solid var(--hq); border-right: 2px solid var(--hq); }
.gardiens th.sep, .gardiens td.sep { border-left: 2px solid var(--hq); }
.gardiens td { font-size: 12px; height: 21px; }

/* Bande du bas. */
.bas { display: grid; grid-template-columns: 150px 150px 80px 1fr 80px 150px 150px; border-top: 2px solid var(--hq); }
.bas > div { min-width: 0; border-left: 1px solid var(--hq); display: flex; flex-direction: column; }
.bas > div:first-child { border-left: 0; }
.bas .gros { flex: 1; display: grid; place-items: center; font-size: 46px; font-weight: 400; line-height: 1; }
.bas .gros.so { font-size: 12px; color: #889; font-style: italic; }
.bas .final .bande { font-size: 9px; line-height: 1.05; padding: 1px 2px; }
.bas .vide { flex: 1; min-height: 34px; }
.bas .arret .sous { font-size: 10px; border-top: 1px solid var(--hq-trait); }
.bas .arret table { border-top: 1px solid var(--hq-trait); }
.bas .arret th { background: #fff; font-size: 8px; height: 20px; }
.bas .arret td { font-size: 12px; height: 22px; }
.bas .arret tr > th:first-child, .bas .arret tr > td:first-child { border-left: 0; }
.officiels .bande { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.officiels .bande small { font-size: 9px; font-weight: 600; }
.officiels .deux { display: grid; grid-template-columns: 1fr 1fr; flex: 1; }
.officiels .deux > div + div { border-left: 1px solid var(--hq-trait); }
.officiels .ligne { display: flex; align-items: center; gap: 6px; height: 24.4px; border-bottom: 1px solid var(--hq-trait); padding: 0 4px; }
.officiels .ligne:last-child { border-bottom: 0; }
.officiels .ligne .lib { font-size: 9px; line-height: 1; min-width: 96px; }
.officiels .ligne .lib em { display: block; }
.officiels .ligne .val { font-size: 12px; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Sous la feuille : A.N. / D.N. de chaque côté, étoiles au centre. */
.sous-feuille { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 4px 8px 0; font-size: 12px; }
.sous-feuille .d { text-align: right; }
.sous-feuille .c { text-align: center; color: #556; font-size: 10px; }
.sous-feuille span + span { margin-left: 18px; }

@media print {
  @page { size: letter landscape; margin: 6mm; }
  body { background: #fff; }
  .barre-ecran { display: none; }
  .page { padding: 0; overflow: visible; }
  .feuille { margin: 0; padding: 0; zoom: .775; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
/* Numéro survolable et bulle de fiche de saison (assets/fiche-joueur.js) */
.survol { cursor: help; border-bottom: 1px dotted currentColor; }
.survol:focus { outline: 2px solid var(--hq); outline-offset: 1px; }
.bulle-joueur { position: fixed; z-index: 50; max-width: 300px; background: #0B1D3F; color: #fff; padding: 10px 12px; border-radius: 8px; box-shadow: 0 6px 24px rgba(0, 0, 0, .3); font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 1.35; display: flex; flex-direction: column; gap: 4px; pointer-events: none; }
.bulle-joueur[hidden] { display: none; }
.bulle-joueur b { font-size: 14px; }
.bulle-joueur small { color: #B9C4DA; }
.bulle-joueur .ligne-stats i { font-style: normal; font-weight: 700; font-size: 14px; }
.bulle-joueur .badges { display: flex; flex-wrap: wrap; gap: 4px; }
.bulle-joueur .badge { background: #D7132E; color: #fff; font-size: 11px; font-weight: 700; padding: 2px 6px; border-radius: 10px; }
@media print { .bulle-joueur { display: none !important; } .survol { border-bottom: 0; } }
/* Nom d'équipe : lien vers la page de l'équipe à l'écran, texte ordinaire à l'impression. */
.lien-eq { color: inherit; text-decoration: none; }
@media screen { .lien-eq:hover { text-decoration: underline; } }
