/*
 * Citizen - Translate Styles
 * https://starcitizen.tools
*/

@import '../resources/variables.less';
@import '../resources/mixins.less';

.mw-pt-languages {
	display: block;
	border: 0;
	width: auto;
	background: 0;
	margin: 0;
	padding: @margin-side 0;
}

.mw-pt-languages-label {
	display: block;
	border: 0;
	padding: 0;
	color: @base-30;
	background: 0;
	font-size: 0.8125rem;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 1px;
	width: auto;
}

.mw-pt-languages-list {
	padding: @content-margin-top 0 0 0;
	display: flex;
	flex-wrap: wrap;
	width: auto;
	visibility: hidden; // Hide dots

	> * {
		visibility: visible;
	}
}

.mw-pt-languages-selected,
.mw-pt-languages-ui {
	font-weight: normal;
	.boxshadow(2) !important;

	&:hover {
		transform: none !important;
	}
}

.mw-pt-progress {
	margin: 0 0 @margin-side / 2 0;
	padding: @margin-side / 4 @margin-side / 2;
	display: block;
	border: 1px solid @base-90;
	background: @base-90;
	color: @base-30;
	font-size: @content-caption-size;
	.boxshadow(1);
	transition: @transition-transform-quick, @transition-box-shadow-quick;

	&:hover {
		.boxshadow(2);
		transform: translateY( -2px );
	}
}

.mw-pt-progress--stub {
	background: @base-90;
}

.mw-pt-progress--low {
	background: @red-50;
	border-color: @red-50;
	color: @base-100 !important; // bypass visited styles
}

.mw-pt-progress--med {
	background: @yellow-50;
	border-color: @yellow-50;
	color: @base-100 !important; // bypass visited styles
}

.mw-pt-progress--high {
	background: @green-50;
	border-color: @green-50;
	color: @base-100 !important; // bypass visited styles
}

.mw-pt-progress--complete {
	background: @green-30;
	border-color: @green-30;
	color: @base-100 !important; // bypass visited styles
}