/* Yandex ID — styled like Frappe login social buttons (btn-login-option) */
.ya-login-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--padding-xs, 6px);
	width: 100%;
	margin: 0;
	padding: var(--padding-xs, 6px) var(--padding-sm, 10px);
	border: none;
	border-radius: var(--border-radius, 8px);
	background: var(--gray-100, #f3f3f3);
	color: var(--text-gray-700, #505a62);
	font-size: var(--text-base, 14px);
	font-weight: 500;
	line-height: 1.25;
	text-decoration: none;
	box-shadow: none;
	box-sizing: border-box;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.ya-login-button:hover,
.ya-login-button:focus,
.ya-login-button:focus-visible {
	background: var(--gray-300, #e2e2e2);
	border: none;
	color: var(--text-gray-700, #505a62);
	text-decoration: none;
	outline: none;
	box-shadow: none;
}

.ya-login-button:active {
	background: var(--gray-400, #ced4da);
}

.ya-login-button__logo {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	display: block;
	border-radius: 50%;
	clip-path: circle(50%);
	object-fit: cover;
}

.ya-login-button__text {
	flex: 0 1 auto;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}