.bffpm-menu,
.bffpm-menu * {
	box-sizing: border-box;
}

.bffpm-menu {
	position: fixed;
	top: var(--bffpm-top, 50%);
	z-index: var(--bffpm-z-index, 9997);
	width: calc(max(var(--bffpm-dot-size, 9px), var(--bffpm-active-dot-size, 12px)) + (var(--bffpm-padding, 14px) * 2));
	max-width: calc(100vw - 16px);
	font-family: var(--bffpm-font-family, "ABeeZee", Arial, sans-serif);
	font-size: var(--bffpm-font-size-desktop, 14px);
	font-weight: var(--bffpm-font-weight, 600);
	transform: translateY(-50%);
	transition: width 220ms ease, filter 220ms ease;
}

.bffpm-side-left {
	left: var(--bffpm-side-offset-desktop, 18px);
}

.bffpm-side-right {
	right: var(--bffpm-side-offset-desktop, 18px);
}

.bffpm-inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--bffpm-gap, 14px);
	width: 100%;
	padding: var(--bffpm-padding, 14px);
	overflow: hidden;
	border-radius: var(--bffpm-radius, 18px);
	background: rgba(var(--bffpm-bg-rgb, 244,244,240), 0);
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0);
	transition: background 220ms ease, box-shadow 220ms ease;
}

.bffpm-menu:hover,
.bffpm-menu:focus-within,
.bffpm-menu.is-open {
	width: var(--bffpm-expanded-width, 220px);
}

.bffpm-menu:hover .bffpm-inner,
.bffpm-menu:focus-within .bffpm-inner,
.bffpm-menu.is-open .bffpm-inner {
	background: rgba(var(--bffpm-bg-rgb, 244,244,240), var(--bffpm-bg-opacity, 0.92));
	box-shadow: 0 18px 44px rgba(0, 0, 0, var(--bffpm-shadow-opacity, 0.16));
}

.bffpm-item {
	appearance: none;
	border: 0;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	width: 100%;
	min-width: 0;
	padding: 0;
	background: transparent;
	color: var(--bffpm-text-color, #231f20);
	font: inherit;
	line-height: 1.2;
	text-align: left;
	text-decoration: none !important;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.bffpm-menu:not(:hover):not(:focus-within):not(.is-open) .bffpm-item {
	gap: 0;
}

.bffpm-item .bffpm-dot {
	margin-top: 0.16em;
}

.bffpm-item:hover,
.bffpm-item:focus,
.bffpm-item.is-active,
.bffpm-item[aria-current="true"] {
	color: var(--bffpm-hover-text-color, #000000);
	outline: 0;
}

.bffpm-dot {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 var(--bffpm-active-dot-size, 12px);
	width: var(--bffpm-active-dot-size, 12px);
	height: var(--bffpm-active-dot-size, 12px);
	background: transparent;
	box-shadow: none;
	transition: transform 180ms ease;
}

.bffpm-dot::before {
	display: block;
	width: var(--bffpm-dot-size, 9px);
	height: var(--bffpm-dot-size, 9px);
	border-radius: 999px;
	background: var(--bffpm-dot-color, #b1b9b2);
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
	content: "";
	transition: width 180ms ease, height 180ms ease, background 180ms ease, transform 180ms ease;
}

.bffpm-item:hover .bffpm-dot,
.bffpm-item:focus .bffpm-dot,
.bffpm-item.is-active .bffpm-dot,
.bffpm-item[aria-current="true"] .bffpm-dot {
	transform: scale(1.02);
}

.bffpm-item:hover .bffpm-dot::before,
.bffpm-item:focus .bffpm-dot::before,
.bffpm-item.is-active .bffpm-dot::before,
.bffpm-item[aria-current="true"] .bffpm-dot::before {
	width: var(--bffpm-active-dot-size, 12px);
	height: var(--bffpm-active-dot-size, 12px);
	background: var(--bffpm-active-color, #231f20);
}

.bffpm-label {
	display: block;
	min-width: 0;
	max-width: calc(var(--bffpm-expanded-width, 220px) - 56px);
	opacity: 0;
	overflow: hidden;
	white-space: normal;
	overflow-wrap: anywhere;
	transform: translateX(-7px);
	transition: opacity 180ms ease, transform 180ms ease;
}

.bffpm-menu:not(:hover):not(:focus-within):not(.is-open) .bffpm-label {
	width: 0;
	max-width: 0;
	height: 0;
	white-space: nowrap;
}

.bffpm-menu:hover .bffpm-label,
.bffpm-menu:focus-within .bffpm-label,
.bffpm-menu.is-open .bffpm-label {
	width: auto;
	height: auto;
	opacity: 1;
	transform: translateX(0);
}

.bffpm-side-right .bffpm-inner {
	align-items: flex-end;
}

.bffpm-side-right .bffpm-item {
	flex-direction: row-reverse;
	text-align: right;
}

.bffpm-style-minimal .bffpm-inner,
.bffpm-style-minimal:hover .bffpm-inner,
.bffpm-style-minimal:focus-within .bffpm-inner,
.bffpm-style-minimal.is-open .bffpm-inner {
	background: transparent;
	box-shadow: none;
}

.bffpm-style-minimal .bffpm-label {
	text-shadow: 0 1px 10px rgba(255, 255, 255, 0.72);
}

.bffpm-side-right .bffpm-label {
	transform: translateX(7px);
}

.bffpm-side-right:hover .bffpm-label,
.bffpm-side-right:focus-within .bffpm-label,
.bffpm-side-right.is-open .bffpm-label {
	transform: translateX(0);
}

@media (max-width: 1024px) {
	.bffpm-menu {
		font-size: var(--bffpm-font-size-tablet, 13px);
	}

	.bffpm-side-left {
		left: var(--bffpm-side-offset-tablet, 12px);
	}

	.bffpm-side-right {
		right: var(--bffpm-side-offset-tablet, 12px);
	}
}

@media (hover: none), (pointer: coarse) {
	.bffpm-menu.bffpm-touch-collapsed:not(.is-open) {
		width: calc(max(var(--bffpm-dot-size, 9px), var(--bffpm-active-dot-size, 12px)) + (var(--bffpm-padding, 14px) * 2));
	}

	.bffpm-menu.bffpm-touch-collapsed:not(.is-open) .bffpm-inner {
		background: rgba(var(--bffpm-bg-rgb, 244,244,240), 0);
		box-shadow: none;
	}

	.bffpm-menu.bffpm-touch-collapsed:not(.is-open) .bffpm-label {
		width: 0;
		max-width: 0;
		height: 0;
		white-space: nowrap;
		opacity: 0;
		transform: translateX(-7px);
	}

	.bffpm-side-right.bffpm-touch-collapsed:not(.is-open) .bffpm-label {
		transform: translateX(7px);
	}
}

@media (max-width: 767px) {
	.bffpm-menu {
		top: min(var(--bffpm-top, 50%), 72%);
		width: calc(max(var(--bffpm-dot-size, 9px), var(--bffpm-active-dot-size, 12px)) + (var(--bffpm-padding, 14px) * 2));
		max-width: calc(100vw - 20px);
		font-size: var(--bffpm-font-size-mobile, 12px);
	}

	.bffpm-menu:hover,
	.bffpm-menu:focus-within,
	.bffpm-menu.is-open {
		width: min(var(--bffpm-expanded-width, 220px), calc(100vw - 26px));
	}

	.bffpm-side-left {
		left: var(--bffpm-side-offset-mobile, 8px);
	}

	.bffpm-side-right {
		right: var(--bffpm-side-offset-mobile, 8px);
	}

	.bffpm-inner {
		max-height: min(72vh, 430px);
		overflow-y: auto;
		overscroll-behavior: contain;
	}

	.bffpm-label {
		max-width: calc(100vw - 78px);
		white-space: normal;
		overflow-wrap: anywhere;
	}

	.bffpm-hide-touch {
		display: none;
	}
}
