/**
 * Brains On Board contact popup: the Breakdance popup "Enquiry popup" (popup CSS class "bob-pop").
 *
 * Its size, colours, outline, shadow, overlay, close button and animation are set in Breakdance:
 * the popup element's own settings, plus the "BOB popup" classes for the bar and body inside it.
 * This file covers only what Breakdance has no setting for.
 */

/* The popup hides the page scrollbar while open; keep its space so the page doesn't shift. */
html.breakdance-noscroll {
	scrollbar-gutter: stable;
}

/* Scrolling inside the popup never scrolls the page behind it. */
.bob-pop .breakdance-popup-content {
	overscroll-behavior: contain;
}

/* Comic-kit close button: ink outline and hard shadow, kept above the sticky top bar. */
.bob-pop .breakdance-popup-close-button {
	z-index: 2;
	border: var(--bob-border);
	box-shadow: var(--bob-shadow-sm);
}

.bob-pop .breakdance-popup-close-button:focus-visible {
	outline: 3px solid var(--bde-palette-accent);
	outline-offset: 3px;
}

/* "Got it. Mike will ring you." panel (prompt 11). The Enquiry form block is shared by the popup,
   the Home section and /enquire/; only the popup swaps the headshot for Crassus waving, who sits
   bottom-centre on the card's bottom edge under the text and phone number. Elsewhere the panel
   keeps its headshot, and the waving image stays hidden. */
.bob-enq-done .bob-enq-done-peek {
	display: none;
}
.bob-pop .bob-enq-done {
	flex-direction: column;
	gap: 14px;
	padding-bottom: 0;
}
.bob-pop .bob-enq-done .bob-enq-done-img {
	display: none;
}
/* Heading and phone number centred over Crassus. */
.bob-pop .bob-enq-done .bob-enq-done-copy {
	text-align: center;
}
.bob-pop .bob-enq-done .bob-enq-done-peek {
	display: block;
	align-self: center;
	width: 120px;
	height: auto;
	margin-top: auto;
}
/* Once sent, the popup body drops its bottom padding so Crassus lands on the card's bottom edge.
   On phones the popup is a full-screen sheet: the body, the form block and the panel stretch to
   fill it, so he sits on the bottom of the screen. On desktop the card is only as tall as its
   content, so nothing stretches there. */
.bob-pop .bob-pop-body:has(.bob-enq-box.is-sent) {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
	padding-bottom: 0;
}
.bob-pop .bob-pop-body:has(.bob-enq-box.is-sent) > :has(.bob-enq-box.is-sent),
.bob-pop .bob-enq-box.is-sent {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
}
.bob-pop .bob-enq-box.is-sent .bob-enq-done {
	flex: 1 0 auto;
}
@media (max-width: 767px) {
	.bob-pop .bob-enq-done .bob-enq-done-peek {
		width: 96px;
	}
}

/* Once the form is sent, the popup drops its "Not sure what you need? Start here." heading,
   so the thank-you stands alone (prompt 13). */
.bob-pop .bob-pop-body:has(.bob-enq-box.is-sent) > .bob-pop-h2 {
	display: none;
}