/* ============================================================
   smgr · css/pages/records.css — estilos SOLO de records.php
   (tokens en css/tokens.css; componentes base en css/rincon.css)
   Récords ACB en directo: tabla de dos grupos (máximos de carrera |
   partido actual) con resalte de récord nuevo / igualado.
   ============================================================ */

/* ---------- Cabecera de página ---------- */
.records-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: var(--sp-3); margin-top: var(--sp-4); flex-wrap: wrap;
}
.records-head h1 {
  font-family: var(--score); font-size: 26px; font-weight: 700;
  letter-spacing: .01em; color: var(--ink); margin-top: 2px;
}
.records-head .sub { font-size: 13px; color: var(--muted); max-width: 46ch; }
.records-head__status { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }

/* Punto/pulse "en juego" (mismo lenguaje que directo) */
.dlive-dot {
  width: 9px; height: 9px; border-radius: 50%; background: var(--down);
  box-shadow: 0 0 0 0 rgba(192, 58, 46, .5); animation: recPulse 1.6s infinite;
}
.dlive-txt { font-size: 12px; font-weight: 600; color: var(--down); }
@keyframes recPulse {
  0%   { box-shadow: 0 0 0 0 rgba(192, 58, 46, .5); }
  70%  { box-shadow: 0 0 0 7px rgba(192, 58, 46, 0); }
  100% { box-shadow: 0 0 0 0 rgba(192, 58, 46, 0); }
}
@media (prefers-reduced-motion: reduce) { .dlive-dot { animation: none; } }

/* ---------- Barra de leyenda + filtro ---------- */
.records-bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--sp-3); margin-top: var(--sp-4);
}
.records-legend { display: inline-flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap; }
.records-legend .lg { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); font-weight: 600; }
.lg-dot { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.lg-dot--new  { background: var(--up); }
.lg-dot--tied { background: var(--accent); }

/* Filtro: reutiliza el segmented .seg (definido en broker.css/rincon). Aquí solo
   ajustamos su comportamiento cuando hay muchas opciones en móvil. */
.records-filter { flex-wrap: wrap; }

/* Segmented local (por si .seg no estuviera cargado desde otra página) */
.records-filter.seg {
  display: inline-flex; background: var(--ground);
  border: 1px solid var(--line); border-radius: var(--r-pill); padding: 2px;
}
.records-filter.seg a {
  font-size: 12px; font-weight: 600; padding: 5px 12px;
  border-radius: var(--r-pill); color: var(--muted); white-space: nowrap;
}
.records-filter.seg a:hover { color: var(--ink); }
.records-filter.seg a.is-active { background: var(--ink); color: #fff; }
.records-filter.seg a:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }

.records-note { margin-top: var(--sp-3); font-size: 12.5px; color: var(--muted); font-style: italic; }

/* ---------- Tabla: thead de DOS filas sticky + 1.ª columna sticky ---------- */
.records-section { margin-top: var(--sp-4); }
.records-wrap {
  position: relative; overflow: auto; max-height: 74vh;
  border-radius: var(--r-card);
}
.records-table { min-width: 900px; }
.records-table th, .records-table td { text-align: right; }

/* Fila de grupos (arriba) y fila de columnas (abajo). Ambas sticky, la segunda
   desplazada la altura de la primera (34px). */
.records-table thead .rec-grouprow th { top: 0; height: 34px; z-index: 5; }
.records-table thead .rec-statrow th  { top: 34px; z-index: 4; }

.rec-grp {
  text-align: center; font-size: 10.5px; font-weight: 700;
  letter-spacing: .08em; color: #fff;
}
.rec-grp--record  { background: #223250; }
.rec-grp--current { background: var(--accent-deep); }

/* Separador entre los dos grupos de seis columnas */
.records-table th.rec-sep, .records-table td.rec-sep {
  border-left: 2px solid var(--line);
}
.records-table thead th.rec-sep { border-left-color: rgba(255, 255, 255, .35); }

/* Columna Jugador sticky a la izquierda */
.records-table th.stick-1, .records-table td.stick-1 {
  position: sticky; left: 0; text-align: left; min-width: 210px;
  box-shadow: 4px 0 8px -4px rgba(19, 28, 46, .14);
}
.records-table th.stick-1 { z-index: 6; background: var(--ink); }
.records-table td.stick-1 { z-index: 2; background: var(--surface); }
.records-table tbody tr:nth-child(even) td.stick-1 { background: var(--zebra); }
.records-table tbody tr:hover td.stick-1 { background: var(--hover); }
/* Esquina superior izquierda (cruce de la fila de grupos con la col sticky) */
.records-table th.rec-corner { background: var(--ink); min-width: 210px; }

/* Celda de jugador: escudo + nombre + botón de detalle */
.records-table td.stick-1 .player-cell { gap: 8px; min-width: 0; }
.rec-name { color: var(--ink); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.rec-name:hover { color: var(--accent-deep); }
.rec-info {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--muted); cursor: pointer;
}
.rec-info:hover { background: var(--accent-soft); color: var(--accent-deep); }
.rec-info:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }

/* Máximos de carrera: números discretos. Partido actual: protagonistas. */
.records-table td.rec-acb { color: var(--muted); font-weight: 500; }
.records-table td.rec-cur { color: var(--ink); font-weight: 700; }

/* Resalte de récord en la celda del partido actual */
.rec-new  { background: var(--up-tint) !important; color: var(--up) !important; }
.rec-tied { background: var(--accent-soft) !important; color: var(--accent-deep) !important; }
.records-table tbody tr:hover td.rec-new  { background: #dbeee6 !important; }
.records-table tbody tr:hover td.rec-tied { background: rgba(240, 162, 60, .26) !important; }

/* Chips inline dentro de la nota al pie */
.rec-inline {
  display: inline-block; padding: 1px 7px; border-radius: var(--r-pill);
  font-size: 11px; font-weight: 700; font-style: normal;
}
.records-note-foot { margin-top: var(--sp-3); font-size: 12.5px; }

/* ---------- Estado sin récords ---------- */
.records-empty {
  margin-top: var(--sp-4); padding: var(--sp-6) var(--sp-5); text-align: center;
}
.records-empty h2 { font-family: var(--score); font-size: 22px; font-weight: 700; color: var(--ink); }
.records-empty p { margin: var(--sp-2) auto 0; max-width: 52ch; font-size: 14px; color: var(--muted); }
.records-empty__links { display: inline-flex; gap: var(--sp-3); margin-top: var(--sp-4); flex-wrap: wrap; justify-content: center; }

/* ---------- Móvil ---------- */
@media (max-width: 640px) {
  .records-head h1 { font-size: 22px; }
  .records-table { font-size: 12px; min-width: 720px; }
  .records-table th, .records-table td { padding: 6px 7px; }
  .records-table th.stick-1, .records-table td.stick-1, .records-table th.rec-corner { min-width: 148px; }
}