/* ==========================================================
   Page Profondeur d'une équipe (ProTeam-profondeur.php)
   ========================================================== */

.profondeur { display: grid; gap: 2rem; min-width: 0; }
.profondeur__section { display: grid; gap: 1rem; scroll-margin-top: 1rem; min-width: 0; }
.profondeur__section > .titre-section { justify-self: start; margin-bottom: 0; }
.profondeur__section .titre-avec-lien .titre-section { margin-bottom: 0; }
.profondeur__note { margin: -.25rem 0 0; max-width: 60rem; }

.profondeur__grille { display: grid; gap: 1rem; align-items: start; }
.profondeur__grille--avants  { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.profondeur__grille--arriere { grid-template-columns: 2fr 1fr; }

/* ---------- Une colonne ---------- */
.colonne-prof { padding: 1rem 0 .5rem; min-width: 0; }
.colonne-prof__titre {
    font-size: 1.25rem;
    padding: 0 1rem .6rem;
    border-bottom: 2px solid var(--bleu);
    display: flex;
    align-items: baseline;
    gap: .5rem;
}
.colonne-prof > .discret { padding: .5rem 1rem 0; margin: 0; }

.colonne-prof__liste { list-style: none; margin: 0; padding: 0; }
/* Défenseurs : deux colonnes quand il y a la place */
.profondeur__grille--arriere .colonne-prof:first-child .colonne-prof__liste {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
    column-gap: 1rem;
}

.prof {
    display: grid;
    grid-template-columns: 1.4rem 40px minmax(0, 1fr);
    align-items: center;
    gap: .65rem;
    padding: .5rem 1rem;
    border-bottom: 1px solid var(--trait);
}
.prof:hover { background: var(--surface-2); }
.prof__rang { color: var(--texte-2); font-weight: 700; font-size: .85rem; text-align: right; font-variant-numeric: tabular-nums; }
.prof__photo {
    width: 40px; height: 40px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--surface-2);
}
.prof__texte { display: grid; min-width: 0; line-height: 1.25; }
.prof__nom { color: var(--texte); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prof__nom:hover { color: var(--bleu); text-decoration: none; }
.prof__details { color: var(--texte-2); font-size: .8rem; }
.prof__details .badge { margin-left: .25rem; }

/* Club-école : en retrait */
.prof.est-ecole .prof__nom { color: var(--texte-2); font-weight: 600; }
.prof.est-ecole .prof__photo { opacity: .75; }

.badge--chaud { color: var(--rouge); border-color: var(--rouge); }
.badge--froid { color: var(--bleu); border-color: var(--bleu); }

/* ---------- Choix au repêchage ---------- */
.choix { font-size: .9rem; }
.choix th, .choix td { text-align: center; padding: .6rem .5rem; white-space: nowrap; }
.choix thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; }
.choix .choix__annee {
    text-align: left;
    font-family: var(--police-titre);
    font-weight: 800;
    font-size: 1.15rem;
    padding-left: 1rem;
}
.choix thead .choix__annee { font-family: var(--police-texte); font-size: .75rem; font-weight: 600; }
.choix td { vertical-align: top; }
.choix td > * + * { margin-top: .3rem; }

.choix__pastille {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .2rem .55rem .2rem .3rem;
    border: 1px solid var(--trait);
    border-radius: 999px;
    background: var(--surface-2);
    font-weight: 700;
    font-size: .8rem;
}
.choix td .choix__pastille { display: flex; width: max-content; margin-left: auto; margin-right: auto; }
.choix__pastille.est-acquis { border-color: var(--bleu); color: var(--bleu); }
.choix__vide { color: var(--texte-2); }
.choix__legende { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.choix__legende .choix__pastille { padding-left: .55rem; }

/* ---------- Espoirs ---------- */
.espoirs {
    list-style: none;
    margin: 0;
    padding: .5rem 1rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
    column-gap: 1.5rem;
}
.espoirs li {
    display: grid;
    padding: .45rem 0;
    border-bottom: 1px solid var(--trait);
    line-height: 1.3;
}
.espoirs a { font-weight: 600; color: var(--texte); }
.espoirs a:hover { color: var(--bleu); }
.espoirs__details { display: block; color: var(--texte-2); font-size: .8rem; line-height: 1.35; }

/* ---------- Adaptation aux écrans ---------- */
@media (max-width: 1100px) {
    .profondeur__grille--arriere { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
    .profondeur__grille--avants { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Espoirs par niveau (tier) selon la ronde du repêchage LNH ---------- */
.niveau-espoirs { display: grid; gap: .5rem; }
.niveau-espoirs + .niveau-espoirs { margin-top: 1.25rem; }
.niveau-espoirs__titre {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .35rem .75rem;
    margin: 0;
    padding-left: .75rem;
    border-left: 4px solid var(--trait);
    font-size: 1.3rem;
}
.niveau-espoirs__titre span { font-family: var(--police-texte, inherit); font-size: .9rem; font-weight: 600; color: var(--texte-2); }
.niveau-espoirs__titre .niveau-espoirs__compte {
    margin-left: auto;
    padding: 0 .5rem;
    border: 1px solid var(--trait);
    border-radius: 999px;
    font-size: .8rem;
}
.niveau-espoirs--1 .niveau-espoirs__titre { border-left-color: var(--or); }
.niveau-espoirs--2 .niveau-espoirs__titre { border-left-color: var(--bleu); }
.niveau-espoirs--3 .niveau-espoirs__titre { border-left-color: var(--monte); }
