/* =========================================================
   custom.css – projekto override (be core CSS keitimo)
   ========================================================= */

/* Index: atskirti Hero sliderį nuo „Siūlomi“ sekcijos be overlay/blur */
#hero-index-0 { margin-bottom: 36px; }
@media (min-width:1024px){
  #hero-index-0 { margin-bottom: 44px; }
}

/* Jei tema/hero stiliai turi neigiamus margin’us ar „pull-up“ efektą, sulygiuojam sekcijų srautą */
.widget-featured { position: relative; z-index: 1; }

/* =========================================================
   Featured (Siūlomi) – pagination 1:1 kaip originale
   - dešinys kampas
   - pilki taškai
   - aktyvus raudonas pill
   - palaiko ir Wstream (.featured__bullet), ir Swiper bullets
   ========================================================= */

/* Pagination vieta: dešinėje */
.featured .featured__nav{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 14px;
}

/* Pats bullets konteineris */
.featured .featured__pagination{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

/* Bazinis bullet (pilkas taškas) */
.featured .featured__pagination .featured__bullet,
.featured .featured__pagination .swiper-pagination-bullet{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  margin: 0 !important;
  opacity: 1;
  transition: width .2s ease, background-color .2s ease, opacity .2s ease;
}

/* Spalvos pagal temą */
html[data-theme="light"] .featured .featured__pagination .featured__bullet,
html[data-theme="light"] .featured .featured__pagination .swiper-pagination-bullet{
  background: rgba(0,0,0,.25);
}

html[data-theme="dark"] .featured .featured__pagination .featured__bullet,
html[data-theme="dark"] .featured .featured__pagination .swiper-pagination-bullet{
  background: rgba(255,255,255,.25);
}

/* Aktyvus bullet: raudonas pill (SWIPER + WSTREAM) */
.featured .featured__pagination .featured__bullet.is-active,
.featured .featured__pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
  width: 28px;
  height: 8px;                 /* svarbu, kad liktų pill */
  border-radius: 999px;
  background: #e11d2e !important;  /* priverstinai raudona */
  opacity: 1 !important;
}

/* Neleisti, kad Swiper pridėtų extra margin/padding iš default */
.featured .featured__body .swiper { padding-bottom: 0 !important; }
.featured .featured__pagination .swiper-pagination-bullet { margin: 0 !important; }

/* =========================================================
   Tarpas po „Siūlomi“ (kad neliptų prie „Naujausios serijos“)
   ========================================================= */

#hero-index-1 { margin-bottom: 26px; }

@media (min-width:1024px){
  #hero-index-1 { margin-bottom: 34px; }
}


    /* Lights off overlay */
    .lights-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.95);
        z-index: 998;
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.3s ease;
        display: none;
    }
    
    .lights-overlay.active {
        opacity: 1;
        display: block;
    }
    
    body.lights-off .player,
    body.lights-off .plyer {
        position: relative;
        z-index: 999;
    }
    
    /* Active source button */
    .plyer__btn.active button {
        background: var(--color-primary, #dc2626) !important;
        color: white !important;
    }
    
    /* Expanded player */
    .plyer.is-expanded {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        z-index: 9999;
        background: #000;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
    }
    
    .plyer.is-expanded .plyer__view {
        flex: 1;
        width: 100%;
        height: calc(100% - 80px);
    }
    
    .plyer.is-expanded .plyer__aside {
        width: 100%;
        max-width: 100%;
        height: auto;
        padding: 20px;
        background: rgba(0, 0, 0, 0.9);
        display: flex;
        gap: 20px;
        align-items: center;
    }
    
    .plyer.is-expanded .plyer-list {
        flex: 1;
    }
    
    .plyer.is-expanded .plyer-action {
        display: flex;
        gap: 10px;
    }


/* =========================================================
   EPISODES TOP BAR – mobilui kad tilptų (Episode / Season / Sort)
   ========================================================= */

@media (max-width: 520px){

  /* Header – leisti laužyti į kelias eilutes */
  .crx-section--episodes .crx-section__header{
    flex-wrap: wrap;
    gap: 10px;
  }

  /* Action container – wrap + pilnas plotis */
  .crx-section--episodes .crx-section__action{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
  }

  /* Search blokas – pirmoje eilutėje per visą plotį */
  .crx-section--episodes .search-eps{
    width: 100%;
    flex: 0 0 100%;
    min-width: 0;
  }

  /* Input – ne 140px, o fluid */
  .crx-section--episodes .search-eps__form{
    width: 100%;
    position: relative;
  }

  .crx-section--episodes .search-eps__form input{
    width: 100% !important;
    max-width: 100% !important;
    height: 44px;
    padding-right: 46px; /* vieta mygtukui */
    box-sizing: border-box;
    position: relative !important;
    right: auto !important;
    top: auto !important;
  }

  .crx-section--episodes .search-eps__form button{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    height: 36px;
    width: 36px;
  }

  /* Season dropdown – antros eilutės kairė */
  .crx-section--episodes details.dropdown.is-xs{
    flex: 1 1 auto;
    min-width: 160px;
    max-width: calc(100% - 52px); /* paliekam vietą sort mygtukui */
  }

  .crx-section--episodes details.dropdown.is-xs .dropdown-btn{
    width: 100%;
    height: 44px;
  }

  /* Sort mygtukas – antros eilutės dešinė */
  .crx-section--episodes #order-episodes{
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* Dropdown sąrašas – kad telptų ekrane */
  .crx-section--episodes .dropdown-content{
    max-height: 55vh;
    overflow: auto;
  }
}


/* =========================================================
   SEARCH MODAL – padaryti kaip demo (siauras „search bar“ centre)
   - naudoja temos .crx-modal--searchbox ir .sbox stilius
   ========================================================= */

/* Siauresnis wrapper (ne 95% pločio kaip default) */
.crx-modal.crx-modal--searchbox .crx-modal__wrapper{
  width: min(720px, 92vw);
  max-width: 720px;
}

/* Neberodyti antraštės teksto (pas mus jo nėra, bet paliekam saugiai) */
.crx-modal.crx-modal--searchbox .crx-modal__header h2{ display:none; }

/* Close mygtukas – vizualiai kaip input juostoje */
.crx-modal.crx-modal--searchbox .crx-modal__header{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding: 0 18px;
}

/* Mobilui dar siauresnis + geresnis aukštis */
@media (max-width: 520px){
  .crx-modal.crx-modal--searchbox{ padding-block: 18px; }
  .crx-modal.crx-modal--searchbox .crx-modal__wrapper{
    width: min(560px, 94vw);
  }
  .sbox__form button{ margin-right: 12px; }
}