wcp-video {
  --media-object-fit: contain;

  display: flex; /* close whitespace */
  position: relative;
  aspect-ratio: 1 / var(--ratio, 0.5625); /* 16/9 fallback */
}

wcp-video[preview] {
  --media-object-fit: cover;
}

wcp-video:not([preview]) .VideoButton {
  display: none;
}

wcp-video video {
  display: block;
}

wcp-video media-controller {
  width: 100%;
}

/* Hide the control bar in preview mode */
wcp-video[preview] media-control-bar {
  display: none;
}

/* Pause toggle — only visible during autoplay preview */
wcp-video wcp-autoplay-toggle {
  position: absolute;
  z-index: 3;
  bottom: 0;
  right: 0;
}

/* Hide toggle when not in autoplay preview */
wcp-video:not([preview]) wcp-autoplay-toggle,
wcp-video:not([autoplay]) wcp-autoplay-toggle {
  display: none;
}
