/* herovto-svg */

/* .hero-ttbi-b .wp-block-button__link:focus{
  outline-width: 1px;
  outline-offset: -1px;
}

.hero-ttbi-b .wp-block-button__link:not(:focus) {
  border: 1px solid currentColor;
} */


/* IMPORTANT: icons must be hidden by default, so they don't "reappear" after animation */
/* Button hidden by default */
:is(.video-toggle-overlay, .hero-ttbi-b) .custom-video-toggle{
  opacity: 0;
  pointer-events: auto;
}

/* Only show BEFORE first play, while paused */
:is(.video-toggle-overlay, .hero-ttbi-b)[data-state="paused"][data-has-played="0"] .custom-video-toggle{
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
}

:is(.video-toggle-overlay, .hero-ttbi-b)[data-state="paused"][data-has-played="0"] .video-play{
  opacity: 1;
}

:is(.video-toggle-overlay, .hero-ttbi-b)[data-state="paused"][data-has-played="0"] .video-pause{ opacity: 0; }

/* Bezel icons hidden unless animating */
:is(.video-toggle-overlay, .hero-ttbi-b) .video-play,
:is(.video-toggle-overlay, .hero-ttbi-b) .video-pause{
  opacity: 0;
  transform: scale(1);
  pointer-events: none;
}

@keyframes ytp-delhi-modern-bezel-fadeout {
  0% { opacity: 0; transform: scale(1); }
  25%, 75% { opacity: 1; transform: scale(1.33); }
  100% { opacity: 0; transform: scale(1); }
}

/* This class is added briefly by JS to run the animation */
.video-bezel-anim {
  animation: ytp-delhi-modern-bezel-fadeout 1s cubic-bezier(0.05, 0, 0, 1) forwards;
  will-change: opacity, transform;
}