/* ============================================================
   EDUCON — CSS Customizado OJS 3.5  (v9 — seletores verificados nos templates)

   Estrutura real (confirmada lendo os .tpl):

   HEADER
     header.pkp_structure_head
       div.pkp_head_wrapper
         div.pkp_site_name_wrapper > div.pkp_site_name
         nav.pkp_site_nav_menu
           ul#navigationPrimary.pkp_navigation_primary.pkp_nav_list > li > a
           ul#navigationPrimary > li > ul > li > a  (submenus, SEM .dropdown-menu)
           div.pkp_navigation_search_wrapper > input + button
           ul#navigationUser.pkp_navigation_user.pkp_nav_list > li > a

   TOC (Sumário da Edição)
     div.obj_issue_toc
       div.sections > div.section
         ul.cmp_article_list.articles > li > div.obj_article_summary
           h2.title / h3.title / h4.title > a
           div.meta > div.authors / div.pages
           ul.galleys_links > li > a.obj_galley_link[.pdf]

   ARTIGO
     article.obj_article_details
       h1.page_title
       div.row
         div.main_entry
           section.item.authors > h2.pkp_screen_reader + ul.authors > li
           section.item.doi     > h2.label + span.value > a
           section.item.keywords > h2.label + span.value
           section.item.abstract > h2.label + conteúdo HTML
           section.item.references > h2.label + div.value > p
           section.item.author_bios > h2.label + ul.authors > li.sub_item
         div.entry_details
           div.item.galleys > ul.value.galleys_links > li > a.obj_galley_link[.pdf]
           div.item.published > section.sub_item > h2.label + div.value
           div.item.issue > section.sub_item > h2.label + div.value
           div.item.copyright > h2.label + (ccLicenseBadge / a.copyright)

   Fontes: Merriweather (titulos) · Inter (UI) · Lora (editorial)
   ============================================================ */

/* Fontes auto-hospedadas em public/journals/1/fonts/.
   Antes vinham por @import do Google Fonts, que so' dispara DEPOIS de o CSS
   baixar — uma requisicao encadeada e bloqueante no caminho critico. Servidas
   do proprio dominio, chegam junto e sem dependencia de terceiro.
   Os subconjuntos latin/latin-ext cobrem portugues e ingles; o unicode-range
   preservado faz o navegador baixar so' o que a pagina usa. */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-400-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-400-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-500-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-500-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-600-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-600-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-700-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/inter-700-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/lora-400-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/lora-400-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/lora-400-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/lora-400-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/lora-600-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/lora-600-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Merriweather';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-400-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Merriweather';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-400-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-400-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-400-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-700-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-700-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-900-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('/revista/public/journals/1/fonts/merriweather-900-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ============================================================
   VARIAVEIS
   ============================================================ */
:root {
  --educon-azul:        #1a5aad;
  --educon-azul-hover:  #154d96;
  --educon-acento:      #4a9fd4;
  --educon-card-borda:  #b0c4de;
  --educon-ink:         #111111;
  --educon-muted:       #6b7280;
  --educon-borda:       #e5e7eb;
  --educon-radius:      2px;
  --educon-shadow:      0 1px 6px rgba(26,90,173,0.06);
  --educon-shadow-h:    0 5px 18px rgba(26,90,173,0.13);
}

/* ============================================================
   BASE
   ============================================================ */
body {
  font-family: 'Inter', sans-serif;
  color: var(--educon-ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

/* Headings globais — Merriweather como base;
   contextos específicos sobrescrevem via seletores mais especificos abaixo */
h1, h2, h3, h4, h5 {
  font-family: 'Merriweather', serif;
}

.pkp_structure_page,
.pkp_structure_content,
.pkp_structure_main,
.pkp_structure_sidebar,
main,
#main-content {
  background: #ffffff;
}

/* ============================================================
   NAVBAR — STICKY HEADER
   position:sticky mantém o header no fluxo do documento — o espaço
   inicial já está reservado naturalmente, sem precisar de padding-top
   no conteúdo abaixo. O menu dropdown mobile (position:absolute; top:100%)
   funciona dentro do contexto sticky sem nenhuma alteração.
   ============================================================ */

header.pkp_structure_head {
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 2px 12px rgba(26,90,173,0.30);
}

header.pkp_structure_head,
.pkp_head_wrapper,
.pkp_navigation_primary_row {
  background-color: var(--educon-azul);
  border-bottom: none;
  box-shadow: 0 3px 10px rgba(26,90,173,0.25);
}

/* Nome do site */
.pkp_site_name,
.pkp_site_name a,
.pkp_site_name .is_text {
  font-family: 'Merriweather', serif;
  font-size: 20px;
  font-weight: 900;
  color: #ffffff;
  text-decoration: none;
  line-height: 1.3;
}

.pkp_site_name_tagline {
  font-family: 'Inter', sans-serif;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  display: block;
}

/* Menu primario nivel 1
   OJS: ul#navigationPrimary.pkp_navigation_primary.pkp_nav_list > li > a
   Nao usar height fixa nem display:flex — usa padding vertical para nao quebrar */
#navigationPrimary > li > a,
.pkp_navigation_primary > li > a {
  font-family: 'Inter', sans-serif;
  font-size: 13px !important;
  font-weight: 700;
  color: rgba(255,255,255,0.9) !important;
  padding: 0.625rem 0.9rem !important;
  text-decoration: none !important;
  border-bottom: 3px solid transparent;
  transition: color 0.15s, background 0.15s, border-color 0.15s;
  display: inline-block;
}

#navigationPrimary > li > a:hover,
.pkp_navigation_primary > li > a:hover,
#navigationPrimary > li > a:focus,
.pkp_navigation_primary > li > a:focus {
  color: #ffffff !important;
  background: rgba(255,255,255,0.1) !important;
  border-bottom-color: #ffffff;
  text-decoration: none !important;
}

#navigationPrimary > li.current > a,
#navigationPrimary > li > a.current {
  color: #ffffff;
  border-bottom-color: #ffffff;
}

/* Submenus — OJS usa <ul> filho direto de <li>, SEM classe .dropdown-menu */
#navigationPrimary ul,
.pkp_navigation_primary ul {
  background: #ffffff;
  border: 1px solid var(--educon-borda);
  border-top: 3px solid var(--educon-azul);
  border-radius: 0 0 8px 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  padding: 0.375rem 0 !important;
  min-width: 210px;
}

#navigationPrimary ul a,
.pkp_navigation_primary ul a {
  font-family: 'Inter', sans-serif;
  font-size: 13px !important;
  font-weight: 500;
  color: var(--educon-ink) !important;
  padding: 0.55rem 1.25rem !important;
  display: block !important;
  border-bottom: none !important;
  text-decoration: none !important;
  transition: background 0.12s;
  background: transparent !important;
}

#navigationPrimary ul a:hover,
.pkp_navigation_primary ul a:hover {
  background: #eef4fc !important;
  color: var(--educon-azul) !important;
}

/* Campo de busca no nav */
.pkp_navigation_search_wrapper {
  display: flex;
  align-items: center;
  border: 1.5px solid rgba(255,255,255,0.55);
  border-radius: var(--educon-radius);
  overflow: hidden;
  background: rgba(255,255,255,0.12);
  height: 34px;
}

.pkp_navigation_search_wrapper input[type="text"],
.pkp_navigation_search_wrapper input[type="search"] {
  background: transparent;
  border: none;
  box-shadow: none;
  color: #ffffff;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  padding: 0 10px;
  height: 34px;
  outline: none;
  flex: 1;
  min-width: 0;
  border-radius: 0;
}

.pkp_navigation_search_wrapper input[type="text"]::placeholder,
.pkp_navigation_search_wrapper input[type="search"]::placeholder {
  color: rgba(255,255,255,0.6);
}

.pkp_navigation_search_wrapper button {
  background: rgba(255,255,255,0.2) !important;
  border: none !important;
  border-left: 1px solid rgba(255,255,255,0.35) !important;
  border-radius: 0 !important;
  color: #ffffff !important;
  font-family: 'Inter', sans-serif;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.4px;
  padding: 0 12px !important;
  height: 34px !important;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s;
}

.pkp_navigation_search_wrapper button:hover {
  background: rgba(255,255,255,0.35) !important;
}

.pkp_navigation_search_wrapper button .fa,
.pkp_navigation_search_wrapper button svg {
  color: #ffffff;
  fill: #ffffff;
}

/* Nav do usuario (Login / Registrar)
   OJS: ul#navigationUser.pkp_navigation_user > li > a */
#navigationUser > li > a,
.pkp_navigation_user > li > a {
  font-family: 'Inter', sans-serif;
  font-size: 12px !important;
  font-weight: 600;
  color: rgba(255,255,255,0.85) !important;
  padding: 4px 10px !important;
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: var(--educon-radius);
  text-decoration: none !important;
  transition: all 0.15s;
  background: transparent !important;
}

#navigationUser > li > a:hover,
.pkp_navigation_user > li > a:hover {
  background: rgba(255,255,255,0.1) !important;
  color: #ffffff !important;
}

#navigationUser ul,
.pkp_navigation_user ul {
  background: #ffffff;
  border: 1px solid var(--educon-borda);
  border-top: 3px solid var(--educon-azul);
  border-radius: 0 0 8px 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  padding: 0.375rem 0 !important;
}

#navigationUser ul a,
.pkp_navigation_user ul a {
  font-family: 'Inter', sans-serif;
  font-size: 13px !important;
  font-weight: 500;
  color: var(--educon-ink) !important;
  padding: 0.55rem 1.25rem !important;
  display: block !important;
  text-decoration: none !important;
  border: none;
  transition: background 0.12s;
  background: transparent !important;
}

#navigationUser ul a:hover,
.pkp_navigation_user ul a:hover {
  background: #eef4fc !important;
  color: var(--educon-azul) !important;
}

/* ============================================================
   AREA PRINCIPAL
   Nao alterar float/width — o OJS usa sistema de colunas proprio
   com pkp_structure_content (largura fixa centralizada) e
   pkp_structure_main (float:left width calculado) + pkp_structure_sidebar.
   Apenas adicionar padding/background interno sem quebrar o layout.
   ============================================================ */
.pkp_structure_main {
  padding: 2.5rem 1.75rem;
  background: #ffffff;
}

/* ============================================================
   TITULO DA EDICAO (TOC)
   ============================================================ */
.obj_issue_toc .heading h2,
h2.issue_title,
.issue_title {
  font-family: 'Merriweather', serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--educon-ink);
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0.375rem;
}

.obj_issue_toc .heading h2::after {
  content: '';
  display: block;
  height: 2px;
  width: 36px;
  background: var(--educon-acento);
  margin: 0.5rem 0 1.5rem;
  border-radius: 1px;
}

.pkp_issue_identifiers,
.issue_volume,
.issue_number,
.issue_year {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: var(--educon-muted);
  font-weight: 400;
}

/* Titulo das secoes dentro do TOC */
.obj_issue_toc .sections > .section > h2,
.obj_issue_toc .sections > .section > h3 {
  font-family: 'Merriweather', serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--educon-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: 1px solid var(--educon-borda);
  padding-bottom: 0.4rem;
  margin-bottom: 0.75rem;
}

/* ============================================================
   GRID DE ARTIGOS — CARDS
   Estrutura real: ul.cmp_article_list.articles > li > div.obj_article_summary
   li e o item do grid; .obj_article_summary ocupa 100% do li (equal height)
   ============================================================ */

ul.cmp_article_list.articles,
ul.articles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  align-items: stretch;
}

ul.cmp_article_list.articles > li,
ul.articles > li {
  display: flex !important;   /* flex para que o filho .obj_article_summary estique */
  min-width: 0;
}

/* Primeiro artigo ocupa as duas colunas */
ul.cmp_article_list.articles > li:first-child,
ul.articles > li:first-child {
  grid-column: 1 / -1;
}

/* Capa — ocultar imagem de capa nos cards */
.obj_article_summary .cover {
  display: none;
}

/* Card — ocupa 100% da altura do li para igualar alturas */
.obj_article_summary {
  background: #ffffff;
  border: 1px solid var(--educon-borda);
  border-radius: 4px;
  padding: 0;
  margin: 0 !important;
  width: 100%;
  position: relative;   /* ancora .pages absolute do tema */
  display: flex;
  flex-direction: column;
  box-shadow: var(--educon-shadow);
  overflow: hidden;
  transition: box-shadow 0.2s, transform 0.2s;
}

/* Cancelar clearfix do tema no card (conflita com display:flex) */
.obj_article_summary::before,
.obj_article_summary::after {
  content: none;
  display: none;
}

.obj_article_summary:hover {
  box-shadow: var(--educon-shadow-h);
  transform: translateY(-2px);
}

/* Titulo do card */
.obj_article_summary .title,
.obj_article_summary h2.title,
.obj_article_summary h3.title,
.obj_article_summary h4.title {
  font-family: 'Merriweather', serif;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.5;
  border-top: 3px solid var(--educon-card-borda);
  padding: 1.125rem 1.375rem 0.375rem;
  margin: 0;
  transition: border-top-color 0.2s;
}

.obj_article_summary:hover .title,
.obj_article_summary:hover h2.title,
.obj_article_summary:hover h3.title,
.obj_article_summary:hover h4.title {
  border-top-color: var(--educon-azul);
}

ul.cmp_article_list.articles > li:first-child .obj_article_summary .title,
ul.cmp_article_list.articles > li:first-child .obj_article_summary h2.title,
ul.cmp_article_list.articles > li:first-child .obj_article_summary h3.title,
ul.cmp_article_list.articles > li:first-child .obj_article_summary h4.title,
ul.articles > li:first-child .obj_article_summary .title,
ul.articles > li:first-child .obj_article_summary h2.title,
ul.articles > li:first-child .obj_article_summary h3.title,
ul.articles > li:first-child .obj_article_summary h4.title {
  border-top-color: var(--educon-azul);
  font-size: 15px;
}

.obj_article_summary .title a,
.obj_article_summary h2.title a,
.obj_article_summary h3.title a,
.obj_article_summary h4.title a {
  color: #1a2a4a !important;
  text-decoration: none !important;
  display: block;
  transition: color 0.15s;
}

.obj_article_summary .title a:hover {
  color: var(--educon-azul) !important;
}

.obj_article_summary .subtitle {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--educon-muted);
  margin-top: 0.2rem;
}

/* Metadados (autores, paginas, data) */
.obj_article_summary .meta {
  padding: 0.25rem 1.375rem 0;
  margin: 0;
}

.obj_article_summary .meta .authors {
  font-family: 'Inter', sans-serif;
  font-size: 11.5px;
  color: var(--educon-muted);
  font-weight: 400;
  line-height: 1.4;
  /* O tema coloca padding-right:5em para abrir espaço pro .pages absoluto;
     resetamos pois o nosso card tem layout diferente */
  padding-right: 0;
}

.obj_article_summary .meta .pages,
.obj_article_summary .meta .published {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  color: #c0c8d4;
  /* O tema em >=768px coloca position:absolute — recolocar no fluxo */
  position: static;
  line-height: 1.4;
}

/* Galley links no card
   ul.galleys_links > li > a.obj_galley_link[.pdf]
   .pdf e a classe CSS gerada pelo template, nao detectar por href */
.obj_article_summary ul.galleys_links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0.625rem 1.375rem 0.875rem;
  background: #fafbfc;
  border-top: 1px solid #f0f2f5;
  margin-top: 0.625rem;
  list-style: none;
}

.obj_article_summary ul.galleys_links li {
  margin: 0 !important;
  padding: 0;
}

.obj_article_summary ul.galleys_links a,
.obj_article_summary ul.galleys_links .obj_galley_link {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  padding: 4px 11px;
  border-radius: var(--educon-radius);
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.15s;
  background: #ffffff;
  color: var(--educon-azul);
  border: 1.5px solid var(--educon-azul);
  display: inline-block;
}

.obj_article_summary ul.galleys_links a.pdf,
.obj_article_summary ul.galleys_links .obj_galley_link.pdf {
  background: var(--educon-azul);
  color: #ffffff;
  border-color: var(--educon-azul);
}

.obj_article_summary ul.galleys_links a.pdf:hover,
.obj_article_summary ul.galleys_links .obj_galley_link.pdf:hover {
  background: var(--educon-azul-hover);
}

.obj_article_summary ul.galleys_links a:not(.pdf):hover,
.obj_article_summary ul.galleys_links .obj_galley_link:not(.pdf):hover {
  background: #eef4fc;
}

/* ============================================================
   BARRA LATERAL
   ============================================================ */
.pkp_block {
  background: #ffffff;
  border: 1px solid var(--educon-borda);
  border-top: 3px solid var(--educon-azul);
  border-radius: 0 0 8px 8px;
  padding: 1.25rem;
  margin-bottom: 1.5rem;
  box-shadow: var(--educon-shadow);
}

/* span.title dentro do .pkp_block (confirmado no sidebar.less) */
.pkp_block .title {
  font-family: 'Merriweather', serif;
  font-size: 14px !important;
  font-weight: 700;
  color: var(--educon-azul) !important;
  border-bottom: 1px solid var(--educon-borda);
  padding-bottom: 0.5rem;
  margin-bottom: 0.875rem;
  display: block !important;
}

/* ============================================================
   PAGINA DO ARTIGO
   ============================================================ */

article.obj_article_details {
  display: block;
  background: #ffffff;
}

.pkp_breadcrumbs,
nav.pkp_breadcrumbs {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: var(--educon-muted);
  margin-bottom: 1.125rem;
}

.pkp_breadcrumbs a {
  color: var(--educon-azul) !important;
  text-decoration: none !important;
}

/* Titulo h1.page_title */
article.obj_article_details h1.page_title {
  font-family: 'Merriweather', serif;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.45;
  color: #1a2a4a;
  margin: 0 0 1.375rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--educon-borda);
  display: block;
}

/* Subtitulo h2.subtitle */
article.obj_article_details h2.subtitle {
  font-family: 'Merriweather', serif;
  font-size: 17px;
  font-weight: 400;
  color: var(--educon-muted);
  margin-top: -0.75rem;
  margin-bottom: 1.375rem;
}

/* Layout div.row — NÃO alterar float/width do tema OJS.
   O tema já posiciona .main_entry e .entry_details com float:left.
   Aqui apenas ajustamos bordas e espaçamento interno. */
article.obj_article_details div.row {
  /* manter margens negativas e floats do tema — não sobrescrever */
  border-top: 1px solid var(--educon-borda);
  border-bottom: 1px solid var(--educon-borda);
}

article.obj_article_details div.row div.main_entry {
  /* sem alterações de float/width — OJS controla isso */
  box-sizing: border-box;
}

article.obj_article_details div.row div.entry_details {
  /* sem alterações de float/width — OJS controla isso */
  box-sizing: border-box;
  border-left: 1px solid var(--educon-borda);
  border-top: none;
}


/* ── main_entry ── */

article.obj_article_details .main_entry .item {
  margin-bottom: 1.5rem;
  padding-top: 0;
}

/* Labels h2.label — sobrescreve o h2 Merriweather global nesses contextos */
article.obj_article_details .main_entry .item h2.label,
article.obj_article_details .main_entry .item h2.pkp_screen_reader {
  font-family: 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--educon-azul);
  margin: 0 0 0.5rem;
  display: block;
  line-height: 1.4;
}

/* Autores */
article.obj_article_details .main_entry section.item.authors {
  margin-bottom: 1.25rem;
}

article.obj_article_details .main_entry ul.authors {
  list-style: none;
  padding: 0;
  margin: 0;
}

article.obj_article_details .main_entry ul.authors li {
  margin-bottom: 0.5rem;
}

article.obj_article_details .main_entry .authors .name {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #1a2a4a;
  display: block;
}

article.obj_article_details .main_entry .authors .affiliation {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: var(--educon-muted);
  display: block;
}

article.obj_article_details .main_entry .authors .userGroup,
article.obj_article_details .main_entry .authors .orcid {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  color: var(--educon-muted);
  display: inline-block;
}

/* DOI */
article.obj_article_details .main_entry section.item.doi span.value,
article.obj_article_details .main_entry section.item.doi a {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: var(--educon-azul) !important;
  word-break: break-all;
  text-decoration: none;
}

/* Palavras-chave — badges individuais clicáveis */
article.obj_article_details .main_entry section.item.keywords div.keyword_badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

article.obj_article_details .main_entry section.item.keywords a.keyword_badge {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  background: #e8f1fb;
  color: var(--educon-azul);
  border: 1px solid #b3cff0;
  border-radius: 20px;
  padding: 4px 13px;
  display: inline-block;
  line-height: 1.5;
  text-decoration: none;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  white-space: nowrap;
}

article.obj_article_details .main_entry section.item.keywords a.keyword_badge:hover {
  background: var(--educon-azul);
  color: #ffffff;
  border-color: var(--educon-azul);
}

/* Resumo */
article.obj_article_details .main_entry section.item.abstract {
  background: #f7fafd;
  border-left: 3px solid var(--educon-acento);
  border-radius: 0 4px 4px 0;
  padding: 1.125rem 1.375rem;
}

article.obj_article_details .main_entry section.item.abstract h2.label {
  background: transparent;
  padding: 0;
  border: none;
  margin-bottom: 0.625rem;
}

/* Abstract vem como HTML direto apos o label — sem wrapper .value */
article.obj_article_details .main_entry section.item.abstract p,
article.obj_article_details .main_entry section.item.abstract > *:not(h2) {
  font-family: 'Lora', serif;
  font-size: 14px;
  line-height: 1.85;
  color: #2d2d2d;
  text-align: justify;
  margin: 0;
}

/* Referencias */
article.obj_article_details .main_entry section.item.references h2.label {
  margin-bottom: 0.75rem;
}

article.obj_article_details .main_entry section.item.references .value p,
article.obj_article_details .main_entry section.item.references p {
  font-family: 'Lora', serif;
  font-size: 13px;
  line-height: 1.8;
  color: #374151;
  text-align: justify;
}

/* Biografias dos autores */
article.obj_article_details .main_entry section.item.author_bios .sub_item .label {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #1a2a4a;
}

article.obj_article_details .main_entry section.item.author_bios .sub_item .value {
  font-family: 'Lora', serif;
  font-size: 13px;
  color: var(--educon-muted);
  line-height: 1.7;
  text-align: justify;
}

article.obj_article_details .main_entry section.item.author_bios .sub_item .value p {
  text-align: justify;
  margin-top: 0;
}

/* ── entry_details ──
   Itens sao div.item com separador por border-bottom */
article.obj_article_details .entry_details .item {
  padding-bottom: 0.875rem;
  margin-bottom: 0.875rem;
  border-bottom: 1px solid #f0f2f5;
  padding-top: 0;
}

article.obj_article_details .entry_details .item:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

/* Labels h2.label na sidebar */
article.obj_article_details .entry_details h2.label,
article.obj_article_details .entry_details .sub_item h2.label {
  font-family: 'Inter', sans-serif;
  font-size: 9px !important;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #9ca3af;
  margin-bottom: 0.3rem;
  display: block !important;
  line-height: 1.4;
}

/* Valores da sidebar */
article.obj_article_details .entry_details .item .value,
article.obj_article_details .entry_details .sub_item .value {
  font-family: 'Lora', serif;
  font-size: 12.5px;
  color: #374151;
  line-height: 1.5;
  margin: 0;
}

article.obj_article_details .entry_details .item .value a,
article.obj_article_details .entry_details a.title {
  color: var(--educon-azul);
  text-decoration: none;
  font-family: 'Lora', serif;
  font-size: 12.5px;
}

article.obj_article_details .entry_details .item .value a:hover {
  color: var(--educon-azul-hover) !important;
  text-decoration: underline;
}

/* Copyright / Licenca */
article.obj_article_details .entry_details .item.copyright p,
article.obj_article_details .entry_details .item.copyright a.copyright,
article.obj_article_details .entry_details .item.citation p,
article.obj_article_details .entry_details .item.citation a {
  font-family: 'Lora', serif;
  font-size: 11.5px;
  color: var(--educon-muted) !important;
  line-height: 1.6;
  text-align: justify;
}

/* Galleys na entry_details
   div.item.galleys > ul.value.galleys_links > li > a.obj_galley_link[.pdf] */
article.obj_article_details .entry_details .item.galleys ul.galleys_links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

article.obj_article_details .entry_details .item.galleys ul.galleys_links li {
  padding: 0;
  margin: 0;
}

article.obj_article_details .entry_details .item.galleys a,
article.obj_article_details .entry_details .item.galleys .obj_galley_link {
  display: block;
  text-align: center;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding: 8px 10px;
  border-radius: var(--educon-radius);
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: all 0.15s;
  background: #ffffff;
  color: var(--educon-azul);
  border: 1.5px solid var(--educon-azul);
}

article.obj_article_details .entry_details .item.galleys a.pdf,
article.obj_article_details .entry_details .item.galleys .obj_galley_link.pdf {
  background: var(--educon-azul);
  color: #ffffff;
  border-color: var(--educon-azul);
}

article.obj_article_details .entry_details .item.galleys a.pdf:hover,
article.obj_article_details .entry_details .item.galleys .obj_galley_link.pdf:hover {
  background: var(--educon-azul-hover);
  border-color: var(--educon-azul-hover);
}

article.obj_article_details .entry_details .item.galleys a:not(.pdf):hover,
article.obj_article_details .entry_details .item.galleys .obj_galley_link:not(.pdf):hover {
  background: #eef4fc;
}

/* ============================================================
   FORMULARIOS
   ============================================================ */
input[type="text"],
input[type="email"],
input[type="search"],
select,
textarea {
  font-family: 'Inter', sans-serif;
  border: 1px solid var(--educon-borda) !important;
  border-radius: var(--educon-radius) !important;
  padding: 7px 11px !important;
  font-size: 13px !important;
  background: #ffffff !important;
  transition: border-color 0.15s;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus {
  border-color: var(--educon-azul);
  outline: none;
  box-shadow: 0 0 0 3px rgba(26,90,173,0.1);
}

.pkp_button_primary,
button[type="submit"],
input[type="submit"],
.cmp_button {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  background: var(--educon-azul);
  color: #ffffff;
  border: 1.5px solid var(--educon-azul);
  border-radius: var(--educon-radius);
  padding: 8px 18px;
  cursor: pointer;
  transition: background 0.15s;
}

.pkp_button_primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.cmp_button:hover {
  background: var(--educon-azul-hover);
  border-color: var(--educon-azul-hover);
}

/* ============================================================
   LINKS GLOBAIS
   ============================================================ */
a {
  color: var(--educon-azul);
  transition: color 0.15s;
}

a:hover {
  color: var(--educon-azul-hover);
}

/* ============================================================
   RODAPE
   ============================================================ */
.pkp_structure_footer_wrapper {
  background: #f3f4f6;
  border-top: 1px solid var(--educon-borda);
}

.pkp_structure_footer,
footer.pkp_structure_footer {
  color: var(--educon-muted);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
}

.pkp_footer_content {
  padding: 1.75rem 1.75rem 1.25rem;
}

.pkp_structure_footer img,
.pkp_structure_footer .agency_logo img {
  filter: none;
  opacity: 0.9;
  max-height: 40px;
  transition: opacity 0.2s;
}

.pkp_structure_footer img:hover {
  opacity: 1;
}

.pkp_structure_footer_wrapper .pkp_block,
.pkp_structure_footer .pkp_block {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 1.25rem;
}

.pkp_structure_footer a {
  color: var(--educon-azul) !important;
  text-decoration: none !important;
}

.pkp_structure_footer a:hover {
  color: var(--educon-azul-hover) !important;
}

.pkp_brand_footer,
.pkp_structure_footer .pkp_brand {
  font-size: 11px;
  color: #c0c4cb;
  padding: 0.875rem 1.75rem;
  border-top: 1px solid var(--educon-borda);
}

/* ============================================================
   CARDS — DOI BADGE
   ============================================================ */
.obj_article_summary .card_doi {
  padding: 0 1.375rem;
  margin-top: 0.25rem;
}

.obj_article_summary .card_doi a {
  font-family: 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 500;
  color: var(--educon-azul) !important;
  text-decoration: none !important;
  word-break: break-all;
  line-height: 1.4;
  opacity: 0.75;
  transition: opacity 0.15s;
}

.obj_article_summary .card_doi a:hover {
  opacity: 1;
  text-decoration: underline !important;
}

/* ============================================================
   COMO CITAR — entry_details
   ============================================================ */
article.obj_article_details .entry_details .item.how_to_cite {
  padding-bottom: 0.875rem;
  margin-bottom: 0.875rem;
  border-bottom: 1px solid #f0f2f5;
  padding-top: 0;
}

article.obj_article_details .entry_details .item.how_to_cite h2.label {
  font-family: 'Inter', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #9ca3af;
  margin-bottom: 0.5rem;
  display: block;
  line-height: 1.4;
}

.citation_text {
  background: #f8f9fb;
  border: 1px solid var(--educon-borda);
  border-left: 3px solid var(--educon-azul);
  border-radius: 0 4px 4px 0;
  padding: 0.75rem 0.875rem;
  font-family: 'Lora', serif;
  font-size: 11.5px;
  line-height: 1.7;
  color: #374151;
  text-align: justify;
  word-break: break-word;
}

.citation_text strong {
  font-weight: 600;
}

.btn_copy_citation {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 0.5rem;
  padding: 5px 12px;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3px;
  color: #ffffff;
  background: var(--educon-azul);
  border: 1.5px solid var(--educon-azul);
  border-radius: var(--educon-radius);
  cursor: pointer;
  text-transform: uppercase;
  transition: background 0.15s, transform 0.1s;
  line-height: 1.4;
}

.btn_copy_citation:hover {
  background: var(--educon-azul-hover);
  border-color: var(--educon-azul-hover);
  transform: translateY(-1px);
}

.btn_copy_citation:active {
  transform: translateY(0);
}

.btn_copy_citation .fa {
  font-size: 12px;
}

/* ============================================================
   NAVEGAÇÃO — VOLTAR AO SUMÁRIO
   ============================================================ */
.article_nav {
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 2px solid #e8f1fb;
}

.back_to_issue {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0.5rem 1rem;
  background: #f0f4f8;
  color: var(--educon-azul);
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.back_to_issue:hover {
  background: #d6e4f0;
  color: var(--educon-azul-hover);
}

.back_to_issue .fa {
  font-size: 11px;
}

/* ============================================================
   REFERÊNCIAS — hanging indent para melhor legibilidade
   ============================================================ */
article.obj_article_details .main_entry section.item.references .value p {
  padding-left: 2em;
  text-indent: -2em;
  margin-bottom: 0.4rem;
}

/* ============================================================
   RESPONSIVIDADE
   ============================================================ */

/* Ocultar aviso "A revista não está aceitando submissões neste momento." */
.page_submissions .cmp_notification {
  display: none;
}

/* ──────────────────────────────────────────────
   BOTÃO BUSCAR — corrigir ícone sobrepondo texto
   OJS aplica .cmp_button_icon que cria o ícone via ::after absoluto
   e usa padding-right largo. Com nosso reset global de button[type="submit"]
   o layout quebra. Garantimos posicionamento correto aqui.
   ─────────────────────────────────────────────── */
.page_search .submit button.submit {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px 8px 18px;
  /* Remover padding-right extra gerado pelo .cmp_button_icon */
  padding-right: 18px;
  padding-left: 18px;
  background: var(--educon-azul);
  color: #ffffff;
  border: 1.5px solid var(--educon-azul);
  border-radius: var(--educon-radius);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.15s;
}

.page_search .submit button.submit:hover {
  background: var(--educon-azul-hover);
  border-color: var(--educon-azul-hover);
}

/* Ocultar o pseudo-elemento ::after que cria o ícone FontAwesome sobreposto */
.page_search .submit button.submit::after {
  display: none;
}

/* Nav mobile: links empilhados */
@media (max-width: 899px) {
  #navigationPrimary > li > a,
  .pkp_navigation_primary > li > a {
    display: block !important;
    height: auto;
    padding: 0.65rem 1rem !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    border-left: none !important;
  }

  .pkp_navigation_search_wrapper {
    margin: 0.5rem 0;
  }
}

/* Tablet/mobile: coluna unica */
@media (max-width: 768px) {
  ul.cmp_article_list.articles,
  ul.articles {
    grid-template-columns: 1fr;
  }

  ul.cmp_article_list.articles > li:first-child,
  ul.articles > li:first-child {
    grid-column: 1;
  }

  /* No mobile o tema OJS já empilha .main_entry e .entry_details;
     apenas ajustar border para separação visual */
  article.obj_article_details div.row div.entry_details {
    border-left: none;
    border-top: 1px solid var(--educon-borda);
  }

  .pkp_structure_main {
    padding: 1.5rem 1rem;
  }

  .citation_text {
    font-size: 11px;
    padding: 0.625rem 0.75rem;
  }

  .article_nav {
    margin-top: 1rem;
    text-align: center;
  }
}


/* ============================================================
   ACESSIBILIDADE
   Acrescentado na migração para o tema-filho (fase 04).
   Bloco aditivo: não altera nenhuma regra acima.
   ============================================================ */

:root {
  /* Altura aproximada do cabeçalho fixo. É daqui que sai o deslocamento das
     âncoras — sem isso, clicar num link interno deixa o destino escondido
     atrás da barra. Se a altura do cabeçalho mudar, ajuste aqui. */
  --educon-navbar-h: 64px;
}

/* Foco visível em tudo que recebe teclado.
   O tema padrão do OJS não marca foco em vários controles, o que deixa quem
   navega por Tab sem saber onde está. :focus-visible mostra o anel para
   teclado e o oculta para clique de mouse, que é o comportamento esperado. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--educon-acento);
  outline-offset: 2px;
  border-radius: var(--educon-radius);
}

/* Âncoras internas não podem parar sob o cabeçalho fixo. */
html { scroll-padding-top: calc(var(--educon-navbar-h) + 1rem); }
[id] { scroll-margin-top: calc(var(--educon-navbar-h) + 1rem); }

/* Quem pediu menos movimento no sistema operacional não recebe animação.
   Este é um dos poucos usos legítimos de !important: a regra precisa vencer
   qualquer transição declarada depois, inclusive as do tema padrão. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Sublinhado volta no hover e no foco. Não é enfeite: quando a cor é o único
   sinal de que há um link, a WCAG 1.4.1 não se dá por satisfeita. */
.pkp_structure_main a:hover,
.pkp_structure_main a:focus-visible {
  text-decoration: underline;
}

/* ============================================================
   ESTOURO HORIZONTAL
   Conteúdo largo (tabelas, imagens, código, DOIs longos) rolava a página
   inteira para o lado em telas estreitas. Agora rola dentro do próprio bloco.
   ============================================================ */

.pkp_structure_main img,
.pkp_structure_main video,
.pkp_structure_main iframe { max-width: 100%; height: auto; }

.pkp_structure_main table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
}

.pkp_structure_main pre { overflow-x: auto; }

/* URLs e DOIs sem espaço quebram o layout em telas pequenas. */
.pkp_structure_main a[href^="http"],
.pkp_structure_main .doi,
.pkp_structure_main .card_doi { overflow-wrap: anywhere; }

/* ============================================================
   IMPRESSÃO
   O artigo impresso saía com menu, busca, barra lateral e rodapé.
   Regras de impressão usam !important por necessidade: precisam vencer
   as regras de tela, declaradas antes e com igual ou maior especificidade.
   ============================================================ */

@media print {
  .pkp_structure_head,
  .pkp_structure_footer_wrapper,
  .pkp_structure_sidebar,
  .pkp_block,
  .pkp_navigation_primary_row,
  .pkp_navigation_search_wrapper,
  .cmp_breadcrumbs,
  .cmp_back_link,
  .item.galleys,
  .obj_galley_link,
  button { display: none !important; }

  .pkp_structure_page,
  .pkp_structure_content,
  .pkp_structure_main {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }

  body {
    background: #fff !important;
    color: #000 !important;
    font-size: 11pt;
  }

  /* Endereço dos links, que no papel some junto com o hipertexto. */
  .pkp_structure_main a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 85%;
    word-break: break-all;
  }

  h1, h2, h3, h4 { page-break-after: avoid; }
  p, blockquote, li { page-break-inside: avoid; }
  .obj_article_details .abstract { page-break-inside: auto; }
}

/* ============================================================
   PDF NO TOPO EM TELAS ESTREITAS
   ============================================================
   O bloco de galés mora dentro de .entry_details, que no celular fica DEPOIS
   do resumo e das referências — o leitor rolava a página inteira para achar o
   PDF.

   Mover só esse bloco para o topo, sem sobrescrever article_details.tpl, exige
   que ele e o resumo sejam irmãos no mesmo container flex. É o que
   `display: contents` faz: as duas colunas somem como caixas e seus filhos
   passam a ser filhos diretos de .row, onde `order` funciona.

   Preço disso: as colunas deixam de existir como caixas, e com elas some a
   borda que as separava. Devolvida abaixo, no próprio bloco de galés.

   Só abaixo de 768px, que é onde o tema padrão já empilha as colunas — acima
   disso elas ainda são floats lado a lado e mexer aqui quebraria o layout.
   ============================================================ */

@media (max-width: 767px) {
  article.obj_article_details div.row {
    display: flex;
    flex-direction: column;
  }

  article.obj_article_details div.row > div.main_entry,
  article.obj_article_details div.row > div.entry_details {
    display: contents;
  }

  /* :has(> .galleys_links) isola o bloco das galés PRINCIPAIS. O template tem
     um segundo .item.galleys para material suplementar, que deve continuar
     onde está. */
  article.obj_article_details .item.galleys:has(> .value.galleys_links) {
    order: -1;
    margin: 0 0 1.25rem;
    padding: 0 0 1.25rem;
    border-bottom: 2px solid var(--educon-azul);
  }

  /* O rótulo "Downloads"/"PDF" ganha peso, já que agora abre a página. */
  article.obj_article_details .item.galleys:has(> .value.galleys_links) .label {
    font-weight: 700;
  }
}

/* ============================================================
   BARRA DE EDIÇÃO (só para papéis editoriais)
   ============================================================
   Injetada pelo gancho Templates::Article::Main, que fica DEPOIS do resumo,
   dentro de .main_entry. Trazê-la ao topo por posicionamento absoluto evita
   sobrescrever article_details.tpl — a página mais importante do site, que
   deixaria de receber as melhorias do PKP nas atualizações.

   O fluxo do documento não é alterado: nada é reordenado, nada vira flex.
   O <article> ganha um espaço no topo só quando a barra existe, via :has().
   ============================================================ */

article.obj_article_details { position: relative; }

article.obj_article_details:has(.educon-barra-editor) { padding-top: 3.25rem; }

.educon-barra-editor {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.4rem 0.75rem;
  background: var(--educon-azul);
  border-radius: 0 0 var(--educon-radius) var(--educon-radius);
  z-index: 2;
}

.educon-barra-editor-rotulo {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #ffffff;
}

.educon-barra-editor-botao {
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1;
  padding: 0.4rem 0.85rem;
  color: var(--educon-azul);
  background: #ffffff;
  border-radius: var(--educon-radius);
  text-decoration: none;
  white-space: nowrap;
}

.educon-barra-editor-botao:hover,
.educon-barra-editor-botao:focus-visible {
  background: #f0f5fc;
  text-decoration: underline;
}

/* No celular a barra sai do canto e vira uma faixa no fluxo, para não cobrir
   o título nem disputar espaço com ele. */
@media (max-width: 767px) {
  article.obj_article_details:has(.educon-barra-editor) { padding-top: 0; }

  .educon-barra-editor {
    position: static;
    justify-content: space-between;
    margin: 0 0 1.25rem;
    border-radius: var(--educon-radius);
  }
}

/* ============================================================
   PÁGINA DA EQUIPE EDITORIAL
   ============================================================
   Cada membro é um cartão com papel, nome, vínculo e identificadores
   persistentes. O bloco de identificadores fica ancorado no rodapé do cartão
   (margin-top:auto) para que cartões de alturas diferentes alinhem embaixo.

   Os cartões são grid auto-fit: uma coluna no celular, duas ou três conforme
   a largura, sem ponto de quebra fixo.
   ============================================================ */

.educon-equipe { max-width: 1000px; margin: 0 auto; }

.educon-equipe > section + section { margin-top: 2.75rem; }

.educon-equipe h2 {
  margin: 0 0 0.9rem;
  padding-bottom: 0.55rem;
  border-bottom: 3px solid var(--educon-azul);
  color: var(--educon-azul);
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* O que cada instância faz — transparência de governança, que o DOAJ e os
   indexadores procuram. Ocupa a linha inteira acima dos cartões. */
.educon-bloco-funcao {
  grid-column: 1 / -1;
  margin: 0 0 1.4rem;
  color: var(--educon-muted);
  font-size: 0.88rem;
  line-height: 1.7;
  text-align: left;
}
.educon-bloco-funcao strong { color: var(--educon-ink); font-weight: 600; }

.educon-membros {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr));
  gap: 1rem;
  align-items: stretch;
}

.educon-membro {
  display: flex;
  flex-direction: column;
  padding: 1.1rem 1.2rem;
  border: 1px solid var(--educon-borda);
  border-top: 3px solid var(--educon-card-borda);
  border-radius: var(--educon-radius);
  background: #ffffff;
}

.educon-membro-papel {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--educon-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.educon-membro-nome {
  margin: 0 0 0.3rem;
  color: var(--educon-ink);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
}

.educon-membro-vinculo {
  margin: 0;
  color: var(--educon-muted);
  font-size: 0.9rem;
  line-height: 1.5;
}

/* Ancorado no rodapé do cartão para alinhar entre cartões de alturas diferentes. */
.educon-membro-ids {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0;
  margin-top: auto;
  padding-top: 0.8rem;
}

.educon-membro-ids a {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.6rem;
  border-radius: 999px;
  background: #eef3fa;
  color: var(--educon-azul);
  font-size: 0.74rem;
  font-weight: 600;
  text-decoration: none;
}
.educon-membro-ids a:hover,
.educon-membro-ids a:focus-visible {
  background: var(--educon-azul);
  color: #ffffff;
  text-decoration: none;
}

/* Editor falecido: faixa lateral discreta, sem tirá-lo do fluxo. */
.educon-membro--memoriam { border-top-color: var(--educon-muted); }

/* Bloco operacional: cinza, para não se confundir com o corpo editorial. */
.educon-equipe--operacional h2 { border-bottom-color: #6c757d; color: #495057; }
.educon-equipe--operacional .educon-membro { border-top-color: #ced4da; }
.educon-equipe--operacional .educon-membro-nome { font-size: 0.95rem; font-weight: 600; }