/* KraftMetal — соцмережі компанії ([km_social]) і кнопки Viber / Telegram */

.km-icon {
	display: block;
	width: 1em;
	height: 1em;
}

/* ---------- [km_social] ---------- */

.km-social {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.km-social__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid #e1e1e1;
	border-radius: 50%;
	background: #fff;
	color: #222529;
	font-size: 15px;
	text-decoration: none;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

/* Стабільні кольори після кліку (a:focus / a:visited теми не перебивають). */
.km-social a.km-social__link,
.km-social a.km-social__link:visited,
.km-social a.km-social__link:focus,
.km-social a.km-social__link:active {
	color: #222529;
	text-decoration: none;
}

.km-social--dark a.km-social__link,
.km-social--dark a.km-social__link:visited,
.km-social--dark a.km-social__link:focus,
.km-social--dark a.km-social__link:active {
	color: #fff;
}

.km-social a.km-social__link:hover,
.km-social a.km-social__link:focus-visible {
	border-color: var(--porto-primary-color, #d60a2e);
	background: var(--porto-primary-color, #d60a2e);
	color: #fff;
}

.km-social__link:focus-visible {
	outline: 2px solid var(--porto-primary-color, #d60a2e);
	outline-offset: 2px;
}

/* Темний футер */
.km-social--dark .km-social__link {
	border-color: rgba(255, 255, 255, .22);
	background: transparent;
	color: #fff;
}

.km-social--dark .km-social__link:hover,
.km-social--dark .km-social__link:focus-visible {
	border-color: var(--porto-primary-color, #d60a2e);
	background: var(--porto-primary-color, #d60a2e);
}

/* Картка товару: блок у рядку з кнопками, як був «Поділитися» */
.km-social-wrap .elementor-shortcode {
	display: flex;
	align-items: center;
	min-height: 36px;
}

/* ---------- Плаваючі Viber / Telegram ---------- */

.km-messengers {
	position: fixed;
	right: 16px;
	bottom: 72px;
	z-index: 9990;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.km-messengers__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	color: #fff;
	font-size: 24px;
	text-decoration: none;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
	transition: transform .2s ease, box-shadow .2s ease;
}

/* Колір іконки — білий у всіх станах: інакше після кліку тема фарбує посилання (a:focus) у червоний. */
.km-messengers a.km-messengers__btn,
.km-messengers a.km-messengers__btn:visited,
.km-messengers a.km-messengers__btn:hover,
.km-messengers a.km-messengers__btn:focus,
.km-messengers a.km-messengers__btn:active {
	color: #fff;
	text-decoration: none;
}

.km-messengers__btn:hover,
.km-messengers__btn:focus-visible {
	transform: translateY(-2px) scale(1.04);
	box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}

.km-messengers__btn:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.km-messengers__btn--viber {
	background: #7360f2;
}

.km-messengers__btn--telegram {
	background: #29a9eb;
}

.km-messengers__btn--telegram .km-icon {
	margin-left: -2px; /* оптичний центр «літачка» */
}

@media (max-width: 767px) {
	.km-messengers {
		right: 12px;
		bottom: 76px;
		gap: 8px;
	}

	.km-messengers__btn {
		width: 46px;
		height: 46px;
		font-size: 22px;
	}

	/* На сторінці товару внизу є липка панель «Додати в кошик» */
	body.single-product .km-messengers {
		bottom: 96px;
	}
}

@media print {
	.km-messengers {
		display: none;
	}
}