.energy-label {
	--vbp-keysoftware-energy-label-background: #279542;

	position: relative;
	display: inline-block;
	width: auto;
	min-width: 2.35rem;
	max-width: max-content;
	padding: 2px 4px;
	color: #111111 !important;
	line-height: 20px;
	text-align: center;
	background-color: var(--vbp-keysoftware-energy-label-background);
	border-color: var(--vbp-keysoftware-energy-label-background);
}

.energy-label::after {
	content: "";
	position: absolute;
	top: 0;
	left: 100%;
	border: 12px solid transparent;
	border-left-color: var(--vbp-keysoftware-energy-label-background);
}

.energy-label.label-a4,
.energy-label.label-a3 {
	--vbp-keysoftware-energy-label-background: #63aa5a;
}

.energy-label.label-a2,
.energy-label.label-a1 {
	--vbp-keysoftware-energy-label-background: #7bae4a;
}

.energy-label.label-a {
	--vbp-keysoftware-energy-label-background: #279542;
}

.energy-label.label-b {
	--vbp-keysoftware-energy-label-background: #50ab39;
}

.energy-label.label-c {
	--vbp-keysoftware-energy-label-background: #c9d023;
}

.energy-label.label-d {
	--vbp-keysoftware-energy-label-background: #faeb2b;
}

.energy-label.label-e {
	--vbp-keysoftware-energy-label-background: #f4bc25;
}

.energy-label.label-f {
	--vbp-keysoftware-energy-label-background: #e36b1f;
}

.energy-label.label-g {
	--vbp-keysoftware-energy-label-background: #da2321;

	color: #ffffff !important;
}

.vbp-keysoftware-meta.is-style-energy-label-outline .energy-label {
	padding: 0 4px;
	color: currentColor !important;
	line-height: 18px;
	background-color: transparent;
	border: 2px solid var(--vbp-keysoftware-energy-label-background);
	border-right: 0;
}

.vbp-keysoftware-meta.is-style-energy-label-outline .energy-label::before,
.vbp-keysoftware-meta.is-style-energy-label-outline .energy-label::after {
	content: "";
	position: absolute;
	left: 100%;
	width: 15.56px;
	border-color: var(--vbp-keysoftware-energy-label-background);
	border-style: solid;
}

.vbp-keysoftware-meta.is-style-energy-label-outline .energy-label::before {
	top: -2px;
	border-width: 2px 0 0;
	transform: rotate(45deg);
	transform-origin: left top;
}

.vbp-keysoftware-meta.is-style-energy-label-outline .energy-label::after {
	top: auto;
	bottom: -2px;
	border-width: 0 0 2px;
	transform: rotate(-45deg);
	transform-origin: left bottom;
}