/* === Basis-Layer ======================================================= */

/* Der Slide selbst soll ein Stacking-Kontext sein */
.carousel-item { position: relative; }

/* Container für Backgrounds */
.carousel-backgroundimage-container {
  position: relative;
  overflow: hidden;
}

/* Ebene, auf der Video/iFrame liegt */
.carousel-backgroundimage {
  position: relative;
  min-height: 100vh; /* echtes Vollformat */
}

/* Content über dem Background */
.carousel-content {
  position: relative;
  z-index: 1;
}

/* === Media: Video & iFrame ============================================ */

/* Lokale Videos: echtes Cover */
.carousel-bgvideo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  pointer-events: none; /* Carousel bleibt klickbar */
}

/* iFrames: Größe setzt JS auf Cover; Fallback: full stretch */
.carousel-bgiframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: none;
}

/* Optional: immer 100vh, auch wenn BP-Optionen fehlen */
.carousel-fullscreen .carousel-item,
.carousel-fullscreen .carousel-backgroundimage-container,
.carousel-fullscreen .carousel-backgroundimage {
  min-height: 100vh;
}

/* === Vollbleed (breiter als .container) =============================== */
/* Falls das CE in einer .container/.container-fluid liegt, auf 100vw
   „ausbrechen“, damit keine Ränder links/rechts bleiben. */
.container .carousel-fullscreen,
.container-fluid .carousel-fullscreen {
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  max-width: 100vw;
}

/* Horizontalen Overflow vermeiden (ohne modale o.ä. zu stören) */
html, body { overflow-x: clip; }

/* === (Optional) kleine Politur ======================================== */
/* Verhindert Subpixel-Lücken bei manchen Browsern/Zoomstufen */
.carousel-backgroundimage-container,
.carousel-backgroundimage,
.carousel-bgvideo,
.carousel-bgiframe { backface-visibility: hidden; }