/*
 * Remote footer corrections.
 *
 * footer.php echoes markup fetched from www.velociteach.com, and the main site's theme serves a
 * companion stylesheet — velociteach-2024/css/remote-header-footer.css — that this site loads
 * cross-origin. That file already supplies the footer nav grid, the always-open submenus and the
 * heading rules, so almost nothing about the footer needs restating here.
 *
 * What it does not carry is the rule hiding navigation link descriptions, which on the main site
 * lives in the theme's own stylesheet and stays behind. Without it every footer link prints its
 * full description, which is what turns the footer into a wall of text. The two column rules
 * below correct for this theme's global styles rather than for anything missing.
 *
 * Everything is scoped to the footer element: the header is also a .wp-block-template-part, and
 * remote-header-footer.css styles it correctly already.
 */

/* Footer links carry a description span next to the label, both inline inside the <a>. The main
   site hides these; its header mega menus re-show them at a higher specificity, which is why the
   header is unaffected either way. */
footer.wp-block-template-part .wp-block-navigation-item__description {
	display: none;
}

/* This theme's global styles put `align-items: center` on every .is-layout-flex and leave the
   columns without a gap, so the logo column floats against the taller nav column and the two run
   together. The main site renders them top-aligned, 24px apart. */
footer.wp-block-template-part .wp-block-columns {
	gap: 24px;
	align-items: normal;
}

/* The two columns are 50% each, which with the gap above overflows the row and wraps them into a
   stack. The main site's generated layout CSS pairs that width with nowrap so they shrink to fit
   instead; that CSS is emitted inline on the origin page and never reaches this site.
   Confined to the wide breakpoint so core's own mobile stacking still wins. */
@media screen and (min-width: 782px) {
	footer.wp-block-template-part .wp-block-columns {
		flex-wrap: nowrap;
	}

	footer.wp-block-template-part .wp-block-columns > .wp-block-column {
		flex-basis: 50%;
	}
}