/**
 * "Book an Online Consultation" floating icon button + fallback modal.
 *
 * A small round icon (video-camera glyph) rather than a text pill - the
 * bottom-left corner already has Google's own "Customer Reviews" badge
 * (a fixed iframe Google controls, roughly 86x64px, not something this
 * site can reposition), so the button sits ABOVE it with a large enough
 * gap to clear it on both phone and desktop, rather than in the corner
 * itself. The chat bubble occupies bottom-right, which is why this stays
 * on the left rather than swapping sides.
 */

/* !important on the box-model properties: confirmed live that the theme's
   own generic button styling (border-radius: 2px, padding: 15px 30px,
   auto width) was winning over the plain-class rule below and rendering
   this as a small rectangle instead of a circle - a plain single-class
   selector wasn't specific enough against it. */
body button.bme-consultation-trigger {
	position: fixed !important;
	left: 20px !important;
	bottom: 96px !important;
	z-index: 9999;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 52px !important;
	height: 52px !important;
	min-width: 52px !important;
	background: var( --bme-consult-accent, #2f6f56 ) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 50% !important;
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1 !important;
	box-shadow: 0 4px 14px rgba( 0, 0, 0, 0.18 );
	cursor: pointer;
}

.bme-consultation-trigger:hover {
	filter: brightness( 1.05 );
}

.bme-consultation-trigger__icon {
	width: 24px;
	height: 24px;
}

/* Fallback in case the theme doesn't already define this WordPress-core
   utility class - keeps the button's label available to screen readers
   without showing text next to the icon. */
.bme-consultation-trigger .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect( 1px, 1px, 1px, 1px );
	white-space: nowrap;
}

.bme-consultation-modal {
	position: fixed;
	inset: 0;
	z-index: 10000;
	background: rgba( 0, 0, 0, 0.5 );
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.bme-consultation-modal[hidden] {
	display: none;
}

.bme-consultation-modal__panel {
	position: relative;
	background: #fff;
	border-radius: 12px;
	padding: 32px 28px;
	max-width: 420px;
	width: 100%;
	text-align: center;
	font-family: "Futura", sans-serif;
}

.bme-consultation-modal__panel h2 {
	font-size: 18px;
	margin: 0 0 12px;
}

.bme-consultation-modal__panel p {
	color: #555;
	margin: 0 0 16px;
	font-size: 14px;
	line-height: 1.5;
}

.bme-consultation-modal__email-link {
	display: inline-block;
	background: var( --bme-consult-accent, #2f6f56 );
	color: #fff;
	text-decoration: none;
	padding: 10px 20px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 14px;
}

body button.bme-consultation-modal__close {
	position: absolute !important;
	top: 10px !important;
	right: 14px !important;
	width: auto !important;
	min-width: 0 !important;
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	color: #888;
}

@media ( max-width: 480px ) {
	body button.bme-consultation-trigger {
		width: 48px !important;
		height: 48px !important;
		min-width: 48px !important;
		bottom: 90px !important;
	}

	.bme-consultation-trigger__icon {
		width: 22px;
		height: 22px;
	}
}