/* =====================================================
   sticky-bar.css , mobile-only sticky bottom CTA bar.
   The pill visual itself lives in countdown-pill.css so
   header / sticky bar / thank-you panel all share it.
   ===================================================== */

.tnt-sticky-bar {
	display: none;
}

@media (max-width: 767px) {
	.tnt-sticky-bar {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9999;
		padding: 10px 12px;
		background: #ffffff;
		border-top: 1px solid #E6E0D6;
		box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.06);
		padding-bottom: calc(10px + env(safe-area-inset-bottom, 0));
		font-family: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	}

	.tnt-sticky-bar__pill {
		flex: 0 1 auto;
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.tnt-sticky-bar__cta {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		background: #E87D2F;
		color: #ffffff;
		text-decoration: none;
		font-size: 14px;
		font-weight: 600;
		padding: 10px 16px;
		border-radius: 8px;
		white-space: nowrap;
		flex: 0 0 auto;
		transition: background-color 0.15s ease;
	}

	.tnt-sticky-bar__cta:hover,
	.tnt-sticky-bar__cta:focus {
		background: #D46D27;
		color: #ffffff;
	}

	body {
		padding-bottom: 72px;
	}
}