/* Recursos de acessibilidade comuns ao sistema interno e aos portais.
   Carregado depois das folhas do tema: os ajustes de contraste precisam vencer
   os tokens originais. */

/* ---------- Tokens com contraste mínimo de 4,5:1 ---------- */
:root {
    --a11y-foco: #0b57d0;
    --a11y-foco-sombra: rgba(11, 87, 208, 0.35);
}

:root:not([data-theme-mode="dark"]) {
    --text-muted: #5f6b85;
    --header-prime-color: #56687f;
    --menu-prime-color: #56687f;
}

:root:not([data-bs-theme="dark"]) {
    --bs-secondary-color: #595f66;
}

[data-bs-theme="dark"] {
    --bs-secondary-color: #c4c8cc;
    --a11y-foco: #8ab4f8;
    --a11y-foco-sombra: rgba(138, 180, 248, 0.45);
}

/* Texto secundário, texto de erro e botão secundário do tema claro abaixo de
   4,5:1 (#6c757d sobre #f5f6fa, #ff383c e branco sobre #ff5a29). */
html:not([data-theme-mode="dark"]):not([data-bs-theme="dark"]):not([data-contraste="alto"]) .text-muted {
    color: #5c636a !important;
}

html:not([data-theme-mode="dark"]):not([data-bs-theme="dark"]):not([data-contraste="alto"]) .text-danger {
    color: #c81e1e !important;
}

html:not([data-contraste="alto"]) .btn-secondary,
html:not([data-contraste="alto"]) .btn-secondary:hover,
html:not([data-contraste="alto"]) .btn-secondary:focus {
    background-color: #c2410c !important;
    border-color: #c2410c !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .text-danger {
    color: #f87171 !important;
}

[data-theme-mode="dark"] {
    --text-muted: rgba(255, 255, 255, 0.72);
    --a11y-foco: #8ab4f8;
    --a11y-foco-sombra: rgba(138, 180, 248, 0.45);
}

.identidade-build,
.identidade-build .identidade-build__ambiente,
.identidade-build .identidade-build__revisao {
    color: var(--text-muted) !important;
    opacity: 1 !important;
}

/* ---------- Tamanho de fonte ajustável (até 200%) ---------- */
html[data-fonte="110"] { font-size: 110%; }
html[data-fonte="125"] { font-size: 125%; }
html[data-fonte="150"] { font-size: 150%; }
html[data-fonte="175"] { font-size: 175%; }
html[data-fonte="200"] { font-size: 200%; }

html[data-fonte] body {
    overflow-wrap: anywhere;
}

html[data-fonte="150"] .table-responsive,
html[data-fonte="175"] .table-responsive,
html[data-fonte="200"] .table-responsive {
    overflow-x: auto;
}

/* ---------- Pular para o conteúdo ---------- */
.a11y-atalhos-pulo {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2147483640;
    list-style: none;
    margin: 0;
    padding: 0;
}

.a11y-atalhos-pulo a {
    position: absolute;
    left: -10000px;
    top: 0.5rem;
    white-space: nowrap;
    padding: 0.6rem 1rem;
    background: #0b1f3a;
    color: #ffffff !important;
    font-weight: 700;
    border-radius: 0 0 0.375rem 0;
    text-decoration: underline;
}

.a11y-atalhos-pulo a:focus,
.a11y-atalhos-pulo a:focus-visible {
    left: 0.5rem;
    outline: 3px solid #ffbf00;
    outline-offset: 2px;
}

[tabindex="-1"]:focus:not(:focus-visible) {
    outline: none;
}

/* ---------- Foco visível ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible,
[role="menuitem"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
.side-menu__item:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible {
    outline: 3px solid var(--a11y-foco) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px var(--a11y-foco-sombra) !important;
}

/* ---------- Barra de acessibilidade ---------- */
.a11y-barra {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.a11y-barra .a11y-botao {
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid currentColor;
    border-radius: 0.375rem;
    background: transparent;
    color: inherit;
    font-weight: 700;
    line-height: 1;
}

.a11y-barra .a11y-botao[aria-pressed="true"] {
    background: #0b1f3a;
    color: #ffffff;
}

.a11y-menu .dropdown-item[aria-pressed="true"]::after {
    content: " (ativado)";
    font-weight: 700;
}

.a11y-rodape {
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    text-align: center;
}

.a11y-rodape a,
.a11y-rodape .btn-link {
    color: #0a58ca;
    text-decoration: underline;
}

[data-theme-mode="dark"] .a11y-rodape a,
[data-theme-mode="dark"] .a11y-rodape .btn-link,
[data-bs-theme="dark"] .a11y-rodape a,
[data-bs-theme="dark"] .a11y-rodape .btn-link {
    color: #8ab4f8;
}

/* ---------- Diálogo de atalhos ---------- */
.a11y-atalhos-lista kbd {
    display: inline-block;
    min-width: 1.6em;
    padding: 0.1em 0.4em;
    border: 1px solid #5f6b85;
    border-radius: 0.25rem;
    background: #f3f4f6;
    color: #111827;
    font-family: monospace !important;
    text-align: center;
}

/* ---------- Alto contraste ----------
   Fundo preto, texto branco, links e foco amarelos. Vale por cima do tema claro
   e do escuro. Imagens, vídeos e gráficos mantêm as cores originais. As regras
   de exceção repetem o atributo para superar a especificidade da regra geral. */
html[data-contraste="alto"] {
    --a11y-foco: #ffff00;
    --a11y-foco-sombra: rgba(255, 255, 0, 0.5);
    --text-muted: #ffffff;
    --bs-body-bg: #000000;
    --bs-body-color: #ffffff;
    --bs-secondary-color: #ffffff;
    --bs-border-color: #ffffff;
    --bs-link-color: #ffff00;
    --bs-link-hover-color: #ffff00;
    color-scheme: dark;
}

html[data-contraste="alto"],
html[data-contraste="alto"] body,
html[data-contraste="alto"] body *:not(img):not(svg):not(svg *):not(video):not(canvas):not(iframe):not(.a11y-preserva-cor):not(.a11y-preserva-cor *) {
    background-color: #000000 !important;
    background-image: none !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

html[data-contraste="alto"][data-contraste][data-contraste] a,
html[data-contraste="alto"][data-contraste][data-contraste] a *,
html[data-contraste="alto"][data-contraste][data-contraste] .btn-link,
html[data-contraste="alto"][data-contraste][data-contraste] .nav-link,
html[data-contraste="alto"][data-contraste][data-contraste] .nav-link * {
    color: #ffff00 !important;
    text-decoration: underline;
}

html[data-contraste="alto"][data-contraste][data-contraste] .btn,
html[data-contraste="alto"][data-contraste][data-contraste] .form-control,
html[data-contraste="alto"][data-contraste][data-contraste] .form-select,
html[data-contraste="alto"][data-contraste][data-contraste] .form-check-input,
html[data-contraste="alto"][data-contraste][data-contraste] .input-group-text,
html[data-contraste="alto"][data-contraste][data-contraste] .card,
html[data-contraste="alto"][data-contraste][data-contraste] .modal-content,
html[data-contraste="alto"][data-contraste][data-contraste] .dropdown-menu,
html[data-contraste="alto"][data-contraste][data-contraste] .alert,
html[data-contraste="alto"][data-contraste][data-contraste] .badge,
html[data-contraste="alto"][data-contraste][data-contraste] table,
html[data-contraste="alto"][data-contraste][data-contraste] th,
html[data-contraste="alto"][data-contraste][data-contraste] td {
    border: 1px solid #ffffff !important;
}

html[data-contraste="alto"][data-contraste][data-contraste] .btn:hover,
html[data-contraste="alto"][data-contraste][data-contraste] .nav-link.active,
html[data-contraste="alto"][data-contraste][data-contraste] .side-menu__item.active,
html[data-contraste="alto"][data-contraste][data-contraste] .dropdown-item:hover,
html[data-contraste="alto"][data-contraste][data-contraste] .dropdown-item:focus,
html[data-contraste="alto"][data-contraste][data-contraste] .page-item.active .page-link {
    background-color: #ffff00 !important;
    color: #000000 !important;
}

html[data-contraste="alto"][data-contraste][data-contraste] .btn:hover *,
html[data-contraste="alto"][data-contraste][data-contraste] .nav-link.active *,
html[data-contraste="alto"][data-contraste][data-contraste] .side-menu__item.active *,
html[data-contraste="alto"][data-contraste][data-contraste] .dropdown-item:hover *,
html[data-contraste="alto"][data-contraste][data-contraste] .dropdown-item:focus * {
    color: #000000 !important;
}

html[data-contraste="alto"][data-contraste][data-contraste] .form-check-input:checked {
    background-color: #ffff00 !important;
}

html[data-contraste="alto"][data-contraste][data-contraste] ::placeholder {
    color: #d9d9d9 !important;
    opacity: 1;
}

html[data-contraste="alto"][data-contraste][data-contraste] .modal-backdrop {
    background-color: #000000 !important;
    opacity: 0.85 !important;
}

html[data-contraste="alto"][data-contraste][data-contraste] .a11y-atalhos-lista kbd {
    background: #000000 !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
}

/* Barra flutuante das telas sem cabeçalho (login, portais antes do acesso). */
.a11y-barra-flutuante {
    position: fixed;
    top: 0.5rem;
    right: 0.5rem;
    z-index: 1040;
    padding: 0.25rem;
    border-radius: 0.5rem;
    background: #ffffff;
    color: #0b1f3a;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.a11y-barra-flutuante a {
    color: #0b1f3a;
    padding: 0 0.25rem;
    text-decoration: underline;
    font-weight: 600;
}

/* Botões da ajuda online sobre o fundo claro dos cartões (#0d6efd e #735dff
   ficavam abaixo de 4,5:1). */
html:not([data-theme-mode="dark"]):not([data-bs-theme="dark"]):not([data-contraste="alto"]) #ajuda-app .btn-link,
html:not([data-theme-mode="dark"]):not([data-bs-theme="dark"]):not([data-contraste="alto"]) #ajuda-app .btn-outline-primary {
    color: #0a58ca !important;
    border-color: #0a58ca !important;
}

html:not([data-theme-mode="dark"]):not([data-bs-theme="dark"]):not([data-contraste="alto"]) #ajuda-app .btn-outline-primary:hover {
    background-color: #0a58ca !important;
    color: #ffffff !important;
}


/* Item ativo do menu lateral no tema claro: branco sobre #6366f1 dá 4,47:1,
   abaixo do mínimo de 4,5:1. Só o fundo escurece; o branco do texto já fica
   acima de 4,5:1 num tom mais escuro da mesma família (6,29:1). */
html:not([data-theme-mode="dark"]):not([data-bs-theme="dark"]):not([data-contraste="alto"]) .side-menu__item.active {
    background-color: #4f46e5 !important;
}

/* Diálogo que mostra uma página inteira do sistema (declaração de
   acessibilidade, ajuda). Limita a altura para o conteúdo rolar dentro do
   diálogo, em vez de esticar a janela. */
.a11y-dialogo { margin: auto; }
.a11y-dialogo-pagina { width: min(880px, 92vw); max-height: 86vh; }
.a11y-dialogo-pagina[open] { display: flex; flex-direction: column; }
.a11y-dialogo-pagina .a11y-dialogo-corpo { overflow-y: auto; overscroll-behavior: contain; }
.a11y-dialogo-pagina .a11y-dialogo-corpo :where(h1, .h1) { font-size: 1.35rem; }
.a11y-dialogo-pagina .a11y-dialogo-corpo img { max-width: 100%; height: auto; }
