/**
 * Renovation booking overlay — a full-screen takeover that collapses into a
 * bottom banner. Two layers live in one root; the state class on the root
 * (.is-expanded / .is-collapsed) decides which is shown. Self-contained: it
 * sets its own box-sizing, margins and scroll-lock so it renders identically
 * with or without the theme's base stylesheet.
 */
.booking-overlay{
	--bo-ground:#21160d;
	--bo-gold:#b79d60;
	--bo-text:#f6f5f3;
	--bo-dark:#21160d;
	font-family:'Jost',sans-serif;
}
.booking-overlay *,
.booking-overlay *::before,
.booking-overlay *::after{ box-sizing:border-box; }

body.ms-bo-locked{ overflow:hidden; }

/* ---------- shared button ---------- */
.bo-btn{
	display:inline-flex; align-items:center; justify-content:center;
	font:400 16px/1.6 'Jost',sans-serif; text-decoration:none; white-space:nowrap;
	padding:16px 32px; border-radius:500px; border:1px solid transparent;
	cursor:pointer; transition:background-color .2s ease, color .2s ease, transform .25s cubic-bezier(.22,1,.36,1);
}
.bo-btn:hover{ transform:translateY(-1px); }
.bo-btn--primary{ background:var(--bo-gold); color:var(--bo-dark); }
.bo-btn--primary:hover{ background:#a98e50; }
.bo-btn--ghost{ background:transparent; color:var(--bo-gold); border-color:var(--bo-gold); }
.bo-btn--ghost:hover{ background:rgba(183,157,96,.12); }
.bo-actions{ display:flex; gap:16px; align-items:center; justify-content:center; flex-wrap:wrap; }

/* ---------- transitions (enabled only after the first frame) ---------- */
.booking-overlay:not(.is-ready) .booking-overlay__full,
.booking-overlay:not(.is-ready) .booking-overlay__banner{ transition:none; }

/* ---------- full-screen takeover ---------- */
/* the scrim dims + blurs the page behind; the solid panel sits centred with a margin */
.booking-overlay__full{
	position:fixed; inset:0; z-index:100000;
	background:rgba(33,22,13,.6);
	-webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
	display:flex; align-items:center; justify-content:center;
	padding:clamp(16px,5vh,62px) clamp(16px,4vw,58px);
	opacity:0; visibility:hidden; pointer-events:none;
	transition:opacity .4s ease, visibility .4s ease;
}
.booking-overlay.is-expanded .booking-overlay__full{ opacity:1; visibility:visible; pointer-events:auto; }

.bo-panel{
	position:relative; overflow:clip;
	width:100%; max-width:1411px;
	height:100%; max-height:870px;
	background:var(--bo-ground);
	display:flex; overflow-y:auto;
}

.bo-full__inner{
	position:relative; z-index:1; margin:auto;
	display:flex; flex-direction:column; align-items:center; gap:23px;
	width:627px; max-width:92vw; padding:48px 24px; text-align:center;
}
.bo-full__logo{ width:227px; max-width:60vw; height:auto; }
.bo-full__text{
	margin:0; color:var(--bo-text);
	font:400 24px/1.4 'Jost',sans-serif; letter-spacing:-0.03em;
}
.bo-full__actions .bo-btn{ padding:16px 32px; }

.bo-close{
	position:absolute; top:14px; right:14px; z-index:2;
	display:flex; align-items:center; justify-content:center;
	width:44px; height:44px; padding:0;
	background:none; border:0; cursor:pointer; color:var(--bo-text);
	opacity:.85; transition:opacity .2s ease;
}
.bo-close:hover{ opacity:1; }
.bo-close svg{ width:18px; height:18px; display:block; }

/* ---------- bottom banner ---------- */
.booking-overlay__banner{
	position:fixed; left:0; right:0; bottom:0; z-index:99999;
	background:var(--bo-ground);
	transform:translateY(100%); pointer-events:none;
	transition:transform .45s cubic-bezier(.22,1,.36,1);
}
.booking-overlay.is-collapsed .booking-overlay__banner{ transform:translateY(0); pointer-events:auto; }

.bo-banner__inner{
	display:flex; align-items:center; justify-content:space-between; gap:24px;
	padding:18px 26px; padding-bottom:calc(18px + env(safe-area-inset-bottom,0px));
}
.bo-banner__text{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.bo-banner__line{
	margin:0; color:var(--bo-text);
	font:400 16px/1.4 'Jost',sans-serif; letter-spacing:-0.03em;
}
.bo-banner__line--muted{ opacity:.5; }
.bo-banner__actions{ flex-shrink:0; }
.bo-banner__actions .bo-btn{ padding:8px 24px; }

/* ---------- entrance (takeover appears) ---------- */
@keyframes bo-scrim-in{ from{ opacity:0 } to{ opacity:1 } }
@keyframes bo-panel-in{ from{ opacity:0; transform:translateY(14px) scale(.985) } to{ opacity:1; transform:none } }
@keyframes bo-rise{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }

.booking-overlay.is-expanded .booking-overlay__full{ animation:bo-scrim-in .5s ease both; }
.booking-overlay.is-expanded .bo-panel{ animation:bo-panel-in .6s cubic-bezier(.22,1,.36,1) both; }
.booking-overlay.is-expanded .bo-full__logo{ animation:bo-rise .7s cubic-bezier(.22,1,.36,1) .24s both; }
.booking-overlay.is-expanded .bo-full__text{ animation:bo-rise .7s cubic-bezier(.22,1,.36,1) .36s both; }
.booking-overlay.is-expanded .bo-full__actions{ animation:bo-rise .7s cubic-bezier(.22,1,.36,1) .48s both; }
.booking-overlay.is-expanded .bo-close{ animation:bo-scrim-in .6s ease .55s both; }

@media (prefers-reduced-motion: reduce){
	.booking-overlay.is-expanded .booking-overlay__full,
	.booking-overlay.is-expanded .bo-panel,
	.booking-overlay.is-expanded .bo-full__logo,
	.booking-overlay.is-expanded .bo-full__text,
	.booking-overlay.is-expanded .bo-full__actions,
	.booking-overlay.is-expanded .bo-close{ animation:none; }
	.bo-btn{ transition:none; }
}

/* ---------- responsive ---------- */
@media (max-width:760px){
	/* takeover: thinner scrim margin, comfortable panel padding */
	.booking-overlay__full{ padding:12px; }
	.bo-full__inner{ padding:40px 22px; gap:20px; }
	.bo-full__logo{ width:clamp(150px,42vw,200px); }
	.bo-full__text{ font-size:clamp(18px,4.4vw,24px); }
	.bo-close{ top:8px; right:8px; }

	/* banner: stack the copy over the actions so nothing is squished */
	.bo-banner__inner{ flex-direction:column; align-items:stretch; gap:14px; padding:16px 20px; padding-bottom:calc(16px + env(safe-area-inset-bottom,0px)); }
	.bo-banner__actions{ width:100%; }
	.bo-banner__actions .bo-actions{ gap:10px; }
}

@media (max-width:600px){
	/* full-width stacked CTAs in both states (the overview label is long) */
	.bo-full__actions .bo-actions,
	.bo-banner__actions .bo-actions{ flex-direction:column; align-items:stretch; width:100%; }
	.bo-full__actions .bo-btn,
	.bo-banner__actions .bo-btn{ width:100%; }

	/* takeover: centre the logo + message in the space above the bottom-anchored CTAs */
	.bo-full__inner{ width:100%; min-height:100%; margin:0; justify-content:flex-start; padding:24px 22px calc(28px + env(safe-area-inset-bottom,0px)); }
	.bo-full__logo{ margin-top:auto; }
	.bo-full__actions{ margin-top:auto; width:100%; }
}