/* =========================================================================
   Red Luxe — плавающий виджет связи (Telegram / WhatsApp / MAX)
   ========================================================================= */

.rl-chat {
	position: fixed;
	right: clamp(16px, 3vw, 26px);
	bottom: clamp(16px, 3vw, 26px);
	z-index: 950;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
}

/* Кнопка чата — того же формата и размера, что и кнопка «Наверх»:
   ровный круг 52×52, без пульсирующей рамки. */
.rl-chat__fab {
	display: inline-flex; align-items: center; justify-content: center;
	width: 52px; height: 52px;
	border-radius: 50%;
	color: #fff;
	background: var(--rl-accent);
	box-shadow: var(--rl-shadow-accent);
	position: relative;
	transition: transform var(--rl-t) var(--rl-ease), background-color var(--rl-t) var(--rl-ease);
}
.rl-chat__fab:hover { transform: translateY(-4px) scale(1.05); background: var(--rl-accent-dark); }
.rl-chat__fab-ic { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; transition: opacity var(--rl-t) var(--rl-ease), transform var(--rl-t) var(--rl-ease); }
.rl-chat__fab-ic--close { opacity: 0; transform: rotate(-90deg); }
.rl-chat.is-open .rl-chat__fab-ic--chat { opacity: 0; transform: rotate(90deg); }
.rl-chat.is-open .rl-chat__fab-ic--close { opacity: 1; transform: rotate(0); }

.rl-chat__panel {
	width: 250px;
	background: var(--rl-card);
	border: 1px solid var(--rl-border);
	border-radius: var(--rl-radius-lg);
	box-shadow: var(--rl-shadow-lg);
	padding: 0.5rem;
	transform-origin: bottom right;
	opacity: 0;
	visibility: hidden;
	transform: translateY(14px) scale(0.94);
	transition: opacity var(--rl-t) var(--rl-ease-out), transform var(--rl-t) var(--rl-ease-out), visibility var(--rl-t);
}
.rl-chat.is-open .rl-chat__panel {
	opacity: 1;
	visibility: visible;
	transform: translateY(0) scale(1);
}

.rl-chat__head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 0.5rem 0.6rem 0.6rem;
	font-family: var(--rl-font-head); font-weight: 600; color: var(--rl-heading);
	border-bottom: 1px solid var(--rl-border); margin-bottom: 0.4rem;
}
.rl-chat__close {
	display: inline-flex; align-items: center; justify-content: center;
	width: 28px; height: 28px; border-radius: 50%; color: var(--rl-muted);
	transition: background-color var(--rl-t) var(--rl-ease), color var(--rl-t) var(--rl-ease);
}
.rl-chat__close:hover { background: var(--rl-surface); color: var(--rl-accent); }

.rl-chat__item {
	display: flex; align-items: center; gap: 0.7rem;
	padding: 0.7rem 0.7rem;
	border-radius: var(--rl-radius-sm);
	color: var(--rl-heading); font-weight: 500;
	transition: background-color var(--rl-t) var(--rl-ease), transform var(--rl-t) var(--rl-ease);
}
.rl-chat__item:hover { background: var(--rl-surface); transform: translateX(2px); }
.rl-chat__ic { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; color: #fff; flex-shrink: 0; }
.rl-chat__item--tg .rl-chat__ic { background: #29a9eb; }
.rl-chat__item--wa .rl-chat__ic { background: #25d366; }
.rl-chat__item--max .rl-chat__ic { background: linear-gradient(135deg, #7b5cff, #4b2fd6); }

/* Виджет чата теперь СВЕРХУ, кнопка «Наверх» — под ним внизу. */
.rl-chat { bottom: calc(clamp(16px, 3vw, 26px) + 70px); }
.rl-to-top { bottom: clamp(16px, 3vw, 30px); z-index: 960; }

@media (max-width: 520px) {
	.rl-chat { bottom: calc(clamp(16px, 3vw, 26px) + 66px); }
}

/* Иконка-картинка (MAX) — без круглой подложки, логотип целиком */
.rl-chat__ic--img { background: none !important; width: 38px; height: 38px; }
.rl-chat__ic--img img { width: 38px; height: 38px; border-radius: 50%; display: block; }