/* ============================================================================
   UV-DTF Contact widget — floating dialog button (bottom-left).
   Expands into Telegram / Viber / WhatsApp / Phone links.
   Self-contained, no theme conflicts. Counterpart of chat FAB (bottom-right).
   ============================================================================ */

.uvdtf-contacts {
	position: fixed;
	left: 20px;
	/* --uvdtf-bottom-offset: висота нижньої мобільної панелі XStore/.uvmbar,
	   виставляється з contacts.js. На десктопі = 0px.
	   --uvdtf-sticky-h: висота липкої планки ціни калькулятора (calc.js) —
	   щоб чипи стояли НАД планкою, а не під нею. */
	bottom: calc(20px + var(--uvdtf-bottom-offset, 0px) + var(--uvdtf-sticky-h, 0px));
	z-index: 2147483644; /* just under chat FAB so chat panel always wins */
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	/* Контейнер тягнеться вгору під СХОВАНИЙ список і перехоплював кліки
	   по меню кабінету під ним. Клікабельні лише самі елементи (нижче). */
	pointer-events: none;
}
.uvdtf-contacts__fab { pointer-events: auto; }

/* === Main FAB === */
.uvdtf-contacts__fab {
	width: 56px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
	color: #fff;
	border: 0;
	border-radius: 50%;
	box-shadow: 0 6px 20px rgba(124, 58, 237, 0.4), 0 2px 6px rgba(0, 0, 0, 0.15);
	cursor: pointer;
	position: relative;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.uvdtf-contacts__fab:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(124, 58, 237, 0.5), 0 4px 8px rgba(0, 0, 0, 0.2);
}
.uvdtf-contacts__fab svg {
	width: 26px;
	height: 26px;
	transition: opacity 0.18s ease, transform 0.18s ease;
	position: absolute;
}
.uvdtf-contacts__fab .uvdtf-contacts__icon-close {
	opacity: 0;
	transform: rotate(-90deg) scale(0.5);
}
.uvdtf-contacts.is-open .uvdtf-contacts__icon-close {
	opacity: 1;
	transform: rotate(0) scale(1);
}
.uvdtf-contacts.is-open .uvdtf-contacts__icon-dialog {
	opacity: 0;
	transform: rotate(90deg) scale(0.5);
}

/* Gentle attention pulse (stops once opened at least once) */
@keyframes uvdtfContactsPulse {
	0%   { box-shadow: 0 6px 20px rgba(124, 58, 237, 0.4), 0 0 0 0 rgba(124, 58, 237, 0.45); }
	70%  { box-shadow: 0 6px 20px rgba(124, 58, 237, 0.4), 0 0 0 14px rgba(124, 58, 237, 0); }
	100% { box-shadow: 0 6px 20px rgba(124, 58, 237, 0.4), 0 0 0 0 rgba(124, 58, 237, 0); }
}
.uvdtf-contacts:not(.is-open):not(.was-opened) .uvdtf-contacts__fab {
	animation: uvdtfContactsPulse 2.6s ease-out infinite;
}
@media (prefers-reduced-motion: reduce) {
	.uvdtf-contacts__fab { animation: none !important; }
}

/* === Channel list === */
.uvdtf-contacts__list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.uvdtf-contacts__item {
	display: flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	opacity: 0;
	transform: translateY(12px) scale(0.85);
	pointer-events: none;
	transition: opacity 0.22s ease, transform 0.22s ease;
}
.uvdtf-contacts.is-open .uvdtf-contacts__item {
	opacity: 1;
	transform: translateY(0) scale(1);
	pointer-events: auto;
}
/* Staggered appearance, bottom-up */
.uvdtf-contacts.is-open .uvdtf-contacts__item:nth-child(4) { transition-delay: 0s; }
.uvdtf-contacts.is-open .uvdtf-contacts__item:nth-child(3) { transition-delay: 0.05s; }
.uvdtf-contacts.is-open .uvdtf-contacts__item:nth-child(2) { transition-delay: 0.1s; }
.uvdtf-contacts.is-open .uvdtf-contacts__item:nth-child(1) { transition-delay: 0.15s; }

.uvdtf-contacts__bubble {
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: #fff;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22);
	transition: transform 0.15s ease;
}
.uvdtf-contacts__item:hover .uvdtf-contacts__bubble {
	transform: scale(1.1);
}
.uvdtf-contacts__bubble svg {
	width: 24px;
	height: 24px;
}
.uvdtf-contacts__item--telegram .uvdtf-contacts__bubble { background: #229ed9; }
.uvdtf-contacts__item--viber    .uvdtf-contacts__bubble { background: #7360f2; }
.uvdtf-contacts__item--whatsapp .uvdtf-contacts__bubble { background: #25d366; }
.uvdtf-contacts__item--phone    .uvdtf-contacts__bubble { background: linear-gradient(135deg, #f59e0b, #fb923c); }

.uvdtf-contacts__label {
	background: #fff;
	color: #0f172a;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	padding: 8px 12px;
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.15);
	white-space: nowrap;
}

@media (max-width: 600px) {
	.uvdtf-contacts { left: 14px; bottom: calc(12px + var(--uvdtf-bottom-offset, 0px) + var(--uvdtf-sticky-h, 0px)); }
	.uvdtf-contacts__fab { width: 52px; height: 52px; }
}

/* Бургер-панель теми (.et-mini-content → скролер .et-content): наша нижня
   панель .uvmbar накривала останні кнопки меню — резервуємо під неї місце
   тією ж змінною, що й увесь нижній стек (прохання власника, скрін 17:40). */
@media (max-width: 1023px) {
	.et-mini-content .et-content { padding-bottom: calc(24px + var(--uvdtf-bottom-offset, 0px)) !important; }
}