/* Bulod booking calendar */
.bcal { --bc-ink:#241F1A; --bc-stone:#6b655b; --bc-line:#E4DFD5; --bc-teal:#1F4841; --bc-soft:#EAF2EE;
	position:relative; font-family:inherit; color:var(--bc-ink); }

/* Once the calendar is live, the original fields are kept for the form but hidden. */
.bcal-on .bcal-src,
.bcal-on .mphb-datepick-wrapper,
.bcal-on > label,
.bcal-on label:has(> .bcal-src) { position:absolute !important; left:-9999px !important; height:0 !important; width:0 !important; overflow:hidden !important; }
.bcal-on > * { display:none; }
.bcal-on > .bcal { display:block; }

.bcal-sum { display:flex; gap:10px; }
.bcal-field { flex:1; text-align:left; background:#fff; border:1px solid var(--bc-line); border-radius:10px;
	padding:11px 14px; cursor:pointer; font-family:inherit; line-height:1.3; }
.bcal-field:hover { border-color:var(--bc-teal); }
.bcal-field span { display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--bc-stone); }
.bcal-field b { display:block; font-size:15px; font-weight:600; margin-top:3px; }

.bcal-panel { position:absolute; z-index:99999; top:calc(100% + 8px); left:0; background:#fff;
	border:1px solid var(--bc-line); border-radius:14px; padding:16px 18px 12px;
	min-width:300px; max-width:620px; box-sizing:border-box;
	box-shadow:0 24px 60px -18px rgba(0,0,0,.28); }
.bcal-panel.bcal-float, .bcal-attached .bcal-panel { position:absolute; z-index:99999; }
.bcal-attached { position:static; }
.datepick-popup:not(.bcal-panel), #ui-datepicker-div { display:none !important; }
.bcal-panel[hidden] { display:none !important; }

.bcal-nav { display:flex; justify-content:space-between; margin-bottom:6px; }
.bcal-nav button { background:none; border:0; font-size:22px; line-height:1; color:var(--bc-teal);
	cursor:pointer; padding:2px 10px; border-radius:8px; font-family:inherit; }
.bcal-nav button:hover { background:var(--bc-soft); }

/* The months are width-capped, so any slack in the panel would all
   collect on the right. Centre them so the margins match. */
.bcal-months { display:flex; gap:0; justify-content:center; }
.bcal-months.is-loading { opacity:.45; }
.bcal-m { flex:1 1 0; min-width:0; max-width:262px; padding:0 13px; }
/* Divider between the two months, matching the direct-booking calendar, so
   they read as two calendars rather than one continuous grid. */
.bcal-m + .bcal-m { border-left:1px solid var(--bc-line); }
.bcal-m-h { text-align:center; font-size:14px; font-weight:600; margin-bottom:8px; }
.bcal-dow, .bcal-g { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; }
.bcal-dow span { text-align:center; font-size:10.5px; letter-spacing:.04em; color:var(--bc-stone); padding-bottom:4px; }

.bcal-d { min-width:0; min-height:44px; border:1px solid #EFEBE3; border-radius:8px; background:#fff;
	display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;
	cursor:pointer; font-family:inherit; padding:3px 1px; }
.bcal-d:hover:not(:disabled) { border-color:var(--bc-teal); }
.bcal-n { font-size:13px; line-height:1.1; color:#241F1A; font-weight:500; }
.bcal-f { font-size:8.5px; letter-spacing:-.02em; color:#1F6B50; line-height:1; font-weight:500;
	white-space:nowrap; }
.bcal-x { }

.bcal-d.is-past { cursor:default; }
.bcal-d.is-past .bcal-n { color:#c9c4b9; }
.bcal-d.is-full { cursor:not-allowed; }
.bcal-d.is-full .bcal-n { color:#b9b3a8; text-decoration:line-through; }
.bcal-d.is-full .bcal-f { color:#b9b3a8; }
.bcal-d.is-mid { background:var(--bc-soft); border-radius:0; }
.bcal-d.is-in, .bcal-d.is-out { background:var(--bc-teal); }
.bcal-d.is-in .bcal-n, .bcal-d.is-out .bcal-n,
.bcal-d.is-in .bcal-f, .bcal-d.is-out .bcal-f { color:#fff; }

.bcal-pop { min-height:34px; margin-top:12px; padding-top:10px; border-top:1px solid var(--bc-line); }
.bcal-pop-h { font-size:13px; font-weight:600; }
.bcal-pop-note { font-size:12px; color:var(--bc-stone); margin-top:3px; }
.bcal-pop-l { list-style:none; margin:5px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:4px 14px; }
.bcal-pop-l li { font-size:12px; color:var(--bc-stone); }
.bcal-pop-l li span { color:#2f7a5f; }

.bcal-foot { display:flex; justify-content:space-between; align-items:center; margin-top:8px; }
.bcal-hint { font-size:11.5px; color:var(--bc-stone); }
.bcal-clear { background:none; border:0; font-size:12px; color:var(--bc-teal); text-decoration:underline;
	cursor:pointer; font-family:inherit; padding:4px; }

.bcal-veil { display:none; }

@media (max-width:700px) {
	.bcal-veil { display:block; position:fixed; inset:0; z-index:99998;
		background:rgba(36,31,26,.45); }
	.bcal-veil[hidden] { display:none; }
	body.bcal-locked { overflow:hidden; }

	/* A sheet from the bottom, not a shrunken desktop panel. Positioned by CSS
	   only — the JS skips placement below this width. */
	.bcal-panel, .bcal-panel.bcal-float, .bcal-attached .bcal-panel {
		position:fixed !important;
		left:0 !important; right:0 !important; bottom:0 !important; top:auto !important;
		width:100% !important; max-width:none !important; min-width:0 !important;
		border-radius:18px 18px 0 0; border-left:0; border-right:0; border-bottom:0;
		padding:14px 14px calc(14px + env(safe-area-inset-bottom));
		max-height:82vh; overflow-y:auto; -webkit-overflow-scrolling:touch;
		box-shadow:0 -12px 40px -10px rgba(0,0,0,.3);
	}

	/* A grab handle, so it reads as a sheet a guest can dismiss. */
	.bcal-panel::before {
		content:""; display:block; width:36px; height:4px; border-radius:2px;
		background:#DCD7CC; margin:0 auto 10px;
	}

	.bcal-months { gap:0; display:block; }
	.bcal-m { min-width:0; max-width:none; width:100%; padding:0; }
	/* Stacked here, so the vertical rule makes no sense. */
	.bcal-m + .bcal-m { border-left:0; padding-left:0; border-top:1px solid var(--bc-line);
		padding-top:18px; margin-top:18px; }
	.bcal-m-h { font-size:15px; margin-bottom:10px; }

	/* Bigger targets: a 44px minimum is the smallest comfortable tap. */
	.bcal-d { max-height:none; aspect-ratio:1/.95; min-height:46px; border-radius:10px; }
	.bcal-n { font-size:15px; }
	.bcal-f { font-size:10px; }
	.bcal-dow span { font-size:11px; }
	.bcal-g, .bcal-dow { gap:4px; }

	.bcal-nav button { font-size:26px; padding:6px 16px; }
	.bcal-pop { min-height:0; }
	.bcal-pop-l { gap:3px 12px; }
	.bcal-foot { padding-bottom:2px; }
	.bcal-clear { font-size:14px; padding:8px 4px; }
}