/* ============================================================================
   anuncios.css — caixas dos anúncios do Google nas páginas            [2026-10-14]
   ----------------------------------------------------------------------------
   Carregado só onde há anúncio ligado (tv_ads_head, [@end-anuncios]).
   Estilos: .tvad-est-faixa (largura toda) · .tvad-est-caixa (cartão até 336 px)
            .tvad-est-livre (sem moldura). Aparelho: .tvad-so-pc / .tvad-so-cel.
   Modo prévia (só quem gerencia): .tvad-previa (caixa tracejada, sem Google).
   Cores pelos tokens --tv-* (modo claro/escuro e tema).
   ============================================================================ */

.tvad-zona { display: grid; gap: 16px; }
.tvad-container { margin-top: 22px; margin-bottom: 22px; }
.tvad-container.tvad-mover { display: none; }
.tvad-container-topo { margin-top: 18px; margin-bottom: 4px; }
.tvad-container-final { margin-top: 8px; margin-bottom: 28px; }

/* zonas dentro das páginas */
.tvad-zona-lateral-topo { margin-bottom: 24px; }
.tvad-zona-lateral { margin-top: 24px; }
.tvad-zona-depois-lista { margin: 8px 0 32px; }
.tvad-zona-inicio-texto { margin: 0 0 22px; }
.tvad-zona-fim-texto { margin: 22px 0 6px; }
.tvad-zona-meio-texto { margin: 22px 0; }
.tvad-zona-meio-texto.tvad-no-texto { margin: 26px 0; clear: both; }
.tvad-zona-conteudo, .tvad-zona-conteudo-topo { margin: 18px 0; }

/* caixa */
.tvad { position: relative; min-width: 0; max-width: 100%; overflow: hidden; text-align: center; }
.tvad-ins { display: block; width: 100%; min-width: 0; }
.tvad-fixo .tvad-ins { display: inline-block; margin: 0 auto; }
.tvad-rot {
	display: block; margin: 0 0 6px; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
	line-height: 1; color: var(--tv-texto-2, #8a8a99); opacity: .8; text-align: center;
}

.tvad-est-faixa, .tvad-est-caixa {
	padding: 10px 12px 12px; background: var(--tv-superficie, rgba(127, 127, 140, .06));
	border: 1px solid var(--tv-borda, rgba(127, 127, 140, .2)); border-radius: var(--tv-raio, 14px);
}
.tvad-est-faixa .tvad-ins { min-height: 90px; }
.tvad-est-caixa { width: 100%; max-width: 336px; margin-left: auto; margin-right: auto; }
.tvad-est-caixa .tvad-ins { min-height: 250px; }
.tvad-est-livre { padding: 0; background: none; border: 0; }

/* Google sem anúncio para mostrar: some a caixa toda (sem buraco vazio) */
.tvad:not(.tvad-previa-real):has(ins[data-ad-status="unfilled"]) { display: none !important; }
.tvad-vazio { display: none !important; }   /* tv-ads.js: zona sem nenhuma caixa visível (sem anúncio ou só de outro aparelho) */

/* aparelho */
@media (max-width: 991.98px) {
	.tvad-so-pc { display: none !important; }
	.tvad-est-faixa .tvad-ins { min-height: 100px; }
	.tvad-container { margin-top: 16px; margin-bottom: 16px; }
}
@media (min-width: 992px) { .tvad-so-cel { display: none !important; } }
@media (max-width: 575.98px) {
	.tvad-est-faixa, .tvad-est-caixa { padding: 8px 8px 10px; border-radius: var(--tv-raio-sm, 10px); }
}

/* ---------- modo prévia (só para quem gerencia; nunca chama o Google) ---------- */
.tvad-previa {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 110px; padding: 14px 16px;
	text-align: center; color: var(--tv-texto, #eee); border: 2px dashed var(--tv-destaque, #7c5cff); border-radius: var(--tv-raio, 14px);
	background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--tv-destaque, #7c5cff) 10%, transparent) 0 12px, transparent 12px 24px);
}
.tvad-previa.tvad-est-caixa { min-height: 250px; }
.tvad-previa-tit { font-weight: 800; font-size: 14px; }
.tvad-previa-tit i { color: var(--tv-destaque, #7c5cff); }
.tvad-previa-info { font-size: 12px; color: var(--tv-texto-2, #aaa); }
.tvad-previa-estado { margin-top: 4px; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; color: #fff; background: #16a34a; }
.tvad-previa-off { border-color: var(--tv-borda, #555); opacity: .75; }
.tvad-previa-off .tvad-previa-estado { background: #6b7280; }

/* ---------- [2026-10-14 b] prévia com o anúncio REAL (só quem gerencia) ---------- */
.tvad-previa-real { outline: 2px dashed var(--tv-destaque, #7c5cff); outline-offset: 3px; }
.tvad-previa-real.tvad-previa-off { outline-color: var(--tv-texto-2, #888); }
.tvad-previa-tag {
	display: inline-flex; align-items: center; gap: 6px; max-width: 100%; margin: 0 auto 8px; padding: 3px 10px; border-radius: 999px;
	font-size: 11px; font-weight: 700; line-height: 1.3; color: #fff; background: var(--tv-destaque, #7c5cff);
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tvad-previa-off .tvad-previa-tag { background: #6b7280; }
.tvad-previa-vazio { display: block; margin-top: 6px; font-size: 11.5px; line-height: 1.4; color: var(--tv-texto-2, #999); }
.tvad-previa-real ins[data-ad-status="filled"] ~ .tvad-previa-vazio { display: none; }
.tvad-previa-real .tvad-ins:not([data-ad-status="filled"]) { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--tv-destaque, #7c5cff) 8%, transparent) 0 12px, transparent 12px 24px); border-radius: 8px; }

/* barra fixa da prévia */
.tvad-barra {
	position: fixed; left: 50%; bottom: 16px; z-index: 1090; transform: translateX(-50%); width: min(760px, calc(100% - 24px));
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 14px; border-radius: 14px; font-size: 13px; line-height: 1.4;
	color: var(--tv-texto, #eee); background: color-mix(in srgb, var(--tv-superficie, #1b1b22) 94%, transparent);
	border: 1px solid var(--tv-destaque, #7c5cff); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); backdrop-filter: blur(8px);
}
.tvad-barra > i { font-size: 18px; color: var(--tv-destaque, #7c5cff); }
.tvad-barra > span { flex: 1 1 260px; min-width: 0; }
.tvad-barra-bt {
	display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 9px; cursor: pointer; font-size: 12.5px; font-weight: 800;
	text-decoration: none !important; color: var(--tv-texto, #eee) !important; background: transparent; border: 1px solid var(--tv-borda, #444);
}
.tvad-barra-bt:hover { border-color: var(--tv-destaque, #7c5cff); }
.tvad-barra-sair { color: #fff !important; background: var(--tv-destaque, #7c5cff); border-color: transparent; }
@media (max-width: 991.98px) { .tvad-barra { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); } }   /* acima do menu de baixo do celular */

