/*
	Labels and badges
	========================================
*/

/* Base classes */
.label,
.badge {
	display: inline-block;
	padding: 2px 4px;
	font-size: calc(var(--base-font-size) * 0.846);
	font-weight: bold;
	line-height: 14px; /* ensure proper line-height if floated */
	color: var(--white);
	vertical-align: baseline;
	white-space: nowrap;
	text-shadow: 0 -1px 0 rgba(0,0,0,.25);
	background-color: var(--gray-light);
}

/* Set unique padding and border-radii */
.label {
	border-radius: 3px;
}

.badge {
	padding-left: 9px;
	padding-right: 9px;
	border-radius: 9px;
}

/* Empty labels/badges collapse */
.label:empty,
.badge:empty {
	display: none;
}

/* Hover/focus state, but only for links */
a.label:hover,
a.label:focus,
a.badge:hover,
a.badge:focus {
	color: var(--white);
	text-decoration: none;
	cursor: pointer;
}

/* Colors
   Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute) */

/* Important (red) */
.label-important,
.badge-important {
	background-color: var(--error-text);
}

.label-important[href],
.badge-important[href] {
	background-color: #953b39;
}

/* Warnings (orange) */
.label-warning,
.badge-warning {
	background-color: var(--orange);
}

.label-warning[href],
.badge-warning[href] {
	background-color: #c67605;
}

/* Success (green) */
.label-success,
.badge-success {
	background-color: var(--success-text);
}

.label-success[href],
.badge-success[href] {
	background-color: #356635;
}

/* Info (turquoise) */
.label-info,
.badge-info {
	background-color: var(--info-text);
}

.label-info[href],
.badge-info[href] {
	background-color: #2d6987;
}

/* Inverse (black) */
.label-inverse,
.badge-inverse {
	background-color: var(--gray-dark);
}

.label-inverse[href],
.badge-inverse[href] {
	background-color: #1a1a1a;
}

/* Quick fix for labels/badges in buttons */
.btn .label,
.btn .badge {
	position: relative;
	top: -1px;
}

.btn-mini .label,
.btn-mini .badge {
	top: 0;
}