/* ═══════════════════════════════════════════════════════════
   YouPlanFit · Design System V2 — Grupo F: cuenta / privacidad
   ═══════════════════════════════════════════════════════════
   Requiere design-v2-tokens.css y design-v2-components.css cargados
   antes. Ver ACCOUNT_PRIVACY_V2_MAP.md para el inventario completo.

   El diálogo de cuenta (#sesionCaja) YA está migrado (Grupo A, en
   design-v2-components.css) — aquí solo se pule su <details> de
   privacidad. Lo que faltaba de verdad en esta superficie eran dos
   cosas: la barra de cookies (#consent, todavía con tokens V1) y el
   registro de entrenos con las tarjetas de Garmin/Apple (#entrenos,
   sin migrar). Ambas viven aquí, cada una escopada a su id — nunca una
   clase pelada como .chip, .btn o .card a secas (esas se usan sin
   migrar en el resto de app.html).

   Cero cambios de HTML/JS. track.js sigue generando el mismo DOM de
   #consent con los mismos ids/data-consent que lee su propio JS;
   entrenos.js sigue generando el mismo DOM de .fuente y .gform con los
   mismos data-g. No se toca ninguna lógica de auth, consentimiento,
   persistencia ni analítica — ver la lista de "fuera de alcance" en el
   mapa antes de añadir nada aquí.
   ═══════════════════════════════════════════════════════════ */

/* ── F-1 · Diálogo de cuenta — pulido del desplegable de privacidad ──
   El shell (.sesion, .sesion__panel, .sesion .btn/.field) ya es V2.
   Solo se afina la transición de abrir/cerrar el <details> y el foco,
   sin tocar el texto legal (es contrato publicado, no copy de diseño). */
#sesionCaja .sesion__datos summary{
  transition:color var(--v2-dur) var(--v2-curva);
  border-radius:6px;
}
#sesionCaja .sesion__datos summary:hover{color:var(--v2-cyan2)}
#sesionCaja .sesion__datos summary:focus-visible{
  outline:2.5px solid var(--v2-cyan);outline-offset:3px;
}
#sesionCaja .sesion__datos summary::after{
  display:inline-block;transition:transform var(--v2-dur) var(--v2-curva);
}
#sesionCaja .sesion__datos[open] summary::after{transform:rotate(0deg)}

/* ══════════════════════════════════════════════════════════
   F-2 · #entrenos — registro + servicios conectados (Garmin/Apple)
   ══════════════════════════════════════════════════════════ */
#entrenos{
  position:relative;padding:70px 0;overflow:hidden;
  background:
    radial-gradient(circle at 85% 0%,rgba(19,185,231,.06),transparent 32%),
    linear-gradient(180deg,var(--v2-bg),var(--v2-bg2) 65%,var(--v2-bg));
  color:var(--v2-text);
}
#entrenos .shead .tag{
  display:inline-block;color:#81dff8;font-size:.68rem;letter-spacing:.2em;
  font-weight:700;text-transform:uppercase;margin:0 0 14px;
}
#entrenos .shead h2{
  font-family:var(--v2-display);color:var(--v2-text);
  letter-spacing:-.02em;line-height:1.05;font-size:clamp(1.9rem,4vw,2.8rem);
  margin:0 0 14px;
}
#entrenos .shead h2 i{color:var(--v2-cyan2);font-style:normal}
#entrenos .shead p{color:var(--v2-muted)}
#entrenos .ent-cargando{color:var(--v2-muted)}

/* Tarjetas de servicios conectados — el color de estado (apagado/activo)
   sigue siendo la señal principal, igual que en V1, solo con tokens V2. */
#entrenos .fuente{
  background:linear-gradient(180deg,rgba(18,39,52,.9),rgba(8,23,32,.94));
  border:1px solid rgba(90,184,222,.18);border-left:3px solid rgba(90,184,222,.18);
  border-radius:16px;box-shadow:var(--v2-sombra-sm),inset 0 1px rgba(255,255,255,.04);
}
#entrenos .fuente--on{
  border-left-color:var(--v2-cyan);box-shadow:0 0 0 1px rgba(19,185,231,.15),var(--v2-sombra-sm);
}
#entrenos .fuente__icono{color:var(--v2-muted)}
#entrenos .fuente--on .fuente__icono{color:var(--v2-cyan2)}
#entrenos .fuente__logo{box-shadow:0 0 0 1px rgba(90,184,222,.3)}
#entrenos .fuente__cab b{color:var(--v2-text)}
#entrenos .fuente__luz{color:var(--v2-muted);border-color:var(--v2-line)}
#entrenos .fuente--on .fuente__luz{color:var(--v2-cyan2);border-color:var(--v2-cyan)}
#entrenos .fuente__dato{color:var(--v2-text)}
#entrenos .fuente__nota{color:var(--v2-muted)}
#entrenos .fuente__acciones .chip{
  background:rgba(10,25,33,.7);border:1px solid var(--v2-line);color:var(--v2-text);
}
#entrenos .fuente__acciones .chip:hover{border-color:var(--v2-cyan);color:var(--v2-cyan2)}

/* Formulario "Conectar Garmin" — pide una contraseña de terceros: el
   aviso de qué se hace con ella tiene que seguir siendo lo primero que
   se lee, ver ACCOUNT_PRIVACY_V2_MAP.md riesgo 11. */
#entrenos .gform{
  background:linear-gradient(180deg,rgba(18,39,52,.95),rgba(8,23,32,.97));
  border:1px solid rgba(90,184,222,.24);border-radius:18px;
  box-shadow:var(--v2-sombra-sm),inset 0 1px rgba(255,255,255,.05);
  color:var(--v2-text);
}
#entrenos .gform h4{font-family:var(--v2-display);color:var(--v2-text)}
#entrenos .gform .field label{color:var(--v2-muted);font-size:.82rem}
#entrenos .gform .field input{
  background:#0a1921;border:1px solid var(--v2-line);border-radius:12px;
  padding:12px 14px;color:var(--v2-text);font:inherit;
}
#entrenos .gform .field input:focus{
  outline:none;border-color:var(--v2-cyan);box-shadow:0 0 0 3px rgba(19,185,231,.18);
}
#entrenos .gform__aviso{color:var(--v2-muted)}
#entrenos .gform__aviso b{color:var(--v2-text)}
#entrenos .gform__mal{color:var(--v2-pink);border-left-color:var(--v2-pink)}
#entrenos .gform .btn{
  border:0;border-radius:12px;color:#fff;
  background:linear-gradient(135deg,var(--v2-blue),var(--v2-cyan));
  box-shadow:0 8px 24px rgba(13,147,176,.25);
}
#entrenos .gform .chip{
  background:transparent;border:1px solid var(--v2-line);color:var(--v2-muted);
}
#entrenos .gform .chip:hover{border-color:var(--v2-cyan);color:var(--v2-text)}

/* Aviso de sincronización */
#entrenos .gsync{
  color:var(--v2-cyan2);background:rgba(19,185,231,.08);
  border:1px solid rgba(19,185,231,.2);
}

/* Resumen y lista de sesiones registradas */
#entrenos .ent-resumen{color:var(--v2-muted);border-bottom-color:var(--v2-line)}
#entrenos .ent-resumen b{color:var(--v2-cyan2)}
#entrenos .ent{
  background:linear-gradient(180deg,rgba(18,39,52,.9),rgba(8,23,32,.94));
  border:1px solid rgba(90,184,222,.18);border-radius:16px;
  box-shadow:var(--v2-sombra-sm),inset 0 1px rgba(255,255,255,.04);
}
#entrenos .ent__tit{color:var(--v2-text)}
#entrenos .ent__cuando{color:var(--v2-muted)}
#entrenos .ent__origen{color:var(--v2-muted);border-color:var(--v2-line)}
#entrenos .ent__origen--garmin{color:var(--v2-cyan2);border-color:var(--v2-cyan)}
#entrenos .ent__origen--apple{color:var(--v2-purple);border-color:var(--v2-purple)}
#entrenos .ent__casilla{color:var(--v2-muted);background:rgba(10,25,33,.6)}
#entrenos .ent__datos{color:var(--v2-cyan2)}
#entrenos .ent__nota{color:var(--v2-muted)}
#entrenos .ejs{border-top-color:var(--v2-line)}
#entrenos .ej+.ej{border-top-color:rgba(90,184,222,.12)}
#entrenos .ej__nom{color:var(--v2-text)}
#entrenos .ej__grupo{color:var(--v2-muted)}
#entrenos .serie{color:var(--v2-text);background:rgba(10,25,33,.6)}
#entrenos .ent-vacio h3{color:var(--v2-text)}
#entrenos .ent-vacio p{color:var(--v2-muted)}

/* ══════════════════════════════════════════════════════════
   F-3 · #consent — barra de cookies
   ══════════════════════════════════════════════════════════
   Mismo contrato de eventos que styles.css (track.js:409-460): ids
   consentPanel/consentCat_*, atributos data-consent intactos. Solo
   cambia la vestimenta, del lenguaje editorial de portada.css al
   lenguaje V2 (cyan/blue/glass) que ya usa el resto de app.html. */
#consent{
  background:linear-gradient(180deg,rgba(10,22,30,.94),rgba(5,13,18,.97));
  border-top:1px solid rgba(90,184,222,.22);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  color:var(--v2-text);box-shadow:0 -20px 50px rgba(0,0,0,.4);
}
#consent .consent__txt{color:var(--v2-muted)}
#consent .consent__panel{
  background:rgba(13,28,39,.75);border:1px solid var(--v2-line);
}
#consent .consent__cat{color:var(--v2-muted)}
#consent .consent__cat b{color:var(--v2-text)}
#consent .consent__cat input{accent-color:var(--v2-cyan)}
#consent .consent__cat--fija{opacity:.55}
#consent .consent__mas{color:var(--v2-cyan2)}
#consent .consent__mas:hover{color:var(--v2-text)}
#consent .btn{
  border:0;color:#fff;
  background:linear-gradient(135deg,var(--v2-blue),var(--v2-cyan));
  box-shadow:0 8px 24px rgba(13,147,176,.25);
}
#consent .btn--ghost{
  background:transparent;color:var(--v2-text);border:1px solid var(--v2-line);box-shadow:none;
}
#consent .btn--ghost:hover{border-color:var(--v2-cyan);color:var(--v2-cyan2)}
#consent :focus-visible{outline-color:var(--v2-cyan)}

@media (max-width:720px){
  #entrenos .fuentes{grid-template-columns:1fr}
}
@media (max-width:680px){
  #consent .consent__panel{max-height:44vh;overflow-y:auto}
  #consent .consent__mas{flex-basis:100%;text-align:left}
}
