.video-js .vjs-info {
  align-items: center;
  background: none;
  gap: 0.5rem;
  display: grid;
  font-family: 'Inter', sans-serif;
  justify-content: space-between;
  padding: 1rem 1.5rem 1rem 1.5rem;
  /* width: min-content; */
  grid-template-columns: 1rem 1rem;
}

.video-js:not(.vjs-touch-enabled) :focus:focus-visible {
  border-radius: unset;
}

.video-js .vjs-menu .vjs-menu-item.vjs-selected {
  background-color: var(--color-black);
  color: var(--color-player-main);
}

.vjs-1600 .vjs-info .vjs-text {
  padding-top: 0;
  scale: 1;
  transform-origin: 0;
}

.vjs-info .vjs-text {
  flex: none;
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 24.2px;
  padding-right: 0;
  text-align: center;
  text-decoration-skip-ink: none;
  text-underline-position: from-font;
  width: min-content;
}

.vjs-info:hover {
  color: (--color-neutral-400);
}

.video-js .vjs-volume-level,
.video-js .vjs-volume-level::before {
  background-color: var(--color-player-main) !important;
}

.video-js .vjs-related .rel-bg {
  border-radius: 12px;
  object-fit: contain;
}

.video-js .vjs-menu-div {
  border-radius: 8px !important;
}

.video-js .vjs-menu-title,
.video-js .vjs-menu-item.vjs-texttrack-settings {
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
}

.video-js .vjs-menu .vjs-menu-content {
  border-radius: 8px !important;
}

/* .video-js .vjs-button:hover .vjs-svg-icon:not(.vjs-related-icon) svg {
  fill: var(--color-player-main);
} */

.video-js .vjs-button:hover .vjs-svg-icon use {
  color: var(--color-player-main);
}

.video-js .vjs-quality-button:hover .quality-span {
  color: var(--color-player-main);
}

.video-js .vjs-quality-button:hover .vjs-hd-icon {
  color: var(--color-player-main);
}

.video-js .vjs-menu .vjs-menu-content .vjs-menu-title,
.video-js .vjs-menu .vjs-menu-content .vjs-menu-title:hover,
.video-js .vjs-menu-item.vjs-texttrack-settings {
  background-color: var(--color-background-quaternary);
  color: var(--color-player-main);
  font-weight: 900;
  border-bottom: 1px solid var(--color-player-main);
}

.video-js .vjs-menu-item.vjs-texttrack-settings .vjs-menu-item-text {
  color: var(--color-player-main);
  font-weight: 900;
}

.video-js .vjs-menu .vjs-menu-content li {
  background-color: var(--color-background-quaternary);
}

.vjs-has-mouse .vjs-menu .vjs-menu-content li:not(.vjs-menu-title):not(.vjs-texttrack-settings):hover {
  background-color: var(--color-background-quaternary) !important;
  filter: brightness(1.5);
  transition: filter 0.2s ease;
}

.video-js .vjs-lock-showing {
  min-width: 150px;
}

.video-js .vjs-menu-item.vjs-texttrack-settings>.vjs-menu-item-text {
  color: var(--color-player-main);
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
  display: block;
}

.video-js .vjs-quality-button .vjs-menu-content.vjs-qlist {
  border-top-left-radius: 0px !important;
  border-top-right-radius: 0px !important;
}

.vjs-quality-button .vjs-menu-title {
  background-color: var(--color-background-quaternary) !important;
  color: var(--color-player-main) !important;
  font-weight: 900;
  border-bottom: 1px solid var(--color-player-main);
}

.vjs-menu-div.vjs-settings-div .vjs-menu-title {
  background-color: var(--color-background-quaternary) !important;
  color: var(--color-player-main) !important;
  font-weight: 900;
  border-bottom: 1px solid var(--color-player-main);
}

.vjs-menu-content.vjs-settings-list li {
  background-color: var(--color-background-quaternary) !important;
}

.vjs-menu-content.vjs-settings-list li:hover {
  background-color: var(--color-background-quaternary) !important;
  filter: brightness(1.5);
  transition: filter 0.2s ease;
}

.vjs-quality-button .vjs-control-text {
  font-size: 11px;
}

.vjs-submenu.vjs-menu-speed .vjs-settings-back {
  background-color: var(--color-background-quaternary) !important;
  color: var(--color-player-main) !important;
  font-weight: 900;
  border-bottom: 1px solid var(--color-player-main);
  text-transform: uppercase;
}

.video-js .vjs-menu-settings .vjs-settings-back::before {
  border-right-color: var(--color-player-main) !important;
}

.video-js .vjs-menu-settings .vjs-menu-content {
  background-color: var(--color-background-quaternary) !important;
}

.vjs-has-mouse .vjs-menu-settings .vjs-menu-content li:hover {
  background-color: var(--color-background-quaternary) !important;
  filter: brightness(1.5);
  transition: filter 0.2s ease;
}

.vjs-1600 button.vast-skip-button {
  border: none;
  height: 48px;
  padding: 14px;
  border-radius: 999px;
  background-color: var(--color-white, #FFFFFF);
  right: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  width: auto;
  bottom: 86px;
}

button.vast-skip-button:hover {
  background-color: var(--color-neutral-200) !important;
}

.vast-skip-button-text {
  color: var(--color-black, #18181B);
  font-family: 'Inter';
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-align: center;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
}

.video-js .vjs-progress-control .vjs-slider::before {
  background-color: var(--color-neutral-500);
  z-index: 0;
}

.video-js .vjs-progress-control .vjs-slider>*,
.video-js .vjs-progress-control .vjs-slider::before {
  height: 0.375rem;
  border-radius: 0.25rem;
}

.video-js .vjs-progress-control .vjs-slider .vjs-load-progress {
  background-color: var(--color-white);
}

.video-js .vjs-progress-control .vjs-slider:focus>*,
.video-js .vjs-progress-control .vjs-slider:focus::before {
  height: 0.5rem;
  transition: all;
  transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.video-js .vjs-progress-control .vjs-slider:focus::before {
  background-color: var(--color-neutral-600);
}

.video-js .vjs-progress-control .vjs-slider:hover .vjs-play-progress {
  background-color: var(--color-brand-dark);
}

.video-js .vjs-progress-control .vjs-slider:focus .vjs-play-progress {
  background-color: var(--color-brand-dark);
}

.video-js .vjs-progress-control .vjs-slider .vjs-play-progress::before,
.video-js .vjs-progress-control .vjs-play-progress {
  background-color: var(--color-player-main);
}

.video-js .vjs-progress-control .vjs-slider .vjs-play-progress::before {
  top: -2px;
}

.video-js .vjs-progress-control .vjs-slider:focus .vjs-play-progress::before {
  display: block;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  transition: all;
  transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  top: -8px;
  background-color: var(--color-white);
  border: 4px solid var(--color-player-main);
}

/* .video-js button.vjs-mute-control, */
.video-js button.vjs-fullscreen-control,
.video-js button.vjs-picture-in-picture-control {
  display: none;
  appearance: none;
}

.video-js .vjs-upnext-show {
  right: 1.5rem !important;
  border-radius: 0.5rem !important;
}

.video-js .vjs-upnext-show:focus,
.video-js .vjs-upnext-show:focus:focus-visible {
  border-radius: 0.5rem;

  --tw-ring-color: var(--color-neutral-400);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: #000;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  border: 0;
  border-style: none !important;
}

.video-js .vjs-grid p {
  background-color: transparent;
  font-size: 20px;
  font-weight: 700;
  line-height: 24.2px;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  padding-top: 1.5rem;
}

.video-js .vjs-close-btn {
  top: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.video-js .vjs-related .rel-item {
  border-radius: 12px;
}

.video-js .vjs-play-control,
.video-js .vjs-big-play-button {
  display: flex;
  align-items: center;
  justify-content: center;
} 

.video-js .vjs-control-bar .vjs-play-control:focus,
.video-js .vjs-control-bar .vjs-play-control:focus:focus-visible,
.video-js .vjs-control-bar .vjs-rewind-control:focus,
.video-js .vjs-control-bar .vjs-rewind-control:focus:focus-visible,
.video-js .vjs-control-bar .vjs-forward-control:focus,
.video-js .vjs-control-bar .vjs-forward-control:focus:focus-visible,
.video-js .vjs-control-bar .vjs-cog-menu-button:focus,
.video-js .vjs-control-bar .vjs-cog-menu-button:focus:focus-visible,
.video-js .vjs-control-bar .vjs-chapters-button:focus,
.video-js .vjs-control-bar .vjs-chapters-button:focus:focus-visible,
.video-js .vjs-control-bar .vjs-subs-caps-buttonn:focus,
.video-js .vjs-control-bar .vjs-subs-caps-buttonn:focus:focus-visible,
.video-js .vjs-control-bar .vjs-audio-button:focus,
.video-js .vjs-control-bar .vjs-audio-button:focus:focus-visible,
.video-js .vjs-big-play-button:focus,
.video-js .vjs-big-play-button:focus:focus-visible,
.video-js .vjs-replay-button:focus,
.video-js .vjs-replay-button:focus:focus-visible {
  color: var(--color-brand-dark);
  border-radius: 50%;
  border: none !important;
  transition: all;
  transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
} 

.video-js .vjs-close-btn:focus,
.video-js .vjs-close-btn:focus:focus-visible {
  scale: 1.25;
  background-color: var(--color-white);
  color: var(--color-black);
  border-radius: 50%;
  transition: all;
  transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.vjs-1600 .vjs-vast-label {
  display: none;
}

.vjs-text-track-display :first-child .vjs-text-track-cue div {
  font-family: Inter, sans-serif !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  font-size: 3rem !important;
  margin: auto !important;
}