/* Historique des maillots du club */
.tnk-mai__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.tnk-mai__btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 18px; border-radius: 999px; border: 1px solid #daf37c; background: #daf37c; color: #0a0c0f; font: 700 .95rem 'Barlow', system-ui, sans-serif; cursor: pointer; text-decoration: none; }
.tnk-mai__btn i { font-size: 1.2rem; }
.tnk-mai__btn--ghost { background: transparent; color: #fff; border-color: #2a2e36; }
.tnk-mai__btn--ghost:hover { border-color: #daf37c; color: #daf37c; }
.tnk-mai__btn--danger:hover { border-color: #c25151; color: #e38585; }
.tnk-mai__vide { display: flex; align-items: center; gap: 10px; padding: 32px; border: 1px dashed #2a2e36; border-radius: 14px; color: #9da1a8; }
.tnk-mai__vide i { font-size: 1.8rem; color: #daf37c; }

/* Frise : une ligne verticale, un maillot par étape */
.tnk-mai__frise { position: relative; list-style: none; margin: 0; padding: 0 0 0 28px; display: grid; gap: 28px; }
.tnk-mai__frise::before { content: ''; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(#daf37c, #1d2026); border-radius: 2px; }
.tnk-mai__item { position: relative; scroll-margin-top: 90px; }
.tnk-mai__item::before { content: ''; position: absolute; left: -27px; top: 6px; width: 14px; height: 14px; border-radius: 50%; background: #0a0c0f; border: 3px solid #daf37c; }
.tnk-mai__periode { display: inline-block; margin-bottom: 10px; font-family: 'Big Shoulders Display', 'Arial Narrow', sans-serif; font-weight: 900; font-size: 1.6rem; line-height: 1; color: #daf37c; text-transform: uppercase; }

.tnk-mai__carte { display: grid; grid-template-columns: minmax(220px, 340px) 1fr; gap: 24px; padding: 20px; border: 1px solid #1d2026; border-radius: 18px; background: #0d0f13; }
.tnk-mai__carte.is-actuel { border-color: rgba(218, 243, 124, .45); background: radial-gradient(90% 120% at 0% 0%, rgba(218, 243, 124, .07), transparent 60%), #0d0f13; }

/* Retournement devant / dos */
.tnk-mai__visuel { position: relative; display: block; width: 100%; padding: 0; border: 0; background: radial-gradient(closest-side, rgba(255, 255, 255, .06), transparent); border-radius: 14px; cursor: pointer; perspective: 1200px; color: inherit; }
.tnk-mai__visuel[disabled] { cursor: default; }
.tnk-mai__faces { display: grid; transition: transform .7s cubic-bezier(.2, .7, .2, 1); transform-style: preserve-3d; }
.tnk-mai__visuel.is-dos .tnk-mai__faces { transform: rotateY(180deg); }
.tnk-mai__face { grid-area: 1 / 1; display: grid; place-items: center; aspect-ratio: 1; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.tnk-mai__face--dos { transform: rotateY(180deg); }
.tnk-mai__face img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 14px 22px rgba(0, 0, 0, .45)); }
.tnk-mai__tourner { position: absolute; left: 50%; bottom: 6px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: rgba(10, 12, 15, .75); border: 1px solid #2a2e36; color: #fff; font: 600 .82rem 'Barlow', system-ui, sans-serif; white-space: nowrap; backdrop-filter: blur(4px); }
.tnk-mai__visuel:hover .tnk-mai__tourner, .tnk-mai__visuel:focus-visible .tnk-mai__tourner { border-color: #daf37c; color: #daf37c; }
.tnk-mai__visuel:focus-visible { outline: 2px solid #daf37c; outline-offset: 4px; }

.tnk-mai__infos { display: flex; flex-direction: column; gap: 10px; align-self: center; min-width: 0; }
.tnk-mai__etiquettes { display: flex; gap: 8px; flex-wrap: wrap; }
.tnk-mai__type, .tnk-mai__actuel { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; border: 1px solid #2a2e36; color: #c9ccd1; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.tnk-mai__actuel { border-color: rgba(218, 243, 124, .45); color: #daf37c; background: rgba(218, 243, 124, .1); }
.tnk-mai .tnk-mai__infos h2 { margin: 0; font-size: 2rem; }
.tnk-mai__dates { display: flex; align-items: center; gap: 6px; margin: 0; color: #9da1a8; }
.tnk-mai__dates i { color: #daf37c; font-size: 1.1rem; }
.tnk-mai__dates strong { color: #fff; }
.tnk-mai__bilan { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.tnk-mai__bilan div { display: flex; flex-direction: column; align-items: center; min-width: 58px; padding: 8px 10px; border: 1px solid #1d2026; border-radius: 10px; background: #0a0c0f; }
.tnk-mai__bilan strong { font-family: 'Big Shoulders Display', 'Arial Narrow', sans-serif; font-weight: 900; font-size: 1.6rem; line-height: 1; color: #fff; }
.tnk-mai__bilan strong.v { color: #daf37c; }
.tnk-mai__bilan strong.d { color: #e38585; }
.tnk-mai__bilan span { color: #6b6f77; font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.tnk-mai__note { color: #6b6f77; font-size: .78rem; }
.tnk-mai__admin { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.tnk-mai__admin form { margin: 0; }

/* Formulaire (admin) */
.tnk-mai__dialogue { width: min(560px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #2a2e36; border-radius: 18px; background: #0d0f13; color: #fff; font-family: 'Barlow', system-ui, sans-serif; }
.tnk-mai__dialogue::backdrop { background: rgba(0, 0, 0, .7); }
.tnk-mai__dialogue form { display: flex; flex-direction: column; gap: 14px; padding: 24px; }
.tnk-mai__dialogue h2 { margin: 0; font-family: 'Big Shoulders Display', 'Arial Narrow', sans-serif; font-weight: 800; font-size: 1.7rem; text-transform: uppercase; }
.tnk-mai__ligne { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tnk-mai__champ { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tnk-mai__champ span { color: #9da1a8; font-size: .82rem; font-weight: 700; }
.tnk-mai__champ small { font-weight: 400; }
.tnk-mai__champ input, .tnk-mai__champ select { height: 42px; box-sizing: border-box; padding: 0 12px; border: 1px solid #2a2e36; border-radius: 10px; background: #0a0c0f; color: #fff; font: 500 .95rem 'Barlow', system-ui, sans-serif; }
.tnk-mai__champ input:focus, .tnk-mai__champ select:focus { outline: none; border-color: #daf37c; }
.tnk-mai__fichier { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px; border: 1px dashed #3a3f47; border-radius: 12px; background: #0a0c0f; cursor: pointer; text-align: center; }
.tnk-mai__fichier:hover { border-color: #daf37c; }
.tnk-mai__apercu { display: grid; place-items: center; width: 100%; aspect-ratio: 1; max-height: 150px; margin-bottom: 6px; }
.tnk-mai__apercu img { max-width: 100%; max-height: 150px; object-fit: contain; }
.tnk-mai__apercu i { font-size: 3.4rem; color: #2a2e36; }
.tnk-mai__fichier small { color: #daf37c; font-weight: 600; }
.tnk-mai__aide { margin: 0; color: #9da1a8; font-size: .84rem; line-height: 1.45; }
.tnk-mai__aide b { color: #fff; }
.tnk-mai__case { display: flex; align-items: center; gap: 8px; font-weight: 600; cursor: pointer; }
.tnk-mai__case input { width: 18px; height: 18px; accent-color: #daf37c; }
.tnk-mai__actions { display: flex; justify-content: flex-end; gap: 10px; }

@media (max-width: 720px) {
    .tnk-mai__carte { grid-template-columns: 1fr; padding: 16px; gap: 14px; }
    .tnk-mai__visuel { max-width: 300px; margin: 0 auto; }
    .tnk-mai .tnk-mai__infos h2 { font-size: 1.6rem; }
    .tnk-mai__ligne { grid-template-columns: 1fr; }
    .tnk-mai__ligne:has(.tnk-mai__fichier) { grid-template-columns: 1fr 1fr; }
}
/* Maillot caché (vu seulement par l'admin) */
.tnk-mai__carte.is-cache .tnk-mai__visuel { opacity: .45; }
.tnk-mai__cache { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; border: 1px dashed #6b6f77; color: #9da1a8; font-size: .75rem; font-weight: 700; }
