/*
 * Shared control-bar UI tokens and icon mapping.
 * Canonical source is the radio player control-bar visual style.
 */
:root {
  --stv-controlbar-surface: transparent;
  --stv-controlbar-surface-overlay: none;
  --stv-controlbar-surface-filter: none;
  --stv-controlbar-group-bubble-filter: blur(16px);
  --stv-controlbar-foreground: #ffffff;
  --stv-controlbar-accent: #d72638;
  --stv-controlbar-active-icon-color: #948FFF;
  --stv-controlbar-bubble-color: rgba(160, 160, 160, 0.33);
  --stv-controlbar-group-bubble-color: rgba(33, 33, 33, 0.66);
  --stv-controlbar-group-bubble-opacity: 8;
  --stv-controlbar-bubble-opacity-rest: 0.28;
  --stv-controlbar-bubble-opacity-hover: 0.72;
  --stv-controlbar-gap: 8px;
  --stv-controlbar-group-gap: 8px;
  --stv-controlbar-time-group-gap: 0px;
  --stv-controlbar-progress-height: 4px;
  --stv-controlbar-progress-gap: 14px;
  --stv-controlbar-bubble-inset: 4px;
  --stv-controlbar-control-bubble-inset: 0px;
  --stv-controlbar-group-bubble-inset: 0px;
  --stv-controlbar-group-bubble-padding: 4px;
  --stv-controlbar-icon-size: 18px;
  --stv-controlbar-volume-icon-size: 20px;
  --stv-controlbar-bubble-size: 32px;
  --stv-controlbar-padding-block-start: calc(
    var(--stv-controlbar-progress-height) + var(--stv-controlbar-progress-gap)
  );
  --stv-controlbar-padding-block-end: 8px;
  --stv-controlbar-height: calc(
    var(--stv-controlbar-padding-block-start)
    + var(--stv-controlbar-bubble-size)
    + (var(--stv-controlbar-group-bubble-padding) * 2)
    + var(--stv-controlbar-padding-block-end)
  );
  --stv-controlbar-padding-inline: 16px;
  --stv-controlbar-padding-inline-mobile: 12px;
  --stv-controlbar-volume-width: 84px;
  --stv-controlbar-volume-bubble-padding: var(--stv-controlbar-bubble-inset);
  --stv-controlbar-volume-bubble-padding-right: 10px;
  --stv-controlbar-captions-width: var(--stv-controlbar-bubble-size);
  --stv-controlbar-menu-width: var(--stv-controlbar-bubble-size);
  --stv-controlbar-captions-icon-size: var(--stv-controlbar-icon-size);
  --stv-controlbar-menu-icon-size: var(--stv-controlbar-icon-size);
  --stv-controlbar-fade-duration: 90ms;
  --stv-controlbar-tooltip-offset: 6px;
  --stv-controlbar-current-tooltip-offset: var(--stv-controlbar-tooltip-offset);
  --stv-live-chip-gap: 6px;
  --stv-live-chip-padding-y: 0px;
  --stv-live-chip-padding-x: 8px;
  --stv-live-chip-radius: 0px;
  --stv-live-chip-font-size: 16px;
  --stv-live-chip-font-weight: 400;
  --stv-live-chip-letter-spacing: 0;
  --stv-live-chip-background: transparent;
  --stv-live-chip-background-active: transparent;
  --stv-live-chip-background-inactive: transparent;
  --stv-live-chip-color: #ffffff;
  --stv-live-chip-color-active: #ffffff;
  --stv-live-chip-color-inactive: rgba(255, 255, 255, 0.8);
  --stv-live-chip-shadow: none;
  --stv-live-chip-dot-shadow: 0 0 3px 1px #ff463a;

}

.vjs-control[data-mouse-focus] {
  outline: none;
}

.stv-playback-feedback-layer {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 18;
}

.stv-playback-feedback {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: #fff;
  opacity: 0;
  transform: scale(0.92);
}

.stv-playback-feedback.is-animating {
  animation: stv-playback-feedback-fade var(--stv-playback-feedback-duration, 1150ms) ease forwards;
}

.stv-playback-feedback__icon-slot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px !important;
  height: 80px !important;
  min-width: 80px !important;
  min-height: 80px !important;
  max-width: 80px !important;
  max-height: 80px !important;
}

.stv-playback-feedback__svg {
  width: 80px !important;
  height: 80px !important;
  max-width: 80px !important;
  max-height: 80px !important;
  overflow: visible;
}

.stv-playback-feedback__text {
  font-family: Source Sans Pro, Arial, sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
}

.stv-playback-feedback__text.is-hidden {
  display: none;
}

@keyframes stv-playback-feedback-fade {
  0% {
    opacity: 0;
    transform: scale(0.92);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(1.02);
  }
}

.stv-live-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  gap: var(--stv-live-chip-gap);
  padding: var(--stv-live-chip-padding-y) var(--stv-live-chip-padding-x);
  border: none;
  border-radius: var(--stv-live-chip-radius);
  background: var(--stv-live-chip-background);
  color: var(--stv-live-chip-color);
  font-size: var(--stv-live-chip-font-size);
  font-weight: var(--stv-live-chip-font-weight);
  text-transform: none !important;
  letter-spacing: var(--stv-live-chip-letter-spacing);
  line-height: 1;
  position: relative;
  overflow: visible;
  height: var(--stv-controlbar-bubble-size);
  min-height: var(--stv-controlbar-bubble-size);
  transition: color 0.2s ease, opacity 0.2s ease;
  cursor: pointer !important;
}

.stv-live-chip.is-live {
  background: var(--stv-live-chip-background-active);
  color: var(--stv-live-chip-color-active);
  box-shadow: var(--stv-live-chip-shadow);
}

.stv-live-chip.is-behind {
  background: var(--stv-live-chip-background-inactive);
  color: var(--stv-live-chip-color-inactive);
  box-shadow: none;
}

.stv-live-chip:disabled {
  opacity: 0.45;
  cursor: default !important;
  box-shadow: none;
}

.stv-live-chip.is-disabled {
  cursor: default !important;
}

.stv-live-chip:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.9);
  outline-offset: 3px;
}

.stv-live-chip__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff463a;
  transition: opacity 0.2s ease;
}

.stv-live-chip.is-live .stv-live-chip__dot {
  background: #ff463a;
  box-shadow: var(--stv-live-chip-dot-shadow);
}

.stv-live-chip.is-behind .stv-live-chip__dot {
  background: rgba(255, 255, 255, 0.45);
  opacity: 1;
  box-shadow: none;
}

.stv-live-chip.is-live:disabled {
  opacity: 1;
  cursor: default;
  box-shadow: var(--stv-live-chip-shadow);
}

.stv-live-chip.is-live.is-disabled {
  opacity: 1;
  cursor: default !important;
  box-shadow: var(--stv-live-chip-shadow);
}

.stv-live-chip__label {
  font-size: 14px;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.stv-controlbar-volume {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  align-self: center;
  width: calc(
    var(--stv-controlbar-bubble-size)
    + var(--stv-controlbar-volume-width)
    + var(--stv-controlbar-volume-bubble-padding)
    + var(--stv-controlbar-volume-bubble-padding-right)
  );
  height: var(--stv-controlbar-bubble-size);
  min-height: var(--stv-controlbar-bubble-size);
  padding: 0 var(--stv-controlbar-volume-bubble-padding-right) 0 var(--stv-controlbar-volume-bubble-padding);
  position: relative;
  overflow: visible;
}

.stv-controlbar-volume::before,
.video-js .vjs-control-bar .vjs-volume-panel::before {
  content: '';
  position: absolute;
  inset: var(--stv-controlbar-control-bubble-inset);
  border-radius: 999px;
  background-color: var(--stv-controlbar-bubble-color);
  opacity: 0;
  pointer-events: none;
  transition: opacity 160ms ease;
  z-index: 0;
}

.stv-controlbar-volume > *,
.video-js .vjs-control-bar .vjs-volume-panel > * {
  position: relative;
  z-index: 1;
}

.stv-controlbar-volume__slider-tooltip {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  align-self: center;
  flex: 0 0 var(--stv-controlbar-volume-width);
  width: var(--stv-controlbar-volume-width);
  max-width: var(--stv-controlbar-volume-width);
  height: 100%;
  position: relative;
  overflow: visible;
}

.stv-controlbar-volume__slider {
  --volume-level: 100%;
  -webkit-appearance: none;
  appearance: none;
  flex: 0 0 var(--stv-controlbar-volume-width);
  width: var(--stv-controlbar-volume-width);
  max-width: var(--stv-controlbar-volume-width);
  height: var(--stv-controlbar-bubble-size);
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.96) var(--volume-level),
      rgba(255, 255, 255, 0.22) var(--volume-level)
    );
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 4px;
  outline: none;
  cursor: pointer;
  position: relative;
  z-index: 1;
}

.stv-controlbar-volume__slider:focus-visible {
  box-shadow: 0 0 0 2px rgba(215, 38, 56, 0.25);
}

.stv-controlbar-volume__slider::-webkit-slider-runnable-track {
  height: var(--stv-controlbar-bubble-size);
  background: transparent;
}

.stv-controlbar-volume__slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 0;
  height: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}

.stv-controlbar-volume__slider::-moz-range-thumb,
.stv-controlbar-volume__slider::-ms-thumb {
  width: 0;
  height: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}

.stv-controlbar-volume__slider::-moz-range-track,
.stv-controlbar-volume__slider::-ms-track {
  height: var(--stv-controlbar-bubble-size);
  border-radius: 999px;
  background: transparent;
}

.video-js .vjs-control-bar {
  background-color: var(--stv-controlbar-surface) !important;
  background-image: var(--stv-controlbar-surface-overlay) !important;
  -webkit-backdrop-filter: var(--stv-controlbar-surface-filter);
  backdrop-filter: var(--stv-controlbar-surface-filter);
  align-items: center !important;
  box-sizing: border-box;
  gap: var(--stv-controlbar-gap) !important;
  height: var(--stv-controlbar-height) !important;
  justify-content: flex-start !important;
  min-height: var(--stv-controlbar-height) !important;
  overflow: visible !important;
  padding: var(--stv-controlbar-padding-block-start)
    var(--stv-controlbar-padding-inline)
    var(--stv-controlbar-padding-block-end) !important;
  transition: opacity var(--stv-controlbar-fade-duration) linear !important;
  transition-delay: 0ms !important;
}

.video-js:not(.stv-controlbar-ready) .vjs-control-bar,
.bc-player:not(.stv-controlbar-ready) .vjs-control-bar {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: none !important;
}

.video-js.stv-controlbar-ready .vjs-control-bar,
.bc-player.stv-controlbar-ready .vjs-control-bar {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.video-js .vjs-control-bar button {
  color: var(--stv-controlbar-foreground) !important;
  cursor: pointer !important;
}

.video-js .vjs-control-bar > .vjs-play-control {
  order: 10;
}

.video-js .vjs-control-bar > .vjs-restart-button {
  order: 20;
}

.video-js .vjs-control-bar > .vjs-live-control,
.video-js .vjs-control-bar > .stv-live-control,
.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-live-control,
.video-js .vjs-control-bar .stv-controlbar-group--playback > .stv-live-control {
  order: 25;
  position: static !important;
  right: auto !important;
  flex: 0 0 auto;
  display: flex !important;
  align-self: center;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.video-js .vjs-control-bar > .vjs-live-control .stv-live-chip,
.video-js .vjs-control-bar > .stv-live-control .stv-live-chip,
.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-live-control .stv-live-chip,
.video-js .vjs-control-bar .stv-controlbar-group--playback > .stv-live-control .stv-live-chip {
  margin: 0 !important;
  display: inline-flex;
  flex: 0 0 auto;
  cursor: pointer;
  pointer-events: auto !important;
}

.video-js .vjs-control-bar > .vjs-live-control .stv-live-chip.is-disabled,
.video-js .vjs-control-bar > .stv-live-control .stv-live-chip.is-disabled,
.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-live-control .stv-live-chip.is-disabled,
.video-js .vjs-control-bar .stv-controlbar-group--playback > .stv-live-control .stv-live-chip.is-disabled {
  cursor: default !important;
}

.video-js .vjs-control-bar .vjs-volume-panel {
  box-sizing: border-box;
  display: flex !important;
  width: calc(
    var(--stv-controlbar-bubble-size)
    + var(--stv-controlbar-volume-width)
    + var(--stv-controlbar-volume-bubble-padding)
    + var(--stv-controlbar-volume-bubble-padding-right)
  ) !important;
  transition: none;
  order: 125;
  align-self: center;
  height: var(--stv-controlbar-bubble-size) !important;
  min-height: var(--stv-controlbar-bubble-size);
  padding: 0 var(--stv-controlbar-volume-bubble-padding-right) 0 var(--stv-controlbar-volume-bubble-padding);
  position: relative;
  overflow: visible !important;
}

.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-play-control {
  order: 10;
}

.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-volume-panel {
  order: 20;
}

.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-restart-button {
  order: 40;
}

.video-js .vjs-control-bar .stv-controlbar-group--playback > .stv-live-player-skip {
  order: 50;
}

.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-live-control,
.video-js .vjs-control-bar .stv-controlbar-group--playback > .stv-live-control {
  order: 30;
}

.video-js .vjs-control-bar .stv-controlbar-group--playback > .vjs-current-time {
  order: 60;
}

.video-js .vjs-control-bar .stv-controlbar-group--time {
  --stv-controlbar-group-gap: var(--stv-controlbar-time-group-gap);
}

.video-js .vjs-control-bar .stv-controlbar-group--left-live > .vjs-live-control,
.video-js .vjs-control-bar .stv-controlbar-group--left-live > .stv-live-control {
  position: static !important;
  right: auto !important;
  flex: 0 0 auto;
  display: flex !important;
  align-self: center;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.video-js .vjs-control-bar .stv-controlbar-group--left-live > .vjs-live-control .stv-live-chip,
.video-js .vjs-control-bar .stv-controlbar-group--left-live > .stv-live-control .stv-live-chip {
  margin: 0 !important;
  display: inline-flex;
  flex: 0 0 auto;
  cursor: pointer;
  pointer-events: auto !important;
}

.video-js .vjs-control-bar .stv-controlbar-group--left-live > .vjs-live-control .stv-live-chip.is-disabled,
.video-js .vjs-control-bar .stv-controlbar-group--left-live > .stv-live-control .stv-live-chip.is-disabled {
  cursor: default !important;
}

.video-js .vjs-control-bar .vjs-live-display.is-disabled,
.video-js .vjs-control-bar .stv-live-chip.vjs-live-display.is-disabled {
  cursor: default !important;
}

.video-js .vjs-control-bar .stv-controlbar-group--left-primary > .vjs-play-control {
  order: 10;
}

.video-js .vjs-control-bar .stv-controlbar-group--left-primary > .stv-controlbar-group--time {
  order: 20;
}

.video-js .vjs-control-bar .stv-controlbar-group--left-primary > .stv-live-player-skip {
  order: 30;
}

.stv-controlbar-group--time {
  --stv-controlbar-group-gap: var(--stv-controlbar-time-group-gap);
  min-height: 0;
  padding: 0 8px 0 0;
}

.stv-controlbar-group--time::before {
  content: none;
}

.stv-controlbar-group--time > .vjs-current-time,
.stv-controlbar-group--time > .radio-player__delay {
  order: 10;
}

.stv-controlbar-group--time > .vjs-time-divider {
  order: 20;
}

.stv-controlbar-group--time > .vjs-duration,
.stv-controlbar-group--time > .vjs-remaining-time {
  order: 30;
}

.video-js .vjs-control-bar .vjs-current-time-display,
.video-js .vjs-control-bar .vjs-duration-display,
.video-js .vjs-control-bar .vjs-time-divider,
.video-js .vjs-control-bar .radio-player__delay {
  font-family: "Source Sans Pro", Tahoma, sans-serif;
  font-size: 16px !important;
  font-weight: 400;
  line-height: 74% !important;
  letter-spacing: 0;
}

.video-js .vjs-control-bar .stv-controlbar-group--right-media > .vjs-audio-button {
  order: 10;
}

.video-js .vjs-control-bar .stv-controlbar-group--right-media > .stv-settings-button,
.video-js .vjs-control-bar .stv-controlbar-group--right-media > .vjs-quality-menu-wrapper,
.video-js .vjs-control-bar .stv-controlbar-group--right-media > button.vjs-quality-menu-button {
  order: 20;
}

.video-js .vjs-control-bar .stv-controlbar-group--right-utility > .vjs-volume-panel {
  order: 10;
}

.video-js .vjs-control-bar .stv-controlbar-group--right-utility > .vjs-subs-caps-button,
.video-js .vjs-control-bar .stv-controlbar-group--right-utility > button.vjs-subs-caps-button {
  order: 20;
}

.video-js .vjs-control-bar .stv-controlbar-group--right-utility > .pip-button {
  order: 30;
}

.video-js .vjs-control-bar .stv-controlbar-group--right-utility > .stv-theatre-mode-button {
  order: 40;
}

.video-js .vjs-control-bar .stv-controlbar-group--right-utility > .vjs-fullscreen-control {
  order: 50;
}

.video-js .vjs-control-bar .stv-controlbar-group--vod-playback > .stv-controlbar-group--vod-time {
  order: 30;
}

.video-js .vjs-control-bar .stv-controlbar-group--vod-time::before {
  content: none;
}

.video-js .vjs-control-bar .stv-controlbar-group--vod-time {
  min-height: 0;
  padding: 0 8px 0 0;
}

.video-js .vjs-control-bar .stv-controlbar-group--vod-time > .vjs-current-time {
  order: 10;
}

.video-js .vjs-control-bar .stv-controlbar-group--vod-time > .vjs-time-divider {
  order: 20;
}

.video-js .vjs-control-bar .stv-controlbar-group--vod-time > .vjs-duration {
  order: 30;
}

.video-js .vjs-control-bar .stv-controlbar-group--vod-playback > .vjs-restart-button {
  order: 60;
}

.video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal,
.video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover,
.video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active,
.video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal:active {
  display: flex !important;
  justify-content: center !important;
  width: calc(
    var(--stv-controlbar-bubble-size)
    + var(--stv-controlbar-volume-width)
    + var(--stv-controlbar-volume-bubble-padding)
    + var(--stv-controlbar-volume-bubble-padding-right)
  ) !important;
  max-width: none !important;
  opacity: 1 !important;
  padding: 0 var(--stv-controlbar-volume-bubble-padding-right) 0 var(--stv-controlbar-volume-bubble-padding) !important;
}

.video-js .vjs-control-bar .vjs-volume-panel .vjs-mute-control {
  flex: 0 0 auto;
  width: var(--stv-controlbar-bubble-size);
  height: var(--stv-controlbar-bubble-size);
  min-width: var(--stv-controlbar-bubble-size);
  min-height: var(--stv-controlbar-bubble-size);
  padding: 0 !important;
  margin-right: 0 !important;
}

.stv-controlbar-button--volume {
  width: var(--stv-controlbar-bubble-size);
  height: var(--stv-controlbar-bubble-size);
  min-width: var(--stv-controlbar-bubble-size);
  min-height: var(--stv-controlbar-bubble-size);
  padding: 0 !important;
}

.video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-control,
.video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
  display: flex !important;
  align-items: center !important;
  align-self: center;
  flex: 0 0 var(--stv-controlbar-volume-width);
  height: var(--stv-controlbar-bubble-size) !important;
  width: var(--stv-controlbar-volume-width) !important;
  max-width: var(--stv-controlbar-volume-width) !important;
  opacity: 1 !important;
  visibility: visible !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  overflow: visible !important;
}

.video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-bar {
  position: relative !important;
  align-self: center;
  width: 100% !important;
  height: var(--stv-controlbar-bubble-size) !important;
  margin: 0 !important;
  background: linear-gradient(
    rgba(255, 255, 255, 0.22),
    rgba(255, 255, 255, 0.22)
  ) center / 100% 4px no-repeat !important;
  overflow: visible !important;
}

.video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-level {
  position: absolute !important;
  inset: 50% auto auto 0;
  height: 4px !important;
  margin: 0 !important;
  border-right: none !important;
  border-radius: 5px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  transform: translateY(-50%);
}

.video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-bar > .vjs-mouse-display {
  display: none !important;
}

.video-js .vjs-control-bar > .vjs-current-time {
  order: 40;
}

.video-js .vjs-control-bar > .vjs-time-divider {
  order: 50;
}

.video-js .vjs-control-bar > .vjs-duration {
  order: 60;
}

.video-js .vjs-control-bar > .vjs-progress-control {
  order: 70;
}

.video-js .vjs-control-bar > .vjs-remaining-time {
  order: 80;
}

.video-js .vjs-control-bar > .vjs-custom-control-spacer {
  order: 90;
  flex: 1 1 auto;
  min-width: 0;
}

.video-js .vjs-control-bar > .vjs-subs-caps-button {
  order: 100;
}
/* Safari: show */

.video-js .vjs-subs-caps-button.is-safari .vjs-menu,
.video-js .is-safari.vjs-subs-caps-button .vjs-menu {
  display: block !important;
}

.video-js .vjs-subs-caps-button.is-safari .vjs-menu.vjs-lock-showing {
  display: block !important;
}
/* Hide the captions menu by default */
.video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu,
.video-js .vjs-control-bar button.vjs-subs-caps-button .vjs-menu {
  display: none !important;
}

.video-js .vjs-control-bar > .vjs-audio-button,
.video-js .vjs-control-bar > .vjs-quality-menu-wrapper {
  order: 110;
}

.video-js .vjs-control-bar > .pip-button {
  order: 120;
}

.video-js .vjs-control-bar > .stv-theatre-mode-button {
  order: 125;
}

.video-js .vjs-control-bar > .vjs-fullscreen-control {
  order: 130;
}

.video-js .vjs-control-bar .vjs-control {
  cursor: pointer !important;
}

.video-js .vjs-control-bar .vjs-control-text,
.video-js .vjs-control-bar .vjs-icon-placeholder,
.video-js .vjs-control-bar .theo-button-tooltip {
  pointer-events: none;
}

.stv-controlbar-button > .vjs-control-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.video-js .vjs-control:hover .theo-button-tooltip {
  display: block !important;
}

.video-js .vjs-control-bar .vjs-subs-caps-button .vjs-icon-placeholder:before,
.video-js .vjs-control-bar .vjs-fullscreen-control .vjs-icon-placeholder:before,
.video-js .vjs-control-bar .vjs-mute-control .vjs-icon-placeholder:before,
.video-js .vjs-control-bar .vjs-quality-menu-button .vjs-icon-placeholder:before,
.video-js .vjs-control-bar .vjs-play-control .vjs-icon-placeholder:before,
.video-js .vjs-control-bar .pip-button .vjs-icon-placeholder:before,
.video-js .vjs-control-bar .vjs-restart-button .vjs-icon-placeholder:before {
  content: '' !important;
}

.stv-controlbar-button,
.video-js .vjs-control-bar .vjs-play-control,
.video-js .vjs-control-bar .vjs-mute-control,
.video-js .vjs-control-bar .vjs-fullscreen-control,
.video-js .vjs-control-bar .pip-button,
.video-js .vjs-control-bar .vjs-restart-button,
.video-js .vjs-control-bar .stv-live-player-skip,
.video-js .vjs-control-bar .stv-theatre-mode-button {
  border: none;
  box-sizing: border-box;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center;
  background-color: transparent !important;
  color: var(--stv-controlbar-foreground) !important;
  cursor: pointer;
  line-height: 1 !important;
  margin: 0 !important;
  overflow: visible;
  padding: 0 !important;
  position: relative;
  z-index: 0;
  border-radius: 999px !important;
  transition: box-shadow 160ms ease, opacity 160ms ease;
}

.stv-controlbar-icon {
  position: absolute;
  inset: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  transform: translate(
    var(--stv-controlbar-icon-offset-x, 0px),
    var(--stv-controlbar-icon-offset-y, 0px)
  );
  pointer-events: none;
  z-index: 2;
}

.stv-controlbar-icon__svg {
  display: none;
  width: auto;
  height: var(--stv-controlbar-current-icon-size, var(--stv-controlbar-icon-size));
  flex: 0 0 auto;
  overflow: visible;
}

.stv-controlbar-icon__svg[data-icon-state="default"] {
  display: block;
}

.stv-controlbar-button--play.is-playing > .stv-controlbar-icon--play .stv-controlbar-icon__svg[data-icon-state="default"],
.video-js .vjs-control-bar .vjs-play-control.vjs-playing > .stv-controlbar-icon--play .stv-controlbar-icon__svg[data-icon-state="default"],
.stv-controlbar-button--volume.is-volume-1 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="default"],
.stv-controlbar-button--volume.is-volume-0 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="default"],
.stv-controlbar-button--volume.is-muted > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="default"],
.video-js .vjs-control-bar .vjs-mute-control.vjs-vol-1 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="default"],
.video-js .vjs-control-bar .vjs-mute-control.vjs-vol-0 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="default"],
.video-js .vjs-control-bar .vjs-subs-caps-button.subtitles-on > button > .stv-controlbar-icon--subtitles .stv-controlbar-icon__svg[data-icon-state="default"],
.video-js .vjs-control-bar button.vjs-subs-caps-button.subtitles-on > .stv-controlbar-icon--subtitles .stv-controlbar-icon__svg[data-icon-state="default"],
.stv-controlbar-button--fullscreen.is-fullscreen > .stv-controlbar-icon--fullscreen .stv-controlbar-icon__svg[data-icon-state="default"],
.video-js.vjs-fullscreen .vjs-control-bar .vjs-fullscreen-control > .stv-controlbar-icon--fullscreen .stv-controlbar-icon__svg[data-icon-state="default"] {
  display: none;
}

.stv-controlbar-button--play.is-playing > .stv-controlbar-icon--play .stv-controlbar-icon__svg[data-icon-state="playing"],
.video-js .vjs-control-bar .vjs-play-control.vjs-playing > .stv-controlbar-icon--play .stv-controlbar-icon__svg[data-icon-state="playing"],
.stv-controlbar-button--volume.is-volume-1 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="volume-1"],
.stv-controlbar-button--volume.is-volume-0 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="volume-0"],
.stv-controlbar-button--volume.is-muted > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="muted"],
.video-js .vjs-control-bar .vjs-mute-control.vjs-vol-1 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="volume-1"],
.video-js .vjs-control-bar .vjs-mute-control.vjs-vol-0 > .stv-controlbar-icon--volume .stv-controlbar-icon__svg[data-icon-state="muted"],
.video-js .vjs-control-bar .vjs-subs-caps-button.subtitles-on > button > .stv-controlbar-icon--subtitles .stv-controlbar-icon__svg[data-icon-state="active"],
.video-js .vjs-control-bar button.vjs-subs-caps-button.subtitles-on > .stv-controlbar-icon--subtitles .stv-controlbar-icon__svg[data-icon-state="active"],
.stv-controlbar-button--fullscreen.is-fullscreen > .stv-controlbar-icon--fullscreen .stv-controlbar-icon__svg[data-icon-state="fullscreen"],
.video-js.vjs-fullscreen .vjs-control-bar .vjs-fullscreen-control > .stv-controlbar-icon--fullscreen .stv-controlbar-icon__svg[data-icon-state="fullscreen"] {
  display: block;
}

.stv-controlbar-icon--theatre {
  inset: 50% auto auto 50%;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("/player-web/players/shared/theatre-mode.svg") center / contain no-repeat;
  mask: url("/player-web/players/shared/theatre-mode.svg") center / contain no-repeat;
  transform: translate(-50%, -50%);
}

.stv-theatre-mode-button.is-active > .stv-controlbar-icon--theatre {
  -webkit-mask-image: url("/player-web/players/shared/default-view.svg");
  mask-image: url("/player-web/players/shared/default-view.svg");
}

.stv-controlbar-button--icon,
.video-js .vjs-control-bar .vjs-play-control,
.video-js .vjs-control-bar .vjs-fullscreen-control,
.video-js .vjs-control-bar .pip-button,
.video-js .vjs-control-bar .vjs-restart-button,
.video-js .vjs-control-bar .stv-live-player-skip,
.video-js .vjs-control-bar .stv-theatre-mode-button {
  width: var(--stv-controlbar-bubble-size);
  height: var(--stv-controlbar-bubble-size);
  min-width: var(--stv-controlbar-bubble-size);
  min-height: var(--stv-controlbar-bubble-size);
}

.stv-controlbar-button--volume,
.video-js .vjs-control-bar .vjs-mute-control {
  --stv-controlbar-current-icon-size: var(--stv-controlbar-volume-icon-size);
  height: var(--stv-controlbar-bubble-size);
  min-height: var(--stv-controlbar-bubble-size);
  --stv-controlbar-icon-offset-x: -0.25px;
}

.stv-controlbar-button--pill {
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  border-radius: 999px !important;
  background-color: rgba(255, 255, 255, 0.06) !important;
}

.video-js .vjs-control-bar .vjs-subs-caps-button,
.video-js .vjs-control-bar .vjs-audio-button,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper {
  background: none !important;
  box-sizing: border-box;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  align-self: center;
  height: var(--stv-controlbar-bubble-size);
  min-height: var(--stv-controlbar-bubble-size);
  margin: 0 !important;
  overflow: visible;
  padding: 0 !important;
  position: relative;
}

.video-js .vjs-control-bar .vjs-subs-caps-button {
  width: var(--stv-controlbar-captions-width);
  min-width: var(--stv-controlbar-captions-width);
}

.video-js .vjs-control-bar .vjs-audio-button {
  width: var(--stv-controlbar-bubble-size);
  min-width: var(--stv-controlbar-bubble-size);
}

.video-js .vjs-control-bar .vjs-quality-menu-wrapper {
  width: var(--stv-controlbar-menu-width) !important;
  min-width: var(--stv-controlbar-menu-width);
}

#stv-live-player .vjs-control-bar .vjs-quality-menu-wrapper,
#stv-live-player .vjs-control-bar button.vjs-quality-menu-button {
  display: none !important;
}

.video-js .vjs-control-bar .vjs-subs-caps-button.vjs-hidden,
.video-js .vjs-control-bar .vjs-audio-button.vjs-hidden,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper.vjs-hidden,
.video-js .vjs-control-bar .vjs-hidden {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
}

.video-js .vjs-control-bar .vjs-subs-caps-button > button,
.video-js .vjs-control-bar .vjs-audio-button > button,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button,
.video-js .vjs-control-bar button.vjs-subs-caps-button,
.video-js .vjs-control-bar button.vjs-quality-menu-button {
  box-sizing: border-box;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100%;
  height: 100%;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  background-color: transparent !important;
  overflow: visible;
  z-index: 0;
  border-radius: 999px !important;
  transition: box-shadow 160ms ease, opacity 160ms ease;
}

.video-js .vjs-control-bar .vjs-subs-caps-button > button,
.video-js .vjs-control-bar button.vjs-subs-caps-button {
  --stv-controlbar-current-icon-size: var(--stv-controlbar-captions-icon-size);
  z-index: 5 !important;
}

.video-js .vjs-control-bar .vjs-audio-button > button {
  --stv-controlbar-current-icon-size: var(--stv-controlbar-menu-icon-size);
}

.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button,
.video-js .vjs-control-bar button.vjs-quality-menu-button {
  --stv-controlbar-current-icon-size: var(--stv-controlbar-menu-icon-size);
}

.stv-controlbar-group {
  position: relative;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  align-self: center;
  gap: var(--stv-controlbar-group-gap);
  min-height: var(--stv-controlbar-bubble-size);
  padding: var(--stv-controlbar-group-bubble-padding);
  border-radius: 999px;
  overflow: visible;
}

.stv-controlbar-group::before {
  content: '';
  position: absolute;
  inset: var(--stv-controlbar-group-bubble-inset);
  border-radius: calc(var(--stv-controlbar-panel-radius, 999px) - var(--stv-controlbar-group-bubble-inset));
  background-color: var(--stv-controlbar-group-bubble-color);
  opacity: var(--stv-controlbar-group-bubble-opacity);
  pointer-events: none;
  transition: opacity 160ms ease;
  -webkit-backdrop-filter: var(--stv-controlbar-group-bubble-filter);
  backdrop-filter: var(--stv-controlbar-group-bubble-filter);
  z-index: 0;
}

.stv-controlbar-panel::before {
  content: '';
  position: absolute;
  inset: var(--stv-controlbar-bubble-inset);
  border-radius: calc(var(--stv-controlbar-panel-radius, 999px) - var(--stv-controlbar-bubble-inset));
  background-color: var(--stv-controlbar-group-bubble-color);
  opacity: var(--stv-controlbar-group-bubble-opacity);
  pointer-events: none;
  transition: opacity 160ms ease;
  -webkit-backdrop-filter: var(--stv-controlbar-group-bubble-filter);
  backdrop-filter: var(--stv-controlbar-group-bubble-filter);
  z-index: 0;
}

.stv-controlbar-group > *,
.stv-controlbar-panel > * {
  position: relative;
  z-index: 1;
}

.stv-controlbar-button:not(.stv-controlbar-button--volume)::before,
.video-js .vjs-control-bar .vjs-play-control::before,
.video-js .vjs-control-bar .vjs-fullscreen-control::before,
.video-js .vjs-control-bar .pip-button::before,
.video-js .vjs-control-bar .vjs-restart-button::before,
.video-js .vjs-control-bar .stv-live-player-skip::before,
.video-js .vjs-control-bar .vjs-subs-caps-button > button::before,
.video-js .vjs-control-bar .vjs-audio-button > button::before,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button::before,
.video-js .vjs-control-bar button.vjs-subs-caps-button::before,
.video-js .vjs-control-bar button.vjs-quality-menu-button::before {
  content: '';
  position: absolute;
  inset: var(--stv-controlbar-control-bubble-inset);
  border-radius: 999px;
  background-color: var(--stv-controlbar-bubble-color);
  opacity: 0;
  pointer-events: none;
  transition: opacity 160ms ease;
  z-index: 0;
}

.stv-controlbar-panel {
  position: relative;
  box-sizing: border-box;
  background-color: var(--stv-controlbar-surface);
  -webkit-backdrop-filter: var(--stv-controlbar-surface-filter);
  backdrop-filter: var(--stv-controlbar-surface-filter);
  overflow: hidden;
}

.video-js.stv-controlbar-always-visible .vjs-control-bar {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

.video-js .vjs-control-bar > .stv-controlbar-group--playback {
  order: 10;
}

.video-js .vjs-control-bar > .stv-controlbar-group--utility {
  order: 100;
}

.video-js .vjs-control-bar > .stv-controlbar-group--left-primary {
  order: 10;
}

.video-js .vjs-control-bar > .stv-controlbar-group--left-restart {
  order: 20;
}

.video-js .vjs-control-bar > .stv-controlbar-group--right-utility {
  padding-left: calc(var(--stv-controlbar-group-bubble-padding) + 4px);
  padding-right: calc(var(--stv-controlbar-group-bubble-padding) + 4px);
}

.video-js .vjs-control-bar > .stv-controlbar-group--left-live {
  order: 30;
}

.video-js .vjs-control-bar > .stv-controlbar-group--right-media {
  order: 100;
  margin-left: auto;
}

.video-js .vjs-control-bar > .stv-controlbar-group--right-utility {
  order: 110;
}

.video-js.stv-controlbar-auto-hide.vjs-has-started .vjs-control-bar {
  opacity: 0 !important;
  transform: translateY(0) !important;
}

.video-js.stv-controlbar-auto-hide.vjs-has-started.vjs-user-active .vjs-control-bar,
.video-js.stv-controlbar-auto-hide.vjs-has-started .vjs-control-bar.vjs-focus-within,
.video-js.stv-controlbar-auto-hide.stv-controlbar-touch-visible.vjs-has-started .vjs-control-bar,
.video-js.stv-controlbar-auto-hide.vjs-has-started .vjs-control-bar.vjs-control-bar-visible,
.video-js.stv-controlbar-auto-hide.casting .vjs-control-bar {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

.video-js.vjs-fullscreen.vjs-user-inactive,
.video-js.vjs-fullscreen.vjs-user-inactive .vjs-tech,
.video-js.vjs-fullscreen.vjs-user-inactive .vjs-control-bar {
  cursor: none !important;
}

.stv-controlbar-button:hover,
.stv-controlbar-button:focus-visible,
.video-js .vjs-control-bar .vjs-play-control:hover,
.video-js .vjs-control-bar .vjs-play-control:focus-visible,
.video-js .vjs-control-bar .vjs-fullscreen-control:hover,
.video-js .vjs-control-bar .vjs-fullscreen-control:focus-visible,
.video-js .vjs-control-bar .pip-button:hover,
.video-js .vjs-control-bar .pip-button:focus-visible,
.video-js .vjs-control-bar .vjs-restart-button:hover,
.video-js .vjs-control-bar .vjs-restart-button:focus-visible,
.video-js .vjs-control-bar .stv-live-player-skip:hover,
.video-js .vjs-control-bar .stv-live-player-skip:focus-visible,
.video-js .vjs-control-bar .vjs-subs-caps-button > button:hover,
.video-js .vjs-control-bar .vjs-subs-caps-button > button:focus-visible,
.video-js .vjs-control-bar .vjs-audio-button > button:hover,
.video-js .vjs-control-bar .vjs-audio-button > button:focus-visible,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button:hover,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button:focus-visible,
.video-js .vjs-control-bar button.vjs-subs-caps-button:hover,
.video-js .vjs-control-bar button.vjs-subs-caps-button:focus-visible,
.video-js .vjs-control-bar button.vjs-quality-menu-button:hover,
.video-js .vjs-control-bar button.vjs-quality-menu-button:focus-visible {
  background-color: transparent !important;
}

.stv-controlbar-button:not(.stv-controlbar-button--volume):hover::before,
.stv-controlbar-button:not(.stv-controlbar-button--volume):focus-visible::before,
.video-js .vjs-control-bar .vjs-play-control:hover::before,
.video-js .vjs-control-bar .vjs-play-control:focus-visible::before,
.video-js .vjs-control-bar .vjs-fullscreen-control:hover::before,
.video-js .vjs-control-bar .vjs-fullscreen-control:focus-visible::before,
.video-js .vjs-control-bar .pip-button:hover::before,
.video-js .vjs-control-bar .pip-button:focus-visible::before,
.video-js .vjs-control-bar .vjs-restart-button:hover::before,
.video-js .vjs-control-bar .vjs-restart-button:focus-visible::before,
.video-js .vjs-control-bar .stv-live-player-skip:hover::before,
.video-js .vjs-control-bar .stv-live-player-skip:focus-visible::before,
.video-js .vjs-control-bar .vjs-subs-caps-button > button:hover::before,
.video-js .vjs-control-bar .vjs-subs-caps-button > button:focus-visible::before,
.video-js .vjs-control-bar .vjs-audio-button > button:hover::before,
.video-js .vjs-control-bar .vjs-audio-button > button:focus-visible::before,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button:hover::before,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button:focus-visible::before,
.video-js .vjs-control-bar button.vjs-subs-caps-button:hover::before,
.video-js .vjs-control-bar button.vjs-subs-caps-button:focus-visible::before,
.video-js .vjs-control-bar button.vjs-quality-menu-button:hover::before,
.video-js .vjs-control-bar button.vjs-quality-menu-button:focus-visible::before,
.stv-controlbar-volume:hover::before,
.stv-controlbar-volume:focus-within::before,
.video-js .vjs-control-bar .vjs-volume-panel:hover::before,
.video-js .vjs-control-bar .vjs-volume-panel:focus-within::before {
  opacity: var(--stv-controlbar-bubble-opacity-hover);
}

.video-js .vjs-control-bar .pip-button.is-active > .stv-controlbar-icon,
.video-js .vjs-control-bar .pip-button[aria-pressed="true"] > .stv-controlbar-icon,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button[aria-expanded="true"] > .stv-controlbar-icon,
.video-js .vjs-control-bar button.vjs-quality-menu-button[aria-expanded="true"] > .stv-controlbar-icon,
.video-js .vjs-control-bar .vjs-audio-button.vjs-lock-showing > button > .stv-controlbar-icon,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper.vjs-lock-showing > button > .stv-controlbar-icon,
.video-js .vjs-control-bar button.vjs-quality-menu-button.vjs-lock-showing > .stv-controlbar-icon {
  color: var(--stv-controlbar-active-icon-color);
}

.video-js .vjs-control-bar .vjs-menu-button-popup .vjs-menu {
  margin: 0 !important;
  position: absolute !important;
  inset: auto auto calc(100% + 8px) 50% !important;
  transform: translateX(-50%);
  overflow: visible !important;
}

.video-js .vjs-control-bar .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
  left: auto !important;
  right: auto !important;
  min-width: 10rem;
  margin: 0 !important;
  padding: 0.25rem 0 !important;
  border-radius: 12px;
  background: rgba(16, 24, 32, 0.96) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

.video-js .vjs-control-bar .theo-button-tooltip.stv-controlbar-tooltip,
.stv-controlbar-button > .stv-controlbar-tooltip,
.stv-controlbar-tooltip-host > .stv-controlbar-tooltip,
.stv-live-chip > .stv-controlbar-tooltip {
  position: absolute;
  inset: auto auto calc(
    100%
    + var(--stv-controlbar-current-tooltip-offset)
    + var(--stv-controlbar-tooltip-anchor-offset-y, 0px)
  ) 50%;
  display: block !important;
  min-width: max-content;
  max-width: min(18rem, calc(100vw - 2rem));
  padding: 0.45rem 0.7rem;
  border-radius: 999px;
  background-color: var(--stv-controlbar-group-bubble-color);
  box-shadow: none;
  color: #f6f6f6;
  white-space: nowrap;
  text-transform: none;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: 0.01em;
  transform: translate(
    calc(-50% + var(--stv-controlbar-tooltip-shift-x, 0px)),
    0px
  );
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 12;
}

.stv-controlbar-tooltip.vjs-hidden {
  display: block !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.video-js .vjs-control-bar .theo-button-tooltip {
  display: block !important;
}

.stv-controlbar-button:hover > .stv-controlbar-tooltip,
.stv-controlbar-tooltip-host:hover > .stv-controlbar-tooltip,
.stv-live-chip:hover > .stv-controlbar-tooltip,
.stv-live-chip:focus-visible > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-live-display:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-live-display:focus-visible > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-play-control:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-mute-control:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-fullscreen-control:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .pip-button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .stv-theatre-mode-button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .stv-theatre-mode-button:focus-visible > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-restart-button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .stv-live-player-skip:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-subs-caps-button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-subs-caps-button > button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-audio-button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-audio-button > button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-control:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar button.vjs-subs-caps-button:hover > .stv-controlbar-tooltip,
.video-js .vjs-control-bar button.vjs-quality-menu-button:hover > .stv-controlbar-tooltip {
  opacity: 1;
  visibility: visible;
}

.video-js .vjs-progress-control {
  align-items: center;
  width: 100% !important;
  height: 16px !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  top: 0 !important;
  padding-inline: 12px;
  box-sizing: border-box;
}

.video-js .vjs-progress-control .vjs-progress-holder {
  background: var(--stv-controlbar-group-bubble-color) !important;
  border-radius: 5px;
  height: var(--stv-controlbar-progress-height) !important;
  margin: 0 !important;
}

.video-js .vjs-load-progress,
.video-js .vjs-load-progress div {
  background: var(--stv-controlbar-bubble-color) !important;
}

.video-js .vjs-progress-control .vjs-load-progress {
  border-radius: 5px;
}

.video-js .vjs-progress-control .vjs-play-progress {
  background: var(--stv-controlbar-accent) !important;
  border-radius: 5px;
}

.video-js .vjs-progress-control .vjs-play-progress::after {
  content: " ";
  float: right;
  margin-top: -6px !important;
  margin-right: -7px;
  border-radius: 50% !important;
  background-color: white;
  width: 15px;
  height: 15px;
}

.video-js .vjs-progress-control .vjs-progress-holder:hover .vjs-mouse-display,
.video-js .vjs-progress-control .vjs-progress-holder.stv-progress-holder--hover .vjs-mouse-display,
.video-js .vjs-progress-control:hover .vjs-progress-holder .vjs-mouse-display {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.video-js .vjs-progress-control .vjs-progress-holder:hover .vjs-time-tooltip,
.video-js .vjs-progress-control .vjs-progress-holder.stv-progress-holder--hover .vjs-time-tooltip,
.video-js .vjs-progress-control:hover .vjs-progress-holder .vjs-time-tooltip {
  visibility: visible !important;
}

.video-js .vjs-progress-control .stv-progress-time-tooltip {
  position: absolute;
  top: -3.4em;
  transform: translateX(calc(-50% + var(--stv-progress-time-tooltip-shift-x, 0px)));
  min-width: max-content;
  padding: 6px 8px 8px;
  border-radius: 0.3em;
  color: #000;
  background-color: rgba(255, 255, 255, 0.8);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.75em;
  line-height: normal;
  pointer-events: none;
  opacity: 0.8;
  visibility: hidden;
  z-index: 2;
}

.video-js .vjs-progress-control .stv-progress-time-tooltip--hover {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.8);
}

.video-js .vjs-progress-control .vjs-progress-holder.stv-progress-holder--hover .stv-progress-time-tooltip {
  visibility: visible;
}

.video-js .vjs-volume-level {
  background: rgba(255, 255, 255, 0.96) !important;
}

.video-js .vjs-control-bar .vjs-fullscreen-control {
  --stv-controlbar-icon-offset-x: -0.5px;
}

.video-js .vjs-control-bar .vjs-restart-button {
  --stv-controlbar-icon-offset-x: 0.5px;
}

.video-js .vjs-control-bar .vjs-subs-caps-button > button,
.video-js .vjs-control-bar button.vjs-subs-caps-button {
  --stv-controlbar-icon-offset-y: 0;
}

.video-js .vjs-control-bar .vjs-quality-menu-wrapper > button,
.video-js .vjs-control-bar button.vjs-quality-menu-button {
  --stv-controlbar-icon-offset-y: 0.5px;
}

.radio-player__controls > .stv-controlbar-group--right-media {
  margin-left: auto;
}

.radio-player__volume {
  margin: 0;
}

@media (max-width: 500px) {
  :root {
    --stv-controlbar-bubble-size: 26px;
    --stv-controlbar-icon-size: 14px;
    --stv-controlbar-volume-icon-size: 16px;
    --stv-controlbar-padding-inline: var(--stv-controlbar-padding-inline-mobile);
    --stv-controlbar-progress-gap: 8px;
    --stv-controlbar-padding-block-end: 6px;
  }

  .stv-playback-feedback__icon-slot {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    max-width: 48px !important;
    max-height: 48px !important;
  }

  .stv-playback-feedback__svg {
    width: 48px !important;
    height: 48px !important;
    max-width: 48px !important;
    max-height: 48px !important;
  }

  .video-js .vjs-control-bar {
    padding: calc(var(--stv-controlbar-progress-height) + var(--stv-controlbar-progress-gap)) var(--stv-controlbar-padding-inline) var(--stv-controlbar-padding-block-end) !important;
    height: calc(var(--stv-controlbar-padding-block-start) + var(--stv-controlbar-bubble-size) + var(--stv-controlbar-padding-block-end)) !important;
    min-height: unset !important;
  }

  .video-js .vjs-control-bar,
  .bc-player .vjs-control-bar {
    padding-block-start: calc(var(--stv-controlbar-progress-height) + var(--stv-controlbar-progress-gap)) !important;
    padding-block-end: var(--stv-controlbar-padding-block-end) !important;
    padding-inline: var(--stv-controlbar-padding-inline) !important;
  }

  .video-js .vjs-control-bar .vjs-current-time-display,
  .video-js .vjs-control-bar .vjs-duration-display,
  .video-js .vjs-control-bar .vjs-time-divider {
    font-size: 14px !important;
  }
  .video-js .vjs-control-bar .stv-controlbar-group--left-primary > .stv-controlbar-group--time {
    display: none !important;
  }
  .video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-control, .video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
  display: none !important;
  }
  .video-js .vjs-control-bar .stv-controlbar-group--right-utility > .vjs-volume-panel,
  .video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal,
  .video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover,
  .video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active,
  .video-js .vjs-control-bar .vjs-volume-panel.vjs-volume-panel-horizontal:active {
    width: var(--stv-controlbar-bubble-size) !important;
    min-width: var(--stv-controlbar-bubble-size) !important;
    max-width: var(--stv-controlbar-bubble-size) !important;
    padding: 0 !important;
  }
}
