/*
Theme Name:   TurkDizi Child – Soft Premium Dark
Theme URI:    https://turkdizivostfr.com
Description:  Child theme for DooPlay — soft premium dark with rose-red accent
Author:       TurkDizi VOSTFR
Template:     dooplay
Version:      1.0.0
Text Domain:  turkdizi-child
*/

/* ============================================================
   CSS CUSTOM PROPERTIES
   ============================================================ */
:root {
  --td-bg:        #0e0e16;
  --td-surface:   #141420;
  --td-card:      #1e1e2a;
  --td-border:    rgba(255,255,255,0.07);
  --td-red:       #c0392b;
  --td-red-h:     #e04535;
  --td-red-sub:   rgba(192,57,43,0.15);
  --td-gold:      #c8a97e;
  --td-green:     #27ae60;
  --td-green-h:   #2ecc71;
  --td-text:      #f0ece4;
  --td-muted:     rgba(240,236,228,0.50);
  --td-nav-h:     68px;
  --td-r-sm:      4px;
  --td-r-md:      6px;
  --td-r-lg:      8px;
  --td-tr:        0.2s ease;
}

/* ============================================================
   BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
body { background-color: var(--td-bg) !important; color: var(--td-text) !important; -webkit-font-smoothing: antialiased; }
a { color: var(--td-text); transition: color var(--td-tr); }
a:hover { color: #fff; }

/* ============================================================
   BACKGROUND SYSTEM
   ============================================================ */
#dt_contenedor { background-color: var(--td-bg) !important; position: relative; }

/* Dark gradient overlay so backdrop image never overpowers text */
#dt_contenedor::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(to bottom,
    rgba(4,7,20,0.70) 0%,
    rgba(4,7,20,0.50) 25%,
    rgba(4,7,20,0.75) 60%,
    rgba(4,7,20,0.97) 100%
  );
}

/* Everything sits above the overlay */
header#header.main, .fixheadresp, footer.main {
  position: relative;
  z-index: 1000; /* above #contenedor and hero */
}

#contenedor {
  position: relative;
  z-index: 1; /* below the nav/menu */
}

/* Home page: no dynamic image, subtle blue atmosphere instead */
body.home #dt_contenedor {
  background-image: none !important;
  background: radial-gradient(ellipse at 20% 0%, rgba(0,99,229,0.09) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 100%, rgba(0,99,229,0.05) 0%, transparent 50%),
              var(--td-bg) !important;
}
body.home #dt_contenedor::before { display: none; }

/* ============================================================
   WRAPPER
   ============================================================ */
#contenedor { margin-top: var(--td-nav-h) !important; background: transparent !important; max-width: 100% !important; }

/* ============================================================
   NAV BAR
   ============================================================ */
header#header.main {
  height: var(--td-nav-h) !important;
  background: linear-gradient(180deg, rgba(4,7,20,0.98) 0%, rgba(4,7,20,0.90) 100%) !important;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.6) !important;
}
header#header.main .hbox { height: var(--td-nav-h) !important; }
header#header.main .hbox .logo { background: transparent !important; }

.head-main-nav ul.main-header > li > a { color: rgba(255,255,255,0.78) !important; font-size: 14px; font-weight: 500; }
.head-main-nav ul.main-header > li > a:hover,
.head-main-nav ul.main-header > li.current-menu-item > a { color: #fff !important; }
.head-main-nav ul.main-header li ul.sub-menu { background: rgba(4,7,20,0.98) !important; border: 1px solid var(--td-border); border-radius: var(--td-r-md); box-shadow: 0 12px 40px rgba(0,0,0,0.8); }
.head-main-nav ul.main-header li ul.sub-menu li a { color: rgba(255,255,255,0.65) !important; }
.head-main-nav ul.main-header li ul.sub-menu li a:hover { color: #fff !important; background: rgba(255,255,255,0.06); }

header#header.main .hbox .search form { background: rgba(255,255,255,0.08) !important; border: 1px solid rgba(255,255,255,0.12) !important; border-radius: 20px !important; }
header#header.main .hbox .search form:focus-within { background: rgba(255,255,255,0.12) !important; border-color: rgba(255,255,255,0.22) !important; }
header#header.main .hbox .search form input[type="text"] { color: #fff !important; }
header#header.main .hbox .search form input[type="text"]::placeholder { color: rgba(255,255,255,0.35) !important; }
header#header.main .hbox .search form button[type="submit"] { color: rgba(255,255,255,0.55) !important; background: transparent !important; }
header#header.main .hbox .search form button[type="submit"]:hover { color: #fff !important; }

.live-search ul { background: rgba(4,7,20,0.97) !important; border: 1px solid var(--td-border) !important; border-radius: var(--td-r-md); box-shadow: 0 12px 40px rgba(0,0,0,0.8); }
.live-search ul li { border-bottom: 1px solid var(--td-border) !important; }
.live-search ul li:hover { background: rgba(255,255,255,0.05) !important; }
.live-search ul li .title { color: #fff !important; }
.live-search ul li .other-name { color: var(--td-muted) !important; }
.live-search ul li .imdb { color: var(--td-muted) !important; }
.live-search ul li .imdb span.fas { color: var(--td-gold) !important; }

.dtuser a.clicklogin { color: rgba(255,255,255,0.8) !important; border-left: 1px solid var(--td-border) !important; }
.dtuser .gravatar { border-left: 1px solid var(--td-border) !important; }
.dtuser .gravatar span { background: #e53232 !important; color: #fff !important; }

/* ============================================================
   RESPONSIVE HEADER
   ============================================================ */
.fixheadresp header.responsive { background: rgba(4,7,20,0.99) !important; border-bottom: 1px solid var(--td-border) !important; box-shadow: 0 2px 12px rgba(0,0,0,0.6) !important; }
header.responsive a { color: #fff !important; }
header.responsive .nav, header.responsive .search { border-color: rgba(255,255,255,0.1) !important; }
header.responsive .nav a.active:before, header.responsive .search a.active:before { color: var(--td-red) !important; }
.menuresp .menu { background: rgba(4,7,20,0.99) !important; }
.menuresp .menu .user { background: rgba(255,255,255,0.03) !important; border-bottom: 1px solid var(--td-border) !important; }
.menuresp .menu ul.resp li { border-bottom: 1px solid var(--td-border) !important; }
.menuresp .menu ul.resp li a { color: rgba(255,255,255,0.75) !important; }
.menuresp .menu ul.resp li a:hover { color: #fff !important; background: rgba(255,255,255,0.05) !important; }
.menuresp .menu ul.resp li ul.sub-menu li a { color: rgba(255,255,255,0.5) !important; }
.menuresp .menu ul.resp li ul.sub-menu li a:before { color: rgba(255,255,255,0.35) !important; }
.menuresp .menu .user .logout a { background: rgba(255,255,255,0.1) !important; color: #fff !important; }
.menuresp .menu .user .logout a:hover { background: var(--td-red) !important; }
.menuresp .menu .user a.ctgs { background: var(--td-red) !important; color: #fff !important; }
form.form-resp-ab { background: rgba(4,7,20,0.98) !important; border: none !important; }
form.form-resp-ab input[type="text"] { color: #fff !important; }
form.form-resp-ab button[type="submit"] span { font-size: 20px; color: #fff !important; }
form.form-resp-ab button[type="submit"]:hover > span { color: var(--td-red-h) !important; }

/* ============================================================
   MODULE (homepage sections)
   ============================================================ */

/* ============================================================
   GLOBAL WRAPPER
   ============================================================ */
#dt_contenedor { background-color: var(--td-bg) !important; position: relative; }
body.home #dt_contenedor { background-image: none !important; background: radial-gradient(ellipse at 20% 0%, rgba(0,99,229,0.09) 0%, transparent 60%), var(--td-bg) !important; }
body.home #dt_contenedor::before { display: none; }
#contenedor { background: transparent !important; max-width: 100% !important; }

/* ============================================================
   NAV BAR
   ============================================================ */
header#header.main { height: var(--td-nav-h) !important; background: linear-gradient(180deg, rgba(4,7,20,0.98) 0%, rgba(4,7,20,0.90) 100%) !important; backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%); border-bottom: 1px solid rgba(255,255,255,0.07) !important; box-shadow: 0 2px 20px rgba(0,0,0,0.6) !important; }
header#header.main .hbox { height: var(--td-nav-h) !important; }
header#header.main .hbox .logo { background: transparent !important; }
.head-main-nav ul.main-header > li > a { color: rgba(255,255,255,0.78) !important; font-size: 14px; font-weight: 500; }
.head-main-nav ul.main-header > li > a:hover, .head-main-nav ul.main-header > li.current-menu-item > a { color: #fff !important; }
.head-main-nav ul.main-header li ul.sub-menu { background: rgba(4,7,20,0.98) !important; border: 1px solid var(--td-border); border-radius: var(--td-r-md); box-shadow: 0 12px 40px rgba(0,0,0,0.8); z-index: 200 !important; position: absolute !important; }
.head-main-nav ul.main-header li ul.sub-menu li a { color: rgba(255,255,255,0.65) !important; }
.head-main-nav ul.main-header li ul.sub-menu li a:hover { color: #fff !important; background: rgba(255,255,255,0.06); }
.head-main-nav ul.main-header li:hover > ul.sub-menu { display: block !important; }
.head-main-nav ul.main-header > li.dp-open > ul.sub-menu { display: block !important; }
header#header.main .hbox .search form { background: rgba(255,255,255,0.08) !important; border: 1px solid rgba(255,255,255,0.12) !important; border-radius: 20px !important; }
header#header.main .hbox .search form:focus-within { background: rgba(255,255,255,0.12) !important; }
header#header.main .hbox .search form input[type="text"] { color: #fff !important; }
header#header.main .hbox .search form input[type="text"]::placeholder { color: rgba(255,255,255,0.35) !important; }
header#header.main .hbox .search form button[type="submit"] { color: rgba(255,255,255,0.55) !important; background: transparent !important; }
.live-search ul { background: rgba(4,7,20,0.97) !important; border: 1px solid var(--td-border) !important; border-radius: var(--td-r-md); box-shadow: 0 12px 40px rgba(0,0,0,0.8); }
.live-search ul li { border-bottom: 1px solid var(--td-border) !important; }
.live-search ul li:hover { background: rgba(255,255,255,0.05) !important; }
.live-search ul li .title { color: #fff !important; }
.live-search ul li .other-name { color: var(--td-muted) !important; }
.dtuser a.clicklogin { color: rgba(255,255,255,0.8) !important; border-left: 1px solid var(--td-border) !important; }
.dtuser .gravatar { border-left: 1px solid var(--td-border) !important; }

/* Responsive header */
.fixheadresp header.responsive { background: rgba(4,7,20,0.99) !important; border-bottom: 1px solid var(--td-border) !important; }
header.responsive a { color: #fff !important; }
.menuresp .menu { background: rgba(4,7,20,0.99) !important; }
.menuresp .menu ul.resp li { border-bottom: 1px solid var(--td-border) !important; }
.menuresp .menu ul.resp li a { color: rgba(255,255,255,0.75) !important; }
.menuresp .menu ul.resp li a:hover { color: #fff !important; background: rgba(255,255,255,0.05) !important; }
.menuresp .menu .user .logout a:hover { background: var(--td-red) !important; }
.menuresp .menu .user a.ctgs { background: var(--td-red) !important; color: #fff !important; }
form.form-resp-ab { background: rgba(4,7,20,0.98) !important; border: none !important; }
form.form-resp-ab input[type="text"], form.form-resp-ab button[type="submit"] span { color: #fff !important; }

/* ============================================================
   MODULE / CONTENT SECTIONS
   ============================================================ */
.module { background: transparent !important; border: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.module .content { background: transparent !important; border-color: transparent !important; }
.module .content.right, .module .content.rigth.csearch { border-right: none !important; }
.module .content.left, .module .content.left.csearch { border-left: none !important; }
.module .content .items { border-color: transparent !important; }
.module .sidebar { background: transparent !important; }
.module .content header h1, .module .content header h2 { color: #fff !important; border-left: 3px solid var(--td-red) !important; padding-left: 12px; font-weight: 600; }
.module .content header span a.see-all { background: transparent !important; color: var(--td-red-h) !important; border: 1px solid var(--td-red) !important; border-radius: 20px !important; padding: 3px 12px; font-size: 12px; }
.module .content header span a.see-all:hover { background: var(--td-red) !important; color: #fff !important; }
#contenedor { position: static !important; z-index: auto !important; }

/* ============================================================
   POSTER CARDS
   Minimal overrides — let the theme handle all positioning.
   Only change: background transparent (prevents dark #000 bleed)
   and remove the hover blur/brightness that sticks on mobile touch.
   ============================================================ */
.module .content .items .item { background: transparent !important; }
.module .content .items .item .poster { background: transparent !important; }

/* Remove hover image blur — theme does blur(2px) brightness(.3) on hover
   which sticks permanently on mobile touch devices = looks like dark overlay */
.module .content .items .item .poster:hover > img,
.module .content .items .item .poster > img {
  -webkit-filter: none !important;
  filter: none !important;
}

/* Hover: keep scale but no blur/darken */
.module .content .items .item .poster:hover > img {
  -webkit-transform: scale(1.05) !important;
  transform: scale(1.05) !important;
}

/* Rating badge: colors only, keep theme's position/animation */
.module .content .items .item .poster .rating {
  background: rgba(0,0,0,0.75) !important;
  color: var(--td-gold) !important;
}

/* Type/quality badges */
span.item_type { background: var(--td-red) !important; color: #fff !important; }
span.quality { background: rgba(0,0,0,0.75) !important; color: #fff !important; }
.featu { background: var(--td-red) !important; color: #fff !important; }

/* Card data */
.module .content .items .item .data h3, .module .content .items .item .data h3 a { color: #fff !important; }
.module .content .items .item .data span { color: var(--td-muted) !important; }

/* Hover info card */
.module .content .items .item .dtinfo { background: var(--td-surface) !important; border: 1px solid rgba(255,255,255,0.12) !important; border-radius: var(--td-r-md) !important; box-shadow: 0 16px 48px rgba(0,0,0,0.85) !important; }
.dtinfo .title, .dtinfo .title i, .dtinfo .title h4 { color: #fff !important; }
.dtinfo .texto { color: rgba(255,255,255,0.5) !important; border-color: var(--td-border) !important; }
.dtinfo .texto .degradado { background-image: linear-gradient(rgba(0,0,0,0), var(--td-surface)) !important; }
.dtinfo .metadata { background: rgba(255,255,255,0.06) !important; color: var(--td-muted) !important; }
.dtinfo .metadata span.imdb { background: rgba(0,0,0,0.6) !important; color: #fff !important; border-radius: 3px; }
.dtinfo .genres .mta a { color: rgba(255,255,255,0.65) !important; border-color: var(--td-border) !important; }

/* ============================================================
   SLIDER (homepage legacy OWL slider)
   ============================================================ */
.slider { background: transparent !important; }
.slider article.item .image { background-color: var(--td-surface) !important; }
.slider article.item .image .data { background-image: linear-gradient(rgba(0,0,0,0), rgba(4,7,20,0.95)) !important; }
.slider article.item .image .data h3.title { color: #fff !important; font-weight: 600; }
.slider article.item .image .data span { color: rgba(255,255,255,0.65) !important; }

/* ============================================================
   HERO SLIDER (#dp-hero)
   ============================================================ */
#dp-hero {
  position: relative !important;
  width: 100%;
  height: 90vh;
  min-height: 520px;
  max-height: 780px;
  overflow: hidden !important;
  background: var(--td-bg);
  /* Break out of contenedor max-width */
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  width: 100vw !important;
  max-width: 100vw !important;
}

#dp-hero .dp-hero__slide {
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  opacity: 0;
  transition: opacity 0.9s ease;
  pointer-events: none;
}

#dp-hero .dp-hero__slide.is-active { opacity: 1; pointer-events: auto; }
/* Note: first slide gets is-active class from PHP, no :first-child needed */

#dp-hero .dp-hero__bg {
  position: absolute !important; inset: 0 !important;
  background-size: cover !important; background-position: center 20% !important;
  transform: scale(1.04); transition: transform 8s ease;
}

#dp-hero .dp-hero__slide.is-active .dp-hero__bg { transform: scale(1); }

#dp-hero .dp-hero__overlay {
  position: absolute !important; inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(to top, rgba(4,7,20,0.97) 0%, rgba(4,7,20,0.65) 30%, rgba(4,7,20,0.2) 70%, rgba(4,7,20,0.05) 100%) !important;
}

/* Content anchored to bottom — uses #dp-hero for max specificity */
#dp-hero .dp-hero__content {
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  padding: 0 5% 80px !important;
  gap: 14px !important;
  pointer-events: none !important;
  z-index: 5 !important;
}

#dp-hero .dp-hero__info,
#dp-hero .dp-hero__actions,
#dp-hero .dp-hero__btn,
#dp-hero .dp-hero__dots,
#dp-hero .dp-hero__arrow { pointer-events: auto !important; }
/* NO position:relative or z-index here - would create stacking context
   that escapes parent slide's opacity:0, making content visible on hidden slides */

#dp-hero .dp-hero__title { color: #fff !important; font-size: clamp(1.8rem, 5vw, 3.2rem) !important; font-weight: 800 !important; line-height: 1.1 !important; margin: 0 0 4px !important; }
#dp-hero .dp-hero__genres { color: rgba(255,255,255,0.5); font-size: 13px; margin: 0 0 4px; }
#dp-hero .dp-hero__desc { color: rgba(255,255,255,0.72); font-size: 14px; line-height: 1.65; margin: 0; max-width: 480px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
#dp-hero .dp-hero__meta { display: flex; align-items: center; gap: 10px; }
#dp-hero .dp-hero__badge { background: var(--td-red); color: #fff; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 3px; }
#dp-hero .dp-hero__year, #dp-hero .dp-hero__rating { color: rgba(255,255,255,0.55); font-size: 13px; }
#dp-hero .dp-hero__rating { color: var(--td-gold); }

#dp-hero .dp-hero__actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

#dp-hero .dp-hero__btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 6px; font-size: 15px; font-weight: 700; text-decoration: none; cursor: pointer; border: none; transition: all 0.2s ease; }
#dp-hero .dp-hero__btn--watch { background: #fff; color: var(--td-bg) !important; }
#dp-hero .dp-hero__btn--watch:hover { background: rgba(255,255,255,0.88); color: var(--td-bg) !important; }
#dp-hero .dp-hero__btn--list { background: rgba(255,255,255,0.12); color: #fff !important; border: 1px solid rgba(255,255,255,0.3); backdrop-filter: blur(8px); }
#dp-hero .dp-hero__btn--list:hover { background: rgba(255,255,255,0.22); color: #fff !important; }
#dp-hero .dp-hero__btn--list.in-list { background: var(--td-green) !important; border-color: var(--td-green) !important; color: #fff !important; }
#dp-hero .dp-hero__btn--list .icon-check { display: none; }
#dp-hero .dp-hero__btn--list.in-list .icon-plus { display: none; }
#dp-hero .dp-hero__btn--list.in-list .icon-check { display: block; }

#dp-hero .dp-hero__dots { position: absolute; bottom: 28px; right: 5%; display: flex; gap: 8px; z-index: 20; pointer-events: auto; }
#dp-hero .dp-hero__dot { width: 8px; height: 8px; border-radius: 50%; border: none; background: rgba(255,255,255,0.3); cursor: pointer; padding: 0; transition: all 0.3s ease; pointer-events: auto; }
#dp-hero .dp-hero__dot.is-active { background: #fff; width: 24px; border-radius: 4px; }
#dp-hero .dp-hero__arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 20; background: rgba(0,0,0,0.45); border: 1px solid rgba(255,255,255,0.15); border-radius: 50%; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; color: #fff; cursor: pointer; opacity: 0; transition: opacity 0.2s; backdrop-filter: blur(6px); pointer-events: auto; }
#dp-hero:hover .dp-hero__arrow { opacity: 1; }
#dp-hero .dp-hero__arrow--prev { left: 20px; }
#dp-hero .dp-hero__arrow--next { right: 20px; }

#dp-hero .dp-hero__poster { flex-shrink: 0; width: 130px; border-radius: 10px; overflow: hidden; display: none; }
#dp-hero .dp-hero__poster img { width: 100%; display: block; }
@media (min-width: 900px) { #dp-hero .dp-hero__poster { display: block; } }

/* Slide-list button in legacy slider */
.slide-list-btn { position: absolute; bottom: 52px; right: 14px; z-index: 10; display: inline-flex; align-items: center; gap: 7px; background: rgba(0,0,0,0.70); border: 1px solid rgba(255,255,255,0.22); border-radius: var(--td-r-sm); padding: 7px 14px; color: #fff !important; font-size: 13px; font-weight: 600; text-decoration: none; opacity: 0; transition: all var(--td-tr); }
.slider article.item:hover .slide-list-btn { opacity: 1; }
.slide-list-btn.in-list { background: var(--td-green) !important; border-color: var(--td-green) !important; }

/* Mobile hero */
@media (max-width: 768px) {
  #dp-hero { margin-left: -20px !important; margin-right: -20px !important; width: calc(100% + 40px) !important; max-width: none !important; height: 70vh !important; min-height: 320px !important; max-height: 550px !important; }
  #contenedor { margin-top: 53px !important; }
}

@media (max-width: 600px) {
  #dp-hero .dp-hero__content { padding: 0 16px 72px !important; gap: 8px !important; }
  #dp-hero .dp-hero__title { font-size: clamp(1.2rem, 5.5vw, 1.7rem) !important; }
  #dp-hero .dp-hero__genres, #dp-hero .dp-hero__desc, #dp-hero .dp-hero__poster { display: none !important; }
  #dp-hero .dp-hero__btn { padding: 10px 14px !important; font-size: 13px !important; }
  #dp-hero .dp-hero__arrow { display: none; }
}

/* ============================================================
   SINGLE – series/episode pages
   ============================================================ */
#single { background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border: none !important; }
#single .content { background: transparent !important; }
#single .content.right { border-right: none !important; }
#single .content.left { border-left: none !important; }
#single .sidebar { background: transparent !important; }

.sheader, .sheader .poster { background: transparent !important; }
.sheader { border-bottom: 1px solid var(--td-border) !important; padding: 36px 25px 28px; position: relative; }
.sheader .poster img { border-radius: var(--td-r-lg); box-shadow: 0 20px 60px rgba(0,0,0,0.75); }
.sheader .data h1 { color: #fff !important; font-weight: 700; }
.sheader .data .extra span.date { color: var(--td-muted) !important; }

.sgeneros { overflow: visible !important; display: flex !important; flex-wrap: wrap !important; gap: 6px !important; padding: 8px 0 4px !important; }
.sgeneros a { color: rgba(255,255,255,0.75) !important; background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.16) !important; border-radius: 20px !important; padding: 4px 13px; font-size: 12px; font-weight: 500; }
.sgeneros a:hover { background: var(--td-red) !important; border-color: var(--td-red) !important; color: #fff !important; }

.single_tabs { border-bottom: 1px solid var(--td-border) !important; }
ul.smenu { background: transparent !important; }
ul.smenu li a { color: var(--td-muted) !important; background: transparent !important; border-bottom: 2px solid transparent; padding: 12px 18px; font-size: 14px; font-weight: 500; }
ul.smenu li a:hover { color: rgba(255,255,255,0.85) !important; background: transparent !important; }
ul.smenu li a.selected, ul.smenu li a.selected:hover { color: #fff !important; background: transparent !important; border-bottom-color: var(--td-red) !important; }

#single .content .sbox { background: transparent !important; border-color: var(--td-border) !important; }
.sbox h1, .sbox h2 { color: #fff !important; border-color: var(--td-border) !important; font-weight: 600; }
.wp-content { color: rgba(255,255,255,0.65); line-height: 1.75; border-bottom: 1px solid var(--td-border) !important; }
.custom_fields { border-bottom: 1px solid var(--td-border) !important; }
.custom_fields b.variante { color: var(--td-muted) !important; font-weight: 400; }
.custom_fields span.valor strong { color: #fff !important; background: rgba(255,255,255,0.08) !important; border: none !important; padding: 2px 8px; border-radius: 3px; }
.sbox h1.epih1 { color: #fff !important; font-weight: 700; border-bottom: none; }
.sbox h3.epih3 { color: var(--td-muted); font-weight: 400; }

/* Rating */
.srating { border-color: var(--td-border) !important; }
.srating .promedio { background: rgba(255,255,255,0.06) !important; color: #fff !important; }
.srating .rdata .stars span.rating-stars-b { color: var(--td-gold) !important; }
.srating .rdata .stars span.rating-stars-a { color: rgba(255,255,255,0.15) !important; }
.srating .rdata .votes { color: var(--td-muted) !important; }

/* ============================================================
   SEASONS & EPISODES LIST
   ============================================================ */
#serie_contenido { background: transparent !important; }
#seasons .se-c .se-q { background: rgba(255,255,255,0.04) !important; border-radius: var(--td-r-sm); margin-bottom: 3px; }
#seasons .se-c .se-q:hover { background: rgba(255,255,255,0.07) !important; }
#seasons .se-c .se-q span.title { color: #fff !important; font-weight: 600; }
#seasons .se-c .se-q span.se-t { background: rgba(255,255,255,0.08) !important; color: rgba(255,255,255,0.65) !important; border-radius: 3px; }
#seasons .se-c .se-q span.se-o { background: var(--td-red) !important; color: #fff !important; border-radius: 3px; font-weight: 700; }

#seasons .se-c .se-a ul.episodios { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; padding: 12px 0 8px; float: none !important; width: 100% !important; }
#seasons .se-c .se-a ul.episodios li { float: none !important; width: 100% !important; padding: 0 !important; border: none !important; background: var(--td-card); border-radius: var(--td-r-md); overflow: hidden; display: flex !important; align-items: center; position: relative; transition: background var(--td-tr); cursor: pointer; }
#seasons .se-c .se-a ul.episodios li:hover { background: #1a1f2a !important; }
#seasons .se-c .se-a ul.episodios li .imagen { flex-shrink: 0; width: 120px; height: 70px; overflow: hidden; position: relative; float: none !important; margin: 0 !important; }
#seasons .se-c .se-a ul.episodios li .imagen img { width: 100%; height: 100%; object-fit: cover; display: block; }
#seasons .se-c .se-a ul.episodios li .numerando { position: absolute; top: 6px; left: 6px; background: rgba(0,0,0,0.75); color: rgba(255,255,255,0.85) !important; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 3px; border: none !important; width: auto !important; float: none !important; margin: 0 !important; z-index: 2; }
#seasons .se-c .se-a ul.episodios li .episodiotitle { flex: 1; padding: 10px 14px !important; position: static !important; width: auto !important; float: none !important; }
#seasons .se-c .se-a ul.episodios li .episodiotitle a { color: rgba(255,255,255,0.88) !important; font-size: 13px; font-weight: 500; display: block !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#seasons .se-c .se-a ul.episodios li .episodiotitle a:visited { color: rgba(249,168,37,0.75) !important; }
#seasons .se-c .se-a ul.episodios li:hover .episodiotitle a { color: #fff !important; }
#seasons .se-c .se-a ul.episodios li .episodiotitle span.date { color: var(--td-muted) !important; font-size: 11px; display: block !important; margin-top: 4px; }
@media (max-width: 600px) { #seasons .se-c .se-a ul.episodios { grid-template-columns: 1fr; } }

/* ============================================================
   PLAYER
   ============================================================ */
.dooplay_player { border-radius: var(--td-r-md); overflow: hidden; }
.dooplay_player .play, .dooplay_player .play .pframe, .dooplay_player .play .preplayer { background: #000 !important; }
.dooplay_player h2 { background: rgba(0,0,0,0.55) !important; border-bottom: 1px solid var(--td-border) !important; color: #fff !important; }
.dooplay_player h2 span { color: var(--td-muted) !important; }
.dooplay_player h2 span.flashit { color: var(--td-gold) !important; }
.dooplay_player .options { background: rgba(4,7,20,0.6) !important; }
.dooplay_player .options ul li { background: transparent !important; border-bottom: 1px solid var(--td-border) !important; }
.dooplay_player .options ul li:hover { background: rgba(255,255,255,0.04) !important; }
.dooplay_player .options ul li span.title { color: #fff !important; }
.dooplay_player .options ul li:hover span.title { color: var(--td-red-h) !important; }
.dooplay_player .options ul li span.server { color: var(--td-muted) !important; font-size: 12px; }
.dooplay_player .options ul li i { color: rgba(255,255,255,0.2) !important; }
.dooplay_player .options ul li.on, .dooplay_player .options ul li.on:hover { background: rgba(0,99,229,0.12) !important; }
.dooplay_player .options ul li.on i, .dooplay_player .options ul li.on span.title { color: var(--td-red-h) !important; }

/* Episode prev/next */
.pag_episodes .item { border-right: 1px solid var(--td-border) !important; }
.pag_episodes .item a { color: rgba(255,255,255,0.65) !important; background: rgba(255,255,255,0.03) !important; transition: all var(--td-tr); }
.pag_episodes .item a:hover { color: #fff !important; background: rgba(0,99,229,0.15) !important; }
.pag_episodes .item a i { color: #fff !important; }

/* ============================================================
   USER CONTROL BUTTONS
   ============================================================ */
.user_control { display: flex !important; align-items: center !important; gap: 10px !important; float: none !important; padding: 12px 0 4px !important; position: static !important; transform: none !important; }
.user_control a.process_list, .user_control a.process_views { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: rgba(255,255,255,0.10) !important; color: #fff !important; border: 1px solid rgba(255,255,255,0.18) !important; border-right: 1px solid rgba(255,255,255,0.18) !important; border-radius: var(--td-r-sm) !important; padding: 9px 18px !important; font-size: 13px !important; font-weight: 600 !important; float: none !important; margin: 0 !important; }
.user_control a.process_list span, .user_control a.process_views span { display: none !important; }
.user_control a .tooltiptext { display: none !important; }
.user_control a.process_list::after { content: "Ma Liste"; font-size: 13px; font-weight: 600; }
.user_control a.process_views::after { content: "Regardé"; font-size: 13px; font-weight: 600; }
.user_control a.process_list:hover, .user_control a.process_views:hover { background: rgba(255,255,255,0.18) !important; }
.user_control a.process_list.in-list, .user_control a.process_list.in-list:hover { background: var(--td-green) !important; border-color: var(--td-green) !important; color: #fff !important; }
.user_control a.process_views.in-views, .user_control a.process_views.in-views:hover { background: var(--td-green) !important; border-color: var(--td-green) !important; color: #fff !important; }

/* ============================================================
   SIDEBAR
   ============================================================ */
.sidebar aside.widget { background: rgba(255,255,255,0.03); border: 1px solid var(--td-border); border-radius: var(--td-r-md); padding: 14px; margin-bottom: 12px; }
.sidebar aside.widget h2.widget-title { color: #fff !important; font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; border-bottom: 1px solid var(--td-border); padding-bottom: 8px; margin-bottom: 10px; }
.sidebar aside.widget ul li { border-bottom: 1px solid var(--td-border) !important; }
.sidebar aside.widget ul li a { color: rgba(255,255,255,0.5) !important; }
.sidebar aside.widget ul li a:hover { color: #fff !important; }
.sidemenu ul.genres li { border-color: var(--td-border) !important; }
.sidemenu ul.genres li a { color: rgba(255,255,255,0.55) !important; }
.sidemenu ul.genres li.current-cat a { color: #fff !important; font-weight: 500; }
.sidemenu ul.year li a { background: rgba(255,255,255,0.06) !important; color: rgba(255,255,255,0.55) !important; }
.sidemenu ul.year li a:hover { background: var(--td-red) !important; color: #fff !important; }

/* ============================================================
   FOOTER
   ============================================================ */
footer.main { color: var(--td-muted) !important; border-top: 1px solid var(--td-border) !important; }
footer.main .fcmpbox { background: rgba(4,7,20,0.9) !important; backdrop-filter: blur(12px) !important; box-shadow: none !important; }
footer.main .fcmpbox .primary { border-bottom: 1px solid var(--td-border) !important; }
footer.main .fbox .fmenu ul li a { color: var(--td-muted) !important; }
footer.main .fbox .fmenu ul li a:hover { color: #fff !important; }
span.top-page { position: fixed !important; bottom: 28px !important; right: 24px !important; z-index: 999 !important; }
span.top-page a { display: flex !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; border-radius: 50% !important; background: rgba(0,99,229,0.85) !important; color: #fff !important; box-shadow: 0 4px 20px rgba(0,99,229,0.4) !important; transition: all 0.25s ease !important; }
span.top-page a:hover { background: var(--td-red-h) !important; transform: translateY(-3px) !important; }

/* ============================================================
   PAGINATION / BREADCRUMB / LOGIN / MISC
   ============================================================ */
.pagination span { color: var(--td-muted) !important; border-color: transparent !important; background: transparent !important; }
.pagination span.current { background: var(--td-red) !important; border-color: var(--td-red) !important; color: #fff !important; }
.pagination a { color: var(--td-muted) !important; border-color: rgba(255,255,255,0.1) !important; background: rgba(255,255,255,0.04) !important; }
.pagination a:hover { background: rgba(0,99,229,0.2) !important; border-color: var(--td-red) !important; color: #fff !important; }
.dt-breadcrumb { background: rgba(255,255,255,0.02) !important; border-color: var(--td-border) !important; }
.dt-breadcrumb ol li a { color: var(--td-muted) !important; }
.login_box .box { background: rgba(4,7,20,0.98) !important; border-radius: var(--td-r-lg); }
.login_box .box input { background: rgba(255,255,255,0.07) !important; border: 1px solid rgba(255,255,255,0.12) !important; color: #fff !important; border-radius: var(--td-r-sm); }
.login_box .box input[type="submit"] { background: var(--td-red) !important; color: #fff !important; border: none !important; }
a.main { background: var(--td-red) !important; color: #fff !important; border-radius: var(--td-r-sm); }
.starstruck .star-on-png:before { color: var(--td-gold) !important; }
.starstruck .star-off-png:before { color: rgba(255,255,255,0.12) !important; }
.starstruck-rating-wrap { background: rgba(255,255,255,0.07) !important; color: #fff !important; }
.dtloadpage { background: rgba(4,7,20,0.97) !important; }
#oscuridad { background: rgba(4,7,20,0.7) !important; z-index: 999 !important; position: fixed !important; }
.fondo_dt { background: rgba(0,0,0,0.9) !important; z-index: 999 !important; }
.result-item article { border-bottom: 1px solid var(--td-border) !important; }
.result-item article .details .title a { color: rgba(255,255,255,0.85) !important; }
.result-item article .details .contenido p { color: var(--td-muted) !important; }
.no-result { color: rgba(255,255,255,0.4) !important; }
.no_fav { background: rgba(0,0,0,0.5) !important; color: rgba(255,255,255,0.5) !important; }
h1.heading-archive { color: #fff !important; }

/* ============================================================
   SEARCH RESULTS
   ============================================================ */
.result-item article { background: var(--td-card) !important; border-radius: var(--td-r-md) !important; border-bottom: none !important; margin-bottom: 10px !important; overflow: hidden !important; transition: background var(--td-tr) !important; padding: 0 0 0 120px !important; min-height: 90px !important; }
.result-item article:hover { background: #1a1f2a !important; }
.result-item article .image { width: 120px !important; height: 100% !important; top: 0 !important; left: 0 !important; }
.result-item article .image .thumbnail img { width: 120px !important; height: 100% !important; object-fit: cover !important; min-height: 90px !important; }
.result-item article .image .thumbnail span.tvshows { background: var(--td-red) !important; }
.result-item article .image .thumbnail span.movies { background: #8b5cf6 !important; }
.result-item article .details { padding: 12px 14px !important; }
.result-item article .details .title a { color: #fff !important; font-size: 15px !important; font-weight: 600 !important; }
.result-item article .details .meta span { font-size: 12px !important; padding: 2px 8px !important; background: rgba(255,255,255,0.07) !important; border-radius: 3px !important; color: rgba(255,255,255,0.65) !important; }
.result-item article .details .meta span.rating { background: rgba(249,168,37,0.15) !important; color: var(--td-gold) !important; }

/* ============================================================
   MOBILE BOTTOM NAV BAR
   Always in DOM, CSS controls visibility.
   ============================================================ */
html body #dp-bottom-nav { display: none; }

@media screen and (max-width: 768px) {
  html body #dp-bottom-nav {
    display: flex !important; position: fixed !important;
    bottom: 0 !important; left: 0 !important; right: 0 !important;
    width: 100% !important; height: 58px !important;
    z-index: 2147483647 !important;
    background: rgba(4,7,20,0.97) !important;
    border-top: 1px solid rgba(255,255,255,0.09) !important;
    backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px) !important;
    flex-direction: row !important; align-items: stretch !important; justify-content: space-around !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
    visibility: visible !important; opacity: 1 !important;
  }
  body.disney-dark-theme { padding-bottom: calc(62px + env(safe-area-inset-bottom, 0px)) !important; }
  span.top-page { bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; }
}

@media all and (display-mode: standalone) {
  html body #dp-bottom-nav { display: flex !important; }
  header#header.main { padding-top: env(safe-area-inset-top, 0px) !important; height: calc(var(--td-nav-h) + env(safe-area-inset-top, 0px)) !important; }
}

.dp-bn__item { flex: 1 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 3px !important; color: rgba(255,255,255,0.45) !important; text-decoration: none !important; font-size: 10px !important; font-weight: 500 !important; padding: 6px 4px !important; background: transparent !important; border: none !important; cursor: pointer !important; -webkit-tap-highlight-color: transparent !important; }
.dp-bn__item:hover, .dp-bn__item.active { color: #fff !important; }
.dp-bn__item.active .dp-bn__icon { color: var(--td-red) !important; }
.dp-bn__icon { font-size: 20px !important; line-height: 1 !important; }
.dp-bn__label { font-size: 10px !important; line-height: 1 !important; }

/* ============================================================
   CONTINUE WATCHING WIDGET
   ============================================================ */
.dp-cw { padding: 20px 0 8px; max-width: 1200px; margin: 0 auto; }
.dp-cw__header { display: flex; align-items: center; padding: 0 10px 12px; }
.dp-cw__title { color: #fff !important; font-size: 1.05rem !important; font-weight: 600; margin: 0; display: flex; align-items: center; gap: 8px; border-left: 3px solid var(--td-green) !important; padding-left: 12px !important; }
.dp-cw__row { display: flex; gap: 12px; overflow-x: auto; padding: 0 10px 12px; scrollbar-width: thin; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.dp-cw__item { flex: 0 0 160px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 8px; }
.dp-cw__poster-wrap { position: relative; border-radius: var(--td-r-md); overflow: hidden; display: block; aspect-ratio: 2/3; background: var(--td-card); border: 1px solid var(--td-border); transition: transform 0.25s ease; }
.dp-cw__poster-wrap:hover { transform: scale(1.04) translateY(-2px); }
.dp-cw__poster { width: 100%; height: 100%; object-fit: cover; display: block; }
.dp-cw__overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.35); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.2s; }
.dp-cw__poster-wrap:hover .dp-cw__overlay { opacity: 1; }
.dp-cw__play { color: #fff; font-size: 28px; }
.dp-cw__meta { position: absolute; bottom: 0; left: 0; right: 0; padding: 6px 8px; background: linear-gradient(transparent, rgba(0,0,0,0.85)); }
.dp-cw__ep { font-size: 11px; font-weight: 600; color: rgba(255,255,255,0.85); }
.dp-cw__name { color: rgba(255,255,255,0.85) !important; font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.dp-cw__next { display: inline-flex; align-items: center; gap: 4px; color: var(--td-green) !important; font-size: 11px; font-weight: 600; }

/* ============================================================
   PWA INSTALL BANNER
   ============================================================ */
#dp-pwa-banner { position: fixed; bottom: 0; left: 0; right: 0; z-index: 99998; background: rgba(13,17,23,0.97); border-top: 1px solid rgba(255,255,255,0.1); backdrop-filter: blur(20px); display: flex; align-items: center; gap: 14px; padding: 14px 20px; box-shadow: 0 -4px 24px rgba(0,0,0,0.5); animation: dpBannerSlide 0.4s ease; }
@keyframes dpBannerSlide { from { transform: translateY(100%); } to { transform: translateY(0); } }
.dp-pwa__icon { font-size: 28px; flex-shrink: 0; }
.dp-pwa__text { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.dp-pwa__text strong { color: #fff; font-size: 14px; font-weight: 600; }
.dp-pwa__text span { color: var(--td-muted); font-size: 12px; }
.dp-pwa__install { background: var(--td-red); color: #fff; border: none; border-radius: var(--td-r-sm); padding: 10px 20px; font-size: 13px; font-weight: 700; cursor: pointer; }
.dp-pwa__install:hover { background: var(--td-red-h); }
.dp-pwa__dismiss { background: transparent; border: none; color: var(--td-muted); font-size: 18px; cursor: pointer; padding: 4px 8px; }

/* ============================================================
   PRICING PAGE [dp_pricing]
   ============================================================ */
.dp-pricing { max-width: 1100px; margin: 40px auto; padding: 0 16px; }
.dp-pricing__heading { text-align: center; margin-bottom: 40px; }
.dp-pricing__heading h2 { color: #fff; font-size: clamp(1.6rem, 4vw, 2.4rem); font-weight: 800; }
.dp-pricing__heading p { color: var(--td-muted); font-size: 16px; }
.dp-pricing__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.dp-pricing__card { background: var(--td-card); border: 1px solid var(--td-border); border-radius: 18px; padding: 32px 28px; position: relative; transition: transform 0.25s ease; }
.dp-pricing__card:hover { transform: translateY(-4px); }
.dp-pricing__card.featured { border-color: var(--td-red); box-shadow: 0 0 0 1px var(--td-red), 0 12px 40px rgba(0,99,229,0.2); }
.dp-pricing__badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--td-red); color: #fff; font-size: 11px; font-weight: 700; padding: 4px 16px; border-radius: 20px; }
.dp-pricing__name { color: var(--td-muted); font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.dp-pricing__amount { color: #fff; font-size: 2.8rem; font-weight: 800; }
.dp-pricing__period { color: var(--td-muted); font-size: 13px; margin-bottom: 24px; }
.dp-pricing__features { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.dp-pricing__features li { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,0.75); font-size: 14px; }
.dp-pricing__features li::before { content: '✓'; color: var(--td-green); font-weight: 700; }
.dp-pricing__features li.no::before { content: '✕'; color: rgba(255,255,255,0.2); }
.dp-pricing__features li.no { color: rgba(255,255,255,0.3); }
.dp-pricing__cta { display: block; width: 100%; padding: 14px; border-radius: 10px; font-size: 15px; font-weight: 700; text-align: center; cursor: pointer; border: none; }
.dp-pricing__cta--primary { background: var(--td-red); color: #fff !important; }
.dp-pricing__cta--outline { background: transparent; color: rgba(255,255,255,0.75) !important; border: 1px solid rgba(255,255,255,0.2); }
.dp-faq__item { border-bottom: 1px solid var(--td-border); padding: 16px 0; }
.dp-faq__q { color: rgba(255,255,255,0.85); font-size: 15px; font-weight: 500; cursor: pointer; display: flex; justify-content: space-between; user-select: none; }
.dp-faq__q::after { content: '+'; font-size: 20px; color: var(--td-muted); transition: transform 0.2s; }
.dp-faq__item.open .dp-faq__q::after { transform: rotate(45deg); color: var(--td-red); }
.dp-faq__a { color: var(--td-muted); font-size: 14px; line-height: 1.7; max-height: 0; overflow: hidden; transition: max-height 0.3s ease, padding 0.3s ease; }
.dp-faq__item.open .dp-faq__a { max-height: 200px; padding-top: 10px; }

/* ============================================================
   EPISODE PROGRESS (series page)
   ============================================================ */
.dp-series-progress { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.06); border: 1px solid var(--td-border); border-radius: 20px; padding: 5px 14px; font-size: 12px; font-weight: 500; color: rgba(255,255,255,0.7); margin: 8px 0 0; }
.dp-series-progress__bar { width: 80px; height: 4px; background: rgba(255,255,255,0.12); border-radius: 2px; overflow: hidden; }
.dp-series-progress__fill { height: 100%; background: var(--td-green); border-radius: 2px; }
#seasons .se-c .se-a ul.episodios li.dp-watched { opacity: 0.55; }

/* Scrollbar */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--td-bg); }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.25); }

/* ════════════════════════════════════════════════════════════
   v2.0.1 – TARGETED FIXES
   ════════════════════════════════════════════════════════════ */

/* 1. White lines on series page
   Dark skin sets .srating { border-top: solid 1px #eceff5 } (light colour!)
   and .custom_fields, .srating { border-bottom: solid 1px rgba(255,255,255,.08) }
   Override both to use our dark border                                    */
.srating {
  border-top: 1px solid var(--td-border) !important;
  border-bottom: 1px solid var(--td-border) !important;
}

/* 2. Series page too dark
   Dark skin sets #single { background: rgb(15 15 15 / .85); backdrop-filter: blur(15px) }
   This creates a dark glass layer over the whole page                     */
#single {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
}

/* 3. Mobile poster dark overlay — touch devices get stuck in :hover state
   Only disable the blur+darken filter on touch devices (hover:none)       */
@media (hover: none), (pointer: coarse) {
  .poster:hover > img,
  .poster > img {
    -webkit-filter: none !important;
    filter: none !important;
    -webkit-transform: none !important;
    transform: none !important;
  }
}

/* 4. Continue watching posters — smaller to match poster card size */
.dp-cw__item { flex: 0 0 120px; }
.dp-cw__poster-wrap { aspect-ratio: 2/3; }

/* ════════════════════════════════════════════════════════════
   v2.0.2 – REMOVE WHITE LINES + FIX CONTINUE WATCHING SIZE
   ════════════════════════════════════════════════════════════ */

/* Remove ALL borders from srating and starstruck completely */
.srating,
.starstruck-wrap,
.srating .promedio {
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  border-left: none !important;
  border-right: none !important;
}

/* Also remove the white line that appears above srating from sheader */
.sheader { border-bottom: none !important; }

/* Remove white borders from all custom_fields rows */
.custom_fields { border-bottom: 1px solid rgba(255,255,255,0.06) !important; }

/* Remove white line from wp-content bottom border */
.wp-content { border-bottom: 1px solid rgba(255,255,255,0.06) !important; }

/* Continue Watching — fix card sizes to match poster cards */
.dp-cw__item {
  flex: 0 0 120px !important;
  max-width: 120px !important;
}

.dp-cw__poster-wrap {
  width: 120px !important;
  height: 180px !important; /* 2:3 ratio at 120px wide */
  aspect-ratio: unset !important;
}

.dp-cw__poster {
  width: 120px !important;
  height: 180px !important;
  object-fit: cover !important;
}

/* ════════════════════════════════════════════════════════════
   v2.0.3 – GENRE WHITE LINES + MOBILE RATING DARK OVERLAY
   ════════════════════════════════════════════════════════════ */

/* 1. Genre tag separator lines
   The dark skin adds border-left to each .sgeneros a as a separator
   Our pill-style tags use a full border — the border-left from the dark skin
   stacks with ours creating a double/bright left edge on each tag.
   Remove the left-border separator since our pills already have full borders. */
.sgeneros a {
  border-left: 1px solid rgba(255,255,255,0.16) !important; /* already set, ensure no double */
}

/* The dark skin sets border-left: solid 1px rgba(255,255,255,.08) on .sgeneros a
   That's separate from our pill border. Since we use border-radius pills,
   the theme's separator is not needed. Remove it: */
.sgeneros {
  /* Override theme's height:19px which clips tags */
  height: auto !important;
}

/* Remove the vertical separator lines between genre tags in sheader */
.sheader .sgeneros a {
  border-left: 1px solid rgba(255,255,255,0.14) !important;
}

/* 2. Mobile poster rating dark overlay
   On touch devices, :hover state sticks after tap.
   The .rating has margin-bottom:-40px (hidden) that becomes 0 on hover (visible).
   On mobile this means tapping any card shows the dark rating bar permanently.
   Fix: keep rating hidden on touch devices always. */
@media (hover: none), (pointer: coarse) {
  .poster .rating,
  .module .content .items .item .poster .rating {
    margin-bottom: -40px !important;  /* always hidden */
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* Also prevent the scale transform from sticking on touch */
  .poster:hover > img {
    -webkit-transform: none !important;
    transform: none !important;
  }
}

/* ════════════════════════════════════════════════════════════
   v2.0.4 – HERO MOBILE OVERFLOW FIX + MES FAVORIS WIDGET
   ════════════════════════════════════════════════════════════ */

/* 1. Prevent horizontal scroll caused by hero 100vw breakout
   100vw includes scrollbar width which can make page wider than viewport
   overflow-x:hidden on html clips anything that bleeds outside         */
html {
  overflow-x: hidden !important;
}

/* On mobile use a simpler breakout that can't cause horizontal scroll */
@media (max-width: 768px) {
  #dp-hero {
    /* Replace calc(-50vw+50%) with left/right relative to #contenedor */
    margin-left: -20px !important;
    margin-right: -20px !important;
    width: auto !important;
    max-width: none !important;
    left: 0 !important;
    right: 0 !important;
  }
}

/* 2. Mes Favoris widget — styled like other homepage module sections
   The [user_favorites] shortcode wraps content in a div with the
   widget text class. We target the container and its inner elements. */

/* Main container */
.widget_text:has(.dt-user-favorites),
.dt-user-favorites-wrap,
div[class*="user_favorites"],
div[class*="user-favorites"] {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Widget title row */
.dt-user-favorites .widget-title,
.dt-user-favorites-wrap .title,
.user-favorites-title,
.dt-user-favorites h2,
.dt-user-favorites h3 {
  color: #fff !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  border-left: 3px solid var(--td-red) !important;
  padding-left: 12px !important;
  margin-bottom: 16px !important;
  background: transparent !important;
  border-bottom: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* "Voir tout" link */
.dt-user-favorites a.view-all,
.dt-user-favorites-wrap a[class*="view"],
.user-favorites-title a,
.dt-user-favorites h2 a,
.dt-user-favorites h3 a {
  color: var(--td-red-h) !important;
  border: 1px solid var(--td-red) !important;
  border-radius: 20px !important;
  padding: 3px 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: all var(--td-tr) !important;
}

.dt-user-favorites a.view-all:hover,
.dt-user-favorites-wrap a[class*="view"]:hover {
  background: var(--td-red) !important;
  color: #fff !important;
}

/* The "not logged in" box */
.dt-user-favorites .not-logged,
.dt-user-favorites-wrap .not-logged,
.user-favorites-empty,
.dt-user-favorites .message {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid var(--td-border) !important;
  border-radius: var(--td-r-md) !important;
  padding: 20px !important;
  text-align: center !important;
  color: var(--td-muted) !important;
  font-size: 14px !important;
}

/* Login / Subscribe buttons inside the widget */
.dt-user-favorites .not-logged a,
.dt-user-favorites-wrap .not-logged a,
.user-favorites-empty a {
  display: inline-flex !important;
  align-items: center !important;
  margin: 4px 6px !important;
  padding: 9px 20px !important;
  border-radius: var(--td-r-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all var(--td-tr) !important;
}

.dt-user-favorites .not-logged a:first-of-type,
.user-favorites-empty a:first-of-type {
  background: var(--td-red) !important;
  color: #fff !important;
  border: none !important;
}

.dt-user-favorites .not-logged a:last-of-type,
.user-favorites-empty a:last-of-type {
  background: transparent !important;
  color: rgba(255,255,255,0.7) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}

/* Favorite items grid */
.dt-user-favorites .items,
.dt-user-favorites-wrap .items,
.user-favorites-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.dt-user-favorites .items .item,
.dt-user-favorites-wrap .items .item,
.user-favorites-grid .item {
  background: transparent !important;
  border: none !important;
}

/* "No favourites" empty message */
.dt-user-favorites .no-content,
.dt-user-favorites-wrap .no-content {
  color: var(--td-muted) !important;
  font-size: 14px !important;
  text-align: center !important;
  padding: 20px 0 !important;
}

/* Broad fallback for Mes Favoris widget — target by button text/structure
   visible in screenshot: white box with Se connecter / S'abonner buttons   */
.widget.widget_text {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

/* The white/light box containing the widget */
.widget_text .textwidget {
  background: transparent !important;
}

/* Style Se connecter / S'abonner buttons to match site style */
.widget_text .textwidget a[href*="sign-in"],
.widget_text .textwidget a[href*="login"],
.widget_text .textwidget a[href*="connexion"],
.widget_text .textwidget a:not([class]) {
  display: inline-flex !important;
  align-items: center !important;
  margin: 4px 5px !important;
  padding: 8px 18px !important;
  border-radius: var(--td-r-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all var(--td-tr) !important;
  color: rgba(255,255,255,0.75) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  background: transparent !important;
}

.widget_text .textwidget a[href*="sign-in"]:hover,
.widget_text .textwidget a[href*="login"]:hover {
  background: var(--td-red) !important;
  color: #fff !important;
  border-color: var(--td-red) !important;
}

/* The Mes Favoris title inside the widget — match module headings */
.widget_text .textwidget p:first-child,
.widget_text .textwidget h2,
.widget_text .textwidget h3,
.widget_text .textwidget h4 {
  color: #fff !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  border-left: 3px solid var(--td-red) !important;
  padding-left: 12px !important;
  margin-bottom: 12px !important;
}

/* ════════════════════════════════════════════════════════════
   MES FAVORIS WIDGET — exact classes from DevTools
   Structure: div.textwidget > div.favorites-widget >
              div.favorites-widget-header + div.no_fav
   ════════════════════════════════════════════════════════════ */

/* Remove the beige/tan background box */
.textwidget .favorites-widget {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Header row: "Mes Favoris" title + "Voir tout" button */
.textwidget .favorites-widget-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 0 12px 0 !important;
  background: transparent !important;
  border: none !important;
  margin-bottom: 0 !important;
}

/* "Mes Favoris" title text — match module section headings */
.textwidget .favorites-widget-header > *:first-child,
.textwidget .favorites-widget-header span,
.textwidget .favorites-widget-header div:not([class*="btn"]):not([class*="link"]):not([class*="view"]) {
  color: #fff !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  border-left: 3px solid var(--td-red) !important;
  padding-left: 12px !important;
  background: transparent !important;
}

/* "Voir tout" link — match the see-all button style */
.textwidget .favorites-widget-header a,
.textwidget .favorites-widget-header [class*="view"],
.textwidget .favorites-widget-header [class*="voir"] {
  color: var(--td-red-h) !important;
  border: 1px solid var(--td-red) !important;
  border-radius: 20px !important;
  padding: 3px 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  background: transparent !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
}

.textwidget .favorites-widget-header a:hover {
  background: var(--td-red) !important;
  color: #fff !important;
}

/* "Aucun contenu disponible" empty state */
.textwidget .favorites-widget .no_fav,
.textwidget .favorites-widget [class*="no-fav"],
.textwidget .favorites-widget [class*="empty"] {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid var(--td-border) !important;
  border-radius: var(--td-r-md) !important;
  color: var(--td-muted) !important;
  font-size: 14px !important;
  padding: 20px !important;
  text-align: center !important;
  margin: 0 !important;
}

/* Se connecter / S'abonner buttons inside the widget */
.textwidget .favorites-widget a[href*="sign-in"],
.textwidget .favorites-widget a[href*="login"],
.textwidget .favorites-widget a[href*="register"],
.textwidget .favorites-widget a[href*="abonnement"],
.textwidget .favorites-widget a[href*="landing"],
.textwidget .favorites-widget .no_fav a {
  display: inline-flex !important;
  align-items: center !important;
  margin: 6px 4px 0 !important;
  padding: 8px 18px !important;
  border-radius: var(--td-r-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

.textwidget .favorites-widget .no_fav a:first-of-type {
  background: var(--td-red) !important;
  color: #fff !important;
  border: none !important;
}

.textwidget .favorites-widget .no_fav a:first-of-type:hover {
  background: var(--td-red-h) !important;
}

.textwidget .favorites-widget .no_fav a:last-of-type {
  background: transparent !important;
  color: rgba(255,255,255,0.7) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}

.textwidget .favorites-widget .no_fav a:last-of-type:hover {
  background: rgba(255,255,255,0.08) !important;
  color: #fff !important;
}

/* When user IS logged in and has favourites — match poster card grid */
.textwidget .favorites-widget .items {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important;
  gap: 12px !important;
  padding: 0 !important;
}

.textwidget .favorites-widget .items .item {
  background: transparent !important;
  border: none !important;
  border-radius: var(--td-r-md) !important;
  overflow: hidden !important;
}

/* ════════════════════════════════════════════════════════════
   v2.0.5 – HERO OVERFLOW FIX (logged-in mobile)
   ════════════════════════════════════════════════════════════ */

/* Prevent ANY horizontal scroll on the whole page */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

/* Hero: replace 100vw breakout (causes shift when logged in)
   with a width:100% approach relative to #dt_contenedor     */
#dp-hero {
  /* Remove the calc breakout — use full width of parent instead */
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  /* Keep positioned so slides work */
  position: relative !important;
  left: auto !important;
  right: auto !important;
}

/* Make #dt_contenedor full width so hero fills it */
#dt_contenedor {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* Make #contenedor NOT constrain the hero
   The hero is a direct child of #contenedor
   We need #contenedor to allow full-width children */
#contenedor {
  overflow: visible !important;
}

/* But the hero itself clips its own content */
#dp-hero {
  overflow: hidden !important;
}

/* Content padding — ensure title doesn't get cut off on mobile */
@media (max-width: 600px) {
  #dp-hero .dp-hero__content {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-bottom: 72px !important;
  }
}

/* Arrows — ensure they're inside the hero bounds */
#dp-hero .dp-hero__arrow--prev { left: 12px !important; }
#dp-hero .dp-hero__arrow--next { right: 12px !important; }

/* WordPress admin bar compensation for logged-in users on mobile */
@media screen and (max-width: 600px) {
  body.admin-bar #dp-hero {
    /* WP admin bar is 46px on mobile (absolute positioned) */
    /* No extra offset needed since bar is position:absolute not fixed on mobile */
  }
  body.admin-bar #contenedor {
    margin-top: 53px !important;
  }
}

/* ════════════════════════════════════════════════════════════
   GENRES SIDEBAR — remove white lines, improve visibility
   ════════════════════════════════════════════════════════════ */

/* Remove ALL borders from sidebar list items */
.sidebar aside.widget ul li {
  border-bottom: none !important;
  border-top: none !important;
}

/* Remove the dark skin's widget li border too */
.widget ul li {
  border-bottom: none !important;
}

/* Make genre text clearly readable */
.sidebar aside.widget ul li a {
  color: rgba(255,255,255,0.80) !important;
  font-size: 13px !important;
  padding: 5px 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  transition: color 0.2s ease !important;
}

.sidebar aside.widget ul li a:hover { color: #fff !important; }

.sidebar aside.widget ul li.current-cat a,
.sidemenu ul.genres li.current-cat a {
  color: #fff !important;
  font-weight: 600 !important;
}

/* Genre count numbers */
.sidebar aside.widget ul li a span,
.sidebar aside.widget ul li a .count {
  color: var(--td-muted) !important;
  font-size: 12px !important;
  background: rgba(255,255,255,0.08) !important;
  border-radius: 10px !important;
  padding: 1px 7px !important;
  min-width: 26px !important;
  text-align: center !important;
}

/* Sidemenu specific */
.sidemenu ul.genres li {
  border-bottom: none !important;
  border-top: none !important;
}

.sidemenu ul.genres li a {
  color: rgba(255,255,255,0.80) !important;
  padding: 5px 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.sidemenu ul.genres li a:hover { color: #fff !important; }

/* Remove the circle bullet before genre items */
.sidemenu ul.genres li a:before,
.sidemenu ul.genres li i {
  color: rgba(255,255,255,0.25) !important;
}

.sidemenu ul.genres li.current-cat a:before,
.sidemenu ul.genres li:hover > a:before {
  color: var(--td-red) !important;
}

/* Widget box itself — slightly more visible */
.sidebar aside.widget {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
}

/* ════════════════════════════════════════════════════════════
   GENRES SIDEBAR — exact fix from DevTools
   Source: colors.default sets .dt_mainmeta nav.genres ul li { border-bottom: solid 1px #eceff5 }
   ════════════════════════════════════════════════════════════ */

/* Kill the white border line between genre items */
.dt_mainmeta nav.genres ul li,
.dt_mainmeta nav.genres ul li.cat-item {
  border-bottom: none !important;
  border-top: none !important;
}

/* Make genre text clearly readable */
.dt_mainmeta nav.genres ul li a {
  color: rgba(255,255,255,0.82) !important;
  padding: 5px 15px !important;
}

.dt_mainmeta nav.genres ul li a:hover {
  color: #fff !important;
}

/* Count numbers in genre list */
.dt_mainmeta nav.genres ul li a .count,
.dt_mainmeta nav.genres ul li .count {
  color: var(--td-muted) !important;
}

/* Landing page — disable all dark overlays from child theme */
body.page-template-landing #dt_contenedor::before { display: none !important; }
body.page-template-landing #dt_contenedor { background: transparent !important; }
body.page-template-landing .module { background: transparent !important; }

/* ════════════════════════════════════════════════════════════
   TURKDIZI UNIQUE VISUAL IDENTITY
   ════════════════════════════════════════════════════════════ */

/* ── 1. SOLID NAV — no glass blur ────────────────────────────── */
header#header.main {
  background: rgba(14,14,22,1) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  box-shadow: none !important;
}

/* ── 2. SECTION HEADINGS — caps + red underline ──────────────── */
.module .content header h1,
.module .content header h2 {
  border-left: none !important;
  padding-left: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--td-text) !important;
  padding-bottom: 8px !important;
  position: relative !important;
  display: inline-block !important;
}

.module .content header h1::after,
.module .content header h2::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 32px !important;
  height: 2px !important;
  background: var(--td-red) !important;
  border-radius: 0 !important;
}

/* ── 3. CARD TITLE OVERLAY — title inside poster with gradient ── */
/* Hide the below-card data title */
.module .content .items .item .data h3,
.module .content .items .item .data h3 a {
  display: none !important;
}

/* Add overlay gradient + title inside the poster */
.module .content .items .item .poster::after {
  content: attr(data-title);
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 28px 8px 8px !important;
  background: linear-gradient(transparent, rgba(14,14,22,0.92)) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #fff !important;
  line-height: 1.3 !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

/* Keep the date below — just styled more subtly */
.module .content .items .item .data span {
  font-size: 11px !important;
  color: rgba(240,236,228,0.40) !important;
}

/* ── 4. HERO — left-aligned, left-to-right gradient ─────────── */
#dp-hero .dp-hero__content {
  align-items: flex-start !important;
  padding: 0 8% 80px 5% !important;
  max-width: 600px !important;
}

/* Left-to-right gradient instead of bottom-up */
#dp-hero .dp-hero__overlay {
  background:
    linear-gradient(
      to right,
      rgba(14,14,22,0.97) 0%,
      rgba(14,14,22,0.80) 35%,
      rgba(14,14,22,0.30) 60%,
      rgba(14,14,22,0.05) 100%
    ),
    linear-gradient(
      to top,
      rgba(14,14,22,0.85) 0%,
      transparent 40%
    ) !important;
}

/* Hide poster thumbnail in hero — let backdrop fill fully */
#dp-hero .dp-hero__poster {
  display: none !important;
}

/* Slightly bolder title */
#dp-hero .dp-hero__title {
  font-size: clamp(2rem, 5.5vw, 3.8rem) !important;
  letter-spacing: -0.01em !important;
}

/* Mobile hero adjustments */
@media (max-width: 600px) {
  #dp-hero .dp-hero__content {
    max-width: 100% !important;
    padding: 0 16px 72px !important;
  }

  #dp-hero .dp-hero__overlay {
    background: linear-gradient(
      to top,
      rgba(14,14,22,0.97) 0%,
      rgba(14,14,22,0.60) 40%,
      rgba(14,14,22,0.15) 100%
    ) !important;
  }
}

/* ── 5. CARD HOVER — red top border accent ───────────────────── */
@media (hover: hover) and (pointer: fine) {
  .module .content .items .item:hover .poster::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: var(--td-red) !important;
    z-index: 5 !important;
    display: block !important;
    animation: none !important;
  }
}

/* ── 8. SEE-ALL BUTTON — caps style ──────────────────────────── */
.module .content header span a.see-all {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: var(--td-muted) !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 3px 0 !important;
  border-bottom: 1px solid rgba(240,236,228,0.2) !important;
}

.module .content header span a.see-all:hover {
  color: var(--td-text) !important;
  background: transparent !important;
  border-bottom-color: var(--td-red) !important;
}