/*
 * BE Mobile Buy Bar — ported from reference site.css base `.mbar` (fixed to the bottom,
 * z-index 56 so it covers the tab bar's 55, shown with `.show` at 760px and below) and the
 * inline styles of build.py (`.muted` 12.5px line, button 46px high with 22px side padding).
 * Style controls write the --be-mb-* properties.
 */

.elementor-widget-be-mobile-buy-bar {
	--be-mb-bg: #fff;
	--be-mb-btn-h: 46px;
	--be-mb-btn-hover-color: #fff;
	--be-mb-tabbar: 63px;
}

.elementor-widget-be-mobile-buy-bar .mbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 56;
	background: var(--be-mb-bg);
	border-top: 1px solid var(--be-mb-line, var(--line));
	padding: 10px var(--gr, 18px) calc(10px + env(safe-area-inset-bottom, 0px)) var(--gl, 18px);
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	line-height: 1.7;
}

.elementor-widget-be-mobile-buy-bar.be-mb-tab-above .mbar { bottom: var(--be-mb-tabbar); padding-bottom: 10px; }

@media (max-width: 560px) { .elementor-widget-be-mobile-buy-bar.be-mb-bp-560 .mbar.show { display: flex; } }
@media (max-width: 760px) { .elementor-widget-be-mobile-buy-bar.be-mb-bp-760 .mbar.show { display: flex; } }
@media (max-width: 900px) { .elementor-widget-be-mobile-buy-bar.be-mb-bp-900 .mbar.show { display: flex; } }
@media (max-width: 1024px) { .elementor-widget-be-mobile-buy-bar.be-mb-bp-1024 .mbar.show { display: flex; } }

.elementor-widget-be-mobile-buy-bar .be-mb-text { min-width: 0; font-size: 15px; }

.elementor-widget-be-mobile-buy-bar .mbar b {
	color: var(--be-mb-name, var(--text));
	font-size: 15px;
	font-weight: 700;
}

.elementor-widget-be-mobile-buy-bar .be-mb-line {
	color: var(--be-mb-line-color, var(--muted));
	font-size: 12.5px;
}

.be-site.be-site .elementor-widget-be-mobile-buy-bar .mbar .btn {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: var(--be-mb-btn-h);
	margin: 0;
	padding: 0 22px;
	background: var(--be-mb-btn-bg, var(--ink2));
	color: var(--be-mb-btn-color, var(--bone));
	border: 1.5px solid var(--be-mb-btn-bg, var(--ink2));
	border-radius: 0;
	font-family: var(--f);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.7;
	letter-spacing: .18em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}

.be-site.be-site .elementor-widget-be-mobile-buy-bar .mbar .btn:hover {
	background: var(--be-mb-btn-hover-bg, var(--amber));
	border-color: var(--be-mb-btn-hover-bg, var(--amber));
	color: var(--be-mb-btn-hover-color);
}

.be-site.be-site .elementor-widget-be-mobile-buy-bar .mbar .btn:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }
.be-site.be-site .elementor-widget-be-mobile-buy-bar .mbar .btn[disabled] { opacity: .4; cursor: not-allowed; }
.be-site.be-site .elementor-widget-be-mobile-buy-bar .mbar .btn[aria-busy="true"] { opacity: .7; cursor: progress; }

/* Editor: show the bar in place so it can be selected and edited. */
.elementor-editor-active .elementor-widget-be-mobile-buy-bar .mbar {
	position: relative;
	bottom: auto;
	z-index: auto;
	display: flex;
}

.elementor-widget-be-mobile-buy-bar .be-mb-empty { margin: 0; padding: 16px; background: var(--tile); color: var(--muted); }

@media (prefers-reduced-motion: reduce) {
	.be-site.be-site .elementor-widget-be-mobile-buy-bar .mbar .btn { transition: none; }
}
