/**
 * LFBC layout utilities
 *
 * Container widths beyond the global contentSize/wideSize (1360px) set in
 * theme.json. Apply as a CSS class on a wp:group via "Advanced > Additional
 * CSS class(es)" in the block editor, or directly in a template's HTML.
 */

/* .alignwide — global 1360px container with responsive side padding.
 *
 * Padding clamps linearly between 20px (390px viewport) and 40px (1440px
 * viewport). At full desktop the wrapper spans 1360px with 40px on each
 * side, giving a 1280px inner content area. Use inside a full-bleed
 * (.alignfull) section to host constrained content. */
:where(.alignwide) {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding-left: clamp(20px, calc(20px + (100vw - 390px) * 20 / 1050), 40px);
	padding-right: clamp(20px, calc(20px + (100vw - 390px) * 20 / 1050), 40px);
	box-sizing: border-box;
}

/* Narrow reading container — primarily for blog post bodies.
 *
 *   Outer width:     max 1012px, centered.
 *   Inner padding:   80px each side at full width (1012px viewport), clamping
 *                    down to 20px at 390px viewport. Linear interpolation.
 *   Inner content:   ~852px at full width (1012 − 80 − 80).
 *
 * To use as the post-body wrapper, pair with align="full" on the same group
 * so the wrapper breaks out of the body's root padding (12–40px clamp), and
 * the 80px padding is the only horizontal space inside the wrapper. */
.lfbc-content--narrow {
	max-width: 1012px;
	margin-inline: auto;
	padding-left: clamp(20px, calc(20px + (100vw - 390px) * 60 / 622), 80px);
	padding-right: clamp(20px, calc(20px + (100vw - 390px) * 60 / 622), 80px);
	box-sizing: border-box;
}

/* Page (Narrow) template — vertical breathing room around the post body.
 * Kept on its own class so the shared .lfbc-content--narrow utility (used for
 * blog bodies) is unaffected. Applied via templates/page-narrow.html. */
.lfbc-page-narrow {
	margin-block-start: 3rem !important;
	margin-block-end: 3rem !important;
}

/*.wp-block-post-content-is-layout-constrained {*/
/*	margin-top: 5rem;*/
/*	margin-block-start: 5rem !important;*/
/*	margin-bottom: 5rem;*/
/*	margin-block-end: 5rem !important;*/
/*}*/

/* Default separator — make the unstyled hr white instead of inheriting the
 * dark currentColor. Scoped to separators with no explicit color class so
 * editor-chosen colors (and pattern rules like .lfbc-5050__tertiary-rule)
 * still win. */
.wp-block-separator.has-alpha-channel-opacity:not([class*="has-"][class*="-color"]) {
	background-color: #ffffff;
	color: #ffffff;
	border-color: #ffffff;
}