/* Portal público del club (F9). Sin estilos inline (CSP style-src 'self').
   Colores del club en /web/tema.css (--club, --club-2, --club-rgb), generados desde la configuración.
   Barlow Condensed (OFL 1.1, BarlowCondensed-OFL.txt): la misma letra que las tarjetas para redes. */

@font-face { font-family: "Barlow Condensed"; src: url("../fonts/BarlowCondensed-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("../fonts/BarlowCondensed-ExtraBold.ttf") format("truetype"); font-weight: 800; font-display: swap; }

:root {
  --club: #0d6efd; --club-2: #ffffff; --club-rgb: 13, 110, 253;
  --pista: #0f2238;          /* noche de pabellón: fondo del marcador y del pie */
  --pista-2: #172f4c;
  --tinta: #13202e;
  --suave: #5b6878;
  --suelo: #eef1f4;          /* fondo de página, frío */
  --borde: #d6dce3;
  --gana: #1f9d55; --empata: #7b8794; --pierde: #d64545;
  --display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
}

.web-body { background: var(--suelo); color: var(--tinta); font-size: 1.0625rem; line-height: 1.55; }
.web-body a { color: inherit; text-decoration-color: rgba(var(--club-rgb), .5); text-underline-offset: .18em; }
.web-body a:hover { text-decoration-color: var(--club); }
:focus-visible { outline: 3px solid var(--club); outline-offset: 2px; }

.display, .web-body h1, .web-body h2, .web-body h3 { font-family: var(--display); font-weight: 800; letter-spacing: .005em; line-height: 1.05; }
.web-body h1 { font-size: clamp(2.1rem, 4.6vw, 3.4rem); }
.web-body h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.web-body h3 { font-size: 1.35rem; }

/* Cabecera */
.web-cabecera { background: #fff; border-bottom: 4px solid var(--club); }
.web-cabecera .navbar { padding-block: .6rem; }
.web-marca { display: flex; align-items: center; gap: .65rem; text-decoration: none; color: var(--tinta); }
.web-marca img { width: 48px; height: 48px; object-fit: contain; }
.web-marca .nombre { font-family: var(--display); font-weight: 800; font-size: 1.6rem; line-height: 1; }
.web-marca .lema { display: block; font-size: .82rem; color: var(--suave); font-weight: 400; font-family: system-ui, sans-serif; }
.web-nav .nav-link { font-family: var(--display); font-weight: 600; font-size: 1.2rem; color: var(--tinta); padding-inline: .8rem; }
.web-nav .nav-link.activo { color: var(--club); box-shadow: inset 0 -3px 0 var(--club); }
.web-body .btn-club { background: var(--club); border-color: var(--club); color: var(--club-2); font-weight: 600; }
.web-body .btn-club:hover, .web-body .btn-club:focus { background: var(--pista); border-color: var(--pista); color: #fff; }
.web-body .btn-linea { border: 2px solid var(--tinta); color: var(--tinta); font-weight: 600; background: transparent; }
.web-body .btn-linea:hover { background: var(--tinta); color: #fff; }

/* Marcador de pabellón (portada y ficha de equipo): lo memorable del portal */
.marcador-banda { background: var(--pista); color: #fff; position: relative; overflow: hidden; }
.marcador-banda::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .09;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 11.5rem, #fff 11.5rem 11.65rem, transparent 11.65rem),
    linear-gradient(90deg, transparent calc(50% - 1px), #fff calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)); }
.marcador-banda > .container { position: relative; }
.marcador { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; }
.marcador .equipo { display: flex; flex-direction: column; align-items: center; gap: .5rem; text-align: center; min-width: 0; }
.marcador .equipo img, .marcador .equipo .sin-escudo { width: 72px; height: 72px; object-fit: contain; }
.marcador .sin-escudo { border-radius: 50%; border: 2px solid rgba(255,255,255,.35); display: grid; place-items: center; font-family: var(--display); font-weight: 800; font-size: 1.6rem; }
.marcador .equipo .nom { font-family: var(--display); font-weight: 600; font-size: 1.35rem; line-height: 1.1; overflow-wrap: anywhere; }
.marcador .tanteo { font-family: var(--display); font-weight: 800; font-variant-numeric: tabular-nums; font-size: clamp(3.6rem, 10vw, 6.5rem); line-height: .9;
  display: flex; gap: .35em; align-items: center; color: #fff; }
.marcador .tanteo .sep { font-size: .45em; color: rgba(255,255,255,.45); }
.marcador .tanteo.vs { font-size: clamp(2.2rem, 6vw, 3.4rem); color: rgba(255,255,255,.7); }
.marcador-meta { color: rgba(255,255,255,.72); font-size: .95rem; text-align: center; }
.marcador-meta strong { color: #fff; font-weight: 600; }
.marcador-titulo { font-family: var(--display); font-weight: 600; font-size: 1.15rem; color: rgba(255,255,255,.75); text-align: center; margin-bottom: .75rem; }
.marcador-bloque + .marcador-bloque { border-top: 1px solid rgba(255,255,255,.14); }
@media (min-width: 992px) { .marcador-bloque + .marcador-bloque { border-top: 0; border-left: 1px solid rgba(255,255,255,.14); } }
.goleadores { color: rgba(255,255,255,.85); font-size: .95rem; text-align: center; }
.resultado-pill { display: inline-block; min-width: 1.6rem; padding: .05rem .4rem; border-radius: .3rem; font-family: var(--display); font-weight: 800; color: #fff; text-align: center; }
.resultado-pill.V { background: var(--gana); } .resultado-pill.E { background: var(--empata); } .resultado-pill.D { background: var(--pierde); }

.directo-aviso { background: var(--pierde); color: #fff; font-weight: 600; }
.directo-aviso a { color: #fff; }
.punto-vivo { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; background: #fff; margin-right: .4rem; animation: latido 1.4s ease-in-out infinite; }
@keyframes latido { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .punto-vivo { animation: none; } }

/* Noticias */
.noticia-lead { background: #fff; border-radius: .75rem; overflow: hidden; border: 1px solid var(--borde); }
.noticia-lead img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.noticia-lead .cuerpo { padding: 1.25rem 1.4rem 1.4rem; }
.noticia-lead h2 { font-size: clamp(1.7rem, 3.2vw, 2.4rem); margin: .35rem 0 .5rem; }
.noticia-fila { display: grid; grid-template-columns: 1fr 132px; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--borde); text-decoration: none; }
.noticia-fila:last-child { border-bottom: 0; }
.noticia-fila img { width: 132px; height: 88px; object-fit: cover; border-radius: .4rem; }
.noticia-fila h3 { font-size: 1.3rem; margin: .15rem 0 .25rem; }
.noticia-fila p { color: var(--suave); font-size: .95rem; margin: 0; }
@media (max-width: 575.98px) { .noticia-fila { grid-template-columns: 1fr 88px; } .noticia-fila img { width: 88px; height: 66px; } }
.categoria { font-size: .85rem; font-weight: 600; color: var(--club); }
.fecha { font-size: .85rem; color: var(--suave); }
.lista-noticias { background: #fff; border-radius: .75rem; border: 1px solid var(--borde); padding: 0 1.25rem; }

.articulo { background: #fff; border-radius: .75rem; border: 1px solid var(--borde); }
.articulo .portada { width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: 520px; object-fit: cover; border-radius: .75rem .75rem 0 0; display: block; }
.articulo .texto { padding: 1.5rem clamp(1.1rem, 4vw, 3rem) 2rem; }
.articulo .texto-cuerpo { max-width: 68ch; font-size: 1.1rem; line-height: 1.7; }
.articulo .texto-cuerpo h2 { margin-top: 2rem; }
.articulo .texto-cuerpo h3 { margin-top: 1.5rem; }
.articulo .entradilla { font-size: 1.25rem; color: var(--suave); max-width: 60ch; }

/* Barra lateral y agenda */
.lateral-caja { background: #fff; border-radius: .75rem; border: 1px solid var(--borde); padding: 1.1rem 1.25rem; }
.lateral-caja h2 { font-size: 1.5rem; margin-bottom: .75rem; }
.fecha-bloque { width: 3.4rem; flex: 0 0 3.4rem; text-align: center; border: 2px solid var(--tinta); border-radius: .4rem; line-height: 1; padding: .3rem 0; }
.fecha-bloque .d { font-family: var(--display); font-weight: 800; font-size: 1.7rem; display: block; }
.fecha-bloque .m { font-size: .8rem; display: block; }
.agenda-item { display: flex; gap: .85rem; align-items: center; padding: .6rem 0; text-decoration: none; }
.agenda-item + .agenda-item { border-top: 1px solid var(--borde); }
.agenda-item .t { font-weight: 600; line-height: 1.25; }
.agenda-item .s { color: var(--suave); font-size: .9rem; }
.agenda-item.partido .fecha-bloque { border-color: var(--club); color: var(--club); }
.agenda-item.cancelado .t { text-decoration: line-through; }

.alta-caja { background: var(--club); color: var(--club-2); border-radius: .75rem; padding: 1.25rem; }
.alta-caja h2 { color: var(--club-2); }
.web-body .alta-caja .btn { background: var(--club-2); color: var(--club); border: 0; font-weight: 700; }

/* Resultados / calendario por día */
.dia-titulo { font-family: var(--display); font-weight: 600; font-size: 1.25rem; margin: 1.5rem 0 .5rem; }
.partido-fila { display: grid; grid-template-columns: 4.2rem 1fr auto; gap: .75rem; align-items: center; background: #fff; border: 1px solid var(--borde);
  border-radius: .6rem; padding: .7rem 1rem; margin-bottom: .5rem; }
.partido-fila .hora { font-family: var(--display); font-weight: 600; font-size: 1.2rem; }
.partido-fila .cruce { font-weight: 600; line-height: 1.25; min-width: 0; }
.partido-fila .cruce small { display: block; font-weight: 400; color: var(--suave); }
.tanteo-mini { font-family: var(--display); font-weight: 800; font-size: 1.6rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.estado-chip { font-size: .8rem; font-weight: 600; padding: .1rem .45rem; border-radius: .3rem; background: var(--suelo); color: var(--suave); white-space: nowrap; }

/* Equipos */
.equipo-tarjeta { display: flex; align-items: center; gap: .9rem; background: #fff; border: 1px solid var(--borde); border-left: 6px solid var(--club);
  border-radius: .6rem; padding: .9rem 1rem; text-decoration: none; height: 100%; }
.equipo-tarjeta img { width: 44px; height: 44px; object-fit: contain; }
.equipo-tarjeta .n { font-family: var(--display); font-weight: 800; font-size: 1.45rem; line-height: 1; }
.equipo-tarjeta .c { color: var(--suave); font-size: .9rem; }
.tabla-clasif { font-variant-numeric: tabular-nums; }
.tabla-clasif th { font-weight: 600; color: var(--suave); font-size: .85rem; }
.tabla-clasif tr.propio td { background: rgba(var(--club-rgb), .1); font-weight: 600; }
.plantilla-dorsal { font-family: var(--display); font-weight: 800; font-size: 1.4rem; width: 2.4rem; display: inline-block; color: var(--club); }

/* Paginación y filtros */
.filtros a { text-decoration: none; padding: .3rem .8rem; border-radius: 2rem; border: 1px solid var(--borde); background: #fff; display: inline-block; margin: 0 .3rem .4rem 0; font-size: .95rem; }
.filtros a.activo { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.migas { font-size: .9rem; color: var(--suave); }
.migas a { color: var(--suave); }

/* Pie */
.web-pie { background: var(--pista); color: rgba(255,255,255,.78); margin-top: 3rem; }
.web-pie a { color: #fff; }
.web-pie .display { color: #fff; font-size: 1.5rem; }

/* Alta (asistente público) */
.alta-pasos { display: flex; gap: .35rem; margin-bottom: 1.25rem; }
.alta-pasos span { flex: 1; height: 6px; border-radius: 3px; background: var(--borde); }
.alta-pasos span.hecho { background: var(--club); }
.perfil-opcion { display: block; border: 2px solid var(--borde); border-radius: .75rem; padding: 1rem 1.1rem; cursor: pointer; }
.perfil-opcion:has(input:checked) { border-color: var(--club); background: rgba(var(--club-rgb), .06); }
.perfil-opcion .t { font-family: var(--display); font-weight: 800; font-size: 1.4rem; }
.menor-bloque { border: 1px solid var(--borde); border-radius: .6rem; padding: 1rem; margin-bottom: 1rem; background: #fff; }
.campo-trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media print { .web-cabecera, .web-pie, .alta-caja { display: none; } }

.escudo-equipo { width: 80px; height: 80px; object-fit: contain; background: #fff; border-radius: 50%; padding: 6px; }
.marcador-equipo { max-width: 640px; }