/* Composer son équipe depuis la ligue (onglet Mon équipe) : l'équipe, la start-list, les pronostics,
   le parcours guidé de la première composition et la feuille de match. Les jetons --lgb-* viennent de lgb-tiles.css. */

.tc {
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    color: var(--lgb-ink);
    font-family: 'LGB-Equip', sans-serif;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
}

.tc *, .tc *::before, .tc *::after { box-sizing: border-box; }
:where(.tc) button { font: inherit; color: inherit; cursor: pointer; }
.tc svg { flex-shrink: 0; }
.tc .app-bottom { flex-shrink: 0; position: relative; }

/* Les zones qui défilent gardent la taille de leur contenu : le cadre coupe, il n'écrase pas */
.tc-body > *,
.tc-scroll > *,
.tc-wizard-body > *,
.tc-panel > *,
.tc-matchsheet > *,
.tc-bsheet > * { flex-shrink: 0; }

.tc-garaje {
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 1;
}

.tc-body {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 12px 12px 16px 12px;
    overflow: hidden;
}

/* ---------- Tuile d'en-tête : la team et ce qui manque ---------- */

.tc-hero {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 14px 12px 14px;
    border-radius: var(--lgb-radius);
    background: linear-gradient(135deg, var(--lgb-night) 0%, var(--lgb-violet-deep) 60%, var(--lgb-violet) 100%);
    color: #FFFFFF;
    overflow: hidden;
}

.tc-hero--ready {
    background: linear-gradient(135deg, #0B3D1F 0%, #13703A 60%, #1FA157 100%);
}

.tc-hero-star {
    position: absolute;
    z-index: -1;
    right: -34px;
    top: -34px;
    width: 150px;
    height: 150px;
    color: #FFFFFF;
    opacity: 0.08;
}

.tc-hero-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.tc-eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lgb-lilac);
}

.tc-hero--ready .tc-eyebrow { color: #BFF5D3; }

.tc-team-name {
    margin: 3px 0 0 0;
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 30px;
    line-height: 1;
    text-transform: uppercase;
}

.tc-round-btn {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: #FFFFFF;
}

.tc-round-btn svg { width: 18px; height: 18px; }

/* Fermer une feuille ou la start-list */
.tc-icon-btn {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: none;
}

.tc-icon-btn:hover { background: var(--lgb-lilac-soft); }
.tc-icon-btn svg { width: 22px; height: 22px; }

.tc-meters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.tc-meter {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 10px 11px;
    border-radius: var(--lgb-radius);
    background: rgba(255, 255, 255, 0.1);
}

.tc-meter-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
}

.tc-meter-value {
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 26px;
    line-height: 1;
}

.tc-meter-value small {
    font-size: 15px;
    opacity: 0.6;
}

.tc-meter-label {
    font-size: 12px;
    line-height: 1.2;
    color: var(--lgb-lilac);
    text-align: right;
}

.tc-hero--ready .tc-meter-label { color: #D5F8E2; }

.tc-bar {
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    overflow: hidden;
}

.tc-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--lgb-green);
}

.tc-hero-foot {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    line-height: 1.3;
    color: var(--lgb-lilac);
}

.tc-hero-foot b { color: #FFFFFF; font-weight: 700; }
.tc-hero-foot svg { width: 15px; height: 15px; }
.tc-hero--ready .tc-hero-foot { color: #D5F8E2; }

/* ---------- Sections ---------- */

.tc-section {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tc-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 8px;
    padding: 0 2px;
}

.tc-section-title {
    margin: 0;
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 21px;
    line-height: 1;
    text-transform: uppercase;
}

.tc-section-sub {
    margin: 3px 0 0 0;
    font-size: 12px;
    line-height: 1.35;
    color: var(--lgb-ink-2);
}

.tc-link {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 13px;
    font-weight: 700;
    color: var(--lgb-violet);
    text-decoration: none;
    white-space: nowrap;
}

.tc-link svg { width: 16px; height: 16px; }

/* ---------- Effectif : grille de coureurs ---------- */

.tc-roster {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.tc-slot {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 5px 8px 5px 6px;
    border: 0;
    border-radius: var(--lgb-radius);
    background: var(--lgb-surface);
    box-shadow: var(--lgb-shadow);
    text-align: left;
}

.tc-slot-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
    line-height: 1.15;
}

.tc-slot-name {
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-slot-sub {
    font-size: 11px;
    color: var(--lgb-ink-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-slot-mark {
    width: 18px;
    height: 18px;
    object-fit: contain;
}

.tc-slot--empty {
    justify-content: center;
    gap: 6px;
    border: 1.5px dashed #C3BDD0;
    background: transparent;
    box-shadow: none;
    color: var(--lgb-violet);
    font-size: 13px;
    font-weight: 700;
}

.tc-slot--empty svg { width: 16px; height: 16px; }

.tc-slot--alert {
    box-shadow: inset 0 0 0 1.5px var(--lgb-red);
}

.tc-slot--alert .tc-slot-sub { color: var(--lgb-red); font-weight: 700; }

/* ---------- Bascule maillots / liste ---------- */

.tc-view {
    flex-shrink: 0;
    display: inline-flex;
    padding: 3px;
    border-radius: 999px;
    background: #E9E6F0;
}

.tc-view-btn {
    display: grid;
    place-items: center;
    width: 38px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #5A5468;
}

.tc-view-btn svg { width: 17px; height: 17px; }

.tc .tc-view-btn--on {
    background: #FFFFFF;
    color: var(--lgb-violet);
    box-shadow: 0 1px 3px rgba(21, 18, 31, 0.15);
}

/* ---------- Vue maillots : la photo d'équipe ---------- */

.tc-kits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 6px;
    padding: 14px 8px 12px 8px;
    border-radius: var(--lgb-radius);
    background: var(--lgb-surface);
    box-shadow: var(--lgb-shadow);
}

.tc-kit {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    line-height: 1.15;
    text-align: center;
}

.tc-kit-shirt {
    position: relative;
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin-bottom: 4px;
    border-radius: 50%;
    background: #F4F2F8;
    color: var(--lgb-violet);
}

.tc-kit-shirt > svg { width: 22px; height: 22px; }

.tc-kit-img {
    width: 46px;
    height: 46px;
    object-fit: contain;
}

.tc-kit-badge {
    position: absolute;
    right: -5px;
    bottom: -3px;
    width: 24px;
    height: 24px;
    padding: 2px;
    border-radius: 50%;
    background: #FFFFFF;
    box-shadow: 0 1px 3px rgba(21, 18, 31, 0.28);
    object-fit: contain;
}

.tc-kit-ln {
    max-width: 100%;
    font-size: 12.5px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-kit-fn {
    max-width: 100%;
    font-size: 11px;
    color: var(--lgb-ink-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-kit--empty .tc-kit-shirt {
    background: transparent;
    border: 1.5px dashed #C3BDD0;
}

.tc-kit--empty .tc-kit-ln { color: var(--lgb-violet); }

.tc-kit--alert .tc-kit-shirt {
    background: var(--lgb-red-soft);
    box-shadow: 0 0 0 2px var(--lgb-red);
}

.tc-kit--alert .tc-kit-fn { color: #B3261E; font-weight: 700; }

/* ---------- Vue liste : les chiffres ---------- */

.tc-row-num {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 34px;
    line-height: 1.1;
}

.tc-row-num b { font-size: 14px; font-variant-numeric: tabular-nums; }
.tc-row-num b sup { font-size: 9px; }
.tc-row-num small { font-size: 10px; color: var(--lgb-ink-2); }

.tc-row-go {
    width: 16px;
    height: 16px;
    color: #A9A3B6;
}

.tc-row--free {
    justify-content: center;
    gap: 6px;
    min-height: 46px;
    color: var(--lgb-violet);
    font-size: 13px;
    font-weight: 700;
    background: repeating-linear-gradient(135deg, #FAF8FF 0 8px, #F3EFFF 8px 16px);
}

.tc-row--free svg { width: 16px; height: 16px; }

/* ---------- Maillots et drapeaux ---------- */

.tc-jersey {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    object-fit: contain;
}

.tc-jersey--xs { width: 18px; height: 18px; }
.tc-jersey--sm { width: 30px; height: 30px; }
.tc-jersey--lg { width: 46px; height: 46px; }
.tc-jersey--xl { width: 64px; height: 64px; }

.tc-flag {
    width: 17px;
    height: 12px;
    flex-shrink: 0;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
}

/* ---------- Pronostics : un maillot, un coureur ---------- */

.tc-picks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.tc-pick {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 60px;
    padding: 8px 10px 8px 8px;
    border: 0;
    border-radius: var(--lgb-radius);
    background: var(--lgb-surface);
    box-shadow: var(--lgb-shadow);
    text-align: left;
}

.tc-pick-icon {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    object-fit: contain;
}

.tc-pick-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.15;
}

.tc-pick-label {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--lgb-ink-2);
    white-space: nowrap;
}

.tc-pick-rider {
    font-size: 13.5px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-pick-pts {
    font-size: 11px;
    font-weight: 700;
    color: var(--lgb-green-ink);
}

.tc-pick--empty {
    border: 1.5px dashed #C3BDD0;
    background: transparent;
    box-shadow: none;
}

.tc-pick--empty .tc-pick-rider { color: var(--lgb-violet); }

/* ---------- Barre d'action collante ---------- */

.tc-action {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px 22px 12px;
    background: #FFFFFF;
    box-shadow: 0 -8px 20px -14px rgba(21, 18, 31, 0.35);
}

.tc-action-text svg { width: 20px; height: 20px; }

.tc-action-text {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    line-height: 1.3;
    color: var(--lgb-ink-2);
}

.tc-action-text b { color: var(--lgb-ink); }

.tc-action-ok {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--lgb-green-ink);
    font-weight: 700;
}

.tc-action-ok svg { width: 20px; height: 20px; }

.tc-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    background: var(--lgb-violet);
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    text-decoration: none;
    box-shadow: 0 10px 22px -12px rgba(107, 66, 254, 0.9);
}

.tc .tc-cta { color: #FFFFFF; }
.tc-cta svg { width: 18px; height: 18px; }
.tc-cta--block { width: 100%; height: 50px; font-size: 16px; }
.tc .tc-cta--ghost { background: transparent; color: var(--lgb-violet); box-shadow: none; }
.tc-cta--disabled { background: #E7E4EE; color: #8E889C; box-shadow: none; }
.tc .tc-cta--light { background: #FFFFFF; color: var(--lgb-violet); box-shadow: none; }
.tc-cta--sm { height: 36px; padding: 0 14px; font-size: 13px; }

/* ---------- Start-list en plein écran ---------- */

.tc-sheet-head {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 12px 10px 12px;
    background: #FFFFFF;
    border-bottom: 1px solid var(--lgb-line);
}

.tc-sheet-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    align-items: center;
    gap: 8px;
}

.tc-sheet-title {
    margin: 0;
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 24px;
    line-height: 1;
    text-transform: uppercase;
}

.tc-sheet-sub {
    margin: 3px 0 0 0;
    font-size: 12px;
    color: var(--lgb-ink-2);
}

.tc-search {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    background: #F2F1F5;
    color: #77718A;
    font-size: 14px;
}

.tc-search svg { width: 18px; height: 18px; color: var(--lgb-ink-2); }

.tc-search--light {
    background: #FFFFFF;
    box-shadow: inset 0 0 0 1px #E4E1EA;
}

.tc-search input {
    flex: 1;
    min-width: 0;
    height: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--lgb-ink);
    font: inherit;
    outline: none;
}

.tc-search input::placeholder { color: #77718A; }

.tc-chips {
    display: flex;
    gap: 6px;
    overflow: hidden;
    white-space: nowrap;
}

.tc-chip {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 32px;
    padding: 0 12px;
    border: 1px solid #DDD9E5;
    border-radius: 999px;
    background: #FFFFFF;
    color: #3B3747;
    font-size: 12.5px;
    font-weight: 600;
}

.tc-chip svg { width: 14px; height: 14px; }

.tc .tc-chip--on {
    border-color: var(--lgb-violet);
    background: var(--lgb-violet);
    color: #FFFFFF;
}

.tc-count-band {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: var(--lgb-lilac-soft);
    border-bottom: 1px solid #E5DEFF;
    font-size: 13px;
}

.tc-count-band b { font-size: 15px; }

.tc-count-band .tc-bar {
    flex: 1;
    background: #DCD3FF;
}

.tc-count-band .tc-bar span { background: var(--lgb-violet); }

.tc-scroll {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px 10px 0 10px;
    overflow: hidden;
}

/* ---------- Lignes de coureur ---------- */

.tc-list {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    border-radius: var(--lgb-radius);
    background: #FFFFFF;
    box-shadow: var(--lgb-shadow);
    overflow: hidden;
}

.tc-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 56px;
    padding: 6px 10px 6px 8px;
    border-top: 1px solid var(--lgb-line);
}

.tc-row:first-child { border-top: 0; }
.tc-row--compact { min-height: 48px; }
.tc-row--in { background: var(--lgb-lilac-soft); }

.tc-row-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    line-height: 1.15;
}

.tc-row-name {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.tc-row-name span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-row-sub {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-size: 11.5px;
    color: var(--lgb-ink-2);
    white-space: nowrap;
    overflow: hidden;
}

.tc-row-pts {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
    line-height: 1.1;
}

.tc-row-pts b { font-size: 15px; }
.tc-row-pts small { font-size: 10.5px; color: var(--lgb-ink-2); }

.tc-tag {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    height: 17px;
    padding: 0 6px;
    border-radius: 999px;
    background: #EFEDF3;
    color: #4A4458;
    font-size: 10.5px;
    font-weight: 700;
}

.tc-tag svg { width: 11px; height: 11px; }
.tc-tag--climb { background: #FFE9D6; color: #8A3B00; }
.tc-tag--sprint { background: #DDF3E6; color: #0B5A2C; }
.tc-tag--punch { background: #FFE3EE; color: #A0124A; }
.tc-tag--tt { background: #DCEBFF; color: #0B3F8A; }
.tc-tag--break { background: #FFF4C2; color: #6B4E00; }
.tc-tag--bonus { background: var(--lgb-lilac); color: var(--lgb-violet-deep); }

.tc-add {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1.5px solid #C9C4D3;
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--lgb-violet);
}

.tc-add svg { width: 18px; height: 18px; }

/* Team complète : le « + » reste touchable pour expliquer pourquoi il ne fait rien */
.tc-add:disabled,
.tc-add--muted { opacity: 0.4; }

.tc .tc-add--on {
    border-color: var(--lgb-violet);
    background: var(--lgb-violet);
    color: #FFFFFF;
}

.tc-group-title {
    margin: 6px 2px 0 2px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--lgb-ink-2);
}

.tc-group-title span {
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
}

/* ---------- Feuille du bas (au-dessus de l'écran) ---------- */

.tc-scrim {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: rgba(21, 18, 31, 0.52);
}

.tc-bsheet {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 88%;
    padding: 8px 14px 16px 14px;
    border-radius: 16px 16px 0 0;
    background: #FFFFFF;
    box-shadow: 0 -20px 40px -20px rgba(0, 0, 0, 0.4);
    overflow: hidden;
}

.tc-grip {
    align-self: center;
    width: 40px;
    height: 4px;
    border-radius: 999px;
    background: #D9D5E2;
}

.tc-bsheet-head {
    display: flex;
    align-items: center;
    gap: 12px;
}

.tc-bsheet-title {
    margin: 0;
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 24px;
    line-height: 1;
    text-transform: uppercase;
}

.tc-bsheet-sub {
    margin: 4px 0 0 0;
    font-size: 12px;
    line-height: 1.35;
    color: var(--lgb-ink-2);
}

.tc-bsheet .tc-list { box-shadow: inset 0 0 0 1px var(--lgb-line); }

.tc-radio {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 2px solid #C9C4D3;
    background: #FFFFFF;
    color: #FFFFFF;
}

.tc-radio svg { width: 13px; height: 13px; }

.tc-radio--on {
    border-color: var(--lgb-violet);
    background: var(--lgb-violet);
}

/* Fiche rapide d'un coureur de l'effectif */
.tc-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.tc-fact {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 9px 10px;
    border-radius: var(--lgb-radius);
    background: #F6F5F9;
}

.tc-fact b {
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 20px;
    line-height: 1;
}

.tc-fact span {
    font-size: 11px;
    color: var(--lgb-ink-2);
}

/* Les six maillots en interrupteurs */
.tc-jerseys {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.tc-jbtn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-height: 66px;
    padding: 8px 4px 7px 4px;
    border: 1.5px solid #E2DEEA;
    border-radius: var(--lgb-radius);
    background: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.15;
    text-align: center;
}

.tc-jbtn img { width: 26px; height: 26px; object-fit: contain; }

.tc .tc-jbtn--on {
    border-color: var(--lgb-violet);
    background: var(--lgb-lilac-soft);
    color: var(--lgb-violet-deep);
    box-shadow: 0 0 0 1px var(--lgb-violet);
}

.tc-jbtn--off { opacity: 0.38; }

.tc-jbtn small {
    font-size: 10px;
    font-weight: 400;
    color: var(--lgb-ink-2);
}

.tc-sheet-actions {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tc-menu-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    padding: 0 6px;
    border: 0;
    border-radius: var(--lgb-radius);
    background: transparent;
    font-size: 15px;
    font-weight: 600;
    text-align: left;
    text-decoration: none;
}

.tc-menu-item svg { width: 20px; height: 20px; }
.tc .tc-menu-item--danger { color: #B3261E; }

/* ---------- Piste B : la start-list par équipe, l'équipe en dock ---------- */

.tc-seg {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 3px;
    border-radius: 999px;
    background: #ECEAF1;
}

.tc-seg-item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #4A4458;
    font-size: 12.5px;
    font-weight: 600;
}

.tc .tc-seg-item--on {
    background: #FFFFFF;
    color: var(--lgb-ink);
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(21, 18, 31, 0.15);
}

.tc-peloton {
    display: grid;
    grid-template-columns: repeat(20, minmax(0, 1fr));
    gap: 2px;
}

.tc-peloton img {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    object-fit: contain;
}

.tc-peloton i {
    display: block;
    aspect-ratio: 1;
    margin: 2px;
    border-radius: 50%;
    border: 1.5px dashed rgba(255, 255, 255, 0.45);
}

.tc-peloton--light i { border-color: #B9B2C8; }

.tc-peloton--10 { grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 4px; }

/* ---------- Piste C : la feuille de match, pas à pas ---------- */

.tc-wizard-body {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 14px 0 14px;
    overflow: hidden;
}

.tc-question {
    margin: 0;
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 26px;
    line-height: 1;
    text-transform: uppercase;
}

.tc-lead {
    margin: -4px 0 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--lgb-ink-2);
}

.tc-strip {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px 12px 12px;
    border-radius: var(--lgb-radius);
    background: #FFFFFF;
    box-shadow: var(--lgb-shadow);
}

.tc-strip-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    font-size: 12px;
    color: var(--lgb-ink-2);
}

.tc-strip-head b {
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 22px;
    color: var(--lgb-ink);
}

.tc-quiz-steps {
    display: grid;
    grid-template-columns: repeat(var(--picks, 6), minmax(0, 1fr));
    gap: 6px;
}

.tc-quiz-step {
    position: relative;
    display: grid;
    place-items: center;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: var(--lgb-radius);
    background: #FFFFFF;
    box-shadow: var(--lgb-shadow);
}

.tc-quiz-step img { width: 26px; height: 26px; object-fit: contain; }
.tc-quiz-step--todo img { opacity: 0.35; }

.tc-quiz-step--current {
    box-shadow: 0 0 0 2px var(--lgb-violet);
    background: var(--lgb-lilac-soft);
}

.tc-quiz-step-done {
    position: absolute;
    right: -4px;
    top: -4px;
    display: grid;
    place-items: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--lgb-green);
    color: #0B3D1F;
}

.tc-quiz-step-done svg { width: 10px; height: 10px; }

.tc-quiz-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 18px 16px 16px 16px;
    border-radius: var(--lgb-radius);
    background: #FFFFFF;
    box-shadow: var(--lgb-shadow);
    text-align: center;
}

.tc-quiz-card .tc-question { font-size: 28px; }

.tc-candidates {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.tc-candidate {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 12px 6px 10px 6px;
    border: 1.5px solid #E2DEEA;
    border-radius: var(--lgb-radius);
    background: #FFFFFF;
    line-height: 1.15;
    text-align: center;
}

.tc-candidate b { font-size: 13px; }
.tc-candidate > span:not(.tc-radio) { font-size: 11px; color: var(--lgb-ink-2); }

.tc .tc-candidate--on {
    border-color: var(--lgb-violet);
    background: var(--lgb-lilac-soft);
    box-shadow: 0 0 0 1px var(--lgb-violet), 0 10px 22px -14px rgba(58, 31, 158, 0.7);
}

.tc-candidate .tc-radio {
    position: absolute;
    right: 6px;
    top: 6px;
    width: 20px;
    height: 20px;
}

/* La feuille de match : podium, maillots, effectif */
.tc-matchsheet {
    position: relative;
    isolation: isolate;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px 14px 0 14px;
    background: linear-gradient(170deg, var(--lgb-night) 0%, var(--lgb-violet-deep) 70%, var(--lgb-violet) 100%);
    color: #FFFFFF;
    overflow: hidden;
}

.tc-podium {
    display: grid;
    grid-template-columns: 1fr 1.12fr 1fr;
    align-items: end;
    gap: 6px;
}

.tc-podium-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-align: center;
    line-height: 1.1;
}

.tc-podium-col b { font-size: 13px; }
.tc-podium-col > span:not(.tc-podium-block) { font-size: 10.5px; color: var(--lgb-lilac); }

.tc-podium-block {
    display: grid;
    place-items: center;
    width: 100%;
    border-radius: 6px 6px 0 0;
    background: rgba(255, 255, 255, 0.14);
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 26px;
}

.tc-podium-block--1 { height: 74px; background: rgba(255, 255, 4, 0.9); color: #2E2B00; }
.tc-podium-block--2 { height: 54px; }
.tc-podium-block--3 { height: 40px; }

.tc-maillots {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.tc-maillot {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 8px;
    border-radius: var(--lgb-radius);
    background: rgba(255, 255, 255, 0.1);
    line-height: 1.1;
}

.tc-maillot img { width: 26px; height: 26px; object-fit: contain; flex-shrink: 0; }
.tc-maillot b { display: block; font-size: 12px; }
.tc-maillot span { display: block; font-size: 10px; color: var(--lgb-lilac); }

.tc-names {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 10px;
    font-size: 12.5px;
}

.tc-names span {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-names img { width: 18px; height: 18px; object-fit: contain; }

.tc-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.16);
}

/* ---------- Vue liste : en-tête et lignes ---------- */

.tc-list-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px 7px 52px;
    border-bottom: 1px solid var(--lgb-line);
    background: #FAF9FC;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--lgb-ink-2);
}

.tc-list-head > span:first-child { flex: 1; }
.tc-list-head .num { min-width: 34px; text-align: right; }
.tc-list-head .go { width: 16px; }
.tc-list-head + .tc-row { border-top: 0; }

.tc .tc-row--link {
    gap: 8px;
    color: inherit;
    text-decoration: none;
}

.tc .tc-row--link:hover { color: inherit; }

.tc-row--alert { background: var(--lgb-red-soft); }
.tc-row--alert .tc-row-sub { color: #B3261E; font-weight: 700; }

.tc .tc-row--free { text-decoration: none; }

/* ---------- Pendant la course : lecture seule ---------- */

.tc-meters--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.tc-meters--3 .tc-meter-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}

.tc-meters--3 .tc-meter-label { text-align: left; }

.tc-kit-pts {
    font-size: 12px;
    font-weight: 700;
    color: var(--lgb-violet);
    font-variant-numeric: tabular-nums;
}

.tc-kit--out .tc-kit-shirt {
    background: var(--lgb-red-soft);
}

.tc-kit--out .tc-kit-img,
.tc-kit--out .tc-kit-badge { opacity: 0.45; filter: grayscale(1); }
.tc-kit--out .tc-kit-ln { color: #8B8595; text-decoration: line-through; }
.tc-kit--out .tc-kit-pts { color: #B3261E; }

.tc-list-group {
    padding: 8px 10px 6px 10px;
    border-top: 1px solid var(--lgb-line);
    background: #FFF5F5;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #B3261E;
}

.tc-list-group span { text-transform: none; letter-spacing: 0; font-weight: 400; }

.tc-row--out { background: #FFF5F5; }
.tc-row--out .tc-jersey { opacity: 0.45; filter: grayscale(1); }
.tc-row--out .tc-row-name > span { color: #8B8595; text-decoration: line-through; }
.tc-row--out .tc-row-sub { color: #B3261E; }
.tc-row--out .tc-row-num b { color: #B3261E; }

.tc-row-num small { font-size: 10px; color: var(--lgb-ink-2); }

.tc-pick--out { background: #FFF5F5; }
.tc-pick--out .tc-pick-icon { opacity: 0.45; filter: grayscale(1); }
.tc-pick--out .tc-pick-rider { color: #8B8595; text-decoration: line-through; }
.tc-pick--out .tc-pick-pts { color: #B3261E; }

.tc-pick-wait { color: var(--lgb-ink-2); font-weight: 400; }

/* Pronostic resté vide au départ : plus rien à choisir */
.tc-pick--none .tc-pick-rider { color: var(--lgb-ink-2); font-weight: 400; }

.tc-panache {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #FFF1E6;
    color: #E8590C;
}

.tc-panache svg { width: 18px; height: 18px; }

.tc-row-gain {
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 700;
    color: #1B7F3B;
}

/* ---------- LGB Rank : rang et points dans une colonne ---------- */

.tc-row-num--rank { min-width: 58px; }
.tc-list-head .num--rank { min-width: 58px; }
.tc-list-head .add { width: 36px; }
.tc-row-pts b sup { font-size: 9px; }

/* ---------- Profil : pavés et notes FirstCycling ---------- */

.tc-tag--cobble { background: #ECE7E1; color: #4F4033; }
.tc-tag b { margin-left: 2px; font-weight: 800; }

.tc-notes {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 4px;
    padding: 10px 6px 8px 6px;
    border-radius: var(--lgb-radius);
    background: #F6F5F9;
}

.tc-note {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    min-width: 0;
}

.tc-note-bar {
    position: relative;
    width: 14px;
    height: 46px;
    border-radius: 4px;
    background: #E4E0EC;
    overflow: hidden;
}

.tc-note-bar i {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: #B9B2C8;
}

.tc-note-bar::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 75%;
    height: 2px;
    background: #15121F;
    opacity: 0.5;
}

.tc-note--hi .tc-note-bar i { background: var(--lgb-violet); }
.tc-note b { font-size: 12.5px; font-variant-numeric: tabular-nums; }
.tc-note--hi b { color: var(--lgb-violet); }
.tc-note small { max-width: 100%; font-size: 9.5px; color: var(--lgb-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.tc-notes-legend {
    margin: -6px 2px 0 2px;
    font-size: 11px;
    line-height: 1.35;
    color: var(--lgb-ink-2);
}

.tc-facts--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tc-fact b sup { font-size: 12px; }

/* ---------- Plusieurs non-partants ---------- */

.tc-list-group--plain {
    background: #FAF9FC;
    color: var(--lgb-ink-2);
}

.tc-pick--alert {
    background: #FFF5F5;
    box-shadow: inset 0 0 0 1.5px var(--lgb-red);
}

.tc-pick--alert .tc-pick-rider { color: #B3261E; text-decoration: line-through; }
.tc-pick--alert .tc-pick-pts { color: #B3261E; }

.tc-hero-foot--alert { color: #FFFFFF; }
.tc-hero-foot--alert svg { color: #FFB4AB; }

.tc-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--lgb-radius);
    background: var(--lgb-lilac-soft);
    font-size: 12.5px;
    line-height: 1.35;
}

.tc-check-box {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 5px;
    background: var(--lgb-violet);
    color: #FFFFFF;
}

.tc-check-box svg { width: 14px; height: 14px; }
.tc-check img { width: 22px; height: 22px; flex-shrink: 0; object-fit: contain; }

/* ---------- Filtres repliés : un bouton à côté de la recherche ---------- */

.tc-search-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tc-search-row .tc-search { flex: 1; min-width: 0; }

.tc .tc-filter-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 42px;
    padding: 0 13px;
    border: 1px solid #DDD9E5;
    border-radius: 999px;
    background: #FFFFFF;
    color: var(--lgb-ink);
    font-size: 13px;
    font-weight: 700;
}

.tc-filter-btn svg { width: 18px; height: 18px; }

.tc .tc-filter-btn--on {
    border-color: var(--lgb-violet);
    background: var(--lgb-lilac-soft);
    color: var(--lgb-violet);
}

.tc-filter-count {
    display: grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--lgb-violet);
    color: #FFFFFF;
    font-size: 11px;
}

.tc-chips--wrap { flex-wrap: wrap; overflow: visible; white-space: normal; }
.tc-chip small { color: var(--lgb-ink-2); font-weight: 400; }
.tc-chip--on small { color: inherit; opacity: 0.8; }
.tc-chip-x { display: inline-grid; margin-right: -4px; }
.tc-chip-x svg { width: 14px; height: 14px; }

.tc-active-row {
    display: flex;
    align-items: center;
    gap: 6px;
}

.tc-active-row .tc-link { margin-left: auto; border: 0; background: none; padding: 0; }

.tc-filter-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tc-filter-group .tc-group-title { margin: 0 2px; }

.tc-sheet-foot {
    display: flex;
    gap: 8px;
}

.tc-sheet-foot .tc-cta { flex: 1; justify-content: center; }

/* Piste C : avancer sans team complète */
.tc-notice {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--lgb-radius);
    background: var(--lgb-lilac-soft);
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--lgb-ink-2);
}

.tc-notice svg { width: 18px; height: 18px; flex-shrink: 0; margin-top: 1px; color: var(--lgb-violet); }
.tc-notice b { color: var(--lgb-ink); font-weight: 600; }

.tc-wait {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 26px 20px 22px 20px;
    border-radius: var(--lgb-radius);
    background: #FFFFFF;
    box-shadow: var(--lgb-shadow);
    text-align: center;
}

.tc-wait-icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--lgb-lilac-soft);
    color: var(--lgb-violet);
}

.tc-wait-icon svg { width: 28px; height: 28px; }
.tc-wait h3 { margin: 4px 0 0 0; font-size: 17px; line-height: 1.25; }
.tc-wait p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--lgb-ink-2); }
.tc-wait p b { color: var(--lgb-ink); font-weight: 600; }

.tc .tc-wait-date {
    margin-top: 4px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--lgb-lilac-soft);
    font-size: 12px;
    font-weight: 600;
    color: var(--lgb-violet);
}

.tc-ms-todo {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--lgb-radius);
    background: rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 0 0 1px rgba(255, 180, 171, 0.45);
    font-size: 12.5px;
    line-height: 1.4;
}

.tc-ms-todo svg { width: 18px; height: 18px; flex-shrink: 0; margin-top: 1px; color: #FFB4AB; }

.tc-maillot--todo {
    padding: 6.5px;
    border: 1.5px dashed rgba(255, 255, 255, 0.35);
    background: transparent;
}

.tc-maillot--todo img { opacity: 0.4; }
.tc-maillot--todo b { color: #FFB4AB; }

.tc-names .tc-name--todo { color: rgba(255, 255, 255, 0.55); font-style: italic; }

.tc-name--todo i {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    border: 1.5px dashed rgba(255, 255, 255, 0.45);
    border-radius: 50%;
}

/* ---------- Dans l'appli : onglet Mon équipe, boutons et feuilles MudBlazor ---------- */

.tc-screen {
    height: calc(100dvh - 11rem);
    background: var(--lgb-page);
}

.tc-screen > .scroll-wrapper {
    flex: 1;
    min-height: 0;
    height: auto;
}

.tc-screen .tc-body {
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    overflow: visible;
}

/* En bas, de quoi laisser passer la bulle centrale du menu, qui dépasse au-dessus de la barre */
.tc-screen .tc-action { padding: 10px 12px 20px 12px; }

.tc-action--alert { background: #FFF5F5; }

.tc-action--alert .tc-action-text {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #B3261E;
}

.tc-action--alert .tc-action-text b { color: #B3261E; }

/* Les lignes et pastilles sont des boutons : on efface le style du navigateur */
.tc button.tc-row {
    width: 100%;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    background: transparent;
    font: inherit;
    color: inherit;
    text-align: left;
}

.tc button.tc-row.tc-row--free { background: repeating-linear-gradient(135deg, #FAF8FF 0 8px, #F3EFFF 8px 16px); color: var(--lgb-violet); }
.tc div.tc-row--link { cursor: pointer; }
.tc button:disabled { cursor: default; }
.tc-row--free svg { width: 16px; height: 16px; }

.tc-grow { flex: 1; min-width: 0; }

.tc-bsheet-sub--line {
    display: flex;
    align-items: center;
    gap: 6px;
}

.tc-center { display: block; margin: 16px auto; }

/* Renommer la team dans l'en-tête */
.tc-name-edit {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.tc-name-input {
    flex: 1;
    min-width: 0;
    height: 42px;
    padding: 0 12px;
    border: 0;
    border-radius: var(--lgb-radius);
    background: rgba(255, 255, 255, 0.16);
    color: #FFFFFF;
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 26px;
    text-transform: uppercase;
    outline: none;
}

.tc-name-input:focus { box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6); }

/* Feuilles du bas : la fenêtre MudBlazor devient une feuille, son contenu défile entre l'en-tête et le pied */
.mud-dialog-container .mud-dialog.tc-sheet-dialog {
    width: 100%;
    max-width: 640px;
    margin: 0;
    border-radius: 16px 16px 0 0;
    overflow: hidden;
}

/* MudBlazor laisse 32 px sous les fenêtres du bas : la feuille, elle, touche le bord */
.mud-dialog-container.mud-dialog-bottomcenter:has(.tc-sheet-dialog) { padding-bottom: 0; }

.mud-dialog.tc-sheet-dialog .mud-dialog-content {
    padding: 0;
    margin: 0;
    overflow: hidden;
}

.tc-sheet-dialog .tc-bsheet {
    position: relative;
    max-height: 88dvh;
    box-shadow: none;
}

.tc-sheet-scroll {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0 -14px;
    padding: 0 14px 4px 14px;
    overflow-y: auto;
}

.tc-sheet-scroll > * { flex-shrink: 0; }
.tc-sheet-foot > .tc-cta { flex: 1; }

.tc-notice--alert { background: var(--lgb-red-soft); color: #7A1A14; }
.tc-notice--alert svg { color: #B3261E; }

/* Fenêtres plein écran : start-list, parcours guidé */
.mud-dialog.tc-full-dialog .mud-dialog-content {
    padding: 0;
    margin: 0;
    overflow: hidden;
}

.tc-startlist {
    height: 100dvh;
    background: var(--lgb-page);
    overflow: hidden;
}

.tc-startlist .tc-scroll {
    overflow-y: auto;
    padding-bottom: 12px;
}

.tc-startlist .tc-sheet-head > *,
.tc-startlist .tc-scroll > * {
    width: 100%;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}

.tc-startlist .tc-bsheet { max-height: 88%; }

.tc-bar--light {
    width: 96px;
    flex-shrink: 0;
    background: #DCD3FF;
}

.tc-bar--light span { background: var(--lgb-violet); }

.tc-list-head--start { padding-left: 54px; }

.tc-notes-legend--line {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 2px;
}

.tc-notes-legend--line svg { width: 13px; height: 13px; }

.tc-link--chip {
    height: 32px;
    padding: 0 4px;
    border: 0;
    background: none;
}

/* ---------- Remplacer les non-partants ---------- */

.tc-group-title--alert {
    display: block;
    margin: 0 0 2px 0;
    color: #B3261E;
}

.tc button.tc-check {
    width: 100%;
    border: 0;
    font-family: inherit;
    color: inherit;
    text-align: left;
}

.tc-check--off .tc-check-box {
    background: #FFFFFF;
    box-shadow: inset 0 0 0 1.5px #C9C4D3;
    color: transparent;
}

.tc-notice-jersey { width: 22px; height: 22px; flex-shrink: 0; object-fit: contain; }

.tc-notes-legend--center { text-align: center; }

.tc-sheet-foot--stack {
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
}

.tc-sheet-foot--stack > .tc-cta { flex: none; }
.tc-sheet-foot--stack > .tc-link { align-self: center; }

.tc .tc-menu-item--primary { color: var(--lgb-violet); }


/* ---------- Parcours guidé : le cadre plein écran ---------- */

.tc-wizard {
    height: 100dvh;
    background: var(--lgb-page);
    overflow: hidden;
}

.tc-wiz-head {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px 12px 12px 12px;
    background: var(--lgb-surface);
    border-bottom: 1px solid var(--lgb-line);
}

.tc-wiz-bar {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 36px;
    align-items: center;
}

.tc-wiz-title {
    margin: 0;
    text-align: center;
    font-family: 'LGB-Garaje', sans-serif;
    font-weight: 900;
    font-size: 22px;
    line-height: 1;
    text-transform: uppercase;
}

/* Barre d'étapes : verte une fois faite, violette en cours */
.tc-wiz-steps {
    display: grid;
    grid-template-columns: repeat(var(--steps, 3), minmax(0, 1fr));
    gap: 6px;
}

.tc-wiz-step {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    font-size: 11px;
    font-weight: 600;
    color: #8C869A;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-wiz-step::before {
    content: "";
    height: 4px;
    border-radius: 999px;
    background: #E4E1EA;
}

.tc-wiz-step--done { color: var(--lgb-ink-2); }
.tc-wiz-step--done::before { background: var(--lgb-green); }
.tc-wiz-step--current { color: var(--lgb-violet); }
.tc-wiz-step--current::before { background: var(--lgb-violet); }

/* Le contenu défile entre l'en-tête et le pied */
.tc-wizard .tc-wizard-body,
.tc-wizard .tc-matchsheet {
    overflow-y: auto;
    padding-bottom: 18px;
}

.tc-wizard .tc-wizard-body > *,
.tc-wizard .tc-matchsheet > :not(.tc-hero-star),
.tc-wiz-head > *,
.tc-wiz-foot > * {
    width: 100%;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}

.tc-wizard .tc-wizard-body > .tc-link--center { width: auto; }

.tc-wiz-foot {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 12px 16px 20px 16px;
    background: var(--lgb-surface);
    box-shadow: 0 -8px 20px -14px rgba(21, 18, 31, 0.35);
}

.tc-wiz-hint {
    font-size: 12px;
    line-height: 1.35;
    color: var(--lgb-ink-2);
    text-align: center;
}

/* Sur le fond de page, la recherche se détache en blanc */
.tc-wizard .tc-search {
    background: #FFFFFF;
    box-shadow: var(--lgb-shadow);
}

.tc-lead--after { margin-top: 6px; }
.tc-link--center { align-self: center; border: 0; background: none; padding: 4px 0; }

.tc-quiz-card .tc-eyebrow { color: var(--lgb-violet); }
.tc-quiz-card .tc-lead { margin: 0; }
.tc-tag--lg { height: 22px; padding: 0 10px; font-size: 12px; }

/* La feuille de match : grande étoile, grand nom, places du podium encore vides */
.tc-matchsheet .tc-hero-star {
    right: -50px;
    top: 60px;
    width: 220px;
    height: 220px;
}

.tc-team-name--xl { font-size: 34px; }

.tc-podium-todo {
    width: 46px;
    height: 46px;
    border: 1.5px dashed rgba(255, 255, 255, 0.45);
    border-radius: 50%;
}

.tc-podium-col .tc-podium-col-todo { color: #FFB4AB; }

/* Mon équipe : l'accès à la feuille de match depuis l'en-tête */
.tc-hero-link {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    height: 40px;
    padding: 0 10px 0 12px;
    border: 0;
    border-radius: var(--lgb-radius);
    background: rgba(255, 255, 255, 0.1);
    font-size: 13px;
    font-weight: 700;
    text-align: left;
}

.tc .tc-hero-link { color: #FFFFFF; }
.tc-hero-link > span { flex: 1; }
.tc-hero-link svg { width: 18px; height: 18px; }
.tc-hero-link svg:last-child { width: 16px; height: 16px; opacity: 0.7; }