/**
 * Accessibility Fixes CSS
 * WCAG 2.1 Level AA compliance — reusable across GD Platform / Phoenix theme sites.
 *
 * CUSTOMIZE: search for "CUSTOMIZE" comments and update values per site.
 *
 * Index:
 *
 *   FOUNDATION
 *    1. Utilities (visually-hidden, screen-reader-text)
 *    2. Skip links
 *    3. Focus indicators
 *    4. Reduced motion
 *    5. Buttons
 *    6. Tables
 *    7. Typography
 *   (8–9 reserved)
 *
 *   HEADER & NAVIGATION
 *   10. Header
 *   11. Desktop Navigation
 *   12. Mobile Navigation
 *   13. Breadcrumbs
 *   14. Pagination
 *  (15–19 reserved)
 *
 *   CONTENT
 *   20. Content — General
 *   21. Content — Single Posts
 *   22. Content — Events
 *   23. Content — Archive Pages
 *   24. Images
 *   25. Video / Audio embeds
 *  (26–29 reserved)
 *
 *   FOOTER
 *   30. Footer
 *   31. Footer Menu
 *   32. Social icons
 *   33. Notifications / Alerts
 *  (34 reserved)
 *
 *   ACCESSIBILITY FEATURES
 *   35. Zoom — General
 *  (36–39 reserved)
 *
 *   REVIEWS
 *   40. Reviews — Trustindex
 *   41. Reviews — Others
 *  (42–49 reserved)
 *
 *   FORMS
 *   50. Forms — Gravity Forms
 *   51. Forms — ActiveDEMAND
 *   52. Forms — Complianz
 *   53. Forms — Others
 *  (54–59 reserved)
 *
 *   CHATBOT
 *   60. Chatbot — TalkFurther / further-embedded-vsa + Promotional Banner
 *   61. Chatbot — Others
 *  (62–69 reserved)
 *
 *   SLIDERS
 *   70. Sliders — Swiper / Hero
 *   71. Sliders — Beaver Builder Slideshow
 *   72. Sliders — bxSlider
 *   73. Sliders — Others
 *  (74–79 reserved)
 *
 *   OVERLAYS
 *   80. Overlays — Magnific Popup
 *   81. Overlays — Popup Maker
 *   82. Overlays — Others
 *  (83–89 reserved)
 *
 *   MAPS
 *   90. Maps — WP Google Maps Pro
 *   91. Maps — Raw Google Maps (ACF embed)
 *   92. Maps — Others
 *  (93–99 reserved)
 *
 *   ELEMENTOR (add only on Elementor sites)
 *  100. Elementor — General
 *  101. Elementor — Screen-only spans
 *  102. Elementor — Search form
 *  103. Elementor — Accordion
 *  (104+ reserved)
 */


/* =============================================================================
   1. Utilities
   ============================================================================= */

/*
 * Visually hidden but accessible to screen readers.
 * Use on text that conveys information only to AT (e.g. "opens in new tab").
 * The :focus rule allows skip links to become visible on keyboard focus.
 *
 * CUSTOMIZE: rename .lppr-visually-hidden to the project prefix class
 * (e.g. .cdc-visually-hidden for CDC, .lhv-visually-hidden for LHV) and
 * update all JS files that inject this class name (accessibility__links.js,
 * accessibility__reviews.js, etc.).
 */
.lppr-visually-hidden,  /* CUSTOMIZE: rename to project prefix, e.g. .cdc-visually-hidden */
.screen-reader-text,
.sr-only {
	position:    absolute !important;
	left:        -10000px !important;
	top:         auto !important;
	width:       1px !important;
	height:      1px !important;
	overflow:    hidden !important;
	clip:        rect(0, 0, 0, 0) !important;
	clip-path:   inset(50%) !important;
	white-space: nowrap !important;
	border:      0 !important;
	padding:     0 !important;
	margin:      0 !important;
}
.lppr-visually-hidden:focus,  /* CUSTOMIZE: rename to match the selector above */
.screen-reader-text:focus {
	position:    static !important;
	left:        auto !important;
	width:       auto !important;
	height:      auto !important;
	overflow:    visible !important;
	clip:        auto !important;
	clip-path:   none !important;
	white-space: normal !important;
}


/* =============================================================================
   2. Skip links
   ============================================================================= */

/*
 * Skip link — hidden off-screen until focused, then visible at top-left.
 * Selectors match this theme's actual markup (templates/base.twig):
 *   a.skip-link       — primary skip-to-content link
 *   a#skip-chat        — skip-to-chatbot link (hidden until chatbot loads)
 *   a#skip-banner      — skip-to-announcement link (hidden until banner opens)
 *
 * Brand colors: lapo-leaf (#00594F) text, lapo-pistachio (#BBCAAD) background,
 * lapo-sunshine (#FBAF32) focus ring — see scss/_colors.scss.
 */
a.skip-link,
a#skip-chat,
a#skip-banner {
	position:        absolute !important;
	left:            -9999px !important;
	top:             0 !important;
	z-index:         999999 !important;
	padding:         0.75em 1em !important;
	background:      #BBCAAD !important;
	color:           #00594F !important;
	font-weight:     600 !important;
	text-decoration: none !important;
	border:          0 !important;
	clip:            rect(0, 0, 0, 0) !important;
	clip-path:       inset(50%) !important;
	overflow:        hidden !important;
}
a.skip-link:focus,
a#skip-chat:focus,
a#skip-banner:focus {
	position:       fixed !important;
	left:           0.5em !important;
	top:            0.5em !important;
	clip:           auto !important;
	clip-path:      none !important;
	overflow:       visible !important;
	outline:        2px solid #FBAF32 !important;
	outline-offset: 2px !important;
}
a.skip-link:hover,
a#skip-chat:hover,
a#skip-banner:hover {
	background: #ffffff !important;
	color:      #00594F !important;
}


/* =============================================================================
   3. Focus indicators
   ============================================================================= */

/*
 * Global 2px solid outline on all interactive elements.
 * outline-color defaults to currentColor — it will match whatever text color
 * the element has. Only override where the element sits on a dark background
 * and currentColor would be invisible (see section 30 for footer examples).
 *
 * CUSTOMIZE: if the site uses a brand focus color (e.g. blue), add it here:
 * html body *:focus, html body *:focus-visible { outline-color: #005a87; }
 */
html body *:focus,
html body *:focus-visible {
	outline:        2px solid;
	outline-offset: 2px;
}

/*
 * Dark-background containers — inset box-shadow instead of outline so the
 * focus ring is always visible regardless of background color.
 *
 * CUSTOMIZE: replace #topBar with the site's dark header/banner selector.
 * Adjust #fff (inner ring) and #000 (outer ring) to ensure ≥3:1 contrast
 * against the dark background (WCAG SC 1.4.11 Non-text Contrast).
 */
/* Example (uncomment and adapt):
#topBar *:focus,
#topBar *:focus-visible {
	box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 4px #000;
	outline: none;
}
*/


/* =============================================================================
   4. Reduced motion
   ============================================================================= */

/*
 * Blanket animation/transition kill — uncomment on sites where third-party
 * plugins fire animations that cannot be individually targeted in their sections.
 *
 * WHY opt-in rather than always-on:
 * Targeted rules in each component section are precise. This blanket rule also
 * kills functional transitions (focus ring fades, disclosure animations). Enable
 * it only when targeted rules are insufficient.
 *
 * Source: Casa de las Campanas (CDC_A11Y) — promoted to fran/ as opt-in.
 */
/*
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration:        0.001ms !important;
		animation-iteration-count: 1       !important;
		transition-duration:       0.001ms !important;
		scroll-behavior:           auto    !important;
	}
}
*/


/* =============================================================================
   5. Buttons
   =============================================================================

   Add site-specific button accessibility rules here. Buttons must meet the
   minimum 44×44px touch target (WCAG SC 2.5.5) and always show a visible
   focus indicator — override the theme here when it suppresses outlines.
   Icon-only buttons need an accessible label; set aria-label in JS or HTML.

   CUSTOMIZE: replace .site-icon-button with the theme's icon button class.
   Example (uncomment and adapt):
   .site-icon-button {
       min-width:  44px;
       min-height: 44px;
   }
*/


/* =============================================================================
   6. Tables
   =============================================================================

   Add site-specific table accessibility rules here. Data tables must have
   <th> headers and scroll horizontally on narrow viewports rather than
   breaking layout. Contrast of cell text against background must meet SC 1.4.3.

   CUSTOMIZE: replace .site-table-wrap with the theme's table container class.
   Example (uncomment and adapt):
   .site-table-wrap {
       overflow-x: auto;
   }
   .site-table-wrap:focus-within {
       outline: 2px solid;
   }
*/


/* =============================================================================
   7. Typography
   =============================================================================

   Add site-specific typography accessibility rules here. Body text should be
   at least 16px with line-height ≥ 1.5 (WCAG SC 1.4.8). Override theme rules
   that compress letter-spacing or set font-size below the recommended minimum.

   CUSTOMIZE: adjust body selector if the theme wraps content in a custom class.
   Example (uncomment and adapt):
   body {
       line-height: 1.5;
   }
*/


/* ─── 8–9 reserved ─────────────────────────────────────────────────────────── */


/* =============================================================================
   10. Header
   =============================================================================

   Add site-specific header accessibility rules here.
   Sticky headers must not obscure focused content — use scroll-margin-top on
   main landmark elements so keyboard-navigated headings are not hidden behind
   the fixed bar. Logo alt text and role="banner" are handled in HTML/PHP.

   Example (uncomment and adapt — replace 80px with the actual header height):
   .site-header {
       scroll-margin-top: 80px;
   }
*/


/* =============================================================================
   11. Desktop Navigation
   =============================================================================

   DISABLED — uncomment the sub-section that applies to this site.
   Only one sub-section (a or b) should be active at a time.

   Sub-section a: Phoenix theme nav (non-Elementor sites).
   Sub-section b: Elementor desktop nav — requires class
                  "lppr-a11y-header-nav-desktop" on the Elementor nav widget
                  (set via Elementor Advanced → CSS Classes).

   CUSTOMIZE for sub-section a:
     — #menu-primary-navigation / #anchorMenu → update to match the site's nav IDs
     — .site-sub-arrow color: inherit → override if the nav link color differs
     — .site-submenu-open transform → match the theme's submenu open transform

   CUSTOMIZE for sub-section b:
     — .sub-arrow svg fill (#ffffff) → nav top-level link color
     — .sub-arrow:focus outline (#ffffff) → focus ring (must contrast with nav bg)
     — .sub-menu background (#ffffff) → submenu dropdown background color
     — .sub-menu .sub-arrow svg fill (#333333) → nested arrow icon color
     — .sub-menu .sub-arrow:focus outline (#005a87) → nested arrow focus ring
     — --ada-menu-active-bg (#4a748c) → nav hover/open background color
     — --ada-menu-text-white (#ffffff) → text color on active nav background
     — unselected nav link color (white) → top-level link color in default state

   JS counterpart: initDesktopNav() or accessibility__menu.js
*/


/* ── a. Phoenix theme nav ───────────────────────────────────────────────────── */

/*
#menu-primary-navigation .menu-item-has-children,
#anchorMenu .menu-item-has-children {
	display:     flex;
	align-items: stretch;
	position:    relative;
}
#menu-primary-navigation .menu-item-has-children > a,
#anchorMenu .menu-item-has-children > a {
	flex: 1 1 auto;
}

.site-sub-arrow {
	display:         inline-flex;
	align-items:     center;
	justify-content: center;
	flex-shrink:     0;
	width:           32px;
	background:      transparent;
	border:          0;
	cursor:          pointer;
	padding:         0;
	color:           inherit;
	opacity:         0.85;
	transition:      opacity 0.15s ease;
}
.site-sub-arrow:hover,
.menu-item-has-children:hover > .site-sub-arrow {
	opacity: 1;
}
.site-sub-arrow svg {
	width:      12px;
	height:     auto;
	fill:       currentColor;
	transition: transform 0.2s ease;
}
.site-sub-arrow[aria-expanded="true"] svg {
	transform: rotate(180deg);
}
.site-sub-arrow:focus,
.site-sub-arrow:focus-visible {
	outline:        2px solid;
	outline-offset: -2px;
}

#menu-primary-navigation .menu-item-has-children.site-submenu-open > .sub-menu,
#anchorMenu .menu-item-has-children.site-submenu-open > .sub-menu {
	display:    block !important;
	visibility: visible !important;
	opacity:    1 !important;
	transform:  translate(-50%) scale(1) !important;
}

@media (prefers-reduced-motion: reduce) {
	.site-sub-arrow svg {
		transition: none;
	}
}
*/

/* Uncomment and adapt the :focus-within safety net for this site's nav selectors:
.main-navigation .menu-item-has-children:focus-within > .sub-menu {
	display:    block !important;
	visibility: visible !important;
	opacity:    1 !important;
}
*/


/* ── b. Elementor desktop nav — .lppr-a11y-header-nav-desktop ───────────────── */

/*
.lppr-a11y-header-nav-desktop .elementor-nav-menu li.menu-item-has-children {
	display:        flex !important;
	flex-direction: row !important;
	align-items:    center !important;
	position:       relative;
}

.lppr-a11y-header-nav-desktop .elementor-nav-menu li.menu-item-has-children > a {
	flex-grow:   0 !important;
	display:     inline-flex !important;
	align-items: center;
}

.sub-arrow {
	display:         flex !important;
	align-items:     center;
	justify-content: center;
	width:           30px;
	height:          100%;
	cursor:          pointer;
	padding:         0 5px;
}

.sub-arrow svg {
	fill:   #ffffff !important;
	width:  12px;
	height: auto;
}

.sub-arrow:focus {
	outline:          2px solid #ffffff !important;
	outline-offset:   -4px;
	background-color: rgba(255, 255, 255, 0.1);
}

.lppr-a11y-header-nav-desktop .sub-menu li.menu-item-has-children {
	position: relative;
}

.lppr-a11y-header-nav-desktop .sub-menu {
	display:    none !important;
	visibility: hidden !important;
	opacity:    0;
	position:   absolute !important;
	z-index:    99999 !important;
	background: #ffffff !important;
	box-shadow: 2px 2px 15px rgba(0, 0, 0, 0.15) !important;
	width:      auto !important;
	min-width:  100% !important;
	max-width:  none !important;
	transition: opacity 0.2s ease;
}

.lppr-a11y-header-nav-desktop li.lppr-a11y-submenu-open > .sub-menu {
	display:    block !important;
	visibility: visible !important;
	opacity:    1 !important;
}

.lppr-a11y-header-nav-desktop .sub-menu li a {
	white-space:   nowrap !important;
	padding:       12px 45px 12px 20px !important;
	display:       block !important;
	padding-right: 50px !important;
}

.lppr-a11y-header-nav-desktop .elementor-nav-menu > li > .sub-menu {
	top:  100% !important;
	left: 0 !important;
}

.lppr-a11y-header-nav-desktop .sub-menu li > .sub-menu {
	top:  0 !important;
	left: 100% !important;
}

.lppr-a11y-header-nav-desktop,
.lppr-a11y-header-nav-desktop .elementor-widget-container,
.lppr-a11y-header-nav-desktop .elementor-nav-menu {
	overflow: visible !important;
}

.sub-arrow[aria-expanded="true"] svg {
	transform: rotate(180deg) !important;
}

.lppr-a11y-header-nav-desktop .sub-menu li {
	margin:   10px 0 !important;
	position: relative !important;
}

.lppr-a11y-header-nav-desktop .sub-menu .sub-arrow {
	position:  absolute !important;
	right:     15px !important;
	top:       70% !important;
	transform: translateY(-50%) !important;
	z-index:   50 !important;
	width:     25px !important;
	height:    25px !important;
	display:   flex !important;
}

.lppr-a11y-header-nav-desktop .sub-menu .sub-arrow svg {
	fill:      #333333 !important;
	width:     10px !important;
	height:    auto !important;
	transform: rotate(-90deg);
	transition: transform 0.2s ease;
}

.lppr-a11y-header-nav-desktop .sub-menu li.lppr-a11y-submenu-open > .sub-arrow svg {
	transform: rotate(0deg) !important;
}

.lppr-a11y-header-nav-desktop .sub-menu .sub-arrow:focus {
	outline:          2px solid #005a87 !important;
	outline-offset:   1px;
	background-color: rgba(0, 90, 135, 0.05);
	border-radius:    2px;
}

:root {
	--ada-menu-active-bg:  #4a748c;
	--ada-menu-text-white: #ffffff;
}

.lppr-a11y-header-nav-desktop .elementor-nav-menu > li:hover,
.lppr-a11y-header-nav-desktop .elementor-nav-menu > li.lppr-a11y-submenu-open {
	background-color: var(--ada-menu-active-bg) !important;
}

.lppr-a11y-header-nav-desktop .elementor-nav-menu > li:hover > .sub-arrow svg,
.lppr-a11y-header-nav-desktop .elementor-nav-menu > li.lppr-a11y-submenu-open > .sub-arrow svg {
	fill: var(--ada-menu-text-white) !important;
}

.lppr-a11y-header-nav-desktop .elementor-nav-menu > li:not(:hover):not(.lppr-a11y-submenu-open) {
	background-color: transparent !important;
}

.lppr-a11y-header-nav-desktop .elementor-nav-menu > li:not(:hover):not(.lppr-a11y-submenu-open) > a {
	color: white !important;
}

@media (prefers-reduced-motion: reduce) {
	.sub-arrow svg,
	.lppr-a11y-header-nav-desktop .sub-menu .sub-arrow svg {
		transition: none;
	}
}
*/


/* =============================================================================
   12. Mobile Navigation
   =============================================================================

   DISABLED — uncomment the block below on sites using the Elementor mobile nav.
   Requires class "lppr-a11y-header-nav" on the Elementor mobile nav container
   (set via Elementor Advanced → CSS Classes).

   CUSTOMIZE after uncommenting:
     — .lppr-a11y-header-nav a:focus outline (#000) → mobile nav focus ring color
     — .header-sticky-bar:has() → update selector if the theme uses a different
       sticky class, or remove if the site has no sticky header

   JS counterpart: fixMobileNavArrows() / fixHeaderNavArrows() in
   accessibility__menu.js or accessibility__content.js.
*/

/*
.lppr-a11y-header-nav .elementor-nav-menu li.menu-item-has-children {
	display:         flex !important;
	flex-direction:  row !important;
	align-items:     center !important;
	justify-content: space-between !important;
	width:           100% !important;
}

.lppr-a11y-header-nav .elementor-nav-menu li.menu-item-has-children > a.elementor-item {
	flex-grow:   1 !important;
	display:     flex !important;
	align-items: center;
}

.lppr-a11y-header-nav .menu-item-submenu-button {
	position:        relative !important;
	right:           auto !important;
	flex-shrink:     0 !important;
	height:          100%;
	display:         flex !important;
	align-items:     center;
	justify-content: center;
}

.lppr-a11y-header-nav a:focus,
.lppr-a11y-header-nav button:focus {
	outline:        2px solid #000 !important;
	outline-offset: -2px !important;
}

.header-sticky-bar:has(a:focus-visible) {
	transform: translateY(0%) !important;
}
*/


/* =============================================================================
   13. Breadcrumbs
   =============================================================================

   Add site-specific breadcrumb accessibility rules here.
   ARIA attributes (aria-label="Breadcrumb" on <nav>, aria-current="page" on
   the last crumb, aria-hidden on separators) must be set in HTML or JS — CSS
   cannot set ARIA.

   Example (uncomment and adapt — scope to the theme's breadcrumb selector):
   .breadcrumb-sep {
       speak: none;
   }
*/


/* =============================================================================
   14. Pagination
   =============================================================================

   Add site-specific pagination accessibility rules here. Page number buttons
   must meet the 44×44px touch target minimum (WCAG SC 2.5.5). aria-label on
   the <nav> and aria-current="page" on the active link are handled in HTML/JS.

   CUSTOMIZE: replace .site-pagination with the theme's pagination wrapper class.
   Example (uncomment and adapt):
   .site-pagination a,
   .site-pagination button {
       min-width:  44px;
       min-height: 44px;
   }
*/


/* ─── 15–19 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   20. Content — General
   ============================================================================= */

/*
 * Inline links — minimum 24px hit height (WCAG SC 2.5.8).
 *
 * Use for any inline link that sits inside running text where the line-height
 * already provides sufficient height but the link element itself measures < 24px.
 * display:inline-block enables the min-height property without breaking the
 * text flow.
 *
 * CUSTOMIZE: scope to specific link selectors rather than applying globally.
 */
/*
.site-inline-link-target {
	display:     inline-block;
	min-height:  24px;
	padding:     2px 0;
	line-height: 1.4;
}
*/


/* =============================================================================
   21. Content — Single Posts
   =============================================================================

   Add single post / article page rules here. Links inside body copy must be
   distinguishable from surrounding text by more than color alone (WCAG SC 1.4.1)
   — enforce underlines if the theme removes them. Share buttons need aria-labels.

   CUSTOMIZE: replace .single .entry-content with the theme's post body selector.
   Example (uncomment and adapt):
   .single .entry-content a {
       text-decoration: underline;
   }
*/


/* =============================================================================
   22. Content — Events
   =============================================================================

   Add event page accessibility rules here. Use the <time> element with a
   machine-readable datetime attribute for dates so AT can interpret them.
   Event list cards should show a visible focus ring when keyboard-navigated.

*/


/* =============================================================================
   23. Content — Archive Pages
   =============================================================================

   Add archive/listing page rules here. Post cards should show a visible focus
   ring on keyboard navigation. "Read more" links need descriptive context —
   add it via JS (accessibility__links.js fixReadMoreLinks) rather than CSS.

*/


/* =============================================================================
   24. Images
   =============================================================================

   Add image accessibility rules here. Decorative images need alt="" in HTML —
   CSS cannot set this. Lazy-load placeholders should use aspect-ratio to
   reserve space and prevent layout shift when the image loads.

   CUSTOMIZE: replace figure with the theme's image wrapper selector if needed.
   Example (uncomment and adapt):
   figure figcaption {
       font-style: italic;
   }
*/


/* =============================================================================
   25. Video / Audio embeds
   =============================================================================

   Add video and audio accessibility rules here. iframe title attributes must
   be set in HTML or JS — CSS cannot do this. Provide transcript toggle buttons
   with a visible focus ring and ensure captions are enabled by default.

   CUSTOMIZE: replace .site-video-transcript-toggle with the site's class name.
   Example (uncomment and adapt):
   .site-video-transcript-toggle:focus {
       outline: 2px solid;
       outline-offset: 2px;
   }
*/


/* ─── 26–29 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   30. Footer
   =============================================================================

   Enable on sites where the footer has a dark background (navy, charcoal, etc.)
   and the default `2px solid currentColor` ring would be invisible. White or
   light-colored focus rings are the standard fix for dark container contexts.

   CUSTOMIZE: replace .footer / .footer2 with the site's actual footer selectors.
   Verify the chosen ring color meets ≥3:1 contrast against the footer background
   (WCAG SC 1.4.11). Source: Longhorn Village (LHV_A11Y) — promoted to fran/.
*/

/*
.footer *:focus,
.footer *:focus-visible,
.footer2 *:focus,
.footer2 *:focus-visible {
	outline:        2px solid #fff !important;
	outline-offset: 2px !important;
}
*/


/* =============================================================================
   31. Footer Menu
   =============================================================================

   Add footer menu accessibility rules here. aria-label="Footer navigation" on
   the footer <nav> is set in HTML/PHP, not CSS. If the footer background is
   dark, focus rings belong in section 30 (Footer) rather than here.

*/


/* =============================================================================
   32. Social icons
   =============================================================================

   Add social icon accessibility rules here. aria-labels for icon-only links
   are injected by accessibility__social-icons.js — CSS cannot set them. Each
   icon link must meet the 44×44px touch target minimum (WCAG SC 2.5.5).

   CUSTOMIZE: replace .site-social-icon with the theme's social icon link class.
   Example (uncomment and adapt):
   .site-social-icon a {
       min-width:       44px;
       min-height:      44px;
       display:         inline-flex;
       align-items:     center;
       justify-content: center;
   }
*/


/* =============================================================================
   33. Notifications / Alerts
   =============================================================================

   Add notification and alert accessibility rules here. role="alert" (errors)
   and role="status" (success messages) must be set in HTML or JS. CSS handles
   the dismiss button focus ring and contrast of the alert background color.

   CUSTOMIZE: replace .site-alert-dismiss with the theme's dismiss button class.
   Example (uncomment and adapt):
   .site-alert-dismiss:focus,
   .site-alert-dismiss:focus-visible {
       outline:        2px solid;
       outline-offset: 2px;
   }
*/


/* ─── 34 reserved ───────────────────────────────────────────────────────────── */


/* =============================================================================
   35. Zoom — General
   =============================================================================

   These rules are ONLY active when accessibility__zoom.js is enqueued and
   run('updateZoomClasses') is called. The JS adds .zoom-200 or .zoom-400 to
   <body> based on the outerWidth/innerWidth ratio.

   WHY here rather than in the theme stylesheet:
   Zoom-triggered layout fixes are accessibility-specific. Keeping them with the
   other A11Y CSS makes it easy to find, audit, and remove if the theme changes.

   CUSTOMIZE: add site-specific overrides below.
   Common patterns:
     — body.zoom-200 header { position: absolute; }   (un-stick header at 200%)
     — body.zoom-200 .phone-display { display: none; } (hide overflowing phone numbers)
     — body.zoom-400 nav { padding-top: 80px; }        (clear full-width nav at 400%)
*/

/* Example rules (uncomment and adapt):

body.zoom-200 .site-header {
	position: absolute;
}

body.zoom-200 .site-header .header-phones,
body.zoom-400 .site-header .header-phones {
	display: none !important;
}

body.zoom-400 .main-navigation {
	padding-top: 80px;
}

*/


/* ─── 36–39 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   40. Reviews — Trustindex
   =============================================================================

   Pairs with fixTrustindexWidget() in accessibility__reviews.js.
   Source: La Posada at Green Valley (LPGV_A11Y) — promoted with lppr- prefix;
   more complete than the fran/ generic version (adds Google-reviews-platform
   rules, arrow focus rings, and grab/drag cursor affordance).
*/

body .ti-widget.ti-goog .ti-read-more span {
	opacity: 1;
}

.lppr-ti-autoplay-controls {
	display:         flex;
	justify-content: center;
	padding:         8px 0 4px;
}

.lppr-ti-play-pause {
	display:         inline-flex;
	align-items:     center;
	justify-content: center;
	gap:             6px;
	background:      transparent;
	border:          1px solid currentColor;
	border-radius:   4px;
	cursor:          pointer;
	padding:         4px 10px;
	font-size:       13px;
	opacity:         0.75;
	transition:      opacity 0.15s ease;
}
.lppr-ti-play-pause:hover,
.lppr-ti-play-pause:focus {
	opacity: 1;
}
.lppr-ti-play-pause:focus,
.lppr-ti-play-pause:focus-visible {
	outline:        2px solid;
	outline-offset: 2px;
}

.lppr-ti-disclaimer-close {
	display:         inline-flex;
	align-items:     center;
	justify-content: center;
	background:      transparent;
	border:          1px solid currentColor;
	border-radius:   50%;
	cursor:          pointer;
	padding:         4px;
	margin-bottom:   8px;
}
.lppr-ti-disclaimer-close:focus,
.lppr-ti-disclaimer-close:focus-visible {
	outline:        2px solid;
	outline-offset: 2px;
}

.ti-disclaimer.lppr-ti-disclaimer-open {
	display:          block !important;
	visibility:       visible !important;
	opacity:          1 !important;
	transition-delay: 0ms !important;
	position:         relative;
}

.ti-disclaimer:not(.lppr-ti-disclaimer-open) {
	display:    none;
	visibility: hidden;
	opacity:    0;
}

.lppr-ti-slide-announce {
	position:    absolute !important;
	left:        -10000px !important;
	width:       1px !important;
	height:      1px !important;
	overflow:    hidden !important;
	clip:        rect(0, 0, 0, 0) !important;
	clip-path:   inset(50%) !important;
	white-space: nowrap !important;
}

@media (max-width: 1024px) {
	.ti-widget .ti-controls {
		display: flex !important;
	}
	.ti-widget .ti-next,
	.ti-widget .ti-prev {
		display: inline-flex !important;
	}
}

.ti-widget .ti-next:is(:focus, :focus-visible),
.ti-widget .ti-prev:is(:focus, :focus-visible) {
	outline: 3px solid #005fcc;
	outline-offset: 3px;
	border-radius: 50%;
}

/* Allow drag/swipe without blocking vertical page scroll.
   grab cursor signals the area is draggable on desktop. */
.ti-widget .ti-reviews-container-wrapper,
.ti-widget .ti-reviews-container {
	touch-action: pan-y;
	cursor: grab;
	user-select: none;
}
.ti-widget .ti-reviews-container-wrapper:active,
.ti-widget .ti-reviews-container:active {
	cursor: grabbing;
}

.ti-review-item .ti-stars {
	overflow: visible !important;
	position: relative;
}
.ti-verified-review .ti-verified-tooltip {
	min-width: 130px !important;
	overflow:  visible !important;
}
.ti-verified-review .ti-verified-tooltip.lppr-ti-vtip-open {
	display:    block !important;
	visibility: visible !important;
	opacity:    1 !important;
	margin:     0 !important;
	z-index:    10;
}
.ti-verified-review .ti-verified-tooltip:focus {
	outline: none; /* ring is on the trigger span, not the tooltip itself */
}
.ti-stars .ti-verified-review[tabindex="0"]:is(:focus, :focus-visible) {
	outline:        2px solid;
	outline-offset: 2px;
	border-radius:  2px;
}

.lppr-ti-vtip-close {
	display:         flex;
	align-items:     center;
	justify-content: center;
	background:      transparent;
	border:          1px solid currentColor;
	border-radius:   50%;
	cursor:          pointer;
	padding:         3px;
	margin-top:      6px;
	line-height:     0;
}
.lppr-ti-vtip-close:focus,
.lppr-ti-vtip-close:focus-visible {
	outline:        2px solid;
	outline-offset: 2px;
}

.ti-info-icon[tabindex="0"]:is(:focus, :focus-visible) {
	outline:        2px solid;
	outline-offset: 3px;
	border-radius:  50%;
}

body .ti-widget.ti-goog .ti-widget-container .ti-date {
	color: #000000;
}
body .ti-widget.ti-goog .ti-load-more-reviews-container .ti-load-more-reviews-button {
	color: #000000;
}

@media (prefers-reduced-motion: reduce) {
	.lppr-ti-play-pause,
	.lppr-ti-disclaimer-close,
	.lppr-ti-vtip-close {
		transition: none;
	}
}


/* =============================================================================
   41. Reviews — Others
   =============================================================================

   Add accessibility rules for other review plugins here (Elfsight, Google
   Reviews widget, WP Business Reviews Bundle, etc.). Follow the same pattern
   as section 40: autoplay controls, focus rings, and live region announcements.

*/


/* ─── 42–49 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   50. Forms — Gravity Forms
   ============================================================================= */

/*
 * Required notice paragraph injected by fixGfRequiredIndicator().
 */
p.site-gf-required-notice {
	padding: 0 0 10px;
}

/*
 * Validation summary — restore visual prominence after JS demotes <h2> to <p>.
 * fixGravityFormsValidationHeading() replaces the element but copies all classes,
 * so GF's class-based styles carry over. Only the browser-default heading
 * bold/size is lost — restore it here.
 * CUSTOMIZE: update 16px to match the site's h2 size inside forms.
 */
p.gform_submission_error {
	display:     block;
	font-size:   16px; /* CUSTOMIZE: match site h2 size inside forms */
	font-weight: 600;
	line-height: 1.4;
}

/*
 * Form fields — explicit black outline so GF's own CSS does not override.
 * CUSTOMIZE: update #000 to the site's focus ring color if not black.
 */
.gform_wrapper .gfield input:is(:focus, :focus-visible),
.gform_wrapper .gfield select:is(:focus, :focus-visible),
.gform_wrapper .gfield textarea:is(:focus, :focus-visible),
.gform_wrapper .gform-footer input:is(:focus, :focus-visible) {
	outline: 2px solid #000 !important; /* CUSTOMIZE: GF field focus ring color */
}

/*
 * GF checkboxes — "keep real" technique (WCAG SC 1.3.1, 4.1.2, 2.1.1).
 *
 * WHY: Many GF/theme rules hide checkboxes via display:none so a styled
 * label::after pseudo-element paints the visual box. display:none removes
 * the native checkbox from both the tab order and the accessibility tree.
 * fixGfCheckboxAccess() in accessibility__forms.js restores them as
 * position:absolute / opacity:0 overlaid on the visual box.
 *
 * These rules:
 *   1. Position .gchoice / .ginput_container_consent as the absolute anchor.
 *   2. Re-declare display:inline-block — a higher-specificity rule that omits
 *      display does NOT undo display:none on its own, regardless of specificity.
 *   3. Focus ring on the label so sighted keyboard users see the active state.
 *
 * CUSTOMIZE:
 *   — top (4px): align with the visual checkbox drawn by the theme's label::after
 *   — width / height (20px): match the visual checkbox dimensions
 *   Source: La Posada at Green Valley (LPGV_A11Y) — promoted to fran/.
 */
.gform_wrapper.gravity-theme .gfield_checkbox .gchoice,
.gform_wrapper.gravity-theme .gfield--type-consent .ginput_container_consent {
	position: relative;
}
.gform_wrapper.gravity-theme .gfield_checkbox input[type="checkbox"],
.gform_wrapper.gravity-theme .gfield--type-consent input[type="checkbox"] {
	display:  inline-block !important;
	position: absolute;
	opacity:  0;
	left:     0;
	top:      4px;   /* CUSTOMIZE: align with label::after box top edge */
	width:    20px;  /* CUSTOMIZE: match visual checkbox width */
	height:   20px;  /* CUSTOMIZE: match visual checkbox height */
	margin:   0;
	cursor:   pointer;
}
.gform_wrapper .gfield_checkbox input[type="checkbox"]:focus + label,
.gform_wrapper .gfield_checkbox input[type="checkbox"]:focus-visible + label,
.gform_wrapper .gfield--type-consent input[type="checkbox"]:focus + label,
.gform_wrapper .gfield--type-consent input[type="checkbox"]:focus-visible + label {
	outline:        2px solid; /* CUSTOMIZE: match site focus color */
	outline-offset: 2px;
}


/* =============================================================================
   51. Forms — ActiveDEMAND
   =============================================================================

   Add accessibility rules for ActiveDEMAND forms here. ActiveDEMAND often
   suppresses focus outlines — override them explicitly. Error message
   association (aria-describedby) and required indicators are handled in JS.

   CUSTOMIZE: replace .adform-wrapper with the actual ActiveDEMAND wrapper
   class used on this site, and update #000 to the site's focus ring color.

   Example (uncomment and adapt):
   .adform-wrapper input:focus,
   .adform-wrapper select:focus,
   .adform-wrapper textarea:focus {
       outline: 2px solid #000 !important;
   }
*/


/* =============================================================================
   52. Forms — Complianz
   =============================================================================

   Enable on sites using the Complianz GDPR/CCPA plugin (complianz.io).
   Pairs with fixComplianzConsent() and fixComplianzDocument() in
   accessibility__forms.js.

   DISABLED — uncomment the block below on sites using Complianz.

   The CSS rule provides an instant visual fix for empty paragraphs in
   #cmplz-document before the JS MutationObserver in fixComplianzDocument()
   can run. Both the CSS and JS rules are needed:
     — CSS: instant removal on first render (no flash)
     — JS:  cleans up paragraphs injected after initial render (async content)

   Source: The Vered (VRD_A11Y) — promoted to fran/.
*/

/*
#cmplz-document p:empty {
	display: none !important;
}
*/


/* =============================================================================
   53. Forms — Others
   =============================================================================

   Add accessibility rules for other form plugins here (WPForms, Contact Form 7,
   Ninja Forms, Formidable Forms, etc.). Focus indicator overrides and validation
   error styling are the most common needs across third-party form plugins.

*/


/* ─── 54–59 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   60. Chatbot — TalkFurther / further-embedded-vsa + Promotional Banner
   =============================================================================

   Skip-to-chat / skip-to-banner styling lives in section 2 (Skip links) above,
   since a#skip-chat and a#skip-banner share the same visual treatment as the
   primary skip-to-content link on this site.
*/

/* Fancybox z-index conflict — uncomment if the chatbot is hidden behind a lightbox:
html.with-fancybox further-embedded-vsa {
	position: relative;
	z-index:  1 !important;
}
*/


/* =============================================================================
   61. Chatbot — Others
   =============================================================================

   Add accessibility rules for other chatbot platforms here (Intercom, Drift,
   Tidio, HubSpot Chat, etc.). Shadow DOM injection patterns from section 60
   apply to most modern chat widgets — verify the widget's DOM structure first.

*/


/* ─── 62–69 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   70. Sliders — Swiper / Hero
   =============================================================================

   DISABLED — uncomment the block below on sites using Swiper or a hero slider.
   Pairs with initSwiperControls(), initSliderPlayPause(), initSliderContainer(),
   and initHeroPlayPause() in accessibility__sliders.js (or equivalent).

   CUSTOMIZE after uncommenting:
     — .swiper-custom-next/prev right/left (-25px) → match carousel arrow position
     — .swiper-play-pause bottom/left (-25px) → match pause button placement
     — .hero-play-pause bottom (80px) / right (20px) → match hero slider layout
     — .hero-play-pause svg fill (#fff) → hero play button icon color
     — @media max-width 768px bottom (50px) → mobile hero button position
     — outline (#000) → focus ring color for all slider controls
     — Testimonial carousel e-con-full / e-con-inner rules (Elementor-specific):
       uncomment only if the site uses Elementor testimonial carousel widget

   Swiper pagination bullets (commented block at end):
     — uncomment when SC 2.5.8 touch-target fix is needed for pagination dots
     — replace .block--image-slider with the site's specific carousel class
*/

/*
.swiper-play-pause,
.swiper-custom-next,
.swiper-custom-prev,
.hero-play-pause {
	position:        absolute;
	z-index:         10;
	height:          35px !important;
	width:           35px !important;
	border-radius:   50% !important;
	border:          none !important;
	cursor:          pointer !important;
	display:         flex;
	align-items:     center;
	justify-content: center;
	transition:      background 0.2s;
	padding:         0 !important;
}

.swiper-play-pause:focus-visible,
.swiper-custom-next:focus-visible,
.swiper-custom-prev:focus-visible,
.hero-play-pause:focus-visible {
	outline:        1px solid #000 !important;
	outline-offset: 2px;
}

.swiper-play-pause:hover {
	background: rgba(0, 0, 0, 0.65);
}

.swiper-custom-next  { right: -25px; top: 20px; }
.swiper-custom-prev  { left:  -25px; top: 20px; }
.swiper-play-pause   { bottom: 0;    left: -25px; }

.hero-play-pause {
	bottom:  80px;
	right:   20px;
	display: flex !important;
}

.hero-play-pause svg {
	fill: #fff;
}

@media screen and (max-width: 768px) {
	.hero-play-pause {
		bottom: 50px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.swiper-play-pause,
	.swiper-custom-next,
	.swiper-custom-prev,
	.hero-play-pause {
		transition: none;
	}
}
*/

/* Elementor testimonial carousel positioning — uncomment on Elementor sites only:
.e-con-full > .elementor-widget-testimonial-carousel button.swiper-play-pause  { left:  10px; }
.e-con-full > .elementor-widget-testimonial-carousel button.swiper-custom-prev { left:  10px; }
.e-con-full > .elementor-widget-testimonial-carousel button.swiper-custom-next { right: 10px; }

.e-con-inner > .elementor-widget-testimonial-carousel button.swiper-play-pause  { bottom: 0;    left: 10px;  top: initial; }
.e-con-inner > .elementor-widget-testimonial-carousel button.swiper-custom-prev { bottom: 50px; left: 10px;  top: initial; }
.e-con-inner > .elementor-widget-testimonial-carousel button.swiper-custom-next { bottom: 50px; right: 10px; top: initial; }

@media screen and (max-width: 1024px) {
	.e-con-inner > .elementor-widget-testimonial-carousel button.swiper-play-pause  { bottom: 10px; }
	.e-con-inner > .elementor-widget-testimonial-carousel button.swiper-custom-prev { top: -54px; bottom: initial; }
	.e-con-inner > .elementor-widget-testimonial-carousel button.swiper-custom-next { top: -54px; bottom: initial; }
	body .e-con-inner > .elementor-widget-testimonial-carousel .elementor-main-swiper { padding-bottom: 90px; }
	body .e-con-inner > .elementor-widget-testimonial-carousel .elementor-main-swiper .swiper-pagination { bottom: 50px; }
}

@media screen and (max-width: 767px) {
	.e-con-full > .elementor-widget-testimonial-carousel button.swiper-play-pause  { bottom: 10px; }
	.e-con-full > .elementor-widget-testimonial-carousel button.swiper-custom-prev { top: -54px; }
	.e-con-full > .elementor-widget-testimonial-carousel button.swiper-custom-next { top: -54px; }
	body .e-con-full > .elementor-widget-testimonial-carousel .elementor-main-swiper { padding-bottom: 90px; }
	body .e-con-full > .elementor-widget-testimonial-carousel .elementor-main-swiper .swiper-pagination { bottom: 50px; }
}
*/

/* Swiper pagination bullets — minimum 24×24px touch target (WCAG SC 2.5.8).
   Uncomment and replace .block--image-slider with the site's carousel class.
   Verify ≥8px gap between bullets before enabling — expanded hit areas must
   not overlap. Source: La Posada at Green Valley (LPGV_A11Y) — promoted to fran/.

.block--image-slider .swiper-pagination-bullet {
	box-sizing:      content-box;
	width:           14px;
	height:          14px;
	padding:         5px;
	background-clip: content-box !important;
}
*/


/* =============================================================================
   71. Sliders — Beaver Builder Slideshow
   =============================================================================

   DISABLED — uncomment the block below on sites using Beaver Builder slideshow
   modules. Add class "decorative-slideshow" via Beaver Builder → Advanced →
   CSS Classes on each module. Pairs with fixDecorativeSlideshow() and
   fixInteractiveSlideshow() in accessibility__slideshow.js.

   CUSTOMIZE after uncommenting:
     — outline (#000) → focus ring color to match the site's brand focus color
     — add positioning overrides below if BB's default button placement
       causes layout issues on this site
*/

/*
.decorative-slideshow .fl-slideshow-nav-pause,
.decorative-slideshow .fl-slideshow-nav-play,
.decorative-slideshow .fl-slideshow-nav-prev,
.decorative-slideshow .fl-slideshow-nav-next {
	pointer-events: auto !important;
	cursor: pointer;
}

.decorative-slideshow .fl-slideshow-nav-pause:focus,
.decorative-slideshow .fl-slideshow-nav-play:focus,
.decorative-slideshow .fl-slideshow-nav-prev:focus,
.decorative-slideshow .fl-slideshow-nav-next:focus,
.decorative-slideshow .fl-slideshow-nav-pause:focus-visible,
.decorative-slideshow .fl-slideshow-nav-play:focus-visible,
.decorative-slideshow .fl-slideshow-nav-prev:focus-visible,
.decorative-slideshow .fl-slideshow-nav-next:focus-visible {
	outline:        2px solid #000 !important;
	outline-offset: 2px;
}
*/


/* =============================================================================
   72. Sliders — bxSlider
   =============================================================================

   Enable on sites using bxSlider (Beaver Builder Testimonials, or standalone).
   bxSlider hides the slide number with text-indent:-9999px. fixBxSliderPagerLabels()
   removes the number and inserts a .lppr-visually-hidden span with descriptive text.
   These rules reset text-indent so the span is the only text content visible to AT.

   CUSTOMIZE: uncomment when fixBxSliderPagerLabels is active.
*/

/*
.bx-wrapper .bx-pager.bx-default-pager a,
.bx-wrapper .bx-pager.bx-default-pager button {
	text-indent: 0 !important;
	overflow: hidden !important;
}
*/


/* =============================================================================
   73. Sliders — Others
   =============================================================================

   Add accessibility rules for other slider plugins here (Revolution Slider,
   Layer Slider, Splide, Glider.js, etc.). The core requirements are always the
   same: play/pause control, visible focus rings, and a live region for slide changes.

*/


/* ─── 74–79 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   80. Overlays — Magnific Popup
   =============================================================================

   DISABLED — uncomment the block below on sites using Magnific Popup (lightbox).
   Works with accessibility__gallery.js: observeLightbox() watches for .mfp-wrap
   additions; fixLightboxAccessibility() sets button labels and wraps the image.

   CUSTOMIZE after uncommenting:
     — Close button background (#000) → match the site's lightbox color scheme
     — Close button hover border (#fff) → match the lightbox color scheme
     — Arrow background (#000) → match lightbox color scheme
     — Counter color (#fff) and font-size (14px) → match lightbox typography
     — .site-lightbox-open → replace 'site-' with the project prefix in both CSS
       and in the JS call that adds this class to <body>
     — .site-lightbox-img-wrap → replace 'site-' with the project prefix
     — --site-focus-ring-height → replace 'site-' with the project prefix
     — box-shadow ring color (#fff) → contrast against lightbox background

   Source: The Carrington (CRN_A11Y) — promoted to fran/ as generic Magnific CSS.
*/

/*
.mfp-gallery .mfp-container .mfp-figure button.mfp-close {
	align-items:     center;
	background:      #000;
	border-radius:   50%;
	padding:         2px 0;
	display:         inline-flex;
	justify-content: center;
	outline:         2px solid #000;
	width:           30px !important;
	height:          30px;
}
.mfp-gallery .mfp-container .mfp-figure button.mfp-close:is(:hover, :focus, :focus-visible) {
	border: 2px solid #fff;
}

@media only screen and (max-width: 1024px) {
	.mfp-gallery .mfp-container .mfp-figure button.mfp-close {
		right: 5px !important;
	}
}

.mfp-gallery .mfp-container .mfp-arrow-right,
.mfp-gallery .mfp-container .mfp-arrow-left {
	background: #000;
}
.mfp-gallery .mfp-container .mfp-arrow-right:is(:focus, :focus-visible),
.mfp-gallery .mfp-container .mfp-arrow-left:is(:focus, :focus-visible) {
	outline: 2px solid;
}
.mfp-gallery .mfp-container .mfp-arrow-right:is(:focus, :focus-visible):before { transform: translateX(9px); }
.mfp-gallery .mfp-container .mfp-arrow-right:is(:focus, :focus-visible):after  { opacity: 1; transform: translateX(-1px); }
.mfp-gallery .mfp-container .mfp-arrow-left:is(:focus, :focus-visible):before  { transform: translateX(-9px); }
.mfp-gallery .mfp-container .mfp-arrow-left:is(:focus, :focus-visible):after   { opacity: 1; transform: translateX(-58px); }

.mfp-gallery .mfp-counter {
	color:     #fff;
	font-size: 14px;
}

@media only screen and (max-width: 1024px) {
	.mfp-gallery .mfp-container .mfp-arrow-right { right: 5px !important; }
	.mfp-gallery .mfp-container .mfp-arrow-left  { left:  5px !important; }
}

body.site-lightbox-open {
	overflow: hidden !important;
}

.mfp-wrap.mfp-ready,
.mfp-wrap.mfp-ready .mfp-container {
	overflow: hidden !important;
}

.mfp-wrap.mfp-ready .site-lightbox-img-wrap {
	position:    relative;
	display:     inline-block;
	line-height: 0;
}
.mfp-wrap.mfp-ready .site-lightbox-img-wrap img {
	display: block;
}
.mfp-wrap.mfp-ready .site-lightbox-img-wrap img:focus {
	outline: none;
}
.mfp-wrap.mfp-ready .site-lightbox-img-wrap::before {
	background:     #000;
	content:        '';
	position:       absolute;
	left:           -5px;
	right:          -5px;
	top:            50%;
	transform:      translateY(-50%);
	height:         calc(var(--site-focus-ring-height, 90%) + 20px);
	pointer-events: none;
	opacity:        0;
	box-shadow:     inset 0 0 0 2px #fff;
	z-index:        -1;
}
.mfp-wrap.mfp-ready .site-lightbox-img-wrap:focus-within::before {
	opacity: 1;
}
*/


/* =============================================================================
   81. Overlays — Popup Maker
   =============================================================================

   DISABLED — uncomment the block below on sites using Popup Maker.
   CUSTOMIZE after uncommenting:
     — outline color (#fff) → match the popup background (dark popup = light ring)
*/

/*
.pum-close:focus,
.pum-close:focus-visible {
	outline:        2px solid #fff !important;
	outline-offset: 2px !important;
}
*/


/* =============================================================================
   82. Overlays — Others
   =============================================================================

   Add accessibility rules for other overlay/modal plugins here (FooBox,
   Fancybox, WP Lightbox 2, Elementor Popup, etc.). All modals need a focus
   trap, close button with aria-label, and focus return on close — handled in JS.

*/


/* ─── 83–89 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   90. Maps — WP Google Maps Pro
   =============================================================================

   Enable on sites using the WP Google Maps Pro plugin (.wpgmp_map_container)
   where the map is decorative (a location illustration, not interactive
   wayfinding). Pairs with fixWPGoogleMapsPro() in accessibility__maps.js.

   The tab-container inside the map panel is hidden to remove keyboard traps
   that appear even when the map container is otherwise inert.

   IMPORTANT: Only enable this section when a text alternative for the map
   (plain address + "View in Google Maps" link) is already present on the page.
   Do NOT use if the map is the only way to convey location information.

   Source: The Vered (VRD_A11Y) — promoted to fran/.
*/

/*
.wpgmp_map_container .wpgmp_tabs_container .wpgmp_toggle_container {
	display: none !important;
}
*/


/* =============================================================================
   91. Maps — Raw Google Maps (ACF embed)
   =============================================================================

   Add accessibility rules for raw Google Maps iframes embedded via ACF or
   custom fields. The iframe title attribute must be set in HTML/PHP — CSS
   cannot do this. aria-hidden on decorative containers must also be set in
   HTML or JS (accessibility__maps.js).

   Example (uncomment and adapt — replace .site-map-wrap with the site selector):
   .site-map-wrap {
       pointer-events: none;
   }
*/


/* =============================================================================
   92. Maps — Others
   =============================================================================

   Add accessibility rules for other map plugins here (MapPress, Leaflet,
   Mapbox, etc.). If the map is decorative, wrap it in a container with
   aria-hidden="true" set in JS so keyboard users are not trapped inside it.

*/


/* ─── 93–99 reserved ────────────────────────────────────────────────────────── */


/* =============================================================================
   100. Elementor — General
   =============================================================================

   ONLY include sections 100–103 on sites built with Elementor Page Builder —
   remove them entirely on non-Elementor sites to keep the stylesheet lean.
   Add general Elementor overrides here when a fix spans multiple widget types
   and does not belong in a more specific section (101–103) below.

*/


/* =============================================================================
   101. Elementor — Screen-only spans
   =============================================================================

   DISABLED — uncomment the block below on Elementor sites.
   Elementor injects .elementor-screen-only spans (visually-hidden, 1px×1px)
   for icon widgets, social icons, buttons, etc. Accessibility checkers flag them
   as "text too small" — hiding them is safe because the parent already has an
   aria-label. removeRedundantElementorScreenOnlySpans() in accessibility__content.js
   removes them from the DOM after verifying the parent aria-label; this rule is
   the CSS-only safety net for spans the JS has not yet processed.
*/

/*
span.elementor-screen-only {
	display: none;
}
*/


/* =============================================================================
   102. Elementor — Search form
   =============================================================================

   DISABLED — uncomment the block below on Elementor sites with a search widget.
   Elementor's search widget wraps the input in overflow:hidden, clipping the
   focus outline. The :has() rule restores visibility.

   CUSTOMIZE after uncommenting:
     — outline (#000) → match the site's focus ring color
*/

/*
.elementor-search-form input.elementor-search-form__input:focus,
.elementor-search-form button.elementor-search-form__submit:focus {
	outline: 2px solid #000;
}

.elementor-search-form .elementor-search-form__container:has(input:focus, button:focus) {
	overflow: visible;
}
*/


/* =============================================================================
   103. Elementor — Accordion
   =============================================================================

   DISABLED — uncomment the block below on Elementor sites with accordion widgets.
   Elementor accordion tab titles are not natively focusable — fixAccordionTabindex()
   replaces the inner <a> with a <span> and adds tabindex to the <li>. This rule
   ensures a visible focus ring when the <li> receives focus.

   CUSTOMIZE after uncommenting:
     — outline (#000) → match the site's focus ring color
*/

/*
.elementor-tab-title:focus-visible {
	outline: 1px solid #000 !important;
}
*/


/* ─── 104+ reserved ─────────────────────────────────────────────────────────── */
