/* Tab idle — pause CSS motion; green status badge */

html.tnt-tab-idle *,
html.tnt-tab-idle *::before,
html.tnt-tab-idle *::after {
	animation-play-state: paused !important;
}

html.tnt-tab-idle .tnt-tab-idle-badge,
html.tnt-tab-idle .tnt-tab-idle-badge *,
html.tnt-tab-idle .tnt-winamp-player,
html.tnt-tab-idle .tnt-winamp-player * {
	animation-play-state: running !important;
}

.tnt-tab-idle-badge {
	position: fixed;
	left: 50%;
	bottom: calc(env(safe-area-inset-bottom, 0px) + 4.25rem);
	z-index: 99999;
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.35rem 0.75rem;
	border-radius: 999px;
	font-family: soleil, Montserrat, sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #f4f4f4;
	background: linear-gradient(135deg, #2d6a4f 0%, #386641 55%, #1b4332 100%);
	border: 1px solid rgba(230, 183, 93, 0.45);
	box-shadow:
		0 4px 18px rgba(27, 67, 50, 0.45),
		0 0 0 1px rgba(0, 0, 0, 0.12);
	opacity: 0;
	transform: translate(-50%, 8px);
	pointer-events: none;
	transition:
		opacity 0.35s ease,
		transform 0.35s ease;
}

.tnt-tab-idle-badge.is-visible {
	opacity: 1;
	transform: translate(-50%, 0);
}

.tnt-tab-idle-badge__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #95d5b2;
	box-shadow: 0 0 0 0 rgba(149, 213, 178, 0.65);
	animation: tnt-tab-idle-pulse 1.8s ease-in-out infinite;
}

@keyframes tnt-tab-idle-pulse {
	0%,
	100% {
		box-shadow: 0 0 0 0 rgba(149, 213, 178, 0.55);
	}
	50% {
		box-shadow: 0 0 0 6px rgba(149, 213, 178, 0);
	}
}

body.tnt-has-winamp .tnt-tab-idle-badge {
	bottom: calc(env(safe-area-inset-bottom, 0px) + 3.65rem);
}

@media (max-width: 781px) {
	.tnt-tab-idle-badge {
		bottom: calc(env(safe-area-inset-bottom, 0px) + 1rem);
		left: 1rem;
		transform: translate(0, 8px);
	}

	.tnt-tab-idle-badge.is-visible {
		transform: translate(0, 0);
	}

	body.tnt-has-winamp .tnt-tab-idle-badge {
		bottom: calc(env(safe-area-inset-bottom, 0px) + 3.25rem);
	}
}
