/* === Ajustes finos corrigidos === */

/* Barra inferior mais alta */
.vjs-control-bar {
  height: 65px !important;
  line-height: 65px !important;   /* garante centralização vertical */
  font-size: 1.2em;               /* mantém o texto visível */
}

/* Botões de controle maiores e centralizados */
.vjs-control-bar .vjs-control {
  width: 50px !important;
  height: 50px !important;
  line-height: 50px !important;   /* centraliza os ícones */
  padding: 0 !important;          /* remove espaçamentos extras */
  margin: 0 3px !important;       /* espaço lateral entre os botões */
}

/* Ícones dentro dos botões */
.vjs-control-bar .vjs-icon-placeholder:before {
  font-size: 22px !important;
  line-height: 50px !important;   /* centraliza ícone no botão */
}

/* Tempo regressivo visível e alinhado */
.vjs-remaining-time,
.vjs-current-time,
.vjs-duration {
  font-size: 1em !important;
  line-height: 65px !important;   /* centraliza dentro da barra */
  color: #fff !important;
}

/* Botão central de Play (inicial e pausado) */
.vjs-big-play-button {
  width: 110px !important;
  height: 110px !important;
  line-height: 110px !important;
  border-radius: 50% !important;       /* redondo */
  background: rgba(0, 0, 0, 0.6) !important; /* preto translúcido */
  border: 2px solid #fff !important;   /* borda branca */
  color: #fff !important;
  font-size: 5em !important;           /* ícone maior */
  transition: all 0.3s ease-in-out;

  /* Correção para centralizar */
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important; /* remove margens negativas padrão */
}

/* Hover: branco translúcido */
.vjs-big-play-button:hover {
  background: rgba(255, 255, 255, 0.4) !important; /* branco translúcido */
  border-color: #fff !important;
  color: #fff !important;
}

/* Mostrar o botão grande quando o player estiver pausado */
.vjs-paused .vjs-big-play-button {
  display: block !important;
}

/* Esconder o botão grande quando estiver tocando */
.vjs-playing .vjs-big-play-button {
  display: none !important;
}