/*
 * a11y.css — Correções de acessibilidade (Etapa 12). Carregado por ÚLTIMO.
 * Camada puramente ADITIVA: só ajusta contraste de texto, movimento reduzido e
 * reflow de tabelas/fórmulas. Não altera layout, conteúdo do usuário nem a marca.
 */

/* ------------------------------------------------------------------ *
 * 1) CONTRASTE — terracota como TEXTO
 * O terracota da marca (#bc6042) reprova em AA como texto (4,22 no papel /
 * 3,81 no creme). Aqui um tom mais escuro só para TEXTO (>= 4,5); os usos
 * decorativos, fundos e bordas continuam com o terracota original.
 * ------------------------------------------------------------------ */
:root {
  --jj-terra-ink: #a24d31; /* 5,67 no papel · 5,12 no creme (AA) */
}

.article-updated,
.toc-title,
.author-box-eyebrow,
.related-eyebrow,
.related-card small,
.article-body > small,
.sheet small,
.jj-filtros-limpar,
.is-style-jj-passo-a-passo::before,
.is-style-jj-erro-comum::before {
  color: var(--jj-terra-ink);
}

/* Estados hover que trocam o texto para terracota também usam o tom AA */
.entry-content a:hover,
.article-nav a:hover,
.toc a:hover,
.author-box-links a:hover,
.related-card h3 a:hover,
.content-wrap .pagination .page-numbers:hover {
  color: var(--jj-terra-ink);
}

/* ------------------------------------------------------------------ *
 * 2) MOVIMENTO REDUZIDO (prefers-reduced-motion: reduce)
 * Neutraliza transições/animações e o salto de hover para quem pede menos
 * movimento. Só vale sob a media query — não muda a aparência normal.
 * ------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  /* Sem o "levantar" no hover dos cards */
  .article-card:hover,
  .post-grid article:hover,
  .year-card:hover,
  .topic-list a:hover,
  .related-card:hover {
    transform: none !important;
  }
}

/* ------------------------------------------------------------------ *
 * 3) REFLOW / ZOOM — tabelas e fórmulas do conteúdo
 * Permite rolar tabelas e blocos largos na horizontal sem quebrar o zoom
 * (WCAG Reflow). NÃO muda a semântica da tabela (o <table> continua tabela;
 * o scroll fica no contêiner). Não altera o conteúdo do usuário.
 * ------------------------------------------------------------------ */
.entry-content {
  overflow-wrap: break-word; /* evita rolagem horizontal por token/fórmula longa */
}

.entry-content figure.wp-block-table {
  overflow-x: auto;
  max-width: 100%;
}

/* Contêiner rolável fica operável por teclado (foco) quando há barra */
.entry-content figure.wp-block-table:focus-visible {
  outline: 3px solid var(--jj-terra);
  outline-offset: 2px;
}

.entry-content pre,
.entry-content .wp-block-code,
.entry-content .wp-block-preformatted {
  overflow-x: auto;
  max-width: 100%;
}