/* 1. FORÇA o fundo cinza em toda a área visível do navegador */
html,
body {

    margin: 0;
    padding: 0;
    /* background-color: #f0f2f5 !important; */
    background-color: #6e7a86 !important;
    /* A cor de fundo da página */
}

/* 2. MUITO IMPORTANTE: Remove o fundo branco do container principal do OJS */
/* Este passo é essencial para que o fundo cinza do body apareça */
#pkp_container {
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* 3. A MÁGICA ACONTECE AQUI: Cria o card branco para o conteúdo da página */
.pkp_structure_page {
    max-width: 1250px;
    /* Largura máxima do card */
    margin: 40px auto;
    /* Centraliza o card e adiciona espaço em cima/baixo */

    background-color: #ffffff;
    /* O fundo branco do card */
    border-radius: 40px;
    /* Bordas arredondadas */
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.4);
    /* Sombra para o efeito flutuante */
    /*padding: 30px;  Espaçamento interno */
}

/* 4. Removemos as sombras e margens do cabeçalho, pois ele agora está dentro do card */
.pkp_structure_head {
    margin-bottom: 30px;
    box-shadow: none;
    border-bottom: 1px solid #eee;
    /* Linha sutil para separar do conteúdo */
    padding-bottom: 20px;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    background: #BBE3A8 !important;
}

.pkp_structure_head .pkp_head_wrapper {
    width: 100% !important;
}

/* 5. Organiza o conteúdo principal e a sidebar DENTRO do card */
.pkp_structure_content {
    display: flex;
}

main.page,
#main-content {
    flex: 1;
    /* Ocupa o espaço disponível */
    padding-right: 5px;
    /* Espaço entre o conteúdo e a sidebar */
}

.pkp_sidebar,
#sidebar {
    width: 200px;
    /* Largura fixa da sidebar */
    flex-shrink: 0;
    /* Impede que a sidebar encolha */
}

/* 6. Ajusta o rodapé dentro do card */
.pkp_structure_footer {
    padding-top: 10px;
    margin-top: 10px;
}

/* INICIO - MENU NO TOPO */
#pkpDropdown0 {
    text-transform: uppercase;
}

#navigationPrimary a {
    color: rgba(0, 0, 0, 0.54) !important;
    font-weight: 600;
}

.pkp_navigation_search_wrapper a {
    color: #248040 !important;
}

.pkp_navigation_search_wrapper a:hover {
    border-color: #248040 !important;
}

.pkp_navigation_primary {
    max-width: 85% !important;
}

.pkp_navigation_primary .pkp_nav_list li a {
    text-transform: uppercase !important;
}

.pkp_navigation_primary>li>a:hover {
    border-color: #248040 !important;
}

.pkp_navigation_primary>li>a:focus {
    background: transparent !important;
}

.pkp_navigation_primary_wrapper .dropdown-menu {
    background: #fff !important;
}

.pkp_site_nav_menu {
    position: relative;
    bottom: 0px;
    top: 20px;
    background: #DDD !important;
}

.pkp_site_nav_menu .pkp_nav_list {
    margin-left: 10px !important;
}

.pkp_navigation_user_wrapper {
    top: -300px
}

.pkp_navigation_user_wrapper #pkpDropdown4 {
    position: relative !important;
    /* top: -54px !important; */
    font-weight: 600 !important;
}

.pkp_navigation_user_wrapper #navigationUser a {
    font-weight: 600;
    color: rgba(0, 0, 0, 0.54) !important;
}

.pkp_navigation_user_wrapper .dropdown-menu {
    position: relative !important;
    top: 5px !important;
    transform: translate3d(0px, 0px, 0px) !important;
    background: #fff !important;
}


.pkp_navigation_user>li>a:focus {
    background: transparent !important;
}

/* FIM */

.pkp_structure_footer_wrapper {
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    color: #212121;
}

.pkp_footer_content {
    padding: 0 2.142rem 0 2.142rem !important;
}

.pkp_brand_footer {
    padding: 0 2.142rem 0 2.142rem !important;
}

.pkp_brand_footer img.logo {
    filter: invert(0);
}

.pkp_brand_footer .svg-logo {
    background-color: #000100 !important;
}

/* INICIO - IDIOMA */
.locale_pt_BR a::before,
.locale_es_ES a::before,
.locale_en_US a::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 5px;
}

.locale_pt_BR a,
.locale_es_ES a,
.locale_en_US a {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 6px;
    text-align: center;
}

.locale_pt_BR a::before {
    background: url('https://rematec.net.br/index/flag/brazil.svg') no-repeat center/cover;
}

.locale_es_ES a::before {
    background: url('https://rematec.net.br/index/flag/spain.svg') no-repeat center/cover;
}

.locale_en_US a::before {
    background: url('https://rematec.net.br/index/flag/united-states-of-america.svg') no-repeat center/cover;
}

/* FIM */

.pkp_site_name_wrapper {
    height: 230px !important;
    display: flex;
    justify-content: center;
}

.pkp_site_name {
    width: 700px !important;
    height: 240px;
    position: relative;
    cursor: pointer;
    overflow: hidden;
}

.pkp_site_name .is_text {
    color: transparent !important;
}

.pkp_site_name::before,
.pkp_site_name::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: opacity 0.2s ease;

}

.pkp_site_name::after {
    background-image: url('https://i.imgur.com/kXeAy7j.png');
    opacity: 1;
}

.pkp_site_name::before {
    background-image: url('https://i.imgur.com/tUNt6nn.png');
    opacity: 0;
}

.pkp_site_name:hover::before {
    opacity: 1;
}

.pkp_site_name:hover::after {
    opacity: 0;
}

/* @media (min-width: 992px) {
    .pkp_site_name .is_img img {
        max-height: 130px !important;
    }

    #navigationPrimary a {
        color: rgba(0, 0, 0, 0.54) !important;
        font-weight: 600;
    }
}

@media (min-width: 992px) and (min-width: 992px) {
    .pkp_navigation_primary {
        max-width: 85% !important;
    }
} */

.pkp_site_name .is_img img {
    max-height: 130px !important;
}

.page p {
    text-align: justify !important;
}

.page .page_title {
    margin-bottom: 15px;
    border-bottom: 2px solid green;
    display: inline-block;
    padding-bottom: 5px;
}

/* Texto - Open Journal Systems */
.pkp_block a {
    color: #248040 !important
}

/* breadcrumb - Mosta o caminho da localização da tela */
.cmp_breadcrumbs a {
    color: #248040 !important
}

.pkp_structure_main .page h1 {
    border-bottom: 2px green solid !important;
    width: fit-content !important;
}

.titulo-section strong span {
    border-bottom: 2px green solid !important;
    font-size: 23px !important;
}

.pkp_footer_content a {
    color: #0c80d5 !important
}