/**
 * XNO — colores del player (Plyr / premium) sin tocar KPaja.
 * Solo cargar desde skin xn1.4. Subir a cdn-files: /files/css/premium-player-xn.css
 */
body.xno-skin .kp-prem-plyr-wrap .plyr,
body.xno-skin .kp-prem-player .plyr{
  --plyr-color-main:#2ee6a8;
  --plyr-range-fill-background:#2ee6a8;
  --plyr-range-thumb-background:#2ee6a8;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__progress input[type=range],
body.xno-skin .kp-prem-plyr-wrap .plyr__progress{
  color:#2ee6a8!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__progress input[type=range]::-webkit-slider-thumb{
  background:#2ee6a8!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__progress input[type=range]::-moz-range-progress{
  background:#2ee6a8!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__progress input[type=range]::-moz-range-thumb{
  background:#2ee6a8!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__control--overlaid:hover,
body.xno-skin .kp-prem-plyr-wrap .plyr__control--overlaid:focus{
  background:rgba(46,230,168,.9)!important;
  border-color:#fff;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before{
  background:#2ee6a8!important;
}
body.xno-skin .kp-yt-mini__played{
  background:#2ee6a8!important;
}
body.xno-skin .kp-pause-ad__close{
  background:#2ee6a8!important;
  color:#04140f!important;
}
body.xno-skin .kp-pause-ad__close:hover,
body.xno-skin .kp-pause-ad__close:active{
  background:#7dd3c0!important;
  color:#04140f!important;
}
body.xno-skin .opserver--guest-lock i{
  color:#2ee6a8!important;
}

/* Volumen: relleno blanco (WebKit usa gradient + --value; no aplastar con background sólido) */
body.xno-skin .kp-prem-plyr-wrap .plyr__controls .kp-yt-vol .plyr__volume,
body.xno-skin .kp-prem-plyr-wrap .plyr__controls .kp-yt-vol .plyr__volume input[type=range]{
  --plyr-color-main:#fff;
  --plyr-range-fill-background:#fff;
  --plyr-range-thumb-background:#fff;
  --plyr-range-track-background:rgba(255,255,255,.3);
  color:#fff!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__controls .kp-yt-vol .plyr__volume input[type=range]::-webkit-slider-runnable-track{
  height:4px!important;
  border:0!important;
  border-radius:2px!important;
  background-color:rgba(255,255,255,.28)!important;
  background-image:linear-gradient(to right,#fff var(--value,0%),transparent var(--value,0%))!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__controls .kp-yt-vol .plyr__volume input[type=range]::-webkit-slider-thumb{
  background:#fff!important;
  border:0!important;
  box-shadow:none!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__controls .kp-yt-vol .plyr__volume input[type=range]::-moz-range-track{
  background:rgba(255,255,255,.28)!important;
  height:4px!important;
  border:0!important;
  border-radius:2px!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__controls .kp-yt-vol .plyr__volume input[type=range]::-moz-range-progress{
  background:#fff!important;
  height:4px!important;
  border:0!important;
  border-radius:2px!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__controls .kp-yt-vol .plyr__volume input[type=range]::-moz-range-thumb{
  background:#fff!important;
  border:0!important;
  box-shadow:none!important;
}

/* Botón play grande (póster Video.js antes de Plyr) */
body.xno-skin #videoPlayer .vjs-big-play-button,
body.xno-skin .video-js .vjs-big-play-button{
  background:rgba(46,230,168,.92)!important;
  border-color:#2ee6a8!important;
  color:#04140f!important;
}
body.xno-skin #videoPlayer .vjs-big-play-button:hover,
body.xno-skin .video-js .vjs-big-play-button:hover{
  background:#2ee6a8!important;
  color:#04140f!important;
}
body.xno-skin #videoPlayer .vjs-big-play-button .vjs-icon-placeholder:before,
body.xno-skin .video-js .vjs-big-play-button .vjs-icon-placeholder:before{
  color:#04140f!important;
}

/* Progreso nativo Video.js (si aplica) */
body.xno-skin .video-js .vjs-play-progress,
body.xno-skin .video-js .vjs-volume-level{
  background-color:#2ee6a8!important;
}
body.xno-skin .video-js .vjs-slider:focus{
  box-shadow:0 0 0 1px #2ee6a8!important;
}

/* Controles: barrido abajo→arriba al mostrar, arriba→abajo al ocultar */
body.xno-skin .kp-prem-plyr-wrap .plyr__controls{
  opacity:1!important;
  visibility:visible!important;
  transform:translateY(0)!important;
  transition:
    opacity .32s ease,
    transform .32s ease,
    visibility 0s linear 0s!important;
  will-change:opacity,transform;
}
body.xno-skin .kp-prem-plyr-wrap .plyr--hide-controls .plyr__controls{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(18px)!important;
  transition:
    opacity .28s ease,
    transform .28s ease,
    visibility 0s linear .28s!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr__control--overlaid{
  transition:opacity .28s ease,transform .28s ease,visibility 0s linear 0s!important;
  transform:translateY(0) scale(1)!important;
}
body.xno-skin .kp-prem-plyr-wrap .plyr--hide-controls .plyr__control--overlaid{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(12px) scale(.96)!important;
  transition:opacity .24s ease,transform .24s ease,visibility 0s linear .24s!important;
}