/* launchpadphilly.org CSS overrides.
   Bump LAUNCHPAD_SITE_VERSION in launchpad-site.php after editing,
   then purge the Pressable page cache.

   This file is the single home for site-wide custom CSS. Do not add CSS to
   the child theme or to Salient's options panel — neither is in Git.
   See audit/findings/theme-options.md. */


/* --- Floating Apply Now button ---------------------------------------
   Rendered by inc/apply-button.php. Moved here from salient-child so the
   styling travels with the markup. */

.apply {
	position: fixed;
	z-index: 1000;
	bottom: 30px;
	right: 50px;
}

.apply a img {
	width: 120px;
	height: auto;
	max-width: 100%;
	transition: transform 0.3s ease;
}

.apply a img:hover {
	transform: scale(1.2);
}

@media only screen and (max-width: 577.98px) {
	.apply {
		bottom: 50px;
		right: 30px;
	}
}


/* --- Salient flip boxes: equal heights --------------------------------
   Moved from salient-child/style.css.

   Flip boxes size to their own content, so a row of them ends up ragged
   when the copy differs in length. These rules pin a minimum height so a
   row lines up.

   HOW TO USE: in WPBakery, open the row or column holding the flip boxes
   and add `same-height` to its "Extra class name" field. Without that
   class these rules do nothing, which is deliberate — it keeps the
   behaviour opt-in per row. */

.same-height .nectar-flip-box .flip-box-front {
	min-height: 350px !important;
}

@media only screen and (max-width: 578.98px) {
	.same-height .nectar-flip-box .flip-box-front {
		min-height: 300px !important;
	}
}

/* Back-face text on flip boxes, which Salient sets smaller than the front. */
.same-height .nectar-flip-box .flip-box-back span {
	font-size: 24px;
}


/* --- Salient toggles / accordions: hover contrast ---------------------
   Moved from salient-child/style.css.

   In Salient's "minimal" toggle style the title darkens on hover against a
   dark background, which drops it close to invisible. Force white instead. */

div[data-style="minimal"] .toggle:hover > .toggle-title a {
	color: #fff !important;
}
