/* =============================================================================
   Tuerka Ticket — panel del organizador (DESIGN.md § 6–7.2).
   Referencia aprobada: design/referencia-d2/D2-Resumen.dc.html y vecinas.
   Mobile-first: el organizador opera desde el celular el día del evento.
   ========================================================================== */

/* Encabezado. Celular: logo + Salir / organizador / pestañas.
   Desktop: logo · organizador · pestañas · sesión, en una fila. */
.panel-cabecera { border-bottom: 1px solid var(--linea); }
.panel-cabecera .wrap-panel {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; padding-top: 16px;
}
.panel-cabecera .logo { order: 1; }
.panel-cabecera .logo .nombre { white-space: nowrap; }
.panel-sesion { order: 2; margin-left: auto; display: flex; align-items: center; gap: 20px; font-size: 15px; color: var(--niebla); }
.panel-sesion form { margin: 0; }
.panel-sesion .usuario { max-width: 40vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.panel-sesion button {
  background: none; border: 0; padding: 8px 0; font: inherit; font-size: 15px; color: var(--bruma);
  text-decoration: underline; text-underline-offset: 4px; cursor: pointer;
}
.panel-sesion button:hover { color: var(--luz); }
.panel-org { order: 3; width: 100%; font-size: 17px; font-weight: 700; padding-top: 4px; }

/* Pestañas: texto, y bajo la activa una barra aguamarina (la idea de .raya) */
.dock { order: 4; width: 100%; display: flex; gap: 28px; overflow-x: auto; }
.dock a {
  display: inline-flex; align-items: center; min-height: 52px; color: var(--bruma);
  text-decoration: none; font-size: 17px; white-space: nowrap; border-bottom: 3px solid transparent;
}
.dock a:hover { color: var(--luz); }
.dock a[aria-current="page"] { color: var(--luz); font-weight: 700; border-bottom-color: var(--aguamarina); }

@media (min-width: 900px) {
  .panel-cabecera .wrap-panel { flex-wrap: nowrap; padding-top: 0; }
  .panel-org { order: 2; width: auto; padding-top: 0; }
  .dock { order: 3; width: auto; margin-left: auto; align-self: stretch; }
  .dock a { min-height: 84px; }
  .panel-sesion { order: 4; margin-left: 8px; }
  .panel-sesion .usuario { display: inline; }
}

/* Contenido */
.panel-main { padding: 32px 0 64px; }
/* El panel es herramienta: titulares contenidos (32–40px), no vitrina */
.panel-titulo { font-size: clamp(30px, 4vw, 40px); line-height: 1; }
.panel-sub { margin-top: 14px; }
.panel-seccion { margin-top: 40px; }
.panel-seccion h2 { font-size: 24px; font-weight: 800; margin-bottom: 16px; }

/* Tablas (DESIGN.md § 6.8) */
.tabla-scroll { overflow-x: auto; }
.tabla { width: 100%; border-collapse: collapse; font-size: 17px; }
.tabla th { font-size: 15px; color: var(--bruma); font-weight: 600; text-align: left; padding: 0 12px 12px; }
.tabla td { padding: 18px 12px; border-top: 1px solid var(--linea); vertical-align: middle; }
.tabla tr:hover td { background: var(--panel-3); }
.tabla .codigo { font-family: var(--mono); font-size: 15px; color: var(--bruma); }
.tabla .fecha { color: var(--bruma); white-space: nowrap; }
.ocultar-movil { display: none; }
@media (min-width: 900px) { .ocultar-movil { display: table-cell; } }

/* Celular: cada fila es una ficha (nombre y estado arriba, fecha debajo), sin
   scroll lateral que esconda el estado. */
@media (max-width: 899px) {
  .tabla thead { display: none; }
  .tabla tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 16px 12px; border-top: 1px solid var(--linea); }
  .tabla tbody tr:first-child { border-top: 0; }
  .tabla td { display: block; padding: 0; border: 0; }
  .tabla td.fecha { grid-row: 2; grid-column: 1; white-space: normal; }
  .tabla td:last-child { grid-row: 1; grid-column: 2; }
  .tabla td.ocultar-movil { display: none; }
  .tabla tr:hover td { background: none; }
}

/* Estado vacío */
.vacio { padding: 32px 24px; text-align: center; }
.vacio p { color: var(--bruma); max-width: 520px; margin: 8px auto 0; }

/* Acceso (login y verificación): una tarjeta centrada */
.acceso { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.acceso .card { width: 100%; max-width: 440px; padding: 32px 28px; display: flex; flex-direction: column; gap: 20px; }
.acceso h1 { font-size: 36px; line-height: .95; }
.acceso .org { color: var(--bruma); margin-top: -8px; }
.acceso form { display: flex; flex-direction: column; gap: 16px; }
.acceso .btn { width: 100%; }
.aviso { padding: 16px; border-radius: var(--r-input); font-size: 16px; line-height: 1.5; }
.aviso-info { background: var(--aguamarina-10); color: var(--luz); border: 1px solid var(--aguamarina); }
.aviso-error { background: var(--rojo-10); color: var(--luz); border: 1px solid var(--rojo); }

/* Próximo evento */
.proximo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; }
.proximo .dias { text-align: left; }
@media (min-width: 900px) { .proximo .dias { text-align: right; } }

/* Próximo evento como titular del Resumen */
.proximo-dias { color: var(--aguamarina); }
.proximo-meta { margin-top: 14px; font-size: 18px; color: var(--bruma); }

/* Editor de eventos: formularios sobrios, una columna en celular */
.volver { color: var(--bruma); text-decoration: none; font-size: 16px; }
.volver:hover { color: var(--luz); }
.editor-cabeza { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin: 16px 0 24px; }
.editor-estado { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin-top: 12px; font-size: 16px; }
.editor-estado a, .panel-ayuda a { color: var(--aguamarina); }
.panel-ayuda { color: var(--bruma); max-width: 72ch; margin: -4px 0 16px; font-size: 16px; }
.form-pila { display: flex; flex-direction: column; gap: 18px; }
.form-pila > .btn { align-self: flex-start; }
.form-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 900px) {
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.ayuda { font-size: 15px; color: var(--niebla); }
textarea.input { min-height: 0; padding: 12px 16px; line-height: 1.5; resize: vertical; }
input[type="file"].input { padding: 12px; }
.card h3 { font-size: 18px; font-weight: 800; }
.fila-quitar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--linea); font-size: 17px; }
.fila-quitar small { display: block; font-size: 15px; color: var(--bruma); }
.fila-agregar { display: flex; gap: 8px; }
.enlace { background: none; border: 0; padding: 8px 0; font: inherit; font-size: 15px; color: var(--bruma); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.enlace:hover { color: var(--rojo); }
.afiche-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
@media (min-width: 700px) { .afiche-form { grid-template-columns: 200px minmax(0, 1fr); } }
.afiche-vista img, .afiche-vacio { width: 200px; max-width: 100%; aspect-ratio: 4 / 5; height: auto; object-fit: cover; border-radius: var(--r-tile); border: 1px solid var(--linea-2); }
.afiche-vacio { display: flex; align-items: flex-end; padding: 16px; background: var(--panel-2); font-size: 24px; line-height: 1; overflow: hidden; }
.matriz th[scope="row"] { font-size: 17px; color: var(--luz); white-space: nowrap; }
.matriz td { min-width: 180px; }
.matriz td .input + .input { margin-top: 8px; }
.campo-opcion { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; padding: 12px 0; border-bottom: 1px solid var(--linea); font-size: 17px; }
.campo-opcion label { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; }
.campo-opcion .secundario { font-size: 15px; color: var(--bruma); }
.campo-opcion textarea { flex-basis: 100%; }
.campo-opcion input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--aguamarina); }
.btn-nuevo { margin-top: 16px; }
.seccion-cabeza { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.seccion-cabeza h2 { margin-bottom: 0; }
.fila-enlace { color: var(--luz); font-weight: 700; text-decoration: none; }
.fila-enlace:hover { color: var(--aguamarina); text-decoration: underline; text-underline-offset: 4px; }
/* Mientras el campo no está activo, "Obligatorio" y sus opciones no aportan */
.campo-opcion:has(> label:first-child input:not(:checked)) > .secundario,
.campo-opcion:has(> label:first-child input:not(:checked)) > textarea { display: none; }

/* Inscritos */
.kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 24px 0; max-width: 640px; }
.kpis div { display: flex; flex-direction: column; gap: 4px; padding: 18px; border: 1px solid var(--linea); border-radius: var(--r-card); background: var(--panel); }
.kpis span, .kpis small { font-size: 15px; color: var(--bruma); }
.kpis b { font-size: 40px; font-weight: 900; font-stretch: 125%; line-height: 1; font-variant-numeric: tabular-nums; }
.kpis b.pendiente { color: var(--ambar); }
.filtros { display: flex; flex-wrap: wrap; gap: 24px; margin: 8px 0 20px; border-bottom: 1px solid var(--linea); }
.filtros a { display: inline-flex; align-items: center; min-height: 48px; color: var(--bruma); text-decoration: none; font-size: 17px; border-bottom: 3px solid transparent; }
.filtros a:hover { color: var(--luz); }
.filtros a[aria-current="page"] { color: var(--luz); font-weight: 700; border-bottom-color: var(--aguamarina); }
.inscritos { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.inscritos li { display: flex; flex-direction: column; gap: 12px; }
.insc-cabeza { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.insc-cabeza b { display: block; font-size: 19px; }
.insc-cabeza .codigo { font-family: var(--mono); font-size: 15px; color: var(--aguamarina); }
.insc-datos { font-size: 16px; line-height: 1.6; color: var(--bruma); overflow-wrap: anywhere; }
.tenue { color: var(--niebla); }
.insc-confirmar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: end; padding-top: 12px; border-top: 1px solid var(--linea); }
@media (min-width: 900px) { .insc-confirmar { grid-template-columns: 220px minmax(0, 1fr) auto; } }
.codigo-enlace { font-family: var(--mono); font-size: 15px; color: var(--aguamarina); overflow-wrap: anywhere; }
.badge-anulado { color: var(--niebla); }
.enlace-modo { color: var(--bruma); font-size: 15px; text-align: center; text-underline-offset: 4px; }
.enlace-modo:hover { color: var(--luz); }
.fila-enlace.normal { font-weight: 400; color: var(--bruma); }
.panel-sesion a.usuario { color: var(--bruma); text-decoration: none; }
.panel-sesion a.usuario:hover, .panel-sesion a.usuario[aria-current="page"] { color: var(--luz); text-decoration: underline; text-underline-offset: 4px; }
.banner-vista { display: block; width: 100%; max-width: 600px; height: auto; border-radius: var(--r-tile); border: 1px solid var(--linea-2); }
.galeria-admin { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.galeria-admin li { display: flex; flex-direction: column; gap: 4px; }
.galeria-admin img { width: 100%; aspect-ratio: 1; height: auto; object-fit: cover; border-radius: var(--r-tile); border: 1px solid var(--linea-2); }

/* Cobros */
@media (min-width: 900px) { .form-grid.cobros { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
.cobro-cabeza { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; }
.cobro-cabeza h2 { font-size: 22px; font-weight: 800; }
.metodos { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
.metodos legend { font-size: 15px; font-weight: 600; color: var(--bruma); margin-bottom: 8px; }
.metodos label { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 17px; }
.metodos input { width: 20px; height: 20px; accent-color: var(--aguamarina); }
.pistas { margin: 0; display: flex; flex-direction: column; }
.pistas div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--linea); font-size: 16px; }
.pistas dt { color: var(--bruma); }
.pistas dd { margin: 0; }

/* Tablero del evento (DEMO.md E1) */
.kpis.kpis-4 { max-width: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .kpis.kpis-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.kpis b.dinero { font-size: clamp(16px, 4.2vw, 30px); white-space: nowrap; letter-spacing: -.02em; }
.kpis div { min-width: 0; }
.kpis .track { margin-top: 8px; }
/* Celular: los últimos 7 días; desde 900 px, los 14 */
.barras { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; height: 240px; align-items: end; }
.barras li:nth-child(-n+7) { display: none; }
.barras li { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 6px; min-width: 0; }
.barras .barra { width: 100%; border-radius: 6px 6px 0 0; background: var(--panel-4); }
.barras .pico .barra { background: var(--luz); }
.barras .hoy .barra { background: var(--aguamarina); }
.barras .valor { font-size: 15px; font-variant-numeric: tabular-nums; color: var(--bruma); }
.barras .hoy .valor { color: var(--luz); font-weight: 700; }
.barras .dia { font-size: 15px; color: var(--niebla); white-space: nowrap; }
.barras .dia .num { display: none; }
@media (min-width: 900px) {
  .barras { grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 10px; height: 260px; }
  .barras li:nth-child(-n+7) { display: flex; }
  .barras .dia .num { display: inline; }
}
@media (min-width: 900px) { .form-grid.tablero-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
.tablero-grid .panel-seccion { margin-top: 32px; }
.tabla .dinero, .reparto .dinero { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.tabla tr.fija { display: table-row; }
.tabla tr.fija th, .tabla tr.fija td { display: table-cell; padding: 14px 12px; border-top: 1px solid var(--linea); }
.tabla tr.fija th { text-align: left; font-weight: 700; color: var(--luz); }
.reparto { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.reparto li { display: grid; grid-template-columns: 104px minmax(0, 1fr) 40px auto; align-items: center; gap: 10px; font-size: 16px; }
.reparto b { text-align: right; font-variant-numeric: tabular-nums; }
.tallas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; }
.tallas li { display: flex; flex-direction: column; gap: 2px; padding: 12px; border: 1px solid var(--linea); border-radius: var(--r-tile); }
.tallas b { font-size: 28px; font-weight: 900; font-stretch: 125%; line-height: 1; }
.tallas span { font-size: 15px; color: var(--bruma); }
.acciones-fila { display: flex; flex-wrap: wrap; gap: 12px; }

/* Búsqueda de inscritos y ficha */
.buscar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.buscar .input { flex: 1 1 260px; min-width: 0; }
@media (min-width: 900px) { .form-grid.ficha { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
.ficha h2 { font-size: 20px; font-weight: 800; margin-bottom: 8px; }
.ficha .pistas dd { text-align: right; overflow-wrap: anywhere; }

/* Cabecera y pestañas del evento (E12) */
.evento-cabecera { display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; }
.evento-cabecera .panel-titulo { margin-top: 4px; }
.evento-tabs { display: flex; gap: 28px; overflow-x: auto; border-bottom: 1px solid var(--linea); margin-top: 8px; scrollbar-width: none; }
.evento-tabs a { display: inline-flex; align-items: center; gap: 8px; min-height: 52px; color: var(--bruma); text-decoration: none; font-size: 17px; white-space: nowrap; border-bottom: 3px solid transparent; }
.evento-tabs a:hover { color: var(--luz); }
.evento-tabs a[aria-current="page"] { color: var(--luz); font-weight: 700; border-bottom-color: var(--aguamarina); }
.evento-tabs .contador { font-size: 15px; font-weight: 700; color: var(--ambar); font-variant-numeric: tabular-nums; }
/* Sub-pestañas de Configuración (E18): segunda fila, más baja que la principal */
.config-tabs { display: flex; gap: 8px 24px; overflow-x: auto; scrollbar-width: none; margin: 4px 0 20px; border-bottom: 1px solid var(--linea-2); }
.config-tabs a { display: inline-flex; align-items: center; min-height: 44px; color: var(--bruma); text-decoration: none; font-size: 16px; white-space: nowrap; border-bottom: 2px solid transparent; }
.config-tabs a:hover { color: var(--luz); }
.config-tabs a[aria-current="page"] { color: var(--luz); font-weight: 700; border-bottom-color: var(--aguamarina); }
.publicar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px; padding: 16px 20px; border: 1px solid var(--linea); border-radius: var(--r-card); background: var(--panel); margin-bottom: 16px; }
.publicar .panel-ayuda { margin: 0; }
.publicar form { margin: 0; }

/* Fichas de eventos (E8): afiche a la izquierda, cifras a la derecha; toda la ficha abre el tablero */
.fichas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 900px) { .fichas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ficha { position: relative; display: flex; gap: 20px; padding: 16px; border: 1px solid var(--linea); border-radius: var(--r-card); background: var(--panel); transition: transform var(--dur-2) var(--ease); }
.ficha:hover { transform: translateY(-2px); }
.ficha:hover .ficha-enlace { color: var(--aguamarina); }
.ficha-afiche { flex: none; width: 112px; aspect-ratio: 4 / 5; height: auto; object-fit: cover; border-radius: var(--r-tile); border: 1px solid var(--linea-2); }
@media (min-width: 900px) { .ficha-afiche { width: 132px; } }
.ficha-sin { display: flex; align-items: flex-end; padding: 12px; background: var(--panel-3); color: var(--aguamarina); font-size: 36px; line-height: 1; }
.ficha-cuerpo { display: flex; flex-direction: column; gap: 8px; min-width: 0; flex: 1; }
.ficha-estado { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 15px; color: var(--bruma); }
.ficha h3 { font-size: 20px; line-height: 1.2; }
.ficha-enlace { color: var(--luz); text-decoration: none; }
.ficha-enlace::after { content: ""; position: absolute; inset: 0; border-radius: var(--r-card); }   /* toda la ficha es el enlace */
.ficha-fecha { font-size: 15px; color: var(--bruma); }
.ficha-cifras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 4px 0 0; }
.ficha-cifras div:nth-child(3) { grid-column: 1 / -1; }
@media (min-width: 1200px) { .ficha-cifras { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ficha-cifras div:nth-child(3) { grid-column: auto; } }
.ficha-cifras dt { font-size: 15px; color: var(--bruma); }
.ficha-cifras dd { margin: 0; font-size: 19px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ficha-cifras dd.pendiente { color: var(--ambar); }
.ficha-aforo { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; font-size: 15px; color: var(--bruma); }
.ficha-atajos { position: relative; z-index: 1; display: flex; gap: 20px; margin-top: auto; padding-top: 4px; font-size: 15px; }
.ficha-atajos a { color: var(--bruma); text-underline-offset: 4px; }
.ficha-atajos a:hover { color: var(--luz); }
.ficha-nueva { align-items: center; justify-content: center; min-height: 180px; border-style: dashed; background: transparent; }
.ficha-nueva .ficha-enlace { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 18px; font-weight: 700; color: var(--bruma); }
.ficha-nueva .x { font-size: 44px; color: var(--aguamarina); line-height: 1; }
.atenuadas .ficha { opacity: .7; }
.kpis b.dinero.pendiente { color: var(--ambar); }

/* Inscritos (E11): búsqueda, filtros plegables, chips, totales, lista densa con detalle */
.filtrar { display: flex; flex-direction: column; gap: 12px; margin-bottom: 12px; }
.filtros-avanzados { border: 1px solid var(--linea); border-radius: var(--r-card); background: var(--panel); }
.filtros-avanzados summary { cursor: pointer; padding: 14px 18px; font-size: 16px; font-weight: 700; color: var(--bruma); list-style: none; }
.filtros-avanzados summary::-webkit-details-marker { display: none; }
.filtros-avanzados summary::after { content: " +"; color: var(--aguamarina); }
.filtros-avanzados[open] summary::after { content: " −"; }
.filtros-avanzados > :not(summary) { padding: 0 18px; }
.filtros-avanzados > p:last-child { padding-bottom: 18px; }
.filtros-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 12px; }
@media (min-width: 900px) { .filtros-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; } }
.columnas { border: 0; margin: 16px 0 0; padding: 0 18px; display: flex; flex-wrap: wrap; gap: 4px 20px; }
.columnas legend { font-size: 15px; font-weight: 600; color: var(--bruma); margin-bottom: 6px; }
.columnas label { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; font-size: 16px; }
.columnas input { width: 18px; height: 18px; accent-color: var(--aguamarina); }
.chips-activos { list-style: none; margin: 4px 0 12px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chips-activos a { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 12px; border: 1px solid var(--aguamarina); border-radius: var(--r-btn); color: var(--luz); text-decoration: none; font-size: 15px; }
.chips-activos a:hover { background: var(--aguamarina-10); }
.chips-activos a span { color: var(--aguamarina); font-size: 18px; }
.chips-activos .quitar-todo { border-color: var(--linea-2); color: var(--bruma); }
.totales-filtro { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 24px; padding: 14px 0; border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); margin-bottom: 12px; font-size: 16px; color: var(--bruma); }
.totales-filtro b { color: var(--luz); font-variant-numeric: tabular-nums; }
.totales-filtro .pend b { color: var(--ambar); }
.totales-filtro .enlace-excel { margin-left: auto; color: var(--bruma); font-size: 15px; text-underline-offset: 4px; }
.lote { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 8px; font-size: 15px; color: var(--bruma); }
.lote .input { width: auto; min-height: 44px; }

.lista { border: 1px solid var(--linea); border-radius: var(--r-card); background: var(--panel); overflow: hidden; }
.lista-cabeza, .lista summary { display: grid; grid-template-columns: var(--grid); gap: 12px; align-items: center; }
.lista-cabeza { padding: 12px 16px 12px 52px; font-size: 15px; font-weight: 600; color: var(--bruma); border-bottom: 1px solid var(--linea); }
.lista-cabeza > span:first-child { display: none; }
.lista-item { position: relative; border-bottom: 1px solid var(--linea); }
.lista-item:last-child { border-bottom: 0; }
.lista-item .sel { position: absolute; left: 16px; top: 16px; z-index: 1; display: flex; }
.lista-item .sel input { width: 20px; height: 20px; accent-color: var(--aguamarina); }
.lista summary { padding: 12px 16px 12px 52px; cursor: pointer; list-style: none; font-size: 16px; grid-template-columns: var(--grid); }
.lista summary::-webkit-details-marker { display: none; }
.lista summary > span:first-child { grid-column: 2; }
.lista summary:hover { background: var(--panel-3); }
.lista details[open] summary { background: var(--panel-2); }
.lista summary small { display: block; font-size: 15px; color: var(--niebla); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lista summary .nombre, .lista summary .boleta { min-width: 0; }
.lista summary .nombre b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lista summary .num { font-size: 15px; color: var(--aguamarina); }
.lista summary .valor { font-size: 15px; }
.lista summary .fecha, .lista summary .doc { font-size: 15px; color: var(--bruma); }
.lista-cabeza, .lista summary { grid-template-columns: var(--grid); }
.lista-cabeza { grid-template-columns: var(--grid); }
.detalle { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 16px 16px 20px 52px; background: var(--panel-2); border-top: 1px solid var(--linea); }
@media (min-width: 1100px) { .detalle { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } }
.detalle-datos { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px 20px; }
.detalle-datos dt { font-size: 15px; color: var(--bruma); }
.detalle-datos dd { margin: 2px 0 0; font-size: 16px; overflow-wrap: anywhere; }
.detalle-acciones { display: flex; flex-direction: column; gap: 12px; }
.confirmar-rapido { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 14px; border: 1px solid var(--linea); border-radius: var(--r-input); }
.confirmar-rapido .valor-confirmar, .confirmar-rapido .btn { grid-column: 1 / -1; }
.valor-confirmar { font-size: 16px; color: var(--bruma); }
.valor-confirmar b { color: var(--luz); font-size: 20px; }
.paginas { display: flex; justify-content: center; align-items: center; gap: 24px; margin-top: 16px; font-size: 16px; color: var(--bruma); }
.paginas a { color: var(--aguamarina); text-underline-offset: 4px; }
.lista-cabeza > span:nth-child(2) { grid-column: 2; }

/* Celular: cada fila es una tarjeta compacta (nombre, número, estado y valor) */
@media (max-width: 899px) {
  .lista-cabeza { display: none; }
  .lista summary { grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 14px 14px 14px 48px; }
  .lista summary > span { grid-column: auto; }
  .lista summary .num { order: 2; grid-column: 1; }
  .lista summary .nombre { order: 1; grid-column: 1; }
  .lista summary > span:has(.badge) { order: 1; grid-column: 2; grid-row: 1; justify-self: end; }
  .lista summary .valor { order: 2; grid-column: 2; justify-self: end; }
  .lista summary .doc, .lista summary .boleta, .lista summary .fecha, .lista summary .col { display: none; }
  .lista-item .sel { left: 14px; top: 18px; }
  .detalle { padding: 14px; }
  .confirmar-rapido { grid-template-columns: minmax(0, 1fr); }
  .totales-filtro .enlace-excel { margin-left: 0; }
}
@media (max-width: 899px) { .detalle-datos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Ficha del inscrito (E13): principal = quién es; lateral = pago, notas, historial */
.ficha-titulo { display: flex; flex-direction: column; gap: 8px; margin: 8px 0 16px; }
.ficha-titulo h2 { font-size: clamp(26px, 3.4vw, 36px); line-height: 1; }
.ficha-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
@media (min-width: 1000px) { .ficha-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); } }
.ficha-principal, .ficha-lateral { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ficha-grid h3 { font-size: 20px; font-weight: 800; margin-bottom: 12px; }
.editar { margin-top: 16px; border-top: 1px solid var(--linea); padding-top: 12px; }
.editar summary { cursor: pointer; font-size: 16px; font-weight: 700; color: var(--aguamarina); min-height: 40px; display: flex; align-items: center; }
.editar form { margin-top: 12px; }
.linea-tiempo { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; }
.linea-tiempo li { padding: 12px 0 12px 16px; border-left: 2px solid var(--linea-2); position: relative; font-size: 16px; }
.linea-tiempo li::before { content: ""; position: absolute; left: -6px; top: 18px; width: 10px; height: 10px; border-radius: 50%; background: var(--aguamarina); }
.linea-tiempo li.tenue::before { background: var(--linea-2); }
.linea-tiempo small { display: block; margin-top: 4px; font-size: 15px; color: var(--niebla); }
.nota-form { gap: 10px; }
.nota-form .btn { align-self: flex-start; }

/* Pagos y cuadre (E14) */
.filtros-pagos { margin-bottom: 4px; }
.tabla tr.total th, .tabla tr.total td { font-weight: 800; border-top: 2px solid var(--linea-2); }
.tabla td small, .tabla th small { display: block; font-size: 15px; color: var(--niebla); }
.pagos-tabla .fecha { white-space: nowrap; }
@media (max-width: 899px) {
  .pagos-tabla thead { display: table-header-group; }
  .tabla.pagos-tabla tr.fija, .cuadre-dia .tabla tr.fija { display: table-row; }
  .tabla-scroll { overflow-x: auto; }
}
.cuadre-dia th[scope="row"] { white-space: nowrap; }
@media (min-width: 900px) { .form-grid.tablero-grid:has(#t-metodo) { grid-template-columns: minmax(0, 560px); } }

/* Agregar inscrito: taquilla y cortesía (E15) */
.paso-form { border: 1px solid var(--linea); margin: 0; display: flex; flex-direction: column; gap: 12px; }
.paso-form legend { float: left; width: 100%; margin-bottom: 12px; font-size: 20px; font-weight: 800; }
.opciones-grandes { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
@media (min-width: 900px) { .opciones-grandes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.opcion { display: flex; gap: 12px; align-items: flex-start; padding: 16px; border: 1px solid var(--linea-2); border-radius: var(--r-input); cursor: pointer; }
.opcion input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--aguamarina); flex: none; }
.opcion b { display: block; font-size: 18px; }
.opcion small { display: block; font-size: 15px; color: var(--bruma); margin-top: 2px; }
.opcion:has(input:checked) { border: 2px solid var(--aguamarina); }
.taquilla:not(:has(input[name="modo"][value="pago"]:checked)) .solo-pago { display: none; }
.taquilla:has(input[name="modo"][value="cortesia"]:checked) .solo-con-cobro { display: none; }
.etapas-enlaces { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 16px; color: var(--bruma); }
.etapas-enlaces a { color: var(--bruma); }
.etapas-enlaces a[aria-current] { color: var(--luz); font-weight: 700; text-decoration-color: var(--aguamarina); }
.ev-tipos { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.ev-tipo { display: flex; align-items: center; gap: 14px; min-height: 56px; padding: 0 16px; border: 1px solid var(--linea-2); border-radius: var(--r-input); cursor: pointer; font-size: 17px; }
.ev-tipo span { flex: 1; }
.ev-tipo b { font-family: var(--mono); }
.ev-tipo input { width: 20px; height: 20px; accent-color: var(--aguamarina); }
.ev-tipo:has(input:checked) { border: 2px solid var(--aguamarina); }
.ev-consentimiento { display: flex; gap: 12px; align-items: flex-start; font-size: 16px; color: var(--bruma); }
.ev-consentimiento input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--aguamarina); }
.taquilla .error, .ficha-grid .error { font-size: 15px; color: var(--rojo); }
.acciones-tabla { white-space: nowrap; }
.acciones-tabla a { color: var(--aguamarina); margin-right: 12px; }
.acciones-tabla form { display: inline; }

/* Tablero con rango y gráficas (E9) */
.rango { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 24px 0 4px; }
.rango .filtros { margin: 0; border-bottom: 0; }
.rango-otro { display: flex; flex-wrap: wrap; gap: 8px; }
.rango-otro .input { width: auto; min-height: 44px; }
.barras-rango { grid-template-columns: repeat(var(--n), minmax(0, 1fr)); }
.barras-rango li:nth-child(-n+7) { display: flex; }
.barras-rango .dia { font-size: 15px; }
@media (max-width: 899px) { .barras-rango { gap: 2px; } .barras-rango .valor { font-size: 15px; } .barras-rango .dia { display: none; } }
.embudo { width: 100%; height: auto; max-height: 280px; display: block; }
.embudo polygon { fill: var(--panel-4); stroke: var(--linea-2); }
.embudo .embudo-1 { fill: var(--aguamarina-10); stroke: var(--aguamarina); }
.embudo-num { fill: var(--luz); font: 900 40px var(--fuente); font-stretch: 125%; }
.embudo-txt { fill: var(--bruma); font: 600 22px var(--fuente); }
.embudo-tasas { display: flex; flex-wrap: wrap; gap: 8px 32px; margin: 12px 0; }
.embudo-tasas dt { font-size: 15px; color: var(--bruma); }
.embudo-tasas dd { margin: 0; font-size: 24px; font-weight: 800; }
.acumulado { width: 100%; height: 220px; display: block; }
.acumulado .grilla { stroke: var(--linea); stroke-width: 1; vector-effect: non-scaling-stroke; }
.acumulado polyline { fill: none; stroke-width: 3; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.acumulado .linea-insc { stroke: var(--aguamarina); }
.acumulado .linea-pago { stroke: var(--luz); }
.leyenda { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 10px; font-size: 15px; }
.leyenda .l-insc::before, .leyenda .l-pago::before { content: ""; display: inline-block; width: 14px; height: 3px; margin-right: 8px; vertical-align: middle; }
.leyenda .l-insc::before { background: var(--aguamarina); }
.leyenda .l-pago::before { background: var(--luz); }
.calor { border-collapse: separate; border-spacing: 3px; width: 100%; min-width: 620px; font-size: 15px; table-layout: fixed; }
.calor th[scope="row"], .calor thead th:first-child { width: 52px; }
.calor th { color: var(--bruma); font-weight: 600; text-align: left; padding: 2px 4px; }
.calor td { width: 22px; height: 22px; padding: 0; background: var(--panel-3); border-radius: 4px; }
.calor td span { display: block; width: 100%; height: 22px; border-radius: 4px; background: var(--aguamarina); }
.sub { font-size: 17px; font-weight: 800; margin: 18px 0 10px; }
.ultimos { list-style: none; margin: 0; padding: 0; }
.ultimos li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 0; border-bottom: 1px solid var(--linea); font-size: 16px; }
.ultimos li:last-child { border-bottom: 0; }
.ultimos small { grid-column: 1 / -1; font-size: 15px; color: var(--niebla); }

/* Comunicación (E16) */
@media (min-width: 1000px) { .form-grid.comunicacion { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); align-items: start; } }
.h-card { font-size: 22px; font-weight: 800; }
.previa-asunto { display: flex; flex-direction: column; gap: 2px; font-size: 17px; font-weight: 700; padding-bottom: 12px; border-bottom: 1px solid var(--linea); margin-bottom: 12px; }
.previa-asunto span { font-size: 15px; font-weight: 600; color: var(--bruma); }
.previa-cuerpo { font-size: 16px; line-height: 1.6; color: var(--bruma); background: var(--panel-2); border: 1px solid var(--linea); border-radius: var(--r-input); padding: 16px; max-height: 420px; overflow: auto; overflow-wrap: anywhere; }

/* Aliados (E19): logo sobre placa clara (o oscura si el logo es claro), datos y acciones */
.aliados-nivel { margin: 24px 0 12px; font-size: 18px; }
.aliados-nivel small { color: var(--niebla); font-weight: 400; font-size: 15px; margin-left: 6px; }
.aliados-admin { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.aliados-admin li { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 12px 20px; align-items: center; padding: 16px; }
.aliados-admin li.inactivo .aliado-logo { opacity: .45; }
.aliados-admin .acciones-tabla { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; white-space: normal; }
.aliados-admin .acciones-tabla a { margin-right: 0; }
@media (min-width: 900px) {
  .aliados-admin li { grid-template-columns: 160px minmax(0, 1fr) auto; }
  .aliados-admin .acciones-tabla { grid-column: auto; justify-content: flex-end; }
}
.aliado-logo { display: grid; place-items: center; height: 88px; padding: 12px; border-radius: var(--r-tile); background: var(--luz); color: var(--noche); font-weight: 700; text-align: center; }
.aliado-logo.oscuro { background: var(--noche); color: var(--luz); border: 1px solid var(--linea-2); }
.aliado-logo img { max-width: 100%; max-height: 64px; width: auto; height: auto; object-fit: contain; }
.aliado-datos { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 16px; }
.aliado-datos span { color: var(--bruma); }
.aliado-datos a { color: var(--aguamarina-link); overflow-wrap: anywhere; }
.aliado-datos .badge { align-self: flex-start; }
.check { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 16px; }
.check input { width: 20px; height: 20px; accent-color: var(--aguamarina); }
.quitar-aliado { margin-top: 8px; }
.enlace.peligro { color: var(--rojo); }
