/* ===================================================
   CÓDIGO V8 - CABECERA FLUIDA + ARCHIVOS PERFECTOS
   =================================================== */

/* --- 1. CABECERA (BANNER FLUIDO) --- */
/* Esta configuración se adapta a la imagen que subas, sea del tamaño que sea */

.pkp_structure_page > header,
header.pkp_structure_head,
.pkp_head_wrapper {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    /* ESTO ES NUEVO: Evita que si la imagen es muy grande genere barras de desplazamiento */
}

/* El contenedor del enlace */
.pkp_site_name_wrapper a,
header .pkp_site_name a {
     display: block !important;
     width: 100% !important;
     opacity: 1 !important;
     line-height: 0 !important; /* Elimina espacios fantasma debajo de la imagen */
}

/* LA IMAGEN */
.pkp_site_name_wrapper img,
header .pkp_site_name img,
.pkp_head_wrapper img {
    /* Ocupa todo el ancho */
    width: 100% !important;
    
    /* Altura automática: Respeta la proporción de tu diseño original */
    height: auto !important;
    
    /* LÍMITE DE SEGURIDAD: Nunca ocupes más del 40% de la altura de la pantalla */
    /* Así evitamos que se vea "más grande que el espacio" */
    max-height: 50vh !important; 
    
    /* Ajuste visual */
    object-fit: cover !important; /* Rellena sin deformar */
    object-position: center center !important; /* Centra la imagen */
    display: block !important;
    max-width: none !important;
}

/* Ocultar texto duplicado */
header h1.pkp_site_name:not(:has(img)) {
    display: none !important;
}


/* --- 2. PORTADA INICIAL (HOME) --- */
.homepage-image, 
.obj_issue_toc .cover {
    width: 100% !important;
    text-align: center;
    margin-bottom: 20px;
}

.homepage-image img, 
.obj_issue_toc .cover img {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 600px; 
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    display: inline-block;
}


/* --- 3. ARCHIVOS (COPIA EXACTA DE V6 - LA PERFECTA) --- */
/* No hemos tocado ni una coma de esta sección que ya funcionaba bien */

.page_issue_archive .issues_archive,
.page_issue_archive ul.issues_media_list,
div.issues_archive {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important; 
    gap: 30px !important;
    padding: 0 !important;
    margin-top: 30px !important;
    list-style-type: none !important;
}

.page_issue_archive .issue-summary,
.page_issue_archive .obj_issue_summary {
    background-color: #fff;
    padding: 10px !important;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    height: 100% !important;
    display: flex;
    flex-direction: column;
    align-items: center; 
}

.page_issue_archive .cover,
.obj_issue_summary .cover,
.page_issue_archive .cover a {
    height: auto !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center;
    margin-bottom: 15px;
}

.page_issue_archive .cover img,
.obj_issue_summary .cover img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important; 
    max-width: 100% !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
}


/* ==========================================================
   AGREGADOS Q1 (ÍNDICE, FOOTER Y MINIATURAS) - OJS 3.3
   ========================================================== */

/* --- 1. SECCIONES DEL ÍNDICE (MINIMALISTA ROJO CEREZO) --- */
body .obj_issue_toc h3, 
body .issue_toc h3,
body .cmp_issue_toc h3,
body .sections h3,
body .issue-toc h3 {
    color: #8b0000 !important; 
    font-size: 0.85em !important; 
    font-weight: 800 !important; 
    text-transform: uppercase !important; 
    letter-spacing: 2px !important; 
    margin-top: 45px !important; 
    margin-bottom: 20px !important; 
    background: transparent !important; 
    border: none !important;
}

/* --- 2. PIE DE PÁGINA (ESTILO PLOS/LANCET) --- */
body .pkp_structure_footer_wrapper {
    background-color: #ffffff !important;
    color: #4a4a4a !important; 
    font-size: 0.8em !important; 
    border-top: 2px solid #8b0000 !important; 
}

body .pkp_structure_footer_wrapper a {
    color: #8b0000 !important; 
    text-decoration: none !important;
}

body .pkp_structure_footer_wrapper a:hover {
    text-decoration: underline !important;
}

body .pkp_brand_footer {
    display: none !important;
}

/* --- 3. MINIATURAS DE ARTÍCULOS (GRAPHICAL ABSTRACTS) - VERSIÓN ABSOLUTA --- */

/* Preparamos la caja del artículo para que deje un espacio libre a la derecha */
body .obj_article_summary {
    position: relative !important; 
    padding-right: 160px !important; /* Crea una "columna invisible" a la derecha */
    min-height: 120px !important; /* Asegura que la caja no sea más baja que la foto */
}

/* Clavamos la imagen en ese espacio vacío, sin tocar los textos */
body .obj_article_summary .cover {
    position: absolute !important; 
    top: 0 !important; 
    right: 0 !important; 
    width: 140px !important; 
    margin: 0 !important; 
    float: none !important; /* Quitamos el flotado conflictivo */
}

/* Estilo de la imagen (mantiene la proporción rectangular) */
body .obj_article_summary .cover img {
    max-width: 100% !important; 
    height: auto !important; 
    border: 1px solid #e0e0e0 !important; 
    border-radius: 4px !important; 
}