/*
 * FSM WCAG Accessibility Kit — self-contained styles + default tokens.
 * Copy with the accessibility/ folder. Brand sites may override :root vars in theme.css
 * (enqueue loads before typical theme-style so overrides win).
 */

:root {
	--focus-ring-outer: #109cde;
	--focus-ring-inner: #ffffff;
	--border-focus: #109cde;
	--video-control-bg: rgba(0, 0, 0, 0.6);
	--video-control-bg-hover: rgba(0, 0, 0, 0.8);
	--video-control-shadow: rgba(0, 0, 0, 0.4);
	--video-control-shadow-hover: rgba(0, 0, 0, 0.6);
	--video-control-focus: #fb923c;
	--video-control-icon: #ffffff;
	--a11y-skip-bg: #152b37;
	--a11y-skip-color: #ffffff;
}

/* Focus visible ring */
:focus-visible {
	outline: 2px solid var(--focus-ring-outer, #109cde);
	box-shadow: 0 0 0 2px var(--focus-ring-inner, #ffffff);
	position: relative;
	z-index: 1;
}

/* Skip to main content: off-screen until focused */
.skip-link {
	position: absolute;
	left: -9999px;
	z-index: 999999;
	padding: 0.75rem 1rem;
	background: var(--a11y-skip-bg, #152b37);
	color: var(--a11y-skip-color, #ffffff);
	font-weight: 600;
	text-decoration: none;
	border-radius: 0 0 4px 0;
}

.skip-link:focus {
	position: fixed;
	left: 0;
	top: 0;
	outline: 3px solid var(--border-focus, #109cde);
	outline-offset: 2px;
}

/* Video Play/Pause Controls (WCAG 2.2 AA) */
.fsm-video-control {
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background-color: var(--video-control-bg, rgba(0, 0, 0, 0.6));
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999 !important;
	transition: all 0.2s ease;
	box-shadow: 0 2px 8px var(--video-control-shadow, rgba(0, 0, 0, 0.4));
	pointer-events: auto !important;
}

.fsm-video-control-hover {
	opacity: 0;
	pointer-events: none;
}

.fsm-video-control-hover.fsm-video-control-visible,
.fsm-video-control-hover:focus {
	opacity: 1;
	pointer-events: auto;
}

.fsm-video-control:hover {
	background-color: var(--video-control-bg-hover, rgba(0, 0, 0, 0.8));
	transform: scale(1.1);
	box-shadow: 0 4px 12px var(--video-control-shadow-hover, rgba(0, 0, 0, 0.6));
}

.fsm-video-control:focus-visible {
	outline: 2px solid var(--video-control-focus, #fb923c);
	outline-offset: 2px;
}

.fsm-video-control i {
	color: var(--video-control-icon, #ffffff);
	font-size: 14px;
	line-height: 1;
}

.portfolio-featured-video .fsm-video-control,
.gallery-hero .fsm-video-control,
.et-pb-background-video .fsm-video-control,
.et-pb-has-background-video .fsm-video-control,
.et_pb_video_box .fsm-video-control {
	top: auto;
	bottom: 1rem;
	right: 1rem;
}

.portfolio-featured-video .et_pb_video_box,
.gallery-hero,
.et-pb-background-video {
	position: relative;
}

.et-pb-has-background-video {
	position: relative;
}

.et-pb-has-background-video .fsm-video-control {
	z-index: 99999 !important;
}

/*
 * Universal text link underlines — disabled for this install.
 * Brand underlines / inversion hover live in theme.css (last week’s a11y work).
 *
 * #main-content a:not(.et_pb_button, .icon, img, .fsm-post-list a, .card, .exclude-style) { ... }
 * #main-content a:not(.et_pb_button, .icon, img, .fsm-post-list a, .card):hover { ... }
 */

/* FAQ / Divi toggle focus ring (wrap accordion in .faq-section) */
#page-container .faq-section .et_pb_toggle:has(.et_pb_toggle_title:focus-visible) {
	outline: 2px solid var(--focus-ring-outer, #109cde);
	outline-offset: -2px;
	border-radius: 8px;
}

#page-container .faq-section .et_pb_toggle .et_pb_toggle_title:focus-visible {
	outline: none;
}

/* --- .video-lightbox modal --- */
.video-lightbox .et_pb_video_overlay {
	cursor: pointer;
}

html.video-lightbox-open {
	overflow: hidden;
}

.fsm-video-lightbox {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	box-sizing: border-box;
}

.fsm-video-lightbox[hidden] {
	display: none !important;
}

.fsm-video-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.8);
	border: 0;
	padding: 0;
	cursor: pointer;
}

.fsm-video-lightbox__dialog {
	position: relative;
	z-index: 1;
	width: min(960px, 100%);
	aspect-ratio: 16 / 9;
	background: #000;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.fsm-video-lightbox__dialog--portrait {
	width: min(420px, 100%);
	aspect-ratio: 2 / 3;
}

.fsm-video-lightbox__frame {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.fsm-video-lightbox__video {
	width: 100%;
	height: 100%;
	display: block;
	background: #000;
}

.fsm-video-lightbox__close {
	position: absolute;
	top: -2.5rem;
	right: 0;
	z-index: 2;
	width: 2rem;
	height: 2rem;
	border: 0;
	border-radius: 2px;
	background: #fff;
	color: #111;
	font-size: 1.25rem;
	line-height: 1;
	cursor: pointer;
}

.fsm-video-lightbox__close:focus-visible {
	outline: 2px solid var(--focus-ring-outer, #109cde);
	outline-offset: 2px;
}

/* Mega Menu: avoid clipping flyouts (page-container uses overflow:hidden). */
#page-container .et-l--header,
#mega-menu-wrap-primary-menu,
#mega-menu-wrap-secondary-menu,
#mega-menu-wrap-primary-menu #mega-menu-primary-menu,
#mega-menu-wrap-secondary-menu #mega-menu-secondary-menu {
	overflow: visible;
}

/* Max Mega Menu flyout edge clamp (fsm-flyout-align-end) */
@media only screen and (min-width: 982px) {
	#mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-flyout.fsm-flyout-align-end > ul.mega-sub-menu,
	#mega-menu-wrap-secondary-menu #mega-menu-secondary-menu > li.mega-menu-flyout.fsm-flyout-align-end > ul.mega-sub-menu {
		left: auto;
		right: 0;
	}

	#mega-menu-wrap-primary-menu #mega-menu-primary-menu ul.mega-sub-menu > li.mega-menu-item.fsm-flyout-align-end > ul.mega-sub-menu,
	#mega-menu-wrap-secondary-menu #mega-menu-secondary-menu ul.mega-sub-menu > li.mega-menu-item.fsm-flyout-align-end > ul.mega-sub-menu {
		left: auto;
		right: 100%;
	}
}