/* Nút Gọi & Zalo nổi trên điện thoại/máy tính bảng (landing Triton Crown). */
.tc-float-contact {
	position: fixed;
	right: 14px;
	bottom: calc(18px + env(safe-area-inset-bottom, 0px));
	z-index: 900; /* dưới header (1000), menu (2000) và các popup */
	display: none;
	flex-direction: column;
	gap: 12px;
	transition: opacity .25s ease, transform .25s ease;
}

/* Tự ẩn khi đang xem video, form đăng ký và chân trang (ở đó đã có hotline/nút riêng) */
.tc-float-contact.is-hidden {
	opacity: 0;
	transform: translateY(16px);
	pointer-events: none;
}

@media (max-width: 1024px) {
	.tc-float-contact { display: flex; }
}

.tc-float-contact__btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	color: #fff;
	text-decoration: none;
	box-shadow: 0 8px 22px rgba(11, 30, 54, 0.28);
	-webkit-tap-highlight-color: transparent;
}

.tc-float-contact__btn svg,
.tc-float-contact__btn img {
	position: relative;
	z-index: 1;
	width: 24px;
	height: 24px;
}

.tc-float-contact__btn--phone {
	background: linear-gradient(135deg, var(--tc-gold-light, #E0BD5E), var(--tc-primary, #C59B27) 55%, var(--tc-primary-dark, #8C6810));
}

.tc-float-contact__btn--zalo {
	background: var(--tc-heading-navy, #0B1E36);
	border: 1px solid rgba(197, 155, 39, 0.65);
}

.tc-float-contact__btn--zalo img { width: 28px; height: 28px; }

/* Vòng sóng lan tỏa quanh nút gọi */
.tc-float-contact__btn--phone::before,
.tc-float-contact__btn--phone::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: var(--tc-primary, #C59B27);
	opacity: 0.45;
	animation: tc-float-pulse 2s ease-out infinite;
}

.tc-float-contact__btn--phone::after { animation-delay: 1s; }

.tc-float-contact__btn--phone svg { animation: tc-float-ring 2s ease-in-out infinite; }

@keyframes tc-float-pulse {
	0% { transform: scale(1); opacity: 0.45; }
	100% { transform: scale(1.7); opacity: 0; }
}

@keyframes tc-float-ring {
	0%, 50%, 100% { transform: rotate(0); }
	10%, 30% { transform: rotate(-14deg); }
	20%, 40% { transform: rotate(14deg); }
}

@media (prefers-reduced-motion: reduce) {
	.tc-float-contact__btn--phone::before,
	.tc-float-contact__btn--phone::after,
	.tc-float-contact__btn--phone svg { animation: none; }
}

.tc-float-contact__label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
