/*
 * Days Out Now hub viewport guard
 *
 * The hub plugins originally used left:50% plus a negative 50vw margin to
 * escape a constrained WordPress content column. That calculation becomes
 * unstable as soon as a rail, embed or revealed card changes the document's
 * horizontal canvas. These rules make the actual WordPress page ancestors
 * full width first, then let each hub use an ordinary 100% layout.
 */

html:has(body.don-hub-layout-stable),
body.don-hub-layout-stable {
	width: 100% !important;
	max-width: 100% !important;
	overflow-x: hidden !important;
}

body.don-hub-layout-stable .wp-site-blocks {
	position: relative !important;
	width: 100% !important;
	max-width: none !important;
	overflow-x: hidden !important;
}

/*
 * The hub shortcodes already render their own native glass header over the
 * hero. WordPress also renders the normal template header as a direct child
 * of .wp-site-blocks. Keep the hub header and suppress only that duplicate
 * outer template header on supported hub pages.
 */
body.don-hub-layout-stable .wp-site-blocks > header:not(
	.don-days-hub-native-header,
	.don-walk-hub-native-header,
	.don-road-hub-native-header,
	.don-europe-hub-native-header,
	.don-breaks-hub-native-header,
	.don-travel-club-hub-native-header,
	.don-work-hub-native-header
) {
	display: none !important;
}

body.don-hub-layout-stable main,
body.don-hub-layout-stable main:has(.don-days-hub),
body.don-hub-layout-stable main:has(.don-walk-hub),
body.don-hub-layout-stable main:has(.don-road-hub),
body.don-hub-layout-stable main:has(.don-europe-hub),
body.don-hub-layout-stable main:has(.don-breaks-hub),
body.don-hub-layout-stable main:has(.don-travel-club-hub),
body.don-hub-layout-stable main:has(.don-work-hub) {
	display: block !important;
	position: relative !important;
	inset: auto !important;
	grid-column: 1 / -1 !important;
	justify-self: stretch !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
}

body.don-hub-layout-stable .wp-block-post-content,
body.don-hub-layout-stable .entry-content,
body.don-hub-layout-stable .wp-block-shortcode {
	display: block !important;
	position: relative !important;
	inset: auto !important;
	grid-column: 1 / -1 !important;
	justify-self: stretch !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
}

body.don-hub-layout-stable :is(
	.don-days-hub,
	.don-walk-hub,
	.don-road-hub,
	.don-europe-hub,
	.don-breaks-hub,
	.don-travel-club-hub,
	.don-work-hub
) {
	position: relative !important;
	inset: auto !important;
	left: auto !important;
	right: auto !important;
	grid-column: 1 / -1 !important;
	justify-self: stretch !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	overflow-x: clip !important;
}

body.don-hub-layout-stable :is(
	.don-days-hub,
	.don-walk-hub,
	.don-road-hub,
	.don-europe-hub,
	.don-breaks-hub,
	.don-travel-club-hub,
	.don-work-hub
) :is(img, video, iframe, svg, canvas) {
	max-width: 100%;
}

body.don-hub-layout-stable :is(
	.don-days-hub-native-header,
	.don-walk-hub-native-header,
	.don-road-hub-native-header,
	.don-europe-hub-native-header,
	.don-breaks-hub-native-header,
	.don-travel-club-hub-native-header,
	.don-work-hub-native-header
) {
	position: absolute !important;
	z-index: 1000 !important;
	inset: 0 auto auto 0 !important;
	left: 0 !important;
	right: auto !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	transform: none !important;
}

body.don-hub-layout-stable.admin-bar :is(
	.don-days-hub-native-header,
	.don-walk-hub-native-header,
	.don-road-hub-native-header,
	.don-europe-hub-native-header,
	.don-breaks-hub-native-header,
	.don-travel-club-hub-native-header,
	.don-work-hub-native-header
) {
	top: 32px !important;
}

@media (max-width: 782px) {
	body.don-hub-layout-stable.admin-bar :is(
		.don-days-hub-native-header,
		.don-walk-hub-native-header,
		.don-road-hub-native-header,
		.don-europe-hub-native-header,
		.don-breaks-hub-native-header,
		.don-travel-club-hub-native-header,
		.don-work-hub-native-header
	) {
		top: 46px !important;
	}
}

/*
 * Older UK country pages
 *
 * Scotland and Cornwall pre-date the hub shortcodes. Their raw page code uses
 * the same viewport breakout and can also contain a breakout nested inside
 * another breakout. Give those pages a full-width WordPress canvas first,
 * remove the theme's empty block-gap below the real header and neutralise each
 * nested breakout. England and Wales are included because they use the same
 * construction.
 */
html:has(body.don-country-layout-stable),
body.don-country-layout-stable {
	width: 100% !important;
	max-width: 100% !important;
	overflow-x: hidden !important;
}

body.don-country-layout-stable .wp-site-blocks {
	--wp--style--block-gap: 0px !important;
	position: relative !important;
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	gap: 0 !important;
	overflow-x: hidden !important;
}

body.don-country-layout-stable .wp-site-blocks > main,
body.don-country-layout-stable main,
body.don-country-layout-stable .wp-block-post-content,
body.don-country-layout-stable .entry-content {
	position: relative !important;
	inset: auto !important;
	display: block !important;
	grid-column: 1 / -1 !important;
	justify-self: stretch !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
}

body.don-country-layout-stable :is(
	.don-england-page,
	.don-wales-page,
	.don-scot-page,
	.don-corn-page,
	.don-cornwall-page
) {
	position: relative !important;
	inset: auto !important;
	left: auto !important;
	right: auto !important;
	grid-column: 1 / -1 !important;
	justify-self: stretch !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding-inline: 0 !important;
	overflow-x: clip !important;
	transform: none !important;
}

body.don-country-layout-stable :is(
	.don-scot-breakout,
	.don-corn-breakout,
	.don-cornwall-breakout,
	.don-england-breakout,
	.don-wales-breakout
) {
	position: relative !important;
	inset: auto !important;
	left: auto !important;
	right: auto !important;
	width: 100% !important;
	max-width: none !important;
	margin-right: 0 !important;
	margin-left: 0 !important;
	transform: none !important;
}

body.don-country-layout-stable :is(
	.don-england-page,
	.don-wales-page,
	.don-scot-page,
	.don-corn-page,
	.don-cornwall-page
) :is(img, video, iframe, svg, canvas) {
	max-width: 100%;
}