.gs-connection-status {
	display: flex;
	align-items: center;
	height: 18px;
	font-size: 12px;
	transition: opacity 0.3s;

	&__indicator {
		display: block;
		width: 10px;
		height: 10px;
		border-radius: 50%;
		margin-right: 8px;
		background-color: #adb5bc;
		transition: background-color 0.3s;
	}

	&.is-ok {
		.gs-connection-status__indicator {
			background-color: #19a871;
		}
	}

	&.is-error {
		.gs-connection-status__indicator {
			background-color: #c44a4c;
		}
	}

	&.is-loading {
		opacity: 0.5;
	}
}
