/* ==========================================================================
   VARIÁVEIS E CONFIGURAÇÕES RAIZ
   ========================================================================== */
:root {
    --base-font-size: 100%;
    --bg-color: #ffffff;
    --text-color: #333333;
    --accent-blue: #0056b3;
}

/* Aplicado via JS */
body.high-contrast {
    --bg-color: #000000 !important;
    --text-color: #ffff00 !important;
}

/* ==========================================================================
   ESTILOS BASE (MODO PADRÃO)
   ========================================================================== */
body {
    font-size: var(--base-font-size);
    background-color: var(--bg-color);
    color: var(--text-color);
    transition: background 0.3s, color 0.3s;
}

a {
    color: var(--accent-blue);
    text-decoration: underline;
    /* transition: color 0.3s; */
}

#menu-container {
    height: auto !important;
    min-height: 50px;
}

/* ==========================================================================
   REGRAS CONSOLIDADAS: ALTO CONTRASTE
   ========================================================================== */

/* --- Fundo e Texto Global --- */
body.high-contrast,
body.high-contrast #header,
body.high-contrast #rodape-1,
body.high-contrast #banners-home,
body.high-contrast #servicos,
body.high-contrast #links,
body.high-contrast #menu-container,
body.high-contrast #menu-container nav,
body.high-contrast #menu-container ul,
body.high-contrast #menu-container li {
    background-color: #000000 !important;
    background-image: none !important;
    color: #ffff00 !important;
}

/* --- Seletores que devem ser Amarelos --- */
body.high-contrast a,
body.high-contrast .titulo-home,
body.high-contrast .titulo-home a,
body.high-contrast .titulo-home span,
body.high-contrast .item-titulo,
body.high-contrast .item-titulo a,
body.high-contrast .noticia-data,
body.high-contrast .textwidget,
body.high-contrast .textwidget *,
body.high-contrast #header *,
body.high-contrast #rodape-1 *,
body.high-contrast #banners-home *,
body.high-contrast #servicos *,
body.high-contrast #links * {
    color: #ffff00 !important;
}

/* --- Links e Hovers (Uniformizados) --- */
body.high-contrast a { 
    text-decoration: underline !important;
    background-color: #ffff00 !important;
    color: #000000 !important;
}

/* Links que estão dentro de elementos que já são pretos (como o menu) */
body.high-contrast #menu-container a,
body.high-contrast .textwidget a,
body.high-contrast .item-titulo a {
    background-color: transparent !important;
}

/* Estado de Hover: A única exceção onde o fundo fica Amarelo */
body.high-contrast a:hover,
body.high-contrast .saiba-mais:hover,
body.high-contrast #menu-container a:hover,
body.high-contrast #menu-container li:hover {
    background-color: #ffff00 !important;
    color: #000000 !important;
    text-decoration: none !important;
}

body.high-contrast .saiba-mais:hover {
    text-decoration: underline !important;
}

body.high-contrast #conteudo ul a {
    color: #ffff00 !important;
    background-color: transparent !important;
}

/* --- Menu Aberto e Delimitação --- */
body.high-contrast #menu-container {
    border: 3px solid #ffff00 !important;
    box-shadow: 10px 0px 0px #000000, 12px 0px 0px #ffff00 !important;
}

body.high-contrast #menu-container li {
    border-bottom: 1px solid #ffff00 !important;
}

/* --- Regras de Visibilidade (Menu Ativo via JS) --- */
body.high-contrast.menu-ativo #botao-buscar,
body.high-contrast.menu-ativo #botao-menu {
    display: none !important;
}

/* --- Ícones --- */
body.high-contrast .noticia-data i,
body.high-contrast .noticia-data svg,
body.high-contrast .saiba-mais i,
body.high-contrast .saiba-mais svg {
    fill: #ffff00 !important;
    color: #ffff00 !important;
}

/* --- Ajuste Específico para o Menu do Rodapé --- */
body.high-contrast #menu-rodape-1,
body.high-contrast #menu-rodape-1 li,
body.high-contrast #menu-rodape-1 ul {
    background-color: #000000 !important;
    background-image: none !important;
}

/* Garante que os links do menu do rodapé sejam amarelos com fundo preto */
body.high-contrast #menu-rodape-1 a {
    color: #ffff00 !important;
    background-color: #000000 !important;
    text-decoration: underline !important;
    display: block;
    padding: 5px 0;
}

/* Efeito de hover para os links do menu do rodapé */
body.high-contrast #menu-rodape-1 a:hover {
    background-color: #ffff00 !important;
    color: #000000 !important;
    text-decoration: none !important;
}

/* --- Ajuste para Links em Itens de Notícia --- */
body.high-contrast .noticia-item,
body.high-contrast .noticia-item a,
body.high-contrast .noticia-item .titulo-noticia {
    background-color: #000000 !important;
    color: #ffff00 !important;
    text-decoration: underline !important;
}

/* Hover específico para o item de notícia */
body.high-contrast .noticia-item:hover,
body.high-contrast .noticia-item a:hover {
    /* background-color: #ffff00 !important; */
    color: #ffff00 !important;
}

/* Caso haja um resumo ou "leia mais" dentro da notícia */
body.high-contrast .noticia-item .resumo,
body.high-contrast .noticia-item .post-excerpt {
    color: #ffff00 !important;
    background-color: transparent !important;
}

body.high-contrast .alerta {
    background-color: transparent !important;
    color: #ffffff !important;
}

body.high-contrast .alerta:hover {
    background-color: transparent !important;
    color: #ffffff !important;
}
body.high-contrast a.servico-home {
    background-color: transparent !important;

}

body.high-contrast ul#menu-sociais li.menu-item a {
    background-color: #ffff00 !important;
}

body.high-contrast .video-home-image a:hover {
    background-color: transparent !important;
}

/* ==========================================================================
   ESTILIZAÇÕES ESPECÍFICAS
   ========================================================================== */

/* --- HEADER COM DESTAQUE ESCURO --- */
body.high-contrast #header, 
body.high-contrast .site-header, 
body.high-contrast #menu-container {
    background-color: #1A1A1A !important;
    border-bottom: 2px solid #FFFF00 !important;
}

/* Garante que os itens dentro do header fiquem amarelos */
body.high-contrast #header *,
body.high-contrast #menu-container a {
    color: #FFFF00 !important;
    background-color: #1a1a1a !important;
}

body.high-contrast #menu-container {
    background: #1A1A1A !important;
}

/* Efeito de seleção no Menu do Header */
body.high-contrast #menu-container a:hover {
    background-color: #FFFF00 !important;
    color: #000000 !important;
}

body.high-contrast #menu-container .menu-superior-container li {
    background: #1A1A1A !important; 
}

body.high-contrast #rodape-1 #menu-rodape-1,
body.high-contrast #rodape-1 #menu-rodape-1 li,
body.high-contrast #rodape-1 #menu-rodape-1 li a,
body.high-contrast #rodape-1 {
    background: #1A1A1A !important;
}

body.high-contrast #rodape-1 #menu-rodape-1 li a:hover {
    background-color: #FFFF00 !important;
    display: block;
}


body.high-contrast #servicos {
    background-color: #1A1A1A !important;
}


body.high-contrast #banners-home,
body.high-contrast #links {
    background-color: #353535 !important;
}

body.high-contrast #links a:hover,
body.high-contrast #links a {
    background-color: transparent !important;
}


body.high-contrast .widget_media_image img.image, 
body.high-contrast img.icone-servico {
    background-color: #ffffff !important; /* Cria um fundo branco atrás da imagem */
    padding: 5px !important;
    border: 2px solid #ffff00 !important;
    border-radius: 4px;
}

/* 1. RESETA A BARRA */
body.high-contrast #wpadminbar,
body.high-contrast #wpadminbar * {
    background-color: #1d2327 !important; /* Cor padrão do WP */
    color: #f0f0f1 !important;           /* Cor do texto padrão */
    filter: none !important;              /* Remove filtros como grayscale ou invert */
    text-shadow: none !important;
}

/* 2. Mantém os ícones da barra visíveis */
body.high-contrast #wpadminbar .ab-icon:before,
body.high-contrast #wpadminbar .ab-item:before {
    color: #a7aaad !important;
}

/* 3. Garante que o hover da barra continue funcionando */
body.high-contrast #wpadminbar a:hover,
body.high-contrast #wpadminbar a:hover * {
    color: #72aee6 !important; 
    background-color: #2c3338 !important;
}

/* Isso garante que o site responda ao aumento do JavaScript */
html {
    /* Define que 1rem = 100% do que o navegador/JS ditar */
    font-size: 100%; 
}

body {
    font-size: 1rem !important; 
    line-height: 1.5;
}


body.high-contrast #wpadminbar,
body.high-contrast #wpadminbar * {
    background-color: #1d2327 !important;
    color: #f0f0f1 !important;
    /* font-size: 13px !important; */
}

body.high-contrast #menu-superior .menu-item-has-children a:after {
    filter: drop-shadow(1px 1px 0px #fff) 
            drop-shadow(-1px -1px 0px #fff) 
            drop-shadow(1px -1px 0px #fff) 
            drop-shadow(-1px 1px 0px #fff) !important;
}

body.high-contrast .video-home-image,
body.high-contrast .video-home-image a {
    background-color: transparent !important;

}

body.high-contrast h2.titulo-arquivos,
body.high-contrast .widget-titulo {
    color: #ffff00 !important;
}

body.high-contrast #links .link:not(:first-child) {
    border-top: 1px solid #ffff00;
}

body.high-contrast #botao-topo img {
    filter: drop-shadow(1px 1px 0px #000000) 
            drop-shadow(-1px -1px 0px #000000) 
            drop-shadow(1px -1px 0px #000000) 
            drop-shadow(-1px 1px 0px #000000) !important;
}

body.high-contrast #busca .busca-botao,
body.high-contrast #busca-botao .lupa {
    background-image: url(//src.cijun.sp.gov.br/img/icones-busca/buscar-highlight.svg) !important;
    color: transparent !important;
}

body.high-contrast #breadcrumb {
    color: #ffff00;
}

body.high-contrast .busca-texto {
    outline: none;
    border-color: #ffffff;
}

body.high-contrast #searchsubmit {
    border-color: #ffffff;
}

body.high-contrast #menu-principal .menu-item a::after {
    color: #ffffff !important;
    opacity: 1 !important;
    filter: invert(100%) !important;
}

body.high-contrast #menu-principal > li.menu-item-has-children:hover > a, .contraste #menu-principal > li.menu-item-has-children > a:hover {
    box-shadow: inset 0px 0px 0px 1px #fff !important;
    background: transparent;
}

body.high-contrast #menu-principal li ul {
    border-top: none;
    box-shadow: inset 0px 0px 0px 1px #fff !important;
    border: 1px solid #ffffff !important;
}


body.high-contrast #menu-social a{
    background-color: transparent !important;
}

body.high-contrast .widget .textwidget p,
body.high-contrast .widget-titulo{
    color: #ffffff !important;
}

body.high-contrast input::placeholder {
    color: #ffffff;
}

body.high-contrast #header a{
    text-decoration: none !important;
}

body.high-contrast h1.pagina-titulo {
    color: #ffffff;
}

body.high-contrast #breadcrumb {
    color: #ffffff;
}