/* * === INICIO: CÓDIGO CSS PARA OJS 3 (ARS MEDICA) ===
* Diseñador: Diseñador arsmedica
* Basado en lineamientos UC (lineamientos.json)
* Logo: Blanco (logo-uc-06.svg)
*/
/* --- 1. Contenedor Principal de Cabecera --- */
/* Clases OJS: .pkp_structure_head o header[role="banner"] */
.pkp_structure_head,
header[role="banner"] {
background-color: #0176DE; /* Color Primario: Celeste */
color: #FFFFFF; /* Texto Blanco (Contraste WCAG 4.52) */
padding: 1.5rem 2rem; /* Espaciado interno */
border-bottom: none; /* Quitamos bordes por defecto */
/* Usamos la tipografía base definida */
font-family: 'Roboto', sans-serif;
}
/* --- 2. Wrapper Interno (Alineación) --- */
/* Clase OJS: .pkp_head_wrapper */
.pkp_structure_head .pkp_head_wrapper {
display: flex;
flex-wrap: wrap; /* Permite que los elementos se reordenen en móvil */
align-items: center; /* Centrado vertical */
justify-content: space-between; /* Espacio entre logo e info */
max-width: 1200px; /* Ancho máximo de contenido */
margin: 0 auto; /* Centrado de página */
}
/* --- 3. Logo Institucional --- */
/* Clase OJS: .navbar-brand */
.pkp_structure_head .navbar-brand {
padding: 0;
margin-right: 2rem; /* Separación del texto */
display: block; /* Asegurar bloque */
}
/* OJS inserta la ![]()
aquí si se sube por la interfaz */
.pkp_structure_head .navbar-brand img {
max-height: 65px; /* Altura controlada del logo */
width: auto; /* Ancho automático */
}
/* --- 4. Identidad de la Revista (Título y Metadatos) --- */
/* Clase OJS: .pkp_site_name h1 */
.pkp_structure_head .pkp_site_name {
/* Flex-grow para que ocupe el espacio restante si es necesario */
flex: 1;
}
.pkp_structure_head .pkp_site_name h1 {
font-size: 1.8rem; /* Tamaño robusto para el H1 */
font-weight: 700; /* Negrita */
line-height: 1.2;
color: #FFFFFF;
margin: 0;
padding: 0;
}
/* * Añadimos los metadatos (ISSN/DOI) usando CSS pseudo-elementos
* sobre el H1. Esto es más limpio en OJS que editar plantillas.
*/
.pkp_structure_head .pkp_site_name h1::after {
content: "E-lSSN: 0719-1855 (en línea) \A DOI: 10.11565/ARSMED"; /* \A crea el salto de línea */
display: block;
font-size: 0.9rem;
font-weight: 400; /* Peso normal */
line-height: 1.5;
white-space: pre; /* Respeta el salto de línea de 'content' */
opacity: 0.9; /* Jerarquía visual sutil */
margin-top: 0.5rem;
}
/* --- 5. Adaptabilidad (Responsive) --- */
@media (max-width: 991px) {
.pkp_structure_head .pkp_head_wrapper {
flex-direction: column; /* Apilamos logo y texto */
align-items: flex-start; /* Alineamos todo a la izquierda */
}
.pkp_structure_head .navbar-brand {
margin-bottom: 1rem; /* Separación entre logo y texto */
}
.pkp_structure_head .pkp_site_name h1 {
font-size: 1.5rem; /* Título ligeramente más pequeño */
text-align: left;
}
}
@media (max-width: 576px) {
.pkp_structure_head {
padding: 1rem; /* Menos padding en móviles */
}
.pkp_structure_head .pkp_site_name h1 {
font-size: 1.3rem; /* Título más compacto */
}
.pkp_structure_head .pkp_site_name h1::after {
font-size: 0.85rem; /* Metadatos más compactos */
}
}
/* === FIN: CÓDIGO CSS PARA OJS 3 === */
