/*
Theme Name: dct-from-scratch
Theme URI: 
Author: Mauna Apps
Author URI: 
Description: A theme for Pam, my wife. Love you, babe ❤️
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 8.1
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dct-from-scratch
Tags: 
*/

/*
 * Responsive guardrails for DB-authored content. Some older posts and search templates
 * contain long affiliate URLs or Search blocks whose intrinsic width otherwise wins over
 * the constrained column at phone sizes. Keep normal desktop layout untouched while
 * allowing flex children and long inline content to shrink/break on narrow viewports.
 */
@media (max-width: 599px) {
	.wp-block-post-content,
	.entry-content {
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}

	.wp-block-post-content a,
	.entry-content a {
		overflow-wrap: anywhere;
		word-break: break-word;
	}

	.wp-block-post-content img,
	.entry-content img {
		max-width: 100% !important;
		height: auto !important;
	}

	.wp-block-search,
	.wp-block-search__inside-wrapper {
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}

	.wp-block-search {
		flex: 0 1 100%;
	}

	.wp-block-search__input {
		flex: 1 1 0;
		min-width: 0;
	}

	.wp-block-search__button {
		flex: 0 0 auto;
	}

	/* The search template's editor-authored outer group is nowrap; it must not size itself
	 * from a descendant Search block's desktop intrinsic width. */
	body.search .wp-block-group.is-nowrap,
	body.search .wp-block-group.is-nowrap > .wp-block-group {
		width: 100%;
		min-width: 0;
		max-width: 100%;
	}

	/* Collapse the doubled top gap on phones. `.entry-content` already gets a 32px
	 * margin-block-start below the header (:where(.wp-site-blocks) > *). Its leading
	 * mobile header group is a flow child, so it adds a second 32px, pushing content down
	 * by 64px. The paired `.desktop-only` header zeroes its own top margin inline; mirror
	 * that for the `.mobile-only` one so the visible gap is a single 32px. */
	.entry-content > .desktop-only + .wp-block-group.mobile-only {
		margin-block-start: 0;
	}
}

/* The clipped screen-reader `<h1>` is the DOM first child, so WordPress's first-child rule
 * zeroes *its* margin — leaving the first *visible* block (the next sibling) to pick up the
 * full 32px :root :where(.is-layout-flow|constrained) > * margin, which reads as excess top
 * whitespace (e.g. /travel-tips/). Zero that sibling so visible content starts flush,
 * matching pages whose first child isn't screen-reader-only. Applies at all widths. */
.entry-content > .screen-reader-text:first-child + * {
	margin-block-start: 0;
}