/*
 * brand-root-override.css
 * ─────────────────────────────────────────────────────────
 * Drop this file into any project to override the brand system's
 * compiled defaults at runtime — no recompile needed.
 *
 * Only override what you need. Tints/darks are auto-computed
 * via color-mix() from the base vars, but you can pin them
 * explicitly here if the project requires exact approved values.
 * ─────────────────────────────────────────────────────────
 */

:root {

    /* ── Core brand palette ─────────────────────────────── */
    --brand-primary: #FFF101;
    --brand-secondary: #F1CC48;
    --brand-accent: #E9ECEF;

    /* ── General ────────────────────────────────── */
    /* Page background color — overrideable at runtime */
    --brand-bg-body: #fff; /* light gray base */
    --brand-scrollbar: var(--brand-dark);

    /*For CSS background pattern*/
    --brand-bg-pattern-color: rgba(0, 0, 0, 0.03);
    --brand-bg-pattern-dot-size: 1px;
    --brand-bg-pattern-size: 20px;

    --brand-linear-gradient: linear-gradient(180deg, rgba(0, 0, 0, 0.69) 9%, rgba(0, 0, 0, 0.00) 41%);

    --brand-link-color: var(--brand-dark);
    --brand-link-hover-color: var(--brand-primary);
    --brand-border-radius: 0;

    /* ── Typography ─────────────────────────────────────── */
    --brand-title-color: var(--brand-dark);
    --brand-font-family-body: 'Ubuntu', sans-serif;
    --brand-font-weight-base: 500;

    /* ── Bootstrap bridge vars ──────────────────────────── */
    --bs-primary: var(--brand-primary);
    --bs-secondary: var(--brand-secondary);
    --bs-nav-link-color: var(--brand-link-color);
    --bs-nav-link-hover-color: var(--brand-link-hover-color);
    --bs-link-color: var(--brand-link-color);
    --bs-link-hover-color: var(--brand-link-hover-color);
    --bs-border-radius: var(--brand-border-radius);
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-btn-border-radius: var(--brand-border-radius);
    --border-radius: 0;
}

.navigation-main li:first-child {
    display: none;
}

.content-header--information .nav-link {
    --nav-link-color: var(--brand-light);
}

.nav-communication .nav-link, .nav-resources .nav-link {
    --nav-link-font-weight: normal;
}

.dj-slide-desc-bg {
    background-color: transparent !important;
}

.dj-slide-description {
    color: var(--brand-dark) !important;
    font-weight: bold;
    font-size: 1rem;
}

.aside-nav ul:where(.mod-menu__sub[aria-hidden=true]) {
    display: block !important;
}

.aside-nav .nav li .mod-menu__sub .nav-item:last-child {
    border-bottom: none;
}

.bibliographic-release-highlights .card-bibliographic-release {
    min-height: 270px;
}

.card-other-book p{
    font-size: .75rem;
    color: var(--brand-gray);
}

.card-other-book--image {
    height: 200px;
    object-position: top;
    object-fit: contain;
}

.card-other-book--image img {
    height: 100%;
}

.resources-menu li > a{
    display:flex;
    align-items:center;
}
.resources-menu .mod-menu__sub span:first-child{
    order:2;
}
.resources-menu .mod-menu__sub span:last-child{
    order:1;
}
/* ── Paginação ──────────────────────────────────────────
 * O <ul class="pagination ms-0 mb-4"> vem do core
 * (joomla/layouts/joomla/pagination/list.php) e as utilities do Bootstrap
 * são !important — daí a centragem por justify-content e o espaçamento
 * vertical ir para o wrapper.
 */
.pagination__wrapper,
.com-content-category-blog__pagination,
.com-finder__pagination {
    display: flex;
    justify-content: center;
}

.pagination__wrapper {
    margin-block: 1.5rem 2.5rem;
}

.pagination {
    --pagination-color: #1A1D20;
    --pagination-border-color: #8A8E94;
    --pagination-disabled-color: #A8ACB1;
    --pagination-border-radius: 6px;

    justify-content: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-block: 0 !important;
}

/* o core colapsa as bordas e só arredonda as pontas do grupo */
.pagination .page-item:not(:first-child) .page-link {
    margin-left: 0;
}

.pagination .page-item > .page-link,
.pagination .page-item > a,
.pagination .page-item > span {
    border-radius: var(--pagination-border-radius);
}

.pagination .page-link,
.pagination a {
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
    color: var(--pagination-color);
    background-color: var(--brand-white);
    border: 1px solid var(--pagination-border-color);
}

.pagination .page-item:not(.active):not(.disabled) .page-link:hover,
.pagination .page-item:not(.active):not(.disabled) a:hover {
    color: var(--pagination-color);
    background-color: #F1F2F4;
    border-color: var(--pagination-color);
}

.pagination .page-link:focus-visible,
.pagination a:focus-visible {
    outline: 3px solid var(--brand-dark);
    outline-offset: 2px;
}

.pagination .page-item.active .page-link,
.pagination .page-item.active a {
    color: var(--brand-dark);
    background-color: var(--brand-secondary);
    border-color: #D9AF1F;
    font-weight: 700;
}

/* desativados: o CSS compilado usa a cor do texto como fundo e tapa o ícone */
.pagination .page-item.disabled > span,
.pagination .page-item.disabled > .page-link {
    color: var(--pagination-disabled-color);
    background-color: transparent;
    border: 1px solid #D2D5D9;
    opacity: 1;
}

/* o Joomla emite .icon-angle-* mas o template não carrega o mapeamento
   de ícones do Joomla — mapear para o Font Awesome 6 que já é carregado */
.pagination [class*="icon-angle"]::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: .95em;
    line-height: 1;
    display: inline-block;
}

.pagination .icon-angle-double-left::before  { content: "\f100"; }
.pagination .icon-angle-left::before         { content: "\f104"; }
.pagination .icon-angle-right::before        { content: "\f105"; }
.pagination .icon-angle-double-right::before { content: "\f101"; }

/* contador "Página X de Y", quando ativo */
.com-content-category-blog__counter,
.com-finder__counter {
    float: none !important;
    margin: 0;
    padding: 0 0 .25rem;
    text-align: center;
    font-size: .9375rem;
    color: #52575C;
}

/* ── Regulamento Interno ────────────────────────────────
   O número de cada ponto saía a amarelo sobre o fundo claro (~1,1:1).
   O amarelo só entra como fundo: número escuro numa pastilha amarela. */
.regulations .reg-point__ref {
    display: inline-block;
    padding: 0 .35em;
    color: var(--brand-dark);
    background-color: var(--brand-primary);
    line-height: 1.5;
}