/* Keep vertical YouTube videos contained while preserving Vidstack's no-controls crop. */
media-player[data-service="youtube"] media-provider {
  background: #000;
  overflow: hidden;
}

media-player[data-service="youtube"][data-video-orientation="portrait"] media-provider {
  position: relative;
}

media-player[data-service="youtube"][data-video-orientation="portrait"] iframe.vds-youtube {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: var(--youtube-contained-width, 31.640625%) !important;
  min-width: var(--youtube-contained-width, 31.640625%);
  max-width: 100%;
  transform: translate(-50%, -50%) !important;
}

media-player[data-service="youtube"][data-video-orientation="portrait"] iframe.vds-youtube[data-no-controls] {
  height: 1000% !important;
}
@media (max-width: 575.98px) {
  media-player[data-service="youtube"][data-video-orientation="portrait"]:not([data-fullscreen]) {
    aspect-ratio: var(--youtube-media-width, 9) / var(--youtube-media-height, 16);
    margin-left: auto;
    margin-right: auto;
    width: min(100%, calc(100vh * var(--youtube-portrait-ratio, 0.5625)));
    width: min(100%, calc(100svh * var(--youtube-portrait-ratio, 0.5625)));
  }

  media-player[data-service="youtube"][data-video-orientation="portrait"]:not([data-fullscreen]) media-provider {
    background: transparent;
  }

  media-player[data-service="youtube"][data-video-orientation="portrait"]:not([data-fullscreen]) iframe.vds-youtube {
    width: 100% !important;
    min-width: 100%;
    max-width: none;
  }
}
