/*
 * custom.css — CSS escrito à mão do tema govbr.
 *
 * Complementa o Tailwind (css/output.css) com o que não dá para expressar em
 * utilities: pseudo-elementos com ícones do Font Awesome, resets pontuais do
 * preflight e ajustes de conteúdo vindo do editor.
 *
 * Os ícones abaixo dependem do plugin Font Awesome (ativo em rede); o tema não
 * embute mais uma cópia própria.
 */

/* ---------------------------------------------------------------------------
 * Font Awesome — família das fontes
 * ------------------------------------------------------------------------- */

/*
 * Estas regras pediam 'Font Awesome 6 Free', uma família que o plugin nunca
 * serviu: hoje ele entrega a 7.2.0, que declara "Font Awesome 7 Free" e mantém
 * "Font Awesome 5 Free" por compatibilidade — nenhuma delas é a 6. Resultado:
 * todo ícone de ::before/::after do tema ficava sem desenhar.
 *
 * A cadeia abaixo cobre as versões que o plugin pode servir, então trocar a
 * versão dele no wp-admin não quebra os ícones de novo. Ícones aplicados por
 * classe (<i class="fas fa-x">) não passam por aqui — o plugin cuida deles.
 */
:root {
    --govbr-fa-family: "Font Awesome 7 Free", "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome;
}

/* ---------------------------------------------------------------------------
 * Alpine.js
 * ------------------------------------------------------------------------- */

/* Esconde elementos com x-show/x-cloak até o Alpine inicializar, evitando que
   menu lateral e abas apareçam por um instante no carregamento. */
[x-cloak] {
    display: none !important;
}

/* ---------------------------------------------------------------------------
 * Acessibilidade — foco visível
 * ------------------------------------------------------------------------- */

/* O preflight do Tailwind remove o outline padrão do browser, e o tema só
   redefinia foco em alguns botões — navegar por teclado ficava quase invisível.
   :focus-visible atinge só a navegação por teclado, sem contornar o clique. */
a:focus-visible,
button:focus-visible,
[role="tab"]:focus-visible,
summary:focus-visible {
    outline: 2px solid #1D4ED8;
    outline-offset: 2px;
    border-radius: 2px;
}

.dark a:focus-visible,
.dark button:focus-visible,
.dark [role="tab"]:focus-visible,
.dark summary:focus-visible {
    outline-color: #FFFFFF;
}

/* ---------------------------------------------------------------------------
 * Serviços — ícones dos títulos e estado aberto/fechado
 * ------------------------------------------------------------------------- */

.servicos-mais-acessados h4::before {
    content: "\f7e4";
    font-family: var(--govbr-fa-family);
    font-size: 1rem;
    color: #EF5E25;
    font-weight: bold;
    padding-right: 12px;
}

.servicos-destaques h4::before {
    content: "\f005";
    font-family: var(--govbr-fa-family);
    font-size: 1rem;
    color: #FFBE2E;
    font-weight: bold;
    padding-right: 12px;
}

.servico-fechado::after,
.servico-aberto::after {
    font-family: var(--govbr-fa-family);
    font-size: 1rem;
    color: rgb(30 58 138);
    font-weight: bold;
    padding-left: 12px;
}

.servico-fechado::after {
    content: "\f107";
}

.servico-aberto::after {
    content: "\f106";
}

/* ---------------------------------------------------------------------------
 * <details>/<summary> — usado em single-servicos.php
 * ------------------------------------------------------------------------- */

details {
    margin-top: 10px;
    margin-bottom: 10px;
}

details > summary {
    list-style-type: none;
}

details > summary::before {
    content: "\f105"; /* seta para a direita */
    font-family: var(--govbr-fa-family);
    font-size: 1.2rem;
    color: rgb(30 58 138);
    font-weight: bold;
    padding-right: 12px;
}

details[open] > summary {
    margin-bottom: 0.5rem;
}

details[open] > summary::before {
    content: "\f107"; /* seta para baixo */
}

/* ---------------------------------------------------------------------------
 * Vídeos
 * ------------------------------------------------------------------------- */

.secao-videos iframe,
.single-videos iframe {
    width: 100%;
    height: 100%;
}

.post-type-archive-videos .thumbnail-image img {
    max-width: none !important;
}

/* ---------------------------------------------------------------------------
 * Paginação
 * ------------------------------------------------------------------------- */

.pagination .prev::before {
    content: "\f104";
    font-family: var(--govbr-fa-family);
    font-weight: 700;
}

.pagination .next::before {
    content: "\f105";
    font-family: var(--govbr-fa-family);
    font-weight: 700;
}

.pagination .page-numbers {
    border-radius: 40px;
    color: #1D4ED8;
    display: inline-block;
    font-size: 1rem;
    line-height: 1;
    margin: 0 .5rem;
    padding: 8px 12px;
    text-align: center;
    text-decoration: none;
    transition: all .15s ease;
}

.pagination .page-numbers:hover {
    background-color: #DBEAFE;
    color: #1D4ED8;
}

.pagination .nav-links .current {
    padding: 8px 12px;
    background-color: #3B82F6;
    border-radius: 100%;
    color: #fff;
}

.search .navigation,
.archive .navigation {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.sdm_pagination {
    text-align: center;
}

/* ---------------------------------------------------------------------------
 * Conteúdo do editor — o preflight do Tailwind zera listas e margens, que
 * precisam voltar dentro do corpo do post (.leading-7).
 * ------------------------------------------------------------------------- */

.leading-7 ul,
.leading-7 ol {
    list-style-type: revert;
    list-style-position: inside;
    margin: 1em 0;
}

.leading-7 ul li,
.leading-7 ol li {
    padding-left: 1.5rem;
}

.leading-7 ul#cursos {
    list-style-type: none;
    margin: 1em 0;
}

.leading-7 p {
    margin-bottom: 17px;
}

.justificar-texto {
    text-align: justify;
}

/* ---------------------------------------------------------------------------
 * Blocos e mídia
 * ------------------------------------------------------------------------- */

.wp-block-table.is-style-regular table {
    border-collapse: collapse;
    width: 100%;
}

.wp-block-table.is-style-regular td,
.wp-block-table.is-style-regular th {
    padding: .5em;
    border: 1px solid;
    word-break: normal;
}

.aligncenter {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

div.secao-slider ul.slides li img {
    margin-top: 0 !important;
}

/* Embeds de redes sociais: centralizados e com largura contida. */
iframe.flickr-embed-frame,
iframe.instagram-media,
figure .twitter-timeline {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 300px;
}

.lb_redes_sociais {
    height: 430px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    overflow: auto;
    width: 360px;
    max-width: 100%;
    text-align: center;
}