/*
 * portal-ui.css -- componentes públicos comuns aos dois portais de Murici.
 * Arquivo idêntico em murici-leg/assets/css e murici-leg-transparencia/public/assets/css.
 * As cores vêm de render_theme_css_vars(): identidade, brasões e conteúdo não mudam aqui.
 */
:root { --pt-marca: var(--brand-primary, #1b7a3a); --pt-marca-escura: var(--brand-secondary, #0f5c2a); --pt-linha: #d9e3dc; --pt-suave: #475569; --pt-superficie: #fff; --pt-fundo-suave: #f3f8f4; --pt-texto: #0f172a; }
:is(body.dark-mode, [data-bs-theme="dark"] body) { --pt-linha: #334155; --pt-suave: #cbd5e1; --pt-superficie: #1a1f3a; --pt-fundo-suave: #161b33; --pt-texto: #e8eef7; }

/* Texto longo nunca vaza da caixa */
main h1, main h2, main h3, main td, main dd { overflow-wrap: anywhere; }

/* Alvos de toque */
@media (hover: none), (max-width: 991.98px) {
  main .btn:not(.btn-close), main .page-link, main .form-control, main .form-select { min-height: 44px; }
  main .btn-sm { display: inline-flex; align-items: center; justify-content: center; }
}

main li > a { display: inline-block; min-height: 24px; }
main input[type="checkbox"], main input[type="radio"] { min-width: 24px; min-height: 24px; }
main form .btn { max-width: 100%; white-space: normal; }
main form .col-md-1:has(> .btn), main form .col-md-1.d-grid { flex: 0 0 auto; width: auto; }
html:not(.a11y-alto-contraste):not([data-bs-theme="dark"]) footer.bg-light .text-muted { color: #495057 !important; }

/* Filtros: rótulo visível, criado por portal-ui.js a partir do nome acessível do campo */
.pt-rotulo { display: block; font-size: .8rem; font-weight: 600; color: var(--pt-suave); margin-bottom: .25rem; }
.pt-filtro-botao { display: none; }
@media (max-width: 767.98px) {
  .pt-filtro-botao { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; margin-bottom: .75rem; }
  form.pt-filtro-recolhido { display: none !important; }
  .export-actions { flex-direction: row !important; }
  .export-actions .btn { flex: 1 1 28%; padding-inline: .4rem; }
}

/* Tabelas: valor em uma linha, cabeçalho fixo na rolagem horizontal e cartões no celular */
main table td.pt-valor { white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Tabela não parte número no meio e rola em vez de cortar a última coluna */
main table td { overflow-wrap: break-word; }
.table-responsive { overflow-x: auto !important; }
@media (max-width: 767.98px) {
  table.pt-cartoes thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  table.pt-cartoes, table.pt-cartoes tbody { display: block; width: 100%; }
  table.pt-cartoes tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem .75rem; padding: .65rem .8rem; margin-bottom: .6rem; border: 1px solid var(--pt-linha); border-radius: 10px; background: var(--pt-superficie); }
  table.pt-cartoes td { display: block; min-width: 0; padding: 0 !important; border: 0 !important; text-align: left !important; white-space: normal !important; background: transparent !important; color: inherit; line-height: 1.3; font-size: .92rem; }
  table.pt-cartoes td::before { content: attr(data-pt-rotulo); display: block; font-size: .74rem; font-weight: 600; color: var(--pt-suave); }
  table.pt-cartoes td.pt-largo, table.pt-cartoes td[data-pt-rotulo=""] { grid-column: 1 / -1; }
  table.pt-cartoes td[data-pt-rotulo=""]::before { content: none; }
  table.pt-cartoes td:empty { display: none; }
  table.pt-cartoes td:has(> a.btn, > .btn-group) { grid-column: 1 / -1; }
  table.pt-cartoes td .badge { max-width: 100%; white-space: normal; text-align: left; }
  .table-responsive:has(> table.pt-cartoes) { overflow: visible !important; border: 0; box-shadow: none; }
  main table:not(.pt-cartoes) { font-size: .84rem; }
}

/* Barra de acessibilidade do topo: uma linha com rolagem no celular, sem empurrar o conteúdo */
@media (max-width: 767.98px) {
  .accessbar .access-items, .top-links-wrap { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; justify-content: flex-start !important; }
  .accessbar .access-items > *, .top-links-wrap > * { flex: none; }
}

/* Motion UI discreto: só com JavaScript e sem preferência por movimento reduzido */
@media (prefers-reduced-motion: no-preference) {
  .pt-js .pt-revelar { opacity: 0; transform: translateY(8px); transition: opacity .28s ease-out, transform .28s ease-out; }
  .pt-js .pt-revelar.pt-visivel { opacity: 1; transform: none; }
  main a.btn, main button.btn, .pt-tile, .pt-acesso { transition: transform .12s ease-out, box-shadow .16s ease-out, border-color .16s ease-out, background-color .16s ease-out; }
  main a.btn:active, main button.btn:active, .pt-tile:active, .pt-acesso:active { transform: translateY(1px); }
}

/* Acessos e blocos */
.pt-secao { margin-bottom: 1.75rem; }
.pt-secao > h2 { display: flex; align-items: center; gap: .5rem; font-size: 1.3rem; font-weight: 800; margin: 0 0 .85rem; color: var(--pt-texto); }
.pt-acessos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: .75rem; list-style: none; margin: 0; padding: 0; }
.pt-acesso { display: flex; align-items: center; gap: .75rem; height: 100%; min-height: 76px; padding: .85rem 1rem; color: var(--pt-texto); text-decoration: none; background: var(--pt-superficie); border: 1px solid var(--pt-linha); border-left: 4px solid var(--pt-marca); border-radius: 10px; }
.pt-acesso:hover, .pt-acesso:focus-visible { border-color: var(--pt-marca); box-shadow: 0 6px 16px rgba(15, 23, 42, .1); color: var(--pt-texto); }
.pt-acesso i { font-size: 1.5rem; color: var(--pt-marca); flex: none; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .pt-acesso i, :is(body.dark-mode, [data-bs-theme="dark"] body) .pt-tile i { color: #6fcf95; }
.pt-acesso strong { display: block; line-height: 1.25; }
.pt-acesso small { display: block; color: var(--pt-suave); line-height: 1.3; }
.pt-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr)); gap: .6rem; list-style: none; margin: 0; padding: 0; }
.pt-tile { display: flex; align-items: center; gap: .6rem; height: 100%; min-height: 56px; padding: .55rem .75rem; color: var(--pt-texto); text-decoration: none; background: var(--pt-superficie); border: 1px solid var(--pt-linha); border-radius: 10px; }
.pt-tile:hover, .pt-tile:focus-visible { border-color: var(--pt-marca); color: var(--pt-texto); box-shadow: 0 4px 12px rgba(15, 23, 42, .08); }
.pt-tile i { font-size: 1.15rem; color: var(--pt-marca); flex: none; }
.pt-tile strong { display: block; font-size: .94rem; line-height: 1.2; font-weight: 700; }
.pt-tile small { display: block; font-size: .78rem; color: var(--pt-suave); line-height: 1.25; }
@media (max-width: 575.98px) { .pt-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pt-acessos { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pt-acesso { flex-direction: column; align-items: flex-start; gap: .35rem; } }
.pt-dobra { border: 1px solid var(--pt-linha); border-radius: 12px; background: var(--pt-superficie); margin-bottom: 1rem; }
.pt-dobra > summary { display: flex; align-items: center; gap: .5rem; min-height: 52px; padding: .75rem 1rem; font-weight: 700; cursor: pointer; color: var(--pt-texto); }
.pt-dobra > summary small { font-weight: 400; color: var(--pt-suave); }
.pt-dobra > .pt-dobra-corpo { padding: 0 1rem 1rem; }
.pt-painel { background: var(--pt-superficie); border: 1px solid var(--pt-linha); border-radius: 12px; }
.pt-numeros { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr)); gap: .5rem 1rem; margin: 0 0 1.5rem; padding: .75rem 1rem; }
.pt-numeros dt { font-size: .78rem; font-weight: 600; color: var(--pt-suave); }
.pt-numeros dd { margin: 0; font-weight: 700; color: var(--pt-texto); }
@media (max-width: 575.98px) { .pt-numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Páginas novas no modo escuro do portal */
:is(body.dark-mode, [data-bs-theme="dark"] body) .cj-filtro, :is(body.dark-mode, [data-bs-theme="dark"] body) .cj-ano, :is(body.dark-mode, [data-bs-theme="dark"] body) .obra-bloco, :is(body.dark-mode, [data-bs-theme="dark"] body) .cj-vazio, :is(body.dark-mode, [data-bs-theme="dark"] body) .work-card, :is(body.dark-mode, [data-bs-theme="dark"] body) .meta-item, :is(body.dark-mode, [data-bs-theme="dark"] body) .decl-card, :is(body.dark-mode, [data-bs-theme="dark"] body) .empty-box { background: var(--pt-superficie) !important; color: var(--pt-texto); border-color: var(--pt-linha) !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .cj-hero, :is(body.dark-mode, [data-bs-theme="dark"] body) .obra-hero, :is(body.dark-mode, [data-bs-theme="dark"] body) .cj-ano > h2 { background: var(--pt-fundo-suave); color: var(--pt-texto); }
:is(body.dark-mode, [data-bs-theme="dark"] body) .cj-dados dt, :is(body.dark-mode, [data-bs-theme="dark"] body) .obra-dados dt { color: var(--pt-suave); }

/* Página inicial do Portal Institucional no celular: blocos de atalho compactos. O texto completo continua no computador. */
@media (max-width: 575.98px) {
  .acessos-section, .phase1-section, .highlight-section, .services-section, .news-section, .institutional-section, .radar-section { padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
  .phase1-section .mb-5, .highlight-section .mb-5, .services-section .mb-5, .institutional-section .mb-5 { margin-bottom: .75rem !important; }
  .phase1-section .row, .highlight-section .row, .services-section .row { --bs-gutter-x: .6rem; --bs-gutter-y: .6rem; }
  .phase1-section .row > [class*="col"], .highlight-section .row > [class*="col"], .services-section .row > [class*="col"] { flex: 0 0 50%; max-width: 50%; }
  .phase1-card, .highlight-card, .service-box { padding: .8rem !important; height: 100%; }
  .phase1-card p, .highlight-card p, .service-box p { display: none; }
  .phase1-icon, .highlight-icon { width: 36px !important; height: 36px !important; font-size: 1rem !important; margin-bottom: .4rem !important; }
  .phase1-card h3, .highlight-card h3, .service-box h3 { font-size: .98rem !important; margin-bottom: .2rem !important; }
  .phase1-card a, .highlight-card a, .service-box a { display: inline-flex; align-items: center; min-height: 44px; font-size: .86rem; }
  .section-subtitle { font-size: .92rem; margin-bottom: 0; }
  .section-title { font-size: 1.5rem !important; }
  .acesso-banner-img { height: 96px !important; object-fit: cover; }
  .acesso-banner-corpo { padding: .75rem !important; }
  .acesso-banner-corpo p { display: none; }
  .acesso-banner-corpo h3 { font-size: 1rem !important; }
  .acesso-banner-botoes { flex-direction: row !important; flex-wrap: wrap; gap: .4rem; }
  .acesso-banner-botoes .btn { flex: 1 1 45%; font-size: .86rem; padding-inline: .4rem; }
  .hero-shortcuts-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: .4rem !important; }
  .hero-shortcut-card { padding: .5rem .25rem !important; font-size: .78rem !important; min-height: 72px; }
  .news-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: stretch; }
  .news-card .news-img { width: 96px !important; height: 100% !important; min-height: 84px; object-fit: cover; }
  .news-card .p-3 { padding: .6rem .7rem !important; }
  .site-footer .sf-map-frame { height: 190px !important; }
}

@media (prefers-reduced-motion: reduce) { *, ::before, ::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

/* Tema escuro vale também para os blocos com cor própria de cada página. O alto contraste fica em alto-contraste.css. */
:is(body.dark-mode, [data-bs-theme="dark"] body) .menubar .nav-link.active { color: #fff !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .sf-lai-pill { color: #0f5c2a !important; background: #e0f0e7 !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.breadcrumb, nav:has(> .breadcrumb), div:has(> nav > .breadcrumb), div:has(> .breadcrumb)) { background: #0f172a !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.acessos-section, .destaque) { background: #0f172a !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) div:has(> nav > .breadcrumb) :is(h1, h2, h3, p):not(.card *), :is(body.dark-mode, [data-bs-theme="dark"] body) div:has(> .breadcrumb) :is(h1, h2, h3, p):not(.card *) { color: #e8eef7 !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.menubar, .navbar) { background-color: #1a1f3a !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .acesso-banner-corpo h3, :is(body.dark-mode, [data-bs-theme="dark"] body) .navbar-brand { color: #e8eef7 !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .breadcrumb-item a { color: #8fe0ae !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .breadcrumb-item.active { color: #e8eef7 !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.card-box, .lgpd-card, .search-box, .result-card, .filter-card, .meta-item, .info-tile, .cal-item, .cal-footer, .body-busca, .bg-light, .phase1-card, .highlight-card, .service-box, .calbox-header) { background: var(--pt-superficie) !important; border-color: var(--pt-linha) !important; color: var(--pt-texto) !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.card-box, .lgpd-card, .search-box, .result-card, .filter-card, .meta-item, .info-tile, .cal-item, .cal-footer, .body-busca, .bg-light, .phase1-card, .highlight-card, .service-box, .calbox-header) :is(h1, h2, h3, h4, h5, h6, p, li, label, strong, .fw-bold, .meta-label, .meta-value) { color: var(--pt-texto) !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.card-box, .lgpd-card, .search-box, .result-card, .filter-card, .meta-item, .info-tile, .cal-item, .cal-footer, .body-busca, .bg-light, .phase1-card, .highlight-card, .service-box, .calbox-header) .text-muted { color: var(--pt-suave) !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-dark, .btn-outline-lrf):not(:hover, :focus, :active, .active) { color: #8fe0ae !important; border-color: #8fe0ae !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) :is(.search-meta, .cal-time) { color: var(--pt-suave) !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) main .badge-cat { color: #8fe0ae !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) a:not(.btn, .nav-link, .dropdown-item, .page-link, .badge, .navbar-brand, .link-map, header *, .site-top *, .menubar *, footer *, .link-list *, .data-item *) { color: #8fe0ae; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .text-success { color: #6fcf95 !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .badge.text-secondary { color: var(--pt-suave) !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) main .nav-link:not(.active) { color: #8fe0ae !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) main .nav-link.active { color: #fff !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) .table tfoot { background-color: var(--pt-fundo-suave) !important; }
:is(body.dark-mode, [data-bs-theme="dark"] body) tfoot :is(th, td) { background: var(--pt-fundo-suave) !important; color: var(--pt-texto) !important; }
