/* ==========================================================================
   Accessibility fixes for sumatracheekymonkeys.com
   Addresses Google Lighthouse "Accessibility" findings. Each block notes the
   audit it resolves. Kept in the child theme so it survives theme/plugin
   updates.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Touch targets: Google Reviews slider dots (.rpi-dot)
   Audit: "Touch targets do not have sufficient size or spacing."
   The plugin renders each dot at --slider-dot-size and then scale(.55), which
   leaves the tappable area well under the ~24px minimum. We can't grow the
   visual dot without breaking the design, so we enlarge the *hit area* with
   padding + background-clip, keeping the painted dot the same size.
   -------------------------------------------------------------------------- */
.rpi-dots .rpi-dot {
	/* Restore a real tappable box around the small visual dot.
	   min 24x24 CSS px hit area; transform(scale) only shrinks the paint. */
	box-sizing: content-box !important;
	min-width: 24px !important;
	min-height: 24px !important;
	padding: 6px !important;
	/* Keep the coloured pill visible only in the content box, so the added
	   padding is an invisible hit area rather than a bigger coloured dot. */
	background-clip: content-box !important;
}

/* The dots track uses gap for spacing; make sure adjacent hit areas do not
   overlap and have a little breathing room. */
.rpi-dots {
	gap: max(var(--slider-dot-gap, 4px), 8px) !important;
}

/* --------------------------------------------------------------------------
   2. Touch targets: mobile nav sub-menu arrows + top-level anchors
   Audit: "Touch targets do not have sufficient size or spacing."
   .w-nav-arrow is the expander on responsive menus (display:none on desktop,
   shown on mobile where Lighthouse tests). Give the arrow and the level_1
   anchor a >=44px tappable height with spacing.
   -------------------------------------------------------------------------- */
.w-nav[data-layout] .w-nav-arrow,
.w-nav-arrow[role="button"] {
	min-width: 44px !important;
	min-height: 44px !important;
	line-height: 44px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Ensure the top-level menu links themselves are tall enough to tap and
   spaced from their neighbours on the mobile menu. */
.w-nav-anchor.level_1 {
	min-height: 44px !important;
	display: flex !important;
	align-items: center !important;
}

/* --------------------------------------------------------------------------
   3. Links relying on colour alone (in-content only)
   Audit: "Links rely on color to be distinguishable."
   Scope limited to body-content paragraphs and the cookie notice, per the
   flagged elements ("Get Involved" link in a <p>, and .privacy-policy-link in
   .l-cookie-message). Nav, buttons and card links are left untouched because
   they are distinguishable by layout.
   -------------------------------------------------------------------------- */
.l-section .w-post-elm p a,
.l-section .wpb_text_column p a,
.l-content p a,
.l-cookie-message a {
	text-decoration: underline !important;
}
