@use "colors";
@use "flags";
$heightSelector: 37px;
$lineHeight: 36px;

#wp-admin-bar-weglot {
	> .ab-item {
		background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMDAiIGhlaWdodD0iMzAwIj48ZyBmaWxsPSIjYTBhNWFhIj48cGF0aCBkPSJNMjEuNzM5IDkyLjU2NWw1MS44MjggMTI5LjczMiAyMy42Ni02MC4yNzkgMjQuMTQ0IDYwLjI3OUwxNzMuMiA5Mi41NjVoLTI4LjAwN2wtMjMuODIyIDU4Ljc1LTIzLjkwMi01OC43NS0yMy45MDIgNTguNzUtMjMuOTAyLTU4Ljc1SDIxLjczOXoiLz48cGF0aCBkPSJNMjEwLjAwNiA5Mi43MWMtMTcuODY2IDAtMzMuMTU3IDYuMzU4LTQ1Ljg3MyAxOS4wNzQtMTIuNzE1IDEyLjcxNi0xOC45OTMgMjguMDA2LTE4Ljk5MyA0NS43OTIgMCAxNy44NjcgNi4yNzggMzMuMTU4IDE4Ljk5MyA0NS44NzMgMTIuNzE2IDEyLjcxNiAyOC4wMDcgMTguOTkzIDQ1Ljg3MyAxOC45OTMgMTcuNzg2IDAgMzMuMDc3LTYuMjc3IDQ1Ljc5My0xOC45OTMgMTIuNzE1LTEyLjcxNSAxOS4wNzMtMjguMDA2IDE5LjA3My00NS44NzMgMC00LjUwNy0uNDgzLTguODUyLTEuMjg4LTEyLjk1N2gtNjMuNTc4djI1LjkxNGgzNi42OTljLTIuNzM3IDcuNTY1LTcuNDg1IDEzLjg0My0xNC4wODQgMTguNjcxLTYuNjggNC44My0xNC4yNDUgNy4yNDQtMjIuNjE1IDcuMjQ0LTEwLjc4NCAwLTE5Ljk1OC0zLjc4My0yNy41MjMtMTEuMzQ4LTcuNTY2LTcuNTY1LTExLjM0OC0xNi43NC0xMS4zNDgtMjcuNTI0IDAtMTAuNjIzIDMuNzgyLTE5Ljc5OCAxMS4zNDgtMjcuNDQzIDcuNTY1LTcuNjQ1IDE2Ljc0LTExLjUwOCAyNy41MjMtMTEuNTA4IDEwLjYyMyAwIDE5Ljc5OCAzLjg2MyAyNy41MjQgMTEuNDI4bDE4LjM1LTE4LjM1YTY3Ljk2MyA2Ny45NjMgMCAwMC0yMC43NjQtMTMuODQyYy03Ljg4Ny0zLjM4LTE2LjI1Ny01LjE1LTI1LjExLTUuMTV6Ii8+PC9nPjwvc3ZnPg==") !important;
		background-size: 22px auto !important;
		background-repeat: no-repeat !important;
		background-position: 4px 5px !important;
		padding-left: 30px !important;
	}

}

li.weglot-hide,
.weglot-hide {
	display: none !important;
}

.country-selector {
	z-index: 9999;
	text-align: left;
	position: relative;
	display: inline-block;
	width: auto;

	a {
		padding: 0 10px;
		outline: none;
		text-decoration: none;
		float: none !important;
		white-space: nowrap;
		font-weight: normal;
		cursor: pointer;
		color: black;
		-webkit-touch-callout: none; /* iOS Safari */
		user-select: none;
		&:focus {
			outline: none;
		}
	}

	ul {
		padding: 0px;
		z-index: 1010;
		list-style: none;
		margin: 0;
	}

	li {
		margin: 0px;
		padding: 0px;
	}

	&.weglot-custom-switcher-ajax{
		display: none;
	}

	&.weglot-dropdown {
		background-color: white;

		a,
		span {
			display: block;
			height: $heightSelector;
			line-height: $lineHeight;
			font-size: 13px;
			padding: 0 10px;
			width: 100%;
			box-sizing: border-box;
			font-weight: normal;
			&:hover {
				cursor: pointer;
			}
		}

		.wgcurrent {
			border: 1px solid #e0e0e0;
			list-style: none;
			display: block;
			margin: 0;
			a,
			span {
				padding-right: 60px;
			}

			&:after {
				display: inline-block;
				position: absolute;
				top: 17px;
				right: 8px;
				width: 13px;
				height: 7px;
				image-rendering: pixelated;
				background: url("../images/wgarrowdown.png") no-repeat;
				content: "";
				transition: all 200ms;
				transform: rotate(-90deg);
			}
		}

		ul {
			position: absolute;
			min-width: 100%;
			border: 1px solid #ebeef0;
			background: white;
			left: 0;
			top: initial;
			box-sizing: border-box;
			display: none;
			padding: 0;
		}

		input:checked ~ ul {
			display: block;
		}

		input:checked ~ .wgcurrent:after {
			transform: rotate(0deg);
		}

		li {
			width: 100%;
		}

		&.weglot-invert {
			ul {
				bottom: 38px;
			}
			input:checked ~ .wgcurrent:after {
				transform: rotate(-180deg);
			}
		}
	}

	&.weglot-default {
		position: fixed;
		bottom: 0px;
		right: 40px;
	}

	&.weglot-inline {
		a {
			&:hover {
				text-decoration: underline;
				color: #00a0d2;
			}
		}

		.wgcurrent {
			a {
				text-decoration: underline;
			}
		}

		label {
			margin-bottom: 0;
			display: inline-block;
			vertical-align: middle;
		}

		ul {
			display: inline-block;
			vertical-align: middle;
		}

		li {
			line-height: 1 !important;
			display: inline-block;
			margin: 2px 0px;
			vertical-align: middle;
		}

		&.weglot-default {
			bottom: 5px;
		}
	}

	input {
		display: none !important;
	}
}

.navbar {
	.navbar-nav {
		li.weglot-flags {
			a.weglot-lang {
				&:before {
					position: static;
					transform: none;
					transition: none;
				}
			}
		}
	}
}

.js .main-navigation .country-selector ul {
	display: none;
}

html[dir="rtl"] {
	.weglot-flags a:before,
	.weglot-flags span:before {
		margin-right: 0;
		margin-left: 10px;
	}
}

.weglot-flags {
	> a,
	> span.wglanguage-name {
		&:before {
			background-image: url("../images/rect_mate.png");
			background-size: auto 20px !important;
			border-radius: 0px !important;
			width: 30px !important;
			height: 20px !important;
			content: "";
			vertical-align: middle;
			margin-right: 10px;
			display: inline-block;
			overflow: hidden;
		}
	}
	&.flag-1 {
		> a,
		> span {
			&:before {
				background-image: url("../images/rect_bright.png");
			}
		}
	}
	&.flag-2 {
		> a,
		> span {
			&:before {
				background-image: url("../images/square_flag.png");
				width: 24px !important;
				height: 24px !important;
				background-size: auto 24px !important;
			}
		}
	}
	&.flag-3 {
		a,
		span {
			&:before {
				background-image: url("../images/circular_flag.png");
				width: 24px !important;
				height: 24px !important;
				background-size: auto 24px !important;
			}
		}
	}

	> a {
		span:before {
			background-image: none !important;
			display: none !important;
		}
	}
	> span {
		a:before {
			background-image: none !important;
			display: none !important;
		}
	}
}
