/* TEMP HERO VIDEO — styles for templates/hero-video-temp.php. Enqueued only while the option is on. */
.hero_sec .mainhero .hero-video-temp { position: relative; overflow: hidden; }
.hero_sec .mainhero .hero-video-temp img.hero-video-temp-poster { display: block; width: 100%; height: auto; }
.hero_sec .mainhero .hero-video-temp video { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; display: block; object-fit: cover; }

.hero-video-temp-toggle { position: absolute; right: 24px; bottom: 24px; width: 48px; height: 48px; padding: 0; border: 2px solid #FFFFFF; border-radius: 50%; background: rgba(0, 0, 0, 0.35); cursor: pointer; box-shadow: 2px 2px 2px #00000029; transition: 0.3s all; }
.hero-video-temp-toggle:hover { background: rgba(0, 0, 0, 0.55); }
.hero-video-temp-toggle:focus-visible { outline: 3px solid #0075CF; outline-offset: 3px; }
/* pause icon: two bars */
.hero-video-temp-toggle:before,
.hero-video-temp-toggle:after { content: ""; position: absolute; top: 50%; width: 4px; height: 16px; background: #FFFFFF; transform: translateY(-50%); }
.hero-video-temp-toggle:before { left: 17px; }
.hero-video-temp-toggle:after { right: 17px; }
/* play icon: triangle */
.hero-video-temp-toggle[aria-pressed="true"]:before { left: 18px; width: 0; height: 0; background: none; border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #FFFFFF; }
.hero-video-temp-toggle[aria-pressed="true"]:after { display: none; }

@media only screen and (max-width: 767px) {
	.hero-video-temp-toggle { right: 12px; bottom: 12px; width: 40px; height: 40px; }
	.hero-video-temp-toggle:before { left: 13px; height: 14px; }
	.hero-video-temp-toggle:after { right: 13px; height: 14px; }
	.hero-video-temp-toggle[aria-pressed="true"]:before { left: 14px; border-width: 8px 0 8px 13px; }
}

/* Reduced motion: show the still image only. */
@media (prefers-reduced-motion: reduce) {
	.hero_sec .mainhero .hero-video-temp video,
	.hero-video-temp-toggle { display: none; }
}
