/* KlipTok Reels UX — un reel por pantalla (móvil), sin Ampliar; el «⋯» se mantiene */
/* 1) Móvil: solo un reel visible, snap vertical */
@media (max-width: 1023px) {
  body.kt-reels #feed-container {
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scroll-snap-type: y mandatory !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch;
  }
  body.kt-reels #dynamic-feed,
  body.kt-reels #feed-container > .flex,
  body.kt-reels #feed-container {
    gap: 0 !important;
  }
  body.kt-reels #feed-container .feed-card {
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
    scroll-snap-align: start !important;
    scroll-snap-stop: always !important;
    flex: 0 0 100dvh !important;
  }
  body.kt-reels #feed-container .feed-card .group {
    height: 100% !important;
    min-height: 100dvh !important;
  }
  body.kt-reels #feed-container .feed-card video {
    height: 100% !important;
    object-fit: cover !important;
  }
}

/* 2) Botón negro «⋯» (Más opciones): SE QUEDA.
   Con los dos paneles de Interacciones abiertos, kt-layout.js esconde toda la columna de botones del reel
   (y con ella el «⋯»). Aquí la columna se mantiene pero solo con el «⋯», que abre y cierra los paneles. */
html body.kt-reels.kt-book-on #feed-container .feed-card .group .absolute.bottom-4.right-3 {
  display: flex !important;
}
html body.kt-reels.kt-book-on #feed-container .feed-card .group .absolute.bottom-4.right-3 > :not(.k53-moreb) {
  display: none !important;
}
body.kt-reels.kt-book-on .k53-moreb { background: rgba(124, 58, 237, .75) !important; }

/* 3) Quitar «Ampliar menú» (kt-asw) en móvil y en modo reels */
.kt-asw,
button#kt-asw,
button[title="Ampliar menú"],
button[aria-label="Ampliar menú"],
button[title*="Ampliar"],
button[aria-label*="Ampliar"] {
  display: none !important;
}

/* En escritorio también ocultamos Ampliar si está en modo reels a pantalla completa de clips */
body.kt-reels .kt-asw {
  display: none !important;
}

/* UI auto-hide (5 s): TODO el interfaz del reel depende de body.kt-ui-on */
body.kt-reels .kt-pg { transition: opacity .12s ease; }
body.kt-reels:not(.kt-ui-on) .kt-pg {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .25s ease;
}
body.kt-reels:not(.kt-ui-on) .group .absolute.bottom-4.right-3,
body.kt-reels:not(.kt-ui-on) .group .absolute.bottom-4.left-3,
body.kt-reels:not(.kt-ui-on) .group [class*="tag"],
body.kt-reels:not(.kt-ui-on) .group .k53-strip,
body.kt-reels:not(.kt-ui-on) .k53-more {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .25s ease;
}
body.kt-reels.kt-ui-on .group .absolute.bottom-4.right-3,
body.kt-reels.kt-ui-on .group .absolute.bottom-4.left-3 {
  opacity: 1;
  transition: opacity .12s ease;
}
