
/* Status Page */

.supportServiceGroupHeading {
	font-size: var(--font-size-md);
	padding: 10px 0;
	vertical-align: top;
	width: 145px;
}

.supportServiceGroup {
	align-items: flex-start;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding: 0 0 10px;
}

.supportServiceStatusBox {
	align-items: center;
	background-color: rgba(0,0,0,0.04);
	border-radius: 21.5px;
	box-sizing: border-box;
	display: flex;
	min-width: 243px;
	padding: 10px 20px 10px 10px;
	text-align: left;
}

.supportServiceStatusBox .supportServiceStatusCircle {
	background-color: rgba(0,0,0,0.07);
	border-radius: 50%;
	border: 1px solid rgba(0,0,0,0.2);
	box-shadow: 0px 1px 1px white, inset 0 0 0 2px white;
	display: inline-block;
	height: 20px;
	width: 20px;
 	flex: none;
}

.supportServiceStatusBox span {
	display: inline-block;
	font-size: var(--font-size-md);
	line-height: 1.3em;
	margin-left: 15px;
}

.supportServiceStatusBox.serviceStatusGreen {
    background-color: #DCFBEE;
}

.supportServiceStatusBox.serviceStatusGreen .supportServiceStatusCircle {
	background-color: #11A96A;
	border-color: #11A96A;
}

.supportServiceStatusBox.serviceStatusAmber {
    background-color: #FCEDDE;
}

.supportServiceStatusBox.serviceStatusAmber .supportServiceStatusCircle {
	background-color: #D35B00;
	border-color: #D35B00;
}

.supportServiceStatusBox.serviceStatusRed {
    background-color: #FDE7E7;
}

.supportServiceStatusBox.serviceStatusRed .supportServiceStatusCircle {
	background-color: #C92100;
	border-color: #C92100;
}

.supportServiceGroupMessage {
	font-size: var(--font-size-sm);
}
