.lang-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 9px 14px;
	margin-bottom: 10px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(255, 255, 255, 0.04);
	color: #aaa;
	font-family: inherit;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.lang-toggle:hover {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.2);
	color: #fff;
}

.lang-toggle-code {
	opacity: 0.45;
	transition: opacity 0.2s ease, color 0.2s ease;
}

.lang-toggle-code.is-active {
	opacity: 1;
	color: #fff;
}

.lang-toggle--inline {
	width: auto;
	margin-bottom: 0;
	padding: 8px 12px;
}

.lang-toggle--corner {
	position: fixed;
	top: 16px;
	right: 16px;
	z-index: 1000;
	width: auto;
	margin: 0;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
}

/* Light backgrounds (login, home) */
.lang-toggle--light {
	border-color: rgba(0, 0, 0, 0.14);
	background: rgba(255, 255, 255, 0.92);
	color: #666;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
}

.lang-toggle--light:hover {
	background: #fff;
	border-color: rgba(0, 0, 0, 0.22);
	color: #1a1a1a;
}

.lang-toggle--light .lang-toggle-code.is-active {
	color: #1a1a1a;
}

.lang-toggle--tip {
	background: rgba(0, 0, 0, 0.8);
	border-color: rgba(255, 255, 255, 0.14);
	color: #ccc;
}

.lang-toggle--tip:hover {
	background: rgba(0, 0, 0, 0.92);
	color: #fff;
}

.lang-toggle--tip .lang-toggle-code.is-active {
	color: #fff;
}

/* Tip page: scroll with content on mobile instead of fixed */
.lang-toggle--corner.lang-toggle--scroll-mobile {
	position: fixed;
}

@media (max-width: 768px) {
	body.tip-page,
	body.legal-page {
		position: relative;
	}

	body.tip-page .lang-toggle--scroll-mobile,
	body.legal-page .lang-toggle--corner {
		position: absolute;
		top: max(12px, env(safe-area-inset-top));
		right: max(12px, env(safe-area-inset-right));
	}
}

.mobile-nav-footer .lang-toggle,
.mobile-nav .lang-toggle--mobile {
	position: static;
	width: 100%;
	margin-bottom: 12px;
}

.nav-right .lang-toggle {
	width: auto;
	margin-bottom: 0;
	flex-shrink: 0;
}

.mobile-nav .lang-toggle--mobile-fixed {
	position: fixed;
	bottom: 84px;
	left: 20px;
	right: 20px;
	width: auto;
	max-width: 400px;
	margin: 0 auto;
	z-index: 1002;
}