/* ── Equipos page ──────────────────────────────────────────────────────────── */

.uec-equipos-page {
  color: var(--uec-black);
  background: var(--uec-light-100);
}

/* Anchor target for tabs: positions the nav just below the sticky header */
#uec-equipos {
  scroll-margin-top: calc(var(--site-header-height) + var(--site-header-offset) + 1.5rem);
}

/* ── Tab nav wrapper ──────────────────────────────────────────────────────── */
.uec-equipos-tabs__nav-wrapper {
  padding-top: 4rem;
  background: var(--uec-light-100);
}

/* Override margin-bottom from .uec-news-filter; panels own their own spacing */
.uec-equipos-tabs__nav {
  margin-bottom: 0;
}

/* ── Tab panels ───────────────────────────────────────────────────────────── */
.uec-equipos-panel {
  padding-top: 2.75rem;
  padding-bottom: var(--section-padding);
  background: var(--uec-light-100);
}

.uec-equipos-panel[hidden] {
  display: none;
}

/* ── Player grid: columnas configurables desde el admin ───────────────────── */
.uec-equipos-player-grid {
  display: grid;
  grid-template-columns: repeat(var(--uec-equipos-cols, 5), minmax(0, 1fr));
  gap: clamp(0.75rem, 1.75vw, 1.375rem);
  align-items: start;
}

/* ── Academy / Insercor: colores en fondo claro ───────────────────────────── */

/* El club page usa fondo oscuro; aquí el fondo es claro, hay que sobreescribir */
.uec-equipos-panel--sections .uec-club-info__text h2 {
  color: var(--uec-black);
}

.uec-equipos-panel--sections .uec-club-info__copy p {
  color: var(--uec-dark-400);
}

/* Primer artículo sin margen superior extra */
.uec-equipos-panel--sections .uec-club-info:first-child {
  margin-top: 0;
}

/* ── Player grid: border-radius proporcional al ancho de la carta ─────────── */

/*
 * En el grid de 3 columnas, la carta mide ~437px → radius 24px = ~5.5% del ancho.
 * En el grid de 5 columnas, la carta mide ~250px → radius 24px = ~9.6% (demasiado).
 * Usamos 16px como valor intermedio proporcional para 5 columnas.
 */
.uec-equipos-player-grid .uec-player-card-flip {
  --player-card-radius: 16px;
  --uec-card-position-compact-height: clamp(0.875rem, 7cqw, 2.45rem);
}

.uec-equipos-player-grid .uec-player-card-flip::after {
  display: none;
}

/* ── Player grid: fuentes responsive para 5 columnas ─────────────────────── */

/*
 * Las fuentes de la carta usan clamp(min-rem, Xcqw, max-rem).
 * En 5 columnas (~250px), el valor cqw cae por debajo del mínimo rem,
 * causando texto sobredimensionado respecto a la carta.
 * Bajamos los mínimos para que el valor cqw tome efecto.
 */
.uec-equipos-player-grid .uec-player-card__name-big {
  font-size: clamp(0.9rem, 8.45cqw, 3.15rem);
}

.uec-equipos-player-grid .uec-player-card__name-small {
  font-size: clamp(0.42rem, 3.8cqw, 1.35rem);
}

.uec-equipos-player-grid .uec-player-card__position {
  font-size: clamp(0.38rem, 3.30cqw, 1.1rem);
}

.uec-equipos-player-grid .uec-player-card__side-meta {
  font-size: clamp(0.42rem, 3.8cqw, 1.38rem);
  width: clamp(1.75rem, 15cqw, 5.25rem);
}

.uec-equipos-player-grid .uec-player-card__number-label {
  font-size: clamp(0.32rem, 2.65cqw, 1rem);
}

.uec-equipos-player-grid .uec-player-card__number {
  font-size: clamp(0.55rem, 4.7cqw, 1.8rem);
}

/* ── Responsive ────────────────────────────────────────────────────────────── */

@media (max-width: 1024px) {
  .uec-equipos-player-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .uec-equipos-tabs__nav-wrapper {
    padding-top: 3rem;
  }
}

@media (max-width: 767px) {
  .uec-equipos-tabs__nav-wrapper {
    padding-top: 2.25rem;
  }

  .uec-equipos-panel {
    padding-top: 2rem;
  }

  /* Horizontal scroll on mobile, mirrors home-player-grid behaviour */
  .uec-equipos-player-grid {
    display: flex;
    gap: 12px;
    margin-inline: calc(var(--container-padding) * -1);
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 calc(var(--container-padding) * 0.75) 10px;
    scroll-padding-inline: calc(var(--container-padding) * 0.75);
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
    touch-action: pan-x pan-y;
    -webkit-overflow-scrolling: touch;
  }

  .uec-equipos-player-grid::-webkit-scrollbar {
    display: none;
  }

  .uec-equipos-player-grid .uec-player-card-flip {
    flex: 0 0 min(82vw, 340px);
    scroll-snap-align: start;
  }

  /* Disable reveal animation inside horizontal scroll on mobile */
  .uec-equipos-player-grid .uec-player-card-flip.uec-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  /* Stack academy/insercor sections vertically */
  .uec-equipos-panel--sections .uec-club-info {
    grid-template-columns: 1fr;
  }

  .uec-equipos-panel--sections .uec-club-info--reverse {
    direction: ltr;
  }
}
