/* --- FOLHA DE ESTILOS PERSONALIZADA PARA A REVISTA E&S (VERSÃO UNIFICADA E CORRIGIDA) --- */

/* --- 1. FONTES E CORES BASE --- */

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@700&family=Roboto:wght@400;700&display=swap');

body {
    font-family: 'Roboto', sans-serif;
    color: #212529;
    background-color: #787878;
    padding-top: 30px;
    padding-bottom: 30px;
}

a { color: #0072bc; }
a:hover { color: #005a93; }


/* --- 2. LAYOUT EM BLOCO --- */

.pkp_structure_page {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    background-color: #ffffff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.pkp_head_wrapper {
    max-width: 1200px;
    margin: 0 auto;
}


/* --- 3. CABEÇALHO E NAVEGAÇÃO --- */

.pkp_structure_head {
    background-color: #000077;
    background-image: none !important;
}

.pkp_navigation_primary a,
.pkp_navigation_user > li > a,
.pkp_search_desktop {
    text-transform: uppercase;
    font-size: 0.9em;
    font-weight: 700;
    padding: 15px;
    color: #ffffff !important;
    transition: background-color 0.3s ease;
}

.pkp_navigation_primary li:hover > a,
.pkp_navigation_user > li > a,
.pkp_search_desktop:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.pkp_navigation_primary ul,
.pkp_navigation_user ul {
    background-color: #f7f7f7;
    border: 1px solid #e0e0e0;
    border-top: 3px solid #000077;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.pkp_navigation_primary ul a,
.pkp_navigation_user ul a {
    color: #000077 !important;
    font-weight: bold;
}

.pkp_navigation_primary ul a:hover,
.pkp_navigation_user ul a:hover {
    color: #ffffff !important;
    background-color: #000077;
    border-left: 3px solid #ff0000 !important;
    padding-left: 17px;
}


/* --- 4. HIERARQUIA DE TÍTULOS --- */

/* H1 - Título Principal da Página */
.pkp_structure_main h1 {
    font-family: 'Lora', Georgia, serif;
    font-size: 32px;
    font-weight: 700;
    color: #000077;
    line-height: 1.3;
    margin-bottom: 20px;
    border-bottom: 2px solid #eeeeee;
    padding-bottom: 15px;
}

/* H2/H3 - Títulos de Secção (Conteúdo Principal) */
/* Seletor atualizado para funcionar na página inicial e na página da edição */
.current_issue > h2, 
.sections .section > h2,
.sections .section > h3 {
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #ffffff !important;
    text-transform: uppercase;
    background-color: #000077;
    padding: 10px 20px;
    border-radius: 4px;
    margin-top: 40px;
    margin-bottom: 25px;
    border-bottom: none;
    line-height: 1.5;
}

/* H3/H4 - Títulos de Artigos no Sumário */
/* Seletor atualizado para incluir H3 e H4 */
.obj_article_summary h3.title a,
.obj_article_summary h4.title a {
    font-family: 'Lora', Georgia, serif;
    font-size: 20px;
    color: #000077;
    line-height: 1.4;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.3s ease;
}

.obj_article_summary h3.title a:hover,
.obj_article_summary h4.title a:hover {
    color: #5b5b5b;
    text-decoration: underline;
}


/* --- 5. CARDS DE ARTIGO E METADADOS --- */

/* * ATUALIZAÇÃO SOLICITADA: 
 * O estilo de card do sumário foi substituído pelo 
 * estilo da REAMEC (fundo cinza no hover).
 */

/* Prepara o item do artigo para a transição */
.obj_article_summary {
   padding-top: 0.5em;
   padding-left: 1em;
   padding-right: 0.5em;
   border-radius: 5px;
   transition: all 0.5s ease-out; /* Animação suave */
   
   /* Mantém estilos do CSS original que não conflitam */
   border: 1px solid #e0e0e0;
   margin-bottom: 25px;
}

/* O efeito ao passar o mouse (Estilo REAMEC) */
.obj_article_summary:hover, 
.obj_article_summary:focus {
   background: #f0f0f0; /* Fundo cinza claro no hover */
   border-radius: 5px;
   box-shadow: 5px 5px 5px 0px #d9d9d9; /* Sombra suave */
   padding-top: 0.5em;
   padding-left: 1em;
   padding-right: 0.5em;
   transition: all 0.5s ease-in;
   transform: none; /* Remove o translateY(-5px) do estilo original */
   cursor: pointer;
}


.obj_article_summary .authors {
    font-size: 1em;
    color: #555555;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.obj_article_summary .authors .fa-users {
    margin-right: 8px;
    font-size: 1.1em;
}

.obj_article_summary .authors sup img {
    height: 16px;
    width: auto;
    vertical-align: middle;
    margin-left: 2px;
}

.article-summary-doi {
    margin-top: 10px;
    padding-top: 0;
    border-top: none;
    display: flex;
    align-items: center;
}

.article-summary-doi .item.doi img {
    display: inline-block !important;
    height: 16px;
    width: auto;
    margin-right: 5px;
}

.article-summary-doi .value a {
    font-size: 1em;
    color: #555555;
    text-decoration: none;
}

.article-summary-doi .value a:hover {
    text-decoration: underline;
    color: #000077;
}

.obj_article_summary .viewsartigo,
.obj_article_summary .viewspdf {
    font-size: 0.8em;
    color: #999999;
    display: inline-block;
    margin-top: 15px;
}

.obj_article_summary .viewsartigo::after {
    content: "|";
    margin: 0 10px;
    color: #cccccc;
}

.obj_galley_link.pdf {
    background-color: #000077;
    color: #ffffff !important;
    font-weight: bold;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.obj_galley_link.pdf:hover {
    background-color: #ff0000;
}


/* --- 6. BARRA LATERAL --- */

.pkp_block.block_make_submission .content { padding: 0 !important; }

.pkp_block.block_make_submission .block_make_submission_link {
    display: block !important;
    background-color: #000077 !important;
    color: #ffffff !important;
    padding: 10px 20px !important;
    text-align: center !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border-bottom: none !important;
}

.pkp_block.block_make_submission .block_make_submission_link:hover {
    background-color: #ff0000 !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    transform: translateY(-2px);
}

.pkp_block.block_make_submission h2.title { display: none !important; }

/* * ATUALIZAÇÃO SOLICITADA: 
 * O título do bloco da barra lateral foi modificado 
 * para o estilo da REAMEC (linha inferior).
 */
.pkp_structure_sidebar .pkp_block h2.title {
    font-family: 'Roboto', sans-serif !important;
    font-size: 1.1em !important;
    font-weight: 700 !important;
    color: #333333 !important;
    text-transform: uppercase !important;
    background: none !important;
    padding: 0 0 10px 0 !important;
    margin-top: 30px !important;
    margin-bottom: 15px !important;
    /* Linha modificada para 3px e cor da E&S */
    border-bottom: 3px solid #000077 !important; 
    text-align: left !important;
    display: inline-block; /* Adicionado para o estilo da linha */
}

.pkp_structure_sidebar .pkp_block:first-child h2.title { margin-top: 0 !important; }
.pkp_block.block_web_feed { display: none !important; }

/* --- 16. ESTILIZAÇÃO COMPLETA DO RODAPÉ --- */
/* ... (Todo o seu código de rodapé existente permanece aqui) ... */

.pkp_footer_content > center, 
.pkp_footer_content > p,
.pkp_footer_content > h3 {
    display: none !important;
}

#novo-rodape-customizado {
    width: 100%;
    text-align: center;
}
#novo-rodape-customizado h3 {
    font-family: 'Lora', Georgia, serif !important;
    font-size: 18px !important;
    color: #000077 !important;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 10px !important;
    margin-bottom: 15px !important;
    text-align: left;
}
#novo-rodape-customizado p,
#novo-rodape-customizado a {
    font-family: 'Roboto', sans-serif !important;
}
.footer-visitas-hero {
    background-color: #000077;
    padding: 30px 20px;
}
.footer-visitas-hero .footer-section-title {
    font-family: 'Lora', Georgia, serif;
    font-size: 22px;
    color: #ffffff;
}
.footer-visitas-hero img {
    max-width: 100%;
    height: auto;
    width: 550px;
    margin-top: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    border: none !important;
}
.footer-indexadores {
    background-color: #ffffff;
    padding: 40px 0;
    border-bottom: 1px solid #e0e0e0;
}
.footer-indexadores .footer-section-title {
    font-family: 'Lora', Georgia, serif;
    color: #000077; /* Corrigido */
    margin-bottom: 30px;
    font-size: 22px;
}
.slider-container-css {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}
.slider-track-css {
    display: inline-block;
    animation: marquee 40s linear infinite;
}
.slider-track-css a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 80px;
    margin: 0 15px;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all 0.3s ease;
}
.slider-track-css a:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.1);
}
.slider-track-css img {
    max-width: 120px;
    max-height: 60px;
    border: none !important;
}
.slider-container-css:hover .slider-track-css {
    animation-play-state: paused;
}
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.footer-info-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    padding: 40px 20px;
    align-items: start;
    max-width: 1200px;
    margin: 0 auto;
}
.footer-contato p {
    font-size: 0.9em;
    line-height: 1.6;
    color: #555;
    text-align: left;
}
.footer-logos-coluna {
    text-align: center;
}
.footer-logos-coluna img {
    display: block;
    margin: 0 auto 30px auto;
    max-width: 160px;
    border: none !important;
}
.pkp_brand_footer {
    display: none !important;
}
@media (max-width: 768px) {
    .footer-info-grid {
        grid-template-columns: 1fr;
    }
    .footer-logos-coluna {
        margin-top: 30px;
    }
}


/* ==================================================================
 * INÍCIO DAS NOVAS REGRAS (ESTILO REAMEC - ETAPA 1)
 * Adicionado ao final do arquivo para sobrescrever o padrão.
 * ================================================================ */

/* * 1.1: Página do Artigo (Caixinhas Cinzas)
 * --------------------------------------------------------------- 
 */

/* Remove as bordas padrão do OJS que podem ter sobrado */
.obj_article_details .entry_details,
.obj_article_details .row,
.obj_article_details .main_entry,
.obj_article_details .entry_details .item {
    border: none;
}

/* Cria a "caixinha" para cada item (Licença, Edição, etc.) */
.obj_article_details .entry_details .item {
    background: #f9f9f9; /* Fundo cinza claro da caixa */
    border-radius: 3px;
    box-shadow: 0 0 1px rgba(0,0,0,0.4);
    margin: 2rem 0; /* Espaçamento entre as caixinhas */
    padding: 0;
}

/* Cria o "cabeçalho" cinza mais escuro para cada caixinha */
.obj_article_details .entry_details .item > .label,
.obj_article_details .entry_details .sub_item:first-child > .label {
    background: #f0f0f0; /* Fundo cinza do cabeçalho da caixa */
    padding: 0.5em 1.43rem;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    font-weight: 700;
    text-transform: uppercase;
}

/* Estiliza o conteúdo dentro da caixinha */
.obj_article_details .entry_details .item > .value,
.obj_article_details .entry_details .sub_item .value {
    padding: 1.43rem;
}

/* Ajustes para a capa da edição (para não ter fundo) */
.obj_article_details .entry_details .item.cover_image {
    background: none;
    box-shadow: none;
}


/* * 1.2: Página do Artigo (Linha Personalizada no Resumo)
 * --------------------------------------------------------------- 
 */

.obj_article_details .main_entry .label {
    display: block;
    padding-bottom: 0.35rem;
    border-bottom: 3px solid #000077; /* <<< COR ATUALIZADA para a cor da E&S */
    color: #333; /* Cor do texto "Resumo" */
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.1em;
}

/* Remove a linha de "Como Citar" e "Palavras-chave" para não conflitarem */
.obj_article_details .main_entry .doi .label,
.obj_article_details .main_entry .keywords .label {
    border: none;
    text-transform: none;
    font-size: 1rem;
    font-weight: bold;
}


/* * 1.3: Efeito de 'hover' (fade-in) e Sombra nas Capas (VERSÃO CORRIGIDA 3)
 * --------------------------------------------------------------- 
 */

/* 1. Define o estado inicial das 3 capas, o tempo da transição E A SOMBRA PROJETADA */
.obj_article_details .entry_details .item.cover_image img,
.obj_issue_toc .cover img,
.obj_issue_summary .cover img {
    opacity: 0.8; /* Inicia um pouco transparente */
    transform: translateY(0);
    
    /* a) Tempo mais lento: 0.7 segundos */
    transition: all 0.7s ease-in-out; 
    
    /* b) Sombra projetada discreta (inferior direito) */
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.15);
}

/* 2. Define o estado :hover (quando o mouse está sobre a imagem) */
.obj_article_details .entry_details .item.cover_image img:hover,
.obj_issue_toc .cover img:hover,
.obj_issue_summary .cover img:hover {
    opacity: 1.0; /* Ação: Fica totalmente visível */
    transform: translateY(-8px); /* Efeito extra: "levanta" a capa */
    
    /* Sombra de "hover" mais forte para dar profundidade */
    box-shadow: 0 10px 20px rgba(0,0,0,0.1); 
}

/* ==================================================================
 * ETAPA 2: ÍCONES (ORCID, LATTES, DOI) NA PÁGINA DO ARTIGO
 * (Usando URLs externos da REAMEC devido à restrição de upload)
 * ================================================================ */

/* --- Ícone do DOI na página do artigo --- */
.obj_article_details .item.doi .value:before {
   content: url('https://rematec.net.br/index/DOI.png');
   margin-right: 5px; /* Espaçamento */
}

/* --- Ícone do Lattes na página do artigo (REGRA MAIS GERAL) --- */
.obj_article_details .lattes:before {
   content: url('https://rematec.net.br/index/lattes.png');
   margin-right: 5px; /* Espaçamento */
}

/* --- Ícone do ORCID na página do artigo (REGRA MAIS GERAL) --- */
.obj_article_details .orcid:before {
   content: url('https://www.rematec.net.br/index/orcid.png'); 
   margin-right: 5px; /* Espaçamento */
}

/* --- Oculta o ícone padrão feio do ORCID (se houver) --- */
.obj_article_details .orcid_icon {
    display: none !important; 
}

/* --- Alinhamento dos ícones com os links --- */
.obj_article_details .authors .orcid,
.obj_article_details .authors .lattes,
/* Adiciona as classes gerais ao alinhamento */
.obj_article_details .orcid,
.obj_article_details .lattes {
    display: inline-flex; /* Alinha o ícone e o link */
    align-items: center;  /* Alinha verticalmente */
    font-size: 0.9em; /* Tamanho do texto do link */
    line-height: 1.5;
}

.obj_article_details .item.doi .value {
   display: flex;
   align-items: center;
}