/* MediaElement.js inside the fixed 16:9 frame rendered by shared/_video_embed.
   The player must fill the frame, so MediaElement's JS-computed pixel sizes
   are neutralized; letterboxing is handled natively by the <video> element.
   Fullscreen keeps MediaElement's own positioning untouched. */
.bf-video-frame .mejs__container:not(.mejs__container-fullscreen) {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

.bf-video-frame .mejs__container .mejs__layers,
.bf-video-frame .mejs__container .mejs__layer,
.bf-video-frame .mejs__container .mejs__mediaelement,
.bf-video-frame .mejs__container video {
  width: 100% !important;
  height: 100% !important;
}

/* Poster is a letterboxed frame of the video itself — contain, not cover,
   so vertical videos are not cropped. */
.bf-video-frame .mejs__poster {
  background-size: contain;
  background-color: #000;
}

/* MediaElement 7 made the big center play button a real <button>, but its CSS
   only sets cursor:pointer on the parent layer — the browser UA stylesheet's
   `button { cursor: default }` overrides the inherited value. */
.bf-video-frame .mejs__overlay-button {
  cursor: pointer;
}