/*
 * Fox Socle — shared styles of the Fox GeneratePress child themes.
 * Loaded after GeneratePress, before the child style.css (which can override
 * anything here). Each section only applies when its feature is on: the socle
 * adds the matching class to <body>. Do not edit in a theme: see CONTRACT.md.
 */

/* --------------------------------------------------------------------------
 * fox_vars — Fox Blocks (--fxb-*) and Fox Affiliate (--fox-*) follow the
 * GeneratePress palette (--accent, --contrast, --base...). Zero specificity
 * (:where) and set on body, not :root: the child theme's own body{} rules
 * and a Fox Blocks theme set on a block wrapper both still win.
 * ------------------------------------------------------------------------ */
:where(body.fox-socle-vars) {
	--fxb-accent: var(--accent);
	--fxb-accent-hover: var(--contrast);
	--fxb-text: var(--contrast);
	--fxb-text-secondary: var(--contrast-2);
	--fxb-text-on-sunken: var(--contrast);
	--fxb-surface: var(--base-3);
	--fxb-surface-raised: var(--base-3);
	--fxb-surface-sunken: var(--base);
	--fxb-border-focus: var(--contrast);
	--fox-accent: var(--accent);
	--fox-accent-hover: var(--contrast);
	--fox-text: var(--contrast);
	--fox-text-muted: var(--contrast-2);
	--fox-bg: var(--base-3);
}

/* --------------------------------------------------------------------------
 * block_spacing — under GeneratePress, a heading that follows a Fox block
 * (criteria-scores first) touched the frame: no top margin (study, section 9).
 * ------------------------------------------------------------------------ */
body.fox-socle-blocks .fxb-block + h2,
body.fox-socle-blocks .fxb-block + h3,
body.fox-socle-blocks .fxb-block + h4 {
	margin-top: var(--fxb-block-gap, 2em);
}

/* --------------------------------------------------------------------------
 * a11y — reduced motion, forced colours, print.
 * ------------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	body.fox-socle-a11y *,
	body.fox-socle-a11y *::before,
	body.fox-socle-a11y *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

@media (forced-colors: active) {
	body.fox-socle-a11y a:focus-visible,
	body.fox-socle-a11y button:focus-visible,
	body.fox-socle-a11y input:focus-visible {
		outline: 2px solid CanvasText;
		outline-offset: 2px;
	}
	body.fox-socle-a11y .fxb-block,
	body.fox-socle-a11y .button,
	body.fox-socle-a11y button {
		border: 1px solid CanvasText;
	}
}

body.fox-socle-a11y :focus-visible {
	outline: 2px solid var(--contrast, currentColor);
	outline-offset: 2px;
}

@media print {
	body.fox-socle-a11y .site-header,
	body.fox-socle-a11y .main-navigation,
	body.fox-socle-a11y #mobile-header,
	body.fox-socle-a11y .site-footer,
	body.fox-socle-a11y .generate-back-to-top,
	body.fox-socle-a11y .comments-area,
	body.fox-socle-a11y .post-navigation,
	body.fox-socle-a11y .is-right-sidebar,
	body.fox-socle-a11y .is-left-sidebar {
		display: none !important;
	}
	body.fox-socle-a11y {
		background: #fff;
		color: #000;
	}
	body.fox-socle-a11y .site-content,
	body.fox-socle-a11y .content-area,
	body.fox-socle-a11y .inside-article {
		width: 100% !important;
		max-width: none !important;
		padding: 0 !important;
		box-shadow: none !important;
	}
	body.fox-socle-a11y .entry-content a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 0.85em;
		word-break: break-all;
	}
	body.fox-socle-a11y img {
		max-width: 100% !important;
		break-inside: avoid;
	}
	body.fox-socle-a11y h2,
	body.fox-socle-a11y h3 {
		break-after: avoid;
	}
}