[data-cdm-fading-gallery] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: var(--cdm-fading-width, 100%);
  height: var(--cdm-fading-height, 300px);
  background: var(--cdm-fading-background, transparent);
  border-radius: var(--cdm-fading-radius, 0);
}

[data-cdm-fading-gallery] .cdm-fading-gallery__layer {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: var(--cdm-fading-position, center center);
  transition: opacity var(--cdm-fading-duration, 800ms) ease-in-out;
  pointer-events: none;
}

[data-cdm-fading-gallery] .cdm-fading-gallery__layer--current {
  opacity: var(--cdm-fading-opacity, 1);
}

[data-cdm-fading-gallery] .cdm-fading-gallery__layer--next {
  opacity: 0;
}

[data-cdm-fading-gallery].is-transitioning .cdm-fading-gallery__layer--current {
  opacity: 0;
}

[data-cdm-fading-gallery].is-transitioning .cdm-fading-gallery__layer--next {
  opacity: var(--cdm-fading-opacity, 1);
}

[data-cdm-fading-gallery].is-handing-off .cdm-fading-gallery__layer {
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-cdm-fading-gallery] .cdm-fading-gallery__layer {
    transition: none;
  }

  [data-cdm-fading-gallery] .cdm-fading-gallery__layer--next {
    display: none;
  }
}