/* GANK - refinamientos de interacción móvil. */

@media (max-width: 991px) {
    /* The sticky bar moves 80px.  Move the search field by that same amount
       so both pieces stay joined throughout the entrance animation. */
    #tvcms-mobile-view-header .tvcmsheader-sticky.sticky {
        transition: none !important;
    }

    #tvcms-mobile-view-header .tvcmsheader-sticky.sticky ~ .tvcmsmobile-header-search-logo-wrapper {
        animation: gank-mobile-search-follow-header .22s cubic-bezier(.2, .8, .2, 1) both !important;
        transition: none !important;
        will-change: transform;
    }

    /* Catalogue normally uses an all-property transition with a delay.  This
       short, transform-only settling phase follows the user's finger cleanly. */
    .tvmobile-slidebar.gank-drawer-settling {
        transition: transform .24s cubic-bezier(.2, .75, .25, 1) !important;
    }

    @keyframes gank-mobile-search-follow-header {
        from {
            transform: translateY(-80px);
            opacity: 0;
        }

        to {
            transform: translateY(0);
            opacity: 1;
        }
    }
}

@media (prefers-reduced-motion: reduce) {
    #tvcms-mobile-view-header .tvcmsheader-sticky.sticky ~ .tvcmsmobile-header-search-logo-wrapper,
    .tvmobile-slidebar.gank-drawer-settling {
        animation: none !important;
        transition: none !important;
    }
}