/*
 * Chiroflix accessibility layer.
 * Targets WCAG 2.2 AA behavior without replacing StreamVid's visual system.
 */

.screen-reader-text,
.chiroflix-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.screen-reader-text:focus,
.chiroflix-sr-only:focus {
	clip: auto !important;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	overflow: visible !important;
	white-space: normal !important;
}

.chiroflix-skip-link {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 1000000;
	transform: translateY(-160%);
	padding: 12px 18px;
	border: 2px solid #ffffff;
	border-radius: 6px;
	background: #00031c;
	color: #ffffff !important;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
	text-decoration: none;
}

.chiroflix-skip-link:focus {
	transform: translateY(0);
}

body.admin-bar .chiroflix-skip-link {
	top: 44px;
}

/*
 * A two-color ring remains visible on light, dark, and gradient surfaces.
 * StreamVid declares `outline: none !important` on links and buttons, so these
 * selectors intentionally carry enough specificity to override the parent theme.
 */
html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body select:focus-visible,
html body textarea:focus-visible,
html body summary:focus-visible,
html body [tabindex]:not([tabindex="-1"]):focus-visible,
html body [role="button"]:focus-visible,
html body.chiroflix-keyboard-navigation a:focus,
html body.chiroflix-keyboard-navigation button:focus,
html body.chiroflix-keyboard-navigation input:focus,
html body.chiroflix-keyboard-navigation select:focus,
html body.chiroflix-keyboard-navigation textarea:focus,
html body.chiroflix-keyboard-navigation summary:focus,
html body.chiroflix-keyboard-navigation [tabindex]:not([tabindex="-1"]):focus,
html body.chiroflix-keyboard-navigation [role="button"]:focus {
	outline: 3px solid #ffffff !important;
	outline-offset: 3px !important;
	box-shadow: 0 0 0 6px #ff5a1f !important;
}

html body input:focus-visible,
html body select:focus-visible,
html body textarea:focus-visible,
html body.chiroflix-keyboard-navigation input:focus,
html body.chiroflix-keyboard-navigation select:focus,
html body.chiroflix-keyboard-navigation textarea:focus {
	border-color: #ffffff !important;
}

/* Keep common standalone controls comfortably operable by touch and pointer. */
:where(
	button,
	input[type="button"],
	input[type="submit"],
	input[type="reset"],
	.jws-tiger-mobile,
	.modal-close,
	.close-button,
	.mfp-close,
	.jws-button-prev,
	.jws-button-next,
	.owl-prev,
	.owl-next,
	.backToTop,
	.search-submit,
	.searchsubmit
) {
	min-width: 44px;
	min-height: 44px;
}

.jws-tiger-mobile,
.modal-close,
.jws-button-prev,
.jws-button-next,
.backToTop,
[role="button"] {
	cursor: pointer;
}

/* StreamVid removes outlines in several component styles; never suppress them for keyboard users. */
:where(a, button, input, select, textarea, summary, [tabindex], [role="button"]):focus-visible {
	text-decoration-skip-ink: auto;
}

/* Content links must be identifiable without relying only on color. */
:where(.entry-content, .page-content, .jws-description, .pmpro_content_message, .woocommerce-message, .woocommerce-info) a:not(.button):not(.btn-main):not(.elementor-button) {
	text-decoration: underline;
	text-decoration-thickness: 0.1em;
	text-underline-offset: 0.18em;
}

:where(.entry-content, .page-content, .jws-description) a:not(.button):not(.btn-main):hover {
	text-decoration-thickness: 0.16em;
}

/* Form clarity, contrast, and error recognition. */
:where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
	min-height: 44px;
	border-color: #7f8292;
}

:where(input, textarea)::placeholder {
	color: #b8bac4 !important;
	opacity: 1 !important;
}

:where(label, legend, .form-label) {
	color: #ffffff;
}

:where(.woocommerce-error, .pmpro_error, .jws-error, [aria-invalid="true"]) {
	border-color: #ff6b6b !important;
}

:where(input, select, textarea)[aria-invalid="true"] {
	box-shadow: 0 0 0 2px #ff6b6b !important;
}

/* Chiroflix orange-to-yellow gradients need dark text at normal text sizes. */
:where(
	.button-default,
	.btn-main.button-default,
	.pmpro_btn,
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce input.button,
	.chiroflix-movie-runtime
) {
	color: #0a0b18 !important;
}

/* Give dark controls and fields a visible component boundary. */
:where(input, select, textarea, .select2-selection, .quantity, .woocommerce form .form-row input.input-text) {
	border-width: 1px;
	border-style: solid;
}

/* Dynamic notices should remain readable and visually distinct. */
:where(.woocommerce-message, .woocommerce-info, .pmpro_message, [role="status"], [role="alert"]) {
	line-height: 1.5;
}

/* Dialog content must not hide the focused control behind the viewport edge. */
:where([role="dialog"], .mfp-content, .jws-filter-modal .modal-content) {
	max-height: calc(100vh - 32px);
	overflow-y: auto;
	scroll-padding: 24px;
}

@media (max-width: 767px) {
	:root {
		--font-size-sm: 14px;
		--line-height-sm: 20px;
	}

	body {
		font-size: 16px;
	}

	.fs-small,
	.small,
	small {
		font-size: 14px !important;
		line-height: 1.45 !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	html:focus-within {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

@media (forced-colors: active) {
	:where(a, button, input, select, textarea, summary, [tabindex], [role="button"]):focus-visible {
		outline: 3px solid Highlight !important;
		box-shadow: none !important;
	}

	.button-default,
	.btn-main,
	.chiroflix-movie-runtime {
		forced-color-adjust: auto;
	}
}