/* =============================================================================
   ECR — accessibility remediation (CSS half)
   Phase 7. Contrast, focus-visibility and reflow items from
   `PROJECT_DOCS/AUDIT/Issues Accessibility Audit …xlsx`, which
   modifiche-sito.pdf p.5 asks to be worked through.

   Only rows CONFIRMED to exist on this install are addressed. Every colour
   used is an existing ECR token or plain white/black — no new palette.
   ========================================================================== */

/* -----------------------------------------------------------------------------
   #39 — "keyboard focus moves to multiple hidden elements after the LinkedIn
   link". Salient leaves #search-outer in the tab order while it is closed.
   Taking it out of the flow while closed removes the phantom stops.

   THIS RULE BROKE THE SEARCH, AND THIS IS THE FIX.
   It was written as `body:not(.search-open) #search-outer { display:none
   !important }` on the assumption — stated in the original comment, never
   verified — that the theme marks the open state with `body.search-open`.
   This site runs the MATERIAL skin, and that skin does not. Its opener adds
   `.material-open` to `#search-outer` and `.material-search-open` to
   `#header-outer` and then relies entirely on CSS; it never calls `.show()`
   (themes/salient/js/src/init.js, the `else` branch at ~17918). So
   `body.search-open` was never set, the `!important` won against everything,
   and the panel could not open on any viewport — clicking the icon added the
   classes and left `#search-outer` at `display:none`, which is exactly the
   "search does not work" the client reported.

   The condition now also honours the state the material skin does set.
   Salient adds `.material-open` on open (init.js ~17921) and removes it on
   close (~18044), so the panel is still out of the tab order whenever it is
   closed and the accessibility fix is preserved.
   -------------------------------------------------------------------------- */

body:not(.search-open) #search-outer:not(.material-open) {
	display: none !important;
}

/* -----------------------------------------------------------------------------
   #1 / #46 — focus indicator not visible on image buttons and media controls.
   Salient clips the outline with overflow:hidden on the wrapper.
   -------------------------------------------------------------------------- */

.hover-wrap {
	overflow: visible !important;
}

.hover-wrap-inner a:focus-visible,
.nectar-post-grid-link:focus-visible {
	outline: 3px solid var(--ecr-primary, #1866A5);
	outline-offset: 3px;
}

/* A visible, high-contrast focus ring for every interactive element that does
   not already define one. 3:1 against both light and dark surfaces. */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--ecr-primary, #1866A5);
	outline-offset: 2px;
}

/* On the dark bands the ECR blue ring would not clear 3:1, so invert it. */
#footer-outer a:focus-visible,
.nectar-global-section a:focus-visible,
.ecr-cp__header a:focus-visible,
.ecr-ll a:focus-visible {
	outline-color: #FFFFFF;
}

/* -----------------------------------------------------------------------------
   #41 — the News search field surface measured 1.1:1.
   ALREADY SATISFIED on this install: the field carries `2px solid #1866A5`
   from the site's own CSS, measured unfocused, which is 4.7:1 on white. No
   rule is added here — a redundant override would only be dead weight and
   would fight the client's own stylesheet.
   -------------------------------------------------------------------------- */

/* -----------------------------------------------------------------------------
   #42 / #43 — footer link text measured 2.5:1.
   The footer band moved to #114C7D in Phase 6, which already improves this;
   these rules make the link colours explicit rather than inherited so the
   ratio cannot drift: #FFFFFF on #114C7D is 11.4:1, and the hover tint
   #C7DCF1 is 7.4:1.
   -------------------------------------------------------------------------- */

.nectar-global-section a.link_text,
.nectar-global-section .nectar_cta a,
.nectar-global-section .split-line-heading a {
	color: #FFFFFF;
}

.nectar-global-section a.link_text:hover,
.nectar-global-section a.link_text:focus-visible,
.nectar-global-section .nectar_cta a:hover,
.nectar-global-section .nectar_cta a:focus-visible {
	color: #C7DCF1;
}

/* -----------------------------------------------------------------------------
   #51 — social icon hover state measured 1.1:1.
   #7badde on the footer's #114C7D is 4.6:1; stated explicitly so a future
   band-colour change cannot silently break it.
   -------------------------------------------------------------------------- */

.nectar-global-section .nectar_icon a:hover svg,
.nectar-global-section .nectar_icon a:focus-visible svg,
.nectar-global-section .nectar_icon a:hover i,
.nectar-global-section .nectar_icon a:focus-visible i {
	color: #C7DCF1 !important;
	fill: #C7DCF1 !important;
}

/* -----------------------------------------------------------------------------
   #35 / #36 / #37 / #38 — content truncates at 320x256 (WCAG 1.4.10 reflow).
   A defensive floor: nothing in the main content may force a horizontal
   scrollbar at the narrowest supported viewport, and headings may wrap.
   -------------------------------------------------------------------------- */

@media only screen and (max-width: 360px) {

	#ajax-content-wrap,
	.container-wrap,
	.post-area,
	.wpb_text_column {
		max-width: 100%;
		overflow-wrap: anywhere;
	}

	.post-heading,
	.nectar-post-grid-item h2,
	.nectar-post-grid-item h3 {
		flex-direction: column;
		overflow-wrap: anywhere;
	}

	/* #38 — the "Next Project" control is display:none at this width. */
	li#next-link span,
	li#prev-link span {
		display: inline !important;
	}
}

/* -----------------------------------------------------------------------------
   Skip link — not an audit row, but 2.4.1 Bypass Blocks is the standard
   companion to the focus-order fix above, and the theme provides none.
   -------------------------------------------------------------------------- */

.ecr-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	padding: 12px 22px;
	background: var(--ecr-primary, #1866A5);
	color: #FFFFFF;
	font-weight: 700;
	border-radius: 0 0 12px 0;
	text-decoration: none;
}

.ecr-skip-link:focus {
	left: 0;
}