/* == AP Optimizations for DooPlay ==
   - CLS reduction for player, ads, images
   - Safe defaults; adjust selectors if needed
*/

/* Reserve a stable box for the video player (16:9 by default) */
#playex, .player_sist, .playex, .player-wrap {
  aspect-ratio: 16 / 9;
  width: 100%;
  position: relative;
  overflow: hidden;
  max-width: 1200px;
  margin-inline: auto;
}

#playex iframe,
.player_sist iframe,
.playex iframe,
.player-wrap iframe,
#playex video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Ad slots get fixed minimum heights to avoid layout shift */
#ad-top, .ad-top, .banner-728, .ads_728 { min-height: 90px; }
.ad-300, .ads_300, .sidebar-ad-300 { min-height: 250px; }
.ad-336, .ads_336 { min-height: 280px; }
.ad-fluid, .ads-fluid { min-height: 320px; }
.ad-slot, .adsbygoogle, .ad-container, .dt-ads {
  display: block;
  width: 100%;
}

/* Thumbnails / posters: keep aspect ratio to avoid reflow while loading */
.thumb, .poster, .item .poster, .episodes .thumb, .module .content .items .poster {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

/* Avoid layout jumps when lazy assets load */
img[loading="lazy"], iframe[loading="lazy"] {
  background: transparent;
  contain: paint;
}

/* Small UX improvements */
html { scroll-behavior: smooth; }
:where(img,svg,video,canvas,iframe) { max-width: 100%; height: auto; }