/*
Theme Name: FPH 2025
Template: twentytwentyfive
Description: Child theme of Twenty Twenty-Five.
Author: NettSite
Author URI: https://nettsite.co.za
Author Email: support@nettsite.co.za
Version: 1.1
Text Domain: fph-2025
*/

/* Sticky positioning must live on the auto-generated template-part wrapper
   (<header class="wp-block-template-part">), not on .fph-sticky-header itself.
   That wrapper is the element's containing block, and WP always sizes it to
   exactly match the header's own height — zero extra room means a sticky
   child has nowhere to "stick" and just scrolls normally. The wrapper's own
   containing block (the page) is tall enough for sticky to actually work. */
header.wp-block-template-part:has(.fph-sticky-header) {
	position: sticky;
	top: 0;
	z-index: 50;
}

@media (max-width: 782px) {
	.fph-sticky-header {
		flex-wrap: wrap;
		row-gap: 12px;
	}

	.fph-sticky-header nav {
		flex-wrap: wrap;
		row-gap: 10px;
	}
}

/* The logo's flex item shrinks narrower than its fixed 100px height in a
   nowrap flex row once sibling content (title, nav, donate button) leaves
   it no room — width and height are inline-styled equal but only width
   is elastic by default, so the round logo squashes into an oval. */
.fph-sticky-header .wp-block-image {
	flex-shrink: 0;
}