.video {
  background-color: rgb(var(--color-background));
}

.video .block-heading {
  width: 100%;
}

.video .theme-video-media__poster {
  background-color: #ffffff;
}

.video theme-video-media {
  height: 100%;
}

.video--fullscreen {
  background: #171613;
}

.video--fullscreen .theme-video-media__play-button {
  display: none;
}

@media (min-width: 960px) {
  .video--fullscreen {
    position: relative;
    display: block !important;
    width: 100%;
    max-width: none;
    min-height: calc(100svh - var(--mr-announcement-height, 38px));
    padding: 0 !important;
    overflow: hidden;
  }

  .video--fullscreen > .block-video,
  .video--fullscreen .block-video__media {
    position: absolute !important;
    inset: 0 !important;
  }

  .video--fullscreen > .block-video,
  .video--fullscreen .block-video__media,
  .video--fullscreen theme-video-media,
  .video--fullscreen .theme-video-media,
  .video--fullscreen .theme-video-media__poster,
  .video--fullscreen .theme-video-media__media {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: inherit;
    padding: 0 !important;
  }

  .video--fullscreen .theme-video-media {
    position: absolute;
    inset: 0;
    aspect-ratio: auto !important;
  }

  .video--fullscreen .theme-video-media video,
  .video--fullscreen .theme-video-media iframe,
  .video--fullscreen .theme-video-media__poster img,
  .video--fullscreen .theme-video-media__poster svg {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
  }
}

@media (max-width: 959px) {
  /* The selected Mobile aspect ratio now determines the section height. Keeping
     the block in normal flow also removes the editor-only white overflow that
     occurred when a 9:16 source was forced into a 16:9 absolute container. */
  .video--fullscreen {
    position: relative;
    display: block !important;
    width: 100%;
    max-width: none;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    aspect-ratio: auto !important;
  }

  .video--fullscreen > .block-video,
  .video--fullscreen .block-video__media {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
  }
}
