:root {
  --plyr-color-main: #0056ff;
  --plyr-video-controls-background: linear-gradient(
    rgba(0, 0, 0, 0),
    rgba(0, 50, 150, 0.5)
  );
  --plyr-video-background: transparent;
  --plyr-audio-controls-background: white;
  --plyr-audio-control-color: #0056ff;
}
* {
  unicode-bidi: plaintext !important;
}

.plyr--audio .plyr__control.plyr__tab-focus,
.plyr--audio .plyr__control:hover,
.plyr--audio .plyr__control:hover span,
.plyr--audio .plyr__control[aria-expanded="true"],
.plyr--video .plyr__control.plyr__tab-focus,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control:hover span,
.plyr--video .plyr__control[aria-expanded="true"] {
  color: white !important;
}

.plyr--video {
  border-radius: 8px;
}
.plyr--video .plyr__controls {
  border-radius: 0px 0px 8px 8px;
}

.thumb {
  position: relative;
  max-width: 1024px;
  box-shadow: none;
}
.question-content-audio {
  filter: blur(2px);
  width: 100%;
}
.thumb img,
.thumb video {
  object-fit: contain;
}
.thumb .btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #0056ff90;
  color: white;
  font-size: 24px;
  padding: 10px 16px 8px 20px;
  border: none;
  border-radius: 5px;
  text-align: center;
  backdrop-filter: blur(2px);
  transition: background 0.1s linear;
  cursor: pointer !important;
}
.thumb .btn:hover {
  background-color: #0046fff0;
}

@media (max-width: 767px) {
  .thumb {
    position: relative;
    width: 100%;
  }
}