/**
 * Footer banner closer — estilo da aba de fechar e do estado fechado.
 *
 * O markup vive no GTM (wrapper `[data-gp-footer-banner]` + um
 * `button.gp-footer-banner-close` dentro); aqui só o visual. O comportamento
 * está em assets/js/footer-banner.js.
 *
 * Compatível com o contrato do projeto-irmão (Jovem Pan): também reconhece
 * `[data-jp-footer-banner]` / `.jp-footer-banner-close`, caso a tag do GTM
 * seja reaproveitada. O idiomático no GP é o prefixo `gp-`.
 *
 * A aba é uma pequena "orelha" cinza com um chevron `⌄`, posicionada ACIMA do
 * banner (`bottom: 100%`) e centralizada — fora da área do anúncio, pra não
 * atrapalhar criativos que ocupam o banner inteiro.
 *
 * `:where(...)` tem especificidade 0 de propósito: se o seu wrapper já é
 * `position: fixed/sticky` (anchor de rodapé), o seu CSS vence; senão, ele vira
 * `relative` pra ancorar a aba. Em qualquer caso, vira contexto de posição.
 */
:where([data-gp-footer-banner], [data-jp-footer-banner]) {
	position: relative;
}

.gp-footer-banner-close,
.jp-footer-banner-close {
	position: absolute;
	bottom: 100%; /* acima do topo do banner — fora da área do anúncio */
	left: 50%;
	transform: translateX(-50%);
	z-index: 2147483647;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 20px;
	padding: 0;
	border: 0;
	border-radius: 6px 6px 0 0; /* "orelha": só os cantos de cima arredondados */
	background: #ececec;
	color: #555;
	cursor: pointer;
	box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.08);
	-webkit-appearance: none;
	appearance: none;
}

/* Chevron ⌄ (pra baixo) desenhado com 2 bordas — discreto; botão fica vazio no GTM. */
.gp-footer-banner-close::before,
.jp-footer-banner-close::before {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
}

.gp-footer-banner-close:hover,
.gp-footer-banner-close:focus-visible,
.jp-footer-banner-close:hover,
.jp-footer-banner-close:focus-visible {
	background: #e0e0e0;
	color: #333;
}

.gp-footer-banner--closed {
	display: none !important;
}