/* KlipTok v19 · layout: sin footer en escritorio, nav superior de 1.er nivel, Reels vertical (prefijo k19-) */
/* 1 · footer fuera en escritorio (los enlaces viven en el aside) */
@media (min-width:768px){ #kt-footer, body > footer{display:none !important} }
#k19-legal{margin-top:auto;padding:.75rem .5rem .25rem;border-top:1px solid rgba(127,127,127,.25);font-size:.72rem;line-height:1.5}
#k19-legal h3{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;opacity:.6;margin:.2rem 0 .35rem;font-weight:700}
#k19-legal a{display:block;padding:.18rem .35rem;border-radius:6px;color:inherit;text-decoration:none;opacity:.85}
#k19-legal a:hover,#k19-legal a:focus-visible{opacity:1;background:rgba(127,127,127,.14);text-decoration:underline}
#k19-legal .k19-credit{margin-top:.5rem;padding:0 .35rem;opacity:.8;font-weight:600}
#k19-legal .k19-copy{padding:0 .35rem .5rem;opacity:.6}
#k19-legal .k19-secs{display:none}
@media (max-width:1179px){ #k19-legal .k19-secs{display:block;margin-bottom:.5rem} }
/* 2 · nav superior */
#k19-topnav{display:none;align-items:center;gap:.1rem;margin-inline-start:.5rem}
#k19-topnav a{padding:.4rem .6rem;border-radius:999px;font-size:.82rem;font-weight:600;color:inherit;text-decoration:none;white-space:nowrap;opacity:.85}
#k19-topnav a:hover,#k19-topnav a:focus-visible{opacity:1;background:rgba(124,58,237,.14)}
@media (min-width:1180px){ #k19-topnav{display:flex} }
/* 3 · Reels */
@media (min-width:768px){
  #feed-container{padding-top:.5rem;padding-bottom:.5rem}
  body #dynamic-feed > .feed-card{aspect-ratio:9/16;min-width:0 !important;height:calc(100vh - 5.5rem) !important;height:calc(100dvh - 5.5rem) !important;width:calc((100vh - 5.5rem) * 9 / 16) !important;width:calc((100dvh - 5.5rem) * 9 / 16) !important;max-width:100% !important}
  /* v25.3 · el reel ocupa TODO el alto útil de la zona de vídeo. Antes: 100dvh − 5.5rem, más de lo que mide la cabecera, y quedaban ~1.5 rem vacíos abajo
     (donde asomaba el siguiente reel). 100cqh = alto interior del #feed-container (es un size container); +.5rem compensa su relleno vertical (.5rem + .5rem)
     y deja ~.5rem de aire abajo. El ancho sigue siendo 9:16 de ese alto. Sin soporte de cqh se mantiene la regla anterior. */
  @supports (height:1cqh){ body #dynamic-feed > .feed-card{height:calc(100cqh + .5rem) !important;width:calc((100cqh + .5rem) * 9 / 16) !important} }
  .k19-nav{position:fixed;z-index:40;display:flex;flex-direction:column;gap:12px;top:50%;right:14px;left:auto;transform:translateY(-50%)}   /* v25: lateral derecho, centrado en vertical (estilo Facebook) */
  .k19-nav button{width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;font-size:20px;color:#fff;background:rgba(30,20,60,.78);box-shadow:0 4px 14px rgba(0,0,0,.35)}
  .k19-nav button:hover,.k19-nav button:focus-visible{background:#7c3aed}
  .k19-nav button:disabled{opacity:.35;cursor:default}
  .k19-reelmenu{display:none !important}
}
@media (max-width:767px){
  body.k19-reels #kt-top,body.k19-reels #tabs-mobile,body.k19-reels #kt-footer,body.k19-reels > footer{display:none !important}
  body.k19-reels.k19-bars #kt-top,body.k19-reels.k19-bars #tabs-mobile{display:flex !important;position:fixed;top:0;left:0;right:0;z-index:60}
  body.k19-reels #feed-container{position:fixed;inset:0;z-index:20;padding:0 !important;height:100vh;height:100dvh}
  body.k19-reels #dynamic-feed > .feed-card{max-width:none !important;min-width:0 !important;width:100% !important;height:100vh !important;height:100dvh !important;margin:0 !important;aspect-ratio:auto}
  .k19-nav{display:none}
  .k19-reelmenu{position:fixed;z-index:70;top:10px;inset-inline-start:10px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.5);color:#fff;font-size:18px}
}

/* aside en modo expandido: bloque completo; en modo carril: botón ⓘ + lista flotante */
#k19-legal .k19-info{display:none;margin:.25rem auto;width:40px;height:40px;border-radius:12px;border:0;background:rgba(127,127,127,.15);color:inherit;font-size:18px;cursor:pointer}
#k19-legal.k19-rail{padding:.5rem 0;border-top:1px solid rgba(127,127,127,.25)}
#k19-legal.k19-rail .k19-info{display:block}
#k19-legal.k19-rail .k19-list{display:none}
#k19-fly{position:fixed;z-index:9990;inset-inline-start:78px;bottom:12px;width:270px;max-height:80vh;overflow:auto;padding:.75rem;border-radius:16px;background:#fff;color:#1b1630;box-shadow:0 14px 44px rgba(0,0,0,.35);font-size:.8rem;line-height:1.55}
html.dark #k19-fly,.dark #k19-fly{background:#17122b;color:#f1ecff}
#k19-fly h3{font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;opacity:.6;margin:.2rem 0 .35rem;font-weight:700}
#k19-fly a{display:block;padding:.25rem .4rem;border-radius:6px;color:inherit;text-decoration:none}
#k19-fly a:hover,#k19-fly a:focus-visible{background:rgba(124,58,237,.16);text-decoration:underline}
#k19-fly .k19-secs{display:block}@media (min-width:1180px){#k19-fly .k19-secs{display:none}}
#k19-fly .k19-credit,#k19-fly .k19-copy{opacity:.75;padding:.15rem .4rem}
#k19-legal.k19-rail .k19-secs{display:block}
@media (min-width:1180px){ #k19-legal.k19-rail .k19-secs{display:none} }
@media (min-width:768px){ .k19-fab{inset-inline-start:86px} }

/* v25 · reservar el carril derecho para las flechas, que no tapen la página 2 del libro */
@media (min-width:768px){
  :root{--k25-rail:72px}
  aside{padding-bottom:4rem !important}          /* el botón flotante de idioma ya no tapa los últimos elementos del menú */
}
@media (max-width:1499px){ header p.hidden.sm\:block, #kt-top p.hidden.sm\:block{display:none !important} }   /* subtítulo del logo: no se corta contra los enlaces */
