/* TevezMarketing-CTA — Frontend widget (mobile-first) */

#tmcta-root {
	position: relative;
	z-index: 9999;
}

.tmcta-widget {
	position: fixed;
	z-index: 9999;
	opacity: 0;
	pointer-events: none;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	will-change: opacity, transform;
}

.tmcta-widget.is-visible {
	opacity: var(--tmcta-opacity, 1);
	pointer-events: auto;
}

/* Base animation: fade-up (default) */
.tmcta-anim-fade-up {
	transform: translateY(24px) scale(0.96);
	transition: opacity 0.45s cubic-bezier(0.22, 1, 0.36, 1), transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.tmcta-anim-fade-up.is-visible {
	transform: translateY(0) scale(1);
}

.tmcta-anim-fade {
	transform: scale(0.98);
	transition: opacity 0.4s ease, transform 0.4s ease;
}

.tmcta-anim-fade.is-visible {
	transform: scale(1);
}

.tmcta-anim-fade-down {
	transform: translateY(-24px) scale(0.96);
	transition: opacity 0.45s cubic-bezier(0.22, 1, 0.36, 1), transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.tmcta-anim-fade-down.is-visible {
	transform: translateY(0) scale(1);
}

.tmcta-anim-slide-left {
	transform: translateX(40px);
	transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1), transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.tmcta-anim-slide-left.is-visible {
	transform: translateX(0);
}

.tmcta-anim-slide-right {
	transform: translateX(-40px);
	transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1), transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.tmcta-anim-slide-right.is-visible {
	transform: translateX(0);
}

.tmcta-anim-bounce {
	transform: translateY(30px) scale(0.9);
	transition: opacity 0.35s ease, transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.tmcta-anim-bounce.is-visible {
	transform: translateY(0) scale(1);
}

.tmcta-anim-pulse {
	transform: scale(0.85);
	transition: opacity 0.35s ease, transform 0.5s ease;
}

.tmcta-anim-pulse.is-visible {
	transform: scale(1);
	animation: tmcta-entrance-pulse 0.8s ease 0.2s 1;
}

@keyframes tmcta-entrance-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.04); }
}

.tmcta-anim-zoom {
	transform: scale(0.7);
	transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.tmcta-anim-zoom.is-visible {
	transform: scale(1);
}

.tmcta-anim-none {
	transform: none;
	transition: opacity 0.15s ease;
}

.tmcta-anim-none.is-visible {
	transform: none;
}

/* Fallback when no animation class assigned */
.tmcta-widget:not([class*="tmcta-anim-"]) {
	transform: translateY(16px) scale(0.98);
	transition: opacity 0.35s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.tmcta-widget:not([class*="tmcta-anim-"]).is-visible {
	transform: translateY(0) scale(1);
}

.tmcta-widget.has-shadow {
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22);
}

/* Positions */
.tmcta-pos-bottom-right { right: 20px; bottom: 20px; }
.tmcta-pos-bottom-left { left: 20px; bottom: 20px; }
.tmcta-pos-top-right { right: 20px; top: 90px; }
.tmcta-pos-top-left { left: 20px; top: 90px; }

/* Desktop QR widget */
.tmcta-desktop {
	width: min(320px, calc(100vw - 32px));
	background: var(--tmcta-bg, #25d366);
	color: var(--tmcta-text, #fff);
	border-radius: 16px;
	padding: var(--tmcta-padding, 16px);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	text-align: center;
}

.tmcta-desktop.is-draggable {
	cursor: grab;
}

.tmcta-desktop.is-draggable:active {
	cursor: grabbing;
}

.tmcta-close {
	position: absolute;
	top: 8px;
	right: 10px;
	border: 0;
	background: rgba(0, 0, 0, 0.15);
	color: inherit;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s ease;
}

.tmcta-close:hover {
	background: rgba(0, 0, 0, 0.28);
}

.tmcta-brand .tmcta-wa-icon {
	width: 36px;
	height: 36px;
	display: block;
}

.tmcta-message {
	margin: 0;
	font-size: 15px;
	line-height: 1.45;
	font-weight: 600;
}

.tmcta-qr-wrap {
	background: #fff;
	border-radius: 12px;
	padding: 8px;
	line-height: 0;
}

.tmcta-qr-wrap canvas,
.tmcta-qr-wrap img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

.tmcta-hint {
	margin: 0;
	font-size: 12px;
	opacity: 0.9;
}

.tmcta-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.18);
	color: inherit;
	text-decoration: none;
	font-size: 13px;
	font-weight: 600;
	transition: transform 0.2s ease, background 0.2s ease;
}

.tmcta-link:hover {
	background: rgba(255, 255, 255, 0.28);
	transform: translateY(-1px);
}

.tmcta-desktop:hover {
	animation: tmcta-pulse 1.6s ease infinite;
}

@keyframes tmcta-pulse {
	0%, 100% { box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22); }
	50% { box-shadow: 0 16px 40px rgba(15, 23, 42, 0.32); }
}

/* Mobile floating button */
.tmcta-mobile {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	max-width: calc(100vw - 32px);
	background: var(--tmcta-bg, #25d366);
	color: var(--tmcta-text, #fff);
	border-radius: 999px;
	padding: var(--tmcta-padding, 16px);
	text-decoration: none;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.3;
}

.tmcta-mobile .tmcta-brand {
	display: inline-flex;
	flex-shrink: 0;
}

.tmcta-mobile .tmcta-wa-icon {
	width: 28px;
	height: 28px;
}

.tmcta-mobile .tmcta-message {
	font-size: 14px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 220px;
}

.tmcta-mobile:hover {
	transform: translateY(-2px);
}

/* Small desktop screens */
@media (max-width: 1024px) {
	.tmcta-desktop {
		width: min(280px, calc(100vw - 24px));
	}
}

@media (max-width: 768px) {
	.tmcta-pos-top-right,
	.tmcta-pos-top-left {
		top: auto;
		bottom: 20px;
	}
}