/*
 * v2 VideoJS build 2.0
 *
 * YouTube, VK and controllable OK frames use the actual packaged Video.js 10
 * <video-player><video-skin><video> structure used by MP4/HLS/DASH. The iframe
 * only paints the provider picture; a transparent real <video> bridge exposes
 * the provider state to Video.js. No handwritten orange control bar is allowed.
 */

.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-media-host{
  background:#000!important;
}

.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-media-host,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin video-player.ugly-videojs10-player--provider,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-provider-stage,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-provider-iframe--standard,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-youtube-slot,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-youtube-slot>iframe{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:inherit!important;
  overflow:hidden!important;
}

.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin video-player.ugly-videojs10-player--provider{
  z-index:1!important;
  background:transparent!important;
  isolation:isolate;
}

/* Provider picture: lower layer. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-provider-stage,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-provider-iframe--standard,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-youtube-slot,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-youtube-slot>iframe{
  z-index:1!important;
  background:#000!important;
  object-fit:contain!important;
}

/* Packaged Video.js 10 skin: upper interactive layer, same host as MP4/HLS/DASH. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider{
  z-index:4!important;
  background:transparent!important;
  pointer-events:auto!important;
  visibility:visible!important;
  opacity:1!important;
  --media-border-radius:14px;
}

/* Real media element selected by Video.js. It remains measurable and event-capable,
 * but never paints over the provider iframe. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-provider-media-bridge{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  opacity:0!important;
  visibility:visible!important;
  pointer-events:none!important;
  background:transparent!important;
  object-fit:contain!important;
}

/* Once the API bridge is ready, every gesture/click belongs to Video.js 10. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin.has-provider-api .ugly-provider-iframe--standard,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin.has-provider-api .ugly-youtube-slot>iframe,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin.is-youtube-standard .ugly-youtube-slot>iframe{
  pointer-events:none!important;
}

/* During provider probing the standard skin is already visible, but the iframe may
 * still accept its initial provider activation. Video.js buttons remain above it. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin.is-provider-probing .ugly-provider-iframe--standard{
  pointer-events:auto!important;
}

/* If an arbitrary iframe exposes no usable control API, reveal only its own native
 * controls instead of leaving dead Video.js buttons. YouTube never enters this mode. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin.is-provider-native-fallback video-skin.ugly-videojs10-standard--provider,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider.is-native-provider-fallback{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin.is-provider-native-fallback .ugly-provider-iframe--standard{
  pointer-events:auto!important;
}

/* Authoritative removal of every legacy/custom provider control implementation.
 * This overrides old migration CSS loaded earlier in the page. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-controls,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-center-play,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-theme-tools,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-provider-hitarea,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-provider-native-mask,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-youtube-native-mask{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Player-owned title/report actions stay above the standard skin without changing it. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-topbar{
  z-index:20!important;
}
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-top-actions,
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-top-actions button{
  pointer-events:auto!important;
}
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin .ugly-skin-extension{
  z-index:21!important;
}

.ilyaugly-player[data-videojs10-player="1"].is-mobile-layout .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider{
  --media-border-radius:10px;
  border-radius:10px!important;
}
.ilyaugly-player[data-videojs10-player="1"].is-mobile-fullscreen .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider,
.ilyaugly-player[data-videojs10-player="1"].is-mobile-rotate-fullscreen .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider{
  --media-border-radius:0px;
  border-radius:0!important;
}


/* 2.0 R4: the provider stage is now a child of <video-skin>, so Video.js slots
 * picture and controls into one media-container instead of painting a black
 * skin surface over a sibling iframe. */
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider > .ugly-provider-stage{
  z-index:1!important;
  opacity:1!important;
  visibility:visible!important;
  display:block!important;
}
.ilyaugly-player[data-videojs10-player="1"] .ugly-vjs10-shell.uses-standard-provider-skin video-skin.ugly-videojs10-standard--provider > .ugly-provider-media-bridge{
  z-index:0!important;
}
