/* BonMassage booking conversion 1.0.0
   Navy/gold system: colors are taken from the theme's existing
   .theme-btn.btn-style-one (gold) and header navy. CSS variables
   with theme-matched fallbacks; no new fonts or images. */
:root {
	--bmbc-navy: #10222b;
	--bmbc-gold: #a5885c;
	--bmbc-gold-dark: #8f7449;
	--bmbc-white: #ffffff;
}

/* ---------- Inline/contextual CTAs ---------- */
.bmbc-inline { margin: 24px 0 8px; text-align: center; }
.bmbc-inline .bmbc-cta { min-height: 48px; display: inline-flex; align-items: center; }
/* WCAG AA: our CTA labels render as large text (19px bold) on the theme gold. */
.bmbc-cta .btn-title, .bmbc-hero-btn .btn-title { font-size: 19px; font-weight: 700; }

/* Visible keyboard focus everywhere (WCAG 2.4.7) */
.bmbc-cta:focus-visible,
.bmbc-bar-link:focus-visible {
	outline: 3px solid var(--bmbc-navy);
	outline-offset: 2px;
	box-shadow: 0 0 0 5px rgba(165, 136, 92, .55);
}

/* ---------- Hero CTA ---------- */
.bmbc-hero { margin-top: 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.bmbc-hero .bmbc-hero-btn {
	min-height: 52px;
	display: inline-flex;
	align-items: center;
	font-weight: 700;
	letter-spacing: .04em;
}
.bmbc-hero-note { font-size: 14px; opacity: .85; }

/* ---------- Persistent mobile/tablet bar ---------- */
.bmbc-bar {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 9990; /* below CookieYes banner (which uses a higher z-index) */
	display: none;
	background: var(--bmbc-navy);
	box-shadow: 0 -2px 10px rgba(0, 0, 0, .25);
	padding-bottom: env(safe-area-inset-bottom, 0px);
	transform: translateY(0);
	transition: transform .2s ease;
}
@media (prefers-reduced-motion: reduce) {
	.bmbc-bar { transition: none; }
}
.bmbc-bar-link {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	min-height: 56px;
	padding: 8px 12px calc(6px);
	color: var(--bmbc-white);
	text-decoration: none;
	text-align: center;
}
/* 1.0.1 (WCAG AA): primary label is large text (19px bold) on brand gold
   (3.35:1 ≥ 3:1 large-text minimum); the support line moved onto the navy
   bar background (≈15:1). The whole bar stays one anchor. */
.bmbc-bar-primary {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	background: var(--bmbc-gold);
	border-radius: 6px;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: .06em;
	line-height: 1.2;
	color: var(--bmbc-white);
}
.bmbc-bar-link:hover .bmbc-bar-primary { background: var(--bmbc-gold-dark); }
.bmbc-bar-support {
	margin-top: 4px;
	font-size: 13px;
	line-height: 1.3;
	color: #ffffff;
}

/* Show only on mobile + tablet; desktop keeps the sticky-header CTA. */
@media (max-width: 1023.98px) {
	.bmbc-bar { display: block; }
	/* Reserve space so the bar never covers footer content or controls. */
	body.bmbc-has-bar { padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important; }

	/* Lift coexisting fixed controls above the bar (WhatsApp + CookieYes revisit). */
	body.bmbc-has-bar #ht-ctc-chat { bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; }
	body.bmbc-has-bar .cky-btn-revisit-wrapper { bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important; }
}

/* Hidden states: menu drawer open, or CookieYes consent banner active.
   1.0.1: display-based (transform proved unreliable inside this theme's
   stacking/animation stack) — the drawer has its own Book Now action. */
body.mobile-menu-visible .bmbc-bar,
body.bmbc-consent-open .bmbc-bar { display: none !important; }
body.bmbc-consent-open.bmbc-has-bar #ht-ctc-chat { bottom: 24px !important; }

/* 200% zoom / very small heights: keep the page usable — the bar stays,
   content padding grows with it because it is height-based. */
@media (max-height: 380px) and (max-width: 1023.98px) {
	.bmbc-bar { display: none; }
	body.bmbc-has-bar { padding-bottom: 0 !important; }
}

/* FAQ end callout */
.bmbc-faq_end { padding: 20px 0 4px; }

/* High-contrast text on gold: verified against WCAG AA for bold 17px.
   Do not rely on colour alone — labels are explicit text. */

/* 1.0.1: the theme's header/sticky Book Now uses Bootstrap d-xl-block
   (visible only ≥1200px), leaving 1024–1199px with no booking CTA
   (the mobile bar stops below 1024). Show the header button from
   1024px so every viewport ≥1024 has the sticky-header CTA. */
@media (min-width: 1024px) {
	.main-header .btn-box.d-none.d-xl-block,
	.sticky-header .btn-box.d-none.d-xl-block { display: block !important; }
}