/*
 * Your global styles here
 */
html,
body {
	height: 100%;
}

html {
	background: white;
}

body {
	margin: 0;
}

/*
 * Full-bleed home chrome. The full-width blue header and the sidebar/content
 * sit in stacked layout sections. Two theme constraints are removed here:
 *   1. The sections' default padding (16px each side) — vertical padding left a
 *      gap between the header and the sidebar; horizontal padding inset the body.
 *   2. The theme content-width cap (max-width 1800px + auto side margins) on
 *      .columns-content, which stopped the body spanning the full page width.
 * Result: the blue header and the body (sidebar + content) run edge to edge.
 * The header's own inner content keeps its max-width via the component CSS.
 * !important is required to beat the section/theme's own rules.
 */
community_layout-section.comm-section-container {
	padding: 0 !important;
}

community_layout-section.comm-section-container .columns-content {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/*
 * Shell chrome — grey "ground". The body section that holds the sidebar and
 * content sits on a pale grey ground (#eff3fb), matching the reference; the
 * floating white content card itself is styled in lwrPageLayout.css
 * (.layout__content), since every shell page composes its sidebar + content
 * split internally via c-lwr-page-layout rather than as separate Builder
 * columns. Scoped to :has(c-lwr-page-layout) so only shell pages are affected.
 */
community_layout-section.comm-section-container:has(c-lwr-page-layout) {
	background: #eff3fb !important;
}

/*
 * Full-height home body (desktop). Wrap the whole page in a vertical flexbox
 * and let the content grow to fill everything under the header, so the grey
 * ground runs to the bottom of the page. The theme's outer wrapper is already a
 * flex column with a growing <main>, but several inline data-provider wrappers
 * between <main> and the content break the height chain — collapse them with
 * display:contents, then flex-grow the content container, the body section and
 * its column row. The hidden SEO region is pulled out of flow so it doesn't
 * reserve height at the bottom. All rules are scoped to the home page via
 * :has(c-lwr-page-layout) so other pages are untouched.
 */
@media (min-width: 769px) {
	community_byo-scoped-header-and-footer.full-height {
		min-height: 100vh !important;
	}

	main:has(c-lwr-page-layout) {
		display: flex;
		flex-direction: column;
	}

	main:has(c-lwr-page-layout) webruntime-router-container,
	main:has(c-lwr-page-layout) dxp_data_provider-user-data-provider,
	main:has(c-lwr-page-layout) dxp_data_provider-data-proxy,
	main:has(c-lwr-page-layout) dxp_data_provider-decision-data-provider,
	main:has(c-lwr-page-layout) community_layout-slds-flexible-layout,
	main:has(c-lwr-page-layout) experience-data-layer-object {
		display: contents;
	}

	main:has(c-lwr-page-layout) community_layout-hidden-region {
		position: absolute !important;
	}

	main:has(c-lwr-page-layout) .content-container {
		flex: 1 1 auto;
		min-height: 0;
	}

	community_layout-section.comm-section-container:has(c-lwr-page-layout) {
		display: flex !important;
		flex-direction: column !important;
		flex: 1 1 auto !important;
	}

	community_layout-section:has(c-lwr-page-layout) .columns-content {
		flex: 1 1 auto;
		min-height: 0;
	}

	/*
	 * The chain above stretches every framework wrapper down to the page's
	 * column, but community_layout-column's own single-child wrapper
	 * (.column-content, holding the shell page component e.g. c:mppHomePage)
	 * was never told to grow, so the page — and the shell inside it — sized
	 * to its own content instead of the available height, leaving the grey
	 * ground visible below a short page. .column-content is itself a
	 * column-direction flex container (framework default), so its child needs
	 * an explicit flex-grow, not just stretch (stretch only affects the cross
	 * axis — width — in a column-direction container).
	 */
	community_layout-column:has(c-lwr-page-layout) > .column-content {
		flex: 1 1 auto;
		min-height: 0;
	}

	community_layout-column:has(c-lwr-page-layout) > .column-content > * {
		flex: 1 1 auto;
		min-height: 0;
	}
}

/*
 * /pro embedded Pro portal. The page body is one absolute-fill iframe host
 * (c-new-pharma-programs-frame) dropped in a Builder column, anchored to the
 * viewport-contained content region c-mpp-pro-theme-layout provides. The
 * framework's section wrapper (.columns-content) is itself position:relative
 * with no height, so without help the absolute host collapses to 0 against
 * it. Collapse the inline data-provider wrappers with display:contents and
 * run height down the section chain, so the host's containing block becomes
 * the full content region. Scoped under c-mpp-pro-theme-layout, which only
 * the Pro page uses; applies at every width — the framed app owns its own
 * responsive behaviour.
 */
c-mpp-pro-theme-layout webruntime-router-container,
c-mpp-pro-theme-layout dxp_data_provider-user-data-provider,
c-mpp-pro-theme-layout dxp_data_provider-data-proxy,
c-mpp-pro-theme-layout dxp_data_provider-decision-data-provider,
c-mpp-pro-theme-layout community_layout-slds-flexible-layout,
c-mpp-pro-theme-layout experience-data-layer-object {
	display: contents;
}

c-mpp-pro-theme-layout community_layout-hidden-region {
	position: absolute !important;
}

c-mpp-pro-theme-layout .content-container,
c-mpp-pro-theme-layout community_layout-section.comm-section-container,
c-mpp-pro-theme-layout community_layout-section .columns-content {
	height: 100%;
}