/* ==========================================================================
   Acessibilidade Básica e VLibras - 221B
   Estilos do widget de tamanho de texto + ancoragem via CSS.
   ========================================================================== */

/* Posição-base: centro-direita. Funciona em qualquer navegador e é a posição
   usada quando só o recurso de fonte está ativo (sem VLibras para ancorar). */
.a11y-221b{
	position:fixed;
	top:50%;
	right:0;
	transform:translateY(-50%);
	z-index:99999;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:.25rem;
	background:#fff;
	border:1px solid #d4d4d4;
	border-right:0;
	border-radius:.6rem 0 0 .6rem;
	padding:.3rem;
	box-shadow:0 2px 10px rgba(0,0,0,.15);
	font-family:system-ui,sans-serif;
}

.a11y-221b-icon{
	width:1.6rem;
	height:1.6rem;
	margin-bottom:.15rem;
	display:block;
}

.a11y-221b button{
	cursor:pointer;
	border:0;
	background:#f1f1f1;
	border-radius:.4rem;
	width:2.1rem;
	height:2.1rem;
	font-size:1rem;
	font-weight:600;
	line-height:1;
	color:#222;
	display:flex;
	align-items:center;
	justify-content:center;
}
.a11y-221b button:hover{ background:#e2e2e2; }
.a11y-221b button:focus-visible{ outline:2px solid #2563eb; outline-offset:2px; }

/* Reset com metade da altura, mas área clicável ampliada (WCAG 2.5.8). */
.a11y-221b #a221b-reset{ position:relative; height:1.05rem; font-size:.85rem; }
.a11y-221b #a221b-reset::before{ content:""; position:absolute; left:0; right:0; top:-.25rem; bottom:-.7rem; }

/* Visível só para leitor de tela (anúncio do tamanho atual). */
.a11y-221b-sr{
	position:absolute;
	width:1px;height:1px;
	padding:0;margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	white-space:nowrap;
	border:0;
}

/* --------------------------------------------------------------------------
   Ancoragem via CSS (sem JS): posiciona o widget 20px acima do botão do VLibras.
   Só entra quando:
     - os dois recursos estão ativos (classe .a221b-anchored, adicionada pelo PHP);
     - o navegador suporta CSS Anchor Positioning.
   Onde não houver suporte, o widget mantém a posição-base (centro-direita) acima.
   O fallback anchor(top, 55%) segura o widget num ponto visível de espera enquanto
   o botão do VLibras ainda não foi injetado no DOM.
   -------------------------------------------------------------------------- */
@supports (anchor-name: --a){
	[vw-access-button]{ anchor-name:--a221b-vlibras; }

	.a11y-221b.a221b-anchored{
		position-anchor:--a221b-vlibras;
		top:auto;
		transform:none;
		bottom:calc(anchor(top, 55%) + 20px);
	}
}