/* KlipToc v219 · menú oscuro DERECHO (acompaña a kt-v219-menu-der.js). Mismo aspecto que el de la izquierda (#kt-side). Quitar: borrar con el .js */

/* botón de la barra de arriba (mismo estilo que el ☰ de la izquierda) */
html #kt-top #kt-menu-r {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 2.4rem; height: 2.4rem; margin: 0 0 0 .25rem; padding: 0; border-radius: .8rem;
  border: 1px solid var(--kt-line, rgba(100,116,139,.3)); background: var(--kt-card, transparent); color: var(--kt-ink, inherit); cursor: pointer;
}
html #kt-top #kt-menu-r:hover { background: var(--kt-hover, rgba(100,116,139,.15)); }
html #kt-top #kt-menu-r[aria-expanded="true"] { background: var(--kt-hover, rgba(100,116,139,.15)); border-color: var(--kt-acc, #7c3aed); }
/* v250: en móvil el botón del menú derecho SÍ se ve (antes se ocultaba) */
@media (max-width: 767px) { html #kt-top #kt-menu-r { width: 2.3rem; height: 2.3rem; margin-left: 0; } }

/* la columna */
html #kt-side-r {
  --ks-ink: #e6e8f8; --ks-mute: #9ba4cb; --ks-line: rgba(255,255,255,.11); --ks-hov: rgba(255,255,255,.09); --ks-acc: #c4b5fd; --ksr-w: 16.5rem;
  position: relative; z-index: 30; display: flex; flex-direction: column; flex: 0 0 var(--ksr-w); width: var(--ksr-w); max-width: 100%; min-height: 0; box-sizing: border-box;
  margin: 0; padding: 0 .6rem 1.2rem;
  background: #0f172a linear-gradient(180deg, #0f172a 0%, #1e1b4b 55%, #312e81 100%); color: var(--ks-ink);
  border-left: 1px solid rgba(255,255,255,.08);
  overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.28) transparent;
  font: 500 .86rem/1.3 Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
  transition: flex-basis .22s ease, width .22s ease, padding .22s ease;
}
#kt-side-r::-webkit-scrollbar { width: 8px; }
#kt-side-r::-webkit-scrollbar-thumb { background: rgba(255,255,255,.25); border-radius: 8px; }
#kt-side-r > * { flex-shrink: 0; }

/* cabecera fija: cerrar + título */
#kt-side-r .ksr-top { position: sticky; top: 0; z-index: 6; margin: 0 -.6rem; padding: .75rem .6rem .5rem; background: #0f172a; border-bottom: 1px solid var(--ks-line); }
#kt-side-r .ksr-hd { display: flex; align-items: center; gap: .6rem; padding: 0 .25rem; }
#kt-side-r .ksr-hd b { font-size: .95rem; letter-spacing: .02em; }
#kt-side-r .ksr-x {
  display: grid; place-items: center; flex: 0 0 2.2rem; width: 2.2rem; height: 2.2rem; border: 0; border-radius: .7rem; cursor: pointer;
  background: rgba(255,255,255,.10); color: #fff; font-size: 1.15rem; line-height: 1; padding: 0;
}
#kt-side-r .ksr-x:hover { background: rgba(255,255,255,.2); }
#kt-side-r .ksr-x .m { display: none; }

#kt-side-r .ksr-h { margin: 1rem 0 .25rem; padding: 0 .75rem; font: 700 .66rem/1.2 Inter, system-ui, sans-serif; letter-spacing: .09em; text-transform: uppercase; color: var(--ks-mute); }
#kt-side-r a.ksr-row { display: flex; align-items: center; gap: .7rem; width: 100%; box-sizing: border-box; min-height: 2.9rem; padding: .4rem .6rem; border-radius: .75rem; color: var(--ks-ink); text-decoration: none; }
#kt-side-r a.ksr-row:hover { background: var(--ks-hov); }
#kt-side-r a:focus-visible, #kt-side-r button:focus-visible { outline: 2px solid var(--ks-acc); outline-offset: -2px; }
#kt-side-r .ksr-ic { display: grid; place-items: center; flex: 0 0 2.2rem; width: 2.2rem; height: 2.2rem; border-radius: .7rem; font-size: 1.2rem; line-height: 1; }
#kt-side-r .ksr-t { display: grid; min-width: 0; }
#kt-side-r .ksr-t b { font: 700 .86rem/1.25 Inter, system-ui, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#kt-side-r .ksr-t small { color: var(--ks-mute); font-size: .74rem; }
#kt-side-r .ksr-foot { margin: 1.2rem .75rem 0; font-size: .76rem; color: var(--ks-mute); }
#kt-side-r .ksr-foot a { color: var(--ks-mute); text-decoration: underline; }

/* antes de que el script decida si va abierto o cerrado, no se pinta (evita el «se abre y se cierra» al cargar) */
html:not(.ksr-ready) #kt-side-r { visibility: hidden; }

/* escritorio / tablet horizontal: columna que se cierra del todo */
@media (min-width: 1024px) {
  html.ksr-closed #kt-side-r { flex-basis: 0; width: 0; min-width: 0; padding-left: 0; padding-right: 0; border-left-width: 0; visibility: hidden; overflow: hidden; }
}

/* tablet vertical y móvil: cajón por la derecha con capa oscura */
@media (max-width: 1023px) {
  html #kt-side-r { position: fixed; top: 0; right: 0; bottom: 0; z-index: 2147480000; width: min(var(--ksr-w), 86vw); transform: translateX(105%); visibility: hidden; transition: transform .22s ease, visibility 0s .22s; box-shadow: -10px 0 30px rgba(0,0,0,.35); }
  html #kt-side-r.kt-open { transform: none; visibility: visible; transition: transform .22s ease; }
  #kt-side-r .ksr-x .d { display: none; } #kt-side-r .ksr-x .m { display: inline; }
}
#ksr-ov { display: none; }
@media (max-width: 1023px) { #ksr-ov.on { display: block; position: fixed; inset: 0; z-index: 2147479000; background: rgba(2,6,23,.55); } }
@media print { #kt-side-r, #ksr-ov, #kt-menu-r { display: none !important; } }

/* ============ v219 · el INICIO en el menú oscuro de la izquierda ============ */
/* en el inicio sí se ve «Todas las secciones» (el resto de categorías); en las demás secciones sigue oculto (v218) */
html.ks-ctx[data-ks-ctx="inicio"] #kt-side > [data-ks="allbtn"] { display: flex !important; }
html.ks-ctx[data-ks-ctx="inicio"] #kt-side #ks-home { display: none; }
/* contadores Vídeos · Fotos · Audios */
#kt-ctx-here .ctx-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: .1rem 0 .3rem; text-align: center; }
#kt-ctx-here .ctx-stats a { display: block; padding: .3rem 0; border-radius: .6rem; }
#kt-ctx-here .ctx-stats a:hover { background: rgba(255,255,255,.09); }
#kt-ctx-here .ctx-stats b { display: block; font-size: .95rem; }
#kt-ctx-here .ctx-stats small { color: #c7d2fe; font-size: .72rem; }
#kt-ctx-here .ctx-stats .kt-g { display: none !important; }   /* kt-layout.js añade un glifo de reserva a todo enlace: aquí sobra */
