/* Fox Child — front end for Fox Posts / Fox Section Heading blocks.
   The post designs themselves come from the parent theme (css56/builder/*.css). */

/* Space between sections, like the homepage builder.
   A heading block "belongs" to the posts block right after it, so no extra gap there
   (the theme's heading already has its own 24px bottom margin). */
:root { --fox-child-gap: 40px; }
@media only screen and (max-width: 600px) { :root { --fox-child-gap: 28px; } }

.fox-child-block { margin-top: 0; margin-bottom: 0; }
.fox-child-block + .fox-child-block { margin-top: var(--fox-child-gap); }
.fox-child-block.fox-child-heading + .fox-child-block.fox-child-posts { margin-top: 0; }

/* inside a normal article body */
.single56__content > .fox-child-block { margin-top: 2em; margin-bottom: 2em; }
.single56__content > .fox-child-block.fox-child-heading { margin-bottom: 0; }
.single56__content > .fox-child-block.fox-child-heading + .fox-child-block.fox-child-posts { margin-top: 0; }

/* Blocks dropped inside a normal page/post body: stop the article's content styles
   (link underlines, paragraph spacing) from leaking into the post cards. */
.single56__content .fox-child-block a,
.single56__content .fox-child-block p a,
.single56__content .fox-child-block ul a,
.single56__content .fox-child-block ol a {
	text-decoration: none;
	text-decoration-color: transparent;
}
.single56__content .fox-child-block ul,
.single56__content .fox-child-block ol { margin: 0; padding: 0; }
.single56__content .fox-child-block h2,
.single56__content .fox-child-block h3,
.single56__content .fox-child-block h4 { margin-top: 0; }
.single56__content .fox-child-block img { margin: 0; }

/* Editor-only "no posts" message */
.fox-child-notice {
	padding: 14px 16px;
	border: 1px dashed rgba(0,0,0,.25);
	font-size: 14px;
	color: #a00;
	background: rgba(0,0,0,.02);
}

/* -------------------------------------------------------------------------
   Magazine Canvas page template (page-templates/magazine-canvas.php)
   ------------------------------------------------------------------------- */
.fox-canvas { padding: 20px 0 30px; }
@media only screen and (max-width: 840px) { .fox-canvas { padding: 0 0 20px; } }

.fox-canvas__inner > * { margin-top: 0; margin-bottom: 0; }
.fox-canvas__inner > * + * { margin-top: var(--fox-child-gap); }
.fox-canvas__inner > .fox-child-block.fox-child-heading + .fox-child-block.fox-child-posts { margin-top: 0; }

/* normal content blocks (paragraphs, images…) keep a readable width by default */
.fox-canvas__inner > :where(p, ul, ol, blockquote, h1, h2, h3, h4, h5, h6, .wp-block-quote, .wp-block-pullquote) {
	max-width: var(--narrow-width, 720px);
	margin-left: auto;
	margin-right: auto;
}

/* wide / full alignment */
.fox-canvas__inner > .alignwide { max-width: none; width: auto; }
.fox-canvas__inner > .alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}
.fox-canvas__inner > .alignfull.fox-child-block > * { padding-left: 1.5%; padding-right: 1.5%; }
