/* feed-mobile-autohide.css — Controles del feed auto-ocultables en móvil
   (change `mobile-feed-autohide-chrome`, 2026-09-30, spec B).

   `useFeedScrollAutoHide` (FeedPage.jsx) pone `body.feed-chrome-hidden` al
   hacer scroll hacia abajo y la quita al subir, tras 5 s sin scroll o en el
   tope. Los 4 controles viven en roots distintos, por eso se ocultan todos
   desde la clase del body.

   Guard doble (B6): `body.view-feed` + media query → aunque la clase quedara
   puesta, fuera del feed o en desktop no oculta nada.
   Se carga DESPUÉS de feed.css / chatbot-fab.css / sidebar-mobile-drawer.css. */

@media (max-width: 767px) {
    /* Se suman transform/opacity a las transiciones que cada control ya tenía
       (feed.css:43 para el toolbar). `.chatbot-fab` ya usa `transition: all`
       y el rayo ya transiciona transform/opacity (sidebar-mobile-drawer.css). */
    .feed-top-row {
        transition: transform 0.25s ease, background 0.3s ease, backdrop-filter 0.3s ease,
                    box-shadow 0.3s ease, border-color 0.3s ease;
    }
    #mobile-recorder-fab {
        transition: transform 0.25s ease, opacity 0.25s ease;
    }

    body.view-feed.feed-chrome-hidden .feed-top-row {
        transform: translateY(-110%);
        pointer-events: none;
    }
    body.view-feed.feed-chrome-hidden .mobile-nav-trigger {
        transform: translateY(-200%);
        opacity: 0;
        pointer-events: none;
    }
    body.view-feed.feed-chrome-hidden .chatbot-fab,
    body.view-feed.feed-chrome-hidden #mobile-recorder-fab {
        transform: translateY(200%);
        opacity: 0;
        pointer-events: none;
    }
}

/* B7: movimiento reducido → solo opacidad, sin desplazamiento. */
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    body.view-feed.feed-chrome-hidden .feed-top-row,
    body.view-feed.feed-chrome-hidden .mobile-nav-trigger,
    body.view-feed.feed-chrome-hidden .chatbot-fab,
    body.view-feed.feed-chrome-hidden #mobile-recorder-fab {
        transform: none;
        opacity: 0;
    }
}
