/*
 * Portadas diseñadas en el sitio (destacados, lista de torneos, agenda/calendario y página del evento).
 *
 * 1) Nada encima de la portada: con una portada diseñada, el estado («Inscripción abierta», «En vivo»…), «empieza en…»,
 *    «Finalizado», «Estás anotado» y la fecha del calendario van debajo de la imagen, en la fila de etiquetas de la
 *    tarjeta (.has-state). Así el diseño se ve entero y como se armó, en cualquier pantalla.
 * 2) Portadas animadas: cover-anim.js pone encima las capas que publicó el diseñador (.cva-clip > .cva).
 */

/* ---------- etiquetas debajo de la portada ---------- */
.tf-kicker.has-state .tf-pill,
.tf-kicker.has-state .tf-when { -webkit-backdrop-filter: none; backdrop-filter: none; padding: .2rem .55rem; font-size: .7rem; }
.tf-kicker.has-state .tf-when { background: var(--surface-2); color: var(--text); box-shadow: inset 0 0 0 1px var(--border); }
.tf-kicker.has-state .tf-when.is-live { background: #dc2626; color: #fff; box-shadow: none; }
.tn-row-kicker.has-state .tn-mine-badge { margin-left: 0; }
.tn-row-kicker.has-state .done-ribbon,
.cal-card-tags.has-state .done-ribbon { font-size: .68rem; padding: .15rem .5rem; }
.cal-card-tags.has-state .cal-type { max-width: 100%; padding: .15rem .5rem; border-radius: var(--radius); background: var(--surface-2); color: var(--text); box-shadow: inset 0 0 0 1px var(--border); font-size: .72rem; }
.cal-date-chip { display: inline-flex; align-items: baseline; gap: .25rem; padding: .15rem .5rem; border-radius: var(--radius); background: var(--primary); color: var(--on-primary); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.cal-date-chip b { font-size: .9rem; }
/* la portada sin franjas oscuras ni degradados encima */
.tf-cover.is-designed::before, .tn-row-cover.is-designed::before, .cal-card-top.is-designed::before { background: none; }
.cal-card.is-done .cal-card-top.is-designed::before { -webkit-backdrop-filter: none; backdrop-filter: none; }
.cal-card.is-done .cal-card-top.is-designed { filter: grayscale(.6); }

/* página del evento: la portada entera, sin la ruta ni el degradado encima; la ruta va debajo (también en la compu) */
.tn-t-banner::after { display: none; }
.tn-t-hero.is-feature .tn-t-crumb-m { display: block; margin-bottom: .6rem; }
/* el encabezado recorta sin ser desplazable: con «hidden», saltar a #inscripcion (que está adentro) corría su contenido
   hacia arriba y la portada quedaba detrás del menú */
.tn-t-hero { overflow: hidden; overflow: clip; }
/* la tarjeta de inscripción (o del campeón) ya no sube sobre el borde de la portada */
@media (min-width: 900px) { .tn-t-hero.is-feature .tn-t-cta { margin-top: 0; } }

/* ---------- portadas animadas ---------- */
.cva-clip { position: absolute; z-index: 1; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity .18s ease; }
.cva-clip.is-on { opacity: 1; }
.cva { position: absolute; overflow: hidden; }   /* lo que entra o sale volando aparece y desaparece en el borde de la imagen, como en una diapositiva */
.cva-base, .cva-l { position: absolute; display: block; max-width: none; margin: 0; user-select: none; }
.cva-base { inset: 0; width: 100%; height: 100%; }
.cva-l { will-change: transform, opacity; backface-visibility: hidden; }
@media (prefers-reduced-motion: reduce) { .cva-clip { display: none; } }