.JDbadge {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: $badge-padding;
	line-height: 1;
	text-transform: uppercase;
	text-align: center;
	font-size: $typho-small;
	white-space: nowrap;
	vertical-align: text-top;
	border-radius: $badge-br;
	width: max-content;
	letter-spacing: -1px;
	-moz-user-select: none;
	-webkit-user-select: none;


	&--border {
		background-color: white;
		border: 1px solid;
		padding: 0 1em !important;
	}

	&--small#{&}--round {
		padding: 0px !important;
		width: $icon-size-tiny;
		height: $icon-size-tiny;
	}

	&--round {
		padding: 0 !important;
		border-radius: 50%;
		width: $icon-size-small;
		height: $icon-size-small;
	}

	&--fold {
		overflow: hidden;
		border-radius: 0px;

		&:before {
			content: "";
			position: absolute;
			bottom: -.6em;
			right: 0;
			border-width: .8em .8em 0 0;
			border-style: solid;
			border-color: white;
			transform: rotate(45deg);
			transform-origin: right bottom;
		}
	}

	&--large {
		font-size: $typho-normal;
	}

	&--small {
		font-size: $typho-tiny;
	}

	&--tiny {
		font-size: $typho-superTiny;
	}

	&--hover {
		cursor: pointer;
	}
}