/* Partite — dal prototipo approvato (partite_parti.html) */

/* ═══ PARTITE · l'elenco ═══ */
.titolo-sezione{ display:flex; align-items:center; gap:16px; padding-top:18px }
.titolo-sezione svg{ width:54px; height:54px }
.titolo-sezione h1{ margin:0; font:900 clamp(var(--c-dato), 8vw, var(--c-grande))/.85 var(--f-titolo); text-transform:uppercase; letter-spacing:-.01em }
.barra-filtri{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:10px 0 4px }
.barra-filtri .filtro input{ border:0; background:none; color:var(--inchiostro); font:600 var(--c-testo) var(--f-testo); width:16ch; outline:none }
.barra-filtri .filtro.interr{ cursor:pointer }
.barra-filtri .filtro.interr[aria-pressed="true"]{ border:2px solid var(--inchiostro); background:var(--velo); font-weight:700 }
.apri-filtri-p{ display:none }
.riassunto{ font:600 var(--c-testo) var(--f-cifre); color:var(--grigio); padding:4px 0 0 }
.blocco-giornata{ display:grid; gap:12px; margin-top:34px }
.blocco-giornata > header{ display:flex; align-items:flex-end; gap:14px; border-bottom:2px solid var(--inchiostro); padding-bottom:8px; flex-wrap:wrap }
.blocco-giornata .ng{ font:900 var(--c-dato)/.8 var(--f-titolo) }
.blocco-giornata .ng.verdetto{ color:var(--verdetto) }
.blocco-giornata h2{ font-size:var(--c-sottotitolo) }
.griglia-partite{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px }
.box-partita{ display:grid; border:1px solid var(--filetto); border-left:3px solid var(--inchiostro); background:var(--carta) }
.box-partita:hover{ border-color:var(--inchiostro) }
.box-partita .tessera-partita{ border:0; border-left:0 }
.box-partita .tessera-partita:hover{ transform:none; box-shadow:none }
/* ★ il DATO più grande dell'etichetta (Fabio, 01/10): «arbitro» piccolo e grigio, il nome grande */
.info-tp{ display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; padding:0 16px 10px 37px; font-size:var(--c-nota); color:var(--grigio) }
.info-tp b{ color:var(--inchiostro); font-weight:600; font-size:var(--c-testo) }
.chip b{ font-size:var(--c-testo); font-weight:700 }
.data-tp{ padding:10px 16px 0 37px; font:700 var(--c-nota) var(--f-cifre); text-transform:uppercase; letter-spacing:.04em; color:var(--grigio) }
.data-tp b{ font:800 var(--c-titoletto) var(--f-titolo); color:var(--inchiostro); letter-spacing:.02em }
@media (max-width:760px){ .data-tp{ padding-left:16px } }
.ora-tp small{ display:block; font:700 var(--c-testo)/1.2 var(--f-cifre); text-transform:uppercase; letter-spacing:.03em; color:var(--inchiostro); margin-bottom:4px; white-space:nowrap }
/* ★ 14/10/2026 (Fabio, 10/10: «i testi si sovrappongono»): sul telefono il guscio manda la data a capo in 9 caratteri, ma «16/10/2026»
     ne ha 10 e usciva di 6 px dal suo riquadro: il giorno sopra e la data sotto, larghi quanto la parola più lunga (mai meno) */
@media (max-width:760px){ .box-partita .tessera-partita.prossima .ora-tp small{ max-width:none; width:min-content } }
.piede-tp{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:8px 12px 10px 37px; border-top:1px solid var(--filetto) }
.chip{ font:600 var(--c-nota) var(--f-cifre); letter-spacing:.03em; border:1px solid var(--filetto); padding:3px 8px; color:var(--inchiostro); background:var(--carta) }
.chip.rosso{ border-color:var(--verdetto); color:var(--verdetto) }
.chip.lucchetto::before{ content:''; display:inline-block; width:10px; height:12px; margin-right:6px; vertical-align:-1px; border:2px solid currentColor; border-top-width:5px; border-radius:2px 2px 1px 1px }
.piede-tp .spazio{ flex:1 }
.btn-prec{ display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 12px; border:1px solid var(--inchiostro); background:var(--carta); color:var(--inchiostro); font:600 var(--c-nota) var(--f-cifre); text-transform:uppercase; letter-spacing:.04em; cursor:pointer }
.btn-prec svg{ width:18px; height:18px }
.id-partita{ font:var(--c-nota) var(--f-cifre); color:var(--grigio) }
.vuoto{ border:1px dashed var(--filetto); padding:28px; text-align:center; font-size:var(--c-testo); color:var(--grigio); margin-top:30px }
#p-prec{ top:50%; left:50%; transform:translate(-50%,-50%); width:min(620px,calc(100vw - 24px)); max-height:86vh }
@media (max-width:980px){ .griglia-partite{ grid-template-columns:1fr } }
@media (max-width:760px){
  .titolo-sezione h1{ font-size:var(--c-dato) } .titolo-sezione svg{ width:42px; height:42px }
  .barra-filtri .filtro{ display:none } .barra-filtri.aperta .filtro{ display:inline-flex; width:100% }
  .barra-filtri.aperta .filtro select,.barra-filtri.aperta .filtro input{ flex:1 }
  .apri-filtri-p{ display:inline-flex }
  .info-tp,.piede-tp{ padding-left:16px }
  .blocco-giornata .ng{ font-size:var(--c-dato) }
}