/* stylelint-disable selector-pseudo-class-no-unknown */
.container {
  border-radius: var(--sem-border-radius-s);
  border: var(--sem-border-width-xs) solid
    var(--sem-color-border-secondary-light-subtle);
  outline: var(--sem-border-width-l) solid transparent;
  transition:
    0.4s ease outline-color,
    0.4s ease box-shadow;
  overflow: hidden;
}

.container iframe {
  border: none;
  height: 100%;
  width: 100%;
}

.container :global(.react-player__preview) {
  position: relative;
}

.player {
  height: 100%;
  width: 100%;
}

.playerWrapper {
  width: 100%;
  position: relative;
}

.playerWrapper--landscape {
  aspect-ratio: 16 / 9;
}

.playerWrapper--portrait {
  aspect-ratio: 9 / 16;
}

.container:has(:global(.react-player__preview):focus) {
  outline-color: var(--sem-color-border-primary-light-default);
}

.container:has(:global(.react-player__preview):hover),
.container:has(:global(.react-player__preview):focus) {
  box-shadow: var(--elevation-05);
}

@media (--arc-custom-media-min-width-l-px) {
  .container {
    border: none;
  }
}