/**
 * Version banner
 *
 * Style for the version banner only visible in the CMS
 * -----------------------------------------------------------------------------
 */

.version-banner {
	background-color: $black;
	color: $white;
	padding: em(15px) em(110px) em(15px) em(30px);
	min-height: 70px;
	display: flex;
	justify-content: space-between;

	.version-title {
		display: inline-block;

		p {
			display: flex;
			align-items: flex-end;
			font-weight: bold;

			.icon {
				margin-right: em(5px);
				font-weight: bold;
				font-size: em(35px) !important;
			}
		}
	}

	.version-dropdown {
		display: inline-block;
		position: relative;
		margin-top: em(5px);

		> a {
			color: $white;

			&:after {
				@include huddingeIcons();
				content: " \f107";
			}

			&:hover {
				text-decoration: none;
			}
		}

		&:hover {
			ul {
				display: block;
			}
		}

		ul {
			position: absolute;
			top: 15px;
			right: 0;
			display: none;
			min-width: 150px;
			list-style: none;
			background-color: $white;
			border: 1px solid $grey-light;
			z-index: 99;
			padding: em(5px);

			li {
				padding: em(2px) em(10px);
				font-size: em(16px);
			}
		}
	}
}