/*
 * Páginas de coleção — enquadramento + estado vazio.
 *
 * A coleção em si é renderizada pelo plugin `pagina-colecoes` ([flavor_colecao]), com o CSS dele.
 * Aqui só o wrapper e o estado vazio, que é markup nosso.
 */

.inloft-colecao {
	width: 100%;
	max-width: 100%;
	padding: 0;
	margin: 0;
}

/* ── Estado vazio: página de coleção sem coleção vinculada ─────────────────── */

.inloft-colecao__vazio {
	max-width: 640px;
	margin: 0 auto;
	padding: clamp(56px, 10vw, 120px) 24px;
	text-align: center;
	font-family: var(--inloft-font-body, "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	color: #223829;
}

.inloft-colecao__vazio-titulo {
	font-family: var(--inloft-font-display, "Poppins", "Helvetica Neue", Arial, sans-serif);
	font-weight: 600;
	font-size: clamp(1.5rem, 4vw, 2.25rem);
	line-height: 1.2;
	margin: 0 0 16px;
	text-wrap: balance;
	/*
	 * Cor declarada explicitamente, e não herdada do .inloft-colecao__vazio: o Kadence define
	 * uma cor própria para h1 (#1A202C, um azul-marinho), e uma declaração no próprio elemento
	 * sempre vence um valor herdado — independente de especificidade.
	 */
	color: #223829;
}

.inloft-colecao__vazio-texto {
	font-size: 1.0625rem;
	line-height: 1.7;
	margin: 0 auto 28px;
	max-width: 46ch;
	color: rgba(34, 56, 41, .78);
}

/* Nota operacional — só aparece para administradores. */
.inloft-colecao__vazio-admin {
	font-size: .875rem;
	line-height: 1.6;
	margin: 0 auto 28px;
	max-width: 52ch;
	padding: 14px 18px;
	background: #F2EEE4;
	border: 1px dashed #BFBB9B;
	border-radius: 0;
	color: rgba(34, 56, 41, .8);
	text-align: left;
}

.inloft-colecao__vazio-cta {
	display: inline-block;
	background: #223829;
	color: #EAE4D3;
	font-family: var(--inloft-font-display, "Poppins", "Helvetica Neue", Arial, sans-serif);
	font-weight: 500;
	font-size: .875rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	text-decoration: none;
	padding: 14px 28px;
	border-radius: 0;
	transition: background-color .18s ease;
}

.inloft-colecao__vazio-cta:hover,
.inloft-colecao__vazio-cta:focus {
	background: #3A7D4E;
	color: #EAE4D3;
}

.inloft-colecao__vazio-cta:focus-visible {
	outline: 2px solid #904B2C;
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.inloft-colecao__vazio-cta {
		transition: none;
	}
}