/* =====================================================================
   Provident Resorts — ADA Technical Remediation Layer (CSS)
   Round 2 — 2026-05

   Hand-written, standalone stylesheet. NOT part of the gulp build.
   Enqueued AFTER the main bundle (see functions/enqueue-scripts.php) so
   it cascades over Foundation and Elementor without needing !important
   in most cases.

   Scope of this file:
     - link-in-text-block: make body-copy links distinguishable without
       relying on color alone (Foundation sets $anchor-text-decoration:
       none globally, which strips underlines from every link).
     - visible focus indicators for keyboard users.
     - a layout-safe screen-reader-only utility.

   This is a technical remediation targeting known scan findings. It is
   NOT a claim of full ADA / WCAG conformance. Visual design is preserved:
   only body-copy text links gain an underline; nav, buttons, cards, and
   image tiles are intentionally excluded.
   ===================================================================== */


/* ---------------------------------------------------------------------
   link-in-text-block — underline links inside body copy only
   ---------------------------------------------------------------------
   BASE RULE (works in every browser, no :has() dependency).
   Scoped to content containers only, so navigation menus, header/footer
   utility links, and call-to-action buttons are NOT affected.
   The trailing :not() class exclusions keep Elementor button widgets and
   image-widget links from being underlined even where :has() is missing.
--------------------------------------------------------------------- */
.entry-content a:not(.button):not(.btn):not(.elementor-button):not(.wp-block-button__link),
.single-post-content-wrapper a:not(.button):not(.btn):not(.elementor-button),
.page-content a:not(.button):not(.btn):not(.elementor-button),
.elementor-widget-text-editor .elementor-widget-container a:not(.elementor-button):not(.elementor-button-link),
.elementor-widget-theme-post-content .elementor-widget-container a:not(.elementor-button):not(.elementor-button-link) {
	text-decoration: underline;
	/* from-font keeps the underline weight consistent with the type;
	   the offset stops descenders from colliding with the line. */
	text-decoration-thickness: from-font;
	text-underline-offset: 0.15em;
}

/* Make the hover/focus state obviously interactive (not color-only). */
.entry-content a:not(.button):not(.btn):not(.elementor-button):hover,
.entry-content a:not(.button):not(.btn):not(.elementor-button):focus,
.single-post-content-wrapper a:not(.button):not(.btn):hover,
.single-post-content-wrapper a:not(.button):not(.btn):focus,
.page-content a:not(.button):not(.btn):hover,
.page-content a:not(.button):not(.btn):focus,
.elementor-widget-text-editor .elementor-widget-container a:not(.elementor-button):hover,
.elementor-widget-text-editor .elementor-widget-container a:not(.elementor-button):focus,
.elementor-widget-theme-post-content .elementor-widget-container a:not(.elementor-button):hover,
.elementor-widget-theme-post-content .elementor-widget-container a:not(.elementor-button):focus {
	text-decoration-thickness: 2px;
}

/* Gravity Forms consent/label links (e.g. a "Privacy Policy" link inside a
   consent-checkbox label). These render outside the body-copy containers above,
   so they need their own scope. Same underline treatment; design preserved. */
.gform_wrapper .gchoice label a,
.gform_wrapper .gform-field-label a,
.gform_wrapper .gfield_description a {
	text-decoration: underline;
	text-decoration-thickness: from-font;
	text-underline-offset: 0.15em;
}

/* Post byline links (author + category). These live in
   header.article-header > p.byline — a sibling of .entry-content, so the
   body-copy rules above don't reach them. They are inline text links that were
   distinguishable by color only; underline them too. .byline is theme-specific
   and used solely for the byline, so this stays clear of nav/buttons/cards. */
.byline a:not(.button):not(.btn) {
	text-decoration: underline;
	text-decoration-thickness: from-font;
	text-underline-offset: 0.15em;
}
.byline a:not(.button):not(.btn):hover,
.byline a:not(.button):not(.btn):focus {
	text-decoration-thickness: 2px;
}

/* PROGRESSIVE ENHANCEMENT ONLY.
   Remove the underline from links that merely wrap an image/picture (e.g. an
   inline logo inside a paragraph). If :has() is unsupported the base rule
   still applies and the underline simply sits beneath the image box —
   no layout shift, no visual break.
   NOTE: these selectors deliberately mirror the BASE selectors above and add
   :has(...) so they out-specify the base rule (the base :not() chains inflate
   its specificity); a bare ".entry-content a:has(> img)" would lose the
   cascade and the underline would remain. */
@supports selector(a:has(img)) {
	.entry-content a:not(.button):not(.btn):not(.elementor-button):not(.wp-block-button__link):has(> img),
	.entry-content a:not(.button):not(.btn):not(.elementor-button):not(.wp-block-button__link):has(> picture),
	.single-post-content-wrapper a:not(.button):not(.btn):not(.elementor-button):has(> img),
	.page-content a:not(.button):not(.btn):not(.elementor-button):has(> img),
	.elementor-widget-text-editor .elementor-widget-container a:not(.elementor-button):not(.elementor-button-link):has(> img),
	.elementor-widget-text-editor .elementor-widget-container a:not(.elementor-button):not(.elementor-button-link):has(> picture),
	.elementor-widget-theme-post-content .elementor-widget-container a:not(.elementor-button):not(.elementor-button-link):has(> img) {
		text-decoration: none;
	}
}


/* ---------------------------------------------------------------------
   Visible focus indicators
   ---------------------------------------------------------------------
   A prior remediation round added a global focus ring in the compiled
   bundle (_global.scss). It is mirrored here so a visible focus state
   still ships even if an Elementor style overrides the bundled rule.
   Uses :focus-visible so mouse clicks don't draw a ring, with a :focus
   fallback for older browsers.
--------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid #005fcc;
	outline-offset: 2px;
}


/* ---------------------------------------------------------------------
   Screen-reader-only utility
   ---------------------------------------------------------------------
   WordPress-core-compatible .screen-reader-text. Visually hidden but
   readable by assistive tech and does NOT affect layout. Used as a last
   resort when an aria-label is unsuitable. (.show-on-focus already exists
   in the compiled bundle for the skip-link.)
--------------------------------------------------------------------- */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	position: absolute !important;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	height: auto;
	width: auto;
	left: 5px;
	top: 5px;
	padding: 15px 23px 14px;
	font-size: 0.875rem;
	line-height: normal;
	z-index: 100000;
}