/* CSS de Acessibilidade - Refatorado */

/* Classes de Zoom */
:root {
    --zoom-factor: 1;
}

.zoom_-3 { --zoom-factor: 0.67; }
.zoom_-2 { --zoom-factor: 0.8; }
.zoom_-1 { --zoom-factor: 0.9; }
.zoom_0  { --zoom-factor: 1; }
.zoom_1  { --zoom-factor: 1.1; }
.zoom_2  { --zoom-factor: 1.2; }
.zoom_3  { --zoom-factor: 1.33; }

/* Aplicação do Zoom */
body[class*="zoom_"] {
    zoom: var(--zoom-factor);
}

/* Menu de acessibilidade */
.portal-accessibility {
    position: fixed;
    top: 35%;
    right: 0.5%;
    z-index: 3000;
    font-family: inherit;
}

.portal-accessibility__trigger {
    display: block;
    width: 40px;
    height: 40px;
    padding: 0;
    overflow: hidden;
    background: #3047b8;
    border: 0;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(13, 29, 77, 0.24);
    cursor: pointer;
    margin: 0;
}

.portal-accessibility__trigger:hover,
.portal-accessibility__trigger:focus-visible {
    background: #22399e;
    outline: 3px solid #fff;
    outline-offset: -4px;
}

.portal-accessibility__trigger img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.portal-accessibility__panel {
    position: absolute;
    top: -2px;
    right: calc(100% + 10px);
    width: 264px;
    padding: 14px 14px 16px;
    color: #17213a;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(13, 29, 77, 0.2);
}

.portal-accessibility__panel[hidden] {
    display: none;
}

.portal-accessibility__zoom {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.portal-accessibility__zoom-button {
    min-height: 42px;
    color: #17213a;
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
    background: #fff;
    border: 1px solid #4b4f58;
    border-radius: 6px;
    cursor: pointer;
}

.portal-accessibility__zoom-button:hover,
.portal-accessibility__zoom-button:focus-visible {
    color: #183fbd;
    background: #f3f6ff;
    border-color: #183fbd;
    outline: 2px solid rgba(24, 63, 189, 0.25);
    outline-offset: 1px;
}

.portal-accessibility__shortcuts {
    margin: 12px 0 10px;
    color: #5d6575;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.7;
    text-align: center;
}

.portal-accessibility__shortcuts span {
    display: block;
}

.portal-accessibility__divider {
    height: 1px;
    margin: 0 0 12px;
    background: #e3e5ea;
}

.portal-accessibility__contrast {
    width: 100%;
    min-height: 44px;
    padding: 8px 12px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.25;
    background: #303030;
    border: 1px solid #303030;
    border-radius: 6px;
    cursor: pointer;
}

.portal-accessibility__contrast:hover,
.portal-accessibility__contrast:focus-visible {
    background: #1d1d1d;
    border-color: #1d1d1d;
    outline: 2px solid rgba(48, 48, 48, 0.28);
    outline-offset: 2px;
}

@media (max-width: 767.98px) {
    .portal-accessibility {
        top: 22%;
    }

    .portal-accessibility__trigger {
        width: 48px;
        height: 48px;
    }

    .portal-accessibility__panel {
        right: calc(100% + 8px);
        width: min(264px, calc(100vw - 64px));
    }
}

/* Fix para Firefox que não suporta zoom CSS */
@supports not (zoom: 1) {
    body[class*="zoom_"] {
        transform: scale(var(--zoom-factor));
        transform-origin: top center;
        width: calc(100% / var(--zoom-factor));
    }
}

/* 
    FIX: Modal Backdrop and Fullscreen Overlays 
    Quando o body tem zoom < 1 (ex: 0.67), o viewport visual aumenta.
    Elementos fixos com 100vh/100vw calculam baseados no zoom, ficando menores que a tela.
    Aumentamos o tamanho do backdrop para compensar qualquer zoom mínimo (0.67 -> ~150%).
    Usamos 200% para garantir cobertura total.
*/
body[class*="zoom_"] .modal-backdrop, 
body[class*="zoom_"] #buscador_modal {
    width: 200vw !important;
    height: 200vh !important;
    left: -50vw !important;
    top: -50vh !important;
}

/* High Contrast Mode */
body.contraste-ativo {
    background-color: #000 !important;
    color: #fff !important;
}

body.contraste-ativo .portal-accessibility__panel,
body.contraste-ativo .portal-accessibility__zoom-button,
body.contraste-ativo .portal-accessibility__contrast {
    color: #fff !important;
    background: #000 !important;
    border-color: #fff !important;
}

body.contraste-ativo .portal-accessibility__divider {
    background: #fff !important;
}

body.contraste-ativo p,
body.contraste-ativo td,
body.contraste-ativo h1,
body.contraste-ativo h2,
body.contraste-ativo h3,
body.contraste-ativo h4,
body.contraste-ativo h5,
body.contraste-ativo a,
body.contraste-ativo label,
body.contraste-ativo span,
body.contraste-ativo b,
body.contraste-ativo strong,
body.contraste-ativo small,
body.contraste-ativo li,
body.contraste-ativo dt,
body.contraste-ativo dd,
body.contraste-ativo legend,
body.contraste-ativo button,
body.contraste-ativo i,
body.contraste-ativo th,
body.contraste-ativo input,
body.contraste-ativo .text-dark,
body.contraste-ativo .nav-link {
    color: #fff !important;
}

body.contraste-ativo .bloco-resumo,
body.contraste-ativo .services,
body.contraste-ativo .notice,
body.contraste-ativo .photo-galery,
body.contraste-ativo .video-galery,
body.contraste-ativo .footer-video,
body.contraste-ativo .footer-base,
body.contraste-ativo .news2,
body.contraste-ativo .modal-content,
body.contraste-ativo .navbar,
body.contraste-ativo .card-service,
body.contraste-ativo .btn-all-services,
body.contraste-ativo .btn-all-notices,
body.contraste-ativo .btn-all-photo,
body.contraste-ativo .btn-all-video {
    background-color: #000 !important;
    border-color: #fff !important;
}

body.contraste-ativo .link-publico-card,
body.contraste-ativo .link-publico-icone,
body.contraste-ativo .vacinacao-link-card,
body.contraste-ativo .vacinacao-link-card__icone,
body.contraste-ativo .vacinacao-link-card__seta,
body.contraste-ativo .vacinacao-text-card {
    background-color: #000 !important;
    border-color: #fff !important;
}

body.contraste-ativo .vacinacao-link-card__conteudo strong,
body.contraste-ativo .vacinacao-link-card__conteudo small {
    color: #fff !important;
}

body.contraste-ativo .locais-vacinacao-links .filter-search-type {
    background-color: #000 !important;
    border-color: #fff !important;
}

body.contraste-ativo .programas-projetos-periodos__botao.nav-link,
body.contraste-ativo .programas-projetos-periodos__botao.nav-link span,
body.contraste-ativo .programas-projetos-periodos__botao.nav-link i {
    color: #fff !important;
    background-color: #000 !important;
    border-color: #fff !important;
}

body.contraste-ativo .programas-projetos-periodos__botao.nav-link.active,
body.contraste-ativo .programas-projetos-periodos__botao.nav-link.active span,
body.contraste-ativo .programas-projetos-periodos__botao.nav-link.active i {
    color: #000 !important;
    background-color: #fff !important;
}

body.contraste-ativo .bloco-bordas {
    border-color: #fff !important;
    color: #fff !important;
}

body.contraste-ativo .navbar-toggler-icon {
    filter: invert(100%) grayscale(100%) !important;
}

body.contraste-ativo .navbar-brand img,
body.contraste-ativo .card-service img,
body.contraste-ativo .btn-all-notices img,
body.contraste-ativo a.btn-all-notices img,
body.contraste-ativo .inicial,
body.contraste-ativo img.icon-left,
body.contraste-ativo img.icon-right,
body.contraste-ativo img.logo, 
body.contraste-ativo .network-img,
body.contraste-ativo img[src*="icon"] {
    filter: invert(100%) grayscale(100%) !important;
}

body.contraste-ativo .portal-accessibility__trigger img {
    filter: none !important;
}

body.contraste-ativo .logo-transparencia {
    content: url('/images/logo_transparencia_contraste_2024.png') !important;
}

/* Form Elements in High Contrast */
body.contraste-ativo input, 
body.contraste-ativo select, 
body.contraste-ativo textarea {
    background-color: #222 !important;
    color: #fff !important;
    border: 1px solid #fff !important;
}

/* Fix Mobile Menu in High Contrast */
body.contraste-ativo .modal-content {
    border: 1px solid #fff !important;
}

/* Modal Buscador Adjustments for Responsiveness */
#buscador_modal {
    width: 100%; 
    height: 100vh; 
    background: rgba(0,0,0,.5); 
    position: fixed; 
    top: 0% !important; 
    left: 0 !important;
    z-index: 2000; 
    display: none;
    align-items: center;
    justify-content: center;
}

.modal-buscador {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    width: 90% !important;
    max-width: 500px !important;
    height: auto !important;
    max-height: 90vh;
    background-color: #fff; 
    border-radius: 30px; 
    padding: 20px !important;
    margin: 0 auto;
    overflow-y: auto !important;
}

/* Zoom Control Range Styling */
input[type=range] {
    accent-color: #3458CE;
}

body.contraste-ativo input[type=range] {
    accent-color: #fff;
}

/* Componentes das paginas internas em alto contraste */
body.contraste-ativo .portal-info-card,
body.contraste-ativo .portal-info-card__icon,
body.contraste-ativo .filter-card,
body.contraste-ativo .filter-card__icon,
body.contraste-ativo .filter-period__separator,
body.contraste-ativo .file-list-card,
body.contraste-ativo .file-list-item,
body.contraste-ativo .portal-tabela,
body.contraste-ativo .portal-pagination .pagination,
body.contraste-ativo .portal-pagination .page-link,
body.contraste-ativo .programas-projetos-card,
body.contraste-ativo .programas-projetos-card__header,
body.contraste-ativo .programas-projetos-card__body,
body.contraste-ativo .projeto-detalhe-card,
body.contraste-ativo .projeto-detalhe-card__header,
body.contraste-ativo .emenda-card,
body.contraste-ativo .emenda-card-cabecalho,
body.contraste-ativo .emenda-card-corpo,
body.contraste-ativo .licitacao-card,
body.contraste-ativo .licitacao-card-cabecalho,
body.contraste-ativo .licitacao-card-corpo,
body.contraste-ativo .licitacao-card-rodape,
body.contraste-ativo .empenhos-chart-card,
body.contraste-ativo #chart-container,
body.contraste-ativo .empenhos-chart-legend-item,
body.contraste-ativo .estrutura-hero,
body.contraste-ativo .estrutura-pill,
body.contraste-ativo .estrutura-type-card,
body.contraste-ativo .estrutura-card,
body.contraste-ativo .estrutura-detail-card,
body.contraste-ativo .estrutura-toolbar,
body.contraste-ativo .estrutura-empty {
    background: #000 !important;
    border-color: #fff !important;
    box-shadow: none !important;
    color: #fff !important;
}

body.contraste-ativo .programas-projetos-legenda__item,
body.contraste-ativo .programas-projetos-accordion,
body.contraste-ativo .programas-projetos-accordion .accordion-item,
body.contraste-ativo .programas-projetos-accordion .accordion-button,
body.contraste-ativo .programas-projetos-accordion .accordion-button:not(.collapsed),
body.contraste-ativo .programas-projetos-accordion .accordion-button::after,
body.contraste-ativo .programas-projetos-accordion .accordion-body,
body.contraste-ativo .programas-projetos-accordion__projeto,
body.contraste-ativo .programas-projetos-accordion__tipo,
body.contraste-ativo .projeto-detalhe-status,
body.contraste-ativo .projeto-detalhe-info,
body.contraste-ativo .projeto-detalhe-info > div,
body.contraste-ativo .projeto-detalhe-vazio,
body.contraste-ativo .emenda-valor {
    background: #000 !important;
    border-color: #fff !important;
    box-shadow: none !important;
    color: #fff !important;
}

body.contraste-ativo .programas-projetos-accordion__projeto:hover,
body.contraste-ativo .programas-projetos-accordion__projeto:focus-visible {
    background: #fff !important;
    color: #000 !important;
    outline-color: #fff !important;
}

body.contraste-ativo .programas-projetos-accordion__projeto:hover span,
body.contraste-ativo .programas-projetos-accordion__projeto:hover i,
body.contraste-ativo .programas-projetos-accordion__projeto:focus-visible span,
body.contraste-ativo .programas-projetos-accordion__projeto:focus-visible i {
    color: #000 !important;
}

body.contraste-ativo .portal-info-card__icon,
body.contraste-ativo .file-list-left i,
body.contraste-ativo .file-list-arrow,
body.contraste-ativo .empenhos-chart-badge,
body.contraste-ativo .estrutura-icon,
body.contraste-ativo .estrutura-search-wrap i {
    color: #fff !important;
}

body.contraste-ativo .portal-info-card__icon,
body.contraste-ativo .link-publico-icone {
    border: 1px solid #fff !important;
}

body.contraste-ativo .link-publico-card .link-publico-acao {
    background: #000 !important;
    border: 2px solid #fff !important;
    border-radius: 999px !important;
    color: #fff !important;
}

body.contraste-ativo .link-publico-card .link-publico-acao:hover,
body.contraste-ativo .link-publico-card .link-publico-acao:focus-visible {
    background: #fff !important;
    color: #000 !important;
    outline: 2px solid #fff;
    outline-offset: 2px;
}

body.contraste-ativo .link-publico-card .link-publico-acao:hover span,
body.contraste-ativo .link-publico-card .link-publico-acao:hover i,
body.contraste-ativo .link-publico-card .link-publico-acao:focus-visible span,
body.contraste-ativo .link-publico-card .link-publico-acao:focus-visible i {
    border-color: #000 !important;
    color: #000 !important;
}

body.contraste-ativo .file-list-item,
body.contraste-ativo .portal-pagination .page-link {
    border-color: #fff !important;
}

body.contraste-ativo .file-list-item:hover,
body.contraste-ativo .file-list-item:focus-visible,
body.contraste-ativo .portal-pagination .page-link:hover,
body.contraste-ativo .portal-pagination .page-link:focus,
body.contraste-ativo .portal-pagination .page-item.active .page-link,
body.contraste-ativo .filter-card__submit:hover,
body.contraste-ativo .filter-card__submit:focus-visible,
body.contraste-ativo .acoes-relacao__item:hover,
body.contraste-ativo .acoes-relacao__item:focus-visible {
    background: #fff !important;
    border-color: #fff !important;
    color: #000 !important;
    outline-color: #fff !important;
}

body.contraste-ativo .file-list-item:hover span,
body.contraste-ativo .file-list-item:hover i,
body.contraste-ativo .file-list-item:focus-visible span,
body.contraste-ativo .file-list-item:focus-visible i,
body.contraste-ativo .portal-pagination .page-link:hover span,
body.contraste-ativo .portal-pagination .page-link:focus span,
body.contraste-ativo .portal-pagination .page-item.active .page-link,
body.contraste-ativo .portal-pagination .page-item.active .page-link span,
body.contraste-ativo .filter-card__submit:hover span,
body.contraste-ativo .filter-card__submit:hover i,
body.contraste-ativo .filter-card__submit:focus-visible span,
body.contraste-ativo .filter-card__submit:focus-visible i,
body.contraste-ativo .acoes-relacao__item:hover span,
body.contraste-ativo .acoes-relacao__item:hover i,
body.contraste-ativo .acoes-relacao__item:focus-visible span,
body.contraste-ativo .acoes-relacao__item:focus-visible i {
    color: #000 !important;
}

body.contraste-ativo .portal-pagination .page-item.disabled .page-link {
    background: #000 !important;
    border-color: #fff !important;
    color: #fff !important;
    opacity: 0.7;
}

body.contraste-ativo .portal-tabela .table {
    --bs-table-bg: #000;
    --bs-table-color: #fff;
    --bs-table-border-color: #fff;
    --bs-table-striped-bg: #000;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #fff;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #fff;
    --bs-table-hover-color: #000;
    background: #000 !important;
    color: #fff !important;
}

body.contraste-ativo .portal-tabela thead th,
body.contraste-ativo .portal-tabela tbody td {
    background: #000 !important;
    border-color: #fff !important;
    color: #fff !important;
}

body.contraste-ativo .portal-tabela tbody tr:hover,
body.contraste-ativo .portal-tabela tbody tr:hover td,
body.contraste-ativo .portal-tabela tbody tr:hover td span,
body.contraste-ativo .portal-tabela tbody tr:hover td b,
body.contraste-ativo .portal-tabela tbody tr:hover a {
    background: #fff !important;
    color: #000 !important;
}

body.contraste-ativo .filter-search-type,
body.contraste-ativo .filter-search-type i,
body.contraste-ativo .filter-option,
body.contraste-ativo .filter-option i {
    background: #000 !important;
    border-color: #fff !important;
    color: #fff !important;
}

body.contraste-ativo .filter-search-type:hover,
body.contraste-ativo .filter-search-type:focus-visible,
body.contraste-ativo .filter-search-type:hover span,
body.contraste-ativo .filter-search-type:hover i,
body.contraste-ativo .filter-search-type:focus-visible span,
body.contraste-ativo .filter-search-type:focus-visible i {
    background: #fff !important;
    color: #000 !important;
}

body.contraste-ativo .filter-card .select2-container .select2-selection--single,
body.contraste-ativo .filter-card .select2-container .select2-selection__rendered,
body.contraste-ativo .select2-dropdown,
body.contraste-ativo .select2-results__option {
    background: #000 !important;
    border-color: #fff !important;
    color: #fff !important;
}

body.contraste-ativo .select2-container--default .select2-results__option--highlighted[aria-selected],
body.contraste-ativo .select2-container--default .select2-results__option[aria-selected='true'] {
    background: #fff !important;
    color: #000 !important;
}

body.contraste-ativo .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #fff transparent transparent transparent !important;
}

body.contraste-ativo .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #fff transparent !important;
}

body.contraste-ativo input::placeholder,
body.contraste-ativo textarea::placeholder,
body.contraste-ativo .select2-selection__placeholder {
    color: #fff !important;
    opacity: 1;
}

body.contraste-ativo input[type='date']::-webkit-calendar-picker-indicator {
    filter: invert(1) grayscale(1);
}

body.contraste-ativo .links-publicos-lista--downloads .file-list-custom-scrollbar {
    background: #fff !important;
}

body.contraste-ativo .links-publicos-lista--downloads .file-list-custom-scrollbar__thumb {
    background: #777 !important;
    border: 1px solid #fff;
    box-shadow: none;
}

body.contraste-ativo .empenhos-chart-badge,
body.contraste-ativo .estrutura-icon {
    background: #000 !important;
    border: 1px solid #fff !important;
}

body.contraste-ativo .estrutura-hero::before {
    background: #fff !important;
}

body.contraste-ativo .estrutura-scroll-area.is-scrollable::after {
    background: linear-gradient(180deg, transparent, #000 82%) !important;
}

body.contraste-ativo .estrutura-scroll-area.is-scrollable {
    scrollbar-color: #fff #000;
}

/* Busca principal e retorno para a pagina inicial */
body.contraste-ativo .search-form {
    background: #000 !important;
    border: 1px solid #fff !important;
    border-right: 0 !important;
}

body.contraste-ativo #busca-principal {
    background: #000 !important;
    border: 0 !important;
    color: #fff !important;
    outline: 0 !important;
}

body.contraste-ativo #busca-principal:focus {
    box-shadow: inset 0 0 0 2px #fff !important;
}

body.contraste-ativo .search-form + .search-button {
    background: #000 !important;
    border: 1px solid #fff !important;
    border-left: 0 !important;
    color: #fff !important;
}

body.contraste-ativo .search-form + .search-button i {
    color: #fff !important;
}

body.contraste-ativo .search-form + .search-button:hover,
body.contraste-ativo .search-form + .search-button:focus-visible {
    background: #fff !important;
    color: #000 !important;
    outline: 2px solid #fff;
    outline-offset: 2px;
}

body.contraste-ativo .search-form + .search-button:hover i,
body.contraste-ativo .search-form + .search-button:focus-visible i {
    color: #000 !important;
}

body.contraste-ativo .link-home {
    background: #000 !important;
    border: 2px solid #fff !important;
    box-shadow: none !important;
    color: #fff !important;
}

body.contraste-ativo .link-home .inicial,
body.contraste-ativo .link-home-icon,
body.contraste-ativo .link-home-icon i {
    background: #000 !important;
    border-color: #fff !important;
    color: #fff !important;
    filter: none !important;
}

body.contraste-ativo .link-home-icon {
    border: 1px solid #fff !important;
    box-shadow: none !important;
}

body.contraste-ativo .link-home:hover,
body.contraste-ativo .link-home:focus-visible {
    background: #fff !important;
    color: #000 !important;
    outline: 2px solid #fff;
    outline-offset: 2px;
}

body.contraste-ativo .link-home:hover .inicial,
body.contraste-ativo .link-home:hover .link-home-icon,
body.contraste-ativo .link-home:hover .link-home-icon i,
body.contraste-ativo .link-home:focus-visible .inicial,
body.contraste-ativo .link-home:focus-visible .link-home-icon,
body.contraste-ativo .link-home:focus-visible .link-home-icon i {
    background: #fff !important;
    border-color: #000 !important;
    color: #000 !important;
}
