/* ==========================================================================
   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;
}

/* --------------------------------------------------------------------------
   Convivência com o VLibras (v1.7.0).

   Até a v1.6.x o widget era ancorado ao botão do VLibras via CSS Anchor
   Positioning. O VLibras 7.x passou a criar o próprio botão dentro de um
   shadow DOM (#vlibras-access-wrapper), e anchor-name não atravessa a
   fronteira de shadow tree — a ancoragem deixou de ser possível.

   Em compensação, a posição do botão virou fixa e conhecida, definida pelo
   loader do gov.br:
       #vlibras-access { position:fixed; right:10px; top:calc(50vh - 20px);
                         width:40px; height:40px; }

   Então o widget é posicionado direto: topo em (50vh - 40px) e deslocado para
   cima pela própria altura, o que deixa sua base 20px acima do topo do botão,
   independentemente de quanto o widget cresce. Sem JS e sem depender de
   Anchor Positioning — funciona em qualquer navegador.

   Se o VLibras mudar esses valores de novo, é AQUI que se ajusta.
   -------------------------------------------------------------------------- */
.a11y-221b.a221b-with-vlibras{
	top:calc(50vh - 40px);
	transform:translateY(-100%);
	right:10px;
	border-right:1px solid #d4d4d4;
	border-radius:.6rem;
}
