/* Site video player (js/video-player.js, Plyr 3.8.4 from js/vendor/plyr-3.8.4): TAP colours on top of plyr.css, same layout as the
   smartico.ai site. Brand green (#79c143, the site's .button) for progress, hover and the big play button in the centre, the
   navy of the site's dark sections for the control bar, Poppins for the time. Loaded by partials/video-player-assets.hbs. */
.tap-video .plyr {
  position: absolute; inset: 0; width: 100%; height: 100%;
  --plyr-color-main: #79c143;
  --plyr-font-family: "Poppins", "Montserrat", sans-serif;
  --plyr-font-size-time: .8125rem;
  --plyr-video-background: #181d2e;
  --plyr-video-control-color: #fff;
  --plyr-video-control-color-hover: #21273e;
  --plyr-video-control-background-hover: #79c143;
  --plyr-video-controls-background: linear-gradient(rgba(24, 29, 46, 0), rgba(24, 29, 46, .88));
  --plyr-control-radius: .5rem;
  --plyr-control-icon-size: 18px;
  --plyr-range-thumb-background: #fff;
  --plyr-range-thumb-shadow: 0 0 0 4px rgba(121, 193, 67, .35);
  --plyr-range-fill-background: #79c143;
  --plyr-video-progress-buffered-background: rgba(255, 255, 255, .28);
  --plyr-tooltip-background: #21273e;
  --plyr-tooltip-color: #fff;
  --plyr-tooltip-radius: .375rem;
}
.tap-video .plyr video { object-fit: contain; }
.tap-video .plyr__poster { background-size: cover; }

/* the big play button in the centre */
.tap-video .plyr__control--overlaid {
  width: 5.5rem; height: 5.5rem; padding: 0; display: grid; place-items: center;
  background: #79c143; color: #fff; opacity: 1;
  box-shadow: 0 0 0 .75rem rgba(121, 193, 67, .28), 0 1.25rem 3rem rgba(0, 0, 0, .55);
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease;
}
.tap-video .plyr__control--overlaid svg { width: 1.75rem; height: 1.75rem; left: .125rem; }
.tap-video .plyr__control--overlaid:hover,
.tap-video .plyr__control--overlaid:focus-visible {
  background: #79c143; color: #fff;
  transform: translate(-50%, -50%) scale(1.07);
  box-shadow: 0 0 0 1rem rgba(121, 193, 67, .34), 0 1.5rem 3.5rem rgba(0, 0, 0, .6);
}
.tap-video .plyr__control--overlaid:focus-visible { outline: 2px solid #fff; outline-offset: .375rem; }

/* the control bar */
.tap-video .plyr--video .plyr__controls { padding: 2.5rem 1rem .875rem; gap: .25rem; }
.tap-video .plyr__time { font-variant-numeric: tabular-nums; }
.tap-video .plyr__time + .plyr__time::before { color: rgba(255, 255, 255, .6); }

@media (max-width: 479px) {
  .tap-video .plyr__control--overlaid { width: 4rem; height: 4rem; box-shadow: 0 0 0 .5rem rgba(121, 193, 67, .28), 0 1rem 2rem rgba(0, 0, 0, .5); }
  .tap-video .plyr__control--overlaid svg { width: 1.375rem; height: 1.375rem; }
  .tap-video .plyr--video .plyr__controls { padding: 2rem .5rem .5rem; }
}
@media (prefers-reduced-motion: reduce) { .tap-video .plyr__control--overlaid { transition: none; } }