/* "Find displays near me" bar (footer.php, js/tlt-near-me-bar.js): phones only, both sites.
   It wears each site's own design: Tacky Light Tour's --tlt-* tokens (css/tlt-redesign.css: warm off-white, brick red,
   deep green, 10px corners on large buttons, the "lit tonight" notice) and Big Red Bulb's (css/brb-redesign.css:
   white, cool grays, --red-600, --ok-600, the .brb-attention warning box, Public Sans). Only one set is loaded on
   each site, so each value reads the TLT token, then the BRB one. */
/* ds-allow-hardcode: the last fallback in each var() and the notice colours are copied from the sites' own CSS
   (.lit-banner, .brb-attention); there is no token for them to read. */
.nmb {
	--nmb-red: var(--tlt-red, var(--red-600, #b3121b));
	--nmb-red-hover: var(--tlt-red-hover, var(--red-700, #960f17));
	--nmb-green: var(--tlt-green, var(--ok-600, #17643a));
	--nmb-green-hover: var(--tlt-ink, var(--ok-800, #05603a));
	--nmb-ink: var(--tlt-ink, var(--ink-900, #1d1b18));
	--nmb-muted: var(--tlt-text-2, var(--ink-600, #5f5a52));
	--nmb-line: var(--tlt-border-2, var(--ink-300, #d9d3c8));
	--nmb-page: var(--tlt-bg, #fff);
	--nmb-radius: var(--r-lg, 10px); /* TLT .tlt-btn--lg; BRB --r-lg */
	--nmb-shadow: var(--shadow-sticky, 0 -4px 16px rgba(29, 27, 24, .07));
	font-family: inherit;
}
/* The notice: Big Red Bulb's .brb-attention where its --warn-* tokens exist, else Tacky Light Tour's .lit-banner. */
.nmb { --nmb-note-bg: var(--warn-50, #fff4d6); --nmb-note-ink: var(--ink-900, #3d2c00); --nmb-note-line: var(--warn-200, transparent); }

.nmb[hidden], .nmb [hidden] { display: none !important; }
/* Read aloud, not shown (its own rule: the page may not load WordPress's screen-reader-text). */
.nmb__sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Phones only: on wider screens the page's own search and the nearby page do this. */
@media (min-width: 768px) { .nmb { display: none !important; } }

@media (max-width: 767px) {
	/* Room at the bottom of the page so the last card is never under the bar (height set by the script). */
	body { padding-bottom: calc(var(--nmb-h, 0px) + 8px); }
	/* Pages with the pill-shaped bottom navbar (mb_func__page_navigation_mobile): it sits just above the bar.
	   :not(#nmb) matches the specificity of the old rule in the compiled bundle (bottom: 70px), and this file loads
	   after it, so this one wins. */
	.fixed-bottom.d-lg-none:not(#nmb) { bottom: calc(var(--nmb-h, 0px) + 8px) !important; }

	.nmb__bar {
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom)) 16px;
		background: var(--nmb-page); /* the page's own background, see-through where the browser can */
		background: color-mix(in srgb, var(--nmb-page) 92%, transparent);
		-webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px);
		border-top: 1px solid var(--nmb-line);
		box-shadow: var(--nmb-shadow);
		color: var(--nmb-ink);
		font-size: 15px; line-height: 1.35;
	}
	.nmb__x {
		position: absolute; top: 4px; right: 4px;
		width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center;
		background: none; border: 0; border-radius: 50%; color: var(--nmb-muted); font-size: 16px;
	}
	.nmb__state { padding-right: 40px; } /* clear of the X */
	.nmb__state[data-state="idle"], .nmb__state[data-state="locating"] { padding-right: 44px; }

	.nmb__primary {
		width: 100%; min-height: 48px; border: 0; border-radius: var(--nmb-radius);
		display: inline-flex; align-items: center; justify-content: center; gap: 8px;
		background: var(--nmb-red); color: #fff; font: inherit; font-weight: 700; font-size: 16px;
		transition: background-color .15s;
	}
	.nmb__primary:hover { background: var(--nmb-red-hover); }
	.nmb__primary:disabled { opacity: .85; }
	.nmb__muted { margin: 6px 0 0; color: var(--nmb-muted); font-size: 12.5px; text-align: center; }

	.nmb__eyebrow { margin: 0; color: var(--nmb-green); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } /* the sites' eyebrow, a size down */
	.nmb__name { display: block; color: var(--nmb-ink); font-weight: 700; font-size: 16.5px; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.nmb__meta { margin: 0 0 8px; color: var(--nmb-muted); font-size: 13.5px; }
	.nmb__row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
	.nmb__go {
		min-height: 48px; padding: 0 22px; border-radius: var(--nmb-radius);
		display: inline-flex; align-items: center; gap: 8px;
		background: var(--nmb-green); color: #fff; font-weight: 700; text-decoration: none;
		transition: background-color .15s;
	}
	.nmb__go:hover, .nmb__go:focus { background: var(--nmb-green-hover); color: #fff; }
	.nmb__link {
		min-height: 44px; padding: 0; background: none; border: 0;
		color: var(--nmb-red); font: inherit; font-weight: 700; text-decoration: none;
	}
	.nmb__link:disabled { text-decoration: none; color: var(--nmb-muted); }
	.nmb__note .nmb__link { min-height: 0; display: inline; color: inherit; text-decoration: underline; text-underline-offset: 3px; } /* links in a sentence: underlined, like the site's */

	.nmb__note {
		margin: 0 0 8px; padding: 10px 14px; border: 1px solid var(--nmb-note-line); border-radius: var(--nmb-radius);
		background: var(--nmb-note-bg); color: var(--nmb-note-ink); font-size: 14.5px; line-height: 1.55;
	}
	.nmb__zip { display: flex; gap: 8px; padding-right: 40px; }
	.nmb__zip input {
		flex: 1; min-width: 0; min-height: 48px; padding: 0 14px;
		border: 1px solid var(--nmb-line); border-radius: var(--nmb-radius); background: #fff; color: var(--nmb-ink); font-family: inherit;
		font-size: 16px; /* 16px: iOS does not zoom the page on focus */
	}
	.nmb__search { min-height: 48px; padding: 0 20px; border: 0; border-radius: var(--nmb-radius); background: var(--nmb-red); color: #fff; font: inherit; font-weight: 700; }
	.nmb__search:hover { background: var(--nmb-red-hover); }

	.nmb__pill {
		position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 1030;
		min-height: 44px; padding: 0 16px; border: 0; border-radius: 999px;
		display: inline-flex; align-items: center; gap: 6px;
		background: var(--nmb-red); color: #fff; font: inherit; font-weight: 700; box-shadow: 0 2px 8px rgba(16, 24, 40, .18); /* BRB --shadow-float */
	}

	.nmb__spin {
		width: 18px; height: 18px; border-radius: 50%;
		border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff;
		animation: nmb-spin .8s linear infinite;
	}
	@keyframes nmb-spin { to { transform: rotate(360deg); } }

	.nmb__sheet {
		width: min(92vw, 420px); max-height: 80vh; padding: 20px; border: 0; border-radius: 16px;
		background: #fff; color: var(--nmb-ink); font-family: inherit;
	}
	.nmb__sheet::backdrop { background: rgba(0, 0, 0, .45); }
	.nmb__sheet h2 { font-size: 18px; margin: 0 0 12px; }
	.nmb__sheet details { border-top: 1px solid var(--nmb-line); padding: 6px 0; }
	.nmb__sheet summary { min-height: 44px; display: flex; align-items: center; font-weight: 700; cursor: pointer; }
	.nmb__sheet ol { margin: 0 0 8px; padding-left: 20px; font-size: 14.5px; }
	.nmb__sheet li { margin: 0 0 6px; }
	.nmb__sheet .nmb__muted { text-align: left; margin: 10px 0 14px; }

	.nmb button:focus-visible, .nmb a:focus-visible, .nmb input:focus-visible, .nmb summary:focus-visible { outline: 3px solid var(--nmb-ink); outline-offset: 2px; }
}

@media (prefers-reduced-motion: reduce) {
	.nmb__spin { animation-duration: 2.4s; }
}