/*
 * Links and text on the dark surfaces, which the light palette cannot serve.
 *
 * Loaded from functions.php, after the styles core prints inline. That order
 * matters: our selectors and core's layout selectors have the same specificity,
 * so the later one wins, and every grid on the site depends on ours winning.
 */

/* ------------------------------------------------------------- links on navy */

/*
 * The link colour in theme.json is tuned for white paper, where deep navy is the
 * accessible choice. On the navy footer that same colour is nearly invisible, so
 * every link inside a dark surface flips to paper with the accent on hover.
 *
 * Scoped to the background classes rather than to the footer, so a navy section
 * anywhere on a page gets it too.
 */
.has-navy-background-color a:where(:not(.wp-element-button):not(.ghizo-wordmark)),
.has-navy-field-gradient-background a:where(:not(.wp-element-button):not(.ghizo-wordmark)) {
	color: var(--wp--preset--color--paper);
	text-decoration-color: rgba(255, 255, 255, 0.35);
	text-underline-offset: 0.18em;
}

.has-navy-background-color a:where(:not(.wp-element-button)):hover,
.has-navy-field-gradient-background a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--blue-soft);
	text-decoration-color: currentColor;
}

.has-navy-background-color a:focus-visible,
.has-navy-field-gradient-background a:focus-visible {
	outline: 2px solid var(--wp--preset--color--blue-soft);
	outline-offset: 3px;
}