/* Nimbletoad accessibility remediation - Longevity Physical Therapy
   WCAG 2.2 AA audit, November 15, 2026.
   The brand color tokens live in Astra (Customizer > Global > Colors) and the
   Beaver Builder global styles. Change them there (values in the audit report).
   This file covers what the global settings cannot reach.
   Selectors were verified against the live DOM on November 15, 2026. */

/* --- Focus visible (2.4.7) --------------------------------------------- */

/* Gravity Forms fields and buttons: the theme removes the outline. */
.gform_wrapper input:focus-visible,
.gform_wrapper select:focus-visible,
.gform_wrapper textarea:focus-visible,
.gform_wrapper button:focus-visible,
.gform_wrapper .gform_button:focus-visible {
	outline: 2px solid #1A1A1A;
	outline-offset: 2px;
}

/* Astra scroll-to-top control (role and key handling added in a11y.js). */
#ast-scroll-top:focus-visible {
	outline: 2px solid #1A1A1A;
	outline-offset: 2px;
}

/* PowerPack off-canvas menu: links and the Close control show no focus. */
.pp-menu-nav a:focus-visible,
.pp-menu-nav button:focus-visible,
.pp-menu-close-btn:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* --- Target size (2.5.8) ---------------------------------------------- */

/* Header submenu chevrons are 24x23; the minimum is 24x24. */
.pp-menu-toggle {
	min-width: 24px;
	min-height: 24px;
}

/* --- Use of color (1.4.1) --------------------------------------------- */

/* Inline links in body text are orange with no underline. */
.fl-builder-content p a:not(.fl-button):not(.pp-button):not(.button),
.fl-rich-text p a,
.entry-content p a,
.ast-single-post .entry-content a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* --- Keyboard flip cards (2.1.1, 1.4.13) ------------------------------ */

/* Home page "Longevity Locations" flip boxes. Verified November 15, 2026:
   PowerPack flips a card by adding .pp-hover to .pp-flipbox-container from JS,
   not with a CSS :hover rule. a11y.js block 9 adds the same class on keyboard
   focus, so the module's own flip rule does the work. This only adds a focus
   ring on the link once the back face is showing. */
.pp-flipbox-back a.pp-more-link:focus-visible {
	outline: 2px solid #1A1A1A;
	outline-offset: 2px;
}

/* --- Motion (2.2.2, 2.3.3) -------------------------------------------- */

/* Hero background video: stop when the visitor asks for reduced motion.
   A visible pause button still needs to be added to the hero rows. */
@media (prefers-reduced-motion: reduce) {
	.fl-bg-video video,
	.fl-row-bg-video video {
		display: none !important;
	}
}

/* --- Reviews carousel (widget, 1.4.11) --------------------------------- */

/* Verified November 15, 2026: the Business Reviews Bundle controls on this site
   are button.rpi-slider-prev / button.rpi-slider-next. They are icon buttons
   named "Previous reviews" / "Next reviews", chevron #777777 on #F5F5F5 (4.1:1).
   There is no "previous" / "next" text node to recolor, so the old guess rule
   was removed. Only a focus ring is added here. */
.rpi-slider-prev:focus-visible,
.rpi-slider-next:focus-visible {
	outline: 2px solid #1A1A1A;
	outline-offset: 2px;
}

/* --- Reflow (1.4.10) -------------------------------------------------- */

/* Past webinars archive overflows by 20px at 320px. */
@media (max-width: 360px) {
	.post-type-archive-past_webinars article,
	.post-type-archive-past_webinars .ast-row {
		max-width: 100%;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}

/* --- Contrast follow-ups to the global color change (1.4.3) ------------ */

/* Footer newsletter form labels inherit the body color. The body color went
   darker for white backgrounds (#73747A), which is too dark on the dark footer.
   Keep the original footer gray there: #85868C on #1A1C20 is 4.7:1. */
.fl-builder-content[data-type="footer"] .gform_wrapper .gfield_label,
.fl-builder-content[data-type="footer"] .gform_wrapper .gform-field-label,
.fl-builder-content[data-type="footer"] .gform_wrapper legend {
	color: #85868C;
}

/* Required asterisks are brand orange on white (1.9:1). Use the text-safe
   orange outside the dark footer, where the brand orange already passes.
   #985D06 holds 4.5:1 on white and on the light gray bands. */
.fl-builder-content:not([data-type="footer"]) .gform_wrapper .gfield_required,
.fl-builder-content:not([data-type="footer"]) .gform_wrapper .gfield_required * {
	color: #985D06 !important;
}

/* --- Office contact popup (UABB modal) --------------------------------- */

.uabb-modal .uabb-modal-close:focus-visible {
	outline: 2px solid #FFFFFF;
	outline-offset: 2px;
}
.uabb-modal a.banner-link:focus-visible {
	outline: 3px solid #1A1A1A;
	outline-offset: 2px;
}
.location-popup-icon-md:focus-visible {
	outline: 2px solid #1A1A1A;
	outline-offset: 3px;
}

/* --- Hero video pause button (2.2.2) ----------------------------------- */

.nt-video-toggle {
	position: absolute;
	left: 16px;
	bottom: 16px;
	z-index: 5;
	min-width: 44px;
	min-height: 44px;
	padding: 8px 14px;
	border: 2px solid #FFFFFF;
	border-radius: 4px;
	background: #1A1A1A;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
}
.nt-video-toggle:hover,
.nt-video-toggle:focus {
	background: #1A1A1A;
	color: #FFFFFF;
}
.nt-video-toggle:focus-visible {
	outline: 3px solid #FFFFFF;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #1A1A1A;
}

/* --- Focus visible, site-wide backstop (2.4.7, 1.4.11) ------------------ */

/* The re-scan on November 15, 2026 still found form fields, in-page nav links
   and some buttons with no visible focus: module CSS sets outline: none with
   higher specificity. Two-tone ring so it shows on white, gray, orange and the
   dark footer. */
.fl-builder-content a:focus-visible,
.fl-builder-content button:focus-visible,
.fl-builder-content input:focus-visible,
.fl-builder-content select:focus-visible,
.fl-builder-content textarea:focus-visible,
.fl-builder-content [tabindex]:focus-visible,
.gform_wrapper input:focus-visible,
.gform_wrapper select:focus-visible,
.gform_wrapper textarea:focus-visible,
.gform_wrapper button:focus-visible {
	outline: 2px solid #1A1A1A !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 5px #FFFFFF !important;
}
