/**
 * The Oliver Hotel: site-wide accessibility layer.
 *
 * Loaded after Total, Elementor, and the Customizer CSS (see
 * inc/oliver-accessibility.php). Brand colors that failed WCAG 2.2 AA
 * contrast are replaced with the nearest passing shade of the same hue.
 *
 * Contrast reference (ratio against #FFFFFF / #F6F5EE / #EAE2CA):
 *   Sage   #90AFAF 2.35 / 2.15 / 1.82  ->  #4A6767 6.13 / 5.61 / 4.74
 *   Copper #D3915B 2.63 / 2.41 / 2.04  ->  #B86E31 3.95 / 3.62 / 3.05 (large text)
 *                                      ->  #9A5C29 5.33 / 4.88 / 4.12 (small text, fills)
 */

:root {
	--oliver-a11y-sage: #4a6767;
	--oliver-a11y-copper-large: #b86e31;
	--oliver-a11y-copper: #9a5c29;
	--oliver-a11y-navy: #13303d;
	--oliver-a11y-cream: #f6f5ee;
	--oliver-focus-ring: var(--oliver-a11y-navy);
	--oliver-focus-halo: #fff;

	/* Total uses the sage accent as its default link color. */
	--wpex-link-color: var(--oliver-a11y-sage);
}

/* ---------------------------------------------------------------------------
 * Screen-reader-only utility
 * ------------------------------------------------------------------------ */

.oliver-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;
}

/* ---------------------------------------------------------------------------
 * Focus indicator (WCAG 2.4.7, 1.4.11)
 *
 * Total's default ring is a 1px #90AFAF outline (2.3:1 on white) and several
 * rules remove outlines entirely. A navy ring with a white halo stays visible
 * on light, dark, and photographic backgrounds.
 * ------------------------------------------------------------------------ */

:is(a, button, input, select, textarea, summary, [tabindex], [role="button"], [contenteditable="true"]):focus-visible {
	outline: 3px solid var(--oliver-focus-ring) !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 2px var(--oliver-focus-halo) !important;
}

/* Swap the ring on dark surfaces. */
:is(#footer-builder, .wpex-surface-dark, #site-navigation .sub-menu, .header-after, .oliver-on-dark) :is(a, button, input, select, textarea, [tabindex], [role="button"]):focus-visible {
	--oliver-focus-ring: var(--oliver-a11y-cream);
	--oliver-focus-halo: var(--oliver-a11y-navy);
}

/* Draw the ring inside elements whose carousel or gallery parent clips overflow. */
:is(.swiper, .owl-stage-outer, .elementor-gallery__container, .e-gallery-container) :is(a, button, [tabindex]):focus-visible {
	outline-offset: -5px !important;
	box-shadow: inset 0 0 0 5px var(--oliver-focus-halo) !important;
}

/* The skip link must be fully visible when focused. */
.skip-to-content:focus,
.skip-to-content:focus-visible {
	opacity: 1 !important;
	z-index: 100001;
}

/* ---------------------------------------------------------------------------
 * Link contrast and identification (WCAG 1.4.1, 1.4.3)
 * ------------------------------------------------------------------------ */

/* Links inside running text are underlined so they don't rely on color alone. */
#main :is(.elementor-widget-text-editor, .wpex-post-content, .entry-content, .oliver-news-article__content) :is(p, li, td, dd, blockquote) a:not(.theme-button, .vcex-button, .elementor-button, .wp-block-button__link) {
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.15em;
}

/* "Learn more" style text links: sage hover text was 2.3:1. */
a.vcex-button.theme-txt-link:hover,
a.vcex-button.theme-txt-link:focus-visible {
	color: var(--oliver-a11y-sage);
}

/* Tripleseat event inquiry form: black "Submit" text on navy was 1.5:1. */
#tripleseat_embed_form :is(input[type="submit"], input.button) {
	color: #fff;
}

#tripleseat_embed_form :is(input[type="submit"], input.button):is(:hover, :focus-visible) {
	color: var(--oliver-a11y-navy);
}

/*
 * Knoxville carousel counter ("1/8"): copper on cream was 2.4:1. The html
 * prefix outranks the Customizer's Additional CSS, which prints later.
 */
html body.page-id-501 #main .wpex-carousel .owl-dots,
html body.parent-pageid-501 #main .wpex-carousel .owl-dots,
html body.page-id-501 #main .owl-dots button.owl-dot,
html body.parent-pageid-501 #main .owl-dots button.owl-dot {
	color: var(--oliver-a11y-copper-large);
}

/*
 * Offer archive cards: titles moved from h3 to h2 so they follow the page h1.
 * Keep the Oxford archive's original h3 typeface (the Knoxville archive
 * template already sets one font for every heading level).
 */
body.term-oxford-offers .e-loop-item h2.elementor-heading-title {
	font-family: var(--wpex-heading-font-family);
}

/* ---------------------------------------------------------------------------
 * Keyboard parity for hover-only content (WCAG 1.4.13, 2.1.1)
 * ------------------------------------------------------------------------ */

.offer-container:is(:focus-visible, :focus-within) .offer-details {
	opacity: 1;
}

:is(.offer.type-offer, .post.type-post):focus-within .offer-caption {
	opacity: 0;
	transform: translateY(-40px);
}

.home-hover-flip:is(:focus-visible, :focus-within) img {
	opacity: 1 !important;
}

a.vcex-button.theme-txt-link:focus-visible::before,
a.vcex-button.theme-txt-link:focus-visible::after {
	width: 100%;
}

/* Escape closes a desktop dropdown even while focus remains on its parent. */
#site-navigation .wpex-dropdown-menu--onhover .menu-item.oliver-submenu-dismissed > .sub-menu {
	visibility: hidden;
	opacity: 0;
}

/* ---------------------------------------------------------------------------
 * Pause controls for auto-advancing content (WCAG 2.2.2)
 * ------------------------------------------------------------------------ */

.oliver-motion-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	min-width: 44px;
	min-height: 44px;
	padding: 0.5em 0.9em;
	border: 1px solid currentColor;
	border-radius: 999px;
	background: transparent;
	color: var(--oliver-a11y-navy);
	font: inherit;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	cursor: pointer;
}

.oliver-motion-toggle:hover {
	background: var(--oliver-a11y-navy);
	color: #fff;
}

.oliver-motion-toggle__icon {
	display: inline-block;
	width: 10px;
	height: 12px;
	flex: none;
}

/* Pause icon: two bars. */
.oliver-motion-toggle[aria-pressed="false"] .oliver-motion-toggle__icon {
	border-left: 3px solid currentColor;
	border-right: 3px solid currentColor;
}

/* Play icon: triangle. */
.oliver-motion-toggle[aria-pressed="true"] .oliver-motion-toggle__icon {
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 10px solid currentColor;
}

/* Owl carousels: sits beside the existing previous/next arrows. */
.wpex-carousel .owl-nav {
	align-items: center;
	gap: 12px;
}

.wpex-carousel .owl-nav .oliver-motion-toggle {
	order: -1;
	margin-right: 24px;
}

/*
 * Hero background slideshows. Top right, clear of the overlay header and of
 * the fixed "Book Now" badge, PageAssist, and reCAPTCHA in the bottom corners.
 */
.oliver-motion-toggle--slideshow {
	position: absolute;
	top: 116px;
	right: 24px;
	z-index: 5;
	border-color: rgba(255, 255, 255, 0.85);
	background: rgba(19, 48, 61, 0.75);
	color: #fff;
}

.oliver-motion-toggle--slideshow:hover {
	background: #fff;
	color: var(--oliver-a11y-navy);
}

@media (max-width: 1024px) {
	.oliver-motion-toggle--slideshow {
		top: 88px;
		right: 16px;
	}
}

/* ---------------------------------------------------------------------------
 * Reduced motion (WCAG 2.3.3)
 * ------------------------------------------------------------------------ */

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

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

	.elementor-motion-effects-element,
	.elementor-motion-effects-layer {
		transform: none !important;
	}
}

/* Windows High Contrast / forced colors: keep the focus ring. */
@media (forced-colors: active) {
	:is(a, button, input, select, textarea, [tabindex], [role="button"]):focus-visible {
		outline-color: Highlight !important;
	}
}