/* Language Selector ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap');

.language_selector
{
	position: relative;
	display: inline-block;
	margin-right: 1em;
	float: right;
}

.language_toggle
{
	display: flex;
	align-items: center;
	gap: 0.5em;
	padding: 0.5em 1em;
	background: var(--form_bg_color);
	color: var(--main_color);
	border: 1px solid var(--border-color);
	border-radius: var(--border-radius);
	cursor: pointer;
	transition: all 0.3s ease;
	font-size: 1em;
}

.language_toggle:hover
{
	background: var(--main-color);
	color: white;
	border-color: var(--main-color);
}

.current_lang_flag
{
	font-size: 1.2em;
	font-family: 'Noto Color Emoji', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}

.current_lang_code
{
	font-weight: bold;
	text-transform: uppercase;
}

.language_dropdown
{
	position: absolute;
	top: calc(100% + 0em);
	right: 0;
	background: var(--form_bg_color);
	border: 1px solid var(--border-color);
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
	display: none;
	min-width: 200px;
	z-index: 1000;
	overflow: hidden;
}

.language_selector:hover .language_dropdown,
.language_toggle:focus + .language_dropdown
{
	display: block;
}

.language_option
{
	/* display: flex; */
	align-items: center;
	gap: 0.75em;
	padding: 0.75em 1em;
	text-decoration: none;
	color: var(--text-color);
	transition: background 0.2s ease;
	border-bottom: 1px solid var(--border-color);
	/* display: block !important; */
	width: 100%;
	display: inline-block !important;
	width: auto;
	border-radius: var(--border-radius);
}

.language_option:last-child
{
	border-bottom: none;
}

.language_option:hover
{
	background: var(--main-color);
	color: white;
	border-color: var(--main-color);
}

.language_option.active,.language_option:hover
{
	background: var(--main-color-light);
	font-weight: bold;
	/* background-color: var(--main-color); */
	color: white;
	filter: saturate(1);
	opacity: 1;
	transform: scale(1.2);
}

.language_option {
    filter: saturate(0);
    opacity: 0.5;
    transition: var(--transition_fast);
}

.lang_flag
{
	font-size: 1.5em;
	font-family: 'Noto Color Emoji', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
	vertical-align: middle;
}

.lang_name
{
	flex: 1;
	/* display: none; */
	font-size: 0;
	/* transition: var(--transition_medium); */
}

.language_option:hover span.lang_name {
    display: inline-block;
    /* font-size: unset; */
}

/* Responsive Styles */
@media screen and (max-width: 1000px)
{
	/* Wrapper adjustments for mobile menu integration */
	.top_menu .language_selector
	{
		margin: 1em auto;
		display: block;
		width: 80%;
		position: static;
		float: none;
	}

	.top_menu .language_toggle
	{
		justify-content: center;
		padding: 0.6em; /* Slightly reduced padding */
	}

	/* Bottom Sheet Transformation */
	.top_menu .language_dropdown
	{
		position: fixed;
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		max-width: 100%;
		max-height: 60vh;
		border-radius: 1.5em 1.5em 0 0;
		border: none;
		border-top: 2px solid var(--main-color);
		box-shadow: 0 -10px 40px rgba(0,0,0,0.8);
		padding: 0.5em 0 1.5em 0; /* Reduced top padding, safe area bottom */
		display: none;
		transform: translateY(100%);
		animation: none;
		overflow-y: auto;
		background: var(--form_bg_color);
		z-index: 10001;
		padding-bottom: max(1em, env(safe-area-inset-bottom));
	}

	.top_menu .language_selector:hover .language_dropdown,
	.top_menu .language_toggle:focus + .language_dropdown,
	.top_menu .language_dropdown:hover,
	.top_menu .language_selector:focus-within .language_dropdown
	{
		display: block;
		transform: translateY(0);
		animation: slideUp 0.25s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
	}

	.top_menu .language_option
	{
		padding: 0.8em 1em; /* Reduced padding as requested */
		font-size: 1.1em;
		justify-content: flex-start; /* Align left for better list reading */
		padding-left: 20%; /* Center visual weight */
		border-bottom: 1px solid rgba(255,255,255,0.05);
	}

	/* Active State Style */
	.top_menu .language_option.active
	{
		background-color: var(--main-color);
		color: white;
		font-weight: bold;
		border-left: 5px solid white; /* Visual indicator */
	}
	
	.top_menu .lang_name {
		display: inline-block;
		font-size: 1rem;
		vertical-align: middle;
	}

	@keyframes slideUp {
		from { transform: translateY(100%); opacity: 0; }
		to { transform: translateY(0); opacity: 1; }
	}
}