/* ============================================================================
   panel/assets/modulos/torneos.css — lo que solo usa el módulo Torneos
   ============================================================================
   Se apoya en los tokens de marca.css y panel.css y en los componentes comunes
   (.caja, .btn, .pill, .chip, .tarjeta, .metrica, .pestana, .ayuda-*): no
   declara colores ni medidas de marca. Va en un archivo y no inyectado desde el
   JS, como el de Audiencia y el de Minimapa.

   NADA AQUÍ LLEVA `clip-path` NI BORDE BISELADO: lo que se ve con bisel es la
   `.caja` de cada tarjeta (receta común). Dentro, filas planas con filete de
   1 px: rectángulos sin recorte, así que el contorno nunca queda abierto en un
   chaflán. Sin caja dentro de caja: el espacio y una línea fina separan.
   ========================================================================== */

/* ── Iconos sueltos ──────────────────────────────────────────────────────── */
.trn-ico{display:inline-flex;flex:none;color:var(--texto-3)}
.trn-ico svg{width:1.1rem;height:1.1rem}
.trn-ico-grande svg{width:2.5rem;height:2.5rem}
.trn-ico-grande{color:var(--yellow);margin-bottom:var(--esp-2)}

/* ── La lista de torneos ─────────────────────────────────────────────────── */
.trn-rejilla{
  display:grid;gap:var(--esp-rejilla);align-items:start;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr));
}
.trn-rejilla > .tarjeta.es-editando{grid-column:1/-1}
.trn-archivados{margin-top:var(--esp-bloque)}
.trn-archivados > summary{
  cursor:pointer;color:var(--texto-2);font-size:var(--tipo-descripcion);
  padding:var(--esp-2) 0;margin-bottom:var(--esp-3);
}
.trn-archivados > summary:hover{color:var(--texto-1)}
.trn-archivados > summary:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}

/* Las dos pastillas de estado, una al lado de la otra y partiéndose si no caben
   (`.tarjeta-cuenta` es nowrap y con la letra de las cifras). */
.trn-cab-cuenta{display:flex;flex-wrap:wrap;gap:var(--esp-1)}
.trn-cab-cuenta .pill + .pill{margin-left:0}

.trn-slug{display:flex;align-items:center;gap:var(--esp-2);margin:0;min-width:0}
.trn-slug code,.trn-slug-chico{
  min-width:0;overflow-wrap:anywhere;font-size:var(--tipo-leyenda);color:var(--texto-2);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.trn-slug .btn-icono{--btn-sm-alto:2rem}

.trn-datos{display:grid;gap:var(--esp-2)}
.trn-dato{
  display:flex;align-items:flex-start;gap:var(--esp-2);margin:0;min-width:0;
  font-size:var(--tipo-descripcion);color:var(--texto-2);line-height:1.4;
}
.trn-dato .trn-ico{margin-top:.1rem}
.trn-dato span:last-child{min-width:0;overflow-wrap:anywhere}

/* Cuántos hay en cada estado: cada cifra es un botón que lleva a esos inscritos. */
.trn-cuentas{
  display:grid;gap:var(--esp-1);padding-top:var(--esp-3);border-top:1px solid var(--linea-suave);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.trn-cuenta{
  display:flex;align-items:baseline;gap:var(--esp-2);
  padding:var(--esp-2);margin:0;font-family:inherit;text-align:left;cursor:pointer;
  color:var(--texto-2);background:transparent;border:0;
  transition:background var(--t-rapido) var(--curva),color var(--t-rapido) var(--curva);
}
.trn-cuenta strong{
  font-family:var(--fuente-dato);font-weight:800;font-size:var(--tipo-dato);line-height:1;
  color:var(--texto-1);font-variant-numeric:tabular-nums;letter-spacing:var(--tracking-dato)
}
.trn-cuenta span{font-size:var(--tipo-leyenda);line-height:1.2}
.trn-cuenta:hover{background:var(--velo-2);color:var(--texto-1)}
.trn-cuenta:focus-visible{outline:2px solid var(--yellow);outline-offset:-2px}
.trn-cuenta-viva strong{color:var(--yellow)}

.trn-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-2)}
.trn-acciones .btn svg{width:1.1rem;height:1.1rem;margin-right:var(--esp-2);vertical-align:-.2em}

/* ── El formulario ───────────────────────────────────────────────────────── */
.trn-campos{
  display:grid;gap:var(--esp-4) var(--esp-rejilla);min-width:0;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,11rem),1fr));
}
.trn-campos > .ancho{grid-column:1/-1}
.trn-campo{position:relative}
.trn-rotulo{display:inline-flex;align-items:center;gap:var(--esp-2);flex-wrap:wrap;min-height:1.5rem}
.trn-campos{align-items:start}
/* El globo cuelga de la celda y no del rótulo: nunca se sale por la derecha. */
.trn-campo .ayuda-globo{top:1.9rem;width:max(100%,16rem);max-width:min(22rem,calc(100vw - 3rem))}
.trn-campo.der .ayuda-globo{left:auto;right:0}
.trn-ventana{grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr))}
.trn-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.trn-chips{display:flex;flex-wrap:wrap;gap:var(--esp-2)}

/* ── Los inscritos ───────────────────────────────────────────────────────── */
.trn-barra{display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-3);margin-bottom:var(--esp-rejilla)}
.trn-marcas{display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-2);min-width:0}
.trn-marcas .pill + .pill{margin-left:0}
.trn-herramientas{display:flex;align-items:center;gap:var(--esp-2);margin-left:auto}
.trn-chip-ayuda{position:relative;display:inline-flex;align-items:center;gap:var(--esp-2)}
.ayuda-globo.ayuda-derecha{left:auto;right:0}

.trn-filtro{margin-bottom:var(--esp-rejilla)}
.trn-inscripciones{display:flex;flex-direction:column;gap:var(--esp-rejilla)}

.trn-inscripcion{padding:0;min-width:0}
.trn-resumen{
  display:flex;align-items:center;gap:var(--esp-3);flex-wrap:wrap;
  padding:var(--esp-4) var(--esp-tarjeta);cursor:pointer;list-style:none;
}
.trn-resumen::-webkit-details-marker{display:none}
.trn-resumen:focus-visible{outline:2px solid var(--yellow);outline-offset:-4px}
.trn-tag{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em}
.trn-equipo{display:flex;flex-direction:column;flex:1 1 12rem;min-width:0}
.trn-equipo strong{
  font-family:var(--fuente-dato);font-weight:700;font-size:var(--tipo-dato);line-height:1.1;
  letter-spacing:calc(.01em + var(--tracking-dato));text-transform:uppercase;color:var(--texto-1);overflow-wrap:anywhere;
}
.trn-resumen-marcas{display:flex;flex-wrap:wrap;gap:var(--esp-1);align-items:center}
.trn-resumen-marcas .pill + .pill{margin-left:0}
.trn-chev{margin-left:auto}
.trn-chev svg{transition:transform var(--t-rapido) var(--curva)}
.trn-inscripcion[open] .trn-chev svg{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.trn-chev svg{transition:none}}

.trn-inscripcion-cuerpo{
  display:flex;flex-direction:column;gap:var(--esp-4);min-width:0;
  padding:var(--esp-3) var(--esp-tarjeta) var(--esp-tarjeta);
  border-top:1px solid var(--linea-suave);
}
.trn-pago{display:flex;align-items:flex-start;gap:var(--esp-2);margin:0;font-size:var(--tipo-descripcion);color:var(--texto-2);line-height:1.4}
.trn-pago .trn-ico{margin-top:.1rem}
.trn-pago span:last-child{min-width:0;overflow-wrap:anywhere}
.trn-motivo{color:var(--texto-1)}

.trn-plantilla{display:flex;flex-direction:column;gap:var(--esp-4);min-width:0}
.trn-nada{margin:0;color:var(--texto-3);font-size:var(--tipo-descripcion)}
.trn-grupo-t{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--esp-3);margin:0 0 var(--esp-1);
  font-size:var(--tipo-rotulo);font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--texto-3);
}
.trn-grupo-n{font-variant-numeric:tabular-nums;letter-spacing:.04em}
.trn-personas{margin:0;padding:0;list-style:none}
.trn-persona{
  display:grid;gap:var(--esp-2) var(--esp-4);align-items:center;
  grid-template-columns:minmax(13rem,1fr) minmax(0,1.6fr);
  padding:var(--esp-3) 0;border-top:1px solid var(--linea-suave);
}
.trn-persona:first-child{border-top:0}
@media (max-width:42rem){.trn-persona{grid-template-columns:minmax(0,1fr)}}
.trn-quien{display:flex;align-items:center;gap:var(--esp-3);min-width:0}
.trn-avatar{flex:none;width:2rem;height:2rem;border-radius:50%;object-fit:cover;background:var(--velo-2)}
.trn-avatar-ico{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--velo-2)}
.trn-avatar-ico svg{width:1.1rem;height:1.1rem}
.trn-nombre{display:flex;flex-direction:column;min-width:0;flex:0 1 auto}
.trn-nombre .dato-menor{margin-top:0}
.trn-nombre-l{display:flex;align-items:center;gap:var(--esp-2);min-width:0}
.trn-nombre-l strong{font-weight:500;color:var(--texto-1);overflow-wrap:anywhere}
.trn-capi{display:inline-flex;color:var(--yellow)}
.trn-capi svg{width:1rem;height:1rem}
.trn-copiar{--btn-sm-alto:2rem;flex:none}
.trn-pdatos{display:flex;flex-wrap:wrap;gap:var(--esp-2) var(--esp-5,1.5rem);min-width:0}
.trn-pdato{display:flex;flex-direction:column;gap:2px;min-width:0}
.trn-pdato-r{font-size:var(--tipo-rotulo);font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--texto-3)}
.trn-pdato-v{font-size:var(--tipo-descripcion);color:var(--texto-1);overflow-wrap:anywhere}
.trn-pmarcas{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:var(--esp-1)}
.trn-pmarcas .pill + .pill{margin-left:0}

/* ── Confirmar pago y rechazar ───────────────────────────────────────────── */
.trn-accion-zona{padding-top:var(--esp-3);border-top:1px solid var(--linea-suave)}
.trn-accion-panel[hidden],.trn-acciones[hidden]{display:none}
.trn-accion{display:flex;flex-direction:column;gap:var(--esp-3);min-width:0}
.trn-accion-t{margin:0;font-size:var(--tipo-cuerpo);color:var(--texto-1);line-height:1.4}
.trn-accion-nota{margin:0;font-size:var(--tipo-descripcion);color:var(--texto-2);line-height:1.5;max-width:62ch}
.trn-accion-pie{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--esp-2)}

@media (max-width:30rem){
  .trn-herramientas{margin-left:0}
  .trn-resumen{padding-inline:var(--esp-4)}
  .trn-inscripcion-cuerpo{padding-inline:var(--esp-4)}
}