/* sp-index-page.css — extracted from index.html inline <style> blocks */
/* Do not put page CSS back in index.html; edit this file instead. */

/* ===== sp-main-card-mute-expand-visibility ===== */
/* Mute hidden only before live starts; visible once playing */
  #sp-walkthrough .cinematic-slide[data-live="on"]:not(.sp-live-playing):not(.sp-live-waiting) .poster-wrapper > .sp-custom-scrub .sp-scrub-mute {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
  #sp-walkthrough .cinematic-slide[data-live="on"].sp-live-playing .poster-wrapper > .sp-custom-scrub .sp-scrub-mute,
  #sp-walkthrough .cinematic-slide[data-live="on"].sp-live-waiting .poster-wrapper > .sp-custom-scrub .sp-scrub-mute {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  #sp-walkthrough .cinematic-slide[data-live="on"] .poster-wrapper > .sp-custom-scrub .sp-scrub-expand {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    right: 10px !important;
    left: auto !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
  }
  /* VOD custom controller: smaller buttons, same controls/behavior. */
  #sp-walkthrough .cinematic-slide.sp-offline-playing .poster-wrapper > .sp-custom-scrub .sp-scrub-pp,
  #sp-walkthrough .cinematic-slide.sp-offline-playing .poster-wrapper > .sp-custom-scrub .sp-scrub-stop,
  #sp-walkthrough .cinematic-slide.sp-offline-playing .poster-wrapper > .sp-custom-scrub .sp-scrub-mute,
  #sp-walkthrough .cinematic-slide.sp-offline-playing .poster-wrapper > .sp-custom-scrub .sp-scrub-expand {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
  }
  @media (max-width: 991px) {
    #sp-walkthrough .cinematic-slide.sp-offline-playing .poster-wrapper > .sp-custom-scrub {
      height: 52px !important;
      min-height: 52px !important;
      padding: 6px 7px !important;
      gap: 6px !important;
    }
  }

/* ===== sp-home-sections-visible ===== */
/* Prevent home sections from collapsing to zero height on mobile (Chrome safety).
   Do NOT force display — search hide/show must still work via inline styles. */
#sp-walkthrough,
section.gen-section-padding-2,
section.home-singal-silder {
  min-height: 1px;
  height: auto;
  max-height: none;
}

/* ===== sp-mobile-scroll-unlock ===== */
/* Mobile Chrome: keep page scrollable unless player is intentionally expanded */
@media (max-width: 991.98px) {
  html:not(:fullscreen):not(:-webkit-full-screen),
  body:not(.sp-player-expanded):not(.sp-expand-mobile-body):not(.sp-popup-fill):not(.sp-popup-fs-active):not(.sp-popup-landscape) {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: auto !important;
    max-height: none !important;
    position: relative !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: auto !important;
  }
  /* Main hero must not trap the whole page height */
  #sp-walkthrough,
  #sp-walkthrough .gen-banner-movies,
  #sp-walkthrough .owl-carousel,
  #sp-walkthrough .owl-stage-outer,
  #sp-walkthrough .cinematic-slide {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
  }
  /* Sections below hero always in normal document flow */
  section.gen-section-padding-2,
  section.home-singal-silder,
  #footer {
    position: relative !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* ===== sp-back-to-top-match ===== */
/* Back to top — same as player controls (mute / close) */
/* Hidden by default; shown only when scrolled down (.sp-top-visible) */
#back-to-top {
  position: fixed !important;
  right: 24px !important;
  bottom: max(24px, env(safe-area-inset-bottom, 24px)) !important;
  z-index: 99990 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  display: block !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 0.28s ease, visibility 0.28s ease, transform 0.28s ease !important;
  transform: translateY(12px) !important;
}
#back-to-top.sp-top-visible {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}
#back-to-top a.top,
#back-to-top #top {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  background: rgba(0, 0, 0, 0.75) !important;
  color: #e50914 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  text-decoration: none !important;
  outline: none !important;
  cursor: pointer !important;
  transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s cubic-bezier(.34,1.4,.64,1), box-shadow 0.18s ease, color 0.2s ease !important;
  -webkit-tap-highlight-color: transparent !important;
}
#back-to-top a.top i,
#back-to-top #top i {
  color: inherit !important;
  font-size: 20px !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
}
#back-to-top a.top:hover,
#back-to-top a.top:focus,
#back-to-top #top:hover,
#back-to-top #top:focus {
  background: #e50914 !important;
  border-color: #e50914 !important;
  color: #fff !important;
  transform: scale(1.12) !important;
  box-shadow: 0 6px 18px rgba(229, 9, 20, 0.45) !important;
  text-decoration: none !important;
}
#back-to-top a.top:active,
#back-to-top #top:active {
  transform: scale(0.94) !important;
}
@media (max-width: 767px) {
  #back-to-top {
    right: 16px !important;
    bottom: max(16px, env(safe-area-inset-bottom, 16px)) !important;
  }
  #back-to-top a.top,
  #back-to-top #top {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
  #back-to-top a.top i,
  #back-to-top #top i {
    font-size: 18px !important;
  }
}

/* ===== sp-intro-host-isolation ===== */
#video-intro-host{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;margin:0;padding:0;border:0;z-index:2147483647;background:#000;contain:strict;isolation:isolate;}
#video-intro-host iframe{display:block;width:100%;height:100%;border:0;margin:0;padding:0;}

/* ===== inline-block-6 ===== */
/* STUPPLAYS: presentable controller buttons — isolated presentation only */
.sp-live-vod-controller .plyr__controls button,
.sp-live-vod-controller .plyr__control,
.plyr .plyr__controls button,
.plyr .plyr__control {
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 7px;
}

.sp-live-vod-controller .plyr__controls button svg,
.sp-live-vod-controller .plyr__control svg,
.plyr .plyr__controls button svg,
.plyr .plyr__control svg {
    width: 16px;
    height: 16px;
    max-width: 16px;
    max-height: 16px;
}

/* ===== sp-mobile-live-countdown-position-fix ===== */
@media (max-width: 767px) {
  #sp-walkthrough .cinematic-slide {
    position: relative !important;
  }

  /* Keep the existing countdown where the mobile carousel can render it,
     but place it over the exact poster rectangle. Nothing about live/VOD
     state or player loading is changed. */
  #sp-walkthrough .cinematic-slide > .sp-live-countdown {
    position: absolute !important;
    z-index: 9999 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  #sp-walkthrough .cinematic-slide .poster-wrapper > .sp-live-countdown {
    z-index: 9999 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  #sp-walkthrough .cinematic-slide .sp-live-countdown-time,
  #sp-walkthrough .cinematic-slide .sp-cd-flash,
  #sp-walkthrough .cinematic-slide .sp-cd-digits,
  #sp-walkthrough .cinematic-slide .sp-cd-ampm {
    visibility: visible !important;
  }

  #sp-walkthrough .cinematic-slide .sp-cd-flash {
    animation: sp-cd-blink 1s step-start infinite !important;
    background: #e50914 !important;
  }
}

/* ===== sp-site-notice-style ===== */
#sp-site-notice {
    position: fixed;
    inset: 0;
    z-index: 1000000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(0,0,0,.82);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
  #sp-site-notice.sp-site-notice-visible { display: flex; }
  #sp-site-notice .sp-site-notice-panel {
    width: min(760px, 100%);
    padding: clamp(28px, 5vw, 58px);
    text-align: center;
    color: #fff;
    background: linear-gradient(145deg, #191919, #070707);
    border: 2px solid #e50914;
    border-radius: 18px;
    box-shadow: 0 0 0 1px rgba(255,255,255,.06), 0 24px 90px rgba(0,0,0,.8), 0 0 40px rgba(229,9,20,.28);
  }
  #sp-site-notice h2 {
    margin: 0 0 18px;
    color: #e50914;
    font-size: clamp(26px, 4vw, 44px);
    font-weight: 900;
    letter-spacing: .4px;
  }
  #sp-site-notice p {
    margin: 0 auto 28px;
    max-width: 620px;
    font-size: clamp(18px, 2.5vw, 27px);
    line-height: 1.5;
    font-weight: 700;
  }
  #sp-site-notice button {
    min-width: 150px;
    padding: 13px 24px;
    border: 0;
    border-radius: 999px;
    background: #e50914;
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
  }
  #sp-site-notice button:hover { background: #b20710; }

/* ===== shared kicker (was inline on spans) ===== */
.sp-cs-kicker {
  font-size: 20px;
  color: #ffffff;
}

/* ===== walkthrough shell transparent (was inline) ===== */
#sp-walkthrough .row.no-gutters,
#sp-walkthrough .row.no-gutters > .col-12,
#sp-walkthrough .gen-banner-movies.banner-style-2,
#sp-walkthrough .owl-carousel {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
#sp-walkthrough .owl-carousel {
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

/* ===== walkthrough root / container (was inline on #sp-walkthrough) ===== */
#sp-walkthrough.sp-walkthrough-root {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
}
#sp-walkthrough > .container-fluid.px-0 {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
}
/* search results host starts hidden (was style="display:none") */
#searchResultsSection.search-results-section {
  display: none;
}