/* Floating Mobile Buttons - frontend styles
   Buttons are hidden by default and only revealed under the mobile
   media query below, so this works reliably even with page caching. */

.fmb-wrapper {
	display: none;
}

@media (max-width: 767px) {


	.fmb-wrapper {
		display: flex;
		position: fixed !important;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999999;
		gap: 7px;
		width: 100%;
		box-sizing: border-box;
		box-shadow: none;
		background: transparent;
		padding-bottom: env(safe-area-inset-bottom, 0);
		padding: 7px;
	}

	.fmb-btn {
		flex: 1 1 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		padding: 16px 10px;
		text-decoration: none;
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
		font-weight: 600;
		line-height: 1.2;
		box-sizing: border-box;
		border: none;
		border-radius: 6px;
		-webkit-tap-highlight-color: transparent;
	}

	.fmb-btn:visited,
	.fmb-btn:hover,
	.fmb-btn:focus,
	.fmb-btn:active {
		text-decoration: none;
		opacity: 0.92;
	}

	.fmb-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 1.2em;
		height: 1.2em;
		flex-shrink: 0;
	}

	.fmb-icon svg {
		width: 100%;
		height: 100%;
		display: block;
	}

	.fmb-text {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
}