/* ============================================================================
   JOTMI — Página de artículo: layout 3:1 sin barra lateral + encabezado editorial
   OJS 3.3.0.22 · tema "Default"

   Subir en:  Configuración > Sitio web > Apariencia > pestaña "Avanzado"
              campo "Hoja de estilo de la revista"  (REEMPLAZA la hoja anterior).
   Acento configurable en una sola línea: --jot-accent.
   Orden de bloques: título · autores · DOI · ABSTRACT (panel) · KEYWORDS (pastillas).
   Todo acotado a body.pkp_page_article (el home y el resto del sitio no se tocan).
   ============================================================================ */

:root { --jot-accent: #006798; }   /* <- cambia aquí el color de marca si quieres */

/* ---------- A. LAYOUT: quitar barra lateral · artículo 3 / metadatos 1 ---------- */
.pkp_page_article .pkp_structure_sidebar { display: none; }

@media (min-width: 992px) {
    .pkp_page_article .pkp_structure_main {
        float: none; width: auto; margin-top: 2.857rem;
    }
    .pkp_page_article .pkp_structure_main::before { left: 0; }
    .pkp_page_article .pkp_structure_main::after  { left: auto; right: 0; }

    .pkp_page_article .obj_article_details .main_entry    { width: 75%; }
    .pkp_page_article .obj_article_details .entry_details { width: 25%; }
}

/* ---------- B. ENCABEZADO EDITORIAL (columna del artículo) ---------- */

/* Filete superior del bloque fuera: lo sustituye la regla de acento del título */
.pkp_page_article .obj_article_details .row { border-top: none; }

/* Título con regla de acento */
.pkp_page_article .obj_article_details > .page_title {
    font-size: 1.8rem;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0 0 1.2rem;
    padding-bottom: 0.8rem;
    border-bottom: 3px solid var(--jot-accent);
}

/* Autores: nombre marcado, afiliación atenuada, ORCID discreto */
.pkp_page_article .authors .name        { font-size: 1.05rem; font-weight: 600; }
.pkp_page_article .authors .affiliation { font-size: 0.93rem; color: rgba(0,0,0,0.5); }
.pkp_page_article .authors .orcid       { font-size: 0.78rem; }
.pkp_page_article .authors .orcid a     { color: rgba(0,0,0,0.45); }

/* Etiquetas de sección (DOI / Keywords) en versalitas atenuadas, en bloque */
.pkp_page_article .item.doi > .label,
.pkp_page_article .item.keywords > .label {
    display: block;
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: rgba(0,0,0,0.4);
    margin: 0 0 0.55rem;
}
.pkp_page_article .item.doi a       { color: var(--jot-accent); text-decoration: none; }
.pkp_page_article .item.doi a:hover { text-decoration: underline; }

/* Abstract en panel: fondo muy claro + filete de acento + medida de lectura */
.pkp_page_article .item.abstract {
    /* sin max-width: el panel llena todo el ancho de la columna (75%).
       Si las líneas te quedan demasiado largas, añade p.ej. max-width: 60rem; */
    border-left: 3px solid var(--jot-accent);
    background: #f6fafb;
    background: color-mix(in srgb, var(--jot-accent) 5%, #fff);
    padding: 1.4rem 1.6rem;
}
.pkp_page_article .item.abstract > .label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--jot-accent);
    margin: 0 0 0.7rem;
}
.pkp_page_article .item.abstract p {
    line-height: 1.78;
    color: rgba(0,0,0,0.8);
}

/* Keywords como pastillas (necesita el micro-edit de plantilla; ver mensaje).
   Tintes derivados del acento con color-mix; el valor sólido es el fallback. */
.pkp_page_article .item.keywords .value .kw {
    display: inline-block;
    font-size: 0.82rem;
    line-height: 1;
    padding: 6px 11px;
    margin: 0 7px 7px 0;
    border-radius: 999px;
    text-decoration: none;
    background: #eaf2f6;
    background: color-mix(in srgb, var(--jot-accent) 9%, #fff);
    color: #024c6f;
    color: color-mix(in srgb, var(--jot-accent) 78%, #000);
    border: 1px solid #cfe1ea;
    border-color: color-mix(in srgb, var(--jot-accent) 22%, #fff);
}
.pkp_page_article .item.keywords .value .kw:hover {
    background: #dceaf1;
    background: color-mix(in srgb, var(--jot-accent) 16%, #fff);
}

/* ---------- C. KEYWORDS DEBAJO DEL ABSTRACT ----------
   Camino 1 (recomendado): mover la <section class="item keywords"> a justo
   DESPUÉS de la <section class="item abstract"> en la plantilla del tema hijo
   (orden correcto también en el DOM = mejor accesibilidad/SEO).
   Camino 2 (solo CSS, sin mover el bloque): DESCOMENTA esto.
   -----------------------------------------------------
.pkp_page_article .main_entry { display: flex; flex-direction: column; }
.pkp_page_article .main_entry > .item.abstract    { order: 1; }
.pkp_page_article .main_entry > .item.keywords    { order: 2; }
.pkp_page_article .main_entry > .item.author_bios { order: 3; }
.pkp_page_article .main_entry > .item.references  { order: 4; }
----------------------------------------------------- */

/* ============================================================================
   D. FONDO DE PÁGINA — gris muy suave en los márgenes + contenido en hoja blanca
      *** GLOBAL: aplica a TODO el sitio (portada, listados, artículos…),
      no va acotado a .pkp_page_article. ***
      El header conserva su banda propia y el footer su gris; solo cambian
      los márgenes laterales y el lienzo del contenido.
   ============================================================================ */
body { background: #f8fafc; }                 /* gris frío muy claro (cool), discreto, en los márgenes */
.pkp_structure_content { background: #fff; }  /* el contenido se mantiene en blanco */

/* ============================================================================
   E. SUMARIO / TABLA DE CONTENIDOS — más elegante y legible
      Aplica a .obj_issue_toc → portada (bloque "Current Issue") y página del número.
      100% CSS, sin tocar plantilla. Hereda --jot-accent.
   ============================================================================ */

/* Encabezado de sección: acento + versalitas + barra-marcador + filete */
.obj_issue_toc .section:before { display: none; }   /* quita la línea del tema a través del título */
.obj_issue_toc .section  { margin: 0 0 2.5rem; padding: 0; }
.obj_issue_toc .sections:not(:first-child) { margin-top: 0; }
.obj_issue_toc .articles { margin-top: 0; }

.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3 {
    display: flex;
    align-items: center;
    gap: 11px;
    position: static;
    left: auto;
    margin: 0 0 0.4rem;
    padding: 0 0 0.7rem;
    background: transparent;
    border-bottom: 2px solid #e8edf0;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--jot-accent);
}
.obj_issue_toc .section > h2::before,
.obj_issue_toc .section > h3::before {
    content: "";
    width: 20px;
    height: 3px;
    border-radius: 2px;
    background: var(--jot-accent);
    flex: none;
}

/* Cada artículo: fila con divisor + resaltado al pasar el cursor */
.obj_issue_toc .articles > li { margin-bottom: 0; }
.obj_issue_toc .obj_article_summary {
    position: relative;
    padding: 0.95rem 1rem;
    border-bottom: 1px solid #edf0f2;
    border-left: 3px solid transparent;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.obj_issue_toc .articles > li:last-child .obj_article_summary { border-bottom: none; }
.obj_issue_toc .obj_article_summary:hover {
    background: #f2f7fa;
    background: color-mix(in srgb, var(--jot-accent) 5%, #fff);
    border-left-color: var(--jot-accent);
}

/* Título del artículo */
.obj_issue_toc .obj_article_summary > .title {
    font-size: 1.1rem;
    line-height: 1.3;
    font-weight: 700;
    padding-right: 4.5em;            /* sitio para la pastilla de páginas */
}
.obj_issue_toc .obj_article_summary > .title a { color: var(--jot-accent); }
.obj_issue_toc .obj_article_summary:hover > .title a { text-decoration: underline; }

/* Autores */
.obj_issue_toc .obj_article_summary .meta { position: static; }
.obj_issue_toc .obj_article_summary .meta .authors {
    padding-right: 0;
    font-size: 0.9rem;
    color: rgba(0,0,0,0.55);
}

/* Número de página en pastilla (arriba a la derecha de la fila) */
.obj_issue_toc .obj_article_summary .meta .pages {
    position: absolute;
    top: 0.95rem;
    right: 1rem;
    font-size: 0.72rem;
    line-height: 1.4;
    padding: 2px 9px;
    border-radius: 999px;
    background: #eef3f5;
    background: color-mix(in srgb, var(--jot-accent) 7%, #fff);
    color: #3f5a66;
    color: color-mix(in srgb, var(--jot-accent) 72%, #000);
    border: 1px solid #e1e8eb;
    border-color: color-mix(in srgb, var(--jot-accent) 18%, #fff);
}

/* Botón(es) de galerada: contorno de acento que se rellena al hover */
.obj_issue_toc .galleys_links { margin-top: 0.7rem; }
.obj_issue_toc .obj_galley_link,
.obj_issue_toc .obj_galley_link_supplementary {
    color: var(--jot-accent);
    border-color: #b9d3df;
    border-color: color-mix(in srgb, var(--jot-accent) 38%, #fff);
}
.obj_issue_toc .obj_galley_link:hover,
.obj_issue_toc .obj_galley_link:focus,
.obj_issue_toc .obj_galley_link_supplementary:hover,
.obj_issue_toc .obj_galley_link_supplementary:focus {
    background: var(--jot-accent);
    border-color: var(--jot-accent);
    color: #fff;
}