/**
 * Acessibilidade — estilos do tema child.
 *
 * Substitui os controles que o widget do Elementor Ally oferecia como
 * "opção" e que, na verdade, são requisito: contorno de foco (WCAG 2.4.7)
 * e respeito a prefers-reduced-motion. Requisito não é preferência do
 * usuário — tem que ser o comportamento padrão do site.
 */

/* ---------------------------------------------------------------------------
 * Conteúdo só para leitor de tela
 * ------------------------------------------------------------------------- */

.jh-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* ---------------------------------------------------------------------------
 * Skip link
 *
 * Fora da tela por padrão, visível e no topo ao receber foco. Diferente do
 * link do Ally, este NÃO tem tabindex e é a primeira parada de Tab da página.
 * ------------------------------------------------------------------------- */

.jh-skip-link {
	position: absolute;
	top: -100vh;
	left: 8px;
	z-index: 100000;
	display: inline-block;
	padding: 14px 22px;
	background: #ffffff;
	color: #111111;
	border: 2px solid #111111;
	border-radius: 4px;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: underline;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .3);
}

.jh-skip-link:focus {
	top: 8px;
}

/* ---------------------------------------------------------------------------
 * Contorno de foco — WCAG 2.4.7
 *
 * Anel de duas cores: o traço escuro aparece sobre fundo claro, e o halo
 * claro aparece sobre fundo escuro. Assim o foco é visível em qualquer lugar
 * do site sem precisar de uma regra por componente.
 * ------------------------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[contenteditable="true"]:focus-visible {
	outline: 3px solid #111111;
	outline-offset: 2px;
	box-shadow: 0 0 0 6px #ffffff;
}

/*
 * O campo de busca do cabeçalho (widget Search do Elementor Pro) vem com
 * outline:none — medido em 25/08/2026 como a única parada de Tab do site
 * sem nenhum indicador de foco. Precisa de !important porque a regra do
 * plugin é mais específica.
 */
.e-search-input:focus,
.e-search-input:focus-visible,
input[type="search"]:focus-visible {
	outline: 3px solid #111111 !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 6px #ffffff !important;
}

/* ---------------------------------------------------------------------------
 * Link de acessibilidade no rodapé — LBI art. 63 §1º
 * ------------------------------------------------------------------------- */

.jh-a11y-footer {
	display: flex;
	justify-content: center;
	padding: 16px;
	background: #111111;
}

.jh-a11y-footer__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #ffffff;
	font-size: .95rem;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.jh-a11y-footer__icon {
	flex: none;
}

/* ---------------------------------------------------------------------------
 * Movimento — WCAG 2.3.3 / 2.2.2
 *
 * Quem pediu menos movimento no sistema operacional recebe menos movimento.
 * A parada do autoplay do carrossel é feita em assets/js/a11y.js, porque
 * o Swiper roda por JavaScript e CSS não o alcança.
 * ------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}

	/* Efeito de escala no hover dos cards de evento. */
	.elementor-element.e-transform:hover {
		transform: none !important;
	}
}

/* ---------------------------------------------------------------------------
 * Botão de pausa do carrossel — WCAG 2.2.2 (nível A)
 *
 * O carrossel da home troca de slide a cada 1,4 s e estava configurado com
 * pause_on_interaction:no, sem nenhum controle. Conteúdo em movimento por
 * mais de 5 s precisa de mecanismo de parada.
 * ------------------------------------------------------------------------- */

.jh-carousel-host {
	position: relative;
}

.jh-carousel-toggle {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 20;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: #ffffff;
	color: #111111;
	border: 2px solid #111111;
	border-radius: 999px;
	font-size: .82rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}

.jh-carousel-toggle::before {
	content: "❙❙";
	font-size: .78em;
	letter-spacing: -1px;
}

.jh-carousel-toggle.is-paused::before {
	content: "▶";
	letter-spacing: 0;
}

.jh-carousel-toggle:hover {
	background: #111111;
	color: #ffffff;
}

/* ---------------------------------------------------------------------------
 * Reflow — WCAG 1.4.10
 *
 * Medido em 25/08/2026: a home rolava na horizontal em 320 px (scrollWidth
 * 400) e em zoom 400% (scrollWidth 2781). Duas causas distintas.
 * ------------------------------------------------------------------------- */

/*
 * 1. Títulos do Elementor são flex items com flex:0 0 auto — não encolhem e
 *    mantêm a largura de uma linha só. "Patrocinadores e Parceiros" ficava
 *    com 390 px numa tela de 320.
 */
.elementor-heading-title {
	max-width: 100%;
	overflow-wrap: break-word;
}

/*
 * 2. O painel do menu aninhado (e-n-menu-content) assume 5120 px em zoom
 *    400%, o que estica o documento inteiro.
 */
.e-n-menu-content {
	max-width: 100vw;
}

/* ---------------------------------------------------------------------------
 * Bloco de acessibilidade do evento — item 4 da carta
 * ------------------------------------------------------------------------- */

.jh-evento-acess {
	max-width: 1140px;
	margin: 48px auto;
	padding: 24px 28px;
	border: 1px solid #d8d2d2;
	border-left: 4px solid #b90a3c;
	border-radius: 4px;
	background: #fbf8f8;
}

.jh-evento-acess__titulo {
	margin: 0 0 12px;
	font-size: 1.25rem;
	line-height: 1.3;
}

.jh-evento-acess__lista {
	margin: 0 0 12px;
	padding-left: 1.25em;
}

.jh-evento-acess__lista li {
	margin-bottom: 4px;
}

.jh-evento-acess__obs,
.jh-evento-acess__vazio,
.jh-evento-acess__contato {
	margin: 8px 0 0;
	font-size: .95rem;
	line-height: 1.55;
}

.jh-evento-acess__contato a {
	color: #a50f35;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Atalhos seguintes ficam lado a lado quando recebem foco. */
.jh-skip-nav .jh-skip-link:nth-child(2):focus {
	left: 260px;
}

.jh-skip-nav .jh-skip-link:nth-child(3):focus {
	left: 540px;
}

.jh-skip-libras {
	cursor: pointer;
	font-family: inherit;
}

/* ---------------------------------------------------------------------------
 * Contraste — WCAG 1.4.3 (AA)
 *
 * Medido em 25/08/2026 nas listagens de blog, categoria, busca e eventos
 * anteriores: data do post em #adadad sobre branco dá 2,24:1, e o resumo em
 * #777777 dá 4,47:1. O mínimo é 4,5:1.
 *
 * São cinzas neutros, não cor de marca — escurecer não mexe na identidade
 * visual. #6d6d6d rende 5,1:1 sobre branco, com folga sobre o mínimo.
 * ------------------------------------------------------------------------- */

.elementor-post__meta-data,
.elementor-post-date,
.elementor-post-time,
.elementor-post__excerpt,
.elementor-post__excerpt p {
	color: #6d6d6d;
}

/* ---------------------------------------------------------------------------
 * Uso de cor — WCAG 1.4.1
 *
 * Os links de paginação ("Próximo »") tinham 2,54:1 de contraste com o texto
 * ao redor — abaixo dos 3:1 exigidos para distinguir só pela cor. O sublinhado
 * remove a dependência de cor por completo.
 * ------------------------------------------------------------------------- */

.page-numbers,
.elementor-pagination .page-numbers {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.page-numbers.current {
	text-decoration: none;
	font-weight: 700;
}

/*
 * O resumo do post herda #777777 (4,47:1) de uma regra mais específica do
 * Elementor. Especificidade suficiente para vencer, sem !important.
 */
.elementor-posts .elementor-post__excerpt p,
.elementor-widget-posts .elementor-post__excerpt p,
.elementor-posts-container .elementor-post__excerpt p {
	color: #6d6d6d;
}

/*
 * Estes três precisam de !important: o Elementor imprime a cor em regra
 * por-elemento (.elementor-NNN .elementor-element-XXX), especificidade que
 * folha de tema não alcança sem entrar numa guerra de seletores. Contraste
 * é requisito, então aqui o !important é a ferramenta certa.
 *
 * Valores medidos sobre o fundo real de cada caso:
 *   #6d6d6d sobre #ffffff = 5,1:1   (mínimo 4,5:1)
 *   #b02a56 sobre #f2f2f2 = 5,6:1   (era #cc3366 = 4,43:1)
 */
.elementor-post__excerpt p,
.elementor-post__excerpt,
.elementor-post-date,
.elementor-post-time,
.elementor-post__meta-data {
	color: #6d6d6d !important;
}

.jet-filters-pagination__link,
.jet-filters-pagination__item .jet-filters-pagination__link {
	color: #b02a56 !important;
}

/* ---------------------------------------------------------------------------
 * Links dentro de texto corrido — WCAG 1.4.1 (Uso de cor)
 *
 * Os links no corpo dos posts têm 2,54:1 de contraste com o texto ao redor,
 * abaixo dos 3:1 exigidos para diferenciar apenas pela cor. Quem não
 * distingue essa faixa de rosa não percebe que ali há um link.
 *
 * O sublinhado elimina a dependência de cor. Botões ficam de fora — eles já
 * se distinguem por forma e fundo.
 * ------------------------------------------------------------------------- */

.elementor-widget-text-editor a:not([class*="elementor-button"]):not([class*="e-gallery"]),
.elementor-widget-theme-post-content a:not([class*="elementor-button"]):not([class*="e-gallery"]),
.jet-listing-dynamic-field__content a:not([class*="elementor-button"]) {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/*
 * Linha de autor e data do post: #808080 sobre branco rende 3,94:1,
 * abaixo do mínimo de 4,5:1 para texto normal.
 */
.elementor-post-info__item,
.elementor-post-info__item time,
.elementor-post-info .elementor-icon-list-text,
.elementor-post-info__item--type-author,
.elementor-post-info__item--type-date {
	color: #6d6d6d !important;
}

/* ---------------------------------------------------------------------------
 * Trava para cores inline reprovadas — WCAG 1.4.3
 *
 * Não são estilos do tema: são cores digitadas pelo editor dentro do conteúdo.
 * Medido: vermelho puro #ff0000 sobre branco rende 3,99:1 e o cinza #808080
 * rende 3,94:1 — os dois abaixo do mínimo de 4,5:1.
 *
 * A regra preserva a intenção (segue vermelho, segue cinza) e só escurece o
 * suficiente para ficar legível. Vale como rede de segurança, não como
 * substituto de orientar a equipe: o certo é a Comunicação parar de usar
 * vermelho puro para destaque.
 *
 *   #c00000 sobre branco = 5,9:1
 *   #6d6d6d sobre branco = 5,1:1
 * ------------------------------------------------------------------------- */

[style*="color:#ff0000"],
[style*="color: #ff0000"],
[style*="color:#FF0000"],
[style*="color: #FF0000"],
[style*="color:red"],
[style*="color: red"] {
	color: #c00000 !important;
}

[style*="color:#808080"],
[style*="color: #808080"],
[style*="color:#adadad"],
[style*="color: #adadad"] {
	color: #6d6d6d !important;
}

/*
 * Rótulo "Tags:" do template de post único: #808080 a 13px rende 3,94:1.
 * A cor vem da configuração do próprio widget (elemento c846dde), não de
 * estilo inline nem do tema — por isso a regra é por elemento, e não uma
 * regra ampla em .elementor-heading-title, que atropelaria o design de
 * todos os títulos do site.
 */
.elementor-element-c846dde .elementor-heading-title {
	color: #6d6d6d !important;
}

/* ==========================================================================
   WCAG 2.5.1 — Gestos de ponteiro: setas de anterior/próximo no carrossel
   O carrossel só era percorrível arrastando ou esperando o autoplay. As setas
   dão a alternativa de clique simples que o critério exige.
   ========================================================================== */

.jh-carousel-controls {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 20;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

/* O botão de pausa deixa de se posicionar sozinho: agora quem posiciona é o grupo. */
.jh-carousel-controls .jh-carousel-toggle {
	position: static;
	top: auto;
	right: auto;
}

.jh-carousel-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	background: #ffffff;
	color: #111111;
	border: 2px solid #111111;
	border-radius: 999px;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
	position: relative;
}

/* Alvo de toque de 44px sem inflar o desenho do botão (WCAG 2.5.5). */
.jh-carousel-arrow::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 44px;
	height: 44px;
	transform: translate(-50%, -50%);
}

.jh-carousel-arrow span {
	display: block;
	width: 9px;
	height: 9px;
	border-top: 2.5px solid currentColor;
	border-right: 2.5px solid currentColor;
}

.jh-carousel-prev span {
	transform: rotate(-135deg);
	margin-left: 3px;
}

.jh-carousel-next span {
	transform: rotate(45deg);
	margin-right: 3px;
}

.jh-carousel-arrow:hover {
	background: #111111;
	color: #ffffff;
}

/* ==========================================================================
   WCAG 1.4.13 — Conteúdo em foco ou hover: dispensar submenu com Esc
   O painel é mantido aberto pelo :hover do CSS do Elementor; remover a classe
   e-active não o fecha enquanto o ponteiro estiver sobre ele. Esta classe,
   posta pelo JS ao pressionar Esc, sobrepõe o :hover e é liberada quando o
   ponteiro sai do menu.
   ========================================================================== */

.jh-hover-dispensado .e-n-menu-content,
.jh-hover-dispensado .e-n-menu-content > * {
	display: none !important;
}

/* ==========================================================================
   WCAG 1.4.11 — Contraste de conteúdo não textual
   Medido em 26/08/2026 sobre 34 componentes: duas reprovações reais.
   ========================================================================== */

/* Borda do campo de busca dos filtros: #bbb dava 1,92:1 sobre branco. */
.jet-search-filter__input,
input.jet-search-filter__input {
	border-color: #6d6d6d !important;
}

/* Ícone de relógio do bloco ATENDIMENTO: #be0000 sobre #111 dava 2,87:1. */
.elementor-element-389e397 .elementor-icon svg,
.elementor-element-389e397 .elementor-icon {
	fill: #d40000;
	color: #d40000;
}

/* ==========================================================================
   WCAG 1.4.5 — Informações do evento em texto
   Data, horário e local saem do dado estruturado; entrada e classificação
   saem dos campos do painel. O que antes só existia dentro do cartaz.
   ========================================================================== */

.jh-evento-dados {
	margin: 32px auto;
	padding: 20px 24px;
	max-width: 1140px;
	border: 1px solid #d5d5d5;
	border-radius: 8px;
	background: #fafafa;
}

.jh-evento-dados__titulo {
	margin: 0 0 12px;
	font-size: 1.15rem;
	line-height: 1.3;
	color: #111111;
}

.jh-evento-dados__lista {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 12px 24px;
}

.jh-evento-dados__item {
	margin: 0;
}

.jh-evento-dados__lista dt {
	margin: 0 0 2px;
	font-size: .8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #6d6d6d;
}

.jh-evento-dados__lista dd {
	margin: 0;
	font-size: 1rem;
	line-height: 1.45;
	color: #111111;
	overflow-wrap: break-word;
}

/* ==========================================================================
   Página de Acessibilidade (LBI art. 63 §1º)
   Página comum do WordPress, renderizada pelo template "Páginas" do Theme
   Builder — o <h1> vem do título, o conteúdo abaixo começa em <h2>.
   ========================================================================== */

.jh-acess-simbolo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	background: #aa0000;
	color: #ffffff;
}

.jh-pagina-acessibilidade h2 {
	margin: 40px 0 12px;
	line-height: 1.25;
}

.jh-pagina-acessibilidade ul {
	margin: 0 0 16px;
	padding-left: 22px;
}

.jh-pagina-acessibilidade li {
	margin-bottom: 7px;
	line-height: 1.55;
}

.jh-pagina-acessibilidade table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 16px;
}

.jh-pagina-acessibilidade th,
.jh-pagina-acessibilidade td {
	padding: 9px 12px;
	border: 1px solid #d5d5d5;
	text-align: left;
	vertical-align: top;
}

.jh-pagina-acessibilidade thead th {
	background: #f2f2f2;
}

/* Duas colunas fixas: rótulo à esquerda, valor à direita. Com auto-fit os
   pares <dt>/<dd> fluem como itens soltos e rótulo e valor caem em colunas
   diferentes — o par se desfaz. */
.jh-pagina-acessibilidade dl.jh-acess-ficha {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 10px 20px;
	margin: 0 0 16px;
	padding: 18px 20px;
	border: 1px solid #d5d5d5;
	border-radius: 8px;
	background: #fafafa;
}

.jh-pagina-acessibilidade dl.jh-acess-ficha dt {
	font-size: .8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #6d6d6d;
	margin-bottom: 0;
	grid-column: 1;
	padding-top: 2px;
}

.jh-pagina-acessibilidade dl.jh-acess-ficha dd {
	margin: 0;
	line-height: 1.45;
	grid-column: 2;
}

/* Marcador de texto que ainda depende da Unibes. Precisa ser impossível de
   não ver: publicar a página com um destes no ar seria pior que não publicar. */
.jh-acess-pendente {
	margin: 0 0 16px;
	padding: 16px 18px;
	border: 2px dashed #b02a56;
	border-radius: 8px;
	background: #fff5f8;
	color: #6d1533;
}

.jh-acess-pendente::before {
	content: "A PREENCHER PELA UNIBES — REMOVER ESTE AVISO ANTES DE PUBLICAR";
	display: block;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .05em;
	margin-bottom: 8px;
	color: #b02a56;
}

/* ==========================================================================
   WCAG 1.4.3 — cor padrão de link herdada do tema pai
   hello-elementor/assets/css/reset.css define `a{color:#c36}` (ou seja,
   #cc3366). Sobre a faixa cinza do caminho de navegação (#f0f0f0) isso dá
   4,35:1, abaixo dos 4,5:1 exigidos para texto de 12px.
   A regra vale para todo link que o Elementor não pinte — os estilos de
   widget são mais específicos e continuam vencendo esta.
   #b02a56 dá 5,56:1 sobre #f0f0f0 e 6,29:1 sobre branco.
   ========================================================================== */

a {
	color: #b02a56;
}
