/* =====================================================================
 * Ultrapack Changelog - GATE LEGADO
 * Fade de protecao + CTA para as paginas legadas de atualizacoes
 * (shortcode [ultrapack_last_updates2]). Carregado SO nessas paginas e SO
 * para visitante / logado sem plano. Visual identico ao gate do changelog.
 *
 * A cor do fade (--up-clog-lg-bg) deve casar com o FUNDO da pagina atras da
 * lista (default #f9f9f9). Se o fundo for outro, basta trocar esta variavel.
 * ===================================================================== */
.up-clog-legacy-stage {
	--up-clog-lg-bg: #f9f9f9;
	--up-clog-lg-rose: #b7545b;
	--up-clog-lg-text: #49546c;
	--up-clog-lg-muted: #8a8f9c;
	position: relative;
}

/* Oculto ate o JS confirmar o gate (classe .is-gated no stage). */
.up-clog-legacy-gate {
	display: none;
}

.up-clog-legacy-stage.is-gated .up-clog-legacy-gate {
	display: flex;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	/* Transparente em cima (primeiras linhas nitidas), funde no fundo da pagina
	   ja na metade da faixa: os ultimos itens somem por completo, sem retangulo. */
	height: 520px;
	align-items: flex-end;
	justify-content: center;
	padding-bottom: 10px;
	background: linear-gradient(
		to bottom,
		rgba(249, 249, 249, 0) 0%,
		rgba(249, 249, 249, .5) 26%,
		var(--up-clog-lg-bg) 50%
	);
	pointer-events: auto;
	z-index: 4;
}

.up-clog-legacy-stage .up-clog-gate-card {
	max-width: 470px;
	padding: 0 18px;
	text-align: center;
}

.up-clog-legacy-stage .up-clog-gate-ico {
	display: inline-block;
	width: 30px;
	height: 30px;
	margin-bottom: 9px;
	background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23b7545b'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='3'%20y='11'%20width='18'%20height='11'%20rx='2'/%3E%3Cpath%20d='M7%2011V7a5%205%200%200%201%2010%200v4'/%3E%3C/svg%3E") no-repeat center;
	background-size: contain;
}

.up-clog-legacy-stage .up-clog-gate-title {
	display: block;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -.2px;
	color: var(--up-clog-lg-text);
	margin-bottom: 6px;
}

.up-clog-legacy-stage .up-clog-gate-sub {
	margin: 0 0 15px;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--up-clog-lg-muted);
}

.up-clog-legacy-stage .up-clog-gate-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	padding: 0 30px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -.1px;
	color: #fff;
	background: var(--up-clog-lg-rose);
	border-radius: 10px;
	text-decoration: none;
	box-shadow: 0 8px 20px -8px rgba(183, 84, 91, .7);
	transition: background .15s ease, transform .15s ease;
}

.up-clog-legacy-stage .up-clog-gate-btn:hover {
	background: #9f474e;
	color: #fff;
	transform: translateY(-1px);
}
