/* PrimeFlix P58 — FINAL Web desktop slider authority.
 * Loaded at wp_enqueue_scripts priority 999, after the historical Web cascade.
 * Scope is >=769px only. Apps and Web mobile are untouched.
 */
@media (min-width:769px){
  /* The rail itself is the one and only scrolling surface. */
  html body .pf10c-slider[data-pf-web-rail="1"],
  html body .pf-xslider[data-pf-web-rail="1"],
  html body #xs-similar[data-pf-web-rail="1"],
  html body #xs-continue[data-pf-web-rail="1"]{
    display:block !important;
    position:relative !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-behavior:smooth !important;
    scroll-snap-type:x proximity !important;
    overscroll-behavior-x:contain !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
    touch-action:pan-x pan-y !important;
    cursor:grab;
  }
  html body [data-pf-web-rail="1"].is-pf-web-dragging{
    cursor:grabbing !important;
    scroll-behavior:auto !important;
  }
  html body [data-pf-web-rail="1"]::-webkit-scrollbar{
    width:0 !important;height:0 !important;display:none !important;
  }
  html body [data-pf-web-rail="1"] > .swiper-wrapper{
    display:flex !important;
    flex-flow:row nowrap !important;
    align-items:center !important;
    gap:18px !important;
    width:max-content !important;
    min-width:100% !important;
    max-width:none !important;
    height:auto !important;
    transform:none !important;
    translate:none !important;
    transition:none !important;
    box-sizing:border-box !important;
  }
  html body [data-pf-web-rail="1"] > .swiper-wrapper > .swiper-slide{
    flex:0 0 auto !important;
    scroll-snap-align:start !important;
  }

  /* TRUE circular navigation. polish.css gives .pfn-btn min-height:44px;
     this final authority explicitly resets every dimension. */
  html body .pf-sect-nav{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
  }
  html body .pf-sect-nav > button.pfn-btn,
  html body .pf-sect-nav .pfn-btn{
    -webkit-appearance:none !important;
    appearance:none !important;
    box-sizing:border-box !important;
    inline-size:40px !important;
    block-size:40px !important;
    width:40px !important;
    height:40px !important;
    min-inline-size:40px !important;
    min-block-size:40px !important;
    max-inline-size:40px !important;
    max-block-size:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    max-width:40px !important;
    max-height:40px !important;
    flex:0 0 40px !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:9999px !important;
    aspect-ratio:1/1 !important;
    clip-path:circle(50% at 50% 50%) !important;
    -webkit-clip-path:circle(50% at 50% 50%) !important;
    display:inline-grid !important;
    place-items:center !important;
    line-height:0 !important;
    overflow:hidden !important;
  }
  html body .pf-sect-nav .pfn-btn svg{
    display:block !important;
    width:18px !important;
    height:18px !important;
    min-width:18px !important;
    min-height:18px !important;
    pointer-events:none !important;
  }
  html body .pf-sect-nav .pfn-btn:disabled,
  html body .pf-sect-nav .pfn-btn.is-pf-disabled{
    opacity:.34 !important;
    cursor:default !important;
    transform:none !important;
  }

  /* Poster shell: placeholder and REAL image share exactly the same physical mask. */
  html body .pf10c-card{
    --pf-final-poster-radius:14px;
    position:relative !important;
    border-radius:var(--pf-final-poster-radius) !important;
    overflow:hidden !important;
    isolation:isolate !important;
  }
  html body .pf10-top10-sect .pf10c-card{--pf-final-poster-radius:12px;}
  html body .pf10c-card > .pf10c-poster,
  html body .pf10c-card > .pf10c-back{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    border-radius:var(--pf-final-poster-radius) !important;
    overflow:hidden !important;
    clip-path:inset(0 round var(--pf-final-poster-radius)) !important;
    -webkit-clip-path:inset(0 round var(--pf-final-poster-radius)) !important;
    background-clip:padding-box !important;
  }
  html body .pf10c-card > .pf10c-poster::before,
  html body .pf10c-card > .pf10c-back::before,
  html body .pf10c-card > .pf10c-poster > img,
  html body .pf10c-card > .pf10c-back > .pf10c-back-img,
  html body .pf10c-card > .pf10c-back > .pf10c-back-grad{
    border-radius:var(--pf-final-poster-radius) !important;
  }
  html body .pf10c-card > .pf10c-poster > img,
  html body .pf10c-card > .pf10c-back > .pf10c-back-img{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:cover !important;
    object-position:center center !important;
    overflow:hidden !important;
    clip-path:inset(0 round var(--pf-final-poster-radius)) !important;
    -webkit-clip-path:inset(0 round var(--pf-final-poster-radius)) !important;
  }
  /* Safari/WebKit: force the raster image into the same rounded compositing layer. */
  @supports (-webkit-mask-image: -webkit-radial-gradient(white, black)){
    html body .pf10c-card > .pf10c-poster,
    html body .pf10c-card > .pf10c-back{
      -webkit-mask-image:-webkit-radial-gradient(white, black);
    }
  }
}
