/* t484 (18-oct-2026): segunda pasada del diseño copiado de las 14 capturas de Miguel (t482).
   1) Reglas de t482 que hojas anteriores (t457, t461, t468) pisaban con !important: se vuelven a imponer
      con los MISMOS valores de t482 (no son valores nuevos).
   2) En iPhone de 390 px (las capturas son de un iPhone de 430): lo que no cabía (textos cortados o que se
      salían de la pantalla, títulos tapados por la foto) se ajusta para que quede como en la captura.
   3) App de prueba: lo bloqueado conserva su foto y su icono (como en la captura) con un candado pequeño.
   Solo afecta a las pantallas copiadas (body.k482). Quitarlo = borrar esta hoja y su línea en base.html. */

/* ---------- 1) t482 pisado por t457/t461/t468 ---------- */
html body.k482 main .k-fx-tit h1{font-size:23px!important;line-height:1.15!important}
html body.k482 main .k-mv-cab h1{font-size:27px!important;line-height:1.12!important}
html body.k482 main .k-gr-cab h1{font-size:18px!important;line-height:1.2!important}
html body.k482 main .k-etq{font-size:12.5px!important}
html body.k482 main .k-mv-in .vv-btn{background-color:#eef3ff!important;border-color:#d4defa!important}
html body.k482 main .k-gr-rej{gap:7px!important}
html body.k482 main .k-gr-rej .k-gr-t{gap:6px!important;padding:8px 2px!important}
html body.k482 main .k-gr-rej .k-gr-t.puesto,html body.k482 main .k-gr-rej .k-gr-t[aria-pressed="true"]{box-shadow:0 2px 6px rgba(20,35,80,.04)!important}
html body.k482 main .k-gr-pop input{border-radius:10px!important;border-color:#d9e2f5!important;font-size:15px!important}
html body.k482-actividad main .ac-tipo input:checked + .ac-cara{background-color:#eef3ff!important}

/* ---------- 2) iPhone de 390 px ---------- */
@media (max-width:400px){
  /* Entrenar (IMG_2927): el nombre del ejercicio en 2 líneas como en la captura, no en 3 */
  html body.k482 main ul.k-ejs li{grid-template-columns:52px minmax(0,1fr) auto 30px 28px!important;gap:6px!important;padding:7px 7px 7px 6px!important}
  html body.k482 main .k-e-foto{width:52px!important;height:46px!important}
  html body.k482 main .k-e-txt .e-n{font-size:14px!important}
  html body.k482 main .k-e-m{font-size:11.5px!important}
  html body.k482 main .k-e-mus,html body.k482 main .k-e-mus img{width:30px!important;height:36px!important}
  /* el título de la sesión no se mete debajo de la foto */
  html body.k482 main .k-dia-hoy .dia-tit{max-width:60%!important}
  html body.k482 main .k-dia .dia-tit b{white-space:normal!important;line-height:1.15}
  /* Ficha (IMG_2940): Patrón / Trabaja / Material caben en la tarjeta */
  html body.k482 main dl.k-fx-datos{grid-template-columns:repeat(3,minmax(0,1fr))!important;padding:10px 2px!important}
  html body.k482 main .k-fx-datos>div{column-gap:5px!important;padding:2px 5px!important}
  html body.k482 main .k-fx-datos .k-i{width:19px!important;height:19px!important}
  html body.k482 main .k-fx-datos dt{font-size:9.5px!important;letter-spacing:.05em!important}
  html body.k482 main .k-fx-datos dd{font-size:12px!important;overflow-wrap:anywhere}
  /* Salud (IMG_2930): el título del check-in no queda debajo de la foto; las molestias en 2 líneas */
  html body.k482 main .k-st-hero img{left:auto!important;width:54%!important}
  html body.k482 main .k-st-hero::after{background:linear-gradient(90deg,#fff 46%,rgba(255,255,255,.5) 54%,transparent 64%)!important}
  html body.k482 main .k-st-hero .k-etq{letter-spacing:.07em!important;font-size:12px!important}
  html body.k482 main label.k-st-m{font-size:12.5px!important;gap:7px!important;padding:6px 8px!important}
  html body.k482 main label.k-st-m img{width:38px!important;height:38px!important}
  /* Running (E88D6757 + IMG_2923): el nombre debajo del icono, sin pisarlo */
  html body.k482 main a.k-act-t span{max-width:none!important;font-size:10px!important;padding:0 3px 6% 9%!important;letter-spacing:-.01em}
  html body.k482 main .k-act-c3 a.k-act-t span{font-size:11px!important;padding-bottom:6%!important}
  /* Grabar (IMG_2938): nombres enteros, GPS en una fila, botón y números en una línea */
  html body.k482 main .k-gr-t > svg + span,html body.k482 main .k-gr-t .ac-ico{font-size:10px!important;letter-spacing:-.02em}
  html body.k482 main .k-gr-cab h1{font-size:17px!important;padding-right:104px!important}
  html body.k482 main .k-gr-gps{gap:8px!important;padding:10px!important}
  html body.k482 main .k-gr-gps-i{width:32px!important;height:32px!important}
  html body.k482 main .k-gr-gps b{font-size:13px!important}
  html body.k482 main .k-gr-gps p{font-size:10.5px!important}
  html body.k482 main .k-gr-gps-b{padding:8px 9px!important;font-size:12px!important;gap:4px!important}
  html body.k482 main .k-gr-fila{gap:8px!important}
  html body.k482 main .k-gr-lado{width:60px!important}
  html body.k482 main .k-gr-fila .k-btn{font-size:14px!important;white-space:nowrap;padding-left:10px!important;padding-right:10px!important}
  html body.k482 main .k-gr-cuatro b{font-size:15px!important;white-space:nowrap}
  html body.k482 main .k-gr-cuatro>div{gap:5px!important;padding:0 2px!important}
  html body.k482 main .k-gr-cuatro .k-i{width:18px!important;height:18px!important}
}

/* ---------- 3) App de prueba: bloqueado con su foto y su icono ---------- */
html body.k482 main a.k-act-t.sp-bloq{display:flex!important;align-items:flex-end!important;justify-content:flex-start!important;gap:0!important;
  background:#f3f6fc var(--f) center/cover no-repeat!important;border:1px solid #e3e8f3!important;box-shadow:0 3px 10px rgba(20,35,80,.06)!important;
  filter:none!important;color:#121a3e!important;padding:0!important}
html body.k482 main a.k-act-t.sp-bloq > .sp-candado,html body.k482 main a.k-apunta.sp-bloq > .sp-candado{position:absolute;top:5px;right:5px;width:20px!important;height:20px!important;
  padding:3px;border-radius:50%;background:#fff;color:#1f5bff;box-shadow:0 2px 6px rgba(20,35,80,.18);filter:none!important;z-index:2}
html body.k482 main a.k-apunta.sp-bloq{display:flex!important;justify-content:flex-start!important;gap:4px!important;background:none!important;border:0!important;box-shadow:none!important;
  filter:none!important;color:var(--k-tx)!important;padding:0!important;position:relative}
html body.k482 main a.k-apunta.sp-bloq > .sp-candado{position:static;margin-right:6px;padding:2px;box-shadow:none;background:#eef3ff}

/* ---------- 2b) más ajustes de 390 px ---------- */
@media (max-width:400px){
  /* Grabar: «Grabar actividad» en una línea junto a «Cómo funciona», como en IMG_2938 */
  html body.k482 main .k-gr-cab h1{white-space:nowrap;padding-right:96px!important}
  html body.k482 main .k-gr-como{padding:6px 8px!important;font-size:11.5px!important;gap:4px!important;right:10px!important;top:12px!important}
  /* Movilidad (IMG_2925): las tres pestañas caben sin cortarse */
  html body.k482 main .k-mv-tabs{gap:6px!important}
  html body.k482 main a.k-mv-tab{padding:10px 13px!important;font-size:14px!important}
  /* Mi ciclo (IMG_2939): la cabecera «¿Cómo te sientes hoy?» en una línea */
  html body.k482 main .k-st-cab .k-st-t b{font-size:15px!important;white-space:nowrap}
  html body.k482 main .k-st-cab .k-st-t small{font-size:11.5px!important}
  html body.k482 main .k-st-cab .k-st-cal{width:36px!important;height:36px!important}
  html body.k482 main .k-st-fl{width:26px!important;height:26px!important}
  html body.k482 main .k-st-dia b{font-size:14px!important}
}
html body.k482 main a.k-apunta.sp-bloq > :last-child{margin-left:auto}
@media (max-width:400px){
  /* Inicio (IMG_2942): la M del cartel queda dentro, como en la captura */
  html body.k482 main .k-banner-txt{padding-top:5.5%!important;padding-bottom:5%!important}
  html body.k482 main .k-banner-txt p{font-size:12.3px!important;line-height:1.3!important}
  html body.k482 main .k-banner-m{width:26px!important}
}
