/*
Theme Name: English Performance Child
Description: Local child theme for objective accessibility and loading fixes.
Author: English Performance
Template: twentytwentyfive
Version: 0.5.4
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: english-performance-child
*/

/*
 * Bound the footer logo before its lazy-loaded source enters the viewport.
 * WordPress reserves a 3000px intrinsic placeholder for auto-sized images;
 * without an explicit cap that placeholder can widen the whole document.
 */
footer .wp-block-site-logo .custom-logo-link {
	display: inline-block;
	max-width: 287px;
}

footer .wp-block-site-logo .custom-logo {
	display: block;
	width: min(100%, 287px) !important;
	max-width: 287px !important;
	height: auto !important;
}

/*
 * Keep the three header controls in separate grid tracks on narrow screens.
 * The source template uses nowrap columns plus a 200px logo and 100px of nav
 * padding below 1024px; at 320px those values make the logo, menu and CTA
 * occupy the same pixels. The desktop/tablet layout is intentionally untouched.
 */
@media (max-width: 599px) {
	.superbthemes-navigation-004 {
		padding-right: 16px !important;
		padding-left: 16px !important;
	}

	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-wrapper {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 44px max-content;
		align-items: center !important;
		gap: 8px !important;
	}

	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-logo,
	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-nav,
	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-button {
		width: auto !important;
		min-width: 0 !important;
		flex-basis: auto !important;
	}

	.superbthemes-navigation-004 .wp-block-site-logo .custom-logo {
		display: block;
		width: min(100%, 160px) !important;
		max-width: 160px !important;
		height: auto !important;
	}

	/* WordPress gives off-screen lazy images a 3000px intrinsic placeholder. */
	footer .wp-block-site-logo .custom-logo-link {
		display: inline-block;
		max-width: 180px;
	}

	footer .wp-block-site-logo .custom-logo {
		display: block;
		width: min(100%, 180px) !important;
		max-width: 180px !important;
		height: auto !important;
	}

	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-nav {
		padding-left: 0 !important;
		text-align: center !important;
	}

	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-nav .wp-block-navigation {
		justify-content: center !important;
	}

	.superbthemes-navigation-004 .wp-block-navigation__responsive-container-open {
		display: flex !important;
		width: 44px;
		height: 44px;
		align-items: center;
		justify-content: center;
	}

	.superbthemes-navigation-004 .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-button .wp-block-buttons {
		justify-content: flex-end !important;
	}

	.superbthemes-navigation-004 .superbthemes-navigation-004-columns-button .wp-block-button__link {
		box-sizing: border-box;
		display: inline-flex;
		min-height: 44px;
		align-items: center;
		padding-right: 12px !important;
		padding-left: 12px !important;
		white-space: nowrap;
	}

	/* A floating overlay has no non-obscuring position at phone widths. */
	#wpfront-scroll-top-container {
		display: none !important;
	}
}

/*
 * Keep the Blog's featured article legible at phone widths. The parent theme
 * forces a landscape thumbnail into a 650px-tall cover crop, which reduces the
 * visible source to a narrow vertical slice. On phones the image and summary
 * become two stacked regions so the photograph keeps its authored framing.
 */
@media (max-width: 599px) {
	body.blog .superbaddons-is-relative-position {
		min-height: 0 !important;
		overflow: hidden;
	}

	body.blog .superbaddons-is-relative-position > .wp-block-post-featured-image {
		height: auto !important;
		margin: 0 !important;
	}

	body.blog .superbaddons-is-relative-position > .wp-block-post-featured-image > a {
		display: block;
		height: auto !important;
	}

	body.blog .superbaddons-is-relative-position > .wp-block-post-featured-image img {
		display: block;
		width: 100%;
		height: auto !important;
		aspect-ratio: 1248 / 653;
		object-fit: cover;
		object-position: center;
	}

	body.blog .superbaddons-is-relative-position > .superbaddons-is-absolute-position-bottom {
		position: static !important;
		padding: 0 !important;
	}

	body.blog .superbaddons-is-relative-position > .superbaddons-is-absolute-position-bottom > .superbaddons-has-blur-backdrop {
		background: #3f4852 !important;
		border: 0 !important;
		border-radius: 0 0 8px 8px !important;
		backdrop-filter: none;
	}
}

/*
 * Contain semantic tables with three or more columns on phone-sized screens.
 * The table keeps its column relationships and scrolls inside its labelled,
 * keyboard-focusable figure; the page itself never acquires horizontal scroll.
 */
@media (max-width: 599px) {
	.wp-block-post-content .ep-mobile-wide-table {
		box-sizing: border-box;
		display: block;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
		scrollbar-color: var(--wp--preset--color--accent-4, #686868) transparent;
	}

	.wp-block-post-content .ep-mobile-wide-table table {
		width: 100%;
		min-width: 42rem;
	}

	.wp-block-post-content .ep-mobile-wide-table:focus-visible {
		outline: 3px solid var(--wp--preset--color--accent-1, #c11718);
		outline-offset: 3px;
	}
}