.menu-label {
	position: absolute;
	bottom: 85%;
	z-index: 1;
	display: inline-block;
	margin-inline-start: -20px;
	padding: 2px 4px;
	border-radius: calc(var(--wd-brd-radius) / 1.5);
	background-color: var(--wd-label-color);
	color: #fff;
	vertical-align: middle;
	text-transform: uppercase;
	white-space: nowrap;
	font-weight: 600;
	font-size: 9px;
	font-family: var(--wd-text-font);
	line-height: 12px;
}

.menu-label:before {
	content: "";
	position: absolute;
	top: 100%;
	inset-inline-start: 10px;
	border: 4px solid var(--wd-label-color);
	border-bottom-color: transparent !important;
	border-inline-end-color: transparent !important;
	border-inline-end-width: 7px;
	border-inline-start-width: 0;
}

.menu-label-black {
	--wd-label-color: #000;
}

.menu-label-grey {
	color: #333;
	--wd-label-color: #f1f1f1;
}

.menu-label-orange {
	--wd-label-color: #fbbc34;
}

.menu-label-blue {
	--wd-label-color: #00a1be;
}

.menu-label-white {
	color: #333;
	--wd-label-color: #fff;
}

.menu-label-primary {
	--wd-label-color: var(--wd-primary-color);
}

.menu-label-secondary {
	--wd-label-color: var(--wd-alternative-color);
}

.menu-label-red {
	--wd-label-color: #d41212;
}

.menu-label-green {
	--wd-label-color: #65b32e;
}