/* NILA v21.55 Mobile Marquee Stabilisation */

/* Kill competing older mobile marquee animations first */
@media(max-width:780px){
  body.page-home .v42-service-grid,
  body[data-nila-page="index"] .v42-service-grid,
  body.page-home .v42-mobile-marquee .v42-service-grid,
  body[data-nila-page="index"] .v42-mobile-marquee .v42-service-grid{
    animation:none!important;
    transform:none!important;
    will-change:auto!important;
  }

  /* Dedicated stable mobile homepage marquee */
  body.page-home .v55-mobile-marquee,
  body[data-nila-page="index"] .v55-mobile-marquee{
    display:block!important;
    overflow:hidden!important;
    width:100%!important;
    position:relative!important;
    margin-top:8px!important;
  }

  body.page-home .v55-mobile-marquee-track,
  body[data-nila-page="index"] .v55-mobile-marquee-track{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:14px!important;
    width:max-content!important;
    min-width:max-content!important;
    will-change:transform!important;
    transform:translate3d(0,0,0);
  }

  body.page-home .v55-mobile-marquee-track .v42-service-card,
  body[data-nila-page="index"] .v55-mobile-marquee-track .v42-service-card{
    flex:0 0 245px!important;
    width:245px!important;
  }

  body.page-home .v55-mobile-marquee.is-paused .v55-mobile-marquee-track,
  body[data-nila-page="index"] .v55-mobile-marquee.is-paused .v55-mobile-marquee-track{
    will-change:auto!important;
  }

  /* Do not animate mobile category/provider rails */
  body.v52-category-page .v19-cat-rail-inner,
  body.v48-category-page .v19-cat-rail-inner,
  body.v46-category-page .v19-cat-rail-inner,
  body.v41-category-page .v19-cat-rail-inner,
  body.page-provider .v47-provider-rail-inner{
    animation:none!important;
    transform:none!important;
    overflow-x:auto!important;
    width:auto!important;
    min-width:0!important;
    display:flex!important;
    -webkit-overflow-scrolling:touch!important;
    will-change:auto!important;
  }
}

/* Desktop/web category and provider rails can still marquee, but not on mobile */
@media(min-width:781px){
  body.v52-category-page .v19-cat-rail-inner,
  body.v48-category-page .v19-cat-rail-inner,
  body.page-provider .v47-provider-rail-inner{
    animation:v55WebRailMarquee 26s linear infinite!important;
    will-change:transform!important;
  }

  body.v52-category-page .v19-cat-rail:hover .v19-cat-rail-inner,
  body.v48-category-page .v19-cat-rail:hover .v19-cat-rail-inner,
  body.page-provider .v47-provider-rail:hover .v47-provider-rail-inner{
    animation-play-state:paused!important;
  }

  @keyframes v55WebRailMarquee{
    0%{transform:translate3d(0,0,0);}
    100%{transform:translate3d(-50%,0,0);}
  }
}